表格内容格式化

src/views/advancedQuery/views/advancedHome.vue

@@ -80,7 +80,6 @@
         :row-class-name="tableRowClassName"
         :cell-class-name="cellClass"
         :span-method="objectSpanMethod"
-        :formatter="tableFormat"
         @cell-click="cellClickHandler"
       >
         <el-table-column
@@ -90,6 +89,7 @@
           :label="col.label"
           :width="col.width"
           :fixed="col.fixed"
+          :formatter="tableFormat"
         >
           <template #header>
             <TableHeaderCell
@@ -922,7 +922,7 @@ export default {
         case 'deleted':
           return cellValue === 'DEL' ? cellValue : ''
         case 'activated':
-          return cellValue === 'I' ? '未激活' : '激活'
+          return cellValue === 1 ? '激活' : '未激活'
         default:
           return cellValue ?? ''
       }

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

@@ -190,6 +190,7 @@
             :prop="childCol.prop"
             :label="childCol.label"
             :width="childCol.width"
+            :formatter="tableFormat"
           >
             <template #header>
               <el-tooltip
@@ -254,6 +255,7 @@ import TimeZoneSelector from '@/components/TimeZoneSelector'
 import terminalMixin from '../../mixins/terminal'
 import formMixin from '../../mixins/form'
 import tableColsMixin from '../../mixins/tableCols'
+import timeZoneMixin from '../../mixins/timeZone'
 import { getQuery } from '@/api/flight'
 import TableHeaderCell from '@/components/TableHeaderCell'
 import { setTableFilters } from '@/utils/table'
@@ -261,7 +263,7 @@ import { setTableFilters } from '@/utils/table'
 export default {
   name: 'DepartureTerminalView',
   components: { Dialog, TimeZoneSelector, TableHeaderCell },
-  mixins: [terminalMixin, formMixin, tableColsMixin],
+  mixins: [terminalMixin, formMixin, tableColsMixin, timeZoneMixin],
   data() {
     return {
       orderNum: ['0', '0', '0', '0', '0', '0'], // 默认总数

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

@@ -8,8 +8,17 @@
 <template>
   <div class="departure-one">
     <!--功能区-表单-->
-    <div ref="formWrap" class="terminal-form-wrap">
-      <el-form ref="form" :inline="true" :model="formData" :rules="rules" class="form">
+    <div
+      ref="formWrap"
+      class="terminal-form-wrap"
+    >
+      <el-form
+        ref="form"
+        :inline="true"
+        :model="formData"
+        :rules="rules"
+        class="form"
+      >
         <div class="form-left">
           <el-form-item prop="currentAirport">
             <!-- <el-cascader
@@ -24,8 +33,20 @@
             filterable
             @change="setCurrentAirport"
           /> -->
-            <el-select v-model="formData.currentAirport" class="input-shadow" size="small" filterable placeholder="请选择机场" @change="airPortChange">
-              <el-option v-for="(item, index) in AirportList" :key="index" :label="item.planDepartureApt" :value="item.planDepartureApt" />
+            <el-select
+              v-model="formData.currentAirport"
+              class="input-shadow"
+              size="small"
+              filterable
+              placeholder="请选择机场"
+              @change="airPortChange"
+            >
+              <el-option
+                v-for="(item, index) in AirportList"
+                :key="index"
+                :label="item.planDepartureApt"
+                :value="item.planDepartureApt"
+              />
             </el-select>
           </el-form-item>
           <!-- <el-form-item prop="startDate">
@@ -52,65 +73,168 @@
               @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" @change="dateChangeHandler" />
+          <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"
+              @change="dateChangeHandler"
+            />
           </el-form-item>
           <el-form-item>
             <div class="box-item">
               <p>预计装载总数：</p>
-              <li v-for="(item, index) in orderNum" :key="index" :class="{ 'number-item': !isNaN(item), 'mark-item': isNaN(item) }">
+              <li
+                v-for="(item, index) in orderNum"
+                :key="index"
+                :class="{ 'number-item': !isNaN(item), 'mark-item': isNaN(item) }"
+              >
                 <span v-if="!isNaN(item)">
                   <i ref="numberItem">0123456789</i>
                 </span>
-                <span v-else class="comma">{{ item }}</span>
+                <span
+                  v-else
+                  class="comma"
+                >{{ item }}</span>
               </li>
             </div>
           </el-form-item>
         </div>
-        <div class="form-right" @keyup.enter="onSubmit(0)">
+        <div
+          class="form-right"
+          @keyup.enter="onSubmit(0)"
+        >
           <el-form-item prop="search">
-            <el-popover :value="popoverVisible" placement="bottom" trigger="manual">
+            <el-popover
+              :value="popoverVisible"
+              placement="bottom"
+              trigger="manual"
+            >
               <span>请输入航班号（示例：CA1234）或行李牌号（示例：1234567890）</span>
-              <el-input slot="reference" v-model="formData.search" class="input-shadow" style="width: 240px; margin-left: 105px" size="small" placeholder="请输入内容" prefix-icon="el-icon-search" clearable @focus="popoverVisible = true" @blur="popoverVisible = false" />
+              <el-input
+                slot="reference"
+                v-model="formData.search"
+                class="input-shadow"
+                style="width: 240px; margin-left: 105px"
+                size="small"
+                placeholder="请输入内容"
+                prefix-icon="el-icon-search"
+                clearable
+                @focus="popoverVisible = true"
+                @blur="popoverVisible = false"
+              />
             </el-popover>
           </el-form-item>
           <el-form-item>
-            <el-button class="btn-shadow" size="mini" type="primary" @click="onSubmit(0)">搜索</el-button>
+            <el-button
+              class="btn-shadow"
+              size="mini"
+              type="primary"
+              @click="onSubmit(0)"
+            >搜索</el-button>
           </el-form-item>
           <el-form-item v-is="['i_timeIcon']">
             <TimeZoneSelector />
           </el-form-item>
           <el-form-item>
-            <img class="btn-img btn-shadow" src="../../../../assets/baggage/ic_setting.png" @click="show">
+            <img
+              class="btn-img btn-shadow"
+              src="../../../../assets/baggage/ic_setting.png"
+              @click="show"
+            >
           </el-form-item>
         </div>
       </el-form>
     </div>
     <!--表格-->
-    <div v-loading="loading" class="terminal-table" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)">
-      <el-table ref="table" class="table" :height="computedTableHeight" :data="dealedTableData" :header-cell-class-name="headerCellClass" :row-class-name="tableRowClassName" :cell-class-name="cellClass" show-summary :summary-method="summaryMethod" border stripe fit @cell-click="cellClickHandler">
-        <el-table-column v-for="col in tableColsCopy" :key="col.prop" :prop="col.prop" :label="col.label" :width="col.width" :fixed="col.fixed" :formatter="tableFormat">
+    <div
+      v-loading="loading"
+      class="terminal-table"
+      element-loading-text="拼命加载中"
+      element-loading-spinner="el-icon-loading"
+      element-loading-background="rgba(0, 0, 0, 0.8)"
+    >
+      <el-table
+        ref="table"
+        class="table"
+        :height="computedTableHeight"
+        :data="dealedTableData"
+        :header-cell-class-name="headerCellClass"
+        :row-class-name="tableRowClassName"
+        :cell-class-name="cellClass"
+        show-summary
+        :summary-method="summaryMethod"
+        border
+        stripe
+        fit
+        @cell-click="cellClickHandler"
+      >
+        <el-table-column
+          v-for="col in tableColsCopy"
+          :key="col.prop"
+          :prop="col.prop"
+          :label="col.label"
+          :width="col.width"
+          :fixed="col.fixed"
+          :formatter="tableFormat"
+        >
           <template #header>
-            <el-tooltip :content="col.disc" placement="top">
-              <TableHeaderCell :label="col.label" :filter-options="tableDataFilters[col.prop]" :filter-values.sync="filterValues[col.prop]" :sortable="col.sortable" :sort-rule.sync="tableDataSortRules[col.prop]" />
+            <el-tooltip
+              :content="col.disc"
+              placement="top"
+            >
+              <TableHeaderCell
+                :label="col.label"
+                :filter-options="tableDataFilters[col.prop]"
+                :filter-values.sync="filterValues[col.prop]"
+                :sortable="col.sortable"
+                :sort-rule.sync="tableDataSortRules[col.prop]"
+              />
             </el-tooltip>
           </template>
         </el-table-column>
       </el-table>
     </div>
     <!--列设置-->
-    <Dialog :flag="dialogFlag" class="dialog-check-cols">
+    <Dialog
+      :flag="dialogFlag"
+      class="dialog-check-cols"
+    >
       <div class="col-dialog">
         <div class="title">列设置</div>
         <div class="content">
-          <el-tree :data="tableCols" :class="colsCheckClass" show-checkbox node-key="index" :default-expand-all="true" :props="{
+          <el-tree
+            :data="tableCols"
+            :class="colsCheckClass"
+            show-checkbox
+            node-key="index"
+            :default-expand-all="true"
+            :props="{
               label: 'label',
               children: 'children'
-            }" :default-checked-keys="checkedKeysTemp" @check="handleCheck" />
+            }"
+            :default-checked-keys="checkedKeysTemp"
+            @check="handleCheck"
+          />
         </div>
         <div class="foot right t30">
-          <el-button size="medium" class="r24" type="primary" @click="onCheck">确定</el-button>
-          <el-button size="medium" @click="hide">取消</el-button>
+          <el-button
+            size="medium"
+            class="r24"
+            type="primary"
+            @click="onCheck"
+          >确定</el-button>
+          <el-button
+            size="medium"
+            @click="hide"
+          >取消</el-button>
         </div>
       </div>
     </Dialog>
@@ -132,7 +256,7 @@ export default {
   name: 'DepartureTerminalView',
   components: { Dialog, TimeZoneSelector, TableHeaderCell },
   mixins: [terminalMixin, formMixin, tableColsMixin, timeZoneMixin],
-  data () {
+  data() {
     return {
       orderNum: ['0', '0', '0', '0', '0', '0'], // 默认总数
       popoverVisible: false,
@@ -195,77 +319,77 @@ export default {
         {
           prop: 'checkInTravellerNumber',
           label: '托运旅客',
-          disc: '指航班已办理行李托运业务的旅客人数，含取消托运的旅客人数',
+          disc: '指航班已办理行李托运业务的旅客人数，含取消托运的旅客人数'
         },
         {
           prop: 'checkInNumber',
           label: '值机数',
-          disc: '指已办理值机托运的行李数量，含取消托运的行李数量，含未激活',
+          disc: '指已办理值机托运的行李数量，含取消托运的行李数量，含未激活'
         },
         {
           prop: 'unActive',
           label: '未激活',
-          disc: '指最后的 BSM 报文“.S”中行李状态为“I”的行李数量，含取消托运的行李数量',
+          disc: '指最后的 BSM 报文“.S”中行李状态为“I”的行李数量，含取消托运的行李数量'
         },
         {
           prop: 'preLoad',
           label: '预计装载',
-          disc: '指已办理值机托运的行李数量，不含取消托运的行李数量，不包含未激活',
+          disc: '指已办理值机托运的行李数量，不含取消托运的行李数量，不包含未激活'
         },
         {
           prop: 'checkNumber',
           label: '安检',
-          disc: '指进行安检的行李数量，含取消托运的行李数量',
+          disc: '指进行安检的行李数量，含取消托运的行李数量'
         },
         {
           prop: 'sortNumber',
           label: '分拣',
-          disc: '指已分拣完成的行李数量，含取消托运的行李数量',
+          disc: '指已分拣完成的行李数量，含取消托运的行李数量'
         },
         {
           prop: 'loadNumber',
           label: '装车',
-          disc: '指已在分拣口装车完成的行李数量，含取消托运的行李数量',
+          disc: '指已在分拣口装车完成的行李数量，含取消托运的行李数量'
         },
         {
           prop: 'landingNumber',
           label: '装机',
-          disc: '指装机完成的行李数量，不含取消托运的行李数量',
+          disc: '指装机完成的行李数量，不含取消托运的行李数量'
         },
         {
           prop: 'tounLoad',
           label: '待翻减',
-          disc: '指旅客在办理行李托运后，旅客取消该行李的托运并且行李此时已经过装车节点，而没有完成翻减的行李数量（须翻减总数减去已翻减数）',
+          disc: '指旅客在办理行李托运后，旅客取消该行李的托运并且行李此时已经过装车节点，而没有完成翻减的行李数量（须翻减总数减去已翻减数）'
         },
         {
           prop: 'unLoad',
           label: '已翻减',
-          disc: '指旅客在办理行李托运后，旅客取消该行李的托运并且行李此时已经过装车节点，且已完成翻减的行李数量',
+          disc: '指旅客在办理行李托运后，旅客取消该行李的托运并且行李此时已经过装车节点，且已完成翻减的行李数量'
         },
         {
           prop: 'noCheckInNumber',
           label: '取消托运',
-          disc: '指旅客在办理行李托运后，又取消托运的行李总数量',
+          disc: '指旅客在办理行李托运后，又取消托运的行李总数量'
         },
         {
           prop: 'noBSM',
           label: '无BSM',
-          disc: '行李有处理信息（BPM）但无值机信息(BSM)的行李数量',
+          disc: '行李有处理信息（BPM）但无值机信息(BSM)的行李数量'
         },
         {
           prop: 'warning',
           label: '风险预警',
-          disc: '指依据航班信息中预计起飞时间和当前时间差，与根据分拣到停机位设置的报警阈值对比，超过阈值的为风险行李，本项显示风险预警行李数量',
+          disc: '指依据航班信息中预计起飞时间和当前时间差，与根据分拣到停机位设置的报警阈值对比，超过阈值的为风险行李，本项显示风险预警行李数量'
         },
         {
           prop: 'exceptions',
           label: '离港异常',
-          disc: '指航班关闭货仓门后，应装而未装的行李数量',
+          disc: '指航班关闭货仓门后，应装而未装的行李数量'
         },
         {
           prop: 'midIn',
           label: '中转进行李',
-          disc: '指从其他航班中转到当前航班的行李数量',
+          disc: '指从其他航班中转到当前航班的行李数量'
         }
       ],
       tableDataSortRules: {
@@ -279,22 +403,22 @@ export default {
       hasSetTableScroll: false
     }
   },
-  mounted () {
+  mounted() {
     this.getAirPortData()
   },
-  beforeDestroy () {
+  beforeDestroy() {
     if (this.loopEvent) {
       clearInterval(this.loopEvent)
       this.loopEvent = null
     }
   },
   computed: {
-    singleDay () {
+    singleDay() {
       return this.startDate === this.endDate
     }
   },
   methods: {
-    resetLoopEvent () {
+    resetLoopEvent() {
       this.loading = true
       this.hasSetTableScroll = false
       if (this.loopEvent) {
@@ -306,13 +430,13 @@ export default {
         that.getTableData()
       }, 3000)
     },
-    airPortChange () {
+    airPortChange() {
       this.resetLoopEvent()
     },
-    dateChangeHandler () {
+    dateChangeHandler() {
       this.resetLoopEvent()
     },
-    async getAirPortData () {
+    async getAirPortData() {
       try {
         const res = await getQuery({
           id: DATACONTENT_ID.departureAirMainId,
@@ -329,7 +453,7 @@ export default {
         console.log('出错了', error)
       }
     },
-    tableRowClassName ({ row, rowIndex }) {
+    tableRowClassName({ row, rowIndex }) {
       const classes = []
       if (row.flightStatus === 'DLY') {
         classes.push('bgl-delayed')
@@ -345,7 +469,7 @@ export default {
       }
       return classes.join(' ')
     },
-    headerCellClass ({ row, column }) {
+    headerCellClass({ row, column }) {
       const classes = []
       if (['warning', 'exceptions', 'midIn'].includes(column.property)) {
         classes.push('bgl-huang')
@@ -367,7 +491,7 @@ export default {
     //   this.flightAttrQuery(params)
     // },
     // 获取表格数据
-    async getTableData () {
+    async getTableData() {
       if (!this.formData.currentAirport || !this.startDate || !this.endDate) {
         return
       }
@@ -392,7 +516,7 @@ export default {
         console.log('出错了', error)
       }
     },
-    initTableData (tableData) {
+    initTableData(tableData) {
       this.leaveCount = 0
       this.baggageCount = 0
       tableData.forEach(item => {
@@ -414,7 +538,7 @@ export default {
         this.setTableScroll()
       })
     },
-    setTableScroll () {
+    setTableScroll() {
       if (!this.singleDay || this.hasSetTableScroll || this.leaveCount === 0) {
         return
       }
@@ -434,7 +558,7 @@ export default {
       }, 0)
       this.hasSetTableScroll = true
     },
-    setNumberTransform () {
+    setNumberTransform() {
       const numberItems = this.$refs.numberItem // 拿到数字的ref，计算元素数量
       const numberArr = this.orderNum.filter(item => !isNaN(item))
       // 结合CSS 对数字字符进行滚动,显示订单数量
@@ -444,7 +568,7 @@ export default {
       }
     },
 
-    toOrderNum (num) {
+    toOrderNum(num) {
       num = num.toString()
       if (num.length < 6) {
         num = '0' + num // 如未满八位数，添加"0"补位
@@ -482,7 +606,7 @@ export default {
       optgroup,
       select,
       textarea {
-        font-family: Helvetica, "Microsoft YaHei";
+        font-family: Helvetica, 'Microsoft YaHei';
         font-size: 14px;
       }
       .el-switch__label {
@@ -588,7 +712,7 @@ export default {
       padding: 0;
       text-align: center;
       font-size: 14px;
-      font-family: Helvetica, "Microsoft YaHei";
+      font-family: Helvetica, 'Microsoft YaHei';
       letter-spacing: 0;
     }
     .cell-click {
@@ -621,7 +745,7 @@ export default {
         &.redBorder {
           position: relative;
           &::after {
-            content: "";
+            content: '';
             position: absolute;
             left: 0;
             bottom: 0;
@@ -641,7 +765,7 @@ export default {
         background: lightcoral !important;
         position: relative;
         &::after {
-          content: "";
+          content: '';
           display: block;
           width: 100%;
           height: 100%;

src/views/baggageManagement/mixins/timeZone.js

@@ -17,9 +17,9 @@ export default {
     // 表格数据格式化
     tableFormat(row, column, cellValue) {
       switch (column.property) {
-        case 'PlanLandingTime':
+        case 'arrivalTime':
         case 'planDepartureTime':
-          return timeInZone(cellValue, this.timeZone)
+          return timeInZone((cellValue ?? '').replace('T', ' '), this.timeZone)
         case 'actualDepartureTime':
         case 'actualLandingTime':
           return timeInZone((cellValue ?? '').replace('T', ' '), this.timeZone).replace(' ', '\n')