| | |
| | | <template> |
| | | <div> <el-form :inline="true" :model="queryParams" class="search-form"> |
| | | <el-form-item label="æç´¢" v-if="tabName === 'supplier' || tabName === 'customer'"> |
| | | <el-input v-model="queryParams.searchAll" placeholder="ä¾åºå/è¯å«ç /详ç»å°å" clearable /> |
| | | </el-form-item> |
| | | <el-form-item label="æç´¢" v-if="tabName === 'coal' || tabName === 'coalQualityMaintenance'"> |
| | | <el-input v-model="queryParams.searchAll" placeholder="请è¾å
¥æç´¢ä¿¡æ¯" clearable /> |
| | | <el-form-item label="æç´¢" v-if="shouldShowSearch"> |
| | | <el-input v-model="queryParams.searchAll" :placeholder="searchPlaceholder" clearable /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="search">æ¥è¯¢</el-button> |
| | |
| | | <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="tabName === 'supplier' || tabName === 'customer'">导åº</el-button> |
| | | </el-row> |
| | | <!-- è¡¨æ ¼ç»ä»¶ --> |
| | | <el-button type="info" :icon="Download" @click="handleExport" v-show="canExport">导åº</el-button> |
| | | </el-row> <!-- è¡¨æ ¼ç»ä»¶ --> |
| | | <div> |
| | | <data-table :loading="loading" :table-data="tableData" :columns="columns" |
| | | @selection-change="handleSelectionChange" @edit="handleEdit" :show-selection="true" :border="true" /> |
| | | @selection-change="handleSelectionChange" @edit="handleEdit" :show-selection="true" :border="true"> <!-- åæ®µåç§°åçèªå®ä¹ææ§½ - æ¾ç¤ºä¸ºæ ç¾ --> |
| | | <template v-if="tabName === 'coalQualityMaintenance'" #coalFields="{ row }"> |
| | | <template v-if="typeof row.coalFields === 'string' && row.coalFields.includes(',')"> |
| | | <el-tag v-for="(field, index) in row.coalFields.split(',')" :key="index" type="primary" size="small" |
| | | style="margin-right: 4px; margin-bottom: 2px;"> |
| | | {{ getFieldDisplayName(field.trim()) }} |
| | | </el-tag> |
| | | </template> |
| | | <template v-else> |
| | | <el-tag type="primary" size="small"> |
| | | {{ getFieldDisplayName(row.coalFields) || '--' }} |
| | | </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'" /> |
| | |
| | | :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'" |
| | | <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:coalMaintenanceFieldDialogVisible="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" /> |
| | | </el-card> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref, reactive, onMounted, computed } from "vue"; |
| | | // ===== æ ¸å¿ä¾èµå¯¼å
¥ ===== |
| | | 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 DataTable from "@/components/Table/ETable.vue"; |
| | | import Pagination from "@/components/Pagination"; |
| | | import Supplier from "./mould/supplier.vue"; |
| | |
| | | import Coal from "./mould/coal.vue"; |
| | | import coalQualityMaintenance from "./mould/coalQualityMaintenance.vue"; |
| | | import coalMeiZhiZiDuanWeiHu from "./mould/coalMeiZhiZiDuanWeiHu.vue"; |
| | | const { proxy } = getCurrentInstance() |
| | | import { getSupply, addOrEditSupply, delSupply } from "@/api/basicInformation/supplier.js"; |
| | | |
| | | // ===== API æå¡å¯¼å
¥ ===== |
| | | import { getSupply, delSupply } from "@/api/basicInformation/supplier.js"; |
| | | import { getCoalInfo, delCoalInfo } from "@/api/basicInformation/coal.js"; |
| | | import { getCoalQuality, delCoalQuality } from "@/api/basicInformation/coalQualityMaintenance.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"; |
| | | |
| | | // å¼¹çª |
| | | const coalMaintenanceFieldDialogVisible = ref(false); |
| | | const coalQualityMaintenanceDialogFormVisible = ref(false); |
| | | const customerDialogFormVisible = ref(false); |
| | | const coalDialogFormVisible = ref(false); |
| | | const supplierDialogFormVisible = ref(false); |
| | | const { proxy } = getCurrentInstance(); |
| | | |
| | | // ===== ååºå¼ç¶æç®¡ç ===== |
| | | |
| | | // å¼¹çªæ§å¶ç¶æ |
| | | const dialogFormVisible = ref(false); |
| | | const form = ref({}); |
| | | const title = ref(""); |
| | | const copyForm = ref({}); |
| | | // ç¨æ·åè¡¨æ°æ® |
| | | const addOrEdit = ref("add"); |
| | | |
| | | // æ°æ®ç¼åæ å° |
| | | const userList = ref([]); |
| | | // ç¨æ·æ å°è¡¨ï¼ç¨äºå¿«éæ¥æ¾ |
| | | const userMap = ref({}); |
| | | // å°åæ å°è¡¨ï¼ç¨äºå¿«éæ¥æ¾å°ååç§° |
| | | const addressMap = ref({}); |
| | | // å½åæ ç¾ |
| | | const userMap = ref({}); // ç¨æ·ID -> ç¨æ·åæ å°è¡¨ |
| | | const addressMap = ref({}); // å°åID -> å°åä¿¡æ¯æ å°è¡¨ |
| | | const coalFieldList = ref([]); // ç
¤è´¨å段å表 |
| | | |
| | | // 页é¢ç¶ææ§å¶ |
| | | const tabName = ref("supplier"); |
| | | // ç¶æåé |
| | | const loading = ref(false); |
| | | const total = ref(0); |
| | | const activeTab = ref("supplier"); |
| | | |
| | | // åé¡µç¶æç®¡ç |
| | | const pageNum = ref(1); |
| | | const pageSizes = ref(10); |
| | | const activeTab = ref("supplier"); |
| | | const total = ref(0); |
| | | |
| | | // è¡¨æ ¼ç¶æç®¡ç |
| | | const selectedRows = ref([]); |
| | | const tableData = ref([]); |
| | | const columns = ref(); |
| | | |
| | | // æ¥è¯¢åæ° |
| | | const queryParams = reactive({ |
| | | }); |
| | | const queryParams = reactive({}); |
| | | |
| | | // å°åéæ©æ°æ® |
| | | const addressSelectOptions = ref([]); |
| | | const fetchAreaOptions = async () => { |
| | | addressSelectOptions.value = []; |
| | | const res = await getAreaOptions(); |
| | | if (res.code === 200) { |
| | | addressSelectOptions.value = res.data; |
| | | buildAddressMap(res.data); // æå»ºå°åæ å°è¡¨ |
| | | } |
| | | } |
| | | |
| | | // æå»ºå°åæ å°è¡¨ï¼ç¨äºå¿«éæ¥æ¾å°ååç§° |
| | | // ===== é
置常é ===== |
| | | |
| | | // æ ç¾é¡µé
ç½® |
| | | const tabs = reactive([ |
| | | { name: "supplier", label: "ä¾åºåä¿¡æ¯" }, |
| | | { name: "customer", label: "客æ·ä¿¡æ¯" }, |
| | | { name: "coal", label: "ç
¤ç§ä¿¡æ¯" }, |
| | | { name: "coalQualityMaintenance", label: "ç
¤è´¨æ¹æ¡" }, |
| | | { name: "coalMeiZhiZiDuanWeiHu", label: "ç
¤è´¨å段" } |
| | | ]); |
| | | |
| | | // ===== å·¥å
·å½æ° ===== |
| | | |
| | | /** |
| | | * è·åå°åéæ©æ°æ®å¹¶æå»ºæ å°è¡¨ |
| | | * @description 弿¥è·åå°åæ°æ®ï¼æå»ºå¿«éæ¥æ¾çæ å°è¡¨ |
| | | */ |
| | | const fetchAreaOptions = async () => { |
| | | try { |
| | | addressSelectOptions.value = []; |
| | | const res = await getAreaOptions(); |
| | | if (res.code === 200) { |
| | | addressSelectOptions.value = res.data; |
| | | buildAddressMap(res.data); |
| | | } |
| | | } catch (error) { |
| | | console.error('è·åå°åé项失败:', error); |
| | | } |
| | | }; |
| | | |
| | | /** |
| | | * æå»ºå°åæ å°è¡¨ |
| | | * @param {Array} areaData - å°åæ°æ® |
| | | * @description éå½æå»ºå°åæ å°è¡¨ï¼æ¯æå¤çº§å°åæ¥æ¾ |
| | | */ |
| | | const buildAddressMap = (areaData) => { |
| | | const buildMap = (list, pathList = []) => { |
| | | list.forEach(item => { |
| | |
| | | buildMap(areaData); |
| | | }; |
| | | |
| | | // å°åæ ¼å¼å彿° |
| | | /** |
| | | * æ ¼å¼åå°åæ°ç»ä¸ºæ¾ç¤ºå符串 |
| | | * @param {Array} addressIds - å°åIDæ°ç» |
| | | * @returns {string} æ ¼å¼ååçå°åå符串 |
| | | * @description å°å°åIDæ°ç»è½¬æ¢ä¸ºå¯è¯»çå°åå符串 |
| | | */ |
| | | const formatAddressArray = (addressIds) => { |
| | | // 妿å°åæ å°è¡¨è¿æ²¡æåå¤å¥½ï¼æ¾ç¤º -- |
| | | if (!addressMap.value || Object.keys(addressMap.value).length === 0 || !addressIds || !Array.isArray(addressIds) || addressIds.length === 0 || addressIds.every(id => !id)) { |
| | | 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 => { |
| | | return addressMap.value[id]?.name || '--'; |
| | | }); |
| | | // 妿ææå°ååç§°é½æ¯ '--'ï¼åè¿å '--' |
| | | |
| | | const addressNames = addressIds.map(id => addressMap.value[id]?.name || '--'); |
| | | |
| | | if (addressNames.every(name => name === '--')) { |
| | | return '--'; |
| | | } |
| | | |
| | | return addressNames.filter(name => name !== '--').join(' / '); |
| | | }; |
| | | // è·åç¨æ·åè¡¨æ°æ® |
| | | |
| | | /** |
| | | * è·åç¨æ·åè¡¨æ°æ®å¹¶æå»ºæ å°è¡¨ |
| | | * @description è·åç¨æ·æ°æ®å¹¶æå»ºIDå°ç¨æ·åçæ å°å
³ç³» |
| | | */ |
| | | const getUserList = async () => { |
| | | try { |
| | | const res = await testUserList(); |
| | |
| | | console.error('è·åç¨æ·å表失败:', error); |
| | | } |
| | | }; |
| | | onMounted(async () => { |
| | | await handleTabClick({ props: { name: "supplier" } }); |
| | | await fetchAreaOptions(); // å
è·åå°åéæ©æ°æ®å¹¶æå»ºæ å°è¡¨ |
| | | await getUserList(); // è·åç¨æ·å表 |
| | | |
| | | /** |
| | | * è·åç
¤è´¨åæ®µæ°æ® |
| | | * @description è·åç
¤è´¨å段å表ï¼ç¨äºå段åç§°å¹é
|
| | | */ |
| | | const coalFieldData = async () => { |
| | | try { |
| | | const { data, code } = await getCoalFieldList(); |
| | | if (code === 200) { |
| | | coalFieldList.value = data; |
| | | } |
| | | } catch (error) { |
| | | console.error('è·åç
¤è´¨åæ®µæ°æ®å¤±è´¥:', error); |
| | | } |
| | | }; |
| | | |
| | | /** |
| | | * æ ¹æ®å段IDè·ååæ®µæ¾ç¤ºåç§° |
| | | * @param {string|number} fieldId - åæ®µID |
| | | * @returns {string} åæ®µæ¾ç¤ºåç§° |
| | | * @description éè¿å段IDå¹é
对åºçåæ®µåç§° |
| | | */ |
| | | const getFieldDisplayName = (fieldId) => { |
| | | if (!fieldId) return '--'; |
| | | |
| | | const numId = parseInt(fieldId); |
| | | const matchedField = coalFieldList.value.find(item => item.id === numId); |
| | | |
| | | return matchedField ? matchedField.fieldName : numId; |
| | | }; |
| | | |
| | | // ===== 计ç®å±æ§ ===== |
| | | |
| | | /** |
| | | * å½åæ ç¾é¡µæ¯å¦æ¯æå¯¼åºåè½ |
| | | */ |
| | | const canExport = computed(() => { |
| | | return ['supplier', 'customer'].includes(tabName.value); |
| | | }); |
| | | const columns = ref(); |
| | | // æ ç¾é¡µæ°æ® |
| | | const tabs = reactive([ |
| | | { name: "supplier", label: "ä¾åºåä¿¡æ¯" }, |
| | | { name: "customer", label: "客æ·ä¿¡æ¯" }, |
| | | { name: "coal", label: "ç
¤ç§ä¿¡æ¯" }, |
| | | { name: "coalQualityMaintenance", label: "ç
¤è´¨æ¹æ¡" }, |
| | | { name: "coalMeiZhiZiDuanWeiHu", label: "ç
¤è´¨å段" } |
| | | ]); |
| | | // æ¯å¦ç¼è¾ |
| | | const addOrEdit = ref("add"); |
| | | // è¡¨æ ¼æ°æ® |
| | | const tableData = ref([]); |
| | | // supplier ä¾åºåæ°æ® |
| | | |
| | | /** |
| | | * æç´¢æ¡å ä½ç¬¦ææ¬ |
| | | */ |
| | | const searchPlaceholder = computed(() => { |
| | | const placeholderMap = { |
| | | supplier: "ä¾åºå/è¯å«ç /详ç»å°å", |
| | | customer: "ä¾åºå/è¯å«ç /详ç»å°å", |
| | | coal: "请è¾å
¥æç´¢ä¿¡æ¯", |
| | | coalQualityMaintenance: "请è¾å
¥æç´¢ä¿¡æ¯", |
| | | coalMeiZhiZiDuanWeiHu: "请è¾å
¥æç´¢ä¿¡æ¯" |
| | | }; |
| | | return placeholderMap[tabName.value] || "请è¾å
¥æç´¢ä¿¡æ¯"; |
| | | }); |
| | | |
| | | /** |
| | | * æ¯å¦æ¾ç¤ºæç´¢æ¡ |
| | | */ |
| | | const shouldShowSearch = computed(() => { |
| | | return ['supplier', 'customer', 'coal', 'coalQualityMaintenance','coalMeiZhiZiDuanWeiHu'].includes(tabName.value); |
| | | }); |
| | | |
| | | /** |
| | | * å½åéä¸è¡æ°é |
| | | */ |
| | | const selectedCount = computed(() => selectedRows.value.length); |
| | | |
| | | /** |
| | | * æ¯å¦æéä¸çè¡ |
| | | */ |
| | | const hasSelectedRows = computed(() => selectedCount.value > 0); |
| | | |
| | | // ===== è¡¨æ ¼åé
ç½® ===== |
| | | |
| | | /** |
| | | * ä¾åºåè¡¨æ ¼åé
ç½® |
| | | */ |
| | | const supplierColumns = ref([ |
| | | { prop: "supplierName", label: "ä¾åºååç§°", minWidth: 100 }, |
| | | { prop: "taxpayerId", label: "ç»ä¸äººè¯å«å·", minWidth: 170 }, { |
| | | { prop: "taxpayerId", label: "ç»ä¸äººè¯å«å·", minWidth: 170 }, |
| | | { |
| | | prop: "bids", |
| | | label: "ç»è¥å°å", |
| | | minWidth: 150, |
| | | showOverflowTooltip: true, |
| | | formatter: (row, column, cellValue) => { |
| | | let arr = [ |
| | | row.bprovinceId, |
| | | row.bcityId, |
| | | row.bdistrictId, |
| | | ] |
| | | return formatAddressArray(arr); |
| | | formatter: (row) => { |
| | | const addressIds = [row.bprovinceId, row.bcityId, row.bdistrictId]; |
| | | return formatAddressArray(addressIds); |
| | | } |
| | | }, |
| | | { prop: "businessAddress", label: "ç»è¥è¯¦ç»å°å", minWidth: 150 }, |
| | |
| | | label: "è系人å°å", |
| | | minWidth: 150, |
| | | showOverflowTooltip: true, |
| | | formatter: (row, column, cellValue) => { |
| | | let arr = [ |
| | | row.cprovinceId, |
| | | row.ccityId, |
| | | row.cdistrictId, |
| | | ] |
| | | return formatAddressArray(arr); |
| | | formatter: (row) => { |
| | | const addressIds = [row.cprovinceId, row.ccityId, row.cdistrictId]; |
| | | return formatAddressArray(addressIds); |
| | | } |
| | | }, { prop: "contactAddress", label: "è系人详ç»å°å", minWidth: 120 }, |
| | | // { |
| | | // prop: "maintainerId", |
| | | // label: "ç»´æ¤äºº", |
| | | // minWidth: 80, |
| | | // formatter: (row, column, cellValue) => { |
| | | // // å¦æç¨æ·æ å°è¡¨è¿æ²¡æåå¤å¥½ï¼æ¾ç¤º -- |
| | | // if (!userMap.value || Object.keys(userMap.value).length === 0) { |
| | | // return '--'; |
| | | // } |
| | | // // 妿å¼ä¸ºç©ºænullï¼æ¾ç¤º -- |
| | | // if (cellValue === null || cellValue === undefined || cellValue === '') { |
| | | // return '--'; |
| | | // } |
| | | // // å¦æç¨æ·æ å°è¡¨ä¸æå¯¹åºçç¨æ·åï¼è¿åç¨æ·å |
| | | // if (userMap.value[cellValue]) { |
| | | // return userMap.value[cellValue]; |
| | | // } |
| | | // // å¦ææ²¡æå¹é
çç¨æ·ï¼æ¾ç¤º -- |
| | | // return '--'; |
| | | // } |
| | | // }, |
| | | }, |
| | | { prop: "contactAddress", label: "è系人详ç»å°å", minWidth: 120 }, |
| | | { prop: "createTime", label: "ç»´æ¤æ¥æ", minWidth: 120 }, |
| | | ]); |
| | | // customer å®¢æ·æ°æ® |
| | | |
| | | /** |
| | | * 客æ·è¡¨æ ¼åé
ç½® |
| | | */ |
| | | const customerColumns = ref([ |
| | | { prop: "customerName", label: "客æ·åç§°", minWidth: 100 }, |
| | | { prop: "taxpayerId", label: "ç»ä¸äººè¯å«å·", minWidth: 120 }, |
| | |
| | | label: "ç»è¥å°å", |
| | | minWidth: 150, |
| | | showOverflowTooltip: true, |
| | | formatter: (row, column, cellValue) => { |
| | | let arr = [ |
| | | row.businessProvinceId, |
| | | row.businessCityId, |
| | | row.businessDistrictId, |
| | | ] |
| | | return formatAddressArray(arr); |
| | | formatter: (row) => { |
| | | const addressIds = [row.businessProvinceId, row.businessCityId, row.businessDistrictId]; |
| | | return formatAddressArray(addressIds); |
| | | } |
| | | }, |
| | | { prop: "businessAddress", label: "详ç»å°å", minWidth: 150 }, |
| | |
| | | label: "è系人å°å", |
| | | minWidth: 150, |
| | | showOverflowTooltip: true, |
| | | formatter: (row, column, cellValue) => { |
| | | let arr = [ |
| | | row.provinceId, |
| | | row.cityId, |
| | | row.districtId, |
| | | ] |
| | | return formatAddressArray(arr); |
| | | formatter: (row) => { |
| | | const addressIds = [row.provinceId, row.cityId, row.districtId]; |
| | | return formatAddressArray(addressIds); |
| | | } |
| | | }, |
| | | { prop: "contactAddress", label: "è系人详ç»å°å", minWidth: 150 }, |
| | | { prop: "updateTime", label: "ç»´æ¤æ¥æ", minWidth: 100 }, |
| | | ]); |
| | | // coal ç
¤ç§æ°æ® |
| | | |
| | | /** |
| | | * ç
¤ç§è¡¨æ ¼åé
ç½® |
| | | */ |
| | | const coalColumns = ref([ |
| | | { prop: "coal", label: "ç
¤ç§åç§°", minWidth: 200 }, { |
| | | { prop: "coal", label: "ç
¤ç§åç§°", minWidth: 200 }, |
| | | { |
| | | prop: "maintainerId", |
| | | label: "ç»´æ¤äºº", |
| | | minWidth: 120, |
| | | formatter: (row, column, cellValue) => { |
| | | // å¦æç¨æ·æ å°è¡¨è¿æ²¡æåå¤å¥½ï¼æ¾ç¤º -- |
| | | if (!userMap.value || Object.keys(userMap.value).length === 0) { |
| | | return '--'; |
| | | } |
| | | // 妿å¼ä¸ºç©ºænullï¼æ¾ç¤º -- |
| | | if (cellValue === null || cellValue === undefined || cellValue === '') { |
| | | return '--'; |
| | | } |
| | | // å¦æç¨æ·æ å°è¡¨ä¸æå¯¹åºçç¨æ·åï¼è¿åç¨æ·å |
| | | if (userMap.value[cellValue]) { |
| | | return userMap.value[cellValue]; |
| | | } |
| | | // å¦ææ²¡æå¹é
çç¨æ·ï¼æ¾ç¤º -- |
| | | return '--'; |
| | | return userMap.value[cellValue] || '--'; |
| | | } |
| | | }, |
| | | { prop: "maintenanceDate", label: "ç»´æ¤æ¥æ", minWidth: 150 }, |
| | | ]); |
| | | // coalQualityMaintenance ç
¤è´¨ç»´æ¤æ°æ® |
| | | |
| | | /** |
| | | * ç
¤è´¨æ¹æ¡è¡¨æ ¼åé
ç½® |
| | | */ |
| | | const coalQualityMaintenanceColumns = ref([ |
| | | { prop: "coal", label: "ç
¤ç§åç§°", minWidth: 200 }, |
| | | { prop: "totalMoisture", label: "å
¨æ°´å«éç¾åæ¯ (%)", minWidth: 200 }, |
| | | { prop: "analysisMoisture", label: "åææ°´å«éç¾åæ¯ (%)", minWidth: 200 }, |
| | | { prop: "volatileMatter", label: "æ¥ååç¾åæ¯ (%)", minWidth: 100 }, |
| | | { prop: "sulfurContent", label: "ç¡«å«éç¾åæ¯ (%)", minWidth: 100 }, |
| | | { prop: "contacts", label: "åºå®ç¢³ç¾åæ¯ (%)", minWidth: 100 }, |
| | | { prop: "contactAddress", label: "é«ä½åçé", minWidth: 100 }, |
| | | { prop: "maintainer", label: "ä½ä½åçé", minWidth: 100 }, |
| | | { prop: "plan", label: "æ¹æ¡åç§°", minWidth: 100 }, |
| | | { |
| | | prop: "coalFields", |
| | | label: "åæ®µåç§°", |
| | | minWidth: 200, |
| | | showOverflowTooltip: true, |
| | | slot: true, |
| | | formatter: (row, column, cellValue) => { |
| | | if (Array.isArray(cellValue)) { |
| | | return cellValue.map(item => item); |
| | | } |
| | | return cellValue || '--'; |
| | | } |
| | | }, |
| | | { prop: "schemeDesc", label: "åæ®µæè¿°", minWidth: 100 }, |
| | | ]); |
| | | |
| | | /** |
| | | * ç
¤è´¨åæ®µè¡¨æ ¼åé
ç½® |
| | | */ |
| | | const coalMeiZhiZiDuanWeiHuColumns = ref([ |
| | | { prop: "fieldName", label: "åæ®µåç§°", minWidth: 200 }, |
| | | { prop: "fieldDescription", label: "åæ®µæè¿°", minWidth: 200 }, |
| | | ]); |
| | | // æ ç¾é¡µç¹å» |
| | | // ===== äºä»¶å¤ç彿° ===== |
| | | |
| | | /** |
| | | * æ ç¾é¡µåæ¢äºä»¶å¤ç |
| | | * @param {Object} tab - æ ç¾é¡µå¯¹è±¡ |
| | | * @description å¤çæ ç¾é¡µåæ¢ï¼é置表ååç¶æï¼å è½½å¯¹åºæ°æ® |
| | | */ |
| | | const handleTabClick = (tab) => { |
| | | // é置表ååç¶æ |
| | | form.value = {}; |
| | | addOrEdit.value = "add"; |
| | | loading.value = true; |
| | | tabName.value = tab.props.name; |
| | | tableData.value = []; |
| | | switch (tabName.value) { |
| | | case "supplier": |
| | | |
| | | // æ ¹æ®æ ç¾é¡µç±»å设置对åºçåé
ç½® |
| | | const tabConfig = { |
| | | supplier: () => { |
| | | columns.value = supplierColumns.value; |
| | | dialogFormVisible.value = supplierDialogFormVisible.value; |
| | | getList("supplier"); |
| | | break; |
| | | case "customer": |
| | | getList(); |
| | | }, |
| | | customer: () => { |
| | | columns.value = customerColumns.value; |
| | | dialogFormVisible.value = customerDialogFormVisible.value; |
| | | getList("customer"); |
| | | break; |
| | | case "coal": |
| | | getList(); |
| | | }, |
| | | coal: () => { |
| | | columns.value = coalColumns.value; |
| | | dialogFormVisible.value = coalDialogFormVisible.value; |
| | | getList("coal"); |
| | | break; |
| | | case "coalQualityMaintenance": |
| | | getList(); |
| | | }, |
| | | coalQualityMaintenance: () => { |
| | | columns.value = coalQualityMaintenanceColumns.value; |
| | | dialogFormVisible.value = coalQualityMaintenanceDialogFormVisible.value; |
| | | getList("coalQualityMaintenance"); |
| | | break; |
| | | case "coalMeiZhiZiDuanWeiHu": |
| | | getList(); |
| | | coalFieldData(); // å è½½ç
¤è´¨åæ®µæ°æ® |
| | | }, |
| | | coalMeiZhiZiDuanWeiHu: () => { |
| | | columns.value = coalMeiZhiZiDuanWeiHuColumns.value; |
| | | dialogFormVisible.value = coalMaintenanceFieldDialogVisible.value; |
| | | getList("coalMeiZhiZiDuanWeiHu"); |
| | | break; |
| | | getList(); |
| | | } |
| | | }; |
| | | |
| | | // æ§è¡å¯¹åºçé
ç½®å½æ° |
| | | const configFn = tabConfig[tabName.value]; |
| | | if (configFn) { |
| | | configFn(); |
| | | } |
| | | }; |
| | | // éç½®æ¥è¯¢ |
| | | |
| | | /** |
| | | * éç½®æ¥è¯¢æ¡ä»¶ |
| | | * @description éç½®æ¥è¯¢åæ°å¹¶éæ°å è½½æ°æ® |
| | | */ |
| | | const resetQuery = () => { |
| | | Object.keys(queryParams).forEach((key) => { |
| | | if (key !== "pageNum" && key !== "pageSizes") { |
| | | queryParams[key] = ""; |
| | | } |
| | | }); |
| | | getList() |
| | | getList(); |
| | | }; |
| | | // æ°å¢ |
| | | |
| | | /** |
| | | * æç´¢åè½ |
| | | * @description é置页ç å¹¶æ§è¡æç´¢ |
| | | */ |
| | | const search = () => { |
| | | pageNum.value = 1; |
| | | getList(); |
| | | }; |
| | | |
| | | /** |
| | | * æ°å¢æé®ç¹å»å¤ç |
| | | */ |
| | | const handleAdd = () => { |
| | | addOrEdit.value = "add"; |
| | | handleAddEdit(tabName.value); |
| | | }; |
| | | // æ°å¢ç¼è¾ |
| | | const handleAddEdit = (tabName) => { |
| | | addOrEdit.value == "add" ? title.value = "æ°å¢" : title.value = "ç¼è¾"; |
| | | if (tabName === "supplier") { |
| | | dialogFormVisible.value = true; |
| | | title.value = title.value + "ä¾åºåä¿¡æ¯"; |
| | | openDialog(); |
| | | } else if (tabName === "customer") { |
| | | dialogFormVisible.value = true; |
| | | title.value = title.value + "客æ·ä¿¡æ¯"; |
| | | openDialog(); |
| | | } else if (tabName === "coal") { |
| | | dialogFormVisible.value = true; |
| | | title.value = title.value + "ç
¤ç§ä¿¡æ¯"; |
| | | openDialog(); |
| | | } else if (tabName === "coalQualityMaintenance") { |
| | | dialogFormVisible.value = true; |
| | | title.value = title.value + "ç
¤è´¨æ¹æ¡ç»´æ¤"; |
| | | openDialog(); |
| | | } else if (tabName === "coalMeiZhiZiDuanWeiHu") { |
| | | dialogFormVisible.value = true; |
| | | title.value = title.value + "ç
¤è´¨å段维æ¤"; |
| | | openDialog(); |
| | | } |
| | | |
| | | /** |
| | | * æ°å¢/ç¼è¾å¼¹çªå¤ç |
| | | * @param {string} currentTabName - å½åæ ç¾é¡µåç§° |
| | | * @description æ ¹æ®æ ç¾é¡µç±»åè®¾ç½®å¼¹çªæ é¢å¹¶æå¼å¼¹çª |
| | | */ |
| | | const handleAddEdit = (currentTabName) => { |
| | | const actionText = addOrEdit.value === "add" ? "æ°å¢" : "ç¼è¾"; |
| | | |
| | | const tabTitleMap = { |
| | | supplier: "ä¾åºåä¿¡æ¯", |
| | | customer: "客æ·ä¿¡æ¯", |
| | | coal: "ç
¤ç§ä¿¡æ¯", |
| | | coalQualityMaintenance: "ç
¤è´¨æ¹æ¡ç»´æ¤", |
| | | coalMeiZhiZiDuanWeiHu: "ç
¤è´¨å段维æ¤" |
| | | }; |
| | | |
| | | title.value = `${actionText}${tabTitleMap[currentTabName] || ''}`; |
| | | openDialog(); |
| | | }; |
| | | // æå¼å¼¹çª |
| | | |
| | | /** |
| | | * æå¼å¼¹çª |
| | | * @description æ ¹æ®ç¼è¾ç¶æå³å®æ¯å¦å¤å¶è¡¨åæ°æ® |
| | | */ |
| | | const openDialog = () => { |
| | | if (addOrEdit.value === "edit") { |
| | | copyForm.value = JSON.parse(JSON.stringify(form.value)); |
| | | dialogFormVisible.value = true; |
| | | return; |
| | | } else { |
| | | form.value = {}; |
| | | } |
| | | form.value = {}; |
| | | dialogFormVisible.value = true; |
| | | }; |
| | | // å页 |
| | | |
| | | /** |
| | | * å页å¤ç |
| | | * @param {Object} val - åé¡µåæ°å¯¹è±¡ |
| | | */ |
| | | const handPagination = (val) => { |
| | | pageNum.value = val.page; |
| | | pageSizes.value = val.limit; |
| | | getList(); |
| | | }; |
| | | // æäº¤è¡¨å |
| | | |
| | | /** |
| | | * 表åæäº¤å¤ç |
| | | * @param {Object} val - æäº¤ç»æå¯¹è±¡ |
| | | */ |
| | | const handleSubmit = async (val) => { |
| | | if (val.result.code !== 200) { |
| | | ElMessage.error("æä½å¤±è´¥ï¼" + val.result.msg); |
| | |
| | | dialogFormVisible.value = false; |
| | | getList(); |
| | | }; |
| | | |
| | | /** |
| | | * å¼¹çªæ¾ç¤ºç¶æå¤ç |
| | | * @param {boolean} value - æ¾ç¤ºç¶æ |
| | | */ |
| | | const handleDialogFormVisible = (value) => { |
| | | dialogFormVisible.value = value; |
| | | }; |
| | | // éæ©è¡ |
| | | |
| | | /** |
| | | * è¡¨æ ¼è¡éæ©å¤ç |
| | | * @param {Array} selection - éä¸çè¡æ°æ® |
| | | */ |
| | | const handleSelectionChange = (selection) => { |
| | | selectedRows.value = selection; |
| | | }; |
| | | // ç¼è¾ |
| | | /** |
| | | * ç¼è¾æé®ç¹å»å¤ç |
| | | * @param {Object} row - è¡æ°æ® |
| | | * @description å¤çç¼è¾æä½ï¼æå»ºå°åæ°ç»å¹¶æå¼ç¼è¾å¼¹çª |
| | | */ |
| | | 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, |
| | | ]; |
| | | 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, |
| | | ]; |
| | | 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, |
| | | ]; |
| | | 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, |
| | | ]; |
| | | form.value.cids = [row.provinceId, row.cityId, row.districtId]; |
| | | } |
| | | |
| | | addOrEdit.value = "edit"; |
| | | handleAddEdit(tabName.value); |
| | | }; |
| | | // æ¹éå é¤ |
| | | const handleDelete = () => { |
| | | |
| | | /** |
| | | * æ¹éå é¤å¤ç |
| | | * @description æ¹éå é¤éä¸çè®°å½ |
| | | */ |
| | | const handleDelete = async () => { |
| | | if (selectedRows.value.length === 0) { |
| | | ElMessage.warning("è¯·éæ©è¦å é¤çæ°æ®"); |
| | | return; |
| | | } |
| | | let arr = reactive([]); |
| | | selectedRows.value.forEach(element => { |
| | | return arr.push(element.id); |
| | | }); |
| | | ElMessageBox.confirm("ç¡®å®å é¤éä¸çæ°æ®åï¼", "æç¤º", { |
| | | confirmButtonText: "ç¡®å®", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(async () => { |
| | | try { |
| | | let res; |
| | | if (tabName.value === "supplier") { |
| | | res = await delSupply(arr); |
| | | } else if (tabName.value === "coal") { |
| | | res = await delCoalInfo(arr); |
| | | } else if (tabName.value === "coalQualityMaintenance") { |
| | | res = await delCoalQuality(arr); |
| | | } else if (tabName.value === "customer") { |
| | | res = await delCustomer(arr); |
| | | } |
| | | if (res.code !== 200 && res.meg == "æä½æå") { |
| | | ElMessage.error("å é¤å¤±è´¥ï¼" + res.msg); |
| | | return; |
| | | } |
| | | ElMessage.success("å 餿å"); |
| | | await getList(); |
| | | } catch (e) { |
| | | console.error(e); |
| | | ElMessage.error("å é¤å¤±è´¥ï¼è¯·ç¨ååè¯"); |
| | | } finally { |
| | | selectedRows.value = []; |
| | | } |
| | | }).catch(() => { |
| | | ElMessage.info("已忶å 餿ä½"); |
| | | |
| | | const deleteIds = selectedRows.value.map(item => item.id); |
| | | |
| | | try { |
| | | await ElMessageBox.confirm("ç¡®å®å é¤éä¸çæ°æ®åï¼", "æç¤º", { |
| | | confirmButtonText: "ç¡®å®", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }); |
| | | } |
| | | // å
³éå¼¹çª |
| | | |
| | | const deleteApiMap = { |
| | | supplier: delSupply, |
| | | coal: delCoalInfo, |
| | | coalQualityMaintenance: () => { throw new Error('delCoalQuality API not imported'); }, |
| | | customer: delCustomer, |
| | | coalMeiZhiZiDuanWeiHu: deleteCoalField |
| | | }; |
| | | |
| | | const deleteApi = deleteApiMap[tabName.value]; |
| | | if (!deleteApi) { |
| | | ElMessage.error("å 餿¥å£æªé
ç½®"); |
| | | return; |
| | | } |
| | | |
| | | const res = await deleteApi(deleteIds); |
| | | |
| | | if (res.code !== 200 && res.msg !== "æä½æå") { |
| | | ElMessage.error("å é¤å¤±è´¥ï¼" + res.msg); |
| | | return; |
| | | } |
| | | |
| | | ElMessage.success("å 餿å"); |
| | | await getList(); |
| | | } catch (error) { |
| | | if (error.message !== 'cancel') { |
| | | console.error('å 餿ä½å¤±è´¥:', error); |
| | | ElMessage.error("å é¤å¤±è´¥ï¼è¯·ç¨ååè¯"); |
| | | } else { |
| | | ElMessage.info("已忶å 餿ä½"); |
| | | } |
| | | } finally { |
| | | selectedRows.value = []; |
| | | } |
| | | }; |
| | | |
| | | /** |
| | | * å
³éå¼¹çªå¤ç |
| | | */ |
| | | const handleBeforeClose = () => { |
| | | dialogFormVisible.value = false; |
| | | form.value = {}; |
| | | }; |
| | | const handleExport = () => { |
| | | if (tabName.value === "supplier") { |
| | | Export("/supply/export", "ä¾åºåä¿¡æ¯"); |
| | | } else if (tabName.value === "customer") { |
| | | Export("/customer/export", "客æ·ä¿¡æ¯"); |
| | | } else if (tabName.value === "coal") { |
| | | Export("/supply/export", "ç
¤ç§ä¿¡æ¯"); |
| | | } else if (tabName.value === "coalQualityMaintenance") { |
| | | Export("/supply/export", "ç
¤è´¨ç»´æ¤ä¿¡æ¯"); |
| | | |
| | | /** |
| | | * 导åºåè½å¤ç |
| | | */ |
| | | const handleExport = () => { |
| | | const exportConfig = { |
| | | 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]; |
| | | if (config) { |
| | | exportData(config.api, config.name); |
| | | } |
| | | } |
| | | const Export = (api, name) => { |
| | | proxy.download(api, { |
| | | ...queryParams.value |
| | | }, `${name}${new Date().getTime()}.xlsx`) |
| | | }; |
| | | |
| | | /** |
| | | * å¯¼åºæ°æ® |
| | | * @param {string} api - å¯¼åºæ¥å£è·¯å¾ |
| | | * @param {string} name - å¯¼åºæä»¶ååç¼ |
| | | */ |
| | | const exportData = (api, name) => { |
| | | proxy.download(api, { ...queryParams }, `${name}${new Date().getTime()}.xlsx`); |
| | | ElMessage.success("å¯¼åºæ°æ®ï¼" + name); |
| | | }; |
| | | // éæ©æ¥å£ |
| | | // ===== æ°æ®è·å彿° ===== |
| | | |
| | | /** |
| | | * æ ¹æ®å½åæ ç¾é¡µéæ©å¯¹åºçAPIæ¥å£ |
| | | * @returns {Promise} APIè°ç¨Promise |
| | | * @description ç»ä¸çæ¥å£éæ©å½æ°ï¼æ ¹æ®æ ç¾é¡µç±»åè°ç¨å¯¹åºçAPI |
| | | */ |
| | | const selectInterface = () => { |
| | | if (tabName.value === "supplier") { |
| | | return getSupply({ |
| | | current: pageNum.value, |
| | | pageSize: pageSizes.value, |
| | | searchAll: queryParams.searchAll, |
| | | }); |
| | | } else if (tabName.value === "customer") { |
| | | return getCustomerList({ |
| | | current: pageNum.value, |
| | | pageSize: pageSizes.value, |
| | | searchAll: queryParams.searchAll, |
| | | }); |
| | | } else if (tabName.value === "coal") { |
| | | return getCoalInfo({ |
| | | current: pageNum.value, |
| | | pageSize: pageSizes.value, |
| | | searchAll: queryParams.searchAll, |
| | | }); |
| | | } else if (tabName.value === "coalQualityMaintenance") { |
| | | return getCoalQuality({ |
| | | current: pageNum.value, |
| | | pageSize: pageSizes.value, |
| | | searchAll: queryParams.searchAll, |
| | | }); |
| | | } else if (tabName.value === "coalMeiZhiZiDuanWeiHu") { |
| | | return { |
| | | code: 200, |
| | | data: { |
| | | records: [ |
| | | { fieldName: "åæ®µ1", fieldDescription: "æè¿°1" }, |
| | | { fieldName: "åæ®µ2", fieldDescription: "æè¿°2" }, |
| | | { fieldName: "åæ®µ3", fieldDescription: "æè¿°3" } |
| | | ], |
| | | total: 10 |
| | | } |
| | | }; |
| | | // return getCoalQuality({ |
| | | // current: pageNum.value, |
| | | // pageSize: pageSizes.value, |
| | | // searchAll: queryParams.searchAll, |
| | | // }); |
| | | } |
| | | } |
| | | const search = () => { |
| | | pageNum.value = 1; // é置页ç |
| | | getList(); |
| | | const apiParams = { |
| | | current: pageNum.value, |
| | | pageSize: pageSizes.value, |
| | | searchAll: queryParams.searchAll, |
| | | }; |
| | | |
| | | const apiMap = { |
| | | supplier: () => getSupply(apiParams), |
| | | customer: () => getCustomerList(apiParams), |
| | | coal: () => getCoalInfo(apiParams), |
| | | coalQualityMaintenance: () => getCoalPlanList(apiParams), |
| | | coalMeiZhiZiDuanWeiHu: () => coalField(apiParams) |
| | | }; |
| | | |
| | | const apiFunction = apiMap[tabName.value]; |
| | | return apiFunction ? apiFunction() : Promise.reject(new Error('æªæ¾å°å¯¹åºçAPIæ¥å£')); |
| | | }; |
| | | // è·ååè¡¨æ°æ® |
| | | |
| | | /** |
| | | * è·ååè¡¨æ°æ® |
| | | * @description ç»ä¸çæ°æ®è·å彿°ï¼å¤çå è½½ç¶æåé误å¤ç |
| | | */ |
| | | const getList = async () => { |
| | | loading.value = true; |
| | | /* if (Object.keys(addressMap.value).length === 0) { |
| | | await fetchAreaOptions(); |
| | | } */ |
| | | let { data, code } = await selectInterface() |
| | | console.log("è·åæ°æ®ï¼", code, data); |
| | | if (code !== 200) { |
| | | ElMessage.error("è·åæ°æ®å¤±è´¥ï¼" + data.msg); |
| | | try { |
| | | loading.value = true; |
| | | const { data, code } = await selectInterface(); |
| | | |
| | | if (code !== 200) { |
| | | ElMessage.error("è·åæ°æ®å¤±è´¥ï¼" + (data?.msg || 'æªç¥é误')); |
| | | return; |
| | | } |
| | | |
| | | tableData.value = data.records || []; |
| | | total.value = data.total || 0; |
| | | } catch (error) { |
| | | console.error('è·ååè¡¨æ°æ®å¤±è´¥:', error); |
| | | ElMessage.error("è·åæ°æ®å¤±è´¥ï¼è¯·ç¨ååè¯"); |
| | | } finally { |
| | | loading.value = false; |
| | | return; |
| | | } |
| | | tableData.value = data.records; |
| | | total.value = data.total; |
| | | loading.value = false; |
| | | }; |
| | | |
| | | // ===== çå½å¨æé©å ===== |
| | | |
| | | /** |
| | | * ç»ä»¶æè½½åçåå§åæä½ |
| | | */ |
| | | onMounted(async () => { |
| | | try { |
| | | // å¹¶è¡æ§è¡åå§åæä½ |
| | | await Promise.all([ |
| | | handleTabClick({ props: { name: "supplier" } }), |
| | | fetchAreaOptions(), |
| | | getUserList() |
| | | ]); |
| | | } catch (error) { |
| | | console.error('ç»ä»¶åå§å失败:', error); |
| | | ElMessage.error("页é¢åå§å失败ï¼è¯·å·æ°éè¯"); |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped> |