yxk-20260421-通用发起流程组件
This commit is contained in:
@@ -0,0 +1,146 @@
|
|||||||
|
<template>
|
||||||
|
<j-modal
|
||||||
|
:title="title"
|
||||||
|
:width="720"
|
||||||
|
:visible="visible"
|
||||||
|
@ok="handleOk"
|
||||||
|
@cancel="handleCancel"
|
||||||
|
cancelText="Cancel"
|
||||||
|
>
|
||||||
|
<a-form :model="formData" :label-col="{ style: { width: '120px' } }" :wrapper-col="{ span: 16 }">
|
||||||
|
<a-form-item label="Mode">
|
||||||
|
<a-radio-group v-model:value="formData.triggerMode">
|
||||||
|
<a-radio value="immediate">Immediate</a-radio>
|
||||||
|
<a-radio value="recurring">Recurring</a-radio>
|
||||||
|
</a-radio-group>
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<template v-if="formData.triggerMode === 'recurring'">
|
||||||
|
<a-form-item label="Interval Type">
|
||||||
|
<JDictSelectTag
|
||||||
|
v-model:value="formData.intervalType"
|
||||||
|
dictCode="sup_interval_type"
|
||||||
|
placeholder="Select interval type"
|
||||||
|
:getPopupContainer="(node) => node?.parentNode"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item label="Repeat Count">
|
||||||
|
<a-input-number
|
||||||
|
v-model:value="formData.startCount"
|
||||||
|
:min="1"
|
||||||
|
:precision="0"
|
||||||
|
placeholder="Input repeat count"
|
||||||
|
style="width: 100%"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item label="Start Time">
|
||||||
|
<a-date-picker
|
||||||
|
v-model:value="formData.intervalStartTime"
|
||||||
|
show-time
|
||||||
|
valueFormat="YYYY-MM-DD HH:mm:ss"
|
||||||
|
placeholder="Select start time"
|
||||||
|
style="width: 100%"
|
||||||
|
:getPopupContainer="(node) => node?.parentNode"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</template>
|
||||||
|
</a-form>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<a-button @click="handleCancel">Cancel</a-button>
|
||||||
|
<a-button type="primary" @click="handleOk">OK</a-button>
|
||||||
|
</template>
|
||||||
|
</j-modal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { reactive, ref } from 'vue';
|
||||||
|
import JModal from '/src/components/Modal/src/JModal/JModal.vue';
|
||||||
|
import JDictSelectTag from '/src/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||||
|
import { useMessage } from '/src/hooks/web/useMessage';
|
||||||
|
|
||||||
|
interface ModalPayload {
|
||||||
|
title?: string;
|
||||||
|
payload?: Record<string, any>;
|
||||||
|
initialValues?: Record<string, any>;
|
||||||
|
}
|
||||||
|
|
||||||
|
const emit = defineEmits(['confirm']);
|
||||||
|
const { createMessage } = useMessage();
|
||||||
|
|
||||||
|
const title = ref('Start Process');
|
||||||
|
const visible = ref(false);
|
||||||
|
const contextData = ref<Record<string, any>>({});
|
||||||
|
const formData = reactive({
|
||||||
|
triggerMode: 'immediate',
|
||||||
|
intervalType: undefined as number | string | undefined,
|
||||||
|
startCount: undefined as number | undefined,
|
||||||
|
intervalStartTime: undefined as string | undefined,
|
||||||
|
});
|
||||||
|
|
||||||
|
function resetForm() {
|
||||||
|
formData.triggerMode = 'immediate';
|
||||||
|
formData.intervalType = undefined;
|
||||||
|
formData.startCount = undefined;
|
||||||
|
formData.intervalStartTime = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
function open(data: ModalPayload = {}) {
|
||||||
|
resetForm();
|
||||||
|
title.value = data.title || 'Start Process';
|
||||||
|
contextData.value = data.payload || {};
|
||||||
|
visible.value = true;
|
||||||
|
|
||||||
|
const initialValues = data.initialValues || {};
|
||||||
|
if (initialValues.triggerType === 1) {
|
||||||
|
formData.triggerMode = 'recurring';
|
||||||
|
}
|
||||||
|
if (initialValues.intervalType !== undefined && initialValues.intervalType !== null && initialValues.intervalType !== '') {
|
||||||
|
formData.intervalType = initialValues.intervalType;
|
||||||
|
}
|
||||||
|
if (initialValues.startCount !== undefined && initialValues.startCount !== null && initialValues.startCount !== '') {
|
||||||
|
formData.startCount = Number(initialValues.startCount);
|
||||||
|
}
|
||||||
|
if (initialValues.intervalStartTime) {
|
||||||
|
formData.intervalStartTime = initialValues.intervalStartTime;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleCancel() {
|
||||||
|
visible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleOk() {
|
||||||
|
if (formData.triggerMode === 'recurring') {
|
||||||
|
if (!formData.intervalType) {
|
||||||
|
createMessage.warning('Please select interval type');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!formData.startCount) {
|
||||||
|
createMessage.warning('Please input repeat count');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!formData.intervalStartTime) {
|
||||||
|
createMessage.warning('Please select start time');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
emit('confirm', {
|
||||||
|
payload: contextData.value,
|
||||||
|
options: {
|
||||||
|
triggerType: formData.triggerMode === 'recurring' ? 2 : 1,
|
||||||
|
intervalType: formData.triggerMode === 'recurring' ? Number(formData.intervalType) : undefined,
|
||||||
|
startCount: formData.triggerMode === 'recurring' ? Number(formData.startCount) : undefined,
|
||||||
|
intervalStartTime: formData.triggerMode === 'recurring' ? formData.intervalStartTime : undefined,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
handleCancel();
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
open,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
@@ -51,36 +51,36 @@
|
|||||||
<BgPartymatterModal ref="registerModal" @success="handleSuccess" />
|
<BgPartymatterModal ref="registerModal" @success="handleSuccess" />
|
||||||
<!-- 审批记录 -->
|
<!-- 审批记录 -->
|
||||||
<BpmPictureModal @register="registerBpmModal" />
|
<BpmPictureModal @register="registerBpmModal" />
|
||||||
|
<FlowScheduleStartModal ref="flowScheduleModalRef" @confirm="handleFlowScheduleConfirm" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" name="bgpartymatter-bgPartymatter" setup>
|
<script lang="ts" name="bgpartymatter-bgPartymatter" setup>
|
||||||
import { ref, reactive, computed, unref, provide } from 'vue';
|
import { ref, reactive, computed, unref, provide } from 'vue';
|
||||||
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
import { BasicTable, TableAction } from '/@/components/Table';
|
||||||
import { useListPage } from '/@/hooks/system/useListPage'
|
import { useListPage } from '/@/hooks/system/useListPage';
|
||||||
import {useModal} from '/@/components/Modal';
|
import { useModal } from '/@/components/Modal';
|
||||||
import { dateUtil } from '/@/utils/dateUtil';
|
import { dateUtil } from '/@/utils/dateUtil';
|
||||||
import BgPartymatterModal from './components/BgPartymatterModal.vue'
|
|
||||||
import { columns, superQuerySchema } from './BgPartymatter.data';
|
|
||||||
import { list, deleteOne, batchDelete, getImportUrl,getExportUrl } from './BgPartymatter.api';
|
|
||||||
import { downloadFile } from '/@/utils/common/renderUtils';
|
|
||||||
import { useMessage } from '/@/hooks/web/useMessage';
|
import { useMessage } from '/@/hooks/web/useMessage';
|
||||||
import JSwitch from '/@/components/Form/src/jeecg/components/JSwitch.vue';
|
import { startProcessSchedules } from '/@/api/common/api';
|
||||||
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
|
import BgPartymatterModal from './components/BgPartymatterModal.vue';
|
||||||
import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
|
import BgPartymatterFeedbackList from './BgPartymatterFeedbackList.vue';
|
||||||
|
import FlowScheduleStartModal from '/src/components/semri/process/FlowScheduleStartModal.vue';
|
||||||
|
import { columns, superQuerySchema } from './BgPartymatter.data';
|
||||||
|
import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './BgPartymatter.api';
|
||||||
|
|
||||||
|
const FLOW_CODE = 'dev_task_task_001';
|
||||||
|
const BUSINESS_TABLE_NAME = 'bg_partymatter';
|
||||||
|
const FORM_URL = 'bgpartymatter/components/BgPartymatterForm';
|
||||||
|
|
||||||
const [registerBpmModal, { openModal: bpmPicModal }] = useModal();
|
const [registerBpmModal, { openModal: bpmPicModal }] = useModal();
|
||||||
import BgPartymatterFeedbackList from './BgPartymatterFeedbackList.vue'
|
|
||||||
import { useUserStore } from '/@/store/modules/user';
|
|
||||||
import {startProcessSchedules} from "@/api/common/api";
|
|
||||||
const formRef = ref();
|
const formRef = ref();
|
||||||
const queryParam = reactive<any>({});
|
|
||||||
const checkedKeys = ref<Array<string | number>>([]);
|
|
||||||
const registerModal = ref();
|
const registerModal = ref();
|
||||||
const userStore = useUserStore();
|
const flowScheduleModalRef = ref();
|
||||||
|
const queryParam = reactive<any>({});
|
||||||
const { createMessage } = useMessage();
|
const { createMessage } = useMessage();
|
||||||
//注册table数据
|
//注册table数据
|
||||||
const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
|
const { tableContext, onExportXls, onImportXls } = useListPage({
|
||||||
tableProps:{
|
tableProps:{
|
||||||
title: '党委会',
|
title: '党委会',
|
||||||
api: list,
|
api: list,
|
||||||
@@ -212,56 +212,66 @@
|
|||||||
ifShow: !!record.bpmStatus && record.bpmStatus !== '1',
|
ifShow: !!record.bpmStatus && record.bpmStatus !== '1',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
if(record.bpmStatus == '1' || !record.bpmStatus){
|
|
||||||
|
if (record.bpmStatus == '1' || !record.bpmStatus) {
|
||||||
dropDownAction.push({
|
dropDownAction.push({
|
||||||
label: '发起流程',
|
label: '发起流程',
|
||||||
popConfirm: {
|
onClick: handleProcess.bind(null, record),
|
||||||
title: '确认提交流程吗?',
|
});
|
||||||
confirm: handleProcess.bind(null, record),
|
|
||||||
placement: 'topLeft',
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return dropDownAction;
|
return dropDownAction;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
function handleProcess(record) {
|
||||||
* 提交流程
|
flowScheduleModalRef.value?.open({
|
||||||
*/
|
title: 'Start Flow',
|
||||||
async function handleProcess(record) {
|
payload: { record },
|
||||||
|
initialValues: {
|
||||||
|
triggerType: record.isNeedInterval, //1立即督办,2重复督办
|
||||||
|
intervalType: record.intervalType,
|
||||||
|
startCount: record.startCount,
|
||||||
|
intervalStartTime: record.intervalStartTime ? dateUtil(record.intervalStartTime).format('YYYY-MM-DD HH:mm:ss') : undefined,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleFlowScheduleConfirm({ payload, options }) {
|
||||||
|
const record = payload?.record || {};
|
||||||
const formatDate = (value, format) => {
|
const formatDate = (value, format) => {
|
||||||
return value ? dateUtil(value).format(format) : undefined;
|
return value ? dateUtil(value).format(format) : undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
const params = {
|
const params = {
|
||||||
intervalType: record.intervalType ? Number(record.intervalType) : undefined,
|
intervalType: options.intervalType,
|
||||||
startCount: record.startCount ? Number(record.startCount) : undefined,
|
startCount: options.startCount,
|
||||||
taskTask: {
|
taskTask: {
|
||||||
flowCode: 'dev_task_task_001',
|
flowCode: FLOW_CODE,
|
||||||
triggerType: record.isNeedInterval, //1立即督办,2重复督办
|
triggerType: options.triggerType,
|
||||||
businessId: record.id,
|
businessId: record.id,
|
||||||
businessTablename: 'bg_partymatter',
|
businessTablename: BUSINESS_TABLE_NAME,
|
||||||
title: record.title,
|
title: record.title,
|
||||||
content: record.content,
|
content: record.content,
|
||||||
urgencyLevel: record.urgencyLevel,
|
urgencyLevel: record.urgencyLevel,
|
||||||
deptId: record.responDeptid,
|
deptId: record.responDeptid,
|
||||||
requireFinishDate: formatDate(record.deadline, 'YYYY-MM-DD'),
|
requireFinishDate: formatDate(record.deadline, 'YYYY-MM-DD'),
|
||||||
startTime: formatDate(record.intervalStartTime, 'YYYY-MM-DD HH:mm:ss'),
|
startTime: options.intervalStartTime,
|
||||||
deadline: formatDate(record.deadline, 'YYYY-MM-DD HH:mm:ss'),
|
deadline: formatDate(record.deadline, 'YYYY-MM-DD HH:mm:ss'),
|
||||||
formUrl: 'bgpartymatter/components/BgPartymatterForm',
|
formUrl: FORM_URL,
|
||||||
},
|
},
|
||||||
}
|
};
|
||||||
|
|
||||||
await startProcessSchedules(params);
|
await startProcessSchedules(params);
|
||||||
|
createMessage.success('流程发起成功');
|
||||||
handleSuccess();
|
handleSuccess();
|
||||||
}
|
}
|
||||||
/**
|
|
||||||
* 审批进度
|
async function handlePreviewPic(record) {
|
||||||
*/
|
bpmPicModal(true, {
|
||||||
async function handlePreviewPic(record) {
|
flowCode: FLOW_CODE,
|
||||||
bpmPicModal(true, {
|
dataId: record.id,
|
||||||
flowCode: 'dev_bg_partymatter_001',
|
});
|
||||||
dataId: record.id,
|
}
|
||||||
});
|
|
||||||
}
|
|
||||||
/* ----------------------以下为原生查询需要添加的-------------------------- */
|
/* ----------------------以下为原生查询需要添加的-------------------------- */
|
||||||
const toggleSearchStatus = ref<boolean>(false);
|
const toggleSearchStatus = ref<boolean>(false);
|
||||||
const labelCol = reactive({
|
const labelCol = reactive({
|
||||||
@@ -297,6 +307,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.jeecg-basic-table-form-container {
|
.jeecg-basic-table-form-container {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user