refactor(organization): 将所属组织搜索组件统一替换为级联选择器
- 全站搜索栏所属组织由树形下拉 (el-tree-select) 统一替换为级联选择器 (el-cascader) - 修改多个视图和组件中所属组织相关表单与搜索逻辑，适配级联选择器数据结构 - 组织数据结构调整及新增 findOrgPath、findDeptPath 等方法支持路径反查与回显 - 表单模型与搜索参数中所属组织字段改用 ID 路径数组，提交时转换为名称 - 优化所属组织搜索UI，统一清除、过滤、提示等功能样式和行为 - 引入 organization-search mixin 支持组织数据加载、路径转换及搜索参数格式化 - 更新相关依赖组件 Element Plus 引入 ElCascader 替换 ElTreeSelect - 修正搜索表单CSS，新增el-cascader全宽样式支持搜索栏布局一致性 - 兼容老数据，支持多种部门ID格式自动转换到单选路径数组格式 - 业务部门与承办部门表单同样应用级联选择器及路径转换逻辑 - 相关搜索配置项所属组织字段类型由 input 改为 cascader，提升搜索交互体验
This commit is contained in:
@@ -490,14 +490,14 @@
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="所属组织" prop="organizationName">
|
||||
<el-select v-model="driverForm.organizationName" clearable filterable>
|
||||
<el-option
|
||||
v-for="item in organizationOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-cascader
|
||||
v-model="organizationCascaderValue"
|
||||
:options="organizationTreeOptions"
|
||||
:props="organizationCascaderProps"
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择 所属组织"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -815,6 +815,15 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
// 所属组织级联：表单存组织名称，级联控件用 id 路径，两者在此双向转换
|
||||
organizationCascaderValue: {
|
||||
get() {
|
||||
return this.resolveOrgPath(this.driverForm.organizationName);
|
||||
},
|
||||
set(path) {
|
||||
this.driverForm.organizationName = this.resolveOrgName(path);
|
||||
},
|
||||
},
|
||||
isAdmin() {
|
||||
const authority = this.userInfo.authority || '';
|
||||
return authority.includes('admin');
|
||||
@@ -1613,6 +1622,8 @@ export default {
|
||||
this.onLoad(this.page);
|
||||
},
|
||||
searchChange(params, done) {
|
||||
// 所属组织级联返回的是 id 路径，转成组织名称传给后端
|
||||
this.normalizeOrganizationSearch(params);
|
||||
this.searchForm = params;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, params);
|
||||
|
||||
@@ -145,19 +145,14 @@
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="船舶所属组织" prop="organizationName">
|
||||
<el-select
|
||||
v-model="shipForm.organizationName"
|
||||
<el-cascader
|
||||
v-model="organizationCascaderValue"
|
||||
:options="organizationTreeOptions"
|
||||
:props="organizationCascaderProps"
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in organizationOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
placeholder="请选择 船舶所属组织"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
@@ -707,6 +702,15 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
// 船舶所属组织级联：表单存组织名称，级联控件用 id 路径，两者在此双向转换
|
||||
organizationCascaderValue: {
|
||||
get() {
|
||||
return this.resolveOrgPath(this.shipForm.organizationName);
|
||||
},
|
||||
set(path) {
|
||||
this.shipForm.organizationName = this.resolveOrgName(path);
|
||||
},
|
||||
},
|
||||
isAdmin() {
|
||||
const authority = this.userInfo.authority || '';
|
||||
return authority.includes('admin');
|
||||
@@ -1100,6 +1104,8 @@ export default {
|
||||
this.onLoad(this.page);
|
||||
},
|
||||
searchChange(params, done) {
|
||||
// 所属组织级联返回的是 id 路径，转成组织名称传给后端
|
||||
this.normalizeOrganizationSearch(params);
|
||||
this.searchForm = params;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, params);
|
||||
|
||||
@@ -159,19 +159,14 @@
|
||||
<el-row :gutter="18">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所有组织" prop="organizationName">
|
||||
<el-select
|
||||
v-model="vehicleForm.organizationName"
|
||||
<el-cascader
|
||||
v-model="organizationCascaderValue"
|
||||
:options="organizationTreeOptions"
|
||||
:props="organizationCascaderProps"
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in organizationOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
placeholder="请选择 所属组织"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -709,6 +704,15 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['permission', 'userInfo']),
|
||||
// 所属组织级联：表单存组织名称，级联控件用 id 路径，两者在此双向转换
|
||||
organizationCascaderValue: {
|
||||
get() {
|
||||
return this.resolveOrgPath(this.vehicleForm.organizationName);
|
||||
},
|
||||
set(path) {
|
||||
this.vehicleForm.organizationName = this.resolveOrgName(path);
|
||||
},
|
||||
},
|
||||
isAdmin() {
|
||||
const authority = this.userInfo.authority || '';
|
||||
return authority.includes('admin');
|
||||
@@ -1275,6 +1279,8 @@ export default {
|
||||
this.onLoad(this.page);
|
||||
},
|
||||
searchChange(params, done) {
|
||||
// 所属组织级联返回的是 id 路径，转成组织名称传给后端
|
||||
this.normalizeOrganizationSearch(params);
|
||||
this.searchForm = params;
|
||||
this.page.currentPage = 1;
|
||||
this.onLoad(this.page, params);
|
||||
|
||||
Reference in New Issue
Block a user