yxk-20260605-我为四所把把脉

1、改造 BgTakepulseList.vue 的流程发起方式,由原来的普通 startProcess 改为复用 FlowScheduleStartModalForBG 调度弹窗,支持立即督办和重复督办。
2、行操作中新增/调整“发起督办流程”“再次督办”“查询督办流程”,并按 bpmStatus 控制显示。
3、发起流程时组装与 BgPartymatterList.vue 一致的督办流程参数,流程编码使用 dev_task_task_001,流程名称为“我为四所把把脉”。
4、被督办部门改为牵头部门加协办部门,自动去重后带入弹窗。
5、发起成功后回写完成状态为督办中,并自动累加督办次数。
6、新增 BgTakepulseBPMForm.vue,作为“我为四所把把脉”专用 BPM 办理表单。
7、新增 BgTakepulseBPMFeedbackModal.vue,支持流程中新增、编辑、删除执行情况反馈,并支持附件上传。
8、扩展 BgTakepulse.api.ts,新增 BPM 表单保存、流程变量保存、反馈列表和反馈 CRUD 相关接口。
This commit is contained in:
ye1023
2026-06-05 16:41:09 +08:00
parent 703be0d85c
commit aad7944baf
4 changed files with 1213 additions and 29 deletions
+51 -1
View File
@@ -13,6 +13,13 @@ enum Api {
exportXls = '/bqtakepulse/bgTakepulse/exportXls',
queryDataById = '/bqtakepulse/bgTakepulse/queryById',
bgTakepulseFeedbackList = '/bqtakepulse/bgTakepulse/queryBgTakepulseFeedbackByMainId',
saveBpmForm = '/bqtakepulse/bgTakepulse/saveBpmForm',
setProcessVariable = '/act/process/setProcessVariable',
bgTakepulseBpmFeedbackList = '/bqtakepulse/bgTakepulse/listBgTakepulseFeedbackByMainId',
bgTakepulseFeedbackSave = '/bqtakepulse/bgTakepulse/addBgTakepulseFeedback',
bgTakepulseFeedbackEdit = '/bqtakepulse/bgTakepulse/editBgTakepulseFeedback',
bgTakepulseFeedbackDelete = '/bqtakepulse/bgTakepulse/deleteBgTakepulseFeedback',
bgTakepulseFeedbackDeleteBatch = '/bqtakepulse/bgTakepulse/deleteBatchBgTakepulseFeedback',
}
/**
* 导出api
@@ -73,9 +80,52 @@ export const saveOrUpdate = (params, isUpdate) => {
return defHttp.post({url: url, params});
}
export const saveBpmForm = (params) => {
return defHttp.post({ url: Api.saveBpmForm, params }, { isTransformResponse: false });
}
export const setProcessVariable = (params) => {
return defHttp.post({ url: Api.setProcessVariable, params }, { isTransformResponse: false });
}
/**
* BPM办理页按主表和流程实例查询反馈,避免不同督办轮次的反馈混在一起。
*/
export const bgTakepulseFeedbackList = (params) => {
if (params['mainId']) {
return defHttp.get({ url: Api.bgTakepulseBpmFeedbackList, params });
}
return Promise.resolve({});
}
export const bgTakepulseFeedbackSaveOrUpdate = (params, isUpdate) => {
let url = isUpdate ? Api.bgTakepulseFeedbackEdit : Api.bgTakepulseFeedbackSave;
return defHttp.post({ url, params }, { isTransformResponse: false });
}
export const bgTakepulseFeedbackDelete = (params, handleSuccess) => {
return defHttp.delete({ url: Api.bgTakepulseFeedbackDelete, params }, { joinParamsToUrl: true }).then(() => {
handleSuccess();
});
}
export const bgTakepulseFeedbackDeleteBatch = (params, handleSuccess) => {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '是否删除选中数据',
okText: '确认',
cancelText: '取消',
onOk: () => {
return defHttp.delete({ url: Api.bgTakepulseFeedbackDeleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
handleSuccess();
});
}
});
}
/**
* 根据id查询数据
* @param params
*/
export const queryDataById = (id) => defHttp.get({url: Api.queryDataById, params:{ id }});
+155 -28
View File
@@ -86,35 +86,38 @@
<BgTakepulseModal @register="registerModal" @success="handleSuccess"></BgTakepulseModal>
<!-- 审批记录 -->
<BpmPictureModal @register="registerBpmModal" />
<FlowScheduleStartModalForBG ref="flowScheduleModalRef" @confirm="handleFlowScheduleConfirm" />
<BusinessProcessListModal ref="businessProcessListModalRef" />
</div>
</template>
<script lang="ts" name="bqtakepulse-bgTakepulse" setup>
import {ref, reactive, computed, unref} from 'vue';
import {BasicTable, useTable, TableAction} from '/@/components/Table';
import {ref, reactive} from 'vue';
import {BasicTable, TableAction} from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage'
import {useModal} from '/@/components/Modal';
import BgTakepulseModal from './components/BgTakepulseModal.vue'
import {columns, superQuerySchema} from './BgTakepulse.data';
import {list, deleteOne, batchDelete, getImportUrl,getExportUrl} from './BgTakepulse.api';
import {downloadFile} from '/@/utils/common/renderUtils';
import { useMessage } from '/@/hooks/web/useMessage';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JSwitch from '/@/components/Form/src/jeecg/components/JSwitch.vue';
import {list, deleteOne, batchDelete, getImportUrl, getExportUrl, saveOrUpdate} from './BgTakepulse.api';
import JSelectMultiple from '/@/components/Form/src/jeecg/components/JSelectMultiple.vue';
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
import { startProcess } from '/@/api/common/api';
import { startProcessSchedules } from '/@/api/common/api';
import { dateUtil } from '/@/utils/dateUtil';
import FlowScheduleStartModalForBG from '/src/components/semri/process/FlowScheduleStartModalForBG.vue';
import BusinessProcessListModal from '/src/components/semri/process/BusinessProcessListModal.vue';
const [registerBpmModal, { openModal: bpmPicModal }] = useModal();
import { useUserStore } from '/@/store/modules/user';
const FLOW_CODE = 'dev_task_task_001';
const BUSINESS_TABLE_NAME = 'bg_takepulse';
const FORM_URL = 'bg/bqtakepulse/components/BgTakepulseBPMForm';
const FLOW_NAME = '我为四所把把脉';
const formRef = ref();
const queryParam = reactive<any>({});
const checkedKeys = ref<Array<string | number>>([]);
//注册model
const [registerModal, {openModal}] = useModal();
const userStore = useUserStore();
const { createMessage } = useMessage();
const flowScheduleModalRef = ref();
const businessProcessListModalRef = ref();
//注册table数据
const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
tableProps:{
@@ -144,6 +147,11 @@
const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
interface DeptOption {
label: string;
value: string;
}
// 高级查询配置
const superQueryConfig = reactive(superQuerySchema);
@@ -236,16 +244,22 @@
label: '审批进度',
onClick: handlePreviewPic.bind(null, record),
ifShow: !!record.bpmStatus && record.bpmStatus !== '1',
},
{
label: '查询督办流程',
onClick: handleQueryProcess.bind(null, record),
}
];
if(record.bpmStatus == '1' || !record.bpmStatus){
dropDownAction.push({
label: '发起流程',
popConfirm: {
title: '确认提交流程吗?',
confirm: handleProcess.bind(null, record),
placement: 'topLeft',
}
label: '发起督办流程',
onClick: handleProcess.bind(null, record),
})
}
if(record.bpmStatus == '2' || !record.bpmStatus){
dropDownAction.push({
label: '再次督办',
onClick: handleProcess.bind(null, record),
})
}
return dropDownAction;
@@ -254,14 +268,127 @@
/**
* 提交流程
*/
async function handleProcess(record) {
let params = {
flowCode: 'dev_bg_takepulse_001',
id: record.id,
formUrl: 'bqtakepulse/components/BgTakepulseForm',
formUrlMobile: ''
function handleProcess(record) {
flowScheduleModalRef.value?.open({
title: '发起流程',
taskTitle: record?.title,
payload: { record },
deptOptions: getResponsibleDeptOptions(record),
showSuoleaderFields: true,
isNeedAppro: record?.isNeedAppro,
supDeptleaderid: record?.supDeptleaderid,
showDeadlineField: true,
deadline: record?.deadline,
showUrgencyLevelField: true,
urgencyLevel: record?.urgencyLevel,
});
}
function splitDeptValue(value) {
if (Array.isArray(value)) {
return value.map((item) => String(item || '').trim()).filter(Boolean);
}
await startProcess(params);
return String(value || '')
.split(/[,\uFF0C]/)
.map((item) => item.trim())
.filter(Boolean);
}
function getResponsibleDeptOptions(record): DeptOption[] {
const optionMap = new Map<string, DeptOption>();
[
{
ids: splitDeptValue(record?.responDeptid),
names: splitDeptValue(record?.responDeptid_dictText || record?.responDeptname),
},
{
ids: splitDeptValue(record?.assistDeptid),
names: splitDeptValue(record?.assistDeptid_dictText || record?.assistDeptname),
},
].forEach(({ ids, names }) => {
ids.forEach((deptId, index) => {
if (optionMap.has(deptId)) {
return;
}
optionMap.set(deptId, {
value: deptId,
label: names[index] || deptId,
});
});
});
return Array.from(optionMap.values());
}
function getResponsibleDeptIds(record) {
return getResponsibleDeptOptions(record)
.map((item) => item.value)
.join(',');
}
function getNextSuperviseCount(value) {
const count = Number(value || 0);
return Number.isFinite(count) ? count + 1 : 1;
}
function handleQueryProcess(record) {
businessProcessListModalRef.value?.open({
title: '流程列表',
businessId: record.id,
columns: '',
});
}
async function handleFlowScheduleConfirm({ payload, options }) {
const record = payload?.record || {};
const formatDate = (value, format) => {
return value ? dateUtil(value).format(format) : undefined;
};
const formatDeadlineDateTime = (value) => {
const deadlineDate = formatDate(value, 'YYYY-MM-DD');
return deadlineDate ? `${deadlineDate} 00:00:00` : undefined;
};
const nextSuperviseCount = getNextSuperviseCount(record.superviseCount);
const selectedTitle = options.title || record.title || '';
const selectedDeadline = options.deadline || record.deadline;
const selectedUrgencyLevel = options.urgencyLevel ?? record.urgencyLevel ?? '0';
const defaultDeptIds = getResponsibleDeptIds(record);
const flowJsonData = {
...record,
isNeedAppro: options.isNeedAppro ?? record.isNeedAppro ?? '',
supDeptleaderid: options.supDeptleaderid ?? record.supDeptleaderid ?? '',
superviseCount: nextSuperviseCount,
// 用户可在发起前确认本次督办标题,仅影响流程数据,不回写台账标题。
title: selectedTitle,
deadline: selectedDeadline,
// 紧急标记随本次流程发起传出,业务表只回写状态和督办次数。
urgencyLevel: selectedUrgencyLevel,
};
const params = {
intervalType: options.intervalType,
startCount: options.startCount,
taskTask: {
// 重复督办参数与党委会事项保持一致。
triggerType: options.triggerType,
startTime: options.intervalStartTime,
flowCode: FLOW_CODE,
formUrl: FORM_URL,
flowName: FLOW_NAME,
jsonData: flowJsonData,
businessTablename: BUSINESS_TABLE_NAME,
businessId: record.id,
title: selectedTitle,
content: record.content,
urgencyLevel: selectedUrgencyLevel,
deptId: options.deptId || defaultDeptIds,
deptLeaderId: record.responDeptid,
requireFinishDate: formatDate(selectedDeadline, 'YYYY-MM-DD'),
deadline: formatDeadlineDateTime(selectedDeadline),
},
};
await startProcessSchedules(params);
await saveOrUpdate({ id: record.id, bpmStatus: '2', superviseCount: nextSuperviseCount }, true);
handleSuccess();
}
@@ -270,7 +397,7 @@
*/
async function handlePreviewPic(record) {
bpmPicModal(true, {
flowCode: 'dev_bg_takepulse_001',
flowCode: FLOW_CODE,
dataId: record.id,
});
}
@@ -334,4 +461,4 @@
width: 100%;
}
}
</style>
</style>
@@ -0,0 +1,226 @@
<template>
<JModal
:title="modalTitle"
: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="完成状态" name="bpmStatus">
<JDictSelectTag v-model:value="formData.bpmStatus" dictCode="feedback_status" placeholder="请选择完成状态" 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-col :span="24">
<a-form-item label="调整落实措施及执行情况" name="actSt" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-textarea v-model:value="formData.actSt" :rows="3" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="提出人确认" name="proposerConfirm" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-input v-model:value="formData.proposerConfirm" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="附件" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<SUploadFile
:key="uploadKey"
ref="uploadFileRef"
:bussiness-id="formData.id"
:bussiness-secret-level="uploadSecretLevel"
:multiple="true"
/>
</a-form-item>
</a-col>
</a-row>
</a-form>
</JModal>
</template>
<script lang="ts" setup>
import { nextTick, reactive, ref } from 'vue';
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from '/@/hooks/web/useMessage';
import JModal from '/@/components/Modal/src/JModal/JModal.vue';
import { bgTakepulseFeedbackSaveOrUpdate } from '../BgTakepulse.api';
import { useUserStore } from '/@/store/modules/user';
import { buildUUID } from '/@/utils/uuid';
import { dateUtil } from '/@/utils/dateUtil';
import SUploadFile from '/@/components/semri/fileComponent/SUploadFile.vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
const emit = defineEmits(['success']);
const { createMessage } = useMessage();
const userStore = useUserStore();
const DEFAULT_COMPLETED_STATUS = '3';
const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss';
const visible = ref(false);
const saving = ref(false);
const modalTitle = ref('新增反馈');
const formRef = ref();
const uploadFileRef = ref<InstanceType<typeof SUploadFile> | null>(null);
const uploadSecretLevel = ref(1);
const uploadKey = ref(0);
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: '',
actSt: '',
bpmStatus: '',
proposerConfirm: '',
bpmProcessId: '',
mainId: '',
});
const formRules = {
actualExect: [{ required: true, message: '请输入实际执行情况' }],
};
function resetForm(mainId = '', bpmProcessId = '') {
Object.keys(formData).forEach((key) => {
formData[key] = '';
});
formData.mainId = mainId;
formData.bpmProcessId = bpmProcessId;
uploadKey.value += 1;
nextTick(() => formRef.value?.clearValidate?.());
}
function open(mainId: string, secretLevel?: string | number, bpmProcessId = '', record?: Record<string, any>) {
resetForm(mainId, bpmProcessId);
uploadSecretLevel.value = normalizeSecretLevel(secretLevel);
if (record?.id) {
modalTitle.value = '编辑反馈';
Object.keys(formData).forEach((key) => {
if (Object.prototype.hasOwnProperty.call(record, key)) {
formData[key] = record[key] ?? '';
}
});
formData.mainId = formData.mainId || mainId;
formData.bpmProcessId = formData.bpmProcessId || bpmProcessId;
} else {
modalTitle.value = '新增反馈';
// 新增反馈默认带入当前办理人和办理部门,避免经办人手工维护隐藏归属字段。
formData.bpmStatus = DEFAULT_COMPLETED_STATUS;
formData.actualTime = dateUtil().format(DATE_TIME_FORMAT);
void applyCurrentUserFeedbackInfo();
}
visible.value = true;
}
function normalizeSecretLevel(value?: string | number) {
const level = Number(value);
return [1, 2, 3, 4].includes(level) ? level : 1;
}
function getCurrentLoginDepart() {
const userInfo = (userStore.getUserInfo || {}) as Record<string, any>;
const loginInfo = (userStore.getLoginInfo || {}) as Record<string, any>;
const departs = Array.isArray(loginInfo.departs) ? loginInfo.departs : [];
if (userInfo.orgCode) {
return departs.find((item) => item.orgCode === userInfo.orgCode);
}
return departs.length === 1 ? departs[0] : undefined;
}
async function getCurrentDepartInfo() {
const userInfo = (userStore.getUserInfo || {}) as Record<string, any>;
const loginDepart = getCurrentLoginDepart();
if (loginDepart) {
return {
id: loginDepart.id || '',
departName: loginDepart.departName || '',
};
}
if (userInfo.orgCode) {
const depart = await defHttp.get({ url: '/sys/sysDepart/getDepartName', params: { orgCode: userInfo.orgCode } });
return {
id: depart?.id || '',
departName: depart?.departName || '',
};
}
return {
id: userInfo.departIds || '',
departName: userInfo.departIds_dictText || userInfo.orgCodeTxt || '',
};
}
async function applyCurrentUserFeedbackInfo() {
const userInfo = (userStore.getUserInfo || {}) as Record<string, any>;
formData.responPersonid = userInfo.id || userInfo.userId || '';
formData.responPersonname = userInfo.realname || '';
const departInfo = await getCurrentDepartInfo();
formData.responDeptid = departInfo.id;
formData.responDeptname = departInfo.departName;
}
function handleCancel() {
visible.value = false;
}
async function handleOk() {
try {
await formRef.value?.validate?.();
} catch {
return;
}
saving.value = true;
try {
const isUpdate = !!formData.id;
if (!isUpdate) {
await applyCurrentUserFeedbackInfo();
}
if (!isUpdate && uploadFileRef.value?.hasPendingFiles?.()) {
formData.id = buildUUID();
}
const res = await bgTakepulseFeedbackSaveOrUpdate({ ...formData }, isUpdate);
if (res.success) {
if (formData.id && uploadFileRef.value?.hasPendingFiles?.()) {
await uploadFileRef.value.bindBussinessId(formData.id);
}
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>
@@ -0,0 +1,781 @@
<template>
<a-spin :spinning="loading">
<div class="bg-takepulse-bpm-form">
<a-form class="main-form" :class="{ 'main-form-readonly': mainDisabled }" labelAlign="left" :labelCol="labelCol" :wrapperCol="wrapperCol" :model="mainForm">
<div class="base-info-header section-toolbar">
<div class="section-title">基础信息</div>
<a-space class="section-actions">
<a-button v-if="!mainDisabled" class="base-save-button" type="link" size="small" :loading="savingMain" @click="submitForm">
<Icon icon="ant-design:save-outlined" />
保存
</a-button>
<a-button class="section-action-button" :type="showBaseInfoDetail ? 'default' : 'link'" size="small" @click="showBaseInfoDetail = !showBaseInfoDetail">
<Icon :icon="showBaseInfoDetail ? 'ant-design:up-outlined' : 'ant-design:down-outlined'" />
{{ showBaseInfoDetail ? '收起基础信息' : '展开全部信息' }}
</a-button>
</a-space>
</div>
<a-row class="base-info-row" :gutter="[12, 4]">
<a-col :xs="24" :md="12">
<a-form-item label="意见主题" name="title" :labelCol="compactLabelCol" :wrapperCol="compactWrapperCol">
<a-input v-model:value="mainForm.title" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :xs="24" :md="12">
<a-form-item label="具体意见" name="content" :labelCol="compactLabelCol" :wrapperCol="compactWrapperCol">
<a-textarea v-model:value="mainForm.content" :auto-size="{ minRows: 1, maxRows: 7 }" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<template v-if="showBaseInfoDetail">
<a-divider />
<a-col :span="12">
<a-form-item label="密级" name="secretLevel">
<j-dict-select-tag v-model:value="mainForm.secretLevel" :disabled="mainDisabled" dictCode="secret_level" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="年份" name="year">
<j-dict-select-tag v-model:value="mainForm.year" :disabled="mainDisabled" dictCode="super_year" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="序号" name="number">
<a-input v-model:value="mainForm.number" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="会议类型" name="taskType">
<j-dict-select-tag v-model:value="mainForm.taskType" :disabled="mainDisabled" dictCode="super_takepulse_type" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="类别" name="type">
<a-input v-model:value="mainForm.type" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="提出人" name="proposer">
<j-select-user v-model:value="mainForm.proposer" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="责任领导" name="suoleader">
<j-select-user v-model:value="mainForm.suoleader" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="牵头部门" name="responDeptid">
<j-select-dept v-model:value="mainForm.responDeptid" :disabled="mainDisabled" :multiple="true" checkStrictly allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="协办部门" name="assistDeptid">
<j-select-dept v-model:value="mainForm.assistDeptid" :disabled="mainDisabled" :multiple="true" checkStrictly allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="落实部门" name="implementDeptid">
<a-input v-model:value="mainForm.implementDeptid" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="是否采纳" name="isAdopt">
<j-switch v-model:value="mainForm.isAdopt" :disabled="mainDisabled" />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="落实措施/解释说明" name="measure" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-textarea v-model:value="mainForm.measure" :auto-size="{ minRows: 1, maxRows: 7 }" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="措施数量" name="measureNumber">
<a-input-number v-model:value="mainForm.measureNumber" :disabled="mainDisabled" style="width: 100%" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="要求完成日期" name="deadline">
<a-date-picker v-model:value="mainForm.deadline" value-format="YYYY-MM-DD" :disabled="mainDisabled" style="width: 100%" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="成果形式" name="achievement" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-textarea v-model:value="mainForm.achievement" :auto-size="{ minRows: 1, maxRows: 7 }" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="实际完成时间" name="actualTime">
<a-date-picker v-model:value="mainForm.actualTime" showTime value-format="YYYY-MM-DD HH:mm:ss" :disabled="mainDisabled" style="width: 100%" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="完成状态" name="bpmStatus">
<j-dict-select-tag v-model:value="mainForm.bpmStatus" disabled dictCode="super_status" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="督办次数" name="superviseCount">
<a-input v-model:value="mainForm.superviseCount" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="紧急程度" name="urgencyLevel">
<a-input v-model:value="mainForm.urgencyLevel" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="是否需要所办领导审批" name="isNeedAppro">
<j-switch v-model:value="mainForm.isNeedAppro" :disabled="mainDisabled" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="所办领导" name="supDeptleaderid">
<j-select-user v-model:value="mainForm.supDeptleaderid" :disabled="mainDisabled" 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="mainForm.actualExect" :auto-size="{ minRows: 1, maxRows: 7 }" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item label="调整落实措施及执行情况" name="actSt" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-textarea v-model:value="mainForm.actSt" :auto-size="{ minRows: 1, maxRows: 7 }" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="提出人确认" name="proposerConfirm">
<a-input v-model:value="mainForm.proposerConfirm" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="备注" name="remark">
<a-input v-model:value="mainForm.remark" :disabled="mainDisabled" allow-clear />
</a-form-item>
</a-col>
</template>
</a-row>
</a-form>
<a-divider />
<div class="feedback-header section-toolbar">
<div class="section-title">执行情况反馈</div>
<a-button v-if="showAddFeedback" class="section-action-button feedback-add-button" type="primary" @click="openFeedbackModal">
<Icon icon="ant-design:plus-outlined" />
新增反馈
</a-button>
</div>
<a-table
rowKey="id"
size="small"
bordered
:columns="feedbackColumns"
:data-source="feedbackList"
:pagination="false"
:scroll="{ x: feedbackTableScrollX }"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'attachments'">
<SUploadFile
v-if="record.id"
:key="getFeedbackAttachmentKey(record)"
class="feedback-attachment-list"
:bussiness-id="record.id"
:disabled="true"
:multiple="true"
/>
<span v-else>-</span>
</template>
<template v-else-if="canManageFeedback && column.key === 'action'">
<a-space>
<a-button type="link" size="small" @click="openFeedbackEditModal(record)">编辑</a-button>
<a-popconfirm title="是否确认删除" @confirm="handleFeedbackDelete(record)">
<a-button type="link" size="small" danger>删除</a-button>
</a-popconfirm>
</a-space>
</template>
</template>
</a-table>
<BgTakepulseBPMFeedbackModal ref="feedbackModalRef" @success="loadFeedbackList" />
<template v-if="showProcessHandle">
<a-divider />
<div class="process-header section-toolbar">
<div class="section-title">流程办理</div>
</div>
<a-form v-if="showSubApproveUser" class="process-variable-form" labelAlign="left" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-row :gutter="16">
<a-col :span="12">
<a-form-item label="是否办结" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<a-radio-group v-model:value="isEnd" :disabled="savingSubApproveUser">
<a-radio :value="0">分配部门经办人</a-radio>
<a-radio :value="1">办结</a-radio>
</a-radio-group>
</a-form-item>
</a-col>
<a-col v-if="showSubApproveUserSelector" :span="12">
<a-form-item label="部门经办人" :labelCol="wideLabelCol" :wrapperCol="wideWrapperCol">
<j-select-user v-model:value="subApproveUser" :disabled="savingSubApproveUser" allow-clear />
</a-form-item>
</a-col>
</a-row>
</a-form>
<TaskHandleInnerContent
:form-data="formData"
:claim="claim"
:beforeHandle="saveMainFormBeforeProcessHandle"
@success="handleProcessSuccess"
@claimSuccess="handleClaimSuccess"
/>
</template>
</div>
</a-spin>
</template>
<script lang="ts" setup>
import { computed, onMounted, reactive, ref, watch } from 'vue';
import { defHttp } from '/@/utils/http/axios';
import { useMessage } from '/@/hooks/web/useMessage';
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JSwitch from '/@/components/Form/src/jeecg/components/JSwitch.vue';
import Icon from '/@/components/Icon/index';
import { bgTakepulseFeedbackDelete, bgTakepulseFeedbackList, saveBpmForm, setProcessVariable } from '../BgTakepulse.api';
import { usePermission } from '/@/hooks/web/usePermission';
import TaskHandleInnerContent from '/@/views/super/bpm/process/personalOffice/myHandleTask/content/TaskHandleInnerContent.vue';
import BgTakepulseBPMFeedbackModal from './BgTakepulseBPMFeedbackModal.vue';
import SUploadFile from '/@/components/semri/fileComponent/SUploadFile.vue';
const { initBpmFormData } = usePermission();
const props = defineProps({
formDisabled: { type: Boolean, default: false },
formData: { type: Object, default: () => ({}) },
formBpm: { type: Boolean, default: true },
claim: { type: Boolean, default: false },
});
initBpmFormData(props.formData);
const emit = defineEmits(['ok', 'success', 'claimSuccess']);
const { createMessage } = useMessage();
const queryByIdUrl = '/bqtakepulse/bgTakepulse/queryById';
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 compactLabelCol = { xs: { span: 24 }, sm: { span: 5 } };
const compactWrapperCol = { xs: { span: 24 }, sm: { span: 19 } };
const feedbackModalRef = ref();
const loading = ref(false);
const savingMain = ref(false);
const savingSubApproveUser = ref(false);
const showBaseInfoDetail = ref(false);
const feedbackList = ref<any[]>([]);
const feedbackAttachmentRefreshKey = ref(0);
const subApproveUser = ref('');
const isEnd = ref(0);
const mainForm = reactive<Record<string, any>>({
id: '',
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: '',
});
const feedbackBaseColumns = [
{ title: '责任部门名称', dataIndex: 'responDeptname', align: 'center', width: 160 },
{ title: '反馈人姓名', dataIndex: 'responPersonname', align: 'center', width: 140 },
{ title: '实际执行情况', dataIndex: 'actualExect', align: 'left', width: 280 },
{ title: '实际完成时间', dataIndex: 'actualTime', align: 'center', width: 180 },
{ title: '调整落实措施及执行情况', dataIndex: 'actSt', align: 'left', width: 260 },
{ title: '完成状态', dataIndex: 'bpmStatus', align: 'center', width: 120, customRender: ({ record }) => record?.bpmStatus_dictText || record?.bpmStatus },
{ title: '提出人确认', dataIndex: 'proposerConfirm', align: 'center', width: 140 },
{ title: '附件', dataIndex: 'id', key: 'attachments', align: 'left', width: 340 },
];
const feedbackActionColumn = { title: '操作', dataIndex: 'action', key: 'action', align: 'center', width: 120, fixed: 'right' };
const feedbackColumns = computed(() => {
return canManageFeedback.value ? [...feedbackBaseColumns, feedbackActionColumn] : feedbackBaseColumns;
});
const feedbackTableScrollX = computed(() => {
return canManageFeedback.value ? 1640 : 1520;
});
const mainDisabled = computed(() => {
if (props.formBpm) {
return props.formData?.disabled !== false;
}
return props.formDisabled;
});
const showProcessHandle = computed(() => props.formBpm && props.formData?.PROCESS_TAB_TYPE === 'run' && !!props.formData?.taskId);
const canManageFeedback = computed(() => props.formBpm && props.formData?.PROCESS_TAB_TYPE === 'run' && !!props.formData?.taskId);
const showAddFeedback = computed(() => String(props.formData?.extendUrlParams?.addfeedback ?? '') === '1');
const showSubApproveUser = computed(() => String(props.formData?.extendUrlParams?.selectuser ?? '') === '1');
const showSubApproveUserSelector = computed(() => showSubApproveUser.value && String(isEnd.value) !== '1');
const processInfo = computed(() => ({
taskId: props.formData?.taskId,
taskDefKey: props.formData?.taskDefKey,
processInstanceId:
props.formData?.procInsId ||
props.formData?.procInstId ||
props.formData?.processInstanceId ||
props.formData?.vars?.BPM_INST_ID ||
props.formData?.vars?.JG_LOCAL_PROCESS_ID ||
props.formData?.vars?.process_inst_id ||
props.formData?.vars?.processInstanceId,
processDataId: props.formData?.processDataId,
processTableName: props.formData?.processTableName,
}));
onMounted(() => {
initFormData();
});
watch([() => props.formData?.dataId, () => processInfo.value.processInstanceId], () => initFormData());
watch(
() => props.formData?.vars?.isEnd,
(value) => {
isEnd.value = String(value ?? '0') === '1' ? 1 : 0;
},
{ immediate: true }
);
async function initFormData() {
const dataId = props.formData?.dataId;
if (!dataId) {
return;
}
showBaseInfoDetail.value = false;
loading.value = true;
try {
const data = await defHttp.get({ url: queryByIdUrl, params: { id: dataId } });
setMainForm(data || {});
await loadFeedbackList();
} finally {
loading.value = false;
}
}
function setMainForm(record: Record<string, any>) {
Object.keys(mainForm).forEach((key) => {
mainForm[key] = record[key] ?? '';
});
}
async function loadFeedbackList() {
const bpmProcessId = processInfo.value.processInstanceId;
if (!mainForm.id || !bpmProcessId) {
feedbackList.value = [];
feedbackAttachmentRefreshKey.value += 1;
return;
}
const res = await bgTakepulseFeedbackList({ mainId: mainForm.id, bpmProcessId, pageNo: 1, pageSize: 999 });
feedbackList.value = res?.records || res?.result?.records || [];
feedbackAttachmentRefreshKey.value += 1;
}
function getFeedbackAttachmentKey(record: Recordable) {
return `${record?.id || ''}-${feedbackAttachmentRefreshKey.value}`;
}
async function submitForm() {
return saveMainForm();
}
async function saveMainForm(options: { showMessage?: boolean; emitOk?: boolean } = {}) {
const { showMessage = true, emitOk = true } = options;
savingMain.value = true;
try {
const processInstanceId = processInfo.value.processInstanceId;
const res = await saveBpmForm({
processInstanceId,
varField: 'json_data',
formData: { ...mainForm },
});
if (res.success) {
if (showMessage) {
createMessage.success(res.message || '保存成功');
}
if (emitOk) {
emit('ok');
}
return true;
}
createMessage.warning(res.message || '保存失败');
return false;
} catch (error) {
createMessage.warning('保存失败');
return false;
} finally {
savingMain.value = false;
}
}
async function saveMainFormBeforeProcessHandle() {
if (!mainDisabled.value) {
const mainSaved = await saveMainForm({ showMessage: false, emitOk: false });
if (!mainSaved) {
return false;
}
}
if (showSubApproveUser.value) {
return saveSubApproveUserVariable({ showSuccessMessage: false });
}
return true;
}
function openFeedbackModal() {
if (!mainForm.id) {
createMessage.warning('主表数据不存在,无法新增反馈');
return;
}
const processInstanceId = processInfo.value.processInstanceId;
if (!processInstanceId) {
createMessage.warning('流程实例ID不能为空,无法新增反馈');
return;
}
feedbackModalRef.value?.open(mainForm.id, mainForm.secretLevel, processInstanceId);
}
function openFeedbackEditModal(record: Recordable) {
if (!canManageFeedback.value) {
createMessage.warning('当前流程状态不允许编辑反馈');
return;
}
if (!record?.id) {
createMessage.warning('反馈记录不存在,无法编辑');
return;
}
feedbackModalRef.value?.open(mainForm.id, mainForm.secretLevel, processInfo.value.processInstanceId, record);
}
async function handleFeedbackDelete(record: Recordable) {
if (!canManageFeedback.value) {
createMessage.warning('当前流程状态不允许删除反馈');
return;
}
if (!record?.id) {
createMessage.warning('反馈记录不存在,无法删除');
return;
}
try {
await bgTakepulseFeedbackDelete({ id: record.id }, () => undefined);
createMessage.success('删除成功');
await loadFeedbackList();
} catch (error) {
createMessage.warning('删除失败');
}
}
async function saveSubApproveUserVariable(options: { showSuccessMessage?: boolean } = {}) {
const { showSuccessMessage = true } = options;
const processInstanceId = processInfo.value.processInstanceId;
const isEndValue = String(isEnd.value);
const usernameValue = normalizeUsernameList(subApproveUser.value);
if (!processInstanceId) {
createMessage.warning('流程实例ID不能为空');
return false;
}
if (isEndValue !== '1' && !usernameValue) {
createMessage.warning('请选择部门经办人');
return false;
}
savingSubApproveUser.value = true;
try {
const isEndResult = await saveProcessVariable('isEnd', isEndValue);
if (!isEndResult?.success) {
createMessage.warning(isEndResult.message || '保存失败');
return false;
}
if (isEndValue !== '1') {
const subApproveUserResult = await saveProcessVariable('subApproveUser', usernameValue);
if (!subApproveUserResult?.success) {
createMessage.warning(subApproveUserResult.message || '保存失败');
return false;
}
}
if (showSuccessMessage) {
createMessage.success('保存成功');
}
return true;
} catch (error) {
createMessage.warning('保存失败');
return false;
} finally {
savingSubApproveUser.value = false;
}
}
function saveProcessVariable(varField: string, varVal: any) {
return setProcessVariable({
processInstanceId: processInfo.value.processInstanceId,
taskId: processInfo.value.taskId,
local: true,
varField,
varVal,
});
}
function normalizeUsernameList(value: string) {
return String(value || '')
.split(',')
.map((item) => item.trim())
.filter(Boolean)
.join(',');
}
function handleProcessSuccess() {
emit('success');
}
function handleClaimSuccess() {
emit('claimSuccess');
}
defineExpose({
submitForm,
initFormData,
loadFeedbackList,
});
</script>
<style lang="less" scoped>
.bg-takepulse-bpm-form {
padding: 8px 12px 14px;
}
.main-form {
background: #fff;
}
.main-form,
.process-variable-form {
:deep(.ant-form-item-label) {
text-align: left;
}
:deep(.ant-form-item-label > label) {
justify-content: flex-start;
color: #1f2937;
font-weight: 500;
}
:deep(.ant-form-item-control),
:deep(.ant-form-item-control-input),
:deep(.ant-form-item-control-input-content) {
text-align: left;
}
}
.section-title {
margin-bottom: 8px;
padding-left: 8px;
border-left: 3px solid #1677ff;
color: #1f2937;
font-size: 14px;
font-weight: 600;
line-height: 16px;
}
.section-toolbar {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 8px;
padding: 6px 10px;
background: #f6fbff;
border: 1px solid #d6e8ff;
border-radius: 6px;
.section-title {
margin-bottom: 0;
}
.section-actions {
display: inline-flex;
align-items: center;
gap: 4px;
}
.section-action-button {
display: inline-flex;
align-items: center;
gap: 4px;
min-width: 58px;
justify-content: center;
font-weight: 500;
box-shadow: none;
}
.base-save-button {
display: inline-flex;
align-items: center;
gap: 4px;
height: 24px;
padding: 0 6px;
color: #64748b;
font-weight: 400;
}
}
.base-info-header {
margin-top: 0;
}
.base-info-row {
padding: 0 10px;
:deep(.ant-form-item) {
margin-bottom: 6px;
}
:deep(.ant-form-item-label) {
padding-bottom: 0;
}
:deep(.ant-form-item-label > label) {
width: 100%;
}
:deep(.ant-input),
:deep(.ant-input-number),
:deep(.ant-picker),
:deep(.ant-select-selector) {
min-height: 30px;
}
}
.main-form-readonly {
:deep(.ant-input[disabled]),
:deep(.ant-input-disabled),
:deep(.ant-input-affix-wrapper-disabled),
:deep(.ant-input-number-disabled),
:deep(textarea.ant-input[disabled]),
:deep(.ant-picker-disabled),
:deep(.ant-select-disabled .ant-select-selector) {
background: transparent !important;
border-color: transparent !important;
color: #1f2937 !important;
box-shadow: none !important;
cursor: default !important;
opacity: 1 !important;
}
:deep(.ant-input[disabled]),
:deep(.ant-input-disabled),
:deep(.ant-input-number-disabled),
:deep(.ant-input-affix-wrapper-disabled),
:deep(textarea.ant-input[disabled]) {
padding-left: 0 !important;
padding-right: 0 !important;
}
:deep(.ant-picker-disabled input),
:deep(.ant-select-disabled .ant-select-selection-item),
:deep(.ant-select-disabled .ant-select-selection-placeholder) {
color: #1f2937 !important;
-webkit-text-fill-color: #1f2937 !important;
cursor: default !important;
}
:deep(.ant-select-disabled .ant-select-arrow),
:deep(.ant-picker-disabled .ant-picker-suffix),
:deep(.ant-input-number-disabled .ant-input-number-handler-wrap),
:deep(.ant-select-disabled .ant-select-clear) {
display: none;
}
}
.feedback-header {
margin-bottom: 8px;
.feedback-add-button {
min-width: 104px;
}
}
.process-variable-form {
margin-bottom: 8px;
}
:deep(.ant-divider-horizontal) {
margin: 10px 0;
}
.feedback-attachment-list {
min-width: 300px;
:deep(.file-list-wrapper) {
min-height: 0 !important;
padding: 4px 8px;
}
:deep(.ant-spin-nested-loading),
:deep(.ant-spin-container) {
min-height: 0 !important;
line-height: 20px;
}
:deep(.file-list-header) {
margin-bottom: 6px;
padding-bottom: 6px;
}
:deep(.file-list .file-item) {
padding: 8px;
margin-bottom: 6px;
}
:deep(.ant-empty) {
margin: 0 !important;
display: flex;
align-items: center;
min-height: 20px;
text-align: left;
}
:deep(.ant-empty-image) {
display: none !important;
}
:deep(.ant-empty-description) {
color: #94a3b8;
font-size: 12px;
line-height: 20px;
}
}
</style>