123

package.json

@@ -28,6 +28,8 @@
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",
+    "pnpm": "^9.10.0",
+    "svg-baker-runtime": "^1.4.7",
     "vis": "^4.21.0-EOL",
     "vue": "2.6.10",
     "vue-count-to": "^1.0.13",

src/views/lessRegistrationBagtag/index.vue

@@ -0,0 +1,772 @@
+<template>
+  <div class="upload">
+    <div class="upload-wrapper left">
+      <header class="upload-header">
+        <div class="flex">
+          <div class="manageTitle">{{ title2 }}</div>
+          <div>
+            <el-date-picker v-model="input" size="small" value-format="yyyy-MM-dd" type="date"
+              :picker-options="dateRangePickerOptions" placeholder="选择日期" @change="dateChange()" />
+
+            <el-button class="btn-refresh" type="primary" icon="el-icon-refresh" @click="getTableData()" />
+          </div>
+        </div>
+      </header>
+      <main class="upload-main">
+        <div class="upload-main-content flex-wrap">
+          <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
+            element-loading-background="rgba(0, 0, 0, 0.8)" class="upload-main-content-left">
+            <el-table :data="tableData" border stripe fit height="100%" class="upload-table">
+              <el-table-column v-for="column in tableColumns" :key="column.key" :prop="column.prop"
+                :label="column.label">
+                <template slot-scope="scope">
+                  <el-tooltip v-if="column.showTooltip" class="item" effect="dark" placement="top-start">
+                    <div slot="content" class="tooltip-content">
+                      {{
+                        formatter(
+                          scope.row,
+                          scope.column,
+                          scope.row[scope.column.property]
+                        )
+                      }}
+                    </div>
+                    <div class="tooltip-trigger">
+                      {{
+                        formatter(
+                          scope.row,
+                          scope.column,
+                          scope.row[scope.column.property]
+                        )
+                      }}
+                    </div>
+                  </el-tooltip>
+                  <span v-else>
+                    {{
+                      formatter(
+                        scope.row,
+                        scope.column,
+                        scope.row[scope.column.property]
+                      )
+                    }}
+                  </span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作">
+                <template slot-scope="scope">
+                  <div class="hd-td">
+                    <el-button size="small" @click="remove(scope.row)" type="danger">删除</el-button>
+                  </div>
+                </template>
+              </el-table-column>
+              <template #empty>
+                <NoData :image-width="230" :image-height="160" />
+              </template>
+            </el-table>
+          </div>
+        </div>
+      </main>
+    </div>
+    <div class="upload-wrapper right">
+      <header class="upload-header">
+        <div class="flex">
+          <div class="manageTitle">{{ title }}</div>
+          <div>
+            <el-select style="width: 80px;margin-right: 5px;" v-model="typeValue" @change="typeChange()" size="small"
+              placeholder="类型">
+              <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value">
+              </el-option>
+            </el-select>
+            <el-date-picker style="width: 140px;margin-right: 5px;" v-model="input" size="small"
+              value-format="yyyy-MM-dd" type="date" :picker-options="dateRangePickerOptions" placeholder="日期"
+              @change="dateChange()" />
+            <el-select style="width: 100px;margin-right: 5px;" filterable v-model="airPortValue" size="small"
+              placeholder="航站" @change="airPortChange()">
+              <el-option v-for="item in airPortOptions" :key="item.IATACode" :label="item.IATACode"
+                :value="item.IATACode">
+              </el-option>
+            </el-select>
+            <el-select style="width: 100px;margin-right: 5px;" clearable filterable v-model="flightValue"
+              @clear="flightClear()" size="small" placeholder="航班" @change="flightChange()">
+              <el-option v-for="item in flightOptions" :key="item.carrierFlights" :label="item.carrierFlights"
+                :value="item.carrierFlights">
+              </el-option>
+            </el-select>
+            <el-select style="width: 140px;" clearable filterable v-model="baggageValue" size="small"
+              @clear="baggageClear()" v-if="typeValue=='1'" placeholder="行李牌号" @change="baggageChange()">
+              <el-option v-for="item in baggageOptions" :key="item.luggageNum" :label="item.luggageNum"
+                :value="item.luggageNum">
+              </el-option>
+            </el-select>
+            <el-button class="btn-refresh" type="primary" icon="el-icon-search" @click="getTableData2()" />
+          </div>
+        </div>
+      </header>
+      <main class="upload-main">
+        <div class="upload-main-content flex-wrap">
+          <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
+            element-loading-background="rgba(0, 0, 0, 0.8)" class="upload-main-content-right">
+            <el-table
+              :data="tableData2" border stripe fit height="100%" class="upload-table">
+              </el-table-column>
+              <el-table-column v-for="column in tableColumns2" :key="column.key" :prop="column.prop"
+                :label="column.label">
+                <template slot-scope="scope">
+                  <el-tooltip v-if="column.showTooltip" class="item" effect="dark" placement="top-start">
+                    <div slot="content" class="tooltip-content">
+                      {{
+                        formatter(
+                          scope.row,
+                          scope.column,
+                          scope.row[scope.column.property]
+                        )
+                      }}
+                    </div>
+                    <div class="tooltip-trigger">
+                      {{
+                        formatter(
+                          scope.row,
+                          scope.column,
+                          scope.row[scope.column.property]
+                        )
+                      }}
+                    </div>
+                  </el-tooltip>
+                  <span v-else>
+                    {{
+                      formatter(
+                        scope.row,
+                        scope.column,
+                        scope.row[scope.column.property]
+                      )
+                    }}
+                  </span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作">
+                <template slot-scope="scope">
+                  <div class="hd-td">
+                    <el-button size="small" @click="add(scope.row)" type="defult">添加</el-button>
+                  </div>
+                </template>
+              </el-table-column>
+              <template #empty>
+                <NoData :image-width="230" :image-height="160" />
+              </template>
+            </el-table>
+          </div>
+        </div>
+      </main>
+    </div>
+  </div>
+</template>
+
+<script>
+  import {
+    parseTime
+  } from '@/utils'
+  import {
+    UploadFile,
+    WhatQuery
+  } from '@/api/temp'
+  import {
+    newData,
+    moveData
+  } from '@/api/webApi'
+  import NoData from '@/components/nodata/index.vue'
+
+  const acceptTypes = ['xlsx', 'xls']
+  const acceptTypesStr = acceptTypes.reduce((prevStr, currStr) => {
+    return `${prevStr}${prevStr ? ',' : ''}.${currStr}`
+  }, '')
+
+  const units = ['B', 'KB', 'MB', 'GB']
+  const getUnit = (size, callTime = 0) => {
+    if (size < 1024) {
+      return `${size}${units[callTime]}`
+    }
+    return getUnit(size / 1024, callTime + 1)
+  }
+
+  export default {
+    name: 'Upload',
+    components: {
+      NoData
+    },
+    data() {
+      return {
+        baggageValue: "",
+        baggageOptions: [],
+        flightValue: "",
+        flightOptions: [],
+        airPortValue: "PEK",
+        airPortOptions: [],
+        typeValue: "0",
+        typeOptions: [{
+          label: "整班",
+          value: "0"
+        }, {
+          label: "行李",
+          value: "1"
+        }],
+        title: '选择行李',
+        acceptTypesStr: acceptTypesStr,
+        totalProgressList: [],
+        checkedAll: false,
+        limit: 10,
+        title2: '可申报行李数据',
+        flightDate: new Array(2).fill(parseTime(new Date(), '{y}-{m}-{d}')),
+        dateRangePickerOptions: {
+          onPick: this.dateRangePickHandler,
+          disabledDate: this.dateRangeDisabled,
+        },
+        input: this.currDate,
+        tableColumns: [{
+            prop: 'carrierFlightsDate',
+            label: '航班日期',
+          },
+          {
+            prop: 'carrierFlights',
+            label: '航班号',
+          },
+          {
+            prop: 'luggageNum',
+            label: '行李牌号',
+          }
+        ],
+        tableColumns2: [{
+            prop: 'carrierFlightsDate',
+            label: '航班日期',
+          },
+          {
+            prop: 'carrierFlights',
+            label: '航班号',
+          }
+        ],
+        tableData: [],
+        tableData2: [],
+        tableData2Old: [],
+        stateData: [],
+        loading: false,
+        loading1: false,
+        currentCell: null,
+      }
+    },
+    computed: {
+      currentProgressNum() {
+        return this.totalProgressList.reduce((prevCount, currentProgress) => {
+          return currentProgress.state > 0 ? prevCount : prevCount + 1
+        }, 0)
+      },
+      exceed() {
+        return this.currentProgressNum >= this.limit
+      },
+      currDate() {
+        return function() {
+          return parseTime(new Date(), '{y}-{m}-{d}')
+        }
+      },
+      capData() {
+        const val = this.input
+        return this.stateData.filter(
+          data => !val || (data.thedate && data.thedate.includes(val))
+        )
+      },
+    },
+    // watch: {
+    //   flightDate: {
+    //     handler () {
+    //       this.getTableData()
+    //     },
+    //     deep: true,
+    //     immediate: true,
+    //   },
+    // },
+    created() {
+      this.input = parseTime(new Date(), '{y}-{m}-{d}');
+      this.getTableData()
+      this.getAirPort()
+      this.getFlight()
+    },
+    methods: {
+      remove(row){
+        this.$confirm("是否移除当条可申报数据?", "提示", {
+            confirmButtonText: "确定",         // 确认按钮文本
+            cancelButtonText: "取消",          // 取消按钮文本
+            type: "warning",                   // 提示类型（警告）
+          })
+          .then(() => {
+            this.removeData(row)
+          })
+      },
+      async removeData(row){
+        const {
+          code,
+          returnData
+        } = await moveData({
+          serviceId: "8200227",
+          dataContent: [row],
+          "event": "3"
+        })
+        this.getTableData()
+      },
+      add(row){
+        this.$confirm("是否添加为可申报数据?", "提示", {
+            confirmButtonText: "确定",         // 确认按钮文本
+            cancelButtonText: "取消",          // 取消按钮文本
+            type: "warning",                   // 提示类型（警告）
+          })
+          .then(() => {
+            this.sendData(row)
+          })
+      },
+      async sendData(row){
+        if(this.typeValue == "0"){
+          const {
+            code,
+            returnData
+          } = await newData({
+            serviceId: "8200227",
+            dataContent: [{
+              "Value": {
+                    "carrierFlights": row.carrierFlights,
+                    "carrierFlightsDate": row.carrierFlightsDate
+                }
+            }],
+            "event": "1"
+          })
+        }
+        else{
+          const {
+            code,
+            returnData
+          } = await newData({
+            serviceId: "8200227",
+            dataContent: [{
+              "Value": {
+                    "carrierFlights": row.carrierFlights,
+                    "carrierFlightsDate": row.carrierFlightsDate,
+                    "luggageNum": row.luggageNum
+                }
+            }],
+            "event": "1"
+          })
+        }
+        this.getTableData()
+      },
+      flightClear() {
+        if (this.typeValue == "0") {
+          this.tableData2 = this.tableData2Old
+        } else {
+          this.baggageValue = ""
+          this.tableData2 = []
+          this.baggageOptions = []
+        }
+      },
+      baggageClear() {
+        this.tableData2 = this.tableData2Old
+      },
+      baggageChange() {
+        this.tableData2 = this.tableData2Old.filter(item => {
+          return item.luggageNum == this.baggageValue
+        })
+      },
+      async flightChange() {
+        if (this.typeValue == "0") {
+          this.tableData2 = this.tableData2Old.filter(item => {
+            return item.carrierFlights == this.flightValue
+          })
+        } else {
+          this.baggageValue = ""
+          try {
+            const {
+              code,
+              returnData
+            } = await WhatQuery({
+              serviceId: "8200229",
+              "page": 1,
+              "pageSize": 9999,
+              dataContent: [{
+                "carrierFlights": this.flightValue,
+                "carrierFlightsDate": this.input
+              }],
+              "event": "0"
+            })
+            if (Number(code) !== 0) {
+              throw new Error('失败')
+            }
+            this.baggageOptions = returnData;
+            this.tableData2 = returnData
+            this.tableData2Old = returnData
+          } catch (error) {
+            this.$message.error('查询行李失败')
+          }
+        }
+      },
+      typeChange() {
+        this.flightValue = []
+        this.flightOptions = []
+        this.baggageValue = ""
+        this.baggageOptions = []
+        this.tableData2 = []
+        this.tableData2Old = []
+        if (this.typeValue == "0") {
+          this.isShow = false
+          this.tableColumns2 = [{
+              prop: 'carrierFlightsDate',
+              label: '航班日期',
+            },
+            {
+              prop: 'carrierFlights',
+              label: '航班号',
+            }
+          ]
+        } else {
+          this.isShow = true
+          this.tableColumns2 = [{
+              prop: 'carrierFlightsDate',
+              label: '航班日期',
+            },
+            {
+              prop: 'carrierFlights',
+              label: '航班号',
+            },
+            {
+              prop: 'luggageNum',
+              label: '行李牌号',
+            }
+          ]
+        }
+        this.getFlight();
+      },
+      async getAirPort() {
+        try {
+          const {
+            code,
+            returnData
+          } = await WhatQuery({
+            serviceId: "14",
+            "page": 1,
+            "pageSize": 9999,
+            dataContent: [],
+            "event": "0"
+          })
+          if (Number(code) !== 0) {
+            throw new Error('失败')
+          }
+          this.airPortOptions = returnData
+        } catch (error) {
+          this.$message.error('查询航站失败')
+        }
+      },
+      airPortChange() {
+        this.baggageValue = ""
+        this.tableData2 = []
+        this.tableData2Old = []
+        this.getFlight()
+      },
+      async getFlight() {
+        try {
+          const {
+            code,
+            returnData
+          } = await WhatQuery({
+            "serviceId": "8200228",
+            "dataContent": [{
+              "IATACode": this.airPortValue,
+              "carrierFlightsDate": this.input
+            }],
+            "event": "0"
+          })
+          if (Number(code) !== 0) {
+            throw new Error('失败')
+          }
+          this.flightOptions = returnData
+          if (this.typeValue == "0") {
+            this.tableData2 = returnData
+            this.tableData2Old = returnData
+          }
+        } catch (error) {
+          this.$message.error('查询航班失败')
+        }
+      },
+      dateChange() {
+        this.flightValue = []
+        this.flightOptions = []
+        this.baggageValue = ""
+        this.baggageOptions = []
+        this.tableData2 = []
+        this.tableData2Old = []
+        this.flightDate[0] = this.input
+        this.getFlight()
+        this.getTableData()
+      },
+      dateRangePickHandler({
+        maxDate,
+        minDate
+      }) {
+        if (!maxDate) {
+          this.input = minDate
+
+        } else {
+          this.input = null
+        }
+      },
+      dateRangeDisabled(date) {
+        return this.input ?
+          Math.abs(date - this.input) > 2 * 24 * 60 * 60 * 1000 :
+          false
+      },
+      formatter(row, column, cellValue) {
+        const value = String(cellValue ?? '').trim()
+        switch (column.property) {
+          case 'createtime':
+            return value.replace('T', '\n')
+          default:
+            return cellValue
+        }
+      },
+      async getTableData2(){
+        if(this.typeValue=="0"){
+          this.getFlight()
+        }else{
+          this.flightChange()
+        }
+      },
+      async getTableData(cid = null, type = null) {
+        this.loading = true
+        try {
+          const dataContent = []
+          // if (cid) {
+          //   dataContent.push(cid)
+          // } else {
+          //   dataContent.push(
+          //     `${this.flightDate[0]} 00:00:00`,
+          //     `${this.flightDate[1]} 23:59:59`
+          //   )
+          // }
+          if (type === 'fail') {
+            dataContent.push('失败null')
+          }
+          const {
+            code,
+            returnData
+          } = await WhatQuery({
+            serviceId: "8200227",
+            dataContent: [{
+              "carrierFlightsDate": this.flightDate[0]
+            }],
+            "event": "0"
+          })
+          if (Number(code) !== 0) {
+            throw new Error('失败')
+          }
+          this.tableData = returnData
+        } catch (error) {
+          this.$message.error('查询表格失败')
+        }
+        this.loading = false
+      },
+      stateClick(row, column, cell, event) {
+        const {
+          dataObjectId
+        } = row
+        const type = column.property
+        if (dataObjectId && ['total', 'fail'].includes(type) && row[type]) {
+          this.currentCell = `${row.dataObjectId}-${column.property}`
+          this.getTableData(dataObjectId, type)
+        }
+      },
+    },
+  }
+</script>
+
+<style lang="scss" scoped>
+  .upload {
+    width: 100%;
+    height: calc(100vh - 100px);
+    padding: 24px 24px 0;
+    display: flex;
+    justify-content: space-between;
+
+    &-wrapper {
+      width: 50%;
+      padding: 24px 24px 0;
+      background-color: #fff;
+      height: 100%;
+    }
+
+    &-header {
+      display: flex;
+      justify-content: space-between;
+    }
+
+    &-main {
+      height: calc(100% - 32px);
+      padding-top: 30px;
+
+      &-content {
+        height: 100%;
+        padding-bottom: 32px;
+
+        &-left {
+          width: 100%;
+          margin-right: 20px;
+
+          ::v-deep .state-table {
+            .el-table__header {
+              .cell {
+                font-weight: bold;
+                color: #101116;
+                white-space: nowrap;
+              }
+            }
+
+            .cell {
+              text-align: center;
+            }
+          }
+        }
+
+        &-right {
+          flex: 1;
+          width: 100%;
+        }
+      }
+    }
+
+    &-list {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      overflow-x: hidden;
+      overflow-y: auto;
+
+      &-item {
+        &-wrapper {
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+        }
+
+        &-image {
+          margin-right: 16px;
+        }
+
+        &-details {
+          font-size: 14px;
+          font-family: Helvetica, 'Microsoft YaHei';
+
+          >div {
+            height: 16px;
+            line-height: 16px;
+
+            &:first-child {
+              margin-bottom: 6px;
+            }
+          }
+        }
+
+        &-name {
+          color: #303133;
+          margin-right: 16px;
+        }
+
+        &-state {
+          &-success {
+            color: #40a349;
+          }
+
+          &-failure {
+            color: #d53e3e;
+          }
+        }
+
+        &-retry {
+          width: 16px;
+          height: 16px;
+          text-align: center;
+          line-height: 16px;
+          border-radius: 50%;
+          margin-left: 16px;
+          font-size: 14px;
+          color: #2d67e3;
+          cursor: pointer;
+
+          &:hover {
+            background-color: #2d67e3;
+            color: #fff;
+          }
+        }
+
+        &-time {
+          color: #afb4bf;
+        }
+      }
+    }
+
+    ::v-deep .el-table {
+      width: 100%;
+
+      .cell {
+        padding: 0;
+        text-align: center;
+        font-size: 14px;
+        font-family: Helvetica, 'Microsoft YaHei';
+        letter-spacing: 0;
+      }
+
+      .el-table__header-wrapper,
+      .el-table__fixed-header-wrapper {
+        .cell {
+          font-weight: bold;
+          color: #101116;
+          white-space: nowrap;
+        }
+      }
+
+      .pre-line .cell {
+        white-space: pre-line;
+      }
+
+      &.state-table {
+        .el-table__cell {
+          background-color: transparent !important;
+
+          &.cell-click .cell {
+            color: #2d67e3;
+            cursor: pointer;
+          }
+
+          &.cell-current,
+          &:hover {
+            background-color: #d5e4f7 !important;
+          }
+        }
+      }
+    }
+  }
+
+  .upload-header-right {
+    display: flex;
+    align-items: center;
+  }
+
+  .btn-refresh {
+    margin-left: 10px;
+    padding: 0;
+    width: 30px;
+    height: 30px;
+  }
+
+  .tooltip-content {
+    max-width: 500px;
+  }
+
+  .tooltip-trigger {
+    padding: 0 10px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
+</style>

src/views/newBagDetails/components/baggageView.vue

@@ -19,7 +19,8 @@
                   <div :class="activeStepLineDanger(cindex,item)" class="step-circle">
                     <span class="step-name">{{ p.nodeName }}</span>
                   </div>
-                  <div v-if="p.timeValue || p.stateValue || p.loclValue || p.fourSecurity" class="step-info">
+                  <div v-if="p.timeValue || p.stateValue || p.loclValue || p.fourSecurity || p.currentResult" class="step-info">
+                    <div :class="statusClasses(p.currentResult)">{{ p.currentResult }}</div>
                     <div :class="statusClasses(p.stateValue)">{{ p.stateValue }}</div>
                     <span class="step-time">{{ p.timeValue }}</span>
                     <div class="step-location">{{ p.loclValue }}</div>
@@ -175,7 +176,7 @@ export default {
       return function (status) {
         const classes = ['step-status']
         if (typeof status === 'string') {
-          if (status.includes('不正常') || status.includes('不通过')) {
+          if (status.includes('不正常') || status.includes('不通过') || status.includes('取消')) {
             classes.push('step-status-abnormal')
           }
           else if (status.includes('正常') || status.includes('通过')) {
@@ -280,10 +281,14 @@ export default {
       newArr.forEach(item => {
         const { carrierFlights, carrierFlightsDate, outAirport, landAirport, bagStatus } = item
         const index = bagStatus.findIndex(citem => citem.stateProp == 'securityInspectionResults')
+        const index2 = bagStatus.findIndex(citem => citem.stateProp == 'checkState')
         if (index > -1) {
           bagStatus[index]['stateValue'] = this.statusSecurity(item)
           bagStatus[index]['fourSecurity'] = item.fourSecurity
         }
+        if(index2>-1){
+          bagStatus[index2]['currentResult'] = item.currentResult
+        }
         const reqItem = this.getQueryList(SERVICE_ID.baggageTime, {
           carrierFlights,
           carrierFlightsDate,
@@ -464,4 +469,4 @@ export default {
     }
   }
 }
-</style>
+</style>