fix: 搜索无结果时新建按钮改为el-select的empty插槽,避免被遮挡

- 将「新建客户」按钮从 el-select 下方的独立 div 移入 #empty 插槽
- 搜索无匹配时,下拉面板直接显示「未找到xxx」+ 新建按钮
- 不再被原生「无数据」空状态遮挡
- 移动端+桌面端五个页面统一修复

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2026-07-12 18:04:45 +08:00
parent 5682c12085
commit c489a8d6fd
5 changed files with 41 additions and 21 deletions
+7 -3
View File
@@ -262,10 +262,13 @@ async function quickStatusChange(row: any, newStatus: string) {
<el-form-item label="客户单位">
<el-select v-model="form.customer_id" filterable remote :remote-method="handleCustomerSearch" placeholder="搜索选择客户" style="width:100%">
<el-option v-for="c in customers" :key="c.id" :label="c.name" :value="c.id" />
<template #empty>
<div v-if="customerSearch" class="select-empty-create">
<p style="color:var(--warm-gray);font-size:13px;margin:0 0 8px">未找到「{{ customerSearch }}」</p>
<button type="button" class="quick-create-btn" @click.stop="handleQuickCreate">+ 新建客户「{{ customerSearch }}」</button>
</div>
</template>
</el-select>
<div v-if="customerSearch && !customers.some(c => c.name === customerSearch)" style="margin-top:6px">
<button type="button" class="quick-create-btn" @click="handleQuickCreate">+ 新建客户「{{ customerSearch }}」</button>
</div>
</el-form-item>
<el-form-item label="计划拜访时间">
<el-date-picker v-model="form.plan_date" type="date" style="width:100%" />
@@ -314,4 +317,5 @@ async function quickStatusChange(row: any, newStatus: string) {
.filter-count { font-size: 12px; color: var(--c-text-muted); font-family: var(--font-mono); margin-left: auto; }
.quick-create-btn { display: inline-flex; align-items: center; gap: 4px; background: none; border: 1px dashed var(--gold); padding: 6px 12px; color: var(--gold-dark); font-family: var(--font-body); font-size: 12px; cursor: pointer; transition: all 0.2s; }
.quick-create-btn:hover { border-color: var(--vermilion); color: var(--vermilion); background: rgba(184,71,46,0.03); }
.select-empty-create { padding: 8px 12px; text-align: center; }
</style>