pig/pig-farm-controller-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化展示

Browse Source
This commit is contained in:
huang
2025-11-27 18:27:31 +08:00
parent 24344e380a
commit aa50fdc9de
1 changed files with 15 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/inventory/StockAdjustmentDialog.vue
View File

@@ -27,21 +27,20 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="变动数量" prop="change_amount"> <el-form-item label="变动数量" prop="change_amount">
<el-input-group class="stock-adjustment-input-group"> <div class="amount-unit-wrapper">
<el-input-number <el-input-number
v-model="displayAmount" v-model="displayAmount"
:min="computedMin" :min="computedMin"
:precision="computedPrecision" :precision="computedPrecision"
:step="computedStep" :step="computedStep"
controls-position="right" controls-position="right"
class="amount-input"
></el-input-number> ></el-input-number>
<template #append> <el-select v-model="unit" placeholder="单位" class="unit-select">
<el-select v-model="unit" placeholder="单位" style="width: 80px;"> <el-option label="g" value="g"></el-option>
<el-option label="g" value="g"></el-option> <el-option label="kg" value="kg"></el-option>
<el-option label="kg" value="kg"></el-option> </el-select>
</el-select> </div>
</template>
</el-input-group>
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" :rows="2"></el-input> <el-input v-model="form.remarks" type="textarea" :rows="2"></el-input>
@@ -242,27 +241,18 @@ export default {
</script> </script>
<style scoped> <style scoped>
/* 确保 el-input-group 的 append 部分正确显示 */ .amount-unit-wrapper {
.stock-adjustment-input-group {
display: flex; display: flex;
width: 100%; /* 确保 input-group 占据可用宽度 */ align-items: center;
width: 100%;
} }
/* 针对 el-input-number 内部的输入框 */ .amount-input {
.stock-adjustment-input-group :deep(.el-input-number) { flex: 1; /* 让输入框占据剩余空间 */
flex: 1; /* 让 el-input-number 占据剩余空间 */ margin-right: 10px; /* 输入框和选择器之间的间距 */
} }
/* 针对 el-input-group__append 内部的 el-select */ .unit-select {
.stock-adjustment-input-group :deep(.el-input-group__append) { width: 80px; /* 固定单位选择器的宽度 */
background-color: var(--el-fill-color-blank);
padding: 0;
/* 确保 select 宽度固定 */
width: 80px;
}
.stock-adjustment-input-group :deep(.el-input-group__append .el-select) {
margin: 0;
width: 100%; /* 让 select 填充 append 区域 */
} }
</style> </style>