代码生成器修改,流程新建,表单新建,流程审批等页面修改

This commit is contained in:
GAOANG
2024-03-29 16:41:21 +08:00
parent d55f879846
commit 788cfac511
6 changed files with 754 additions and 704 deletions

View File

@ -825,12 +825,14 @@ ${hasTemplatePrint ? ' reactive ' : ''}
const btnEvent = ${btnEvent}
const { currentRoute } = useRouter();
const router = useRouter();
${
hasTemplatePrint
? `const printMenuId = computed(() => currentRoute.value.meta.menuId as string);`
: ''
}
const formIdComputedRef = computed(() => currentRoute.value.meta.formId as string);
const schemaIdComputedRef = computed(() => currentRoute.value.meta.schemaId as string);
${
hasStartWorkButton
@ -1000,16 +1002,17 @@ ${hasTemplatePrint ? ' reactive ' : ''}
hasAddButton
? `
function handleAdd() {
${
formType === 'modal'
? `
openModal(true, {
isUpdate: false,
});`
: `
openDrawer(true, {
isUpdate: false,
});`
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/${lowerClassName}/0/createForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}'
}
});
}
}`
: ''
@ -1021,9 +1024,11 @@ ${hasTemplatePrint ? ' reactive ' : ''}
${
formType === 'modal'
? `
openModal(true, {
id: record.${camelCaseString(mainTable.pkField)},
isUpdate: true,
router.push({
path: '/form/${lowerClassName}/' + record.id + '/updateForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}'
}
});`
: `
openDrawer(true, {
@ -1303,10 +1308,12 @@ ${hasTemplatePrint ? ' reactive ' : ''}
${
formType === 'modal'
? `
openModal(true, {
isView: true,
id: record.${camelCaseString(mainTable.pkField)},
});`
router.push({
path: '/form/${lowerClassName}/' + record.id + '/viewForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}'
}
});`
: `
openDrawer(true, {
isView: true,
@ -1547,10 +1554,13 @@ ${hasTemplatePrint ? ' reactive ' : ''}
}
}
function handleApproveProcess(record: Recordable) {
visibleApproveProcessRef.value = true;
schemaIdRef.value = record.workflowData.schemaId;
processIdRef.value = record.workflowData.processId;
taskIdRef.value = record.workflowData.taskIds[0];
const { processId, taskIds, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
taskId: taskIds[0]
}
});
}
function handleCloseLaunch() {
visibleLaunchProcessRef.value = false;

View File

@ -36,16 +36,9 @@
</a-dropdown>
</a-space>
</div>
<FormInformation
:key="renderKey"
ref="formInformation"
:disabled="readonly"
:formAssignmentData="data.formAssignmentData"
:formInfos="data.formInfos"
:opinions="data.opinions"
:opinionsComponents="data.opinionsComponents"
@get-form-configs="(config) => (formConfigs = config)"
/>
<FormInformation :key="renderKey" ref="formInformation" :disabled="readonly"
:formAssignmentData="data.formAssignmentData" :formInfos="data.formInfos" :opinions="data.opinions"
:opinionsComponents="data.opinionsComponents" @get-form-configs="(config) => (formConfigs = config)" />
<Title :font-size="18" default-value="流转信息"></Title>
<flow-history :items="getTaskRecords()"></flow-history>
<opinion-dialog ref="opinionDlg" />
@ -54,231 +47,231 @@
</template>
<script setup>
import { useRouter } from 'vue-router';
import { onMounted, reactive, ref, unref } from 'vue';
import FormInformation from '/@/views/secondDev/FormInformation.vue';
import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
import { getApprovalProcess, postApproval, postGetNextTaskMaybeArrival } from '/@/api/workflow/task';
import { ApproveCode, ApproveType } from '/@/enums/workflowEnum';
import { CheckCircleOutlined, StopOutlined, CloseOutlined, DownOutlined } from '@ant-design/icons-vue';
import OpinionDialog from '/@/components/SecondDev/OpinionDialog.vue';
import { separator } from '/@bpmn/config/info';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import Title from '/@/components/Title/src/Title.vue';
import FlowHistory from '/@/components/SecondDev/FlowHistory.vue';
import { message } from 'ant-design-vue';
import useEventBus from '/@/hooks/event/useEventBus';
import { useRouter } from 'vue-router';
import { onMounted, reactive, ref, unref } from 'vue';
import FormInformation from '/@/views/secondDev/FormInformation.vue';
import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
import { getApprovalProcess, postApproval, postGetNextTaskMaybeArrival } from '/@/api/workflow/task';
import { ApproveCode, ApproveType } from '/@/enums/workflowEnum';
import { CheckCircleOutlined, StopOutlined, CloseOutlined, DownOutlined } from '@ant-design/icons-vue';
import OpinionDialog from '/@/components/SecondDev/OpinionDialog.vue';
import { separator } from '/@bpmn/config/info';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import Title from '/@/components/Title/src/Title.vue';
import FlowHistory from '/@/components/SecondDev/FlowHistory.vue';
import { message } from 'ant-design-vue';
import useEventBus from '/@/hooks/event/useEventBus';
const { data, approveUserData, initProcessData, notificationError, notificationSuccess } = userTaskItem();
const { bus, FLOW_PROCESSED } = useEventBus();
const { data, approveUserData, initProcessData, notificationError, notificationSuccess } = userTaskItem();
const { bus, FLOW_PROCESSED } = useEventBus();
const tabStore = useMultipleTabStore();
const router = useRouter();
const currentRoute = router.currentRoute.value;
const rQuery = currentRoute.query;
const rParams = currentRoute.params;
const schemaId = ref(rParams.arg1);
const taskId = ref(rQuery.taskId);
const processId = ref(rParams.arg2);
const readonly = ref(!!rQuery.readonly); // 查看流程会触发只读模式
const renderKey = ref('');
const formConfigs = ref();
const opinionDlg = ref();
const validateSuccess = ref(false);
const formInformation = ref();
const tabStore = useMultipleTabStore();
const router = useRouter();
const currentRoute = router.currentRoute.value;
const rQuery = currentRoute.query;
const rParams = currentRoute.params;
const schemaId = ref(rParams.arg1);
const taskId = ref(rQuery.taskId);
const processId = ref(rParams.arg2);
const readonly = ref(!!rQuery.readonly); // 查看流程会触发只读模式
const renderKey = ref('');
const formConfigs = ref();
const opinionDlg = ref();
const validateSuccess = ref(false);
const formInformation = ref();
let approvalData = reactive({
isCountersign: false,
isAddOrSubSign: false,
stampInfo: {
stampId: '',
password: ''
},
buttonConfigs: [],
approvedType: ApproveType.AGREE,
approvedResult: ApproveCode.AGREE,
approvedContent: '',
rejectNodeActivityId: '',
rejectNodeActivityIds: [],
circulateConfigs: [],
nextTaskUser: {} // 格式为taskKey: 用户id逗号分隔
});
let approvedType = ref(ApproveType.AGREE);
let approvalData = reactive({
isCountersign: false,
isAddOrSubSign: false,
stampInfo: {
stampId: '',
password: ''
},
buttonConfigs: [],
approvedType: ApproveType.AGREE,
approvedResult: ApproveCode.AGREE,
approvedContent: '',
rejectNodeActivityId: '',
rejectNodeActivityIds: [],
circulateConfigs: [],
nextTaskUser: {} // 格式为taskKey: 用户id逗号分隔
});
let approvedType = ref(ApproveType.AGREE);
function onMoreClick() {}
function onMoreClick() { }
function close() {
tabStore.closeTab(currentRoute, router);
}
function close() {
tabStore.closeTab(currentRoute, router);
}
async function onApproveClick() {
await submit();
const params = await getApproveParams();
const nextNodes = await postGetNextTaskMaybeArrival(params);
approvalData.approvedType = ApproveType.AGREE;
approvalData.approvedResult = ApproveCode.AGREE;
opinionDlg.value.toggleDialog({
action: 'agree',
nextNodes,
callback: (args) => {
approvalData.approvedContent = args.opinion;
approvalData.nextTaskUser = args.nextTaskUser;
onFinish({});
}
});
}
async function onDenyClick() {
approvalData.approvedType = ApproveType.REJECT;
approvalData.approvedResult = ApproveCode.REJECT;
opinionDlg.value.toggleDialog({
action: 'reject',
processId: processId.value,
taskId: taskId.value,
callback: (args) => {
approvalData.approvedContent = args.opinion;
approvalData.rejectNodeActivityId = args.rejectNodeId;
approvalData.nextTaskUser = args.nextTaskUser;
onFinish({});
}
});
}
function flowSuccess() {
opinionDlg.value.toggleDialog({
isClose: true
});
message.success('操作成功');
setTimeout(() => {
bus.emit(FLOW_PROCESSED);
close();
}, 500);
}
function flowFail() {
opinionDlg.value.stopLoading();
}
function reset() {
approvalData.isAddOrSubSign = false;
approvalData.stampInfo = {
stampId: '',
password: ''
};
approvalData.buttonConfigs = [];
approvalData.approvedType = ApproveType.AGREE;
approvalData.approvedContent = '';
approvalData.rejectNodeActivityId = '';
approvalData.rejectNodeActivityIds = [];
approvalData.circulateConfigs = [];
}
function getTaskRecords() {
if (data?.taskApproveOpinions?.length) {
return data.taskApproveOpinions || [];
}
}
onMounted(async () => {
if (unref(taskId)) {
try {
let res = await getApprovalProcess(unref(taskId), unref(processId));
initProcessData(res);
if (!readonly.value) {
if (res.buttonConfigs) {
approvalData.buttonConfigs = res.buttonConfigs;
}
if (res.relationTasks) {
data.predecessorTasks = res.relationTasks;
}
if (res.isAddOrSubSign) {
approvalData.isAddOrSubSign = res.isAddOrSubSign;
}
approvalData.approvedType = ApproveType.AGREE;
approvedType.value = ApproveType.AGREE;
approvalData.approvedContent = '';
approvalData.rejectNodeActivityId = '';
approvalData.rejectNodeActivityIds = [];
approvalData.circulateConfigs = [];
}
renderKey.value = Math.random() + '';
} catch (error) {}
} else {
async function onApproveClick() {
await submit();
const params = await getApproveParams();
const nextNodes = await postGetNextTaskMaybeArrival(params);
approvalData.approvedType = ApproveType.AGREE;
approvalData.approvedResult = ApproveCode.AGREE;
opinionDlg.value.toggleDialog({
action: 'agree',
nextNodes,
callback: (args) => {
approvalData.approvedContent = args.opinion;
approvalData.nextTaskUser = args.nextTaskUser;
onFinish({});
}
});
}
async function submit() {
data.submitLoading = true;
validateSuccess.value = false;
try {
let validateForms = await formInformation.value.validateForm();
if (validateForms.length > 0) {
let successValidate = validateForms.filter((ele) => {
return ele.validate;
});
if (successValidate.length == validateForms.length) {
validateSuccess.value = true;
data.submitLoading = false;
} else {
data.submitLoading = false;
notificationError(t('审批流程'), t('表单校验未通过'));
}
}
} catch (error) {
data.submitLoading = false;
notificationError(t('审批流程'), t('审批流程失败'));
async function onDenyClick() {
approvalData.approvedType = ApproveType.REJECT;
approvalData.approvedResult = ApproveCode.REJECT;
opinionDlg.value.toggleDialog({
action: 'reject',
processId: processId.value,
taskId: taskId.value,
callback: (args) => {
approvalData.approvedContent = args.opinion;
approvalData.rejectNodeActivityId = args.rejectNodeId;
approvalData.nextTaskUser = args.nextTaskUser;
onFinish({});
}
}
});
}
function getUploadFileFolderIds(formModels) {
let fileFolderIds = [];
let uploadComponentIds = formInformation.value.getUploadComponentIds();
uploadComponentIds.forEach((ids) => {
if (ids.includes(separator)) {
let arr = ids.split(separator);
if (arr.length == 2 && formModels[arr[0]][arr[1]]) {
fileFolderIds.push(formModels[arr[0]][arr[1]]);
} else if (arr.length == 3 && formModels[arr[0]][arr[1]] && Array.isArray(formModels[arr[0]][arr[1]])) {
formModels[arr[0]][arr[1]].forEach((o) => {
fileFolderIds.push(o[arr[2]]);
});
}
}
});
return fileFolderIds;
}
function flowSuccess() {
opinionDlg.value.toggleDialog({
isClose: true
});
message.success('操作成功');
setTimeout(() => {
bus.emit(FLOW_PROCESSED);
close();
}, 500);
}
async function getApproveParams() {
let formModels = await formInformation.value.getFormModels();
let system = formInformation.value.getSystemType();
let fileFolderIds = getUploadFileFolderIds(formModels);
return {
approvedType: approvalData.approvedType,
approvedResult: approvalData.approvedResult, // approvalData.approvedType 审批结果 如果为 4 就需要传buttonCode
approvedContent: approvalData.approvedContent,
formData: formModels,
rejectNodeActivityId: approvalData.rejectNodeActivityId,
taskId: taskId.value,
fileFolderIds,
circulateConfigs: approvalData.circulateConfigs,
/*stampId: values.stampId,
stampPassword: values.password,*/
isOldSystem: system,
nextTaskUser: approvalData.nextTaskUser
};
}
function flowFail() {
opinionDlg.value.stopLoading();
}
async function onFinish(values) {
function reset() {
approvalData.isAddOrSubSign = false;
approvalData.stampInfo = {
stampId: '',
password: ''
};
approvalData.buttonConfigs = [];
approvalData.approvedType = ApproveType.AGREE;
approvalData.approvedContent = '';
approvalData.rejectNodeActivityId = '';
approvalData.rejectNodeActivityIds = [];
approvalData.circulateConfigs = [];
}
function getTaskRecords() {
if (data?.taskApproveOpinions?.length) {
return data.taskApproveOpinions || [];
}
}
onMounted(async () => {
if (unref(taskId)) {
try {
if (/*validateSuccess.value*/ true) {
let params = await getApproveParams();
await postApproval(params);
flowSuccess();
let res = await getApprovalProcess(unref(taskId), unref(processId));
initProcessData(res);
if (!readonly.value) {
if (res.buttonConfigs) {
approvalData.buttonConfigs = res.buttonConfigs;
}
if (res.relationTasks) {
data.predecessorTasks = res.relationTasks;
}
if (res.isAddOrSubSign) {
approvalData.isAddOrSubSign = res.isAddOrSubSign;
}
approvalData.approvedType = ApproveType.AGREE;
approvedType.value = ApproveType.AGREE;
approvalData.approvedContent = '';
approvalData.rejectNodeActivityId = '';
approvalData.rejectNodeActivityIds = [];
approvalData.circulateConfigs = [];
}
renderKey.value = Math.random() + '';
} catch (error) { }
} else {
}
});
async function submit() {
data.submitLoading = true;
validateSuccess.value = false;
try {
let validateForms = await formInformation.value.validateForm();
if (validateForms.length > 0) {
let successValidate = validateForms.filter((ele) => {
return ele.validate;
});
if (successValidate.length == validateForms.length) {
validateSuccess.value = true;
data.submitLoading = false;
} else {
data.submitLoading = false;
notificationError(t('审批流程'), t('表单校验未通过'));
}
} catch (error) {
flowFail();
}
} catch (error) {
data.submitLoading = false;
notificationError(t('审批流程'), t('审批流程失败'));
}
}
function getUploadFileFolderIds(formModels) {
let fileFolderIds = [];
let uploadComponentIds = formInformation.value.getUploadComponentIds();
uploadComponentIds.forEach((ids) => {
if (ids.includes(separator)) {
let arr = ids.split(separator);
if (arr.length == 2 && formModels[arr[0]][arr[1]]) {
fileFolderIds.push(formModels[arr[0]][arr[1]]);
} else if (arr.length == 3 && formModels[arr[0]][arr[1]] && Array.isArray(formModels[arr[0]][arr[1]])) {
formModels[arr[0]][arr[1]].forEach((o) => {
fileFolderIds.push(o[arr[2]]);
});
}
}
});
return fileFolderIds;
}
async function getApproveParams() {
let formModels = await formInformation.value.getFormModels();
let system = formInformation.value.getSystemType();
let fileFolderIds = getUploadFileFolderIds(formModels);
return {
approvedType: approvalData.approvedType,
approvedResult: approvalData.approvedResult, // approvalData.approvedType 审批结果 如果为 4 就需要传buttonCode
approvedContent: approvalData.approvedContent,
formData: formModels,
rejectNodeActivityId: approvalData.rejectNodeActivityId,
taskId: taskId.value,
fileFolderIds,
circulateConfigs: approvalData.circulateConfigs,
/*stampId: values.stampId,
stampPassword: values.password,*/
isOldSystem: system,
nextTaskUser: approvalData.nextTaskUser
};
}
async function onFinish(values) {
try {
if (/*validateSuccess.value*/ true) {
let params = await getApproveParams();
await postApproval(params);
flowSuccess();
data.submitLoading = false;
}
} catch (error) {
flowFail();
}
}
</script>

View File

@ -36,7 +36,9 @@
</a-space>
</div>
<div class="flow-content">
<FormInformation :key="randKey" ref="formInformation" :disabled="false" :formAssignmentData="data.formAssignmentData" :formInfos="data.formInfos" :opinions="data.opinions" :opinionsComponents="data.opinionsComponents" />
<FormInformation :key="randKey" ref="formInformation" :disabled="false"
:formAssignmentData="data.formAssignmentData" :formInfos="data.formInfos" :opinions="data.opinions"
:opinionsComponents="data.opinionsComponents" />
</div>
</div>
<a-modal :visible="showFlowChart" centered class="geg" closable title="流程图" width="1200px">
@ -45,252 +47,293 @@
<a-button type="primary" @click="closeFlowChart">关闭</a-button>
</template>
</a-modal>
<opinion-dialog ref="opinionDlg" />
</div>
</template>
<script setup>
import { useRouter } from 'vue-router';
import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
import FormInformation from '/@/views/secondDev/FormInformation.vue';
import ProcessInformation from '/@/views/workflow/task/components/flow/ProcessInformation.vue';
import { getStartProcessInfo, getReStartProcessInfo, reLaunch, postLaunch } from '/@/api/workflow/task';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import { CloseOutlined, SendOutlined, ClockCircleOutlined, PrinterOutlined, ApartmentOutlined } from '@ant-design/icons-vue';
import { nextTick, onMounted, ref, toRaw } from 'vue';
import { postDraft, putDraft } from '/@/api/workflow/process';
import { useI18n } from '/@/hooks/web/useI18n';
import { separator } from '/@bpmn/config/info';
import { message } from 'ant-design-vue';
import { useRouter } from 'vue-router';
import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
import FormInformation from '/@/views/secondDev/FormInformation.vue';
import ProcessInformation from '/@/views/workflow/task/components/flow/ProcessInformation.vue';
import { getStartProcessInfo, getReStartProcessInfo, reLaunch, postLaunch, postApproval, postGetNextTaskMaybeArrival } from '/@/api/workflow/task';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import { CloseOutlined, SendOutlined, ClockCircleOutlined, PrinterOutlined, ApartmentOutlined } from '@ant-design/icons-vue';
import { nextTick, onMounted, ref, toRaw, reactive } from 'vue';
import { postDraft, putDraft } from '/@/api/workflow/process';
import { useI18n } from '/@/hooks/web/useI18n';
import { separator } from '/@bpmn/config/info';
import { message } from 'ant-design-vue';
import OpinionDialog from '/@/components/SecondDev/OpinionDialog.vue';
import { ApproveCode, ApproveType } from '/@/enums/workflowEnum';
const router = useRouter();
const tabStore = useMultipleTabStore();
const router = useRouter();
const tabStore = useMultipleTabStore();
const { t } = useI18n();
const { data, approveUserData, initProcessData, notificationSuccess, notificationError } = userTaskItem();
const currentRoute = router.currentRoute.value;
const rParams = currentRoute.params;
const fullPath = currentRoute.fullPath;
const rSchemaId = rParams.arg1;
const rDraftsId = rParams.arg2;
const draftsJsonStr = localStorage.getItem('draftsJsonStr');
let formInformation = ref();
let pageMode = 'new';
const showFlowChart = ref(false);
const disableSubmit = ref(false);
let randKey = ref('randkey'); // 强制表单重新渲染
const { t } = useI18n();
const { data, approveUserData, initProcessData, notificationSuccess, notificationError } = userTaskItem();
const currentRoute = router.currentRoute.value;
const rParams = currentRoute.params;
const fullPath = currentRoute.fullPath;
const rSchemaId = rParams.arg1;
const rDraftsId = rParams.arg2;
const taskId = ref();
const draftsJsonStr = localStorage.getItem('draftsJsonStr');
let formInformation = ref();
const opinionDlg = ref();
let pageMode = 'new';
const showFlowChart = ref(false);
const disableSubmit = ref(false);
const mainFormModels = ref();
let randKey = ref('randkey'); // 强制表单重新渲染
let approvalData = reactive({
isCountersign: false,
isAddOrSubSign: false,
stampInfo: {
stampId: '',
password: ''
},
buttonConfigs: [],
approvedType: ApproveType.AGREE,
approvedResult: ApproveCode.AGREE,
approvedContent: '',
rejectNodeActivityId: '',
rejectNodeActivityIds: [],
circulateConfigs: [],
nextTaskUser: {} // 格式为taskKey: 用户id逗号分隔
});
if (draftsJsonStr) {
localStorage.removeItem('draftsJsonStr');
pageMode = 'draft';
}
function closeFlowChart() {
showFlowChart.value = false;
}
function openFlowChart() {
showFlowChart.value = true;
}
function close() {
tabStore.closeTab(currentRoute, router);
}
const props = defineProps({
rowKeyData: {
type: String
}
});
onMounted(async () => {
try {
// 发起流程
let res = await getStartProcessInfo(rSchemaId);
const title = res?.schemaInfo?.name;
if (title) {
const tabPrefix = pageMode === 'new' ? '新建' : '草稿';
tabStore.changeTitle(fullPath, `${tabPrefix}${title}`);
}
initProcessData(res);
} catch (error) { }
randKey.value = Math.random() + '';
// 这里的顺序不能变 表单不渲染的时候 设置表单初值没用
await nextTick();
await initDraftsFormData();
});
async function initDraftsFormData() {
//isPublish.value = Object.keys(data.formInfos).length > 0 ? false : true;
if (draftsJsonStr) {
localStorage.removeItem('draftsJsonStr');
pageMode = 'draft';
}
let formDataJson = JSON.parse(draftsJsonStr);
let formData = [];
function closeFlowChart() {
showFlowChart.value = false;
}
function openFlowChart() {
showFlowChart.value = true;
}
function close() {
tabStore.closeTab(currentRoute, router);
}
const props = defineProps({
schemaId: {
type: String,
required: true
},
draftsId: {
type: String
},
taskId: {
type: String,
required: false,
default: ''
},
processId: {
type: String,
required: false,
default: ''
},
formData: {
type: Object
},
formId: {
type: String
},
rowKeyData: {
type: String
}
});
onMounted(async () => {
try {
if (props.processId) {
// 重新发起
let res = await getReStartProcessInfo(props.taskId, props.processId);
res.taskApproveOpinions = [];
initProcessData(res);
} else if (props.schemaId && props.formId) {
let res = await getStartProcessInfo(props.schemaId);
if (props.formData && props.formId) {
res.formInfos.map((m) => {
if (m.formConfig.formId === props.formId) {
m.formData = toRaw(props.formData);
}
});
}
initProcessData(res);
} else {
// 发起流程
let res = await getStartProcessInfo(rSchemaId);
const title = res?.schemaInfo?.name;
if (title) {
const tabPrefix = pageMode === 'new' ? '新建' : '草稿';
tabStore.changeTitle(fullPath, `${tabPrefix}${title}`);
}
initProcessData(res);
data.formInfos.forEach((item) => {
if (formDataJson && item.formConfig && item.formConfig.key && formDataJson[item.formConfig.key]) {
formData.push(item.formConfig.key ? formDataJson[item.formConfig.key] : {});
}
} catch (error) {}
randKey.value = Math.random() + '';
// 这里的顺序不能变 表单不渲染的时候 设置表单初值没用
await nextTick();
await initDraftsFormData();
});
async function initDraftsFormData() {
//isPublish.value = Object.keys(data.formInfos).length > 0 ? false : true;
if (draftsJsonStr) {
let formDataJson = JSON.parse(draftsJsonStr);
let formData = [];
data.formInfos.forEach((item) => {
if (formDataJson && item.formConfig && item.formConfig.key && formDataJson[item.formConfig.key]) {
formData.push(item.formConfig.key ? formDataJson[item.formConfig.key] : {});
}
});
await formInformation.value.setFormData(formData);
}
});
await formInformation.value.setFormData(formData);
}
}
async function saveDraft() {
try {
disableSubmit.value = true;
let formModels = await formInformation.value.saveDraftData();
if (rDraftsId !== '0') {
let res = await putDraft(rSchemaId, formModels, rDraftsId, props.rowKeyData);
showResult(res, '保存草稿');
} else {
let res = await postDraft(rSchemaId, formModels, props.rowKeyData);
showResult(res, '保存草稿');
}
} catch (error) {
notificationError('保存草稿');
}
}
function showResult(res, title) {
if (res) {
notificationSuccess(title);
async function saveDraft() {
try {
disableSubmit.value = true;
let formModels = await formInformation.value.saveDraftData();
if (rDraftsId !== '0') {
let res = await putDraft(rSchemaId, formModels, rDraftsId, props.rowKeyData);
showResult(res, '保存草稿');
} else {
notificationError(title);
let res = await postDraft(rSchemaId, formModels, props.rowKeyData);
showResult(res, '保存草稿');
}
} catch (error) {
notificationError('保存草稿');
}
}
function showResult(res, title) {
if (res) {
notificationSuccess(title);
} else {
notificationError(title);
}
}
function flowSuccess() {
/*opinionDlg.value.toggleDialog({
isClose: true
});*/
function createFlowSuccess(taskList) {
/*opinionDlg.value.toggleDialog({
isClose: true
});*/
if (taskList) {
approvalCreate();
} else {
message.success('流程发起成功');
data.submitLoading = false;
setTimeout(() => {
close();
}, 500);
}
async function saveLaunch() {
data.submitLoading = true;
try {
let validateForms = await formInformation.value.validateForm();
let system = formInformation.value.getSystemType();
if (validateForms.length > 0) {
let successValidate = validateForms.filter((ele) => {
return ele.validate;
});
if (successValidate.length == validateForms.length) {
let formModels = await formInformation.value.getFormModels();
let relationTasks = [];
if (data.predecessorTasks && data.predecessorTasks.length > 0) {
relationTasks = data.predecessorTasks.map((ele) => {
return { taskId: ele.taskId, schemaId: ele.schemaId };
});
}
let fileFolderIds = getUploadFileFolderIds(formModels);
//如果传入了processId 代表是重新发起流程
let res;
if (props.processId) {
res = await reLaunch(props.processId, props.schemaId, formModels, relationTasks, fileFolderIds, system);
} else {
res = await postLaunch(rSchemaId, formModels, relationTasks, fileFolderIds, system);
}
// 下一节点审批人
let taskList = [];
if (res && res.length > 0) {
taskList = res
.filter((ele) => {
return ele.isMultiInstance == false && ele.isAppoint == true;
})
.map((ele) => {
return {
taskId: ele.taskId,
taskName: ele.taskName,
provisionalApprover: ele.provisionalApprover,
selectIds: []
};
});
if (taskList.length > 0) {
notificationError('提交失败', '流程设计错误,开始后的第一个节点必须是审批人为发起人的起草节点。');
data.submitLoading = false;
} else {
data.submitLoading = false;
flowSuccess();
}
} else {
data.submitLoading = false;
flowSuccess();
}
} else {
data.submitLoading = false;
notificationError(t('发起流程'), t('表单校验未通过'));
}
}
} catch (error) {
data.submitLoading = false;
notificationError(t('发起流程'), t('发起流程失败'));
}
async function approvalCreate() {
const params = await getApproveParams();
let fileFolderIds = getUploadFileFolderIds(mainFormModels.value);
let system = formInformation.value.getSystemType();
const nextNodes = await postGetNextTaskMaybeArrival(params);
opinionDlg.value.toggleDialog({
action: 'agree',
nextNodes,
callback: (args) => {
approvalData.approvedContent = args.opinion;
approvalData.nextTaskUser = args.nextTaskUser;
onFinish({});
}
});
}
function flowSuccess() {
opinionDlg.value.toggleDialog({
isClose: true
});
message.success('操作成功');
setTimeout(() => {
close();
}, 500);
}
function flowFail() {
opinionDlg.value.stopLoading();
}
async function onFinish(values) {
try {
if (/*validateSuccess.value*/ true) {
let params = await getApproveParams();
await postApproval(params);
flowSuccess();
data.submitLoading = false;
}
} catch (error) {
flowFail();
}
}
async function getApproveParams() {
let formModels = mainFormModels.value;
let system = formInformation.value.getSystemType();
let fileFolderIds = getUploadFileFolderIds(formModels);
return {
approvedType: approvalData.approvedType,
approvedResult: approvalData.approvedResult, // approvalData.approvedType 审批结果 如果为 4 就需要传buttonCode
approvedContent: approvalData.approvedContent,
formData: formModels,
rejectNodeActivityId: approvalData.rejectNodeActivityId,
taskId: taskId.value,
fileFolderIds,
circulateConfigs: approvalData.circulateConfigs,
/*stampId: values.stampId,
stampPassword: values.password,*/
isOldSystem: system,
nextTaskUser: approvalData.nextTaskUser
};
}
function getUploadFileFolderIds(formModels) {
let fileFolderIds = [];
let uploadComponentIds = formInformation.value.getUploadComponentIds();
uploadComponentIds.forEach((ids) => {
if (ids.includes(separator)) {
let arr = ids.split(separator);
if (arr.length == 2 && formModels[arr[0]][arr[1]]) {
fileFolderIds.push(formModels[arr[0]][arr[1]]);
} else if (arr.length == 3 && formModels[arr[0]][arr[1]] && Array.isArray(formModels[arr[0]][arr[1]])) {
formModels[arr[0]][arr[1]].forEach((o) => {
fileFolderIds.push(o[arr[2]]);
async function saveLaunch() {
data.submitLoading = true;
try {
let validateForms = await formInformation.value.validateForm();
let system = formInformation.value.getSystemType();
if (validateForms.length > 0) {
let successValidate = validateForms.filter((ele) => {
return ele.validate;
});
if (successValidate.length == validateForms.length) {
mainFormModels.value = await formInformation.value.getFormModels();
let relationTasks = [];
if (data.predecessorTasks && data.predecessorTasks.length > 0) {
relationTasks = data.predecessorTasks.map((ele) => {
return { taskId: ele.taskId, schemaId: ele.schemaId };
});
}
let fileFolderIds = getUploadFileFolderIds(mainFormModels.value);
//如果传入了processId 代表是重新发起流程
let res;
res = await postLaunch(rSchemaId, mainFormModels.value, relationTasks, fileFolderIds, system);
// 下一节点审批人
let taskList = [];
if (res && res.length > 0) {
taskId.value = res[0].taskId
taskList = res
.filter((ele) => {
return ele.isMultiInstance == false && ele.isAppoint == true;
})
.map((ele) => {
return {
taskId: ele.taskId,
taskName: ele.taskName,
provisionalApprover: ele.provisionalApprover,
selectIds: []
};
});
if (taskList.length > 0) {
notificationError('提交失败', '流程设计错误,开始后的第一个节点必须是审批人为发起人的起草节点。');
data.submitLoading = false;
} else {
createFlowSuccess(taskList);
}
} else {
createFlowSuccess();
}
} else {
data.submitLoading = false;
notificationError(t('发起流程'), t('表单校验未通过'));
}
});
return fileFolderIds;
}
} catch (error) {
data.submitLoading = false;
notificationError(t('发起流程'), t('发起流程失败'));
}
}
function getUploadFileFolderIds(formModels) {
let fileFolderIds = [];
let uploadComponentIds = formInformation.value.getUploadComponentIds();
uploadComponentIds.forEach((ids) => {
if (ids.includes(separator)) {
let arr = ids.split(separator);
if (arr.length == 2 && formModels[arr[0]][arr[1]]) {
fileFolderIds.push(formModels[arr[0]][arr[1]]);
} else if (arr.length == 3 && formModels[arr[0]][arr[1]] && Array.isArray(formModels[arr[0]][arr[1]])) {
formModels[arr[0]][arr[1]].forEach((o) => {
fileFolderIds.push(o[arr[2]]);
});
}
}
});
return fileFolderIds;
}
</script>
<style lang="less"></style>

View File

@ -1,169 +1,170 @@
<template>
<PageLayout :layoutClass="currentRoute.path == '/workflow/launch' ? '!p-2' : currentRoute.path == '/task/processtasks' ? '!p-0 !pr-7px' : ''" :searchConfig="searchConfig" :title="t('流程模板列表')" @search="search" @scroll-height="scrollHeight">
<PageLayout
:layoutClass="currentRoute.path == '/workflow/launch' ? '!p-2' : currentRoute.path == '/task/processtasks' ? '!p-0 !pr-7px' : ''"
:searchConfig="searchConfig" :title="t('流程模板列表')" @search="search" @scroll-height="scrollHeight">
<template #left>
<BasicTree :clickRowToExpand="true" :fieldNames="{ key: 'id', title: 'name' }" :title="t('流程模板分类')" :treeData="data.treeData" search @select="handleSelect" />
<BasicTree :clickRowToExpand="true" :fieldNames="{ key: 'id', title: 'name' }" :title="t('流程模板分类')"
:treeData="data.treeData" search @select="handleSelect" />
</template>
<template #search></template>
<template #right>
<div v-if="data.list.length > 0" :style="{ overflowY: 'auto', height: tableOptions.scrollHeight + 30 + 'px' }">
<div v-if="data.list.length > 0"
:style="{ overflowY: 'auto', height: tableOptions.scrollHeight + 30 + 'px' }">
<div class="list-page-box">
<TemplateCard v-for="(item, index) in data.list" :key="index" :item="item" @click="launchProcessInTab(item.id)" />
<TemplateCard v-for="(item, index) in data.list" :key="index" :item="item"
@click="launchProcessInTab(item.id)" />
</div>
<div class="page-box">
<a-pagination
v-model:current="data.pagination.current"
v-model:pageSize="data.pagination.pageSize"
<a-pagination v-model:current="data.pagination.current" v-model:pageSize="data.pagination.pageSize"
:pageSizeOptions="['18', '36', '54', '72']"
:show-total="(total) => t(`共 {total} 条数据`, { total })"
:showSizeChanger="true"
:total="data.pagination.total"
@change="getList"
/>
:show-total="(total) => t(`共 {total} 条数据`, { total })" :showSizeChanger="true"
:total="data.pagination.total" @change="getList" />
</div>
</div>
<div v-else>
<EmptyBox />
</div>
<LaunchProcess v-if="visibleLaunchProcess" :schemaId="data.schemaId" @close="visibleLaunchProcess = false" />
<LaunchProcess v-if="visibleLaunchProcess" :schemaId="data.schemaId"
@close="visibleLaunchProcess = false" />
</template>
</PageLayout>
</template>
<script lang="ts" setup>
import { onMounted, reactive, ref, unref, watch } from 'vue';
import TemplateCard from '/@bpmn/components/card/TemplateCard.vue';
import { EmptyBox } from '/@/components/ModalPanel/index';
import { getDesignPage } from '/@/api/workflow/design';
import { WorkflowPageModel } from '/@/api/workflow/model';
import { getDicDetailList } from '/@/api/system/dic';
import { BasicTree, TreeItem } from '/@/components/Tree';
import { PageLayout } from '/@/components/ModalPanel';
import LaunchProcess from './components/LaunchProcess.vue';
import { FlowCategory } from '/@/enums/workflowEnum';
import userTableScrollHeight from '/@/hooks/setting/userTableScrollHeight';
import { useRouter } from 'vue-router';
import { useI18n } from '/@/hooks/web/useI18n';
import { onMounted, reactive, ref, unref, watch } from 'vue';
import TemplateCard from '/@bpmn/components/card/TemplateCard.vue';
import { EmptyBox } from '/@/components/ModalPanel/index';
import { getDesignPage } from '/@/api/workflow/design';
import { WorkflowPageModel } from '/@/api/workflow/model';
import { getDicDetailList } from '/@/api/system/dic';
import { BasicTree, TreeItem } from '/@/components/Tree';
import { PageLayout } from '/@/components/ModalPanel';
import LaunchProcess from './components/LaunchProcess.vue';
import { FlowCategory } from '/@/enums/workflowEnum';
import userTableScrollHeight from '/@/hooks/setting/userTableScrollHeight';
import { useRouter } from 'vue-router';
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n();
const router = useRouter();
const { currentRoute } = router;
const searchConfig = [
{
field: 'code',
label: t('模板编码'),
type: 'input'
},
{
field: 'name',
label: t('模板名称'),
type: 'input'
}
];
const { tableOptions, scrollHeight } = userTableScrollHeight();
let visibleLaunchProcess = ref(false);
let data: {
list: Array<WorkflowPageModel>;
treeData: Array<TreeItem>;
schemaId: string;
selectDeptId: string;
pagination: { current: number; total: number; pageSize: number };
} = reactive({
list: [],
treeData: [],
schemaId: '',
selectDeptId: '',
pagination: {
current: 1,
total: 0,
pageSize: 18
}
const { t } = useI18n();
const router = useRouter();
const { currentRoute } = router;
const searchConfig = [
{
field: 'code',
label: t('模板编码'),
type: 'input'
},
{
field: 'name',
label: t('模板名称'),
type: 'input'
}
];
const { tableOptions, scrollHeight } = userTableScrollHeight();
let visibleLaunchProcess = ref(false);
let data: {
list: Array<WorkflowPageModel>;
treeData: Array<TreeItem>;
schemaId: string;
selectDeptId: string;
pagination: { current: number; total: number; pageSize: number };
} = reactive({
list: [],
treeData: [],
schemaId: '',
selectDeptId: '',
pagination: {
current: 1,
total: 0,
pageSize: 18
}
});
watch(
() => unref(currentRoute),
(val) => {
if (val.path == '/workflow/launch') init();
},
{ deep: true }
);
onMounted(() => {
getCategoryTree();
init();
});
async function init() {
data.pagination.current = 1;
data.pagination.total = 0;
data.selectDeptId = '';
await getList();
}
async function getCategoryTree() {
let res = (await getDicDetailList({
itemId: FlowCategory.ID
})) as unknown as TreeItem[];
data.treeData = res.map((ele) => {
ele.icon = 'ant-design:tags-outlined';
return ele;
});
}
watch(
() => unref(currentRoute),
(val) => {
if (val.path == '/workflow/launch') init();
async function getList(params?: any) {
const searchParams = {
...{
limit: data.pagination.current,
size: data.pagination.pageSize
},
{ deep: true }
);
onMounted(() => {
getCategoryTree();
init();
...{ category: data.selectDeptId },
...params,
...{ enabledMark: 1 } // 流程发起list 需要隐藏 禁用的模板[enabledMark=1]
};
try {
let res = await getDesignPage(searchParams);
data.pagination.total = res.total;
data.list = res.list;
} catch (error) { }
}
function handleSelect(deptIds) {
data.selectDeptId = deptIds[0];
getList();
}
async function launchProcess(id: string) {
// 旧版弹窗界面 便于调试
data.schemaId = id;
visibleLaunchProcess.value = true;
}
function launchProcessInTab(id: string) {
router.push({
path: `/flow/${id}/0/createFlow`
});
}
async function init() {
data.pagination.current = 1;
data.pagination.total = 0;
data.selectDeptId = '';
await getList();
}
async function getCategoryTree() {
let res = (await getDicDetailList({
itemId: FlowCategory.ID
})) as unknown as TreeItem[];
data.treeData = res.map((ele) => {
ele.icon = 'ant-design:tags-outlined';
return ele;
});
}
async function getList(params?: any) {
const searchParams = {
...{
limit: data.pagination.current,
size: data.pagination.pageSize
},
...{ category: data.selectDeptId },
...params,
...{ enabledMark: 1 } // 流程发起list 需要隐藏 禁用的模板[enabledMark=1]
};
try {
let res = await getDesignPage(searchParams);
data.pagination.total = res.total;
data.list = res.list;
} catch (error) {}
}
function handleSelect(deptIds) {
data.selectDeptId = deptIds[0];
getList();
}
async function launchProcess(id: string) {
// 旧版弹窗界面 便于调试
data.schemaId = id;
visibleLaunchProcess.value = true;
}
function launchProcessInTab(id: string) {
router.push({
path: `/flow/${id}/0/createFlow`
});
}
function search(params: any) {
data.pagination.current = 1;
getList(params);
}
function search(params: any) {
data.pagination.current = 1;
getList(params);
}
</script>
<style lang="less" scoped>
.list-page-box {
display: flex;
flex-wrap: wrap;
}
.list-page-box {
display: flex;
flex-wrap: wrap;
}
:deep(.list-item) {
max-width: 320px;
}
:deep(.list-item) {
max-width: 320px;
}
.page-box {
position: absolute;
bottom: 20px;
right: 20px;
}
.page-box {
position: absolute;
bottom: 20px;
right: 20px;
}
</style>

View File

@ -4,122 +4,124 @@
<TableAction :actions="tableActions(record)" />
</template>
</BasicTable>
<LaunchProcess v-if="processData.visible" :draftsId="processData.draftsId" :draftsJsonStr="processData.draftsJsonStr" :schemaId="processData.schemaId" @close="processData.visible = false" />
<LaunchProcess v-if="processData.visible" :draftsId="processData.draftsId"
:draftsJsonStr="processData.draftsJsonStr" :schemaId="processData.schemaId"
@close="processData.visible = false" />
</template>
<script setup>
import userTaskTable from './../../hooks/userTaskTable';
import userTaskTable from './../../hooks/userTaskTable';
import LaunchProcess from './../LaunchProcess.vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { deleteDraft, getDraftInfo, getSchemaTask } from '/@/api/workflow/process';
import { reactive } from 'vue';
import { notification } from 'ant-design-vue';
import { TaskTypeUrl } from '/@/enums/workflowEnum';
import { useI18n } from '/@/hooks/web/useI18n';
import { useRouter } from 'vue-router';
import LaunchProcess from './../LaunchProcess.vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { deleteDraft, getDraftInfo, getSchemaTask } from '/@/api/workflow/process';
import { reactive } from 'vue';
import { notification } from 'ant-design-vue';
import { TaskTypeUrl } from '/@/enums/workflowEnum';
import { useI18n } from '/@/hooks/web/useI18n';
import { useRouter } from 'vue-router';
const { t } = useI18n();
const router = useRouter();
const configColumns = [
const { t } = useI18n();
const router = useRouter();
const configColumns = [
{
title: t('流程名称'),
dataIndex: 'schemaName',
align: 'left'
},
{
title: t('发起者'),
dataIndex: 'originator',
sorter: true,
align: 'left'
},
{
title: t('发起时间'),
dataIndex: 'createDate',
align: 'left'
}
];
const processData = reactive({
visible: false,
schemaId: '',
draftsJsonStr: '',
draftsId: ''
});
const { formConfig } = userTaskTable();
const [registerTable, { reload }] = useTable({
title: t('草稿箱列表'),
api: getSchemaTask,
rowKey: 'id',
columns: configColumns,
formConfig: formConfig('Drafts'),
beforeFetch: (params) => {
return { data: params, taskUrl: TaskTypeUrl.DRAFT };
},
useSearchForm: true,
showTableSetting: true,
striped: false,
pagination: {
pageSize: 18
},
actionColumn: {
width: 80,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
fixed: undefined
}
});
function tableActions(record) {
return [
{
title: t('流程名称'),
dataIndex: 'schemaName',
align: 'left'
icon: 'clarity:note-edit-line',
onClick: handleEdit.bind(null, record)
},
{
title: t('发起者'),
dataIndex: 'originator',
sorter: true,
align: 'left'
},
{
title: t('发起时间'),
dataIndex: 'createDate',
align: 'left'
icon: 'ant-design:delete-outlined',
color: 'error',
popConfirm: {
title: t('是否确认删除'),
confirm: handleDelete.bind(null, record)
}
}
];
const processData = reactive({
visible: false,
schemaId: '',
draftsJsonStr: '',
draftsId: ''
});
const { formConfig } = userTaskTable();
const [registerTable, { reload }] = useTable({
title: t('草稿箱列表'),
api: getSchemaTask,
rowKey: 'id',
columns: configColumns,
formConfig: formConfig('Drafts'),
beforeFetch: (params) => {
return { data: params, taskUrl: TaskTypeUrl.DRAFT };
},
useSearchForm: true,
showTableSetting: true,
striped: false,
pagination: {
pageSize: 18
},
actionColumn: {
width: 80,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
fixed: undefined
}
});
}
function tableActions(record) {
return [
{
icon: 'clarity:note-edit-line',
onClick: handleEdit.bind(null, record)
},
{
icon: 'ant-design:delete-outlined',
color: 'error',
popConfirm: {
title: t('是否确认删除'),
confirm: handleDelete.bind(null, record)
}
}
];
}
async function handleEdit(record) {
try {
let res = await getDraftInfo(record.id);
/*processData.draftsId = record.id;
processData.schemaId = res.schemaId;
processData.draftsJsonStr = res.formData;
processData.visible = true;*/
localStorage.setItem('draftsJsonStr', res.formData);
router.push({
path: `/flow/${res.schemaId}/${record.id}/createFlow`
});
} catch (error) { }
}
async function handleEdit(record) {
try {
let res = await getDraftInfo(record.id);
/*processData.draftsId = record.id;
processData.schemaId = res.schemaId;
processData.draftsJsonStr = res.formData;
processData.visible = true;*/
localStorage.setItem('draftsJsonStr', res.formData);
router.push({
path: `/flow/${res.schemaId}/${record.id}/createFlow`
async function handleDelete(record) {
try {
let res = await deleteDraft([record.id]);
if (res) {
notification.open({
type: 'success',
message: t('删除'),
description: t('删除成功')
});
} catch (error) {}
}
async function handleDelete(record) {
try {
let res = await deleteDraft([record.id]);
if (res) {
notification.open({
type: 'success',
message: t('删除'),
description: t('删除成功')
});
reload();
} else {
notification.open({
type: 'error',
message: t('删除'),
description: t('删除失败')
});
}
} catch (error) {}
}
reload();
} else {
notification.open({
type: 'error',
message: t('删除'),
description: t('删除失败')
});
}
} catch (error) { }
}
</script>
<style scoped></style>

View File

@ -114,6 +114,15 @@
});
const router = useRouter();
const { currentRoute } = router;
onMounted(() => {
bus.on(FLOW_PROCESSED, onFlowProcessed);
});
onUnmounted(() => {
bus.off(FLOW_PROCESSED, onFlowProcessed);
});
watch(
() => unref(currentRoute),
(val) => {
@ -134,14 +143,6 @@
function onFlowProcessed() {
reload();
}
onMounted(() => {
bus.on(FLOW_PROCESSED, onFlowProcessed);
});
onUnmounted(() => {
bus.off(FLOW_PROCESSED, onFlowProcessed);
});
</script>
<style scoped></style>