zhangwei
2024-08-26 79745a1b12fa6d69edd3a353cb11b8ae02b8d4aa
src/pages/checkin/index.vue
@@ -2,127 +2,214 @@
   <view class="full-page">
      <up-sticky>
         <view class="coreshop-ff content c-p-10">
            <up-search placeholder="请点击选择日期" v-model="value15" search-icon="calendar"></up-search>
            <up-search placeholder="请点击选择日期" @clickIcon='clickIcon' v-model="wordDate" search-icon="calendar"
               @custom='PostMyComDakaListPage'></up-search>
         </view>
         <up-subsection :list="list" :current="current4" activeColor="#f9ae3d"
            @change="sectionChange"></up-subsection>
         <up-subsection :list="list" activeColor="#f9ae3d" @change="sectionChange"></up-subsection>
      </up-sticky>
      <view class="listrecord c-p-20">
         <view class="coreshop-ff chuany-bradius20">
            <view class="bgblue c-p-18 chuany-flex chuany-justify-between chuany-font34 chuany-text-bold">
               <text class=''>
                  日期:2024-08-12
               </text>
            </view>
            <view class="c-p-26">
               <view class="chuany-flex chuany-justify-between">
                  <text class="chuany-font34 chuany-text-bold">
                     临时工
      <view class="" v-if='viewList.lenght>0'>
         <view class="listrecord c-p-20" v-for="item in viewList" :key='item.id'>
            <view class="coreshop-ff chuany-bradius20">
               <view class="bgblue c-p-18 chuany-flex chuany-justify-between chuany-font34 chuany-text-bold">
                  <text class=''>
                     日期:{{item.workDate}}
                  </text>
               </view>
               <view class="c-p-26">
                  <view class="chuany-flex chuany-justify-between">
                     <!-- <text class="c-p-r-20">
                     </text> -->
                     <up-tag class='c-m-r-10' text="已结算" shape="circle" type="success" plain plainFill size='mini'></up-tag>
                     <up-tag text="已确认" shape="circle" type="success" plain plainFill size='mini'></up-tag>
                  </view>
               </view>
               <view class="c-p-t-20">
                  打卡记录:08:00-12:00 13:00-17:00
               </view>
               <view class="chuany-flex chuany-justify-between c-p-t-20">
                  <text class="chuany-width50">
                     工作时长:8小时
                  </text>
                  <view class="chuany-width50">
                     <text>
                        方式:计时
                     <text class="chuany-font34 chuany-text-bold">
                        {{item.orderName}}
                     </text>
                     <view class="chuany-flex chuany-justify-between">
                        <!-- <text class="c-p-r-20">
                        </text> -->
                        <up-tag class='c-m-r-10' :text="item.isShenPiName" shape="circle" type="success" plain plainFill
                           size='mini'></up-tag>
                        <!-- <up-tag text="已确认" shape="circle" type="success" plain plainFill size='mini'></up-tag> -->
                     </view>
                  </view>
               </view>
               <view class="chuany-flex chuany-justify-between c-p-t-20">
                  <text class="chuany-width50">
                     工价:17元/小时
                  </text>
                  <view class="chuany-width50">
                     <text>
                        当日工资:136元
                  <view class="c-p-t-20">
                     打卡记录:{{item.dakaMingxi}}
                  </view>
                  <view class="chuany-flex chuany-justify-between c-p-t-20">
                     <text class="chuany-width50">
                        工作时长:{{item.workTime}}
                     </text>
                     <view class="chuany-width50">
                        <text>
                           方式:{{item.workerTypeName}}
                        </text>
                     </view>
                  </view>
               </view>
            </view>
         </view>
      </view>
      <view class="listrecord c-p-20">
         <view class="coreshop-ff chuany-bradius20">
            <view class="bgblue c-p-18 chuany-flex chuany-justify-between chuany-font34 chuany-text-bold">
               <text class=''>
                  日期:2024-08-12
               </text>
            </view>
            <view class="c-p-26">
               <view class="chuany-flex chuany-justify-between">
                  <text class="chuany-font34 chuany-text-bold">
                     临时工
                  </text>
                  <view class="chuany-flex chuany-justify-between">
                     <!-- <text class="c-p-r-20">
                     </text> -->
                     <up-tag class='c-m-r-10' text="未结算" shape="circle" type="warning" plain plainFill size='mini'></up-tag>
                     <up-tag text="未确认" shape="circle" type="warning" plain plainFill size='mini'></up-tag>
                  </view>
               </view>
               <view class="c-p-t-20">
                  打卡记录:08:00-12:00 13:00-17:00
               </view>
               <!-- <view class="chuany-flex chuany-justify-between c-p-t-20">
               </view> -->
               <view class="chuany-flex chuany-justify-between chuany-flex-wrap c-p-t-20">
                  <text class="chuany-width50">
                     工作时长:8小时
                  </text>
                  <view class="chuany-width50">
                     <text>
                        方式:计件
                  <view class="chuany-flex chuany-justify-between c-p-t-20">
                     <text class="chuany-width50">
                        工价:{{item.workPrice}}{{item.workerType==0?'元/小时':'元/件'}}
                     </text>
                  </view>
                  <text class="chuany-width50 c-p-t-20">
                     工价:0.5元/件
                  </text>
                  <view class="chuany-width50 chuany-flex c-p-t-20">
                     <text>
                        数量:
                     </text>
                     <up-input style="padding: 0;" size='mini' border="surround"></up-input>
                  </view>
                  <view class="chuany-width50 c-p-t-20">
                     <text>
                        当日工资:136元
                     </text>
                  </view>
                  <view class="chuany-width50 c-p-t-20">
                     <view class="chuany-width10">
                        <up-button class="button-layout__item" text="工资申报" size="mini" type="warning"></up-button>
                     <view class="chuany-width50 chuany-flex c-p-t-20">
                        <text>
                           数量:
                        </text>
                        <up-input style="padding: 0;" size='mini' border="surround"></up-input>
                     </view>
                     <view class="chuany-width50">
                        <text>
                           当日工资:{{item.todaySalary}}元
                        </text>
                     </view>
                     <view class="chuany-width50 c-p-t-20">
                        <view class="chuany-width10">
                           <up-button class="button-layout__item" text="工资申报" size="mini"
                              type="warning"></up-button>
                        </view>
                     </view>
                  </view>
               </view>
            </view>
         </view>
         <view class="listrecord c-p-20">
            <view class="coreshop-ff chuany-bradius20">
               <view class="bgblue c-p-18 chuany-flex chuany-justify-between chuany-font34 chuany-text-bold">
                  <text class=''>
                     日期:2024-08-12
                  </text>
               </view>
               <view class="c-p-26">
                  <view class="chuany-flex chuany-justify-between">
                     <text class="chuany-font34 chuany-text-bold">
                        临时工
                     </text>
                     <view class="chuany-flex chuany-justify-between">
                        <!-- <text class="c-p-r-20">
                        </text> -->
                        <up-tag class='c-m-r-10' text="未结算" shape="circle" type="warning" plain plainFill
                           size='mini'></up-tag>
                        <up-tag text="未确认" shape="circle" type="warning" plain plainFill size='mini'></up-tag>
                     </view>
                  </view>
                  <view class="c-p-t-20">
                     打卡记录:08:00-12:00 13:00-17:00
                  </view>
                  <!-- <view class="chuany-flex chuany-justify-between c-p-t-20">
                  </view> -->
                  <view class="chuany-flex chuany-justify-between chuany-flex-wrap c-p-t-20">
                     <text class="chuany-width50">
                        工作时长:8小时
                     </text>
                     <view class="chuany-width50">
                        <text>
                           方式:计件
                        </text>
                     </view>
                     <text class="chuany-width50 c-p-t-20">
                        工价:0.5元/件
                     </text>
                     <view class="chuany-width50 chuany-flex c-p-t-20">
                        <text>
                           数量:
                        </text>
                        <up-input style="padding: 0;" size='mini' border="surround"></up-input>
                     </view>
                     <view class="chuany-width50 c-p-t-20">
                        <text>
                           当日工资:136元
                        </text>
                     </view>
                     <view class="chuany-width50 c-p-t-20">
                        <view class="chuany-width10">
                           <up-button class="button-layout__item" text="工资申报" size="mini"
                              type="warning"></up-button>
                        </view>
                     </view>
                  </view>
               </view>
            </view>
         </view>
         <up-loadmore :status="loadStatus" />
      </view>
      <view v-else>
         <up-empty text='暂无' icon="/static/order.png">
         </up-empty>
      </view>
      <fui-date-picker :show="datePickerShow" type="3" @change="changePicker" @cancel="cancel"></fui-date-picker>
   </view>
</template>
<script setup>
   import {
      ref
   } from 'vue'
   let value15 = ref('')
   const list = ref(['全部', '未结算', '已结算']);
   const sectionChange = (index) => {
      current4.value = index;
<script>
   export default {
      data() {
         return {
            pageIndex: 1,
            pageSize: 20,
            wordDate: '',
            isJieSuan: '',
            list: ['全部', '未结算', '已结算'],
            datePickerShow: false,
            viewList: [],
            loadStatus: 'loadmore'
         }
      },
      onLoad() {
         this.PostMyComDakaListPage();
      },
      onReachBottom(){
         if (this.loadStatus != 'nomore') {
            this.PostMyComDakaListPage();
         }
      },
      methods: {
         sectionChange(val) {
            switch (val) {
               case 0:
                  this.isJieSuan = ''
                  break;
               case 1:
                  this.isJieSuan = true
                  break;
               case 2:
                  this.isJieSuan = false
                  break;
            }
            this.PostMyComDakaListPage()
         },
         PostMyComDakaListPage() {
            let data = {
               pageIndex: this.pageIndex,
               pageSize: this.pageSize,
               isJieSuan: this.isJieSuan,
               wordDate: this.wordDate
            }
            this.$api.PostMyComDakaListPage(data).then(res => {
               if (res.code == 1) {
                  if (this.pageIndex == 1) {
                     this.viewList = res.data.items
                  } else {
                     this.viewList.concat(...res.data.items)
                  }
                  // totalPages.value = res.data.totalCount
                  // 根据count数量判断是否还有数据
                  if (res.data.totalCount > this.viewList.length) {
                     this.loadStatus = 'loadmore'
                     this.pageIndex++
                  } else {
                     // 数据已加载完毕
                     this.loadStatus = 'nomore'
                  }
               }
            })
         },
         changePicker(val) {
            this.wordDate = val.result
         },
         clickIcon() {
            this.datePickerShow = true
         }
      }
   }
</script>