对于采购件的税率添加以及所属公司添加
This commit is contained in:
@ -1,16 +1,31 @@
|
||||
inventory-web/src/views/stock/inbound/buy.vue
|
||||
<template>
|
||||
<div class="buy-module">
|
||||
<div class="header-container">
|
||||
<div class="search-form-area">
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.company"
|
||||
placeholder="所属公司"
|
||||
class="filter-item-select"
|
||||
clearable
|
||||
filterable
|
||||
@change="fetchData"
|
||||
style="width: 160px;"
|
||||
>
|
||||
<el-option v-for="item in companyOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
|
||||
<el-input
|
||||
v-model="queryParams.keyword"
|
||||
placeholder="请输入名称或规格"
|
||||
class="filter-item-input"
|
||||
clearable
|
||||
@clear="fetchData"
|
||||
@keyup.enter="fetchData"
|
||||
style="width: 240px;"
|
||||
/>
|
||||
>
|
||||
<template #prefix><el-icon><Search /></el-icon></template>
|
||||
</el-input>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.category"
|
||||
@ -90,6 +105,11 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<template #default="scope" v-else-if="col.prop === 'company_name'">
|
||||
<el-tag v-if="scope.row.company_name" type="info" effect="plain" size="small" style="font-weight: bold;">{{ scope.row.company_name }}</el-tag>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
|
||||
<template #default="scope" v-else-if="col.prop === 'sn_bn'">
|
||||
<div v-if="scope.row.serial_number" class="id-cell">
|
||||
<span class="prefix-tag sn">SN</span>
|
||||
@ -115,6 +135,10 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
<span class="avail-num">{{ scope.row.qty_available }}</span>
|
||||
</template>
|
||||
|
||||
<template #default="scope" v-else-if="col.prop === 'tax_rate'">
|
||||
<span style="color: #909399;">{{ scope.row.tax_rate }}%</span>
|
||||
</template>
|
||||
|
||||
<template #default="scope" v-else-if="['arrival_photo', 'inspection_report'].includes(col.prop)">
|
||||
<div v-if="getImagesOnly(scope.row[col.prop]).length > 0" style="display: flex; align-items: center; justify-content: center;">
|
||||
<el-image
|
||||
@ -189,20 +213,23 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
|
||||
<div class="form-card basic-card">
|
||||
<div class="card-title">
|
||||
<el-icon class="icon"><Box/></el-icon>
|
||||
<span>1. 基础信息</span>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<el-icon class="icon"><Box/></el-icon>
|
||||
<span>1. 基础信息</span>
|
||||
</div>
|
||||
<span class="sub-title" v-if="dialogStatus === 'create'"> (请先搜索锁定物料)</span>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<el-row :gutter="24" v-if="dialogStatus === 'create'" style="margin-bottom: 15px;">
|
||||
<el-col :span="10">
|
||||
<el-row :gutter="24" v-if="dialogStatus === 'create'" style="margin-bottom: 20px;">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="物料搜索" prop="base_id" class="highlight-label">
|
||||
<el-select
|
||||
v-model="form.base_id"
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="输入名称或规格..."
|
||||
clearable
|
||||
placeholder="请输入名称或规格进行检索..."
|
||||
:remote-method="handleSearchMaterialDebounced"
|
||||
@visible-change="handleMaterialDropdownVisible"
|
||||
:loading="searchLoading"
|
||||
@ -210,8 +237,11 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
@change="onMaterialSelected"
|
||||
default-first-option
|
||||
v-loadmore="loadMoreMaterials"
|
||||
:teleported="false"
|
||||
popper-class="long-dropdown"
|
||||
>
|
||||
<template #prefix>
|
||||
<el-icon><Search /></el-icon>
|
||||
</template>
|
||||
<el-option
|
||||
v-for="item in materialOptions"
|
||||
:key="item.id"
|
||||
@ -219,32 +249,40 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
:value="item.id"
|
||||
>
|
||||
<div class="option-item">
|
||||
<span class="opt-name">{{ item.name }}</span>
|
||||
<span class="opt-spec">{{ item.spec }}</span>
|
||||
<el-tag v-if="item.isHistory" size="small" type="info" effect="plain">历史</el-tag>
|
||||
<el-tag v-else size="small" type="success" effect="plain">系统</el-tag>
|
||||
<div class="opt-main">
|
||||
<span class="opt-name" :title="item.name">{{ item.name }}</span>
|
||||
</div>
|
||||
<div class="opt-meta">
|
||||
<span class="opt-spec" :title="item.spec">{{ item.spec || '-' }}</span>
|
||||
</div>
|
||||
<div class="opt-tags">
|
||||
<el-tag size="small" type="info" effect="light" class="company-tag">{{ item.company_name }}</el-tag>
|
||||
<el-tag v-if="item.isHistory" size="small" type="warning" effect="plain">历史</el-tag>
|
||||
<el-tag v-else size="small" type="success" effect="plain">系统</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</el-option>
|
||||
<div v-if="loadingMore" style="text-align: center; color: #999; font-size: 12px; padding: 5px; background: #fff;">
|
||||
<div v-if="loadingMore" style="text-align: center; color: #999; font-size: 12px; padding: 8px; background: #f9f9f9;">
|
||||
<el-icon class="is-loading"><Refresh /></el-icon> 加载更多中...
|
||||
</div>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="14" style="display: flex; align-items: center;">
|
||||
<el-col :span="12" style="display: flex; align-items: center;">
|
||||
<span class="search-tip">
|
||||
<el-icon><InfoFilled/></el-icon> 仅支持名称/规格型号模糊搜索；滚动可加载更多。
|
||||
<el-icon><InfoFilled/></el-icon> 支持名称、规格型号、公司名称模糊搜索
|
||||
</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div class="read-only-grid">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8"><el-form-item label="名称"><el-input v-model="form.material_name" disabled class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="类型"><el-input v-model="form.material_type" disabled class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="类别"><el-input v-model="form.category" disabled class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="规格型号"><el-input v-model="form.spec_model" disabled class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="单位"><el-input v-model="form.unit" disabled class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="所属公司"><el-input v-model="form.company_name" readonly class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="名称"><el-input v-model="form.material_name" readonly class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="类型"><el-input v-model="form.material_type" readonly class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="类别"><el-input v-model="form.category" readonly class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="规格型号"><el-input v-model="form.spec_model" readonly class="is-text-view"/></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="单位"><el-input v-model="form.unit" readonly class="is-text-view"/></el-form-item></el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
@ -264,7 +302,7 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
<el-form-item label="入库日期" prop="in_date"><el-date-picker v-model="form.in_date" type="date" value-format="YYYY-MM-DD" style="width:100%" disabled/></el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="条码" prop="barcode"><el-input v-model="form.barcode" placeholder="扫描条码"/></el-form-item>
|
||||
<el-form-item label="条码" prop="barcode"><el-input v-model="form.barcode" placeholder="扫描条码" clearable/></el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="库位" prop="warehouse_location">
|
||||
@ -399,7 +437,19 @@ inventory-web/src/views/stock/inbound/buy.vue
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6"><el-form-item label="汇率"><el-input-number v-model="form.exchange_rate" :precision="2" controls-position="right" style="width:100%"/></el-form-item></el-col>
|
||||
<el-col :span="6"><el-form-item label="含税单价" prop="unit_price"><el-input-number v-model="form.unit_price" :precision="4" controls-position="right" style="width:100%"/></el-form-item></el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-form-item label="税率">
|
||||
<el-select v-model="form.tax_rate" style="width:100%">
|
||||
<el-option label="0%" :value="0" />
|
||||
<el-option label="1%" :value="1" />
|
||||
<el-option label="13%" :value="13" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6"><el-form-item label="不含税单价" prop="unit_price"><el-input-number v-model="form.unit_price" :precision="4" controls-position="right" style="width:100%"/></el-form-item></el-col>
|
||||
|
||||
<el-col :span="6"><el-form-item label="总价"><el-input-number v-model="form.total_price" :precision="2" disabled :controls="false" style="width:100%" class="total-price-input"/></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
@ -544,21 +594,24 @@ import {getLabelPreview, executePrint} from '@/api/common/print'
|
||||
import WebRtcCamera from '@/components/Camera/WebRtcCamera.vue'
|
||||
|
||||
// ------------------------------------
|
||||
// 自定义指令：v-loadmore
|
||||
// 自定义指令：v-loadmore (适配 Teleport 到 Body 的下拉框)
|
||||
// ------------------------------------
|
||||
const vLoadmore = {
|
||||
mounted(el: any, binding: any) {
|
||||
setTimeout(() => {
|
||||
const SELECT_DOM = el.querySelector('.el-select-dropdown .el-scrollbar__wrap')
|
||||
if (SELECT_DOM) {
|
||||
SELECT_DOM.addEventListener('scroll', function (this: any) {
|
||||
const checkAndBind = () => {
|
||||
const dropDownWrap = document.querySelector('.long-dropdown .el-select-dropdown__wrap')
|
||||
if (dropDownWrap && !dropDownWrap.getAttribute('data-loadmore-bound')) {
|
||||
dropDownWrap.setAttribute('data-loadmore-bound', 'true')
|
||||
dropDownWrap.addEventListener('scroll', function (this: any) {
|
||||
const condition = this.scrollHeight - this.scrollTop <= this.clientHeight + 1
|
||||
if (condition) {
|
||||
binding.value()
|
||||
}
|
||||
})
|
||||
}
|
||||
}, 200)
|
||||
}
|
||||
setTimeout(checkAndBind, 500)
|
||||
el.addEventListener('click', () => setTimeout(checkAndBind, 300))
|
||||
}
|
||||
}
|
||||
|
||||
@ -575,9 +628,9 @@ const tableData = ref([])
|
||||
const total = ref(0)
|
||||
const formRef = ref()
|
||||
|
||||
// 存储下拉选项
|
||||
const categoryOptions = ref<string[]>([])
|
||||
const typeOptions = ref<string[]>([])
|
||||
const companyOptions = ref<string[]>([])
|
||||
|
||||
const queryParams = reactive({
|
||||
page: 1,
|
||||
@ -585,6 +638,7 @@ const queryParams = reactive({
|
||||
keyword: '',
|
||||
category: '',
|
||||
material_type: '',
|
||||
company: '',
|
||||
statuses: ['在库', '借库']
|
||||
})
|
||||
|
||||
@ -599,7 +653,7 @@ const printLoading = ref(false)
|
||||
const printing = ref(false)
|
||||
const previewUrl = ref('')
|
||||
const currentPrintData = ref<any>({})
|
||||
const printCopies = ref(1) // [新增] 打印份数状态
|
||||
const printCopies = ref(1)
|
||||
|
||||
const entryMode = ref('batch')
|
||||
const modeLocked = ref(false)
|
||||
@ -614,6 +668,7 @@ const inspection_report_url = ref('')
|
||||
|
||||
// 基础列
|
||||
const baseColumns = [
|
||||
{prop: 'company_name', label: '所属公司'},
|
||||
{prop: 'material_name', label: '名称'},
|
||||
{prop: 'material_type', label: '类型'},
|
||||
{prop: 'category', label: '类别'},
|
||||
@ -635,7 +690,10 @@ const stockColumns = [
|
||||
{prop: 'qty_stock', label: '库存数', minWidth: '100'},
|
||||
{prop: 'qty_available', label: '可用数', minWidth: '100'},
|
||||
{prop: 'warehouse_loc', label: '库位', minWidth: '120'},
|
||||
{prop: 'unit_price', label: '单价', minWidth: '120'},
|
||||
|
||||
{prop: 'tax_rate', label: '税率', minWidth: '80'},
|
||||
{prop: 'unit_price', label: '不含税单价', minWidth: '120'},
|
||||
|
||||
{prop: 'total_price', label: '总价', minWidth: '120'},
|
||||
{prop: 'currency', label: '币种', minWidth: '80'},
|
||||
{prop: 'exchange_rate', label: '汇率', minWidth: '80'},
|
||||
@ -651,21 +709,27 @@ const stockColumns = [
|
||||
const allColumns = [...baseColumns, ...stockColumns]
|
||||
|
||||
const defaultColumns = [
|
||||
'company_name',
|
||||
'material_name', 'material_type', 'category', 'spec_model', 'unit',
|
||||
'inbound_date', 'sn_bn', 'warehouse_loc', 'status', 'inspection_status',
|
||||
'unit_price', 'total_price', 'supplier_name', 'purchaser', 'qty_stock', 'qty_available', 'arrival_photo', 'inspection_report'
|
||||
'tax_rate', 'unit_price', 'total_price',
|
||||
'supplier_name', 'purchaser', 'qty_stock', 'qty_available', 'arrival_photo', 'inspection_report'
|
||||
]
|
||||
|
||||
const visibleColumnProps = ref(defaultColumns)
|
||||
|
||||
const form = reactive({
|
||||
id: undefined, base_id: undefined as number | undefined, material_name: '', spec_model: '', category: '', unit: '', material_type: '',
|
||||
id: undefined, base_id: undefined as number | undefined,
|
||||
company_name: '',
|
||||
material_name: '', spec_model: '', category: '', unit: '', material_type: '',
|
||||
sku: '', barcode: '', in_date: '', serial_number: '', batch_number: '', status: '在库', inspection_status: '未检',
|
||||
in_quantity: 1, stock_quantity: 1, available_quantity: 1, warehouse_location: '',
|
||||
unit_price: 0, total_price: 0, currency: 'CNY', exchange_rate: 1.00,
|
||||
unit_price: 0, total_price: 0,
|
||||
tax_rate: 0,
|
||||
currency: 'CNY', exchange_rate: 1.00,
|
||||
supplier_name: '', purchaser: '', purchaser_email: '', source_link: '', detail_link: '',
|
||||
arrival_photo: [] as string[], inspection_report: [] as string[],
|
||||
print_copies: 1 // [新增] 入库时的打印份数
|
||||
print_copies: 1
|
||||
})
|
||||
|
||||
|
||||
@ -775,6 +839,7 @@ const loadMoreMaterials = async () => {
|
||||
const onMaterialSelected = (val: number) => {
|
||||
const item = materialOptions.value.find(i => i.id === val)
|
||||
if (item) {
|
||||
form.company_name = item.company_name
|
||||
form.material_name = item.name
|
||||
form.spec_model = item.spec
|
||||
form.category = item.category
|
||||
@ -877,6 +942,7 @@ const fetchOptions = async () => {
|
||||
if (res.code === 200) {
|
||||
categoryOptions.value = res.data.categories
|
||||
typeOptions.value = res.data.types
|
||||
companyOptions.value = res.data.companies
|
||||
}
|
||||
} catch (e) {
|
||||
console.error("Fetch options failed", e)
|
||||
@ -887,6 +953,7 @@ const resetQuery = () => {
|
||||
queryParams.keyword = ''
|
||||
queryParams.category = ''
|
||||
queryParams.material_type = ''
|
||||
queryParams.company = ''
|
||||
queryParams.page = 1
|
||||
fetchData()
|
||||
}
|
||||
@ -907,11 +974,15 @@ const handleUpdate = (row: any) => {
|
||||
resetForm()
|
||||
modeLocked.value = true
|
||||
Object.assign(form, {
|
||||
id: row.id, base_id: row.base_id, material_name: row.material_name, spec_model: row.spec_model, category: row.category,
|
||||
id: row.id, base_id: row.base_id,
|
||||
company_name: row.company_name,
|
||||
material_name: row.material_name, spec_model: row.spec_model, category: row.category,
|
||||
unit: row.unit, material_type: row.material_type, sku: row.sku, barcode: row.barcode, in_date: row.inbound_date,
|
||||
warehouse_location: row.warehouse_loc, status: row.status, inspection_status: row.inspection_status,
|
||||
in_quantity: Number(row.qty_inbound), stock_quantity: Number(row.qty_stock), available_quantity: Number(row.qty_available),
|
||||
unit_price: Number(row.unit_price), total_price: Number(row.total_price), currency: row.currency, exchange_rate: Number(row.exchange_rate),
|
||||
unit_price: Number(row.unit_price), total_price: Number(row.total_price),
|
||||
tax_rate: Number(row.tax_rate),
|
||||
currency: row.currency, exchange_rate: Number(row.exchange_rate),
|
||||
supplier_name: row.supplier_name, purchaser: row.purchaser, purchaser_email: row.purchaser_email,
|
||||
source_link: row.source_link, detail_link: row.detail_link,
|
||||
arrival_photo: row.arrival_photo || [], inspection_report: row.inspection_report || []
|
||||
@ -924,7 +995,7 @@ const handleUpdate = (row: any) => {
|
||||
inspection_report_url.value = reportLinks.length > 0 ? reportLinks[0] : ''
|
||||
if (row.serial_number) { entryMode.value = 'serial'; form.serial_number = row.serial_number; form.batch_number = '' }
|
||||
else { entryMode.value = 'batch'; form.batch_number = row.batch_number; form.serial_number = '' }
|
||||
materialOptions.value = [{ id: row.base_id, name: row.material_name, spec: row.spec_model, category: row.category }]
|
||||
materialOptions.value = [{ id: row.base_id, name: row.material_name, spec: row.spec_model, category: row.category, company_name: row.company_name }]
|
||||
visible.value = true
|
||||
}
|
||||
|
||||
@ -937,7 +1008,7 @@ const submitForm = async () => {
|
||||
if (inspection_report_url.value && !finalReportList.includes(inspection_report_url.value)) finalReportList.push(inspection_report_url.value)
|
||||
const onlyImages = finalReportList.filter(item => !isExternalLink(item))
|
||||
if (inspection_report_url.value) onlyImages.push(inspection_report_url.value)
|
||||
// 注意：这里不要把 print_copies 发送到后端，除非后端有接收字段。通常打印是前端行为。
|
||||
|
||||
const payload = { ...form, inspection_report: onlyImages, in_quantity: Number(form.in_quantity), unit_price: Number(form.unit_price) }
|
||||
try {
|
||||
if (dialogStatus.value === 'create') {
|
||||
@ -946,7 +1017,7 @@ const submitForm = async () => {
|
||||
if (res.data) {
|
||||
ElMessage.info('发送打印指令...')
|
||||
try {
|
||||
// [修改] 传递用户选择的打印份数，而不是默认的1份
|
||||
// [已修改] 传递用户选择的打印份数
|
||||
await executePrint({ ...res.data, copies: form.print_copies });
|
||||
ElMessage.success(`打印指令已发送 (x${form.print_copies})`)
|
||||
}
|
||||
@ -1077,7 +1148,7 @@ const handlePrint = async (row: any) => {
|
||||
printVisible.value = true;
|
||||
printLoading.value = true;
|
||||
previewUrl.value = '';
|
||||
printCopies.value = 1; // [新增] 每次打开打印弹窗重置为1份
|
||||
printCopies.value = 1;
|
||||
|
||||
currentPrintData.value = { global_print_id: row.global_print_id, material_name: row.material_name, spec_model: row.spec_model, category: row.category, material_type: row.material_type, warehouse_loc: row.warehouse_loc, serial_number: row.serial_number, batch_number: row.batch_number, sku: row.sku }
|
||||
try { const res: any = await getLabelPreview(currentPrintData.value); previewUrl.value = res.data }
|
||||
@ -1087,7 +1158,6 @@ const handlePrint = async (row: any) => {
|
||||
const confirmPrint = async () => {
|
||||
printing.value = true;
|
||||
try {
|
||||
// [修改] 将份数合并到打印数据中发送
|
||||
await executePrint({ ...currentPrintData.value, copies: printCopies.value });
|
||||
ElMessage.success('指令已发送');
|
||||
printVisible.value = false
|
||||
@ -1102,8 +1172,13 @@ const resetForm = () => {
|
||||
materialOptions.value = []; arrivalFileList.value = []; reportFileList.value = []; inspection_report_url.value = ''
|
||||
searchPage.value = 1; hasNextPage.value = true; searchKeyword.value = '';
|
||||
Object.assign(form, {
|
||||
id: undefined, base_id: undefined, material_name: '', spec_model: '', category: '', unit: '', material_type: '', sku: '', barcode: '', in_date: '', serial_number: '', batch_number: '', status: '在库', inspection_status: '未检', in_quantity: 1, stock_quantity: 1, available_quantity: 1, warehouse_location: '', unit_price: 0, total_price: 0, currency: 'CNY', exchange_rate: 1.00, supplier_name: '', purchaser: '', purchaser_email: '', source_link: '', detail_link: '', arrival_photo: [], inspection_report: [],
|
||||
print_copies: 1 // [新增] 重置时恢复为1
|
||||
id: undefined, base_id: undefined,
|
||||
company_name: '',
|
||||
material_name: '', spec_model: '', category: '', unit: '', material_type: '', sku: '', barcode: '', in_date: '', serial_number: '', batch_number: '', status: '在库', inspection_status: '未检', in_quantity: 1, stock_quantity: 1, available_quantity: 1, warehouse_location: '',
|
||||
unit_price: 0, total_price: 0,
|
||||
tax_rate: 0,
|
||||
currency: 'CNY', exchange_rate: 1.00, supplier_name: '', purchaser: '', purchaser_email: '', source_link: '', detail_link: '', arrival_photo: [], inspection_report: [],
|
||||
print_copies: 1
|
||||
})
|
||||
}
|
||||
const getStatusType = (status: string) => { const map: any = {'在库': 'success', '出库': 'info', '损耗': 'danger'}; return map[status] || 'warning' }
|
||||
@ -1111,7 +1186,7 @@ const formatMoney = (val: any, currency = '¥') => { const num = Number(val); re
|
||||
|
||||
onMounted(() => {
|
||||
fetchData()
|
||||
fetchOptions() // 加载下拉框数据
|
||||
fetchOptions()
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -1139,7 +1214,6 @@ onMounted(() => {
|
||||
/* 输入框样式 */
|
||||
}
|
||||
|
||||
/* 调整下拉框样式以匹配截图 */
|
||||
.filter-item-select {
|
||||
/* 确保下拉框高度和输入框一致 */
|
||||
}
|
||||
@ -1192,16 +1266,33 @@ onMounted(() => {
|
||||
.avail-num { font-weight: bold; color: #67C23A; font-size: 15px; }
|
||||
.sum-tag { margin-left: 4px; transform: scale(0.9); }
|
||||
:deep(.el-dialog__body) { padding: 0; overflow: hidden; }
|
||||
.dialog-scroll-container { padding: 15px 20px; max-height: 70vh; overflow-y: auto; overflow-x: hidden; }
|
||||
.stylish-form .form-card { background: #fff; border-radius: 8px; border: 1px solid #e4e7ed; margin-bottom: 15px; overflow: hidden; }
|
||||
|
||||
/* [已修改] 增加 min-height 确保弹窗即使内容少时也保持美观高度，防止被下拉框“压垮” */
|
||||
.dialog-scroll-container { padding: 15px 20px; max-height: 70vh; overflow-y: auto; overflow-x: hidden; min-height: 450px; }
|
||||
|
||||
.stylish-form .form-card { background: #fff; border-radius: 8px; border: 1px solid #e4e7ed; margin-bottom: 15px; }
|
||||
.card-title { background: #fcfcfc; padding: 10px 20px; border-bottom: 1px solid #ebeef5; font-weight: 600; font-size: 14px; color: #303133; display: flex; align-items: center; }
|
||||
.card-title .icon { margin-right: 8px; font-size: 18px; color: #409EFF; }
|
||||
.card-title .sub-title { font-size: 12px; color: #909399; font-weight: normal; margin-left: 10px; }
|
||||
.card-content { padding: 15px 20px; }
|
||||
.basic-card { border-left: 4px solid #409EFF; }
|
||||
.search-tip { color: #909399; font-size: 12px; margin-left: 10px; display: flex; align-items: center; gap: 4px; }
|
||||
.is-text-view :deep(.el-input__wrapper) { box-shadow: none !important; background-color: #f5f7fa; border-bottom: 1px solid #dcdfe6; border-radius: 0; padding-left: 0; }
|
||||
.is-text-view :deep(.el-input__inner) { color: #606266; font-weight: 500; font-size: 13px; }
|
||||
|
||||
/* 只读输入框样式：纯文本风格 */
|
||||
.is-text-view :deep(.el-input__wrapper) {
|
||||
box-shadow: none !important;
|
||||
background-color: transparent !important;
|
||||
border-bottom: 1px dashed #dcdfe6;
|
||||
border-radius: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
.is-text-view :deep(.el-input__inner) {
|
||||
color: #303133;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.inbound-card { border-left: 4px solid #67C23A; }
|
||||
.identity-panel { background: #fffbf0; border: 1px dashed #e6a23c; border-radius: 6px; padding: 12px; margin-bottom: 15px; }
|
||||
.custom-radio-group { margin-bottom: 10px; }
|
||||
@ -1214,9 +1305,53 @@ onMounted(() => {
|
||||
.divider-text::before { margin-right: 15px; }
|
||||
.divider-text::after { margin-left: 15px; }
|
||||
.dialog-footer { display: flex; justify-content: flex-end; gap: 15px; padding: 15px 20px; background: #fff; border-top: 1px solid #ebeef5; }
|
||||
.option-item { display: flex; justify-content: space-between; width: 100%; align-items: center; }
|
||||
.opt-name { font-weight: bold; }
|
||||
.opt-spec { color: #8492a6; font-size: 13px; margin-right: 10px; }
|
||||
|
||||
/* [重点优化] 下拉框选项样式 */
|
||||
.option-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8px 0;
|
||||
width: 100%;
|
||||
}
|
||||
/* 名称区域：占据剩余空间，但必须有 min-width: 0 以触发 ellipsis */
|
||||
.opt-main {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.opt-name {
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
/* 规格区域：固定较小宽度，靠右对齐 */
|
||||
.opt-meta {
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
flex-shrink: 0;
|
||||
margin-right: 10px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.opt-spec {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
/* 标签区域：不收缩 */
|
||||
.opt-tags {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.company-tag {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.total-price-input :deep(.el-input__inner) { color: #F56C6C; font-weight: bold; }
|
||||
.preview-box { min-height: 150px; display: flex; justify-content: center; align-items: center; background: #f5f7fa; border-radius: 4px; }
|
||||
.empty-preview { color: #909399; }
|
||||
@ -1230,4 +1365,18 @@ onMounted(() => {
|
||||
.camera-card:hover { border-color: #409EFF; color: #409EFF; }
|
||||
.camera-card .text { font-size: 12px; margin-top: 5px; }
|
||||
.camera-card .el-icon { font-size: 24px; }
|
||||
</style>
|
||||
|
||||
<style>
|
||||
/* 针对开启 teleport 后，挂载在 body 下的 dropdown */
|
||||
.long-dropdown {
|
||||
width: 580px !important; /* 固定宽度，比输入框稍宽以展示更多信息 */
|
||||
}
|
||||
.long-dropdown .el-select-dropdown__wrap {
|
||||
max-height: 320px !important; /* 限制高度，避免遮挡整个弹窗 */
|
||||
}
|
||||
/* [新增] 修复清除按钮被内容遮挡的问题 (Element Plus 偶发 Bug) */
|
||||
.long-dropdown .el-input__suffix {
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user