yxk-20260508-党委会流程表单

1、默认展示部分主表数据,页面更加清爽
2、点击新增反馈按钮,弹窗填写内容,逻辑更加清晰
This commit is contained in:
ye1023
2026-05-08 16:00:11 +08:00
parent 854b0e3c94
commit 48f7c48c82
3 changed files with 262 additions and 171 deletions
@@ -9,17 +9,22 @@
<JDictSelectTag v-model:value="queryParam.year" dictCode="super_year" placeholder="请选择年份" allow-clear @change="searchQuery" /> <JDictSelectTag v-model:value="queryParam.year" dictCode="super_year" placeholder="请选择年份" allow-clear @change="searchQuery" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="6" :md="8" :sm="12"> <a-col :lg="5" :md="6" :sm="8">
<a-form-item label="完成状态" name="bpmStatus">
<JDictSelectTag v-model:value="queryParam.bpmStatus" dictCode="super_status" placeholder="请选择完成状态" allow-clear @change="searchQuery" />
</a-form-item>
</a-col>
<a-col :lg="5" :md="8" :sm="12">
<a-form-item label="会议决议" name="content"> <a-form-item label="会议决议" name="content">
<JInput v-model:value="queryParam.content" type="like" placeholder="请输入会议决议" allow-clear trim /> <JInput v-model:value="queryParam.content" type="like" placeholder="请输入会议决议" allow-clear trim />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="7" :md="8" :sm="12"> <a-col :lg="6" :md="8" :sm="12">
<a-form-item label="事项目录编码" name="matterCode"> <a-form-item label="事项目录编码" name="matterCode">
<JInput v-model:value="queryParam.matterCode" type="like" placeholder="请输入事项目录编码" allow-clear trim /> <JInput v-model:value="queryParam.matterCode" type="like" placeholder="请输入事项目录编码" allow-clear trim />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="6" :md="8" :sm="12"> <a-col :lg="4" :md="8" :sm="12">
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button> <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
<a-button preIcon="ant-design:reload-outlined" style="margin-left: 8px" @click="searchReset">重置</a-button> <a-button preIcon="ant-design:reload-outlined" style="margin-left: 8px" @click="searchReset">重置</a-button>
@@ -0,0 +1,141 @@
<template>
<JModal
title="新增反馈"
:width="820"
:visible="visible"
:confirmLoading="saving"
okText="保存"
cancelText="取消"
@ok="handleOk"
@cancel="handleCancel"
>
<a-form
ref="formRef"
class="bpm-feedback-modal-form"
:model="formData"
:rules="formRules"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item label="责任部门ID" name="responDeptid">
<a-input v-model:value="formData.responDeptid" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="责任部门名称" name="responDeptname">
<a-input v-model:value="formData.responDeptname" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="反馈人ID" name="responPersonid">
<a-input v-model:value="formData.responPersonid" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="反馈人姓名" name="responPersonname">
<a-input v-model:value="formData.responPersonname" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="完成状态" name="bpmStatus">
<a-input v-model:value="formData.bpmStatus" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="实际完成时间" name="actualTime">
<a-date-picker v-model:value="formData.actualTime" showTime value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="实际执行情况" name="actualExect" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-textarea v-model:value="formData.actualExect" :rows="4" allow-clear />
</a-form-item>
</a-col>
</a-row>
</a-form>
</JModal>
</template>
<script lang="ts" setup>
import { nextTick, reactive, ref } from 'vue';
import { useMessage } from '/@/hooks/web/useMessage';
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
import { bgPartymatterFeedbackSaveOrUpdate } from '../BgPartymatter.api';
const emit = defineEmits(['success']);
const { createMessage } = useMessage();
const visible = ref(false);
const saving = ref(false);
const formRef = ref();
const labelCol = { xs: { span: 24 }, sm: { span: 7 } };
const wrapperCol = { xs: { span: 24 }, sm: { span: 17 } };
const wideLabelCol = { xs: { span: 24 }, sm: { span: 3 } };
const wideWrapperCol = { xs: { span: 24 }, sm: { span: 21 } };
const formData = reactive<Record<string, any>>({
id: '',
responDeptid: '',
responDeptname: '',
responPersonid: '',
responPersonname: '',
actualExect: '',
actualTime: '',
bpmStatus: '',
mainId: '',
});
const formRules = {
actualExect: [{ required: true, message: '请输入实际执行情况' }],
};
function resetForm(mainId = '') {
Object.keys(formData).forEach((key) => {
formData[key] = '';
});
formData.mainId = mainId;
nextTick(() => formRef.value?.clearValidate?.());
}
function open(mainId: string) {
resetForm(mainId);
visible.value = true;
}
function handleCancel() {
visible.value = false;
}
async function handleOk() {
try {
await formRef.value?.validate?.();
} catch {
return;
}
saving.value = true;
try {
const res = await bgPartymatterFeedbackSaveOrUpdate({ ...formData }, false);
if (res.success) {
createMessage.success(res.message || '保存成功');
visible.value = false;
emit('success');
} else {
createMessage.warning(res.message || '保存失败');
}
} finally {
saving.value = false;
}
}
defineExpose({
open,
});
</script>
<style lang="less" scoped>
.bpm-feedback-modal-form {
padding: 12px 8px 0;
}
</style>
@@ -2,7 +2,13 @@
<a-spin :spinning="loading"> <a-spin :spinning="loading">
<div class="bg-partymatter-bpm-form"> <div class="bg-partymatter-bpm-form">
<a-form class="main-form" :labelCol="labelCol" :wrapperCol="wrapperCol" :model="mainForm"> <a-form class="main-form" :labelCol="labelCol" :wrapperCol="wrapperCol" :model="mainForm">
<div class="base-info-header section-toolbar">
<div class="section-title">基础信息</div> <div class="section-title">基础信息</div>
<a-button class="section-action-button" :type="showBaseInfoDetail ? 'default' : 'primary'" @click="showBaseInfoDetail = !showBaseInfoDetail">
<Icon :icon="showBaseInfoDetail ? 'ant-design:up-outlined' : 'ant-design:down-outlined'" />
{{ showBaseInfoDetail ? '收起基础信息' : '展开全部信息' }}
</a-button>
</div>
<a-row :gutter="16"> <a-row :gutter="16">
<a-col :span="24"> <a-col :span="24">
<a-form-item label="事项名称" name="title" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol"> <a-form-item label="事项名称" name="title" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
@@ -14,14 +20,15 @@
<a-textarea v-model:value="mainForm.content" :rows="3" :disabled="mainDisabled" allow-clear /> <a-textarea v-model:value="mainForm.content" :rows="3" :disabled="mainDisabled" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<template v-if="showBaseInfoDetail">
<a-col :span="12"> <a-col :span="12">
<a-form-item label="年份" name="year"> <a-form-item label="年份" name="year">
<a-input v-model:value="mainForm.year" :disabled="mainDisabled" allow-clear /> <j-dict-select-tag v-model:value="mainForm.year" :disabled="mainDisabled" dictCode="super_year" placeholder="请选择年份" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item label="密级" name="secretLevel"> <a-form-item label="密级" name="secretLevel">
<a-input v-model:value="mainForm.secretLevel" :disabled="mainDisabled" allow-clear /> <j-dict-select-tag v-model:value="mainForm.secretLevel" :disabled="mainDisabled" dictCode="secret_level" placeholder="请选择密级" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
@@ -52,7 +59,7 @@
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item label="紧急程度" name="urgencyLevel"> <a-form-item label="紧急程度" name="urgencyLevel">
<a-input v-model:value="mainForm.urgencyLevel" :disabled="mainDisabled" allow-clear /> <j-dict-select-tag v-model:value="mainForm.urgencyLevel" :disabled="mainDisabled" dictCode="urgency_level" placeholder="请选择紧急程度" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
@@ -70,6 +77,7 @@
<a-textarea v-model:value="mainForm.actualExect" :rows="3" :disabled="mainDisabled" allow-clear /> <a-textarea v-model:value="mainForm.actualExect" :rows="3" :disabled="mainDisabled" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
</template>
</a-row> </a-row>
<div v-if="!mainDisabled" class="main-actions"> <div v-if="!mainDisabled" class="main-actions">
<a-button type="primary" :loading="savingMain" @click="submitForm">保存主表数据</a-button> <a-button type="primary" :loading="savingMain" @click="submitForm">保存主表数据</a-button>
@@ -78,9 +86,12 @@
<a-divider /> <a-divider />
<div class="feedback-header"> <div class="feedback-header section-toolbar">
<div class="section-title">反馈信息</div> <div class="section-title">反馈信息</div>
<a-button v-if="!mainDisabled" type="primary" @click="showFeedbackForm = true">新增反馈</a-button> <a-button v-if="!mainDisabled" class="section-action-button feedback-add-button" type="primary" @click="openFeedbackModal">
<Icon icon="ant-design:plus-outlined" />
新增反馈
</a-button>
</div> </div>
<a-table <a-table
rowKey="id" rowKey="id"
@@ -92,62 +103,13 @@
:scroll="{ x: 900 }" :scroll="{ x: 900 }"
/> />
<a-form <BgPartymatterBPMFeedbackModal ref="feedbackModalRef" @success="loadFeedbackList" />
v-if="showFeedbackForm && !mainDisabled"
ref="feedbackFormRef"
class="feedback-form"
:model="feedbackForm"
:rules="feedbackRules"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<div class="section-title">新增反馈</div>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item label="责任部门ID" name="responDeptid">
<a-input v-model:value="feedbackForm.responDeptid" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="责任部门名称" name="responDeptname">
<a-input v-model:value="feedbackForm.responDeptname" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="反馈人ID" name="responPersonid">
<a-input v-model:value="feedbackForm.responPersonid" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="反馈人姓名" name="responPersonname">
<a-input v-model:value="feedbackForm.responPersonname" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="完成状态" name="bpmStatus">
<a-input v-model:value="feedbackForm.bpmStatus" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="实际完成时间" name="actualTime">
<a-date-picker v-model:value="feedbackForm.actualTime" showTime value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="实际执行情况" name="actualExect" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-textarea v-model:value="feedbackForm.actualExect" :rows="3" allow-clear />
</a-form-item>
</a-col>
</a-row>
<div class="main-actions">
<a-button @click="cancelFeedback">取消</a-button>
<a-button type="primary" :loading="savingFeedback" @click="saveFeedback">保存反馈</a-button>
</div>
</a-form>
<template v-if="showProcessHandle"> <template v-if="showProcessHandle">
<a-divider /> <a-divider />
<div class="process-header section-toolbar">
<div class="section-title">流程办理</div> <div class="section-title">流程办理</div>
</div>
<a-form class="process-variable-form" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form class="process-variable-form" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-row :gutter="16"> <a-row :gutter="16">
<a-col :span="24"> <a-col :span="24">
@@ -177,13 +139,16 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue'; import { computed, onMounted, reactive, ref, watch } from 'vue';
import { defHttp } from '/@/utils/http/axios'; import { defHttp } from '/@/utils/http/axios';
import { useMessage } from '/@/hooks/web/useMessage'; import { useMessage } from '/@/hooks/web/useMessage';
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue'; import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
import { bgPartymatterFeedbackList, bgPartymatterFeedbackSaveOrUpdate, saveBpmForm, setProcessVariable } from '../BgPartymatter.api'; import Icon from '/@/components/Icon/index';
import { bgPartymatterFeedbackList, saveBpmForm, setProcessVariable } from '../BgPartymatter.api';
import { usePermission } from '/@/hooks/web/usePermission'; import { usePermission } from '/@/hooks/web/usePermission';
import TaskHandleInnerContent from '/@/views/super/bpm/process/personalOffice/myHandleTask/content/TaskHandleInnerContent.vue'; import TaskHandleInnerContent from '/@/views/super/bpm/process/personalOffice/myHandleTask/content/TaskHandleInnerContent.vue';
import JDictSelectTag from "../../../../components/Form/src/jeecg/components/JDictSelectTag.vue";
import BgPartymatterBPMFeedbackModal from './BgPartymatterBPMFeedbackModal.vue';
const { isDisabledAuth, hasPermission, initBpmFormData} = usePermission(); const { isDisabledAuth, hasPermission, initBpmFormData} = usePermission();
const props = defineProps({ const props = defineProps({
@@ -205,12 +170,11 @@
const wideLabelCol = { xs: { span: 24 }, sm: { span: 3 } }; const wideLabelCol = { xs: { span: 24 }, sm: { span: 3 } };
const wideWrapperCol = { xs: { span: 24 }, sm: { span: 21 } }; const wideWrapperCol = { xs: { span: 24 }, sm: { span: 21 } };
const feedbackFormRef = ref(); const feedbackModalRef = ref();
const loading = ref(false); const loading = ref(false);
const savingMain = ref(false); const savingMain = ref(false);
const savingFeedback = ref(false);
const savingSubApproveUser = ref(false); const savingSubApproveUser = ref(false);
const showFeedbackForm = ref(false); const showBaseInfoDetail = ref(false);
const feedbackList = ref<any[]>([]); const feedbackList = ref<any[]>([]);
const subApproveUser = ref(''); const subApproveUser = ref('');
@@ -239,22 +203,6 @@
intervalStartTime: '', intervalStartTime: '',
}); });
const feedbackForm = reactive<Record<string, any>>({
id: '',
responDeptid: '',
responDeptname: '',
responPersonid: '',
responPersonname: '',
actualExect: '',
actualTime: '',
bpmStatus: '',
mainId: '',
});
const feedbackRules = {
actualExect: [{ required: true, message: '请输入实际执行情况' }],
};
const feedbackColumns = [ const feedbackColumns = [
{ title: '责任部门名称', dataIndex: 'responDeptname', align: 'center', width: 160 }, { title: '责任部门名称', dataIndex: 'responDeptname', align: 'center', width: 160 },
{ title: '反馈人姓名', dataIndex: 'responPersonname', align: 'center', width: 140 }, { title: '反馈人姓名', dataIndex: 'responPersonname', align: 'center', width: 140 },
@@ -294,6 +242,7 @@
if (!dataId) { if (!dataId) {
return; return;
} }
showBaseInfoDetail.value = false;
loading.value = true; loading.value = true;
try { try {
const data = await defHttp.get({ url: queryByIdUrl, params: { id: dataId } }); const data = await defHttp.get({ url: queryByIdUrl, params: { id: dataId } });
@@ -340,39 +289,12 @@
} }
} }
function cancelFeedback() { function openFeedbackModal() {
showFeedbackForm.value = false;
resetFeedbackForm();
}
function resetFeedbackForm() {
Object.keys(feedbackForm).forEach((key) => {
feedbackForm[key] = '';
});
feedbackForm.mainId = mainForm.id;
nextTick(() => feedbackFormRef.value?.clearValidate?.());
}
async function saveFeedback() {
if (!mainForm.id) { if (!mainForm.id) {
createMessage.warning('主表数据不存在,无法新增反馈'); createMessage.warning('主表数据不存在,无法新增反馈');
return; return;
} }
await feedbackFormRef.value?.validate?.(); feedbackModalRef.value?.open(mainForm.id);
savingFeedback.value = true;
try {
feedbackForm.mainId = mainForm.id;
const res = await bgPartymatterFeedbackSaveOrUpdate({ ...feedbackForm }, false);
if (res.success) {
createMessage.success(res.message || '保存成功');
cancelFeedback();
await loadFeedbackList();
} else {
createMessage.warning(res.message || '保存失败');
}
} finally {
savingFeedback.value = false;
}
} }
async function saveSubApproveUserVariable() { async function saveSubApproveUserVariable() {
@@ -434,8 +356,7 @@
padding: 12px 16px 20px; padding: 12px 16px 20px;
} }
.main-form, .main-form {
.feedback-form {
background: #fff; background: #fff;
} }
@@ -449,17 +370,41 @@
line-height: 18px; line-height: 18px;
} }
.feedback-header { .section-toolbar {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-bottom: 12px; margin-bottom: 12px;
padding: 10px 12px;
background: #f6fbff;
border: 1px solid #d6e8ff;
border-radius: 6px;
.section-title {
margin-bottom: 0;
} }
.feedback-form { .section-action-button {
margin-top: 16px; display: inline-flex;
padding-top: 16px; align-items: center;
border-top: 1px solid #f0f0f0; gap: 4px;
min-width: 112px;
justify-content: center;
font-weight: 500;
box-shadow: 0 2px 6px rgba(22, 119, 255, 0.14);
}
}
.base-info-header {
margin-top: 2px;
}
.feedback-header {
margin-bottom: 12px;
.feedback-add-button {
min-width: 104px;
}
} }
.process-variable-form { .process-variable-form {