入库管理三页面类别搜索统一为级联选择器;基础信息“俗名”改名为“出厂名称”
This commit is contained in:
@ -14,7 +14,7 @@
|
||||
<el-select v-model="queryParams.searchField" style="width: 90px" @change="handleQuery">
|
||||
<el-option label="全部" value="all" />
|
||||
<el-option label="名称" value="name" />
|
||||
<el-option label="俗名" value="common_name" />
|
||||
<el-option label="出厂名称" value="common_name" />
|
||||
<el-option label="规格" value="spec" />
|
||||
</el-select>
|
||||
</template>
|
||||
@ -182,7 +182,7 @@
|
||||
<el-checkbox v-if="hasColPermission('id')" v-model="columns.id.visible" label="ID" />
|
||||
<el-checkbox v-if="hasColPermission('companyName')" v-model="columns.companyName.visible" label="所属公司" />
|
||||
<el-checkbox v-if="hasColPermission('name')" v-model="columns.name.visible" label="名称" />
|
||||
<el-checkbox v-if="hasColPermission('commonName')" v-model="columns.commonName.visible" label="俗名" />
|
||||
<el-checkbox v-if="hasColPermission('commonName')" v-model="columns.commonName.visible" label="出厂名称" />
|
||||
<el-checkbox v-if="hasColPermission('category')" v-model="columns.category.visible" label="类别" />
|
||||
<el-checkbox v-if="hasColPermission('type')" v-model="columns.type.visible" label="类型" />
|
||||
<el-checkbox v-if="hasColPermission('spec')" v-model="columns.spec.visible" label="规格型号" />
|
||||
@ -222,7 +222,7 @@
|
||||
|
||||
<el-table-column v-if="columns.name.visible" prop="name" label="名称" min-width="160" show-overflow-tooltip sortable="custom" />
|
||||
|
||||
<el-table-column v-if="columns.commonName.visible" prop="commonName" label="俗名" min-width="140" show-overflow-tooltip sortable="custom">
|
||||
<el-table-column v-if="columns.commonName.visible" prop="commonName" label="出厂名称" min-width="140" show-overflow-tooltip sortable="custom">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.commonName">{{ scope.row.commonName }}</span>
|
||||
<span v-else style="color: #ccc;">-</span>
|
||||
@ -390,7 +390,7 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="俗名" prop="commonName" v-if="hasFieldPermission('commonName')">
|
||||
<el-form-item label="出厂名称" prop="commonName" v-if="hasFieldPermission('commonName')">
|
||||
<el-input v-model="form.commonName" placeholder="标准名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -743,7 +743,7 @@ const fieldOptions = computed(() => {
|
||||
const allFields = [
|
||||
{ value: 'companyName', label: '所属公司', perm: 'material_list:companyName' },
|
||||
{ value: 'name', label: '名称', perm: 'material_list:name' },
|
||||
{ value: 'commonName', label: '俗名', perm: 'material_list:commonName' },
|
||||
{ value: 'commonName', label: '出厂名称', perm: 'material_list:commonName' },
|
||||
{ value: 'category', label: '类别', perm: 'material_list:category' },
|
||||
{ value: 'type', label: '类型', perm: 'material_list:type' },
|
||||
{ value: 'spec', label: '规格型号', perm: 'material_list:spec' },
|
||||
|
||||
@ -48,17 +48,17 @@
|
||||
<template #prefix><el-icon><Search /></el-icon></template>
|
||||
</el-input>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.category"
|
||||
<el-cascader
|
||||
v-model="searchCategoryPath"
|
||||
:options="categoryTreeOptions"
|
||||
:props="{ checkStrictly: true }"
|
||||
placeholder="类别"
|
||||
class="filter-item-select"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 220px;"
|
||||
@change="fetchData"
|
||||
style="width: 160px;"
|
||||
>
|
||||
<el-option v-for="item in categoryOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
/>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.material_type"
|
||||
@ -819,6 +819,17 @@ const isUploading = ref(false)
|
||||
const categoryOptions = ref<string[]>([])
|
||||
const typeOptions = ref<string[]>([])
|
||||
const companyOptions = ref<string[]>([])
|
||||
const categoryTreeOptions = ref<{ value: string; label: string; children?: any[] }[]>([])
|
||||
|
||||
// 用于搜索栏级联选择器的数据绑定中转:数组 <-> 以 "/" 拼接的字符串
|
||||
const searchCategoryPath = computed({
|
||||
get() {
|
||||
return queryParams.category ? queryParams.category.split('/') : [];
|
||||
},
|
||||
set(val: string[] | null) {
|
||||
queryParams.category = val && val.length > 0 ? val.join('/') : '';
|
||||
}
|
||||
});
|
||||
|
||||
const queryParams = reactive({
|
||||
page: 1,
|
||||
@ -1383,6 +1394,7 @@ const fetchOptions = async () => {
|
||||
const res: any = await getFilterOptions()
|
||||
if (res.code === 200) {
|
||||
categoryOptions.value = res.data.categories
|
||||
categoryTreeOptions.value = buildCategoryTree(res.data.categories || [])
|
||||
typeOptions.value = res.data.types
|
||||
companyOptions.value = res.data.companies
|
||||
}
|
||||
@ -1391,6 +1403,30 @@ const fetchOptions = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 将 "IRIS/半成品/无人机" 之类的字符串数组构建为级联树
|
||||
const buildCategoryTree = (categories: string[]) => {
|
||||
const root: { value: string; label: string; children?: any[] }[] = [];
|
||||
categories.forEach((cat: string) => {
|
||||
if (!cat) return;
|
||||
const parts = cat.split('/');
|
||||
let currentLevel = root;
|
||||
parts.forEach((part, index) => {
|
||||
let existingNode = currentLevel.find(n => n.value === part);
|
||||
if (!existingNode) {
|
||||
existingNode = { value: part, label: part };
|
||||
currentLevel.push(existingNode);
|
||||
}
|
||||
if (index < parts.length - 1) {
|
||||
if (!existingNode.children) {
|
||||
existingNode.children = [];
|
||||
}
|
||||
currentLevel = existingNode.children as any[];
|
||||
}
|
||||
});
|
||||
});
|
||||
return root;
|
||||
};
|
||||
|
||||
// 加载库位树数据
|
||||
const loadWarehouseTree = async () => {
|
||||
try {
|
||||
|
||||
@ -47,17 +47,17 @@
|
||||
<template #prefix><el-icon><Search /></el-icon></template>
|
||||
</el-input>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.category"
|
||||
<el-cascader
|
||||
v-model="searchCategoryPath"
|
||||
:options="categoryTreeOptions"
|
||||
:props="{ checkStrictly: true }"
|
||||
placeholder="类别"
|
||||
class="filter-item-select"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 220px;"
|
||||
@change="fetchData"
|
||||
style="width: 160px;"
|
||||
>
|
||||
<el-option v-for="item in categoryOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
/>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.material_type"
|
||||
@ -675,6 +675,18 @@ const isUploading = ref(false)
|
||||
|
||||
const queryParams = reactive({ page: 1, pageSize: 20, keyword: '', searchField: 'all', sku: '', category: '', material_type: '', statuses: ['在库', '借库'], company: '', orderByColumn: '', isAsc: '', advancedFilters: [] })
|
||||
const categoryOptions = ref<string[]>([])
|
||||
const categoryTreeOptions = ref<{ value: string; label: string; children?: any[] }[]>([])
|
||||
|
||||
// 用于搜索栏级联选择器的数据绑定中转:数组 <-> 以 "/" 拼接的字符串
|
||||
const searchCategoryPath = computed({
|
||||
get() {
|
||||
return queryParams.category ? queryParams.category.split('/') : [];
|
||||
},
|
||||
set(val: string[] | null) {
|
||||
queryParams.category = val && val.length > 0 ? val.join('/') : '';
|
||||
}
|
||||
});
|
||||
|
||||
const typeOptions = ref<string[]>([])
|
||||
const companyOptions = ref<string[]>([]) // [新增]
|
||||
const advancedFilterVisible = ref(false)
|
||||
@ -1157,6 +1169,7 @@ const fetchOptions = async () => {
|
||||
const res: any = await getFilterOptions()
|
||||
if (res.code === 200) {
|
||||
categoryOptions.value = res.data.categories
|
||||
categoryTreeOptions.value = buildCategoryTree(res.data.categories || [])
|
||||
typeOptions.value = res.data.types
|
||||
companyOptions.value = res.data.companies // [新增]
|
||||
}
|
||||
@ -1165,6 +1178,30 @@ const fetchOptions = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 将 "IRIS/半成品/无人机" 之类的字符串数组构建为级联树
|
||||
const buildCategoryTree = (categories: string[]) => {
|
||||
const root: { value: string; label: string; children?: any[] }[] = [];
|
||||
categories.forEach((cat: string) => {
|
||||
if (!cat) return;
|
||||
const parts = cat.split('/');
|
||||
let currentLevel = root;
|
||||
parts.forEach((part, index) => {
|
||||
let existingNode = currentLevel.find(n => n.value === part);
|
||||
if (!existingNode) {
|
||||
existingNode = { value: part, label: part };
|
||||
currentLevel.push(existingNode);
|
||||
}
|
||||
if (index < parts.length - 1) {
|
||||
if (!existingNode.children) {
|
||||
existingNode.children = [];
|
||||
}
|
||||
currentLevel = existingNode.children as any[];
|
||||
}
|
||||
});
|
||||
});
|
||||
return root;
|
||||
};
|
||||
|
||||
// 加载库位树数据
|
||||
const loadWarehouseTree = async () => {
|
||||
try {
|
||||
|
||||
@ -48,17 +48,17 @@
|
||||
<template #prefix><el-icon><Search /></el-icon></template>
|
||||
</el-input>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.category"
|
||||
<el-cascader
|
||||
v-model="searchCategoryPath"
|
||||
:options="categoryTreeOptions"
|
||||
:props="{ checkStrictly: true }"
|
||||
placeholder="类别"
|
||||
class="filter-item-select"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 220px;"
|
||||
@change="fetchData"
|
||||
style="width: 160px;"
|
||||
>
|
||||
<el-option v-for="item in categoryOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
/>
|
||||
|
||||
<el-select
|
||||
v-model="queryParams.material_type"
|
||||
@ -728,6 +728,18 @@ const isUploading = ref(false)
|
||||
|
||||
const queryParams = reactive({ page: 1, pageSize: 20, keyword: '', searchField: 'all', sku: '', category: '', material_type: '', statuses: ['在库', '借库'], company: '', orderByColumn: '', isAsc: '', advancedFilters: [] })
|
||||
const categoryOptions = ref<string[]>([])
|
||||
const categoryTreeOptions = ref<{ value: string; label: string; children?: any[] }[]>([])
|
||||
|
||||
// 用于搜索栏级联选择器的数据绑定中转:数组 <-> 以 "/" 拼接的字符串
|
||||
const searchCategoryPath = computed({
|
||||
get() {
|
||||
return queryParams.category ? queryParams.category.split('/') : [];
|
||||
},
|
||||
set(val: string[] | null) {
|
||||
queryParams.category = val && val.length > 0 ? val.join('/') : '';
|
||||
}
|
||||
});
|
||||
|
||||
const typeOptions = ref<string[]>([])
|
||||
const companyOptions = ref<string[]>([]) // [新增]
|
||||
const advancedFilterVisible = ref(false)
|
||||
@ -1248,6 +1260,7 @@ const fetchOptions = async () => {
|
||||
const res: any = await getFilterOptions()
|
||||
if (res.code === 200) {
|
||||
categoryOptions.value = res.data.categories
|
||||
categoryTreeOptions.value = buildCategoryTree(res.data.categories || [])
|
||||
typeOptions.value = res.data.types
|
||||
companyOptions.value = res.data.companies // [新增]
|
||||
}
|
||||
@ -1256,6 +1269,30 @@ const fetchOptions = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 将 "IRIS/半成品/无人机" 之类的字符串数组构建为级联树
|
||||
const buildCategoryTree = (categories: string[]) => {
|
||||
const root: { value: string; label: string; children?: any[] }[] = [];
|
||||
categories.forEach((cat: string) => {
|
||||
if (!cat) return;
|
||||
const parts = cat.split('/');
|
||||
let currentLevel = root;
|
||||
parts.forEach((part, index) => {
|
||||
let existingNode = currentLevel.find(n => n.value === part);
|
||||
if (!existingNode) {
|
||||
existingNode = { value: part, label: part };
|
||||
currentLevel.push(existingNode);
|
||||
}
|
||||
if (index < parts.length - 1) {
|
||||
if (!existingNode.children) {
|
||||
existingNode.children = [];
|
||||
}
|
||||
currentLevel = existingNode.children as any[];
|
||||
}
|
||||
});
|
||||
});
|
||||
return root;
|
||||
};
|
||||
|
||||
// 加载库位树数据
|
||||
const loadWarehouseTree = async () => {
|
||||
try {
|
||||
|
||||
Reference in New Issue
Block a user