From 5e82a6f55d6f306a15fbf5d3f1855a647df7a105 Mon Sep 17 00:00:00 2001 From: wu <731351411@qq.com> Date: 星期四, 04 七月 2024 16:55:28 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- UI-Project/src/views/GlassStorage/MaterialRackManagement.vue | 316 +++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 286 insertions(+), 30 deletions(-) diff --git a/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue b/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue index 23b2204..b36c181 100644 --- a/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue +++ b/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue @@ -1,13 +1,13 @@ <template> - <div > + <div class="app-container"> <el-card style="flex: 1; margin-left: 10px; " :loading="loading"> <div slot="header" class="clearfix" style="display: flex; align-items: center;"> <!-- 宸︿晶鎸夐挳缁� --> <div > <el-button type="success" size="mini" @click="handleInbound()">鍏ュ簱</el-button> - <el-button type="success" size="mini" @click="handleInbound()">鍚婅浣嶅叆搴�</el-button> - <el-button type="success" size="mini" @click="handleInbound()">娣诲姞鍘熺墖</el-button> + <el-button type="success" size="mini" >鍚婅浣嶅叆搴�</el-button> + </div> <!-- 鍙充晶閫夋嫨妗� --> @@ -47,20 +47,20 @@ min-width="80" prop="shelf_status" > - <template #default="scope"> - <el-tag :type="getTagType(scope.row.shelf_status)"> - {{ scope.row.shelf_status === 1 ? '鍚敤' : '鏈惎鐢�' }} - </el-tag> - </template> +<template #default="scope"> + <el-tag :type="getTagType(scope.row.shelf_status)" @click="toggleStatus(scope.row)"> + {{ scope.row.shelf_status === 1 ? '鍚敤' : '鏈惎鐢�' }} + </el-tag> + </template> </el-table-column> <!-- 鎿嶄綔鍒� --> - <el-table-column label="鎿嶄綔" width="300"> + <el-table-column label="鎿嶄綔" width="350"> <template #default="{ row }"> - <el-button type="primary" size="mini" @click="handleEdit(row)">淇敼</el-button> + <el-button type="primary" size="mini" @click="edithandleRowClick(row)">淇敼</el-button> <el-button type="danger" size="mini" @click="handleDelete(row)">鍒犻櫎</el-button> <el-button type="warning" size="mini" @click="handleCheckout(row)">鍑哄簱</el-button> - + <el-button type="success" size="mini" @click="addglass()">娣诲姞鍘熺墖</el-button> </template> </el-table-column> </el-table> @@ -104,7 +104,7 @@ <el-table-column label="鎿嶄綔" width="350"> <template #default="{ row }"> <el-button type="primary" size="mini" @click="handleRestart(row)">閲嶆柊寮�濮�</el-button> - <el-button type="danger" size="mini" @click="handleDelete(row)">鍒犻櫎浠诲姟</el-button> + <el-button type="danger" size="mini" @click="handleDeletetask(row)">鍒犻櫎浠诲姟</el-button> <el-button type="success" size="mini" @click="handleComplete(row)">浠诲姟瀹屾垚</el-button> </template> </el-table-column> @@ -156,7 +156,65 @@ <el-button type="primary" @click="handleConfirmInbound">纭� 瀹�</el-button> </div> </el-dialog> - <div ref="chart" id="chart" style="width: 100%; height: 400px;"></div> + + + <el-dialog title="娣诲姞鍘熺墖" v-model="dialogVisible3" width="50%"> + <el-form :model="formData3" ref="form" label-width="80px"> + <el-form-item label="棰滆壊鑶滅郴"> + <el-input v-model="formData.selectedColor" readonly style="width: 250px; height: 35px; font-size: 20px"></el-input> + <el-dropdown @command="handleCommand"> + <span class="el-dropdown-link"> + 閫夋嫨<i class="el-icon-arrow-down el-icon--right"></i> + </span> + <el-dropdown-menu slot="dropdown"> + <el-dropdown-item v-for="color in colors" :key="color['0_glass_id']" :command="color['0_glass_id']"> + {{ color['0_glass_id'] }} + </el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> + </el-form-item> + + <el-form-item label="闀垮害"> + <el-input v-model="formData.wid" required style="width: 250px; font-size: 20px" @focus="clearInput('wid')"></el-input> + </el-form-item> + + <el-form-item label="楂樺害"> + <el-input v-model="formData.heig" required style="width: 250px; font-size: 20px" @focus="clearInput('heig')"></el-input> + </el-form-item> + + <el-form-item label="鍘氬害"> + <el-input v-model="formData.thinkness" required style="width: 250px; font-size: 20px" @focus="clearInput('thinkness')"></el-input> + </el-form-item> + + <el-form-item label="鏁伴噺"> + <el-input-number v-model="formData.num" required :min="0" :max="9000" style="width: 250px; font-size: 20px" @focus="clearInput('num')"></el-input-number> + </el-form-item> + </el-form> + + <span slot="footer" class="dialog-footer"> + <el-button @click="dialogVisible3 = false">鍏抽棴</el-button> + <el-button type="primary" @click="submitForm">鎻愪氦</el-button> + </span> + </el-dialog> + + <el-dialog title="缂栬緫" v-model="editdialogVisible" width="30%" @close="edithandleDialogClose"> + <el-form :model="editForm" ref="editFormRef" label-width="80px"> + <el-form-item label="鏁伴噺"> + <el-input v-model="editForm.quantity"></el-input> + </el-form-item> + <el-form-item label="鎵规鍙�"> + <el-input v-model="editForm.batchnumber"></el-input> + </el-form-item> + </el-form> + + <div class="dialog-footer"> + <el-button @click="editdialogVisible = false">鍙栨秷</el-button> + <el-button type="primary" @click="editsaveEdit">淇濆瓨</el-button> + </div> + </el-dialog> + + + <!-- <div ref="chart" id="chart" style="width: 100%; height: 400px;"></div> --> </div> </template> @@ -166,6 +224,7 @@ <script setup> import { ref, onMounted, onBeforeUnmount } from 'vue'; // 瀵煎叆 Vue 3 鐨勬ā鍧� import * as echarts from 'echarts'; +import { ElMessage, ElMessageBox } from 'element-plus' const loading = ref(false); @@ -177,7 +236,7 @@ height: '50', thickness: '10', quantity: '5', - entry_time: '2024-06-19', + entry_time: '2024-06-19 10:00:00', batchnumber:"444", shelf_status: 1 }, @@ -188,7 +247,7 @@ height: '60', thickness: '12', quantity: '10', - entry_time: '2024-06-18', + entry_time: '2024-06-19 10:00:00', batchnumber:"444", shelf_status: 0 }, @@ -199,7 +258,7 @@ height: '60', thickness: '12', quantity: '10', - entry_time: '2024-06-18', + entry_time: '2024-06-19 10:00:00', batchnumber:"444", shelf_status: 1 }, @@ -210,7 +269,7 @@ height: '60', thickness: '12', quantity: '10', - entry_time: '2024-06-18', + entry_time: '2024-06-19 10:00:00', batchnumber:"444", shelf_status: 1 }, @@ -221,7 +280,7 @@ height: '60', thickness: '12', quantity: '10', - entry_time: '2024-06-18', + entry_time: '2024-06-19 10:00:00', batchnumber:"444", shelf_status: 1 } @@ -247,6 +306,12 @@ return status === 1 ? 'success' : 'danger'; // 鏍规嵁鐘舵�佸�煎喅瀹氭爣绛剧被鍨嬶紝杩欓噷鍋囪鐘舵�佷负1鏃朵负鎴愬姛锛堢豢鑹诧級锛屽惁鍒欎负澶辫触锛堢孩鑹诧級 } + + const toggleStatus = (row) => { + // 鍒囨崲鏂欐灦鐘舵�佺殑閫昏緫 + row.shelf_status = 1 - row.shelf_status; // Toggle between 0 and 1 + // 姝ゅ鍙互娣诲姞淇濆瓨鐘舵�佺殑閫昏緫锛屾瘮濡傝皟鐢� API 鏇存柊鏁版嵁 + }; const tasktableData=ref([ @@ -283,20 +348,38 @@ }); - const handleEdit = (row) => { - // 澶勭悊淇敼鏁伴噺閫昏緫 - console.log('Edit Quantity:', row); - }; - + const handleDelete = (row) => { - // 澶勭悊鍒犻櫎閫昏緫 - console.log('Delete:', row); - }; + // 浣跨敤 Element UI 鐨� MessageBox.confirm 鏂规硶杩涜浜屾纭 + ElMessageBox.confirm('纭畾瑕佹墽琛屽垹闄ゆ搷浣滃悧锛�', '纭鍒犻櫎', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + }).then(() => { + // 鐐瑰嚮纭鎸夐挳鐨勫洖璋冿紝鎵ц鍑哄簱鎿嶄綔 + console.log('鎵ц鍒犻櫎鎿嶄綔', row); + }).catch(() => { + // 鐐瑰嚮鍙栨秷鎸夐挳鐨勫洖璋冿紝涓嶆墽琛屼换浣曟搷浣� + console.log('鍙栨秷鍒犻櫎鎿嶄綔'); + }); +}; + const handleCheckout = (row) => { - // 澶勭悊鍑哄簱閫昏緫 - console.log('Checkout:', row); - }; + // 浣跨敤 Element UI 鐨� MessageBox.confirm 鏂规硶杩涜浜屾纭 + ElMessageBox.confirm('纭畾瑕佹墽琛屽嚭搴撴搷浣滃悧锛�', '纭鍑哄簱', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + }).then(() => { + // 鐐瑰嚮纭鎸夐挳鐨勫洖璋冿紝鎵ц鍑哄簱鎿嶄綔 + console.log('鎵ц鍑哄簱鎿嶄綔', row); + }).catch(() => { + // 鐐瑰嚮鍙栨秷鎸夐挳鐨勫洖璋冿紝涓嶆墽琛屼换浣曟搷浣� + console.log('鍙栨秷鍑哄簱鎿嶄綔'); + }); +}; + const handleInbound = () => { // 鎵撳紑鍏ュ簱瀵硅瘽妗� @@ -322,7 +405,160 @@ // 鍏抽棴瀵硅瘽妗� dialogVisible.value = false; }; + + + + + + const dialogVisible3 = ref(false); + const colors = ref([ + { '0_glass_id': 'Red' }, + { '0_glass_id': 'Green' }, + { '0_glass_id': 'Blue' } + // Add more colors as needed + ]); + + const formData3 = ref({ + selectedColor: '', + wid: '', + heig: '', + thinkness: '', + num: '' + }); + + + const addglass = () => { + // 鎵撳紑鍏ュ簱瀵硅瘽妗� + dialogVisible3.value = true; + }; + const handleCommand = (command) => { + formData.value.selectedColor = command; + }; + + const clearInput = (field) => { + formData.value[field] = ''; + }; + + const submitForm = () => { + console.log('鎻愪氦鏁版嵁:', formData.value); + dialogVisible3.value = false; + // Add your submit logic here + }; + + + + const editdialogVisible = ref(false); + const editForm = ref({ + quantity: '', + batchnumber: '' + }); + const editFormRef = ref(null); + let currentRow = ref(null); + + // 澶勭悊琛岀偣鍑讳簨浠� + const edithandleRowClick = (row) => { + currentRow.value = row; + editForm.value.quantity = row.quantity.toString(); + editForm.value.batchnumber = row.batchnumber; + editdialogVisible.value = true; + console.log(editForm.value) + }; + + // 娣诲姞淇濆瓨缂栬緫鍐呭 + const editsaveEdit = () => { + if (!currentRow.value) return; + + // 鏇存柊褰撳墠琛屾暟鎹� + currentRow.value.quantity = parseInt(editForm.value.quantity); + currentRow.value.batchnumber = editForm.value.batchnumber; + + // 鍏抽棴瀵硅瘽妗� + editdialogVisible.value = false; + }; + + // 瀵硅瘽妗嗗叧闂椂閲嶇疆缂栬緫琛ㄥ崟鍜屽綋鍓嶈鏁版嵁 + const edithandleDialogClose = () => { + editForm.value.quantity = ''; + editForm.value.batchnumber = ''; + currentRow.value = null; + }; + + + + + + + + + const handleRestart = (row) => { + // 浣跨敤 Element UI 鐨� MessageBox.confirm 鏂规硶杩涜浜屾纭 + ElMessageBox.confirm('纭畾瑕佹墽琛岄噸鏂板紑濮嬫搷浣滃悧锛�', '纭閲嶆柊寮�濮�', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + }).then(() => { + // 鐐瑰嚮纭鎸夐挳鐨勫洖璋� + console.log('鎵ц閲嶆柊寮�濮嬫搷浣�', row); + }).catch(() => { + // 鐐瑰嚮鍙栨秷鎸夐挳鐨勫洖璋冿紝涓嶆墽琛屼换浣曟搷浣� + console.log('鍙栨秷閲嶆柊寮�濮嬫搷浣�'); + }); +}; + + +const handleDeletetask = (row) => { + // 浣跨敤 Element UI 鐨� MessageBox.confirm 鏂规硶杩涜浜屾纭 + ElMessageBox.confirm('纭畾瑕佹墽琛屽垹闄や换鍔℃搷浣滃悧锛�', '纭鍒犻櫎浠诲姟', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + }).then(() => { + // 鐐瑰嚮纭鎸夐挳鐨勫洖璋� + console.log('鎵ц鍒犻櫎浠诲姟鎿嶄綔', row); + }).catch(() => { + // 鐐瑰嚮鍙栨秷鎸夐挳鐨勫洖璋冿紝涓嶆墽琛屼换浣曟搷浣� + console.log('鍙栨秷鍒犻櫎浠诲姟鎿嶄綔'); + }); +}; + + + +const handleComplete = (row) => { + // 浣跨敤 Element UI 鐨� MessageBox.confirm 鏂规硶杩涜浜屾纭 + ElMessageBox.confirm('纭畾瑕佹墽琛屼换鍔″畬鎴愭搷浣滃悧锛�', '纭浠诲姟瀹屾垚', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + }).then(() => { + // 鐐瑰嚮纭鎸夐挳鐨勫洖璋� + console.log('鎵ц浠诲姟瀹屾垚鎿嶄綔', row); + }).catch(() => { + // 鐐瑰嚮鍙栨秷鎸夐挳鐨勫洖璋冿紝涓嶆墽琛屼换浣曟搷浣� + console.log('鍙栨秷浠诲姟瀹屾垚鎿嶄綔'); + }); +}; + + + + + + + + + + + + + + + + + + + + + let chartInstance = null; @@ -407,6 +643,26 @@ </script> -<style> +<style scoped> +html, body { + height: 100%; + margin: 0; + padding: 0; + overflow: hidden; /* 绂佹鍑虹幇婊氬姩鏉� */ +} +.app-container { + + flex-direction: column; + height: 100vh; /* 浣跨敤瑙嗗彛楂樺害 */ +} + + + + + +.custom-dialog { + max-height: 90vh; /* 鏈�澶ч珮搴︿负瑙嗗彛楂樺害鐨�90% */ + overflow-y: auto; /* 瀵硅瘽妗嗗唴閮ㄥ嚭鐜板瀭鐩存粴鍔ㄦ潯 */ +} </style> -- Gitblit v1.8.0