yxk-20260608-我为四所把把脉表单优化
1、普通新增、编辑、详情弹窗里的 BgTakepulseForm.vue 已彻底去掉“执行情况反馈”子表区域。 2、同时清理了普通表单对子表的依赖和逻辑: 3、不再渲染 a-tabs / j-vxe-table 反馈子表。 4、不再导入 JVxeTable、bgTakepulseFeedbackColumns、queryBgTakepulseFeedbackListByMainId、useValidateAntFormAndTable。
This commit is contained in:
@@ -4,29 +4,29 @@
|
||||
<template #detail>
|
||||
<a-form v-bind="formItemLayout" name="BgTakepulseForm" ref="formRef">
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="年份" v-bind="validateInfos.year" id="BgTakepulseForm-year" name="year">
|
||||
<j-dict-select-tag v-model:value="formData.year" dictCode="super_year" placeholder="请选择年份" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="密级" v-bind="validateInfos.secretLevel" id="BgTakepulseForm-secretLevel" name="secretLevel">
|
||||
<j-dict-select-tag v-model:value="formData.secretLevel" dictCode="secret_level" placeholder="请选择密级" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="年份" v-bind="validateInfos.year" id="BgTakepulseForm-year" name="year">
|
||||
<j-dict-select-tag v-model:value="formData.year" dictCode="super_year" placeholder="请选择年份" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="序号" v-bind="validateInfos.number" id="BgTakepulseForm-number" name="number">
|
||||
<a-input v-model:value="formData.number" placeholder="请输入序号" allow-clear ></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="会议类型:行政线、技术线" v-bind="validateInfos.taskType" id="BgTakepulseForm-taskType" name="taskType">
|
||||
<a-form-item label="会议类型" v-bind="validateInfos.taskType" id="BgTakepulseForm-taskType" name="taskType">
|
||||
<j-dict-select-tag v-model:value="formData.taskType" dictCode="super_takepulse_type" placeholder="请选择会议类型:行政线、技术线" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="类别:党的建设等其他" v-bind="validateInfos.type" id="BgTakepulseForm-type" name="type">
|
||||
<a-input v-model:value="formData.type" placeholder="请输入类别:党的建设等其他" allow-clear ></a-input>
|
||||
<a-form-item label="类别" v-bind="validateInfos.type" id="BgTakepulseForm-type" name="type">
|
||||
<a-input v-model:value="formData.type" placeholder="请输入类别:如党的建设" allow-clear ></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
@@ -94,11 +94,11 @@
|
||||
<a-input v-model:value="formData.remark" placeholder="请输入备注" allow-clear ></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="执行情况" v-bind="validateInfos.actualExect" id="BgTakepulseForm-actualExect" name="actualExect">
|
||||
<a-textarea v-model:value="formData.actualExect" :rows="4" placeholder="请输入执行情况" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- <a-col :span="12">-->
|
||||
<!-- <a-form-item label="执行情况" v-bind="validateInfos.actualExect" id="BgTakepulseForm-actualExect" name="actualExect">-->
|
||||
<!-- <a-textarea v-model:value="formData.actualExect" :rows="4" placeholder="请输入执行情况" />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<a-col :span="12">
|
||||
<a-form-item label="实际完成时间" v-bind="validateInfos.actualTime" id="BgTakepulseForm-actualTime" name="actualTime">
|
||||
<a-date-picker placeholder="请选择实际完成时间" v-model:value="formData.actualTime" showTime value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" allow-clear />
|
||||
@@ -114,11 +114,11 @@
|
||||
<j-dict-select-tag v-model:value="formData.bpmStatus" dictCode="super_status" placeholder="请选择完成状态" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="调整落实措施及执行情况" v-bind="validateInfos.actSt" id="BgTakepulseForm-actSt" name="actSt">
|
||||
<a-textarea v-model:value="formData.actSt" :rows="4" placeholder="请输入调整落实措施及执行情况" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- <a-col :span="12">-->
|
||||
<!-- <a-form-item label="调整落实措施及执行情况" v-bind="validateInfos.actSt" id="BgTakepulseForm-actSt" name="actSt">-->
|
||||
<!-- <a-textarea v-model:value="formData.actSt" :rows="4" placeholder="请输入调整落实措施及执行情况" />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<a-col :span="12">
|
||||
<a-form-item label="督办次数" v-bind="validateInfos.superviseCount" id="BgTakepulseForm-superviseCount" name="superviseCount">
|
||||
<a-input v-model:value="formData.superviseCount" placeholder="请输入督办次数" allow-clear ></a-input>
|
||||
@@ -144,23 +144,6 @@
|
||||
</template>
|
||||
</JFormContainer>
|
||||
|
||||
<!-- 子表单区域 -->
|
||||
<a-tabs v-model:activeKey="activeKey" animated style="overflow:hidden;">
|
||||
<a-tab-pane tab="执行情况反馈" key="bgTakepulseFeedback" :forceRender="true">
|
||||
<j-vxe-table
|
||||
:keep-source="true"
|
||||
resizable
|
||||
ref="bgTakepulseFeedbackTableRef"
|
||||
:loading="bgTakepulseFeedbackTable.loading"
|
||||
:columns="bgTakepulseFeedbackTable.columns"
|
||||
:dataSource="bgTakepulseFeedbackTable.dataSource"
|
||||
:height="340"
|
||||
:disabled="disabled"
|
||||
:rowNumber="true"
|
||||
:rowSelection="true"
|
||||
:toolbar="true"/>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<div v-if="showFlowSubmitButton" :span="24" style="width: 100%;text-align: center;margin-top: 10px">
|
||||
<a-button preIcon="ant-design:check-outlined" style="width: 126px" type="primary" @click="submitForm">提 交</a-button>
|
||||
</div>
|
||||
@@ -170,10 +153,7 @@
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, reactive, computed, toRaw, onMounted } from 'vue';
|
||||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { useValidateAntFormAndTable } from '/@/hooks/system/useJvxeMethods';
|
||||
import { queryBgTakepulseFeedbackListByMainId, queryDataById, saveOrUpdate } from '../BgTakepulse.api';
|
||||
import { JVxeTable } from '/@/components/jeecg/JVxeTable';
|
||||
import {bgTakepulseFeedbackColumns} from '../BgTakepulse.data';
|
||||
import { queryDataById, saveOrUpdate } from '../BgTakepulse.api';
|
||||
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||
import JSwitch from '/@/components/Form/src/jeecg/components/JSwitch.vue';
|
||||
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
|
||||
@@ -189,7 +169,6 @@
|
||||
JSwitch,
|
||||
JSelectDept,
|
||||
JSelectUser,
|
||||
JVxeTable,
|
||||
JFormContainer,
|
||||
},
|
||||
props:{
|
||||
@@ -204,43 +183,36 @@
|
||||
setup(props, {emit}) {
|
||||
const loading = ref(false);
|
||||
const formRef = ref();
|
||||
const bgTakepulseFeedbackTableRef = ref();
|
||||
const bgTakepulseFeedbackTable = reactive<Record<string, any>>({
|
||||
loading: false,
|
||||
columns: bgTakepulseFeedbackColumns,
|
||||
dataSource: []
|
||||
});
|
||||
const activeKey = ref('bgTakepulseFeedback');
|
||||
const formData = reactive<Record<string, any>>({
|
||||
id: '',
|
||||
secretLevel: '',
|
||||
year: '',
|
||||
number: '',
|
||||
taskType: '',
|
||||
type: '',
|
||||
proposer: '',
|
||||
title: '',
|
||||
content: '',
|
||||
suoleader: '',
|
||||
responDeptid: '',
|
||||
assistDeptid: '',
|
||||
implementDeptid: '',
|
||||
isAdopt: '',
|
||||
measure: '',
|
||||
secretLevel: '',
|
||||
year: '',
|
||||
number: '',
|
||||
taskType: '',
|
||||
type: '',
|
||||
proposer: '',
|
||||
title: '',
|
||||
content: '',
|
||||
suoleader: '',
|
||||
responDeptid: '',
|
||||
assistDeptid: '',
|
||||
implementDeptid: '',
|
||||
isAdopt: '',
|
||||
measure: '',
|
||||
measureNumber: undefined,
|
||||
achievement: '',
|
||||
deadline: '',
|
||||
remark: '',
|
||||
actualExect: '',
|
||||
actualTime: '',
|
||||
proposerConfirm: '',
|
||||
bpmStatus: '',
|
||||
actSt: '',
|
||||
superviseCount: '',
|
||||
urgencyLevel: '',
|
||||
isNeedAppro: '',
|
||||
supDeptleaderid: '',
|
||||
delFlag: '',
|
||||
achievement: '',
|
||||
deadline: '',
|
||||
remark: '',
|
||||
actualExect: '',
|
||||
actualTime: '',
|
||||
proposerConfirm: '',
|
||||
bpmStatus: '',
|
||||
actSt: '',
|
||||
superviseCount: '',
|
||||
urgencyLevel: '',
|
||||
isNeedAppro: '',
|
||||
supDeptleaderid: '',
|
||||
delFlag: '',
|
||||
});
|
||||
|
||||
//表单验证
|
||||
@@ -278,9 +250,6 @@
|
||||
Object.keys(row).map(k => {
|
||||
formData[k] = row[k];
|
||||
});
|
||||
//子表数据
|
||||
const bgTakepulseFeedbackDataList = await queryBgTakepulseFeedbackListByMainId(row['id']);
|
||||
bgTakepulseFeedbackTable.dataSource = [...bgTakepulseFeedbackDataList];
|
||||
}
|
||||
}
|
||||
// 是否显示提交按钮
|
||||
@@ -292,19 +261,14 @@
|
||||
}
|
||||
return false
|
||||
});
|
||||
|
||||
|
||||
|
||||
function add() {
|
||||
resetFields();
|
||||
bgTakepulseFeedbackTable.dataSource = [];
|
||||
}
|
||||
|
||||
async function edit(row) {
|
||||
//主表数据
|
||||
await queryMainData(row.id);
|
||||
//子表数据
|
||||
const bgTakepulseFeedbackDataList = await queryBgTakepulseFeedbackListByMainId(row['id']);
|
||||
bgTakepulseFeedbackTable.dataSource = [...bgTakepulseFeedbackDataList];
|
||||
}
|
||||
|
||||
async function queryMainData(id) {
|
||||
@@ -320,10 +284,6 @@
|
||||
Object.assign(formData,tmpData);
|
||||
}
|
||||
|
||||
const {getSubFormAndTableData, transformData} = useValidateAntFormAndTable(activeKey, {
|
||||
'bgTakepulseFeedback': bgTakepulseFeedbackTableRef,
|
||||
});
|
||||
|
||||
async function getFormData() {
|
||||
try {
|
||||
// 触发表单验证
|
||||
@@ -337,20 +297,30 @@
|
||||
}
|
||||
return Promise.reject(errorFields);
|
||||
}
|
||||
return transformData(toRaw(formData))
|
||||
return normalizeMainFormData(toRaw(formData))
|
||||
}
|
||||
|
||||
function normalizeMainFormData(data) {
|
||||
if (data) {
|
||||
Object.keys(data).forEach((key) => {
|
||||
if (Array.isArray(data[key])) {
|
||||
data[key] = data[key].join(',');
|
||||
}
|
||||
});
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
async function submitForm() {
|
||||
const mainData = await getFormData();
|
||||
const subData = await getSubFormAndTableData();
|
||||
const values = Object.assign({}, dbData, mainData, subData);
|
||||
const values = Object.assign({}, dbData, mainData);
|
||||
console.log('表单提交数据', values)
|
||||
const isUpdate = values.id ? true : false
|
||||
await saveOrUpdate(values, isUpdate);
|
||||
//关闭弹窗
|
||||
emit('success');
|
||||
}
|
||||
|
||||
|
||||
function setFieldsValue(values) {
|
||||
if(values){
|
||||
Object.keys(values).map(k=>{
|
||||
@@ -370,11 +340,8 @@
|
||||
|
||||
|
||||
return {
|
||||
bgTakepulseFeedbackTableRef,
|
||||
bgTakepulseFeedbackTable,
|
||||
validatorRules,
|
||||
validateInfos,
|
||||
activeKey,
|
||||
loading,
|
||||
formData,
|
||||
setFieldsValue,
|
||||
@@ -391,9 +358,3 @@
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.ant-tabs-tabpane.sub-one-form {
|
||||
max-height: 340px;
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user