From 2c9fbc6f1a3ccd1418efa9c348ec12faf1ab3258 Mon Sep 17 00:00:00 2001 From: zhang_12370 <z2864490065@outlook.com> Date: 星期三, 23 七月 2025 16:33:06 +0800 Subject: [PATCH] 1、完善表格逻辑 2、完善配煤计算器 3、完善设备管理 4、完善采购管理 --- src/views/calculator/index.vue | 196 ++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 177 insertions(+), 19 deletions(-) diff --git a/src/views/calculator/index.vue b/src/views/calculator/index.vue index e09e4c9..e9da943 100644 --- a/src/views/calculator/index.vue +++ b/src/views/calculator/index.vue @@ -403,7 +403,9 @@ <!-- 娣峰悎鐓ゅ睘鎬� --> <div class="props-section"> <div class="props-title">馃搳 娣峰悎鐓ゅ睘鎬�</div> - <div class="props-grid"> + + <!-- 鍩虹灞炴�у睍绀哄尯 --> + <div class="props-display-grid"> <div class="prop-item"> <span class="prop-label">鍙戠儹閲�:</span> <span class="prop-value" @@ -434,19 +436,45 @@ >{{ result.optimal.props.cost.toFixed(2) }} 鍏�/鍚�</span > </div> - <div class="prop-item"> - <span class="prop-label">鐢熸垚:</span> - <el-autocomplete - v-model="result.optimal.props.createCoal" - :fetch-suggestions="querySearch" - clearable - size="small" - class="inline-input red-border" - style="width: 180px; min-height: 24px !important" - placeholder="璇疯緭鍏ョ敓鎴愮叅绉�" - @blur="handleSelect($event)" - @select="handleSelect($event)" - /> + </div> + + <!-- 杈撳叆鎿嶄綔鍖� --> + <div class="props-input-section"> + <div class="input-row"> + <div class="input-item"> + <label class="input-label">鐢熸垚鐓ょ:</label> + <el-autocomplete + v-model="result.optimal.props.createCoal" + :fetch-suggestions="querySearch" + clearable + size="small" + class="coal-input" + placeholder="璇疯緭鍏�/閫夋嫨鐢熸垚鐓ょ" + @blur="handleSelect($event)" + @select="handleSelect($event)" + /> + </div> + <div class="input-item"> + <label class="input-label">鐢熶骇鏁伴噺:</label> + <el-input + type="number" + clearable + size="small" + class="quantity-input" + v-model="result.optimal.props.createCoalQuantity" + placeholder="璇疯緭鍏ョ敓浜ф暟閲�" + :min="0" + :max="999999" + :step="0.1" + :precision="2" + @input="handleQuantityInput" + @blur="handleQuantityBlur" + > + <template #suffix> + <span style="color: #909399; font-size: 12px;">鍚�</span> + </template> + </el-input> + </div> </div> </div> </div> @@ -652,6 +680,29 @@ result.value.optimal.props.createCoal = matchedName; } }; + +// 澶勭悊鏁伴噺杈撳叆 +const handleQuantityInput = (value) => { + // 闄愬埗杈撳叆鑼冨洿鍜岀簿搴� + if (value !== null && value !== undefined && value !== '') { + const numValue = parseFloat(value); + if (numValue < 0) { + result.value.optimal.props.createCoalQuantity = 0; + } else if (numValue > 999999) { + result.value.optimal.props.createCoalQuantity = 999999; + } + } +}; + +// 澶勭悊鏁伴噺澶辩劍 +const handleQuantityBlur = (event) => { + const value = event.target.value; + if (value && !isNaN(value)) { + // 鏍煎紡鍖栦负涓や綅灏忔暟 + const formatted = parseFloat(value).toFixed(2); + result.value.optimal.props.createCoalQuantity = formatted; + } +}; onMounted(async () => { getCoalInfo(); geInfoCoals(); @@ -801,7 +852,8 @@ const validationChecks = [ { condition: !result.value, message: "璇峰厛璁$畻鏈�浼橀厤姣斿悗鍐嶆坊鍔犺嚦寰呭叆搴�" }, { condition: !result.value.optimal, message: "璇峰厛璁$畻鏈�浼橀厤姣�" }, - { condition: !result.value.optimal.props.createCoal, message: "璇峰厛閫夋嫨鐢熸垚鐓ょ" } + { condition: !result.value.optimal.props.createCoal, message: "璇峰厛閫夋嫨鐢熸垚鐓ょ" }, + { condition: !result.value.optimal.props.createCoalQuantity || result.value.optimal.props.createCoalQuantity <= 0, message: "璇疯緭鍏ユ湁鏁堢殑鐢熶骇鏁伴噺" } ]; for (const check of validationChecks) { @@ -828,7 +880,6 @@ ); // 鍑嗗鏁版嵁 const optimalData = result.value.optimal; - optimalData.props.totalTonnage = formInline.value.totalTonnage; optimalData.props.cost = parseFloat(optimalData.props.cost.toFixed(2)); // 娣诲姞瀹樻柟ID @@ -872,9 +923,13 @@ const instructions = genInstructions( validCoals, ratios, - formInline.value.totalTonnage, formInline.value.scoopWeight ); + + // 鍒濆鍖栨墿灞曞睘鎬� + props.createCoal = ""; + props.createCoalQuantity = 0; + props.coalId = null; data.result = { show: true, @@ -917,7 +972,7 @@ if (altRatios) { const altProps = calcBlendProps(coals, altRatios); const altInstructions = genInstructions( - coals, altRatios, formInline.value.totalTonnage, formInline.value.scoopWeight + coals, altRatios, formInline.value.scoopWeight ); alternatives.push({ @@ -1186,6 +1241,66 @@ margin-bottom: 10px; } +/* 鍩虹灞炴�у睍绀虹綉鏍� */ +.props-display-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 8px; + margin-bottom: 15px; +} + +/* 杈撳叆鎿嶄綔鍖哄煙 */ +.props-input-section { + border-top: 1px solid #ebeef5; + padding-top: 15px; +} + +.input-row { + display: flex; + gap: 15px; + align-items: flex-end; + flex-wrap: wrap; +} + +.input-item { + flex: 1; + min-width: 200px; + display: flex; + flex-direction: column; +} + +.input-label { + font-size: 13px; + color: #606266; + margin-bottom: 6px; + font-weight: 500; +} + +.coal-input, +.quantity-input { + width: 100%; + border-radius: 4px; +} + +.coal-input :deep(.el-input__wrapper), +.quantity-input :deep(.el-input__wrapper) { + border: 1px solid #dcdfe6; + border-radius: 4px; + transition: all 0.2s; + min-height: 32px; +} + +.coal-input :deep(.el-input__wrapper):hover, +.quantity-input :deep(.el-input__wrapper):hover { + border-color: #c0c4cc; +} + +.coal-input :deep(.el-input__wrapper.is-focus), +.quantity-input :deep(.el-input__wrapper.is-focus) { + border-color: #409eff; + box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1); +} + .props-grid { display: grid; grid-template-columns: 1fr 1fr; @@ -1346,8 +1461,18 @@ } @media (max-width: 768px) { - .props-grid { + .props-display-grid { grid-template-columns: 1fr; + gap: 6px; + } + + .input-row { + flex-direction: column; + gap: 12px; + } + + .input-item { + min-width: 100%; } .table-container { @@ -1357,6 +1482,21 @@ :deep(.el-table .cell) { padding: 4px 8px; } + + .right-card { + width: 100%; + min-width: auto; + } +} + +@media (max-width: 1024px) { + .props-display-grid { + grid-template-columns: repeat(2, 1fr); + } + + .input-row { + gap: 12px; + } } :deep(.el-input__wrapper) { min-height: 24px !important; @@ -1364,4 +1504,22 @@ :deep(.el-input__inner) { min-height: 24px !important; } + +/* 鏁伴噺杈撳叆妗嗘牱寮忎紭鍖� */ +.coal-input :deep(.el-input__suffix), +.quantity-input :deep(.el-input__suffix) { + display: flex; + align-items: center; + padding-right: 8px; +} + +/* 杈撳叆妗嗙殑鍚庣紑鍗曚綅鏍峰紡 */ +.coal-input :deep(.el-input__suffix-inner), +.quantity-input :deep(.el-input__suffix-inner) { + display: flex; + align-items: center; + font-style: normal; + color: #909399; + font-size: 12px; +} </style> -- Gitblit v1.9.3