b2894lxlx/tms-erp-web
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(business): 修复下拉框定位及输入框宽度问题

Browse Source 
- 统一 business-crud-page.vue 表单控件宽度，包含 el-autocomplete 及其内部元素
- 调整调度弹窗收发货地址行网格，使地址输入框宽度自适应避免溢出
- contract-manage.vue 中所有 el-select 加 :teleported="false" 和 :fit-input-width="true"
- 强制 contract-manage.vue 下拉框在输入框正下方显示，防止弹出位置漂移
- 禁用 contract-manage.vue 下拉弹窗自动翻转，确保下拉框始终在下方显示
This commit is contained in:
赵忠林
2026-09-03 15:45:01 +08:00
parent 685a37b2df
commit 9e14f31604
3 changed files with 101 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/business/components/business-crud-page.vue
+8 -4
View File
@@ -13435,7 +13435,9 @@ export default {
:deep(.el-form-item__content > .el-select),
:deep(.el-form-item__content > .el-cascader),
:deep(.el-form-item__content > .el-input-number),
:deep(.el-form-item__content > .el-date-editor) {
:deep(.el-form-item__content > .el-date-editor),
:deep(.el-form-item__content > .el-autocomplete),
:deep(.el-form-item__content > .el-autocomplete > .el-input) {
width: 250px;
max-width: 100%;
}
@@ -13506,7 +13508,7 @@ export default {
&__shipping-title,
&__goods-title,
&__task-title {
min-width: 100%;
//min-width: 100%;
}
&__shipping-route-action {
@@ -13753,7 +13755,7 @@ export default {
);
gap: 8px;
align-items: center;
width: 100%;
width:98%;
:deep(.el-input),
:deep(.el-select),
@@ -13807,7 +13809,9 @@ export default {
}
&__dispatch-shipping-form &__route-address-row {
grid-template-columns: 260px minmax(280px, 1fr) 58px minmax(160px, 220px) 72px minmax(
// 地址列用 minmax(0, 1fr)：窗口较窄时地址输入框自动收窄，
// 避免各列最小宽度合计超出弹窗宽度，把右侧联系方式挤出弹窗。
grid-template-columns: 260px minmax(0, 1fr) 58px minmax(160px, 220px) 72px minmax(
160px,
220px
);
src/views/business/contract-manage.vue
+76 -7
View File
@@ -111,7 +111,14 @@
<div class="dialog-section-title">基本信息</div>
<div class="contract-manage-form__grid">
<el-form-item label="签约类型" prop="signType">
<el-select v-model="form.signType" placeholder="请选择签约类型">
<el-select
v-model="form.signType"
placeholder="请选择签约类型"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option
v-for="item in signTypeOptions"
:key="item.value"
@@ -136,7 +143,14 @@
/>
</el-form-item>
<el-form-item label="合同类型" prop="contractCategory">
<el-select v-model="form.contractCategory" placeholder="请选择合同类型">
<el-select
v-model="form.contractCategory"
placeholder="请选择合同类型"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option
v-for="item in contractCategoryOptions"
:key="item.value"
@@ -151,6 +165,10 @@
placeholder="请选择"
filterable
clearable
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
:loading="projectLoading"
@visible-change="visible => visible && loadProjectOptions()"
@change="handleProjectChange"
@@ -169,6 +187,10 @@
placeholder="请选择甲方"
filterable
clearable
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
:loading="contractPartyLoading"
@visible-change="visible => visible && loadContractPartyOptions()"
>
@@ -186,6 +208,10 @@
placeholder="请选择乙方"
filterable
clearable
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
:loading="contractPartyLoading"
@visible-change="visible => visible && loadContractPartyOptions()"
>
@@ -240,7 +266,14 @@
/>
</el-form-item>
<el-form-item label="结算类型" prop="settlementMode">
<el-select v-model="form.settlementMode" placeholder="请选择结算类型">
<el-select
v-model="form.settlementMode"
placeholder="请选择结算类型"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option
v-for="item in settlementModeOptions"
:key="item.value"
@@ -250,7 +283,14 @@
</el-select>
</el-form-item>
<el-form-item label="合同格式" prop="contractFormat">
<el-select v-model="form.contractFormat" placeholder="请选择合同格式">
<el-select
v-model="form.contractFormat"
placeholder="请选择合同格式"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option
v-for="item in contractFormatOptions"
:key="item.value"
@@ -260,7 +300,14 @@
</el-select>
</el-form-item>
<el-form-item label="是否需要加盖法人章" prop="legalSealFlag">
<el-select v-model="form.legalSealFlag" placeholder="请选择">
<el-select
v-model="form.legalSealFlag"
placeholder="请选择"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option label="否" :value="0" />
<el-option label="是" :value="1" />
</el-select>
@@ -359,6 +406,10 @@
<el-select
v-model="settlementRuleForm.settlementType"
placeholder="请选择结算类型"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
@change="handleSettlementTypeChange"
>
<el-option
@@ -373,6 +424,10 @@
<el-select
v-model="settlementRuleForm.billCycleType"
placeholder="请选择账单周期类型"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
@change="handleBillCycleTypeChange"
>
<el-option
@@ -384,7 +439,14 @@
</el-select>
</el-form-item>
<el-form-item v-if="showBillCutoffDay" label="账单截单日" required>
<el-select v-model="settlementRuleForm.billCutoffDay" placeholder="请选择账单截单日">
<el-select
v-model="settlementRuleForm.billCutoffDay"
placeholder="请选择账单截单日"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option
v-for="item in billCutoffDayOptions"
:key="item.value"
@@ -394,7 +456,14 @@
</el-select>
</el-form-item>
<el-form-item v-if="showCycleDays" label="周期天数" required>
<el-select v-model="settlementRuleForm.cycleDays" placeholder="请选择周期天数">
<el-select
v-model="settlementRuleForm.cycleDays"
placeholder="请选择周期天数"
:teleported="false"
:fit-input-width="true"
placement="bottom-start"
:popper-options="{ modifiers: [{ name: 'flip', enabled: false }] }"
>
<el-option
v-for="item in cycleDayOptions"
:key="item.value"