From 17efddc6a667670dca682bf36b51a43e99615e6d Mon Sep 17 00:00:00 2001
From: k94314517 <8417338+k94314517@user.noreply.gitee.com>
Date: 星期三, 16 十月 2024 15:59:38 +0800
Subject: [PATCH] 代码初始化

---
 admin/src/components/operation/OperCarUseBookParamWindow.vue |  145 +++++++++++++++++++++++++++++++++++++++++++-----
 1 files changed, 129 insertions(+), 16 deletions(-)

diff --git a/admin/src/components/operation/OperCarUseBookParamWindow.vue b/admin/src/components/operation/OperCarUseBookParamWindow.vue
index 4aa942d..c571bcb 100644
--- a/admin/src/components/operation/OperCarUseBookParamWindow.vue
+++ b/admin/src/components/operation/OperCarUseBookParamWindow.vue
@@ -17,7 +17,7 @@
           >
         </el-form-item>
         <el-form-item label="閫夋嫨杞﹁締" prop="carId">
-          <el-select v-model="form.carId" placeholder="閫夋嫨杞﹁締">
+          <el-select v-model="form.carId" @change="clearTime" placeholder="閫夋嫨杞﹁締">
             <el-option
               v-for="item in carsList"
               :key="item.id"
@@ -119,7 +119,7 @@
             :picker-options="{
               disabledDate(time) {
                 return time.getTime() < Date.now() - 8.64e7;
-              }
+              },
             }"
             @change="seletedDate"
           >
@@ -133,6 +133,7 @@
                 :class="{
                   disable: item.isUse == 1,
                   active: item.checked == '1',
+                  hasSub: item.carUseBookId,
                 }"
                 @click="datetimeClick(item, i)"
                 v-for="(item, i) in timeList"
@@ -161,6 +162,7 @@
       :visible.sync="isShowShiwai"
       append-to-body
       width="600px"
+      :before-close="clearTime"
     >
       <el-form :model="form" ref="modalRef" class="el_form" :rules="rules">
         <el-form-item label="鐢ㄨ溅寮�濮嬫椂闂�" prop="startTime">
@@ -170,7 +172,6 @@
             value-format="yyyy-MM-dd HH:mm:ss"
             type="datetime"
             :picker-options="pickerOptions"
-            default-time="08:00:00"
             @change="seletedShiwaiDate"
           >
           </el-date-picker>
@@ -182,7 +183,6 @@
             value-format="yyyy-MM-dd HH:mm:ss"
             type="datetime"
             :picker-options="pickerOptions"
-            default-time="08:00:00"
             @change="seletedShiwaiDate"
           >
           </el-date-picker>
@@ -191,7 +191,10 @@
       <div class="have_info" v-if="info && info.length > 0">
         <div class="tit">鎮ㄧ敵璇风殑鐢ㄨ溅鏃舵宸叉湁杞﹁締棰勭害</div>
         <div class="content" v-for="(item, i) in info" :key="i">
-          <div class="card">{{ item.carCode }}</div>
+          <div class="df_sb">
+            <span class="card" v-if="item.carCode">{{ item.carCode }}</span>
+            <span>{{ i + 1 }}/{{ info.length }}</span>
+          </div>
           <div class="line">
             <span>鐢ㄨ溅鏃舵</span>
             <span>
@@ -214,16 +217,48 @@
           </div>
           <div class="line">
             <span>鐢宠浜�</span>
-            <span>{{ item.memberName }} {{ item.memberMobile }}</span>
+            <span>{{ item.memberName }} <span class="primaryColor">{{ item.memberMobile }}</span></span>
           </div>
         </div>
       </div>
 
       <span slot="footer" class="dialog-footer">
         <div>宸查�夋嫨锛歿{ selDatetime }}</div>
-        <div class="btn" @click="subTime">纭鏃堕棿</div>
+        <div class="btn" :class="{disable: info && info.length > 0}" @click="subTime">纭鏃堕棿</div>
       </span>
     </el-dialog>
+    <!-- 璇︽儏 -->
+     <el-dialog
+      title="閫夋嫨鐢ㄨ溅鏃堕棿"
+      :visible.sync="isShowDetail"
+      append-to-body
+      width="600px"
+    >
+      <div class="detail_modal">
+        <div class="title">杞﹁締棰勭害鎯呭喌</div>
+        <div class="h1" v-if="activeInfo.carCode">{{ activeInfo.carCode }}</div>
+        <div class="line">
+          <div class="label">棰勮鐢ㄨ溅鏃舵</div>
+          <div class="value" v-if="activeInfo.startTime">{{ activeInfo.startTime.slice(5, 16) }} - {{ activeInfo.endTime.slice(5, 16) }}</div>
+        </div>
+        <div class="line">
+          <div class="label">鐩殑鍦�</div>
+          <div class="value">{{ activeInfo.addr }}</div>
+        </div>
+        <div class="line">
+          <div class="label">涔樿溅浜烘暟</div>
+          <div class="value" v-if="activeInfo.memberIds">{{ activeInfo.memberIds.split(',').length }}浜�</div>
+        </div>
+        <div class="line">
+          <div class="label">鐢ㄨ溅浜嬬敱</div>
+          <div class="value">{{ activeInfo.content || '' }}</div>
+        </div>
+        <div class="line">
+          <div class="label">鐢宠浜�</div>
+          <div class="value">{{ activeInfo.memberName }} <span class="primaryColor ml12">{{ activeInfo.memberPhone }}</span></div>
+        </div>
+      </div>
+     </el-dialog>
   </GlobalWindow>
 </template>
 
@@ -232,9 +267,10 @@
 import GlobalWindow from '@/components/common/GlobalWindow'
 import { allList } from '@/api/business/member'
 import { allList as getCarList } from '@/api/business/cars'
-import { carCanReservationDate, carUseBookCraete, carUseBookList } from '@/api/business/carUseBook'
+import { carCanReservationDate, carUseBookCraete, carUseBookList, detail } from '@/api/business/carUseBook'
 import { findTypeMemberInfo } from '@/api/business/memberCard'
 import dayjs from 'dayjs'
+
 export default {
   name: 'OperCarUseBookParamWindow',
   extends: BaseOpera,
@@ -262,19 +298,22 @@
         endTime: '',
         memberIds: []
       },
+      activeInfo: {},
+      isShowDetail: false,
+      carBookInfo: {},
       pickerOptions: {
         disabledDate: (time) => {
-          if (this.form.startTime && this.form.endTime) {
+          if (this.form.startTime) {
             const minTime = new Date(this.form.startTime).getTime() - 8.64e7
-            const maxTime = new Date(this.form.endTime).getTime()
+            const maxTime = this.form.endTime ? new Date(this.form.endTime).getTime() : ''
             return (
-              time.getTime() < minTime || time.getTime() > maxTime
+              // maxTime ? time.getTime() < minTime || time.getTime() > maxTime : time.getTime() < minTime
+              time.getTime() < minTime
             )
           } else {
             return time.getTime() < Date.now() - 8.64e7
           }
-        },
-        selectableRange: '00:00:00 - 23:59:59'
+        }
       },
       pickerOptions2: {
         disabledDate: (time) => {
@@ -282,7 +321,7 @@
             const minTime = new Date(this.form.startTime).getTime()
             const maxTime = new Date(this.form.endTime).getTime()
             return (
-              time.getTime() < minTime || time.getTime() > maxTime
+              time.getTime() < minTime - 8.64e7 || time.getTime() > maxTime
             )
           } else {
             return time.getTime() < Date.now() - 8.64e7
@@ -303,11 +342,24 @@
       }
     }
   },
+  computed: {
+
+  },
   watch: {
     'form.planUseDate': {
       handler (newValue, oldValue) {
         if (newValue) {
           this.$set(this.pickerOptions, 'selectableRange', this.form.startTime.slice(11, 19) + ' - ' + this.form.endTime.slice(11, 19))
+          // this.startPickerOptions = this.startPickerOptions
+        }
+      },
+      deep: true,
+      immediate: true
+    },
+    'form.startTime': {
+      handler (newValue, oldValue) {
+        if (newValue) {
+          this.$set(this.pickerOptions, 'selectableRange', this.form.startTime.slice(11, 19) + ' - ' + '23:59:59')
           // this.startPickerOptions = this.startPickerOptions
         }
       },
@@ -360,12 +412,26 @@
         return this.$tip.error('璇峰厛閫夋嫨杞﹁締')
       }
       if (this.form.type === 0) {
+        this.$set(this.form, 'dateDay', '')
+        this.timeList = []
         this.isShowTime = true
       } else {
+        this.clearTime()
         this.isShowShiwai = true
       }
     },
+    clearTime () {
+      this.isShowShiwai = false
+      this.$set(this.form, 'startTime', '')
+      this.$set(this.form, 'endTime', '')
+      this.$nextTick(() => {
+        if (this.$refs.modalRef) {
+          this.$refs.modalRef.clearValidate()
+        }
+      })
+    },
     subTime () {
+      if (this.info && this.info.length > 0) return
       if (this.form.type === 0) {
         const selTimeList = this.timeList.filter(i => i.checked == '1')
         if (selTimeList.length === 0) {
@@ -378,11 +444,24 @@
         this.$forceUpdate()
       } else {
         this.$refs.modalRef.validate((valid) => {
+          const { form } = this
+          if (new Date(form.startTime).getTime() > new Date(form.endTime).getTime()) {
+            return this.$tip.error('缁撴潫鏃堕棿搴斿ぇ浜庡紑濮嬫椂闂�')
+          }
           this.isShowShiwai = false
         })
       }
     },
     datetimeClick (item, index) {
+      if (item.carUseBookId) {
+        detail(
+          item.carUseBookId
+        ).then(res => {
+          this.activeInfo = res
+          this.isShowDetail = true
+        })
+        return
+      }
       if (item.isUse == '1') return
       const { timeList } = this
       const selTimeList = timeList.filter(i => i.checked == '1')
@@ -454,12 +533,13 @@
     },
     initData () {
       getCarList({
-        type: 1
+        type: 0
       }).then(res => {
         this.carsList = res
       })
       findTypeMemberInfo({
-        type: '2'
+        type: '2',
+        companyType: 1
       }).then(res => {
         this.memberList = res || []
       })
@@ -528,6 +608,10 @@
     background-color: #cccccc;
     color: #999999;
   }
+  .hasSub {
+      color: #fff;
+      background: #cccccc;
+    }
 }
 .color_op {
   display: flex;
@@ -553,6 +637,10 @@
     color: #fff;
     width: 120px;
     text-align: center;
+    cursor: pointer;
+  }
+  .disable{
+    background: #cccccc;
   }
 }
 .have_info {
@@ -589,4 +677,29 @@
     }
   }
 }
+.detail_modal {
+  padding: 20px 15px;
+  .title {
+    text-align: center;
+    font-weight: 600;
+    font-size: 16px;
+    margin-bottom: 20px;
+  }
+  .h1 {
+    font-weight: 600;
+    font-size: 16px;
+    margin-bottom: 16px;
+  }
+  .line {
+    display: flex;
+    margin-bottom: 10px;
+    .label {
+      width: 120px;
+      color: #888888;
+    }
+    .value {
+      color: #333333;
+    }
+  }
+}
 </style>

--
Gitblit v1.9.3