-

zhangwei

2024-08-29 447e19fa298ae11a1c3a3fa2d2ff3a1a8dba0501

 src/pages/order/order.vue

@@ -1,44 +1,183 @@
<template>
   <view>
      <up-sticky bgColor="#fff">
         <up-tabs :list="list1" @change='change' :current='state.currentIdex'></up-tabs>
         <up-subsection :list="list" v-if="state.currentIdex==0" :current="current4" activeColor="#f9ae3d"
            @change="sectionChange"></up-subsection>
            <up-subsection :list="list2" v-else :current="current4" activeColor="#f9ae3d"
               @change="sectionChange"></up-subsection>
         <view class="coreshop-ff content c-p-10">
            <up-search placeholder="请点击选择日期" @clear='clear' @clickIcon='clickTime' @custom='search'
               v-model="workTime" search-icon="calendar" @search='search'></up-search>
         </view>
         <!-- <up-subsection :list="list" :current="current4" activeColor="#f9ae3d"
            @change="sectionChange"></up-subsection> -->
      </up-sticky>
      <up-empty mode="order" icon="http://cdn.uviewui.com/uview/empty/order.png">
      </up-empty>
      <view class="full-page">
         <view class="c-p-l-20 c-p-r-20" v-if="listO.orderList&&listO.orderList.length>0">
            <view class="listrecord c-p-t-20" v-for="(item,index) in listO.orderList" :key="item.id"
               @click="pageToDetail(item)">
               <view class="coreshop-ff chuany-bradius20">
                  <view class="c-p-26">
                     <view class="chuany-flex chuany-justify-between">
                        <text class="chuany-font34 chuany-text-bold">
                           {{item.orderName}}
                        </text>
                        <view class="chuany-flex chuany-justify-between">
                           <!-- 招工人数：{{item.worderCount}}人 -->
                           <!-- <text class="c-p-r-20">
									
                        </text> -->
                           <up-tag class='c-m-r-10' :text="item.orderStatusName" shape="circle" type="success"
                              plain plainFill size='mini'></up-tag>
                        </view>
                     </view>
                     <view class="c-p-t-14">
                        日期：{{$util.formatDate(item.wordStartTime)}} 至 {{$util.formatDate(item.wordEndTime)}}
                     </view>
                     <view class="c-p-t-14">
                        时间：{{item.startTimeName}} 至 {{item.endTimeName}}
                     </view>
                     <view class="chuany-flex chuany-justify-between c-p-t-14">
                        <view class="chuany-width50">
                           <text>
                              方式：{{item.workerType==0?'计时':'计件'}}
                           </text>
                        </view>
                        <view class="chuany-width50">
                           工价：{{item.workPrice}}{{item.workerType==0?'元/小时':'元/件'}}
                           <text></text>
                        </view>
                     </view>
                  </view>
               </view>
            </view>
            <up-loadmore :status="loadStatus" />
         </view>
         <view v-else>
            <up-empty text='暂无' icon="/static/order.png">
            </up-empty>
         </view>
      </view>
      <fui-date-picker range :show="datePickerShow" type="5" @change="changePicker"
         @cancel="cancel"></fui-date-picker>
   </view>
</template>

<script setup>
   import {
      onLoad,
      onShow,
      onReachBottom
   } from "@dcloudio/uni-app";
   import {
      reactive,
      ref
      ref,
      getCurrentInstance
   } from 'vue';
   const state = reactive({
      currentIdex: 0
   const {
      $upload,
      $api,
      $util,
      $db
   } = getCurrentInstance().appContext.config.globalProperties
   let state = reactive({
      pageIndex: 1,
      pageSize: 20,
   })
   let workTime = ref('')
   let datePickerShow = ref(false)
   let loadStatus = ref('loadmore')
   let totalPages = ref(0)
   let listO = reactive({
      orderList: []
   })
   onReachBottom(() => {
      if (loadStatus.value != 'nomore') {
         PostMyListPageCompany();
      }
   })
   onLoad(() => {
      PostMyListPageCompany()
   })
   const current4 = ref(0);
   const list = ref(['全部', '进行中', '已完成', '已取消']);
   const list2 = ref(['全部', '正在招', '审核中', '未通过','已招满']);
   // 创建响应式数据
   const list1 = reactive([{
         name: '日结工订单'
      },
      {
         name: '长期工订单'
      },
   ]);
   const change = (e) => {
      state.currentIdex = e.index
   const list = ref(['全部', '发布', '招工完毕', '结算完毕']);
   const changePicker = (val) => {
      console.log(val);
      workTime.value = val.startDate.result + '至' + val.endDate.result
      state.wordStartTime = new Date(val.startDate.result) //工作开始时间
      state.wordEndTime = new Date(val.endDate.result)
   }
   const sectionChange=(index)=> {
      current4.value = index;

   const search = (index) => {
      console.log(index, '------’');
      if (index == 0) {
         PostMyListPageCompany()
      } else {
         PostMyListPageCompany(index - 1)
      }

   }
   const clear = () => {
      state.wordStartTime = ""
      state.wordEndTime = ""
   }
   const clickTime = () => {
      datePickerShow.value = !datePickerShow.value
   }
   const PostMyListPageCompany = (orderStatus) => {
      let data = {
         pageIndex: state.pageIndex,
         pageSize: state.pageSize,
         orderStatus
      }
      if (state.wordStartTime) {
         data.wordStartTime = state.wordStartTime
      }
      if (state.wordEndTime) {
         data.wordEndTime = state.wordEndTime
      }
      loadStatus.value = 'loading';
      $api.PostMyListPageCompany(data).then(res => {
         console.log(res, res.code, '-----------123’');
         if (res.code == 1) {
            if (state.pageIndex == 1) {
               listO.orderList = res.data.items
            } else {
               listO.orderList.concat(...res.data.items)
            }
            console.log(listO.orderList, 'listO.orderList’');
            // totalPages.value = res.data.totalCount
            // 根据count数量判断是否还有数据
            if (res.data.totalCount > listO.orderList.length) {
               loadStatus.value = 'loadmore'
               state.pageIndex++
            } else {
               // 数据已加载完毕
               loadStatus.value = 'nomore'
            }
         } else {
            // _that.$refs.uToast.show({ message: res.msg, type: 'error' });
         }
      })
   }
   const pageToDetail = (item) => {
      uni.navigateTo({
         url: `/pages/order/detail?orderid=${item.id}`
      });
      // $db.set('detailItem',JSON.stringify(item))
   }
</script>

<style>
   .content {
      /* width: 100%; */
      box-sizing: border-box;
   }

   .bgblue {
      background-color: #4e96f5;
      border-radius: 20rpx 20rpx 0 0;
      color: #fff;
   }

   .listrecord {
      width: 100%;
      box-sizing: border-box;
   }
</style>