wxjy-hg/wxjy-wxjy-web/src/views/analyze/GoodsEntry.vue

<template>
  <cacp-search-layout>
    <template #search>
      <cacp-search-panel-layout
          :model="state.queryData"
          ref="formRef"
          :rules="rules"
          label-position="left"
          label-width="auto"
          :gutter="30"
          :colSpan="6"
      >
        <el-form-item label="报关单号" prop="entryId">
          <el-input v-model="state.queryData.entryId" clearable />
        </el-form-item>
        <el-form-item label="通关模式" prop="passMode">
          <el-select v-model="state.queryData.passMode" clearable>
            <el-option
                v-for="item in dict.pass_mode"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="运输方式" prop="trafMode">
          <el-select v-model="state.queryData.trafMode" filterable clearable>
            <el-option
                v-for="item in trafMode"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              <span style="float: left">{{ item.label }}</span>
              <span style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
                {{ item.value }}
                  </span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="进出口标识" prop="ieFlag">
          <el-select v-model="state.queryData.ieFlag" clearable>
            <el-option
                v-for="item in dict.ie_flag"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="进出境口岸" prop="iePort">
          <el-select v-model="state.queryData.iePort" filterable
                     clearable>
            <el-option
                v-for="item in iePort"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            >
              <span style="float: left">{{ item.label }}</span>
              <span style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
                {{ item.value }}
                  </span>
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="隶属海关" prop="customsCode" v-show="state.isSelect">
          <el-select v-model="state.queryData.customsCode"
                     clearable>
            <el-option
                v-for="item in dict.affiliation_customs_info"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="监管方式" prop="tradeMode">
          <el-select v-model="state.queryData.tradeMode" clearable>
            <el-option
                v-for="item in tradeMode"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              <span style="float: left">{{ item.label }}</span>
              <span style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
                {{ item.value }}
                  </span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="报关模式" prop="declMode">
          <el-select v-model="state.queryData.declMode"
                     clearable>
            <el-option
                v-for="item in dict.decl_mode"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="是否查验" prop="checkFlag">
          <el-select v-model="state.queryData.checkFlag"
                     clearable>
            <el-option
                v-for="item in dict.yes_no"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="结关开始时间" prop="beginReleaseDate">
          <el-date-picker type="date" value-format="YYYY-MM-DD" v-model="state.queryData.beginReleaseDate"
                          :disabled-date="beginDatePickerOptions" clearable />
        </el-form-item>
        <el-form-item label="结关结束时间" prop="endReleaseDate">
          <el-date-picker type="date" value-format="YYYY-MM-DD" v-model="state.queryData.endReleaseDate"
                          :disabled-date="endDatePickerOptions" clearable />
        </el-form-item>
        <template #buttonGroup>
          <el-button type="primary" @click="onSearch">查询</el-button>
          <el-button type="info" @click="onReset">重置</el-button>
        </template>
      </cacp-search-panel-layout>
    </template>
    <cacp-complex-table
        :actions="actions"
        :data="tableData"
        :pagination="tablePagination"
        :actionsWidth="50"
        @on-page-change="onPageChange"
        @on-size-change="onSizeChange"
        :loading="loading"
    >
      <!-- 动态渲染所有列 -->
      <template v-for="column in dynamicColumns.visibleColumns.value" :key="column.key">
        <el-table-column v-bind="getColumnProps(column)">
          <template #default="scope">
            <template v-if="column.isDict">
              <dict-tag
                :options="getDictOptions(column.dictKey!)"
                :dictValue="scope.row[column.property!]"
                :whole-match="column.key === 'goodsType'"
              />
            </template>
            <template v-else-if="column.isDate">
              {{ scope.row[column.property!] ? dayjs(scope.row[column.property!]).format('YYYY-MM-DD HH:mm:ss'):'' }}
            </template>
            <template v-else-if="getFormatter(column.key)">
              {{ getFormatter(column.key)!(scope.row[column.property!]) }}
            </template>
            <template v-else>
              {{ scope.row[column.property!] }}
            </template>
          </template>
        </el-table-column>
      </template>
    </cacp-complex-table>

    <!-- 动态列设置对话框 -->
    <DynamicColumnDialog
      v-model="showColumnDialog"
      :width="'70%'"
      :columns="allColumnConfigs"
      :selected-keys="dynamicColumns.selectedKeys.value"
      @update:selected-keys="dynamicColumns.updateSelectedKeys"
    />
  </cacp-search-layout>
</template>
<script setup lang="ts">
import { useLoading } from '@cacp/ui'
import { exportList, getList} from '@/apis/analyze/goodsEntry'
import type {EntryQuery, Entry} from '@/types/analyze/goodsEntry'
import config from '@/config'
import { getBaseCodeList } from '@/apis/base/baseCode'

import dayjs from 'dayjs'

import {
  SuccessResultCode,
  useComplexTable,
  type SearchPanelLayoutInstance,
  type TableAction
} from '@cacp/ui'
import type { FormRules } from 'element-plus'
import { ref, reactive, onBeforeMount } from 'vue'
import { useRouter } from 'vue-router'
import { permissionStatus } from '@/utils/globalPermission'
import { useDictType } from '@/components/useDict'
import { useCoreStore } from '@/stores'
import DictTag from "@/components/DictTag/dictTag.vue";
import DynamicColumnDialog, { type ColumnConfig } from '@/components/DynamicColumnSelector/DynamicColumnDialog.vue'
import { useDynamicColumns } from '@/hooks/useDynamicColumns'
const coreStore = useCoreStore()

interface State {
  queryData: EntryQuery
  isSelect: boolean
}
const { loading, setLoading } = useLoading()
const { dict } = useDictType('affiliation_customs_info', 'proc_idea', 'proc_result', 'yes_no', 'decl_mode', 'pass_mode', 'ie_flag','goods_type')
const tableHooks = useComplexTable<Entry>(config)
const { tableData, tablePagination, setPagination, setPageIndex, setPageSizes } = tableHooks
const router = useRouter()

const formRef = ref<SearchPanelLayoutInstance>()
//基础数据返回jsonObject
const iePort = ref([]);
const trafMode = ref([]);
const tradeMode = ref([]);
const tradeCountry = ref([]);
const countryIso = ref([]);

const now = dayjs();

const endDatePickerOptions = (time:Date) => {
  if (!state.queryData.beginReleaseDate) return false // 如果没有选择开始日期，结束日期不受限制
  return time.getTime() < new Date(state.queryData.beginReleaseDate).getTime() - 8.64e7;//如果没有后面的-8.64e7就是不可以选择今天的
}

const beginDatePickerOptions = (time:Date) => {
  if (!state.queryData.endReleaseDate) return false // 如果没有选择开始日期，结束日期不受限制
  return time.getTime() > new Date(state.queryData.endReleaseDate).getTime() - 8.64e6;//如果没有后面的-8.64e6就是不可以选择今天的
}
// 定义所有列的配置
const allColumnConfigs: ColumnConfig[] = [
  {
    key: 'entryId',
    property: 'entryId',
    label: '报关单号',
    width: 160,
    sortable: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'passMode',
    property: 'passMode',
    label: '通关模式',
    width: 80,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDict: true,
    dictKey: 'pass_mode'
  },
  {
    key: 'trafMode',
    property: 'trafMode',
    label: '运输方式',
    width: 80,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'ieFlag',
    property: 'ieFlag',
    label: '出入境标志',
    width: 90,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDict: true,
    dictKey: 'ie_flag'
  },
  {
    key: 'iePort',
    property: 'iePort',
    label: '进出境口岸',
    width: 100,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'customsCode',
    property: 'customsCode',
    label: '隶属海关',
    width: 100,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDict: true,
    dictKey: 'affiliation_customs_info'
  },
  {
    key: 'tradeMode',
    property: 'tradeMode',
    label: '监管方式',
    width: 80,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'declMode',
    property: 'declMode',
    label: '报关模式',
    width: 80,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDict: true,
    dictKey: 'decl_mode'
  },
  {
    key: 'tradeCountry',
    property: 'tradeCountry',
    label: '贸易国别',
    width: 80,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'ieDate',
    property: 'ieDate',
    label: '进出口时间',
    width: 150,
    sortable: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDate: true
  },
  {
    key: 'declDate',
    property: 'declDate',
    label: '申报时间',
    width: 150,
    sortable: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDate: true
  },
  {
    key: 'releaseDate',
    property: 'releaseDate',
    label: '结关时间',
    width: 150,
    sortable: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true,
    isDate: true
  },
  {
    key: 'declAdvanceFlag',
    property: 'declAdvanceFlag',
    label: '是否提前申报',
    width: 110,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'yes_no'
  },
  {
    key: 'acceptDate',
    property: 'acceptDate',
    label: '自动受理时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'exInPortDate',
    property: 'exInPortDate',
    label: '货物进港时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'orderReceiveDate',
    property: 'orderReceiveDate',
    label: '现场接单时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'certRlsDate',
    property: 'certRlsDate',
    label: '单证放行时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'preReleaseDate',
    property: 'preReleaseDate',
    label: '担保放行时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'examDate',
    property: 'examDate',
    label: '转关数据发送时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'checkDate',
    property: 'checkDate',
    label: '转关数据核销时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'assessStartDate',
    property: 'assessStartDate',
    label: '现场验估时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'assessEndDate',
    property: 'assessEndDate',
    label: '验估处置完毕时间',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'newTwoStepFlag',
    property: 'newTwoStepFlag',
    label: '是否新两步申报',
    width: 120,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'yes_no'
  },

  // 单位信息组
  {
    key: 'consignCode',
    property: 'consignCode',
    label: '境内收发货人代码',
    width: 130,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'consignName',
    property: 'consignName',
    label: '境内收发货人名称',
    width: 130,
    showOverflowTooltip: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'frnConsignCode',
    property: 'frnConsignCode',
    label: '境外收发货人代码',
    width: 130,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'frnConsignName',
    property: 'frnConsignName',
    label: '境外收发货人名称(中文)',
    width: 170,
    showOverflowTooltip: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'agentCode',
    property: 'agentCode',
    label: '申报单位代码',
    width: 110,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'agentName',
    property: 'agentName',
    label: '申报单位名称',
    width: 110,
    showOverflowTooltip: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'ownerCode',
    property: 'ownerCode',
    label: '生产销售单位代码',
    width: 130,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'ownerName',
    property: 'ownerName',
    label: '生产销售单位名称',
    width: 130,
    showOverflowTooltip: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },

  // 货运信息组
  {
    key: 'grossWt',
    property: 'grossWt',
    label: '货运量毛重',
    width: 90,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'netWt',
    property: 'netWt',
    label: '货运量净重',
    width: 90,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'rmbPrice',
    property: 'rmbPrice',
    label: '货运值人民币(总)',
    width: 130,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'usdPrice',
    property: 'usdPrice',
    label: '货运值美元(总)',
    width: 130,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },

  // 时效信息组
  {
    key: 'orderReceiveCost',
    property: 'orderReceiveCost',
    label: '接单耗时(小时)',
    width: 120,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'cuCost',
    property: 'cuCost',
    label: '海关通关时间(小时)',
    width: 140,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'totalCost',
    property: 'totalCost',
    label: '整体通关时间(小时)',
    width: 140,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: true
  },
  {
    key: 'beforeDeclCost',
    property: 'beforeDeclCost',
    label: '申报前准备时间(小时)',
    width: 150,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },
  {
    key: 'noteS',
    property: 'noteS',
    label: '备注',
    showOverflowTooltip: true,
    groupKey: 'entry',
    groupTitle: '报关单信息',
    defaultVisible: false
  },

  // 查验信息组
  {
    key: 'checkFlag',
    property: 'checkFlag',
    label: '是否查验',
    width: 80,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'yes_no'
  },
  {
    key: 'checkCustomsCode',
    property: 'checkCustomsCode',
    label: '查验海关',
    width: 100,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'affiliation_customs_info'
  },
  {
    key: 'manCreateTime',
    property: 'manCreateTime',
    label: '查验指令下达时间',
    width: 150,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'manChkTimeStart',
    property: 'manChkTimeStart',
    label: '查验开始时间',
    width: 150,
    sortable: true,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'manChkTimeEnd',
    property: 'manChkTimeEnd',
    label: '查验结束时间',
    width: 150,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDate: true
  },
  {
    key: 'manProcResult',
    property: 'manProcResult',
    label: '处理结果',
    width: 80,
    showOverflowTooltip: true,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'proc_result'
  },
  {
    key: 'manProcIdea',
    property: 'manProcIdea',
    label: '处理意见',
    width: 80,
    showOverflowTooltip: true,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'proc_idea'
  },
  {
    key: 'profVerifyFlag',
    property: 'profVerifyFlag',
    label: '是否专业审单',
    width: 110,
    groupKey: 'inspection',
    groupTitle: '查验信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'yes_no'
  },

  // 商品信息组
  {
    key: 'gno',
    property: 'gno',
    label: '商品项号',
    width: 80,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: true
  },
  {
    key: 'iqCode',
    property: 'iqCode',
    label: '检验检疫编码',
    width: 120,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'codeTs',
    property: 'codeTs',
    label: '商品编码',
    width: 100,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: true
  },
  {
    key: 'gname',
    property: 'gname',
    label: '商品名称',
    width: 100,
    showOverflowTooltip: true,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: true
  },
  {
    key: 'gmodel',
    property: 'gmodel',
    label: '规格型号',
    width: 100,
    showOverflowTooltip: true,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: true
  },
  {
    key: 'qty1',
    property: 'qty1',
    label: '第一(法定)数量',
    width: 120,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'rmbPriceList',
    property: 'rmbPriceList',
    label: '商品货运值人民币',
    width: 130,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'usdPriceList',
    property: 'usdPriceList',
    label: '商品货运值美元',
    width: 130,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'gCertFlag',
    property: 'gCertFlag',
    label: '每项商品需要监管证件',
    width: 160,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'ungid',
    property: 'ungid',
    label: 'UN编码',
    width: 70,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'ungFlag',
    property: 'ungFlag',
    label: '非危险化学品',
    width: 110,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false,
    isDict: true,
    dictKey: 'yes_no'
  },
  {
    key: 'ungModel',
    property: 'ungModel',
    label: '危包规格',
    width: 110,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'ungClassify',
    property: 'ungClassify',
    label: '危包类别',
    width: 80,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'ungGName',
    property: 'ungGName',
    label: '危险货物名称',
    width: 110,
    showOverflowTooltip: true,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'productCharCode',
    property: 'productCharCode',
    label: '货物属性代码',
    width: 110,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: false
  },
  {
    key: 'goodsType',
    property: 'goodsType',
    label: '危险品类型',
    width: 130,
    groupKey: 'goods',
    groupTitle: '商品信息',
    defaultVisible: true,
    isDict: true,
    dictKey: 'goods_type'
  }
];

// 使用动态列 Hook
const dynamicColumns = useDynamicColumns({
  storageKey: 'goods_entry_columns',
  defaultVisibleKeys: allColumnConfigs
    .filter(col => col.defaultVisible)
    .map(col => col.key),
  columns: allColumnConfigs
})

// 对话框显示状态
const showColumnDialog = ref(false)




const state = reactive<State>({
  queryData: {
    entryId: '',
    beginReleaseDate: now.subtract(1, 'month').format('YYYY-MM-DD'),
    endReleaseDate: now.format('YYYY-MM-DD'),
    ieFlag: '',
    iePort: '',
    customsCode: '',
    passMode: '',
    trafMode: '',
    tradeMode: '',
    declMode: '',
    checkFlag: '',
    goodsType: '2'
  },
  isSelect: false,
})
const rules = reactive<FormRules<EntryQuery>>({
  beginReleaseDate: [{ required: true, message: '请输入结关开始时间', trigger: 'change' }],
  endReleaseDate: [{ required: true, message: '请输入结关结束时间', trigger: 'change' }]
})

const actions = <Array<TableAction>>[
  {
    key: '1',
    text: '查看',
    onclick: onView,
    limit: permissionStatus('one', 'GOODS_ENTRY_VIEW_BT'),
    type: 'primary'
  },
  {
    key: '2',
    text: '动态列设置',
    onclick: onColumnsSelector,
    limit: 'none',
    type: 'primary'
  },
  {
    key: '3',
    text: '导出',
    confirm: true,
    onclick: onExportData,
    limit: permissionStatus('none', 'GOODS_ENTRY_EXPORT_BT'),
    type: 'primary'
  },
]

const getColumnProps = (column: any) => {
  // 类型断言为 ColumnConfig
  const col = column as ColumnConfig

  const props: Record<string, any> = {
    property: col.property || col.key,
    label: col.label
  }

  if (col.width) props.width = col.width
  if (col.sortable) props.sortable = col.sortable
  if (col.showOverflowTooltip) props['show-overflow-tooltip'] = col.showOverflowTooltip

  return props
}


function onSearch() {
  onPageChange(1)
}

function onReset() {
  formRef.value.resetFields()
  onPageChange(1)
}


function onColumnsSelector() {
  showColumnDialog.value = true;
}

function onView(row: Entry) {
  router.push({
    path: '/get-goods',
    query: {
      entryId: row.entryId
    }
  })
}

function onPageChange(page: number) {
  setPageIndex(page)
  onLoadData()
}
function onSizeChange(size: number) {
  setPageSizes(size)
  onLoadData()
}

// 运输方式
function formatTrafMode(code: string): string {
  const result = trafMode.value.find((item) => item.value == code)
  if (result) {
    return result.label
  }
  return ''
}

// 监管方式
function formatTradeMode(code: string): string {
  const result = tradeMode.value.find((item) => item.value == code)
  if (result) {
    return result.label
  }
  return ''
}

// 监管方式
function formatCountryIso(code: string): string {
  const result = countryIso.value.find((item) => item.value == code)
  if (result) {
    return result.label
  }
  return ''
}

// 进出境口岸
function formatIePort(code: string): string {
  const result = iePort.value.find((item) => item.value == code)
  if (result) {
    return result.label
  }
  return ''
}

// 获取字典选项
const getDictOptions = (dictKey: string) => {
  return dict.value?.[dictKey] || []
}

// 根据列键获取格式化函数
const getFormatter = (key: string): ((value: any) => string) | undefined => {
  const formatters: Record<string, (value: any) => string> = {
    'trafMode': formatTrafMode,
    'tradeMode': formatTradeMode,
    'tradeCountry': formatCountryIso,
    'iePort': formatIePort
  }

  return formatters[key]
}

// 加载数据
async function onLoadData() {
  const loginCustomsCode = coreStore.currentUser.customsCode;
  if("4700" === loginCustomsCode){
    state.isSelect = true;
  }else{
    state.queryData.customsCode = loginCustomsCode;
    state.isSelect = false;
  }
  const query = { ...state.queryData, pageIndex: tablePagination.currentPage, pageSize: tablePagination.pageSize }
  setLoading(true)
  const res = await getList(query)
  if (res.code == SuccessResultCode) {
    setPagination(res.data)
  }
  setLoading(false)
}

// 加载数据
async function onExportData() : Promise<void>{
  const query = { ...state.queryData,exportHeadList:dynamicColumns.selectedKeys.value.toString()}
  await exportList(query);
}

async function getTrafMode() {
  const traf = await getBaseCodeList("TransitMode")
  if (traf.code == SuccessResultCode) {
    trafMode.value = traf.data
  }
}

async function getCustoms() {
  const traf = await getBaseCodeList("customsCode")
  if (traf.code == SuccessResultCode) {
    iePort.value = traf.data
  }
}

async function getTradeMode() {
  const traf = await getBaseCodeList("tradeCode")
  if (traf.code == SuccessResultCode) {
    tradeMode.value = traf.data
  }
}

async function getTradeCountry() {
  const traf = await getBaseCodeList("countryCode")
  if (traf.code == SuccessResultCode) {
    tradeCountry.value = traf.data
  }
}

async function getCountryIso() {
  const traf = await getBaseCodeList("countryIsoE")
  if (traf.code == SuccessResultCode) {
    countryIso.value = traf.data
  }
}

onBeforeMount(async () => {
  await Promise.all([ getCustoms(),getTrafMode(),getTradeMode(),getTradeCountry(),getCountryIso()])
  setTimeout(() => {
    onLoadData()
  }, 500)
//  console.log(dict);
})
</script>