gaoluyang
2 天以前 df1406d0f571972d033dffd6a93fb4b94febeb56
src/views/basicInformation/index.vue
@@ -1,7 +1,8 @@
<template>
  <div> <el-form :inline="true" :model="queryParams" class="search-form">
      <el-form-item label="搜索" v-if="shouldShowSearch">
        <el-input v-model="queryParams.searchAll" :placeholder="searchPlaceholder" clearable />
  <div>
    <el-form :inline="true" :model="queryParams" class="search-form">
      <el-form-item v-if="shouldShowSearch" label="搜索">
        <el-input v-model="queryParams.searchAll" :placeholder="searchPlaceholder" clearable/>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="search">查询</el-button>
@@ -11,58 +12,62 @@
    <el-card>
      <!-- 标签页 -->
      <el-tabs v-model="activeTab" class="info-tabs" @tab-click="handleTabClick">
        <el-tab-pane v-for="tab in tabs" :key="tab.name" :label="tab.label" :name="tab.name" />
        <el-tab-pane v-for="tab in tabs" :key="tab.name" :label="tab.label" :name="tab.name"/>
      </el-tabs>
      <!-- 操作按钮区 -->
      <el-row :gutter="24" class="table-toolbar">
        <el-button type="primary" :icon="Plus" @click="handleAdd">新建</el-button>
        <el-button type="danger" :icon="Delete" @click="handleDelete">删除</el-button>
        <el-button type="info" :icon="Download" @click="handleExport" v-show="canExport">导出</el-button>
        <el-button :icon="Plus" type="primary" @click="handleAdd">新建</el-button>
        <el-button :icon="Delete" type="danger" @click="handleDelete">删除</el-button>
        <el-button @click="jump">admins</el-button>
        <el-button v-show="canExport" :icon="Download" type="info" @click="handleExport">导出</el-button>
      </el-row> <!-- 表格组件 -->
      <div>
        <data-table :loading="loading" :table-data="tableData" :columns="columns"
          @selection-change="handleSelectionChange" @edit="handleEdit" :show-selection="true" :border="true">          <!-- 字段名称列的自定义插槽 - 显示为标签 -->
        <data-table :border="true" :columns="columns" :loading="loading"
                    :show-selection="true" :table-data="tableData" @edit="handleEdit" @selection-change="handleSelectionChange">
          <!-- 字段名称列的自定义插槽 - 显示为标签 -->
          <template v-if="tabName === 'coalQualityMaintenance'" #fieldIds="{ row }">
            <template v-if="typeof row.fieldIds === 'string' && row.fieldIds.includes(',')">
              <el-tag v-for="(field, index) in row.fieldIds.split(',')" :key="index" type="primary" size="small"
                style="margin-right: 4px; margin-bottom: 2px;">
              <el-tag v-for="(field, index) in row.fieldIds.split(',')" :key="index" size="small" style="margin-right: 4px; margin-bottom: 2px;"
                      type="primary">
                {{ getFieldDisplayName(field.trim()) }}
              </el-tag>
            </template>
            <template v-else>
              <el-tag type="primary" size="small">
              <el-tag size="small" type="primary">
                {{ getFieldDisplayName(row.fieldIds) || '--' }}
              </el-tag>
            </template>
          </template>
        </data-table>
      </div>
      <pagination v-if="total > 0" :page="pageNum" :limit="pageSizes" :total="total" @pagination="handPagination"
        :layout="'total, prev, pager, next, jumper'" />
      <pagination v-if="total > 0" :layout="'total, prev, pager, next, jumper'" :limit="pageSizes" :page="pageNum" :total="total"
                  @pagination="handPagination"/>
      <Supplier v-if="tabName === 'supplier'" v-model:copyForm="copyForm"
        v-model:supplierDialogFormVisible="dialogFormVisible" :form="form" :title="title" @submit="handleSubmit"
        @beforeClose="handleBeforeClose" @update:dialogFormVisible="handleDialogFormVisible" :addOrEdit="addOrEdit" />
                v-model:supplierDialogFormVisible="dialogFormVisible" :addOrEdit="addOrEdit" :form="form" :title="title"
                @beforeClose="handleBeforeClose" @submit="handleSubmit"
                @update:dialogFormVisible="handleDialogFormVisible"/>
      <Customer v-if="tabName === 'customer'" v-model:copyForm="copyForm"
        v-model:customerDialogFormVisible="dialogFormVisible" :form="form" :title="title" @submit="handleSubmit"
        :addOrEdit="addOrEdit" @beforeClose="handleBeforeClose" />
      <Coal v-if="tabName === 'coal'" v-model:copyForm="copyForm" v-model:coalDialogFormVisible="dialogFormVisible"
        :form="form" :title="title" :addOrEdit="addOrEdit" @submit="handleSubmit" />
      <coalQualityMaintenance v-if="tabName === 'coalQualityMaintenance'" v-model:copyForm="copyForm"
        v-model:coalQualityMaintenanceDialogFormVisible="dialogFormVisible" :form="form" :title="title"
        :addOrEdit="addOrEdit" @submit="handleSubmit" />
      <coalMeiZhiZiDuanWeiHu v-if="tabName === 'coalMeiZhiZiDuanWeiHu'" v-model:copyForm="copyForm"
        v-model:coalMaintenanceFieldDialogVisible="dialogFormVisible" :form="form" :title="title" :addOrEdit="addOrEdit"
        @submit="handleSubmit" />
                v-model:customerDialogFormVisible="dialogFormVisible" :addOrEdit="addOrEdit" :form="form" :title="title"
                @beforeClose="handleBeforeClose" @submit="handleSubmit"/>
      <Coal v-if="tabName === 'coal'" v-model:coalDialogFormVisible="dialogFormVisible" v-model:copyForm="copyForm"
            :addOrEdit="addOrEdit" :form="form" :title="title" @submit="handleSubmit"/>
      <coalQualityMaintenance v-if="tabName === 'coalQualityMaintenance'" v-model:coalQualityMaintenanceDialogFormVisible="dialogFormVisible"
                              v-model:copyForm="copyForm" :addOrEdit="addOrEdit"
                              :form="form"
                              :title="title" @submit="handleSubmit"/>
      <coalMeiZhiZiDuanWeiHu v-if="tabName === 'coalMeiZhiZiDuanWeiHu'" v-model:coalMaintenanceFieldDialogVisible="dialogFormVisible"
                             v-model:copyForm="copyForm" :addOrEdit="addOrEdit" :form="form"
                             :title="title"
                             @submit="handleSubmit"/>
    </el-card>
  </div>
</template>
<script setup>
// ===== 核心依赖导入 =====
import { ref, reactive, onMounted, computed, getCurrentInstance } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { Plus, Edit, Delete, Download } from "@element-plus/icons-vue";
import {computed, getCurrentInstance, onMounted, reactive, ref, nextTick} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import {Delete, Download, Plus} from "@element-plus/icons-vue";
// ===== 组件导入 =====
import DataTable from "@/components/Table/ETable.vue";
@@ -74,18 +79,20 @@
import coalMeiZhiZiDuanWeiHu from "./mould/coalMeiZhiZiDuanWeiHu.vue";
// ===== API 服务导入 =====
import { getSupply, delSupply } from "@/api/basicInformation/supplier.js";
import { getCoalInfo, delCoalInfo } from "@/api/basicInformation/coal.js";
import { testUserList } from "@/api/tool/publicInterface.js";
import { getAreaOptions } from "@/api/system/area.js";
import { getCustomerList, delCustomer } from "@/api/basicInformation/customer.js";
import { coalField, deleteCoalField } from "@/api/basicInformation/coalFieldMaintenance.js";
import { getCoalFieldList, getCoalPlanList } from "@/api/basicInformation/coalQualityMaintenance";
import {delSupply, getSupply} from "@/api/basicInformation/supplier.js";
import {delCoalInfo, getCoalInfo} from "@/api/basicInformation/coal.js";
import {testUserList} from "@/api/tool/publicInterface.js";
import {getAreaOptions} from "@/api/system/area.js";
import {delCustomer, getCustomerList} from "@/api/basicInformation/customer.js";
import {coalField, deleteCoalField} from "@/api/basicInformation/coalFieldMaintenance.js";
import {getCoalFieldList, getCoalPlanList} from "@/api/basicInformation/coalQualityMaintenance";
const { proxy } = getCurrentInstance();
const {proxy} = getCurrentInstance();
import router from "@/router";
// ===== 响应式状态管理 =====
const jump = () => {
};
// 弹窗控制状态
const dialogFormVisible = ref(false);
const form = ref({});
@@ -124,11 +131,11 @@
// 标签页配置
const tabs = reactive([
  { name: "supplier", label: "供应商信息" },
  { name: "customer", label: "客户信息" },
  { name: "coal", label: "煤种信息" },
  { name: "coalQualityMaintenance", label: "煤质方案" },
  { name: "coalMeiZhiZiDuanWeiHu", label: "煤质字段" }
  {name: "supplier", label: "供应商信息"},
  {name: "customer", label: "客户信息"},
  {name: "coal", label: "煤种信息"},
  {name: "coalQualityMaintenance", label: "煤质方案"},
  {name: "coalMeiZhiZiDuanWeiHu", label: "煤质字段"}
]);
// ===== 工具函数 =====
@@ -178,18 +185,18 @@
 * @description 将地址ID数组转换为可读的地址字符串
 */
const formatAddressArray = (addressIds) => {
  if (!addressMap.value || Object.keys(addressMap.value).length === 0 ||
      !addressIds || !Array.isArray(addressIds) || addressIds.length === 0 ||
  if (!addressMap.value || Object.keys(addressMap.value).length === 0 ||
      !addressIds || !Array.isArray(addressIds) || addressIds.length === 0 ||
      addressIds.every(id => !id)) {
    return '--';
  }
  const addressNames = addressIds.map(id => addressMap.value[id]?.name || '--');
  if (addressNames.every(name => name === '--')) {
    return '--';
  }
  return addressNames.filter(name => name !== '--').join(' / ');
};
@@ -217,7 +224,7 @@
 */
const coalFieldData = async () => {
  try {
    const { data, code } = await getCoalFieldList();
    const {data, code} = await getCoalFieldList();
    if (code === 200) {
      coalFieldList.value = data;
    }
@@ -234,10 +241,10 @@
 */
const getFieldDisplayName = (fieldId) => {
  if (!fieldId) return '--';
  const numId = parseInt(fieldId);
  const matchedField = coalFieldList.value.find(item => item.id === numId);
  return matchedField ? matchedField.fieldName : numId;
};
@@ -256,7 +263,7 @@
const searchPlaceholder = computed(() => {
  const placeholderMap = {
    supplier: "供应商/识别码/详细地址",
    customer: "供应商/识别码/详细地址",
    customer: "供应商/识别码/详细地址",
    coal: "请输入搜索信息",
    coalQualityMaintenance: "请输入搜索信息",
    coalMeiZhiZiDuanWeiHu: "请输入搜索信息"
@@ -268,7 +275,7 @@
 * 是否显示搜索框
 */
const shouldShowSearch = computed(() => {
  return ['supplier', 'customer', 'coal', 'coalQualityMaintenance','coalMeiZhiZiDuanWeiHu'].includes(tabName.value);
  return ['supplier', 'customer', 'coal', 'coalQualityMaintenance', 'coalMeiZhiZiDuanWeiHu'].includes(tabName.value);
});
/**
@@ -287,8 +294,8 @@
 * 供应商表格列配置
 */
const supplierColumns = ref([
  { prop: "supplierName", label: "供应商名称", minWidth: 100 },
  { prop: "taxpayerId", label: "统一人识别号", minWidth: 170 },
  {prop: "supplierName", label: "供应商名称", minWidth: 100},
  {prop: "taxpayerId", label: "统一人识别号", minWidth: 170},
  {
    prop: "bids",
    label: "经营地址",
@@ -299,10 +306,10 @@
      return formatAddressArray(addressIds);
    }
  },
  { prop: "businessAddress", label: "经营详细地址", minWidth: 150 },
  { prop: "bankAccount", label: "开户行", minWidth: 120 },
  { prop: "bankName", label: "银行账号", minWidth: 150 },
  { prop: "contactPerson", label: "联系人", minWidth: 100 },
  {prop: "businessAddress", label: "经营详细地址", minWidth: 150},
  {prop: "bankAccount", label: "开户行", minWidth: 120},
  {prop: "bankName", label: "银行账号", minWidth: 150},
  {prop: "contactPerson", label: "联系人", minWidth: 100},
  {
    prop: "cids",
    label: "联系人地址",
@@ -313,16 +320,16 @@
      return formatAddressArray(addressIds);
    }
  },
  { prop: "contactAddress", label: "联系人详细地址", minWidth: 120 },
  { prop: "createTime", label: "维护日期", minWidth: 120 },
  {prop: "contactAddress", label: "联系人详细地址", minWidth: 120},
  {prop: "updateTime", label: "维护日期", minWidth: 120},
]);
/**
 * 客户表格列配置
 */
const customerColumns = ref([
  { prop: "customerName", label: "客户名称", minWidth: 100 },
  { prop: "taxpayerId", label: "统一人识别号", minWidth: 120 },
  {prop: "customerName", label: "客户名称", minWidth: 100},
  {prop: "taxpayerId", label: "统一人识别号", minWidth: 120},
  {
    prop: "bids",
    label: "经营地址",
@@ -333,11 +340,11 @@
      return formatAddressArray(addressIds);
    }
  },
  { prop: "businessAddress", label: "详细地址", minWidth: 150 },
  { prop: "bankName", label: "开户行", minWidth: 120 },
  { prop: "bankAccount", label: "银行账号", minWidth: 150 },
  { prop: "contactPerson", label: "联系人", minWidth: 100 },
  { prop: "contactPhone", label: "联系人电话", minWidth: 100 },
  {prop: "businessAddress", label: "详细地址", minWidth: 150},
  {prop: "bankName", label: "开户行", minWidth: 120},
  {prop: "bankAccount", label: "银行账号", minWidth: 150},
  {prop: "contactPerson", label: "联系人", minWidth: 100},
  {prop: "contactPhone", label: "联系人电话", minWidth: 100},
  {
    prop: "cids",
    label: "联系人地址",
@@ -348,15 +355,15 @@
      return formatAddressArray(addressIds);
    }
  },
  { prop: "contactAddress", label: "联系人详细地址", minWidth: 150 },
  { prop: "updateTime", label: "维护日期", minWidth: 100 },
  {prop: "contactAddress", label: "联系人详细地址", minWidth: 150},
  {prop: "updateTime", label: "维护日期", minWidth: 100},
]);
/**
 * 煤种表格列配置
 */
const coalColumns = ref([
  { prop: "coal", label: "煤种名称", minWidth: 200 },
  {prop: "coal", label: "煤种名称", minWidth: 200},
  {
    prop: "maintainerId",
    label: "维护人",
@@ -371,14 +378,14 @@
      return userMap.value[cellValue] || '--';
    }
  },
  { prop: "maintenanceDate", label: "维护日期", minWidth: 150 },
  {prop: "maintenanceDate", label: "维护日期", minWidth: 150},
]);
/**
 * 煤质方案表格列配置
 */
const coalQualityMaintenanceColumns = ref([
  { prop: "plan", label: "方案名称", minWidth: 100 },
  {prop: "plan", label: "方案名称", minWidth: 100},
  {
    prop: "fieldIds",
    label: "字段名称",
@@ -392,15 +399,15 @@
      return cellValue || '--';
    }
  },
  { prop: "schemeDesc", label: "字段描述", minWidth: 100 },
  {prop: "schemeDesc", label: "字段描述", minWidth: 100},
]);
/**
 * 煤质字段表格列配置
 */
const coalMeiZhiZiDuanWeiHuColumns = ref([
  { prop: "fieldName", label: "字段名称", minWidth: 200 },
  { prop: "fieldDescription", label: "字段描述", minWidth: 200 },
  {prop: "fieldName", label: "字段名称", minWidth: 200},
  {prop: "fieldDescription", label: "字段描述", minWidth: 200},
]);
// ===== 事件处理函数 =====
@@ -416,7 +423,10 @@
  loading.value = true;
  tabName.value = tab.props.name;
  tableData.value = [];
  pageNum.value = 1;
  pageSizes.value = 10;
  total.value = 0;
  queryParams.searchAll = "";
  // 根据标签页类型设置对应的列配置
  const tabConfig = {
    supplier: () => {
@@ -486,10 +496,10 @@
 */
const handleAddEdit = (currentTabName) => {
  const actionText = addOrEdit.value === "add" ? "新增" : "编辑";
  const tabTitleMap = {
    supplier: "供应商信息",
    customer: "客户信息",
    customer: "客户信息",
    coal: "煤种信息",
    coalQualityMaintenance: "煤质方案维护",
    coalMeiZhiZiDuanWeiHu: "煤质字段维护"
@@ -558,27 +568,27 @@
 */
const handleEdit = (row) => {
  form.value = JSON.parse(JSON.stringify(row));
  // 构建供应商业务地址数组
  if (form.value.bprovinceId && form.value.bdistrictId && form.value.bcityId) {
    form.value.bids = [row.bprovinceId, row.bcityId, row.bdistrictId];
  }
  // 构建供应商联系地址数组
  if (form.value.cprovinceId && form.value.cdistrictId && form.value.ccityId) {
    form.value.cids = [row.cprovinceId, row.ccityId, row.cdistrictId];
  }
  // 构建客户业务地址数组
  if (form.value.businessCityId && form.value.businessDistrictId && form.value.businessProvinceId) {
    form.value.bids = [row.businessProvinceId, row.businessCityId, row.businessDistrictId];
  }
  // 构建客户联系地址数组
  if (form.value.cityId && form.value.districtId && form.value.provinceId) {
    form.value.cids = [row.provinceId, row.cityId, row.districtId];
  }
  addOrEdit.value = "edit";
  handleAddEdit(tabName.value);
};
@@ -594,7 +604,7 @@
  }
  const deleteIds = selectedRows.value.map(item => item.id);
  try {
    await ElMessageBox.confirm("确定删除选中的数据吗?", "提示", {
      confirmButtonText: "确定",
@@ -605,7 +615,9 @@
    const deleteApiMap = {
      supplier: delSupply,
      coal: delCoalInfo,
      coalQualityMaintenance: () => { throw new Error('delCoalQuality API not imported'); },
      coalQualityMaintenance: () => {
        throw new Error('delCoalQuality API not imported');
      },
      customer: delCustomer,
      coalMeiZhiZiDuanWeiHu: deleteCoalField
    };
@@ -615,14 +627,14 @@
      ElMessage.error("删除接口未配置");
      return;
    }
    console.log(deleteIds)
    const res = await deleteApi(deleteIds);
    if (res.code !== 200 && res.msg !== "操作成功") {
      ElMessage.error("删除失败:" + res.msg);
      return;
    }
    ElMessage.success("删除成功");
    await getList();
  } catch (error) {
@@ -650,10 +662,10 @@
 */
const handleExport = () => {
  const exportConfig = {
    supplier: { api: "/supply/export", name: "供应商信息" },
    customer: { api: "/customer/export", name: "客户信息" },
    coal: { api: "/supply/export", name: "煤种信息" },
    coalQualityMaintenance: { api: "/supply/export", name: "煤质维护信息" }
    supplier: {api: "/supply/export", name: "供应商信息"},
    customer: {api: "/customer/export", name: "客户信息"},
    coal: {api: "/supply/export", name: "煤种信息"},
    coalQualityMaintenance: {api: "/supply/export", name: "煤质维护信息"}
  };
  const config = exportConfig[tabName.value];
@@ -668,7 +680,7 @@
 * @param {string} name - 导出文件名前缀
 */
const exportData = (api, name) => {
  proxy.download(api, { ...queryParams }, `${name}${new Date().getTime()}.xlsx`);
  proxy.download(api, {...queryParams}, `${name}${new Date().getTime()}.xlsx`);
  ElMessage.success("导出数据:" + name);
};
// ===== 数据获取函数 =====
@@ -704,13 +716,13 @@
const getList = async () => {
  try {
    loading.value = true;
    const { data, code } = await selectInterface();
    const {data, code} = await selectInterface();
    if (code !== 200) {
      ElMessage.error("获取数据失败:" + (data?.msg || '未知错误'));
      return;
    }
    tableData.value = data.records || [];
    total.value = data.total || 0;
  } catch (error) {
@@ -730,7 +742,7 @@
  try {
    // 并行执行初始化操作
    await Promise.all([
      handleTabClick({ props: { name: "supplier" } }),
      handleTabClick({props: {name: "supplier"}}),
      fetchAreaOptions(),
      getUserList()
    ]);
@@ -775,7 +787,7 @@
/* 表格工具栏 */
.table-toolbar,
.table-toolbar>* {
.table-toolbar > * {
  margin: 0 0 0 0 !important;
}