yxk-20260527-巡视整改提升台账,问题清单树形结构改造
This commit is contained in:
@@ -13,6 +13,7 @@ enum Api {
|
|||||||
loadTreeData = '/dqinspectproblem/dqInspectProblem/loadTreeRoot',
|
loadTreeData = '/dqinspectproblem/dqInspectProblem/loadTreeRoot',
|
||||||
getChildList = '/dqinspectproblem/dqInspectProblem/childList',
|
getChildList = '/dqinspectproblem/dqInspectProblem/childList',
|
||||||
getChildListBatch = '/dqinspectproblem/dqInspectProblem/getChildListBatch',
|
getChildListBatch = '/dqinspectproblem/dqInspectProblem/getChildListBatch',
|
||||||
|
parentOptions = '/dqinspectproblem/dqInspectProblem/parentOptions',
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -91,3 +92,9 @@ export const getChildList = (params) => defHttp.get({ url: Api.getChildList, par
|
|||||||
* @param params
|
* @param params
|
||||||
*/
|
*/
|
||||||
export const getChildListBatch = (params) => defHttp.get({ url: Api.getChildListBatch, params },{ isTransformResponse:false });
|
export const getChildListBatch = (params) => defHttp.get({ url: Api.getChildListBatch, params },{ isTransformResponse:false });
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询当前节点类型可选择的父级问题
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export const parentOptions = (params) => defHttp.get({ url: Api.parentOptions, params });
|
||||||
|
|||||||
@@ -5,6 +5,14 @@ import { render } from '/@/utils/common/renderUtils';
|
|||||||
import { getWeekMonthQuarterYear } from '/@/utils';
|
import { getWeekMonthQuarterYear } from '/@/utils';
|
||||||
//列表数据
|
//列表数据
|
||||||
export const columns: BasicColumn[] = [
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '类型',
|
||||||
|
align: 'center',
|
||||||
|
dataIndex: 'nodeType',
|
||||||
|
customRender: ({ text }) => {
|
||||||
|
return render.renderDict(text, 'super_dq_ins_type');
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '密级',
|
title: '密级',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
@@ -25,11 +33,7 @@ export const columns: BasicColumn[] = [
|
|||||||
align: 'center',
|
align: 'center',
|
||||||
dataIndex: 'hasChild'
|
dataIndex: 'hasChild'
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: '节点类型:category/surface/specific',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'nodeType'
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: '问题名称',
|
title: '问题名称',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
|||||||
@@ -75,6 +75,9 @@
|
|||||||
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
|
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
|
||||||
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
|
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
|
||||||
const { createMessage } = useMessage();
|
const { createMessage } = useMessage();
|
||||||
|
const NODE_TYPE_CATEGORY = 'category';
|
||||||
|
const NODE_TYPE_SURFACE = 'surface';
|
||||||
|
const NODE_TYPE_SPECIFIC = 'specific';
|
||||||
const expandedRowKeys = ref([]);
|
const expandedRowKeys = ref([]);
|
||||||
const queryParam = ref<any>({});
|
const queryParam = ref<any>({});
|
||||||
const toggleSearchStatus = ref<boolean>(false);
|
const toggleSearchStatus = ref<boolean>(false);
|
||||||
@@ -181,8 +184,18 @@
|
|||||||
* 添加下级
|
* 添加下级
|
||||||
*/
|
*/
|
||||||
function handleAddSub(record) {
|
function handleAddSub(record) {
|
||||||
|
if (record.nodeType === NODE_TYPE_SPECIFIC) {
|
||||||
|
createMessage.warning('具体问题下不能新增问题节点');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const childNodeType = record.nodeType === NODE_TYPE_CATEGORY ? NODE_TYPE_SURFACE : NODE_TYPE_SPECIFIC;
|
||||||
registerModal.value.disableSubmit = false;
|
registerModal.value.disableSubmit = false;
|
||||||
registerModal.value.add(record);
|
registerModal.value.add({
|
||||||
|
pid: record.id,
|
||||||
|
nodeType: childNodeType,
|
||||||
|
secretLevel: record.secretLevel,
|
||||||
|
year: record.year,
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -341,7 +354,8 @@
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '添加下级',
|
label: '添加下级',
|
||||||
onClick: handleAddSub.bind(null, { pid: record.id }),
|
onClick: handleAddSub.bind(null, record),
|
||||||
|
ifShow: () => record.nodeType !== NODE_TYPE_SPECIFIC,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '删除',
|
label: '删除',
|
||||||
|
|||||||
@@ -14,29 +14,25 @@
|
|||||||
<j-dict-select-tag v-model:value="formData.year" dictCode="super_year" placeholder="请选择年份" allow-clear />
|
<j-dict-select-tag v-model:value="formData.year" dictCode="super_year" placeholder="请选择年份" allow-clear />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="父级节点" v-bind="validateInfos.pid">
|
<a-form-item label="问题种类" v-bind="validateInfos.nodeType" id="DqInspectProblemForm-nodeType" name="nodeType">
|
||||||
<j-tree-select
|
<j-dict-select-tag v-model:value="formData.nodeType" dictCode="super_dq_ins_type" type="radioButton" :disabled="disabled" @change="handleNodeTypeChange" />
|
||||||
placeholder="请选择父节点ID"
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col v-if="showParentSelect" :span="24">
|
||||||
|
<a-form-item :label="parentLabel" v-bind="validateInfos.pid" id="DqInspectProblemForm-pid" name="pid">
|
||||||
|
<a-tree-select
|
||||||
v-model:value="formData.pid"
|
v-model:value="formData.pid"
|
||||||
dict="dq_inspect_problem,problem_name,id"
|
:tree-data="parentTreeData"
|
||||||
pidField="pid"
|
:placeholder="parentPlaceholder"
|
||||||
pidValue="0"
|
:disabled="disabled || loadingParentOptions"
|
||||||
hasChildField="has_child"
|
:loading="loadingParentOptions"
|
||||||
:disabled="disabled">
|
allow-clear
|
||||||
</j-tree-select>
|
tree-default-expand-all
|
||||||
|
style="width: 100%"
|
||||||
|
/>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item label="是否有子节点" v-bind="validateInfos.hasChild" id="DqInspectProblemForm-hasChild" name="hasChild">
|
|
||||||
<a-input v-model:value="formData.hasChild" placeholder="请输入是否有子节点" allow-clear ></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item label="节点类型:category/surface/specific" v-bind="validateInfos.nodeType" id="DqInspectProblemForm-nodeType" name="nodeType">
|
|
||||||
<a-input v-model:value="formData.nodeType" placeholder="请输入节点类型:category/surface/specific" allow-clear ></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-form-item label="问题名称" v-bind="validateInfos.problemName" id="DqInspectProblemForm-problemName" name="problemName">
|
<a-form-item label="问题名称" v-bind="validateInfos.problemName" id="DqInspectProblemForm-problemName" name="problemName">
|
||||||
<a-input v-model:value="formData.problemName" placeholder="请输入问题名称" allow-clear ></a-input>
|
<a-input v-model:value="formData.problemName" placeholder="请输入问题名称" allow-clear ></a-input>
|
||||||
@@ -52,17 +48,17 @@
|
|||||||
<a-input-number v-model:value="formData.sortNo" placeholder="请输入排序" style="width: 100%" />
|
<a-input-number v-model:value="formData.sortNo" placeholder="请输入排序" style="width: 100%" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col v-if="isSpecificNode" :span="24">
|
||||||
<a-form-item label="巡视建议" v-bind="validateInfos.inspectAdvice" id="DqInspectProblemForm-inspectAdvice" name="inspectAdvice">
|
<a-form-item label="巡视建议" v-bind="validateInfos.inspectAdvice" id="DqInspectProblemForm-inspectAdvice" name="inspectAdvice">
|
||||||
<a-input v-model:value="formData.inspectAdvice" placeholder="请输入巡视建议" allow-clear ></a-input>
|
<a-input v-model:value="formData.inspectAdvice" placeholder="请输入巡视建议" allow-clear ></a-input>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col v-if="isSpecificNode" :span="24">
|
||||||
<a-form-item label="问题责任领导" v-bind="validateInfos.questionResLeader" id="DqInspectProblemForm-questionResLeader" name="questionResLeader">
|
<a-form-item label="问题责任领导" v-bind="validateInfos.questionResLeader" id="DqInspectProblemForm-questionResLeader" name="questionResLeader">
|
||||||
<j-select-dept v-model:value="formData.questionResLeader" :multiple="true" checkStrictly allow-clear />
|
<j-select-dept v-model:value="formData.questionResLeader" :multiple="true" checkStrictly allow-clear />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :span="24">
|
<a-col v-if="isSpecificNode" :span="24">
|
||||||
<a-form-item label="问题责任部门" v-bind="validateInfos.questionResDept" id="DqInspectProblemForm-questionResDept" name="questionResDept">
|
<a-form-item label="问题责任部门" v-bind="validateInfos.questionResDept" id="DqInspectProblemForm-questionResDept" name="questionResDept">
|
||||||
<j-select-user v-model:value="formData.questionResDept" allow-clear />
|
<j-select-user v-model:value="formData.questionResDept" allow-clear />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
@@ -75,15 +71,13 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, reactive, defineExpose, nextTick, unref, defineProps, computed, onMounted } from 'vue';
|
import { ref, reactive, defineExpose, nextTick, unref, defineProps, computed } from 'vue';
|
||||||
import { defHttp } from '/@/utils/http/axios';
|
|
||||||
import { useMessage } from '/@/hooks/web/useMessage';
|
import { useMessage } from '/@/hooks/web/useMessage';
|
||||||
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||||
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
|
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
|
||||||
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
|
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
|
||||||
import JTreeSelect from '/@/components/Form/src/jeecg/components/JTreeSelect.vue';
|
|
||||||
import { getValueType } from '/@/utils';
|
import { getValueType } from '/@/utils';
|
||||||
import {loadTreeData, saveOrUpdateDict} from '../DqInspectProblem.api';
|
import {loadTreeData, parentOptions, saveOrUpdateDict} from '../DqInspectProblem.api';
|
||||||
import { Form } from 'ant-design-vue';
|
import { Form } from 'ant-design-vue';
|
||||||
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
|
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
|
||||||
const useForm = Form.useForm;
|
const useForm = Form.useForm;
|
||||||
@@ -91,9 +85,13 @@
|
|||||||
const isUpdate = ref(true);
|
const isUpdate = ref(true);
|
||||||
const expandedRowKeys = ref([]);
|
const expandedRowKeys = ref([]);
|
||||||
const treeData = ref([]);
|
const treeData = ref([]);
|
||||||
const pidField = ref<string>('pid');
|
const parentTreeData = ref<any[]>([]);
|
||||||
|
const loadingParentOptions = ref(false);
|
||||||
const emit = defineEmits(['register', 'ok']);
|
const emit = defineEmits(['register', 'ok']);
|
||||||
let model: Nullable<Recordable> = null;
|
let model: Nullable<Recordable> = null;
|
||||||
|
const NODE_TYPE_CATEGORY = 'category';
|
||||||
|
const NODE_TYPE_SURFACE = 'surface';
|
||||||
|
const NODE_TYPE_SPECIFIC = 'specific';
|
||||||
const formData = reactive<Record<string, any>>({
|
const formData = reactive<Record<string, any>>({
|
||||||
id: '',
|
id: '',
|
||||||
secretLevel: '',
|
secretLevel: '',
|
||||||
@@ -112,9 +110,25 @@
|
|||||||
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
|
const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
|
||||||
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
|
const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
|
||||||
const confirmLoading = ref<boolean>(false);
|
const confirmLoading = ref<boolean>(false);
|
||||||
|
const isSpecificNode = computed(() => formData.nodeType === NODE_TYPE_SPECIFIC);
|
||||||
|
const showParentSelect = computed(() => formData.nodeType === NODE_TYPE_SURFACE || formData.nodeType === NODE_TYPE_SPECIFIC);
|
||||||
|
const parentLabel = computed(() => (formData.nodeType === NODE_TYPE_SPECIFIC ? '上级面上问题' : '上级问题分类'));
|
||||||
|
const parentPlaceholder = computed(() => `请选择${parentLabel.value}`);
|
||||||
//表单验证
|
//表单验证
|
||||||
const validatorRules = reactive({
|
const validatorRules = reactive({
|
||||||
secretLevel: [{ required: true, message: '请输入密级!'},],
|
secretLevel: [{ required: true, message: '请输入密级!'},],
|
||||||
|
nodeType: [{ required: true, message: '请选择问题种类' }],
|
||||||
|
problemName: [{ required: true, message: '请输入问题名称' }],
|
||||||
|
pid: [
|
||||||
|
{
|
||||||
|
validator: async (_rule, value) => {
|
||||||
|
if (showParentSelect.value && !value) {
|
||||||
|
return Promise.reject('请选择上一级问题');
|
||||||
|
}
|
||||||
|
return Promise.resolve();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
});
|
});
|
||||||
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
|
const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
@@ -159,7 +173,8 @@
|
|||||||
})
|
})
|
||||||
//赋值
|
//赋值
|
||||||
Object.assign(formData,tmpData);
|
Object.assign(formData,tmpData);
|
||||||
model = tmpData
|
model = tmpData;
|
||||||
|
await loadParentOptions(false);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -185,6 +200,7 @@
|
|||||||
* 提交数据
|
* 提交数据
|
||||||
*/
|
*/
|
||||||
async function submitForm() {
|
async function submitForm() {
|
||||||
|
normalizeByNodeType();
|
||||||
try {
|
try {
|
||||||
// 触发表单验证
|
// 触发表单验证
|
||||||
await validate();
|
await validate();
|
||||||
@@ -236,16 +252,56 @@
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function handleNodeTypeChange(value: any) {
|
||||||
/**
|
const nextType = typeof value === 'string' ? value : value?.target?.value;
|
||||||
* 值改变事件触发
|
if (nextType !== undefined) {
|
||||||
* @param key
|
formData.nodeType = nextType;
|
||||||
* @param value
|
}
|
||||||
*/
|
formData.pid = formData.nodeType === NODE_TYPE_CATEGORY ? '0' : '';
|
||||||
function handleFormChange(key, value) {
|
normalizeByNodeType();
|
||||||
formData[key] = value;
|
void loadParentOptions(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadParentOptions(clearPid: boolean) {
|
||||||
|
if (!showParentSelect.value) {
|
||||||
|
parentTreeData.value = [];
|
||||||
|
formData.pid = '0';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
loadingParentOptions.value = true;
|
||||||
|
try {
|
||||||
|
const data = await parentOptions({ nodeType: formData.nodeType });
|
||||||
|
parentTreeData.value = Array.isArray(data) ? data : data?.result || [];
|
||||||
|
if (clearPid && !hasParentOption(parentTreeData.value, formData.pid)) {
|
||||||
|
formData.pid = '';
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
loadingParentOptions.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function hasParentOption(options: any[], value: string) {
|
||||||
|
if (!value) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
return (options || []).some((item) => {
|
||||||
|
if (!item.disabled && item.value === value) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return hasParentOption(item.children, value);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeByNodeType() {
|
||||||
|
if (formData.nodeType === NODE_TYPE_CATEGORY) {
|
||||||
|
formData.pid = '0';
|
||||||
|
}
|
||||||
|
if (formData.nodeType !== NODE_TYPE_SPECIFIC) {
|
||||||
|
formData.inspectAdvice = '';
|
||||||
|
formData.questionResLeader = '';
|
||||||
|
formData.questionResDept = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
add,
|
add,
|
||||||
edit,
|
edit,
|
||||||
|
|||||||
Reference in New Issue
Block a user