航站视图-修改日期选择

src/router/index.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-14 17:17:53
- * @LastEditTime: 2022-05-26 15:17:49
+ * @LastEditTime: 2022-06-10 10:17:05
  * @LastEditors: your name
  * @Description: In User Settings Edit
  * @FilePath: \Foshan4A\src\router\index.js
@@ -99,7 +99,7 @@ router.beforeEach((to, from, next) => {
   if (to.meta.keepAlive) {
     const currentPage = store.state.keepAlive.keepAlivePages.find(page => page.name === to.name)
     if (currentPage) {
-      if (currentPage.fullPath !== to.fullPath) {
+      if (currentPage.fullPath !== to.fullPath && to.meta.deepth < from.meta.deepth) {
         next(currentPage.fullPath)
       }
     } else {

src/views/advancedQuery/views/advancedHome.vue

@@ -3,7 +3,7 @@
     <div class="advance__head flex">
       <div class="flex-wrap interfaceLog_head_time">
         <div class="manageTitle">高级查询</div>
-        <div class="interfaceLog_head_time_start mr10">
+        <!-- <div class="interfaceLog_head_time_start mr10">
           <el-date-picker
             v-model="FlightDate[0]"
             class="input-shadow"
@@ -24,7 +24,16 @@
             placeholder="选择结束日期时间"
             @change="endDateChangeHandler"
           />
-        </div>
+        </div> -->
+        <el-date-picker
+          v-model="FlightDate"
+          size="small"
+          type="daterange"
+          value-format="yyyy-MM-dd"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :picker-options="dateRangePickerOptions"
+        />
       </div>
       <Search
         ref="search"
@@ -711,10 +720,10 @@ export default {
     //   console.dir(document.activeElement)
     // })
     this.baggageTypeQuery()
-    document.querySelector('.interfaceLog_head_time_start .el-input__prefix i').remove()
-    document.querySelector('.interfaceLog_head_time_start .el-input__prefix').innerHTML = '开始：'
-    document.querySelector('.interfaceLog_head_time_end .el-input__prefix i').remove()
-    document.querySelector('.interfaceLog_head_time_end .el-input__prefix').innerHTML = '结束：'
+    // document.querySelector('.interfaceLog_head_time_start .el-input__prefix i').remove()
+    // document.querySelector('.interfaceLog_head_time_start .el-input__prefix').innerHTML = '开始：'
+    // document.querySelector('.interfaceLog_head_time_end .el-input__prefix i').remove()
+    // document.querySelector('.interfaceLog_head_time_end .el-input__prefix').innerHTML = '结束：'
 
     let flag = false
     const query = this.$route.query
@@ -764,36 +773,36 @@ export default {
     dialogFocus() {
       this.$refs['dialog'].focus()
     },
-    startDateChangeHandler(val) {
-      this.FlightDate[0] = val ?? ''
-      if (!val || !this.FlightDate[1]) {
-        return
-      }
-      const startDate = new Date(val)
-      const endDate = new Date(this.FlightDate[1])
-      if (startDate > endDate) {
-        this.FlightDate.splice(1, 1, '')
-        this.$message.info('结束时间不能早于开始时间，请重新选择')
-      } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
-        this.FlightDate.splice(1, 1, '')
-        this.$message.info('时间跨度不能超过三天，请重新选择')
-      }
-    },
-    endDateChangeHandler(val) {
-      this.FlightDate[1] = val ?? ''
-      if (!val || !this.FlightDate[0]) {
-        return
-      }
-      const startDate = new Date(this.FlightDate[0])
-      const endDate = new Date(val)
-      if (startDate > endDate) {
-        this.FlightDate.splice(0, 1, '')
-        this.$message.info('开始时间不能晚于结束时间，请重新选择')
-      } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
-        this.FlightDate.splice(0, 1, '')
-        this.$message.info('时间跨度不能超过三天，请重新选择')
-      }
-    },
+    // startDateChangeHandler(val) {
+    //   this.FlightDate[0] = val ?? ''
+    //   if (!val || !this.FlightDate[1]) {
+    //     return
+    //   }
+    //   const startDate = new Date(val)
+    //   const endDate = new Date(this.FlightDate[1])
+    //   if (startDate > endDate) {
+    //     this.FlightDate.splice(1, 1, '')
+    //     this.$message.info('结束时间不能早于开始时间，请重新选择')
+    //   } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
+    //     this.FlightDate.splice(1, 1, '')
+    //     this.$message.info('时间跨度不能超过三天，请重新选择')
+    //   }
+    // },
+    // endDateChangeHandler(val) {
+    //   this.FlightDate[1] = val ?? ''
+    //   if (!val || !this.FlightDate[0]) {
+    //     return
+    //   }
+    //   const startDate = new Date(this.FlightDate[0])
+    //   const endDate = new Date(val)
+    //   if (startDate > endDate) {
+    //     this.FlightDate.splice(0, 1, '')
+    //     this.$message.info('开始时间不能晚于结束时间，请重新选择')
+    //   } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
+    //     this.FlightDate.splice(0, 1, '')
+    //     this.$message.info('时间跨度不能超过三天，请重新选择')
+    //   }
+    // },
     dateRangePickHandler({ maxDate, minDate }) {
       if (!maxDate) {
         this.pickedDate = minDate

src/views/baggageManagement/components/arrival/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-30 17:53:15
+ * @LastEditTime: 2022-06-10 09:15:33
  * @LastEditors: your name
  * @Description: 进港01
 -->
@@ -49,7 +49,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item prop="startDate">
+          <!-- <el-form-item prop="startDate">
             <el-date-picker
               v-model="formData.startDate"
               class="input-shadow"
@@ -72,6 +72,20 @@
               placeholder="结束时间"
               @change="endDateChangeHandler"
             />
+          </el-form-item> -->
+          <el-form-item
+            prop="FlightDate"
+            label="航班日期"
+          >
+            <el-date-picker
+              v-model="formData.FlightDate"
+              size="small"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              :picker-options="dateRangePickerOptions"
+            />
           </el-form-item>
           <el-form-item>
             <div class="box-item">
@@ -487,10 +501,10 @@ export default {
     // },
     // 获取表格数据
     async getTableData() {
-      if (!this.formData.currentAirport) {
+      if (!this.formData.currentAirport || !this.startDate || !this.endDate) {
         return
       }
-      const arr = [this.formData.currentAirport, this.formData.startDate, this.formData.endDate]
+      const arr = [this.formData.currentAirport, this.startDate, this.endDate]
       try {
         const res = await getQuery({
           id: 38,

src/views/baggageManagement/components/departure/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-06-09 16:42:57
+ * @LastEditTime: 2022-06-10 09:14:24
  * @LastEditors: your name
  * @Description: 离港01
 -->
@@ -49,7 +49,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item prop="startDate">
+          <!-- <el-form-item prop="startDate">
             <el-date-picker
               v-model="formData.startDate"
               class="input-shadow"
@@ -72,6 +72,20 @@
               placeholder="结束时间"
               @change="endDateChangeHandler"
             />
+          </el-form-item> -->
+          <el-form-item
+            prop="FlightDate"
+            label="航班日期"
+          >
+            <el-date-picker
+              v-model="formData.FlightDate"
+              size="small"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              :picker-options="dateRangePickerOptions"
+            />
           </el-form-item>
           <el-form-item>
             <div class="box-item">
@@ -445,10 +459,10 @@ export default {
     // },
     // 获取表格数据
     async getTableData() {
-      if (!this.formData.currentAirport) {
+      if (!this.formData.currentAirport || !this.startDate || !this.endDate) {
         return
       }
-      const arr = [this.formData.currentAirport, this.formData.startDate, this.formData.endDate]
+      const arr = [this.formData.currentAirport, this.startDate, this.endDate]
       try {
         const res = await getQuery({
           id: 66,

src/views/baggageManagement/components/transferArrival/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-31 09:26:51
+ * @LastEditTime: 2022-06-10 10:21:34
  * @LastEditors: your name
  * @Description: 中转进港
 -->
@@ -79,7 +79,7 @@
               @change="getTableData"
             />
           </el-form-item>
-          <el-form-item prop="startDate">
+          <!-- <el-form-item prop="startDate">
             <el-date-picker
               v-model="formData.startDate"
               class="input-shadow"
@@ -102,6 +102,20 @@
               placeholder="结束时间"
               @change="endDateChangeHandler"
             />
+          </el-form-item> -->
+          <el-form-item
+            prop="FlightDate"
+            label="航班日期"
+          >
+            <el-date-picker
+              v-model="formData.FlightDate"
+              size="small"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              :picker-options="dateRangePickerOptions"
+            />
           </el-form-item>
         </div>
         <!-- <el-form-item>
@@ -448,13 +462,21 @@ export default {
   },
   created() {
     this.getAirPortData()
+    const { startDate, endDate } = this.$route.query
     Object.entries(this.$route.query).forEach(([key, value]) => {
       if ((value ?? '') !== '' && JSON.stringify(value) !== '[]') {
         this.formData[key] = value
       }
     })
+    if (startDate !== null && startDate !== undefined) {
+      this.formData.FlightDate[0] = startDate
+    }
+    if (endDate !== null && endDate !== undefined) {
+      this.formData.FlightDate[1] = endDate
+    }
   },
   mounted() {
+    this.$refs['form'].validateField('FlightDate')
     const that = this
     this.loopEvent = setInterval(function () {
       that.getTableData()
@@ -473,9 +495,15 @@ export default {
       return classes.join(' ')
     },
     changeView() {
+      const query = {
+        ...this.formData,
+        startDate: this.startDate,
+        endDate: this.endDate
+      }
+      delete query.FlightDate
       this.$router.replace({
         path: '/transfer/departure',
-        query: this.formData
+        query
       })
     },
     airPortChange() {
@@ -567,12 +595,15 @@ export default {
     // },
     // 获取表格数据
     async getTableData() {
+      if (!this.formData.currentAirport || !this.startDate || !this.endDate) {
+        return
+      }
       const arrs1 = [this.formData.inboundCarrier.length === 0 ? '' : this.formData.inboundCarrier[0]]
       const arrs2 = [this.formData.outgoingAirline.length === 0 ? '' : this.formData.outgoingAirline[0]]
       const arr = [
         this.formData.currentAirport,
-        this.formData.startDate,
-        this.formData.endDate,
+        this.startDate,
+        this.endDate,
         ...arrs1,
         ...arrs1,
         ...arrs1,

src/views/baggageManagement/components/transferDeparture/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zk
  * @Date: 2022-01-17 10:39:22
- * @LastEditTime: 2022-05-31 09:26:16
+ * @LastEditTime: 2022-06-10 10:21:44
  * @LastEditors: your name
  * @Description: 中转离港
 -->
@@ -79,7 +79,7 @@
               @change="getTableData"
             />
           </el-form-item>
-          <el-form-item prop="startDate">
+          <!-- <el-form-item prop="startDate">
             <el-date-picker
               v-model="formData.startDate"
               class="input-shadow"
@@ -102,6 +102,20 @@
               placeholder="结束时间"
               @change="endDateChangeHandler"
             />
+          </el-form-item> -->
+          <el-form-item
+            prop="FlightDate"
+            label="航班日期"
+          >
+            <el-date-picker
+              v-model="formData.FlightDate"
+              size="small"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              :picker-options="dateRangePickerOptions"
+            />
           </el-form-item>
         </div>
         <!-- <el-form-item>
@@ -438,13 +452,21 @@ export default {
   },
   created() {
     this.getAirPortData()
+    const { startDate, endDate } = this.$route.query
     Object.entries(this.$route.query).forEach(([key, value]) => {
       if ((value ?? '') !== '' && JSON.stringify(value) !== '[]') {
         this.formData[key] = value
       }
     })
+    if (startDate !== null && startDate !== undefined) {
+      this.formData.FlightDate[0] = startDate
+    }
+    if (endDate !== null && endDate !== undefined) {
+      this.formData.FlightDate[1] = endDate
+    }
   },
   mounted() {
+    this.$refs['form'].validateField('FlightDate')
     const that = this
     this.loopEvent = setInterval(function () {
       that.getTableData()
@@ -463,9 +485,15 @@ export default {
       return classes.join(' ')
     },
     changeView() {
+      const query = {
+        ...this.formData,
+        startDate: this.startDate,
+        endDate: this.endDate
+      }
+      delete query.FlightDate
       this.$router.replace({
         path: '/transfer/arrival',
-        query: this.formData
+        query
       })
     },
     airPortChange() {
@@ -557,6 +585,9 @@ export default {
     // },
     // 获取表格数据
     async getTableData() {
+      if (!this.formData.currentAirport || !this.startDate || !this.endDate) {
+        return
+      }
       // let arr = [
       //   this.formData.currentAirport,
       //   this.formData.startDate,
@@ -568,8 +599,8 @@ export default {
       const arrs2 = [this.formData.outgoingAirline.length === 0 ? '' : this.formData.outgoingAirline[0]]
       const arr = [
         this.formData.currentAirport,
-        this.formData.startDate,
-        this.formData.endDate,
+        this.startDate,
+        this.endDate,
         ...arrs1,
         ...arrs1,
         ...arrs1,

src/views/baggageManagement/mixins/form.js

@@ -1,7 +1,7 @@
 /*
  * @Author: Badguy
  * @Date: 2022-03-04 14:45:03
- * @LastEditTime: 2022-06-07 16:15:27
+ * @LastEditTime: 2022-06-10 10:19:32
  * @LastEditors: your name
  * @Description: 航站视图通用表单部分
  * have a nice day!
@@ -11,6 +11,14 @@ import { parseTime } from '@/utils'
 // const defaultStartTime = new Date(new Date(new Date().toLocaleDateString()).getTime())
 // const defaultEndTime = new Date(new Date(new Date().toLocaleDateString()).getTime() + 24 * 60 * 60 * 1000 - 1)
 const defaultDate = parseTime(new Date(), '{y}-{m}-{d}')
+const dateValidator = (rule, value, callback) => {
+  if (value && value[0] && value[1]) {
+    callback()
+  } else {
+    callback(new Error('请选择航班日期'))
+  }
+}
+
 export default {
   data() {
     return {
@@ -22,10 +30,15 @@ export default {
         outgoingAirline: [],
         craftType: [],
         flightAttr: [],
-        startDate: defaultDate,
-        endDate: defaultDate,
+        FlightDate: [defaultDate, defaultDate],
+        // startDate: defaultDate,
+        // endDate: defaultDate,
         search: ''
       },
+      dateRangePickerOptions: {
+        onPick: this.dateRangePickHandler,
+        disabledDate: this.dateRangeDisabled
+      },
       currentAirportList: [],
       relatedAirportList: [],
       carrierList: [],
@@ -62,8 +75,9 @@ export default {
       // 表单规则
       rules: {
         currentAirport: [{ required: true, message: '请选择当前机场', trigger: ['change', 'blur'] }],
-        startDate: [{ required: true, message: '请选择开始时间', trigger: 'change' }],
-        endDate: [{ required: true, message: '请选择结束时间', trigger: 'change' }]
+        // startDate: [{ required: true, message: '请选择开始时间', trigger: 'change' }],
+        // endDate: [{ required: true, message: '请选择结束时间', trigger: 'change' }]
+        FlightDate: [{ validator: dateValidator, trigger: ['change', 'blur'] }]
       }
     }
   },
@@ -88,14 +102,36 @@ export default {
     },
     startDate() {
       // return parseTime(this.formData.startDate).split(' ')[0]
-      return this.formData.startDate
+      // return this.formData.startDate
+      return this.formData.FlightDate[0]
     },
     endDate() {
       // return parseTime(this.formData.endDate).split(' ')[0]
-      return this.formData.endDate
+      // return this.formData.endDate
+      return this.formData.FlightDate[1]
+    }
+  },
+  watch: {
+    'formData.FlightDate': {
+      handler(val) {
+        if (val === null) {
+          this.formData.FlightDate = ['', '']
+        }
+      },
+      deep: true
     }
   },
   methods: {
+    dateRangePickHandler({ maxDate, minDate }) {
+      if (!maxDate) {
+        this.pickedDate = minDate
+      } else {
+        this.pickedDate = null
+      }
+    },
+    dateRangeDisabled(date) {
+      return this.pickedDate ? Math.abs(date - this.pickedDate) > 2 * 24 * 60 * 60 * 1000 : false
+    },
     // 机场数据处理（多选）
     getMultipleData(arr) {
       const newArr = []
@@ -160,38 +196,38 @@ export default {
       this.getFormData(params)
     },
     // 日期限制
-    startDateChangeHandler(val) {
-      if (!val || !this.endDate) {
-        return
-      }
-      const startDate = new Date(val)
-      const endDate = new Date(this.endDate)
-      if (startDate > endDate) {
-        this.formData.endDate = ''
-        this.$message.info('结束时间不能早于开始时间，请重新选择')
-      } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
-        this.formData.endDate = ''
-        this.$message.info('时间跨度不能超过三天，请重新选择')
-      } else {
-        this.getTableData()
-      }
-    },
-    endDateChangeHandler(val) {
-      if (!val || !this.startDate) {
-        return
-      }
-      const startDate = new Date(this.startDate)
-      const endDate = new Date(val)
-      if (startDate > endDate) {
-        this.formData.startDate = ''
-        this.$message.info('开始时间不能晚于结束时间，请重新选择')
-      } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
-        this.formData.startDate = ''
-        this.$message.info('时间跨度不能超过三天，请重新选择')
-      } else {
-        this.getTableData()
-      }
-    },
+    // startDateChangeHandler(val) {
+    //   if (!val || !this.endDate) {
+    //     return
+    //   }
+    //   const startDate = new Date(val)
+    //   const endDate = new Date(this.endDate)
+    //   if (startDate > endDate) {
+    //     this.formData.endDate = ''
+    //     this.$message.info('结束时间不能早于开始时间，请重新选择')
+    //   } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
+    //     this.formData.endDate = ''
+    //     this.$message.info('时间跨度不能超过三天，请重新选择')
+    //   } else {
+    //     this.getTableData()
+    //   }
+    // },
+    // endDateChangeHandler(val) {
+    //   if (!val || !this.startDate) {
+    //     return
+    //   }
+    //   const startDate = new Date(this.startDate)
+    //   const endDate = new Date(val)
+    //   if (startDate > endDate) {
+    //     this.formData.startDate = ''
+    //     this.$message.info('开始时间不能晚于结束时间，请重新选择')
+    //   } else if (endDate - startDate > 2 * 24 * 60 * 60 * 1000) {
+    //     this.formData.startDate = ''
+    //     this.$message.info('时间跨度不能超过三天，请重新选择')
+    //   } else {
+    //     this.getTableData()
+    //   }
+    // },
     // 搜索
     onSubmit(data) {
       this.$refs['form'].validate(valid => {
@@ -202,8 +238,8 @@ export default {
           const top2 = /^([a-zA-Z][0-9])|([0-9][a-zA-Z])|([a-zA-Z]{2})/
           const num = /^[0-9]+$/
           const queryData = {
-            startDate: this.formData.startDate,
-            endDate: this.formData.endDate
+            startDate: this.startDate,
+            endDate: this.endDate
           }
           if (Number(data) === 1) {
             queryData['destination'] = this.formData.currentAirport