portFlightInquiryRealTime 出港航班查询实时

src/views/compositeSearch/portFlightInquiryRealTime/api/CurrentPageApi.js

@@ -0,0 +1,11 @@
+import BaseApi from '@/api/base/BaseApi';
+
+class CurrentPageApi extends BaseApi {
+  constructor() {
+    super({
+      baseUrl: 'user/sysDict',
+    });
+  }
+}
+export default new CurrentPageApi();
+// # sourceMappingURL=CurrentPageApi.js.map

src/views/compositeSearch/portFlightInquiryRealTime/api/CurrentPageApi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CurrentPageApi.js","sourceRoot":"","sources":["CurrentPageApi.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,oBAAoB,CAAC;AAEzC,MAAM,cAAe,SAAQ,OAAO;IAClC;QACE,KAAK,CAAC;YACJ,OAAO,EAAE,cAAc;SACxB,CAAC,CAAC;IACL,CAAC;CACF;AAED,eAAe,IAAI,cAAc,EAAE,CAAC"}

src/views/compositeSearch/portFlightInquiryRealTime/api/CurrentPageApi.ts

@@ -0,0 +1,35 @@
+import BaseApi from '@/api/base/BaseApi';
+import request from '@/api/request';
+import type { ResponseData } from '@/api/request/index.d';
+
+class CurrentPageApi extends BaseApi {
+  constructor() {
+    super({
+      baseUrl: '',
+    });
+  }
+
+  /**
+   * 入港航班查询
+   * @param data
+   */
+  page(data: any): Promise<ResponseData<any>> {
+    return request.post(`${this.baseUrl}/mawb/iMawbList`, data);
+  }
+
+  get(data: any): Promise<ResponseData<any>> {
+    return request.get(`${this.baseUrl}/mawb/fwbInfo?mawbId=${data}`);
+  }
+
+  getMawbCount(data: any): Promise<ResponseData<any>> {
+    return request.post(`${this.baseUrl}/mawb/iMawbCount`, data);
+  }
+  /* /mawb/fwbInfo?mawbId=1
+
+  get(data: any): Promise<ResponseData<any>> {
+    return request.get(`${this.baseUrl}/inbound/info?mawbId=`, data);
+  }
+*/
+}
+
+export default new CurrentPageApi();

src/views/compositeSearch/portFlightInquiryRealTime/index.vue

@@ -0,0 +1,385 @@
+<template>
+  <div class="page-content">
+    <div class="search-header">
+      <div class="search-header-left">
+        <div class="search-header-left-item" v-if="searchType=='1'">
+          <a-form-item label="航班号">
+            <a-input v-model="formState.flight.flightNo" />
+          </a-form-item>
+        </div>
+        <!-- <div class="search-header-left-item" style="padding-bottom: 20px;" v-if="searchType=='3'">
+          <a-select ref="select" :options="timeTypeOptions" v-model="timeType" style="width: 120px"
+            @change="timeTypeChange()">
+          </a-select>
+        </div> -->
+        <div class="search-header-left-item" v-if="searchType!='2'">
+          <a-form-item label="航班日期">
+            <a-range-picker v-model="formState.flight.flightDate" />
+          </a-form-item>
+        </div>
+        <div class="search-header-left-item" v-if="searchType=='2'">
+          <a-form-item label="运单号">
+            <a-input v-model="formState.flight.billNo" />
+          </a-form-item>
+        </div>
+        <div class="search-header-left-item searchType">
+          <a-radio-group v-model="searchType" name="radioGroup" :options="searchTypeOption"
+            @change="searchTypeChange()">
+          </a-radio-group>
+        </div>
+      </div>
+      <div class="search-header-right">
+        <div class="search-header-right-item search-header-right-item-box">
+          <a-radio-group v-model="orderType" name="radioGroup" :options="orderTypeOption"
+            @change="searchTypeChange()">
+          </a-radio-group>
+        </div>
+        <div class="search-header-right-item search-header-right-item-box">
+          <a-radio-group v-model="flightType" name="radioGroup" :options="flightTypeOption"
+            @change="searchTypeChange()">
+          </a-radio-group>
+        </div>
+        <div class="search-header-right-item">
+          <a-button type="primary" @click="search()">查询</a-button>
+        </div>
+        <div class="search-header-right-item">
+          <a-button type="primary" @click="downLoad()">导出CSV</a-button>
+        </div>
+      </div>
+    </div>
+    <div class="search-select">
+      <div class="search-select-title">
+        筛选条件
+      </div>
+      <div class="search-select-item">
+        <a-checkbox-group v-model="formState.flight.pickOrder" :options="pickOrderOptions" />
+      </div>
+      <div class="search-select-item">
+        <a-checkbox-group v-model="formState.flight.takeGoods" :options="takeGoodsOptions" />
+      </div>
+      <div class="search-select-item">
+        <a-checkbox-group v-model="formState.flight.release" :options="releaseOptions" />
+      </div>
+      <div class="search-select-item">
+        <a-checkbox-group v-model="formState.flight.partType" :options="partTypeOptions" />
+      </div>
+      <div class="search-select-item2">
+        <div>
+          <a-radio-group v-model="formState.flight.goodsType" name="radioGroup" :options="goodsTypeOption" @change="">
+          </a-radio-group>
+        </div>
+      </div>
+    </div>
+
+    <div class="search-body">
+      <a-table :columns="columns" :data="dataSource"
+        :stripe="true" bordered>
+        <!-- <template #fwb="{ rowIndex }">
+              <a-input v-model="dataSource[rowIndex].fwb" />
+            </template> -->
+        <template #footer>
+          <div class="foot" style="margin-left: 280px;display: flex;flex-direction: row;text-align: center;">
+            合计：
+            <div style="width:104px">0/0T </div>
+            <div style="width:104px">0/0T </div>
+            <div style="width:104px">0/0T </div>
+            <div style="width:104px">0/0T </div>
+          </div>
+        </template>
+      </a-table>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+  const timeType = ref('1');
+  const searchType = ref<string>('1');
+  const orderType = ref<string>('1');
+  const flightType = ref<string>('1');
+  // const timeTypeOptions = ref<SelectProps['options']>([
+  //   {
+  //     value: '1',
+  //     label: '理货时间',
+  //   },
+  //   {
+  //     value: '2',
+  //     label: '放行时间',
+  //   },
+  //   {
+  //     value: '3',
+  //     label: '抵港时间',
+  //   },
+  // ]);
+  const searchTypeOption = ref<RadioGroupProps['options']>([
+    {
+      value: '1',
+      label: '按航班',
+    },
+    {
+      value: '2',
+      label: '按运单',
+    }
+  ]);
+
+  const orderTypeOption = ref<RadioGroupProps['options']>([
+    {
+      value: '1',
+      label: '整单离港',
+    },
+    {
+      value: '2',
+      label: '分批离港',
+    }
+  ]);
+
+  const flightTypeOption = ref<RadioGroupProps['options']>([
+    {
+      value: '1',
+      label: '已配航班',
+    },
+    {
+      value: '2',
+      label: '未配航班',
+    }
+  ]);
+
+  const pickOrderOptions = [
+    { label: '代理已交单', value: '1' },
+    { label: '代理未交单', value: '2' },
+  ];
+
+  const takeGoodsOptions = [
+    { label: '已安检', value: '1' },
+    { label: '未安检', value: '2' },
+  ];
+
+  const releaseOptions = [
+    { label: '海关放行', value: '1' },
+    { label: '未放行', value: '2' },
+  ];
+
+  const partTypeOptions = [
+    { label: '普件', value: '1' },
+    { label: '快件', value: '2' },
+  ];
+
+  const goodsTypeOption = [
+    { label: '鲜活易腐', value: '1' },
+    { label: '生鲜', value: '2' },
+    { label: '危险品', value: '3' },
+    { label: '锂电池', value: '4' },
+    { label: '冷藏冷冻', value: '5' },
+    { label: '高价值', value: '6' },
+    { label: '药品', value: '7' },
+    { label: '提前报关', value: '8' },
+  ];
+
+  const formState = reactive({
+    flight: {
+      flightNo: '',
+      flightDate: '',
+      billNo: '',
+      pickOrder: [],
+      takeGoods: [],
+      damaged: [],
+      release: [],
+      partType: [],
+      orderType: '',
+      goodsType: ''
+    },
+  });
+
+  const columns = [
+    {
+      title: '序号',
+      dataIndex: 'order',
+    },
+    {
+      title: '代理',
+      dataIndex: 'fwb',
+    },
+    {
+      title: '运单信息',
+      dataIndex: 'orderinfo',
+    },
+    {
+      title: '航班号',
+      dataIndex: 'flightNo',
+    },
+    {
+      title: '订舱件重',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '收货件重',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '库存件重',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '上舱件重',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '始发/目的地',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '到场时间',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '收单时间',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '离港时间',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '安检放行',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '海关放行',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: 'SHC',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '舱单备注',
+      dataIndex: 'orderCount',
+    },
+    {
+      title: '备注',
+      dataIndex: 'orderCount',
+    },
+  ];
+
+  const dataSource = [
+    {
+      order: '1',
+      fwb: '正常',
+      orderinfo: '300,000.00',
+      flightNo: 'CA123',
+      orderCount: '1000',
+    },
+    {
+      order: '2',
+      fwb: '缺失',
+      orderinfo: '300,000.00',
+      flightNo: 'CA123',
+      orderCount: '1000',
+    },
+    {
+      order: '3',
+      fwb: '正常',
+      orderinfo: '300,000.00',
+      flightNo: 'CA123',
+      orderCount: '1000',
+    }
+  ];
+
+  const timeTypeChange = function () {
+    console.log(timeType.value)
+  }
+
+  const searchTypeChange = function () {
+    console.log(searchType.value)
+  }
+
+  const search = function () {
+
+  }
+
+  const downLoad = function () {
+
+  }
+</script>
+<style lang="less" scoped>
+  .page-content {
+    width: 100%;
+    height: 100%;
+    padding: 20px;
+
+    .search-header {
+      width: 100%;
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      .search-header-left {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-start;
+        align-items: center;
+        .search-header-left-item {
+          margin-right: 30px;
+        }
+        .searchType{
+          padding-bottom: 20px;
+        }
+      }
+
+      .search-header-right {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-start;
+        align-items: center;
+        .search-header-right-item {
+          margin-right: 20px;
+          padding-bottom: 20px;
+        }
+        .search-header-right-item-box{
+          padding: 10px;
+          margin-top: -20px;
+          border: 1px solid #e5e7eb;
+        }
+      }
+    }
+
+    .search-select {
+      width: 100%;
+      border: 1px solid #e5e7eb;
+      padding: 20px 0;
+      position: relative;
+      display: flex;
+      flex-direction: row;
+      justify-content: space-around;
+
+      .search-select-title {
+        padding: 0 10px;
+        position: absolute;
+        left: 400px;
+        top: -12px;
+        background: #fff;
+        color: rgb(79, 89, 105);
+      }
+
+      .search-select-item {
+        border: 1px solid #e5e7eb;
+        width: 155px;
+        padding: 10px;
+        box-sizing: border-box;
+      }
+
+      .search-select-item2 {
+        border: 1px solid #e5e7eb;
+        padding: 10px;
+        box-sizing: border-box;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+      }
+    }
+
+  }
+  [data-doc-theme='light'] .ant-table-striped :deep(.table-striped) td {
+    background-color: #fafafa;
+  }
+  [data-doc-theme='dark'] .ant-table-striped :deep(.table-striped) td {
+    background-color: rgb(29, 29, 29);
+  }
+</style>