MrShi
2024-04-02 174350e855349919ee287a52d3198c7c7558b858
wx/pages/details_dispatch_unit/details_dispatch_unit.vue
@@ -1,88 +1,101 @@
<template>
   <view class="details">
      <view class="details_back" :style="{ background: returnStyle(0) }"></view>
      <template v-if="info">
         <view class="details_back" :style="{ background: returnStyle(info.status) }"></view>
      </template>
      <view class="box">
         <view class="box_info">
            <view class="box_info_head" :style="{ background: returnStyle1(0) }">
               <view class="box_info_head_left">
                  <text>大地意外保险</text>
                  <text>关联保单号:29102938988921</text>
            <template v-if="info">
               <view class="box_info_head" :style="{ background: returnStyle1(info.status) }">
                  <view class="box_info_head_left">
                     <text>{{info.solutionsName || ''}}</text>
                     <text>关联保单号:{{info.applyCode || ''}}</text>
                  </view>
                  <image v-if="info.status === 2" src="@/static/icon/progress_yishengxiao@2x.png" mode="widthFix"></image>
                  <image v-if="info.status === 1" src="@/static/icon/progress_daishenhe@2x.png" mode="widthFix"></image>
                  <image v-if="info.status === 0" src="@/static/icon/progress_daiqianshu@2x.png" mode="widthFix"></image>
                  <image v-if="info.status === 3 || info.status === 4" src="@/static/icon/progress_shenqingtuihui@2x.png" mode="widthFix"></image>
                  <image v-if="info.status === 5 || info.status === 8" src="@/static/icon/progress_yituihui@2x.png" mode="widthFix"></image>
                  <image v-if="info.status === 6" src="@/static/icon/progress_yiguanbi@2x.png" mode="widthFix"></image>
               </view>
               <image src="@/static/icon/progress_yishengxiao@2x.png" mode="widthFix"></image>
            </view>
            </template>
            <view class="box_info_center">
               <view class="box_info_center_x"></view>
            </view>
            <view class="box_info_list">
               <view class="box_info_list_item">
                  <view class="box_info_list_item_label">更换派遣单位人数:</view>
                  <view class="box_info_list_item_val">10人</view>
                  <view class="box_info_list_item_val">{{info.changeNum || 0}}人</view>
               </view>
               <view class="box_info_list_item">
                  <view class="box_info_list_item_label">批单号:</view>
                  <view class="box_info_list_item_val">32432310010394</view>
                  <view class="box_info_list_item_val">{{info.validCode || '-'}}</view>
               </view>
               <view class="box_info_list_item">
                  <view class="box_info_list_item_label">批单生效期:</view>
                  <view class="box_info_list_item_val">2024.01.01 00:00:00</view>
                  <view class="box_info_list_item_val">{{info.applyStartTime}}</view>
               </view>
            </view>
         </view>
         <view class="box_people">
            <view class="box_people_label">更换派遣单位人员名单</view>
            <view class="box_people_list">
               <view class="box_people_list_item" v-for="(item, index) in 3" :key="index">
               <view class="box_people_list_item" v-for="(item, index) in list" :key="index">
                  <view class="item_head">
                     <view class="item_head_top">
                        <text>张小平</text>
                        <text>男|23岁</text>
                        <text>{{item.memberName}}</text>
                        <text>{{item.sex == 0 ? '男' : '女'}}|{{item.age}}岁</text>
                     </view>
                     <view class="item_head_bottom">
                        身份证号: 342425199001119999
                        身份证号:{{item.memberIdcardNo}}
                     </view>
                  </view>
                  <view class="item_x"></view>
                  <view class="item_list">
                     <view class="item_list_item">
                        <view class="item_list_item_label">派遣单位:</view>
                        <view class="item_list_item_val">安徽省格力工程建设有限责任公司</view>
                        <view class="item_list_item_label">原派遣单位:</view>
                        <view class="item_list_item_val">{{item.oldDuName}}</view>
                     </view>
                     <view class="item_list_item">
                        <view class="item_list_item_label">所属工种:</view>
                        <view class="item_list_item_val">1类 安保及巡查人员</view>
                        <view class="item_list_item_label">原所属工种:</view>
                        <view class="item_list_item_val">{{item.oldWorkTypeName}}</view>
                     </view>
                     <view class="item_list_item">
                        <view class="item_list_item_label">更换后派遣单位:</view>
                        <view class="item_list_item_val">安徽省格力工程建设有限责任公司</view>
                        <view class="item_list_item_val">{{item.duName}}</view>
                     </view>
                     <view class="item_list_item">
                        <view class="item_list_item_label">更换后所属工种:</view>
                        <view class="item_list_item_val">1类 安保及巡查人员</view>
                        <view class="item_list_item_val">{{item.workTypeName}}</view>
                     </view>
                  </view>
               </view>
            </view>
         </view>
      </view>
      <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 100rpx);"></view>
      <!-- 已生效 -->
      <view class="details_footer">
         <u-button type="primary" shape="circle" color="#437CB3" :plain="true" text="查看申请单"></u-button>
         <view style="width: 44rpx; height: 50rpx;"></view>
         <u-button type="primary" shape="circle" color="#437CB3" :plain="true" text="查看批单"></u-button>
      </view>
      <!-- 待审核 | 待签署 -->
      <!-- <view class="details_footer">
         <u-button type="primary" shape="circle" color="#437CB3" :plain="true" text="申请退回"></u-button>
         <view style="width: 44rpx; height: 50rpx;"></view>
         <u-button type="primary" shape="circle" color="#437CB3" text="查看申请单"></u-button>
      </view> -->
      <!-- 已退回 -->
      <!-- <view class="details_footer">
         <u-button type="primary" shape="circle" color="#437CB3" @click="show2 = true" :plain="true" text="关闭订单"></u-button>
         <view style="width: 44rpx; height: 50rpx;"></view>
         <u-button type="primary" shape="circle" color="#437CB3" text="再次提交"></u-button>
      </view> -->
      <template v-if="info">
         <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 100rpx);" v-if="[2,1,0,5,8].includes(info.status)"></view>
      </template>
      <template v-if="info">
         <!-- 已生效 -->
         <view class="details_footer" v-if="info.status === 2">
            <u-button type="primary" shape="circle" color="#437CB3" :plain="true" text="查看申请单"></u-button>
            <view style="width: 44rpx; height: 50rpx;"></view>
            <u-button type="primary" shape="circle" color="#437CB3" :plain="true" text="查看批单"></u-button>
         </view>
         <!-- 待审核 | 待签署 -->
         <view class="details_footer" v-if="info.status === 1 || info.status === 0">
            <u-button type="primary" shape="circle" color="#437CB3" :plain="true" text="申请退回"></u-button>
            <view style="width: 44rpx; height: 50rpx;"></view>
            <u-button type="primary" shape="circle" color="#437CB3" text="查看申请单"></u-button>
         </view>
         <!-- 已退回 -->
         <view class="details_footer" v-if="info.status === 5 || info.status === 8">
            <u-button type="primary" shape="circle" color="#437CB3" @click="show2 = true" :plain="true" text="关闭订单"></u-button>
            <view style="width: 44rpx; height: 50rpx;"></view>
            <u-button type="primary" shape="circle" color="#437CB3" text="再次提交"></u-button>
         </view>
      </template>
      <!-- 申请退回确认弹窗 -->
      <u-modal :show="show" title="温馨提示" :showCancelButton="true" cancelText="我再想想" confirmColor="#437CB3" @cancel="cancel" @confirm="confirm">
         确认申请退回?
@@ -110,6 +123,11 @@
   export default {
      data() {
         return {
            id: null,
            info: null,
            page: 1,
            next: false,
            list: [],
            show: false,
            show1: false,
            show2: false,
@@ -120,7 +138,43 @@
            }]
         };
      },
      onLoad(option) {
         this.id = option.id
         this.getDetail()
      },
      onReachBottom() {
         this.getList()
      },
      methods: {
         getDetail() {
            this.$u.api.applyChangeById(this.id)
               .then(res => {
                  if (res.code === 200) {
                     this.info = res.data
                     this.getList()
                  }
               })
         },
         getList() {
            if (this.next) return
            this.$u.api.applyChagneDetailPage({
               capacity: 10,
               page: this.page,
               model: {
                  applyChangeId: this.info.id,
                  types:[2]
               }
            }).then(res => {
               if (res.code === 200) {
                  if (res.data.records.length > 0) {
                     this.page++
                     this.list.push(...res.data.records)
                  } else {
                     this.next = true
                  }
               }
            })
         },
         confirm() {
            this.show = false
         },
@@ -140,20 +194,20 @@
            this.show2 = false
         },
         returnStyle(type) {
            if ([0].includes(type)) {
            if ([2].includes(type)) {
               return 'linear-gradient(#97DDC5 0%, #F7F7F7 100%);'
            } else if ([1,2,3].includes(type)) {
            } else if ([1,0].includes(type)) {
               return 'linear-gradient( 180deg, #FBC88C 0%, #F7F7F7 100%);'
            } else if ([4,5,6,7].includes(type)) {
            } else if ([3,4,5,8,6].includes(type)) {
               return ''
            }
         },
         returnStyle1(type) {
            if ([0].includes(type)) {
            if ([2].includes(type)) {
               return 'linear-gradient( 180deg, #E5F7F1 0%, rgba(255,255,255,0) 100%)'
            } else if ([1,2,3].includes(type)) {
            } else if ([1,0].includes(type)) {
               return 'linear-gradient( 180deg, #FFF2E3 0%, rgba(255,255,255,0) 100%);'
            } else if ([4,5,6,7].includes(type)) {
            } else if ([3,4,5,8,6].includes(type)) {
               return '#ffffff'
            }
         }