-

zhangwei

2024-08-29 447e19fa298ae11a1c3a3fa2d2ff3a1a8dba0501

 src/pages/checkin/workdetail.vue

@@ -1,22 +1,13 @@
<template>
   <view class="">
   <view class="c-p-b-150">
      <view class="coreshop-ff">
         <up-list>
            <up-list-item>
               <up-cell title="周先生">
                  <template #icon>
                     <up-avatar shape="square" size="35" src="https://uview-plus.jiangruyi.com/album/1.jpg"
                        customStyle="margin: -3px 5px -3px 0"></up-avatar>
                  </template>
               </up-cell>
            </up-list-item>
            <view class="c-p-20">
               <view class="chuany-flex chuany-justify-between chuany-flex-wrap">
                  <text class="chuany-font34 chuany-text-bold">
                     临时工
                  {{dakaList.orderName}}
                  </text>
                  <text class="">
                     日期：2024-08-12
                  日期：{{$util.formatDate(dakaList.workDate)}}
                  </text>
               </view>
            </view>
@@ -25,101 +16,124 @@
                  <text class="">
                     打卡记录：
                  </text>
                  <view class="chuany-flex chuany-justify-between c-p-t-20">
               <view class="chuany-flex chuany-justify-evenly chuany-flex-wrap c-p-t-20">
                     <view
                        class="chuany-flex chuany-flex-direction chuany-align-center textclo chuany-font24 step_item"
                        v-for="(item,index) in 4">
                        <up-avatar shape="square" size="38" src="https://uview-plus.jiangruyi.com/album/1.jpg"
                           @click="previewImage"></up-avatar>
                        <view class="line line-active" v-if="index!==3">

                        </view>
                        <up-icon name="checkmark-circle-fill" color="#2979ff" size="22"></up-icon>
                        <text>已打卡</text>
                        <text>10:00</text>
                     </view>

                  </view>

                     class="chuany-flex chuany-flex-direction chuany-align-center chuany-justify-around textclo chuany-font24 c-p-b-10 daka"
                     :key="index" v-for="(item,index) in dakaList.orderBiddingDetailCheck">
                     <up-avatar shape="square" size="56" :src="item.checkPhoto"
                        @click="previewImage(item.checkPhoto)"></up-avatar>
                     <view class="step_item">
                        <up-icon name="checkmark-circle-fill" :color="item.checktime?'#2979ff':'#e9e8e8'"
                           size="22"></up-icon>
                        <view class="line" :class="item.checkPhoto?'line-active':''"
                           v-if="index!==dakaList.length-1&&index%2==0">
               </view>
            </view>

            <view class="stepwit">
                     <text>{{item.checktime?'已打卡':'未打卡'}}</text>
                     <text
                        :class="$util.formatDate(item.checktime,true)=='-'?'core-opa':''">{{$util.formatDate(item.checktime,true)}}</text>
                  </view>
               </view>
            </view>
         </view>
         <up-cell title="工作时长" :border='false'>
            <template #right-icon>
               {{dakaList.workTime}} 小时
            </template>
         </up-cell>
         <up-cell title="方式" :border='false'>
            <template #right-icon>
               {{dakaList.workerTypeName}}
            </template>
         </up-cell>
         <up-cell title="工价" :border='false'>
            <template #right-icon>
               {{dakaList.workPrice}} {{dakaList.workerType==0?'元/小时':'元/件'}}
            </template>
         </up-cell>
         <up-cell title="数量" :border='false'  v-if="dakaList.workerType==1" >
            <template #right-icon>
               <up-input v-model="workCount" border="none" placeholder="请填写数量"></up-input>
            </template>
         </up-cell>
         <up-cell title="工资" :border='false'>
            <template #right-icon>
               {{dakaList.todaySalary}} 元
            </template>
         </up-cell>
         <!-- <view class="stepwit">
               <tem-steps></tem-steps>
            </view>
         </up-list>
         </view> -->
         <view class="tabbtns">
            <up-button color='#fece01' class="text-69" text="工资审核"></up-button>
            <up-button color='#fece01' class="text-69" text="工资申报" @click="saveDakaDetail"></up-button>
         </view>
      </view>
   </view>
</template>

<script setup>
   import {
      onLoad,
      onShow,
      onReachBottom,
      onPullDownRefresh
   } from "@dcloudio/uni-app";
   import {
      reactive,
      ref,
      getCurrentInstance
   } from 'vue';
   const {
      $upload,
      $api,
      $util,
      $db
   } = getCurrentInstance().appContext.config.globalProperties
   onLoad(() => {
      getDaka()
   })
   let state = reactive({
      currentIdex: 0
   })
   let dakaList = reactive([])
   let show = ref(true)
   const urls = ['https://uview-plus.jiangruyi.com/album/1.jpg']
   const list2 = reactive([{
      id: 1,
      time: '明天 19:00-23:00',
      name: '临时工',
      tags: ['4小时', '可无经验', '手脚麻利'],
      adress: '武侯区桂溪街道4.0km',
      yaoqiu: '不限',
      price: 50,
      peoplenum: 3,
      zhaodao: 1
   }]);
   const click = () => {

<script>
   export default {
      data() {
         return {
            orderBiddingDetailId: '',
            dakaList: {},
            workCount: '',
            confirmObj: {
               orderBiddingDetailId: '', //招工打卡Id
               workTime: '', //工作时长
               workCount: '', //计件数量
               todaySalary: '' //当日工资
   }
   const change = (e) => {
      state.currentIdex = e.index
   }
   const toDetail = (e) => {
      uni.navigateTo({
         url: '/pages/detail/detail'
      })
   }
   const previewImage = () => {
      },
      onLoad(options) {
         this.orderBiddingDetailId = options.id
         this.getDakaDetail(this.orderBiddingDetailId)
      },
      methods: {
         previewImage(url) {
      uni.previewImage({
         urls: ['https://uview-plus.jiangruyi.com/album/1.jpg']
               urls: [url]
      })
   }
   const getDaka = (id) => {
      $api.getDaka({
         orderId: id
         },
         getDakaDetail(id) {
            this.$api.getDakaDetail({
               orderBiddingDetailId: id
      }).then(res => {
         dakaList = res.data.orderBiddingDetailCheck
         dakaList.length = 3
         if (dakaList.length % 2 !== 0) {
            dakaList.push({})
               this.dakaList = res.data
               if (this.dakaList.orderBiddingDetailCheck.length == 0) {
                  this.dakaList.orderBiddingDetailCheck.length = 2
               }
               if (this.dakaList.orderBiddingDetailCheck.length > 6) {
                  this.dakaList.orderBiddingDetailCheck.length = 6
               }
               if (this.dakaList.orderBiddingDetailCheck.length % 2 !== 0) {
                  this.dakaList.orderBiddingDetailCheck.push({})
         }
         console.log(res, '打卡');
      })
         },
         saveDakaDetail() {
            if (dakaList.workerType == 1 && this.workCount) {
               this.$util.showToast({
                  title: '请填写数量！',
                  icon: 'error'
               })
               return
            }
            let obj = {
               orderBiddingDetailId: dakaList.orderBiddingDetailId, //招工打卡Id
               workTime: dakaList.workTime, //工作时长
               todaySalary: dakaList.todaySalary //当日工资
            }
            if (this.workCount) {
               obj.workCount = this.workCount
            }
            this.$api.saveDakaDetail(obj).then(res => {
               console.log(res, '----');
            })
         },
      }
   }
</script>

@@ -157,6 +171,13 @@
      margin: 0 auto
   }



   .daka {
      width: 260rpx;
      height: 230rpx;
   }

   .step_item {
      position: relative;
      /* width: 144rpx; */
@@ -164,16 +185,19 @@

      .line {
         position: absolute;
         top: 92rpx;
         left: 52rpx;
         top: 17rpx;
         left: 35rpx;
         content: "";
         height: 4rpx;
         width: 192rpx;

         width: 310rpx;
         background-color: #e9e8e8;
      }

      .line-active {
         background-color: #2979ff;
      }
   }
   .u-cell__body{
      padding: 6px 15px !important;
   }
</style>