吉安感知网项目-前端
shuishen
2026-02-03 89380e6260a75d1d3b94de687ebcc2f50d50659d
uniapps/work-app/src/subPackages/workDetail/index.vue
@@ -4,7 +4,8 @@
      <!-- 自定义导航栏 -->
      <u-navbar title="工单详情" :is-back="true" back-text="" :back-icon-size="40" @left-click="onBackClick">
         <template #right>
            <div class="share-btn" @click="onShareClick"></div>
        <div v-if="isH5" class="tapShare-icon"><img src="/static/images/work/share.svg"  @click="onShareClick"/></div>
            <div v-else class="share-btn" @click="onShareClick"></div>
         </template>
      </u-navbar>
      <div class="detailTop">
@@ -30,7 +31,7 @@
        <div class="workOrderContainer">
          <div class="orderRow">
            <div class="rowTitle">工单编号</div>
            <div>{{ workDetailData.eventCode }}</div>
            <div>{{ workDetailData.eventNum }}</div>
          </div>
          <div class="orderRow">
            <div class="rowTitle">工单处置人</div>
@@ -71,7 +72,7 @@
        <up-button type="primary" color="#1D6FE9" text="确认" @click="confirmTheTicket"></up-button>
      </div>
      <div class="btngroups" v-if="workDetailData.eventStatus === 3">
        <up-button type="primary" color="#1D6FE9" text="已确认" ></up-button>
        <up-button type="primary" color="#1D6FE9" text="已确认" @click="confirmedHandle"></up-button>
      </div>
    </div>
    <!-- 分享弹出层 -->
@@ -102,7 +103,6 @@
<script setup>
// import { getShowImg, getSmallImg } from '@/utils/util'
import { ref, computed } from 'vue'
import {getGddetailedData,backGdApi} from '/src/api/work/index.js'
import dayjs from 'dayjs'
const formatDate = dateString => {
@@ -111,9 +111,12 @@
const eventNum = ref('')
// 工单内容
const workDetailData = ref({})
// 环境判断
const isH5 = ref(false)
onLoad(async options => {
  eventNum.value = options.id
  await getDataList(options.id)
  checkEnvironment()
})
const getDataList = async val => {
  const params = {
@@ -122,6 +125,19 @@
  const res = await getGddetailedData(params)
  const response = res.data.data
  workDetailData.value = response
}
// 检查运行环境
const checkEnvironment = () => {
  const systemInfo = uni.getSystemInfoSync()
  // #ifdef APP-PLUS
  isH5.value = false
  // #endif
  // #ifdef H5
  isH5.value = true
  // #endif
  console.log('当前环境:', isH5.value ? 'H5' : 'App')
}
// 图片预览
const previewImage = index => {
@@ -139,10 +155,10 @@
    const smallUrl = detail.eventImageUrl
    imageArr.push(smallUrl)
  }
  if (detail.update_photo_url) {
    const smallUrl = detail.update_photo_url
    imageArr.push(smallUrl)
  }
  // if (detail.update_photo_url) {
  //   const smallUrl = detail.update_photo_url
  //   imageArr.push(smallUrl)
  // }
  return imageArr
})
// 跳转地图
@@ -180,6 +196,10 @@
      uni.navigateBack()
    })
  })
}
// 已确认
const confirmedHandle = () => {
  uni.navigateBack()
}
// 分享模态框状态
const showShareModal = ref(false)
@@ -257,7 +277,7 @@
         title: workDetailData.value.event_name || '工单详情',
         summary: '查看工单详情',
         href: 'https://example.com/workDetail?eventNum=' + workDetailData.value.event_num,
         imageUrl: workDetailData.value.photo_url,
         imageUrl: workDetailData.value.eventImageUrl,
         success: () => {
            uni.showToast({ title: '分享成功', icon: 'success' })
            onShareModalClose()
@@ -312,12 +332,22 @@
  }
}  // 分享按钮样式
  .share-btn {
    // #ifdef APP-PLUS
    width: 40rpx;
    height: 40rpx;
    background-image: url('/static/images/work/share.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    // #endif
  }
  .tapShare-icon {
    width: 40rpx;
    height: 40rpx;
    img {
      width: 40rpx;
      height: 40rpx;
    }
  }
  .detailTop {
  // #ifdef APP-PLUS