qingyiay
2023-10-30 0978691dc9047c7090dca64406f5d0ac027e8df4
pages/driver-page/appointment/appointment.vue
@@ -1,19 +1,30 @@
<template>
   <view class="appointment">
      <combined-title :title="yuYueData.length != 0 ? yuYueData[0].filedName + '——' + yuYueData[0].sendDate : '暂无预约列表'"></combined-title>
      <view class="appointment-description"
         v-if="isRCSQ">
         *您当前的预约时间段<text>{{yuYueSection}}</text>
      </view>
      <combined-title
         :title="yuYueData.length != 0 ? yuYueData[0].filedName + '——' + yuYueData[0].sendDate : '暂无预约列表'"></combined-title>
      <view class="appointment-table">
         <uni-table border stripe emptyText="暂无更多数据">
         <uni-table border
            stripe
            emptyText="暂无更多数据">
            <uni-tr>
               <uni-th align="center">时间段</uni-th>
               <uni-th align="center">可预约</uni-th>
               <uni-th align="center">已预约</uni-th>
               <uni-th align="center">操作</uni-th>
            </uni-tr>
            <uni-tr v-for="(item, index) in yuYueData" :key="item.id">
            <uni-tr v-for="(item, index) in yuYueData"
               :key="item.id">
               <uni-td align="center">{{ (item.startTime || '') + '-' + (item.endTime || '') }}</uni-td>
               <uni-td align="center">{{ item.carNum || '' }}</uni-td>
               <uni-td align="center">{{ item.carNum1 || '' }}</uni-td>
               <uni-td><u-button text="选择" type="primary" :disabled="item.carNum == item.carNum1" @click="yuYueBtnClick(item)"></u-button></uni-td>
               <uni-td><u-button text="选择"
                     type="primary"
                     :disabled="item.carNum == item.carNum1"
                     @click="yuYueBtnClick(item)"></u-button></uni-td>
            </uni-tr>
         </uni-table>
      </view>
@@ -21,149 +32,179 @@
</template>
<script>
import combinedTitle from '@/components/combined-title/combined-title.vue';
export default {
   components: {
      combinedTitle
   },
   data() {
      return {
         // 预约列表请求参数
         yuYueListParams: {
            filedId: '',
            deptId: '',
            sendDate: ''
         },
         // 预约请求参数
         yuYuePostParams: {
            takeCoalId: null,
            yuYueId: null
         },
         yuYueData: [],
         isRCSQ: false, // 入场申请接口控制
         rcsqData: {
            taskId: '',
            originalYyId: '',
            yyId: '',
            deptId: '',
            filedId: '',
            remark: ''
   import combinedTitle from '@/components/combined-title/combined-title.vue';
   export default {
      components: {
         combinedTitle
      },
      data() {
         return {
            // 预约列表请求参数
            yuYueListParams: {
               filedId: '',
               deptId: '',
               sendDate: ''
            },
            // 预约请求参数
            yuYuePostParams: {
               takeCoalId: null,
               yuYueId: null
            },
            yuYueData: [],
            isRCSQ: false, // 入场申请接口控制
            rcsqData: {
               taskId: '',
               originalYyId: '',
               yyId: '',
               deptId: '',
               filedId: '',
               remark: ''
            },
            yuYueSection: ''
         };
      },
      onLoad(params) {
         if (params.type == '入场申请') {
            this.isRCSQ = true;
            this.rcsqData.originalYyId = params.yyId;
            this.yuYueSection = params.yuYueSection
         }
      };
   },
   onLoad(params) {
      console.log('appointment,params', params);
      if (params.type == '入场申请') {
         this.isRCSQ = true;
         this.rcsqData.originalYyId = params.yyId;
      }
      this.yuYuePostParams.takeCoalId = params.takeCoalId;
      this.yuYueListParams.filedId = params.filedId;
      this.yuYueListParams.deptId = params.deptId;
      this.yuYueListParams.sendDate = params.sendDate;
   },
   onShow() {
      this.init();
   },
   methods: {
      init() {
         this.yuYueList();
         this.yuYuePostParams.takeCoalId = params.takeCoalId;
         this.yuYueListParams.filedId = params.filedId;
         this.yuYueListParams.deptId = params.deptId;
         this.yuYueListParams.sendDate = params.sendDate;
      },
      // 预约列表
      yuYueList() {
         uni.showLoading({
            title: '加载中...'
         });
         this.$reqGet('yuYueList', this.yuYueListParams).then(res => {
            uni.hideLoading();
            if (res.code == 0) {
               this.yuYueData = res.data;
            }
         });
      onShow() {
         this.init();
      },
      // 预约和入场申请共用事件
      yuYueBtnClick(value) {
         if (this.isRCSQ) {
            this.rcsqData.taskId = this.yuYuePostParams.takeCoalId;
            this.saveRCSQ(value);
         } else {
            this.yuYueClick(value.id);
         }
      },
      // 预约
      yuYueClick(id) {
         this.yuYuePostParams.yuYueId = id;
         this.$reqPost('yuYue', { takeCoalId: this.yuYuePostParams.takeCoalId, yuYueId: this.yuYuePostParams.yuYueId }, 'params').then(res => {
            if (res.code == 0) {
               this.$u.toast('预约成功!');
               uni.navigateBack({
                  delta: 1
               });
      methods: {
         init() {
            this.yuYueList();
         },
         // 预约列表
         yuYueList() {
            uni.showLoading({
               title: '加载中...'
            });
            this.$reqGet('yuYueList', this.yuYueListParams).then(res => {
               uni.hideLoading();
               if (res.code == 0) {
                  this.yuYueData = res.data;
               } else {
                  this.$u.toast('加载失败');
               }
            });
         },
         // 预约和入场申请共用事件
         yuYueBtnClick(value) {
            if (this.isRCSQ) {
               this.rcsqData.taskId = this.yuYuePostParams.takeCoalId;
               this.saveRCSQ(value);
            } else {
               this.$u.toast(res.msg ? res.msg : '预约失败');
               this.yuYueClick(value.id);
            }
            setTimeout(() => {
               this.yuYueList();
            }, 500);
         });
      },
      // 入场申请
      saveRCSQ(value) {
         this.rcsqData.yyId = value.id;
         this.rcsqData.deptId = value.deptId;
         this.rcsqData.filedId = value.filedId;
         this.$reqPost('saveRCSQ', this.rcsqData, 'json').then(res => {
            if (res.code == 0) {
               this.$u.toast('新建入场申请成功。');
            }
         });
         },
         // 预约
         yuYueClick(id) {
            this.yuYuePostParams.yuYueId = id;
            this.$reqPost('yuYue', {
               takeCoalId: this.yuYuePostParams.takeCoalId,
               yuYueId: this.yuYuePostParams.yuYueId
            }, 'params').then(res => {
               if (res.code == 0) {
                  this.yuYueList();
                  this.$u.toast('预约成功');
                  let timer = setTimeout(() => {
                     uni.switchTab({
                        url: '/pages/tabbar-page/index-tabbar/index-tabbar'
                     })
                  }, 1500);
               } else {
                  this.$u.toast(res.msg ? res.msg : '预约失败');
               }
            })
         },
         // 入场申请
         saveRCSQ(value) {
            this.rcsqData.yyId = value.id;
            this.rcsqData.deptId = value.deptId;
            this.rcsqData.filedId = value.filedId;
            this.$reqPost('saveRCSQ', this.rcsqData, 'json').then(res => {
               if (res.code == 0) {
                  this.$u.toast('入场申请成功');
                  let timer = setTimeout(() => {
                     uni.switchTab({
                        url: '/pages/tabbar-page/index-tabbar/index-tabbar'
                     })
                  }, 1500);
               } else {
                  this.$u.toast(res.msg ? res.msg : '入场申请失败,请稍后重试');
               }
            });
         }
      }
   }
};
   };
</script>
<style lang="scss" scoped>
::v-deep.appointment {
   width: 94%;
   margin: 0 auto;
   h1 {
      font-size: vww(20);
      text-align: center;
      font-weight: 550;
      margin: vww(30) 0 vww(18) 0;
   }
   // 表格
   .uni-table-scroll {
      width: 100%;
      overflow-x: hidden;
<style lang="scss"
   scoped>
   ::v-deep.appointment {
      width: 94%;
      margin: 0 auto;
      .uni-table {
         min-width: 0 !important;
      // 预约界面描述
      .appointment-description {
         margin: vww(8) 0;
         color: #fd1446;
         .uni-table-tr {
            padding: 0;
            font-size: vww(13);
         text {
            font-weight: bold;
            display: inline-block;
            margin-left: vww(5);
            color: #252525;
         }
      }
            .uni-table-th {
               height: vww(32);
               line-height: vww(20);
               padding: vww(5) vww(10);
               color: #111111;
               font-weight: 550;
               background: #f5f5f5;
            }
      h1 {
         font-size: vww(20);
         text-align: center;
         font-weight: 550;
         margin: vww(30) 0 vww(18) 0;
      }
            .uni-table-td {
               height: vww(32);
               line-height: vww(20);
               padding: vww(5) vww(10);
               color: #111111;
               .u-button {
                  height: vww(23);
      // 表格
      .uni-table-scroll {
         width: 100%;
         overflow-x: hidden;
         .uni-table {
            min-width: 0 !important;
            .uni-table-tr {
               padding: 0;
               font-size: vww(13);
               .uni-table-th {
                  height: vww(32);
                  line-height: vww(20);
                  padding: vww(5) vww(10);
                  color: #111111;
                  font-weight: 550;
                  background: #f5f5f5;
               }
               .uni-table-td {
                  height: vww(32);
                  line-height: vww(20);
                  padding: vww(5) vww(10);
                  color: #111111;
                  .u-button {
                     height: vww(23);
                  }
               }
            }
         }
      }
   }
}
</style>
</style>