H5接口对接

hejianhao

3 天以前 554f8096e1f384f14b9424f5142d63f90c72a3eb

 H5/pages/work-detail/work-detail.vue

@@ -5,7 +5,7 @@
      <view class="allContent">
         <view class="topStatus">
            <view class="status">
               {{ ['正在办理', '延期办理', '超时办理', '已办结 ', '群众撤销', '上报待审核', '上级驳回', '延期待审核'][orderInfo.status] || '' }}
               {{ ['正在办理', '延期办理', '超时办理', '已办结 ', '群众撤销', '上报待审核', '上级驳回', '延期待审核', '已办结'][orderInfo.status] || '' }}
            </view>
            <view class="flex a-center j-between mb-17">
               <view class="tit">当前状态</view>
@@ -58,7 +58,11 @@
                  </view>
                  <view class="flex j-between">
                     <view class="label">联系电话</view>
                     <view class="value">{{ orderInfo.auditorPhone || '' }}</view>
                     <view class="flex a-center">
                        <view class="value">{{ orderInfo.auditorPhone || '' }}</view>
                        <image @click.stop="callPhone(orderInfo.contactNumber)" src="../../static/tell.png"
                           class="w-58 h-58 shrink0 " />
                     </view>
                  </view>
                  <view class="flex j-between">
                     <view class="label">驳回原因</view>
@@ -78,9 +82,13 @@
                  </view>
                  <view class="flex j-between">
                     <view class="label">联系电话</view>
                     <view class="value">{{ orderInfo.contactNumber || '' }}</view>
                     <view class="flex a-center">
                        <view class="value">{{ orderInfo.reporterPhone || '' }}</view>
                        <image @click.stop="callPhone(orderInfo.contactNumber)" src="../../static/tell.png"
                           class="w-58 h-58 shrink0 " />
                     </view>
                  </view>
                  <view class="flex j-between" v-if="!isParty">
                  <view class="flex j-between" v-if="isParty">
                     <view class="label">所属部门</view>
                     <view class="value">{{ orderInfo.departmentName || "" }}</view>
                  </view>
@@ -100,7 +108,8 @@
         <view class="cardInfo">
            <view class="flex j-between a-center">
               <view class="title">诉求号：{{ orderInfo.serialNumber || '' }}</view>
               <view class="flex a-center" v-if="orderInfo.status == 0&&userInfo.accountLevel != 1"
               <view class="flex a-center"
                  v-if="(orderInfo.status == 0||orderInfo.status == 6)&&orderInfo.listControlsButtonStatus == 0"
                  @click.stop="applyOverTime">
                  <view class="apply">延期申请</view>
                  <image src="../../static/detailImg/right.png" class="rightIcon shrink0"></image>
@@ -124,7 +133,11 @@
            </view>
            <view class="flex j-between">
               <view class="label"> 联系电话</view>
               <view class="value">{{ orderInfo.contactNumber || "" }}</view>
               <view class="flex a-center">
                  <view class="value">{{ orderInfo.contactNumber || '' }}</view>
                  <image @click.stop="callPhone(orderInfo.contactNumber)" src="../../static/tell.png"
                     class="w-58 h-58 shrink0 " />
               </view>
            </view>
            <view class="flex j-between">
               <view class="label">详细地址</view>
@@ -134,11 +147,15 @@
            <view v-if="!isParty">
               <view class="flex j-between">
                  <view class="label">录入人</view>
                  <view class="value">{{ orderInfo.nickname || '' }}</view>
                  <view class="value">{{ orderInfo.reportUserName || '' }}</view>
               </view>
               <view class="flex j-between">
                  <view class="label">录入人联系方式</view>
                  <view class="value">{{ orderInfo.contactNumber || '' }}</view>
                  <view class="flex a-center">
                     <view class="value">{{ orderInfo.reportUserPhone || '' }}</view>
                     <image @click.stop="callPhone(orderInfo.reportUserPhone)" src="../../static/tell.png"
                        class="w-58 h-58 shrink0 " />
                  </view>
               </view>
            </view>

@@ -148,6 +165,14 @@
         <!-- 问题描述 -->
         <view class="problem">
            <view class="title">问题描述</view>
            <view v-for="(item,index) in getVoiceFile(orderInfo.voiceFile)" :key="index"
               class="flex a-center j-between py-17 px-19 br-8 bgcolor1 mb-19">
               <view class="fs-27 lh-38">语音名字{{(index + 1) | numToWords}}</view>
               <image v-if="!playFlag" @click.stop="playRecording(item)" src="../../static/24gf-playCircle@2x.png"
                  class="w-27 h-27 shrink0" />
               <image v-else @click.stop="pausePlaying" src="../../static/pausePlaying.png"
                  class="w-27 h-27 shrink0" />
            </view>
            <view class="desc">
               <!-- <view class="top">{{ orderInfo.descriptionTitle || "" }}</view> -->
               <!-- <view class="line1"></view> -->
@@ -188,12 +213,16 @@
            <view class="topInfo">
               <view class="flex a-center j-between mb-15">
                  <view class="flex a-center">
                     <view class="name">办结人员：</view>
                     <view class="name shrink0">办结人员：</view>
                     <view class="value">{{ orderInfo.completionUsername || '' }}</view>
                  </view>
                  <view class="flex a-center">
                     <view class="name">联系电话：</view>
                     <view class="value">{{ orderInfo.completionUserPhone || '' }}</view>
                     <view class="name shrink0">联系电话：</view>
                     <view class="flex a-center">
                        <view class="value">{{ orderInfo.completionUserPhone || '' }}</view>
                        <image @click.stop="callPhone(orderInfo.completionUserPhone)"
                           src="../../static/tell.png" class="w-58 h-58 shrink0 " />
                     </view>
                  </view>
               </view>
               <view class="flex a-center">
@@ -206,7 +235,7 @@
            </view>
            <view class="title">描述图片</view>
            <view class="descPic" v-if="resultImg.length > 0">
               <view class="picItem" v-for="(item, index) in resultImg" @click.stop="viewImage(item)">
               <view class="picItem" v-for="(item, index) in resultImg" @click.stop="viewImage(item)" :key="index">
                  <image :src="item" class="img shrink0" mode="aspectFill">
                  </image>
               </view>
@@ -214,7 +243,7 @@
            <view v-else class="noData">暂无数据</view>
            <view class="title">描述视频</view>
            <view class="descPic" v-if="resultVideos.length > 0">
               <view class="picItem relative" v-for="(item, index) in resultVideos">
               <view class="picItem relative" v-for="(item, index) in resultVideos" :key="index">
                  <video id="myVideo" class="videoImg shrink0" disabled :controls="false"
                     :show-center-play-btn="false" :src="item">
                  </video>
@@ -227,7 +256,7 @@
            <view v-else class="noData">暂无数据</view>
         </view>

         <!-- 详情/办理进度 --正在办理-延期-超时  显示-->
         <!-- 详情/办理进度 -正在办理-延期-超时  显示-->
         <view class="progress" v-if="[0, 1, 2].includes(orderInfo.status) && progressesList.length > 0">
            <view class="title">当前办理进度</view>
            <view class="proCard">
@@ -266,7 +295,7 @@
            </view>
         </view>

         <!-- 详情/诉求流转 --正在办理显示-->
         <!-- 详情/诉求流转 -正在办理显示-->
         <view class="careRequire" v-if="orderInfo.status == 0 && flowsList.length > 0">
            <view class="title">诉求流转</view>
            <view class="proCard">
@@ -301,8 +330,7 @@
      </view>

      <!-- 上级显示 -->
      <view class="btnButtom"
         v-if="[0, 1, 2, 6].includes(orderInfo.status) && !isParty && orderInfo.auditButtonStatus == 1">
      <view class="btnButtom" v-if="(!isParty)&&orderInfo.listControlsButtonStatus == 0">
         <view class="btnDown" @click.stop="toUp" v-if="userInfo.accountLevel > 1"
            :class="[2, 3].includes(userInfo.accountLevel) ? '' : 'partyUp'">问题上报</view>
         <view class="btnDown" @click.stop="toDown" v-if="userInfo.accountLevel < 4"
@@ -310,20 +338,30 @@
         <view class="btnAdd" @click="addProgress">添加办理进度</view>
         <view class="btnAdd" @click="resultEntery">办理结果录入</view>
      </view>
      <view class="btnButtom"
         v-if="[5, 7].includes(orderInfo.status) && !isParty && orderInfo.auditButtonStatus == 0">
      <view class="btnButtom" v-if="orderInfo.auditButtonStatus == 0">
         <view class="cancel" @click.stop="showPop = true">驳回</view>
         <view class="sure" @click.stop="submitReSolve">审核通过</view>
      </view>
      <!-- 上级显示 -->

      <!-- 党员显示 -->
      <view class="btnButtom" v-if="[0, 1, 2, 6].includes(orderInfo.status) && isParty">
      <view class="btnButtom" v-if=" isParty && orderInfo.listControlsButtonStatus == 0">
         <view class="btnDown partyUp" @click.stop="toUp">问题上报</view>
         <view class="btnAdd partyDown" @click="addProgress">添加办理进度</view>
         <view class="btnAdd partyDown" @click="resultEntery">办理结果录入</view>
      </view>
      <!-- 党员并且属于本人工单上报 -->
      <view class="btnButtom" v-if="isParty && orderInfo.status == 5 && !orderInfo.withdrawButtonStatus">
         <view class="btnAdd w100 txt-center" @click="revocation">撤回</view>
      </view>
      <!-- 党员显示 -->
      <!-- v-if="[3].includes(orderInfo.status)" -->
      <view class="btnButtom" v-if="orderInfo.evaluateButtonStatus == 0">
         <view class=" btnAdd evaluate" @click.stop="toEvaluate">评价</view>
      </view>
      <view class="btnButtom" v-if="orderInfo.status == 8">
         <view class=" btnAdd w100 txt-center" @click.stop="toDetailEvaluate">查看评价</view>
      </view>



@@ -340,6 +378,12 @@
            </view>
         </view>
      </u-popup>

      <CustomPopup ref="customPopup" :isOneBtn="true" @comfirm="comfirm">
         <view class="txt-center fs-31 lh-42 pt-44 pb-35 color5">
            确认撤回当前审批操作吗
         </view>
      </CustomPopup>
   </view>
</template>

@@ -349,8 +393,13 @@
      workOrderDetail,
      getUserInfo,
      reportAudit,
      delayAudit
      delayAudit,
      revoke
   } from './service.js'
   import {
      mapActions,
      mapState
   } from "vuex";
   export default {
      data() {
         return {
@@ -368,9 +417,12 @@

            scoreTopHeight: 0, //距离顶部多高

            userInfo: {}, //个人信息
            isParty: false, //这是党员
            userInfo: uni.getStorageSync('userInfo'), //个人信息
            isParty: false, //true 党员 false 管理员
         };
      },
      computed: {
         ...mapState(["playFlag"]),
      },
      onPageScroll(e) {
         this.scoreTopHeight = e.scrollTop
@@ -380,6 +432,18 @@
         formatTime(val) {
            if (!val) return ''
            return dayjs(val).format('YYYY-MM-DD HH:mm:ss')
         },
         numToWords(val) {
            const words = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十']
            // 处理 0-10
            if (val >= 0 && val <= 10) return words[val];
            // 处理 11-99
            if (val > 10 && val < 100) {
               const ten = Math.floor(val / 10);
               const unit = val % 10;
               return `${ten > 1 ? words[ten] : ''}十${unit > 0 ? words[unit] : ''}`;
            }
            return val; // 超过99返回原数字
         }
      },
      onShow() {
@@ -390,17 +454,45 @@
         if (params.id) {
            this.id = params.id
         }

         getUserInfo().then(res => {
            if (res.data == null || res.data.accountLevel == 5) {
               this.isParty = true
            }
            this.userInfo = {
               ...res.data
            }
         })
         this.isParty = uni.getStorageSync('userInfo').identity == 1 ? true : false
         // getUserInfo().then(res => {
         //    if (res.data == null || res.data.accountLevel == 5) {
         //       this.isParty = true
         //    }
         //    this.userInfo = {
         //       ...res.data
         //    }
         // })
      },
      methods: {
         ...mapActions(["playRecording", "pausePlaying"]),
         getVoiceFile(voiceFile) {
            if (!voiceFile || voiceFile.length == 0) return []
            return voiceFile.split(',')
         },
         callPhone(phoneNumber) {
            uni.makePhoneCall({
               phoneNumber
            });
         },
         // 确认撤回
         comfirm() {
            revoke({
               complaintId: this.id
            }).then(res => {
               this.$refs.customPopup.closePopup()
               uni.showToast({
                  title: '撤回成功',
                  icon: 'none',
                  mask: true,
               })
               this.getDetailInfo()
            })
         },
         // 撤回
         revocation() {
            this.$refs.customPopup.showPopup()
         },
         open() {},
         close() {},
         viewImage(item) {
@@ -552,6 +644,17 @@
               url: `/pages/dispatchWorkOrder/dispatchWorkOrder?id=${this.id}`
            })
         },
         // 去评价
         toEvaluate() {
            uni.navigateTo({
               url: `/pages/evaluate/evaluate?id=${this.id}`
            })
         },
         toDetailEvaluate() {
            uni.navigateTo({
               url: `/pages/evaluate/evaluate-detail?id=${this.id}`
            })
         },
         addProgress() {
            uni.navigateTo({
               url: `/pages/progress/progress?id=${this.id}`
@@ -582,6 +685,15 @@
</style>

<style lang="scss" scoped>
   .bgcolor1 {
      background: #FFF1F4;
      box-shadow: 0rpx 0rpx 27rpx 0rpx rgba(0, 0, 0, 0.1);
   }

   .color5 {
      color: #666160;
   }

   // 处理 u-popup 组件层级过高,将 uni.showToast 覆盖问题
   /deep/ .u-transition.u-fade-enter-to.u-fade-enter-active {
      z-index: 997 !important;
@@ -760,7 +872,7 @@
         .addressCard {
            margin: 33rpx 10rpx;
            padding: 33rpx 27rpx;
            background: linear-gradient( 270deg, rgba(255,241,0,0.5) 0%, rgba(255,249,172,0.25) 48%, rgba(255,255,255,0.2) 100%, #FFFFFF 100%);
            background: linear-gradient(270deg, rgba(255, 241, 0, 0.5) 0%, rgba(255, 249, 172, 0.25) 48%, rgba(255, 255, 255, 0.2) 100%, #FFFFFF 100%);
            border-radius: 19rpx;
            display: flex;
            justify-content: space-between;
@@ -1199,6 +1311,10 @@
         padding: 19rpx 25rpx 19rpx 25rpx !important;
      }

      .evaluate {
         padding: 19rpx 310rpx;
      }


   }