From 52b3b54470ecc3c80d816a9891b651ce7f5a0eaa Mon Sep 17 00:00:00 2001
From: maven <2163098428@qq.com>
Date: 星期六, 11 十月 2025 13:39:27 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/dev_NEW' into dev_NEW
---
src/views/production/components/ProductionDetailsTable.vue | 456 +++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 348 insertions(+), 108 deletions(-)
diff --git a/src/views/production/components/ProductionDetailsTable.vue b/src/views/production/components/ProductionDetailsTable.vue
index 678ab65..e017a4d 100644
--- a/src/views/production/components/ProductionDetailsTable.vue
+++ b/src/views/production/components/ProductionDetailsTable.vue
@@ -1,116 +1,172 @@
<template>
<el-table :data="tableData" :border="border" style="width: 100%">
- <el-table-column label="鐓ょ" min-width="120" >
- <template #default="{ row, $index }" >
- <el-input
- v-model="row.coal"
- placeholder="璇疯緭鍏ョ叅绉�"
- @input="handleInput('coal', $index, $event)"
- />
+ <el-table-column label="鐓ゆ枡绫诲瀷" min-width="120">
+ <template #default="{ row, $index }">
+ <el-select
+ clearable
+ v-model="row.type"
+ placeholder="璇烽�夋嫨鐓ゆ枡绫诲瀷"
+ filterable
+ :key="`coalId-select-${$index}-${typeList.length}`"
+ :disabled="isViewMode"
+ >
+ <el-option
+ v-for="(item, index) of typeList"
+ :key="`option-${index}-${item.value}`"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
+ </template>
+ </el-table-column>
+ <el-table-column label="鐓ょ" min-width="120">
+ <template #default="{ row, $index }">
+ <el-select
+ clearable
+ :model-value="getCoalNameById(row.coalId) || row.coalId"
+ placeholder="璇烽�夋嫨鐓ょ"
+ @change="(value) => handleCoalSelectChange(row, value)"
+ filterable
+ :key="`coalId-select-${$index}-${weekList.length}`"
+ :disabled="isViewMode"
+ >
+ <el-option
+ v-for="(item, index) of weekList"
+ :key="`option-${index}-${item.key}`"
+ :label="item.value"
+ :value="item.value"
+ />
+ </el-select>
</template>
</el-table-column>
<el-table-column label="鐢熶骇鏁伴噺" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.productionQuantity"
- placeholder="璇疯緭鍏ョ敓浜ф暟閲�"
- type="number"
- @input="handleInput('productionQuantity', $index, $event)"
+ <el-input
+ v-model="row.productionQuantity"
+ placeholder="璇疯緭鍏ョ敓浜ф暟閲�"
+ type="number"
+ @input="handleInput('productionQuantity', $index, $event)"
+ :disabled="isViewMode"
/>
</template>
</el-table-column>
-
+
<el-table-column label="浜哄伐鎴愭湰" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.laborCost"
- placeholder="璇疯緭鍏ヤ汉宸ユ垚鏈�"
- type="number"
- @input="handleInput('laborCost', $index, $event)"
+ <el-input
+ v-model="row.laborCost"
+ placeholder="璇疯緭鍏ヤ汉宸ユ垚鏈�"
+ type="number"
+ @input="handleInput('laborCost', $index, $event)"
+ :disabled="isViewMode"
>
<template #suffix>
- <i style="font-style:normal;">鍏�</i>
+ <i style="font-style: normal">鍏�</i>
</template>
</el-input>
</template>
</el-table-column>
-
+
<el-table-column label="鑳借�楁垚鏈�" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.energyConsumptionCost"
- placeholder="璇疯緭鍏ヨ兘鑰楁垚鏈�"
- type="number"
- @input="handleInput('energyConsumptionCost', $index, $event)"
+ <!-- 涓嶈兘涓鸿礋鏁� -->
+ <el-input
+ v-model="row.energyConsumptionCost"
+ placeholder="璇疯緭鍏ヨ兘鑰楁垚鏈�"
+ type="number"
+ min="0"
+ step="0.01"
+ @input="handleInput('energyConsumptionCost', $index, $event)"
+ :disabled="isViewMode"
>
<template #suffix>
- <i style="font-style:normal;">鍏�</i>
+ <i style="font-style: normal">鍏�</i>
</template>
</el-input>
</template>
</el-table-column>
-
+
<el-table-column label="璁惧鎶樻棫" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.equipmentDepreciation"
- placeholder="璇疯緭鍏ヨ澶囨姌鏃�"
- type="number"
- @input="handleInput('equipmentDepreciation', $index, $event)"
+ <el-input
+ v-model="row.equipmentDepreciation"
+ placeholder="璇疯緭鍏ヨ澶囨姌鏃�"
+ type="number"
+ @input="handleInput('equipmentDepreciation', $index, $event)"
+ :disabled="isViewMode"
>
<template #suffix>
- <i style="font-style:normal;">鍏�</i>
+ <i style="font-style: normal">鍏�</i>
</template>
</el-input>
</template>
</el-table-column>
-
- <el-table-column label="閲囪喘鍗曚环" min-width="120">
+
+ <el-table-column label="閲囪喘鎬讳环" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.purchasePrice"
- placeholder="璇疯緭鍏ラ噰璐崟浠�"
- type="number"
- @input="handleInput('purchasePrice', $index, $event)"
+ <el-input
+ v-model="row.purchasePrice"
+ placeholder="璇疯緭鍏ラ噰璐�讳环"
+ type="number"
+ @input="handleInput('purchasePrice', $index, $event)"
+ :disabled="isViewMode"
>
<template #suffix>
- <i style="font-style:normal;">鍏�</i>
+ <i style="font-style: normal">鍏�</i>
</template>
</el-input>
</template>
</el-table-column>
-
+
<el-table-column label="鎬绘垚鏈�" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.totalCost"
- placeholder="鎬绘垚鏈�"
- type="number"
- :readonly="autoCalculate"
- @input="handleInput('totalCost', $index, $event)"
+ <el-input
+ disabled
+ v-model="row.totalCost"
+ placeholder="鎬绘垚鏈�"
+ type="number"
+ :readonly="autoCalculate"
+ @input="handleInput('totalCost', $index, $event)"
+
>
<template #suffix>
- <i style="font-style:normal;">鍏�</i>
+ <i style="font-style: normal">鍏�</i>
</template>
</el-input>
</template>
</el-table-column>
<el-table-column label="鐢熶骇浜�" min-width="120">
<template #default="{ row, $index }">
- <el-input
- v-model="row.producer"
- placeholder="鐢熶骇浜�"
- @input="handleInput('producer', $index, $event)"
- />
+ <el-select
+ clearable
+ :model-value="getUserNameById(row.producerId) || row.producerId"
+ placeholder="璇烽�夋嫨鐢熶骇浜�"
+ @change="(value) => handleUserSelectChange(row, value)"
+ filterable
+ :key="`producer-select-${$index}-${userList.length}`"
+ :disabled="isViewMode"
+ >
+ <el-option
+ v-for="(item, index) of userList"
+ :key="`option-${index}-${item.key}`"
+ :label="item.value"
+ :value="item.value"
+ />
+ </el-select>
</template>
</el-table-column>
- <el-table-column v-if="showOperations" label="鎿嶄綔" width="120" fixed="right">
+ <el-table-column
+ label="鎿嶄綔"
+ width="120"
+ fixed="right"
+ v-if="dialogType === 'add'"
+ >
<template #default="{ $index }">
- <el-button
- type="danger"
- size="small"
- @click="handleDelete($index)"
- :icon="Delete"
+ <el-button
+ type="danger"
+ size="small"
+ @click="handleDelete($index)"
+ :icon="Delete"
>
鍒犻櫎
</el-button>
@@ -120,93 +176,277 @@
</template>
<script setup name="ProductionDetailsTable">
-import { ref, computed, watch } from 'vue'
-import { Delete } from '@element-plus/icons-vue'
+import {ref, computed, watch, onMounted, nextTick} from "vue";
+import {Delete} from "@element-plus/icons-vue";
+import {ElMessage} from "element-plus";
+import {getCoalFieldList} from "@/api/basicInformation/coalQualityMaintenance";
+import {getCoalInfoList} from "@/api/production";
+import {userListAll} from "@/api/publicApi";
+const typeList = [
+ {
+ label: "鎴愬搧",
+ value: 1,
+ },
+ {
+ label: "鍘熸枡",
+ value: 2,
+ }
+ ]
const props = defineProps({
modelValue: {
type: Array,
- default: () => []
+ default: () => [],
},
border: {
type: Boolean,
- default: false
+ default: false,
},
showOperations: {
type: Boolean,
- default: true
+ default: true,
},
autoCalculate: {
type: Boolean,
- default: true
+ default: true,
+ },
+ dialogType:{
+ type: String,
+ default:'add'
}
-})
-
-const emit = defineEmits(['update:modelValue', 'input-change', 'delete-row'])
+});
+const isViewMode = computed(() => props.dialogType === "viewRow");
+const emit = defineEmits(["update:modelValue", "input-change", "delete-row"]);
// 浣跨敤 v-model 杩涜鍙屽悜缁戝畾
const tableData = computed({
get() {
- return props.modelValue
+ return props.modelValue;
},
set(value) {
- emit('update:modelValue', value)
- }
-})
+ emit("update:modelValue", value);
+ },
+});
// 澶勭悊杈撳叆鍙樺寲
const handleInput = (field, index, value) => {
- const newData = [...tableData.value]
- newData[index][field] = value
-
- // 濡傛灉寮�鍚嚜鍔ㄨ绠楁�绘垚鏈�
- if (props.autoCalculate && ['laborCost', 'energyCost', 'equipmentDepreciation', 'purchasePrice'].includes(field)) {
- calculateTotalCost(newData[index])
+ // 纭繚杈撳叆鍊兼槸鏁板瓧鎴栫┖瀛楃涓茶�屼笖闈炶礋鏁�
+ if (!/^\d*\.?\d*$/.test(value) && value !== "") {
+ ElMessage.error("璇疯緭鍏ユ湁鏁堢殑鏁板瓧");
+ return;
}
-
- tableData.value = newData
- emit('input-change', { field, index, value, row: newData[index] })
-}
+ const newData = [...tableData.value];
+ newData[index][field] = value;
+
+ // 濡傛灉寮�鍚嚜鍔ㄨ绠楁�绘垚鏈�
+ if (
+ props.autoCalculate &&
+ [
+ "laborCost",
+ "energyCost",
+ "equipmentDepreciation",
+ "purchasePrice",
+ ].includes(field)
+ ) {
+ calculateTotalCost(newData[index]);
+ }
+
+ tableData.value = newData;
+ emit("input-change", {field, index, value, row: newData[index]});
+};
// 璁$畻鎬绘垚鏈�
const calculateTotalCost = (row) => {
- const laborCost = parseFloat(row.laborCost) || 0
- const energyCost = parseFloat(row.energyCost) || 0
- const equipmentDepreciation = parseFloat(row.equipmentDepreciation) || 0
- const purchasePrice = parseFloat(row.purchasePrice) || 0
-
- row.totalCost = (laborCost + energyCost + equipmentDepreciation + purchasePrice).toFixed(2)
-}
+ const laborCost = parseFloat(row.laborCost) || 0;
+ const energyCost = parseFloat(row.energyConsumptionCost) || 0;
+ const equipmentDepreciation = parseFloat(row.equipmentDepreciation) || 0;
+ const purchasePrice = parseFloat(row.purchasePrice) || 0;
+
+ row.totalCost = (
+ laborCost +
+ energyCost +
+ equipmentDepreciation +
+ purchasePrice
+ ).toFixed(2);
+};
// 鍒犻櫎琛�
const handleDelete = (index) => {
- const newData = [...tableData.value]
- newData.splice(index, 1)
- tableData.value = newData
- emit('delete-row', index)
-}
+ const newData = [...tableData.value];
+ newData.splice(index, 1);
+ tableData.value = newData;
+ emit("delete-row", index);
+};
+// 澶勭悊鐓ょ閫夋嫨鍙樺寲
+
+// 澶勭悊鐓ょ閫夋嫨鍙樺寲锛堟柊鏂规硶锛氬悕绉伴�夋嫨杞琁D锛�
+const handleCoalSelectChange = (row, selectedName) => {
+ // 鏍规嵁閫夋嫨鐨勫悕绉版壘鍒板搴旂殑ID
+ const coalItem = weekList.value.find(item => item.value === selectedName);
+ if (coalItem) {
+ row.coalId = coalItem.key; // 璁剧疆涓篒D
+ } else {
+ row.coalId = ''; // 濡傛灉娌℃壘鍒帮紝娓呯┖
+ }
+};
+
+// 鏍规嵁ID鑾峰彇鐓ょ鍚嶇О锛堢敤浜庢樉绀猴級
+const getCoalNameById = (id) => {
+ const coalId = weekList.value.find(item => item.key == id);
+ return coalId ? coalId.value : id;
+};
+
+const weekList = ref([]);
+
+
+// 鐩戝惉琛ㄦ牸鏁版嵁鍙樺寲锛岀‘淇濇樉绀烘纭�
+watch(() => props.modelValue, (newValue) => {
+ if (newValue && weekList.value.length > 0) {
+ // 褰撴暟鎹姞杞藉畬鎴愪笖weekList宸茶幏鍙栨椂锛岀‘淇濇樉绀烘纭�
+ }
+}, {deep: true});
+
+// 鐩戝惉weekList鍙樺寲锛屽綋涓嬫媺鏁版嵁鍔犺浇瀹屾垚鍚庡鐞嗘樉绀�
+watch(weekList, (newList) => {
+ if (newList.length > 0 && tableData.value.length > 0) {
+ // 寮哄埗瑙﹀彂琛ㄦ牸閲嶆柊娓叉煋浠ョ‘淇漞l-select姝g‘鏄剧ず
+ nextTick(() => {
+ // 瑙﹀彂涓�涓井灏忕殑鏁版嵁鍙樺寲鏉ュ己鍒堕噸鏂版覆鏌�
+ const tempData = [...tableData.value];
+ tableData.value = tempData;
+ });
+ }
+}, {deep: true});
+
+onMounted(async () => {
+ let res = await getCoalInfoList()
+ console.log(res);
+ res.data.forEach(item => {
+ let obj = {};
+ obj.value = item.coal;
+ obj.key = item.id;
+ weekList.value.push(obj);
+ });
+ let ress = await userListAll();
+ ress.data.forEach(item => {
+ let obj = {};
+ obj.value = item.nickName;
+ obj.key = item.userId;
+ userList.value.push(obj);
+ });
+ // 閫氱煡鐖剁粍浠秝eekList宸插姞杞藉畬鎴�
+ nextTick(() => {
+ });
+})
+const dropdownList = ref([]);
+// 鑾峰彇涓嬫媺鏁版嵁
+const getDropdownData = async () => {
+ let res = await getCoalFieldList();
+ if (res.code === 200) {
+ dropdownList.value = res.data.map((item) => ({
+ value: item.coal,
+ key: item.id,
+ }));
+ } else {
+ ElMessage.error("鑾峰彇涓嬫媺鏁版嵁澶辫触");
+ }
+};
+const userList = ref([]);
+const getUserList = (async () => {
+ let res = await userListAll();
+ if (res.code === 200) {
+ userList.value = res.data.map((item) => ({
+ value: item.nickName,
+ key: item.userId,
+ }));
+ } else {
+ ElMessage.error("鑾峰彇鐢ㄦ埛鍒楄〃澶辫触");
+ }
+})
+// 鐩戝惉琛ㄦ牸鏁版嵁鍙樺寲锛岀‘淇濇樉绀烘纭�
+watch(() => props.modelValue, (newValue) => {
+ if (newValue && userList.value.length > 0) {
+ // 褰撴暟鎹姞杞藉畬鎴愪笖weekList宸茶幏鍙栨椂锛岀‘淇濇樉绀烘纭�
+ }
+}, {deep: true});
+
+// 鐩戝惉userList鍙樺寲锛屽綋涓嬫媺鏁版嵁鍔犺浇瀹屾垚鍚庡鐞嗘樉绀�
+watch(userList, (newList) => {
+ if (newList.length > 0 && tableData.value.length > 0) {
+ // 寮哄埗瑙﹀彂琛ㄦ牸閲嶆柊娓叉煋浠ョ‘淇漞l-select姝g‘鏄剧ず
+ nextTick(() => {
+ // 瑙﹀彂涓�涓井灏忕殑鏁版嵁鍙樺寲鏉ュ己鍒堕噸鏂版覆鏌�
+ const tempData = [...tableData.value];
+ tableData.value = tempData;
+ });
+ }
+}, {deep: true});
+
+const getUserNameById = (id) => {
+ const producer = userList.value.find(item => item.key == id);
+ return producer ? producer.value : id;
+};
+// 澶勭悊鐢ㄦ埛閫夋嫨鍙樺寲锛堟柊鏂规硶锛氬悕绉伴�夋嫨杞琁D锛�
+const handleUserSelectChange = (row, selectedName) => {
+ console.log("handleUserSelectChange", row, selectedName);
+ // 鏍规嵁閫夋嫨鐨勫悕绉版壘鍒板搴旂殑ID
+ const userItem = userList.value.find(item => item.value === selectedName);
+ if (userItem) {
+ row.producerId = userItem.key; // 璁剧疆涓篒D
+ } else {
+ row.producerId = ''; // 濡傛灉娌℃壘鍒帮紝娓呯┖
+ }
+};
// 鏆撮湶鏂规硶缁欑埗缁勪欢浣跨敤
defineExpose({
calculateTotalCost,
+ getDropdownData,
+ getUserList,
+ getCoalNameById, // 鏆撮湶鑾峰彇鐓ょ鍚嶇О鐨勬柟娉�
+ weekList, // 鏆撮湶weekList璁╃埗缁勪欢鍙互璁块棶
addRow: (rowData = {}) => {
const defaultRow = {
- coal: '',
- calorificValue: '',
- productionQuantity: '',
- laborCost: '',
- energyCost: '',
- equipmentDepreciation: '',
- purchasePrice: '',
- totalCost: '',
- ...rowData
- }
- tableData.value = [...tableData.value, defaultRow]
+ coalId: "",
+ calorificValue: "",
+ productionQuantity: "",
+ laborCost: "",
+ energyCost: "",
+ equipmentDepreciation: "",
+ purchasePrice: "",
+ totalCost: "",
+ producerId: "",
+ type: 1,
+ ...rowData,
+ };
+ tableData.value = [...tableData.value, defaultRow];
},
clearData: () => {
- tableData.value = []
+ tableData.value = [];
+ },
+ // 娣诲姞涓�涓柟娉曟潵绛夊緟weekList鍔犺浇瀹屾垚
+ waitForWeekList: () => {
+ return new Promise((resolve) => {
+ if (weekList.value.length > 0) {
+ resolve();
+ } else {
+ const unwatch = watch(weekList, (newList) => {
+ if (newList.length > 0) {
+ unwatch();
+ resolve();
+ }
+ });
+ }
+ });
+ },
+ // 寮哄埗鍒锋柊琛ㄦ牸鏄剧ず
+ forceRefresh: () => {
+ nextTick(() => {
+ const tempData = [...tableData.value];
+ tableData.value = tempData;
+ });
}
-})
+});
</script>
<style scoped>
--
Gitblit v1.9.3