geg-gas/geg-gas-web
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: lint格式化文件

Browse Source
This commit is contained in:
t-aonan.gu
2025-10-21 18:04:02 +08:00
parent f9ca969fec
commit 7629120548
1092 changed files with 148218 additions and 157907 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/views/secondDev/FormInformation.vue
View File

@ -226,7 +226,7 @@
async function saveDraftData() {
try {
let formModes = {};
let formModes = {};
for (let index = 0; index < forms.configs.length; index++) {
const ele = forms.configs[index];
@ -239,10 +239,9 @@
}
return formModes;
} catch (e) {
console.error(e)
console.error(e);
throw new Error(e);
}
}
async function getFormModels(saveRowKey) {
@ -252,8 +251,8 @@
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
let values = await itemRefs.value[index].workflowSubmit(saveRowKey);
if(!values) {
return
if (!values) {
return;
}
formModes[ele.formKey] = values;
} else {
@ -270,7 +269,7 @@
});
return formModes;
} catch (e) {
console.error(e)
console.error(e);
throw new Error(e);
}
}
@ -290,7 +289,7 @@
for (let index = 0; index < forms.configs.length; index++) {
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
itemRefs.value[index].handleInnerFun(funcName)
itemRefs.value[index].handleInnerFun(funcName);
}
}
}

13
src/views/secondDev/Login.vue
View File

@ -9,7 +9,7 @@
</div>
</div>
</div>
<div style="width: 100%; height: 300px; display: flex;justify-content: center;align-items: center;" v-else>
<div style="width: 100%; height: 300px; display: flex; justify-content: center; align-items: center" v-else>
<a-spin />
</div>
</template>
@ -29,7 +29,7 @@
const { currentRoute } = useRouter();
const userStore = useUserStore();
const isSingleLogin = ref(false)
const isSingleLogin = ref(false);
const { notification } = useMessage();
const { t } = useI18n();
@ -37,9 +37,9 @@
onMounted(async () => {
const fullPath = currentRoute.value.fullPath;
if (currentRoute.value.query?.ltpasToken) {
isSingleLogin.value = true
let targetURL = ''
let redirect = ''
isSingleLogin.value = true;
let targetURL = '';
let redirect = '';
if (fullPath.includes('targetURL')) {
const list = fullPath.split('targetURL=');
targetURL = list[1];
@ -48,10 +48,9 @@
redirect = list[1];
}
let params = {...currentRoute.value.query, targetURL: targetURL,redirect: redirect, mode: 'none'}; //不要默认的错误提示
let params = { ...currentRoute.value.query, targetURL: targetURL, redirect: redirect, mode: 'none' }; //不要默认的错误提示
await userStore.singleLogin(params);
}
});
const appStore = useAppStore();

168
src/views/secondDev/LoginForm.vue
View File

@ -1,66 +1,56 @@
<template>
<Form v-show="getShow" ref="formRef" :model="formData" :rules="getFormRules" class="p-4 enter-x form-box" @keypress.enter="handleLogin">
<div>
<FormItem class="enter-x" name="account" v-if="loginType =='pw'">
<FormItem class="enter-x" name="account" v-if="loginType == 'pw'">
<label class="form-title"> {{ t('账号') }}</label>
<Input v-model:value="formData.account" :placeholder="t('账号')" class="fix-auto-fill" size="large" style="height: 58px;" @blur="handleBlur">
<Input v-model:value="formData.account" :placeholder="t('账号')" class="fix-auto-fill" size="large" style="height: 58px" @blur="handleBlur">
<template #prefix>
<IconFontSymbol class="user-icon" icon="yonghu-xianxing" />
</template>
</Input>
</FormItem>
<FormItem class="enter-x" name="password" v-if="loginType =='pw'">
<FormItem class="enter-x" name="password" v-if="loginType == 'pw'">
<label class="form-title"> {{ t('密码') }}</label>
<InputPassword v-model:value="formData.password" :placeholder="t('密码')" size="large" style="height: 58px;" visibilityToggle>
<InputPassword v-model:value="formData.password" :placeholder="t('密码')" size="large" style="height: 58px" visibilityToggle>
<template #prefix>
<IconFontSymbol class="user-icon" icon="mima" />
</template>
</InputPassword>
</FormItem>
<FormItem class="enter-x" name="captchaCode" v-if="loginType =='pw' && loginUseType == 'captcha'">
<FormItem class="enter-x" name="captchaCode" v-if="loginType == 'pw' && loginUseType == 'captcha'">
<label class="form-title"> {{ t('图形验证码') }}</label>
<Input v-model:value="formData.captchaCode" :placeholder="t('图形验证码')" class="fix-auto-fill pic-code" size="large" style="height: 58px; flex: 1; min-width: auto;" visibilityToggle>
<Input v-model:value="formData.captchaCode" :placeholder="t('图形验证码')" class="fix-auto-fill pic-code" size="large" style="height: 58px; flex: 1; min-width: auto" visibilityToggle>
<template #prefix>
<PictureOutlined :style="{fontSize: '25px', color: '#717c91'}"/>
<PictureOutlined :style="{ fontSize: '25px', color: '#717c91' }" />
</template>
<template #suffix>
<a-image
:src="captchaImage.imgBase64 || ''"
alt="验证码"
class="captcha-image"
/>
<ReloadOutlined :style="{fontSize: '25px', color: '#717c91'}" @click="refreshCaptcha"/>
<a-image :src="captchaImage.imgBase64 || ''" alt="验证码" class="captcha-image" />
<ReloadOutlined :style="{ fontSize: '25px', color: '#717c91' }" @click="refreshCaptcha" />
</template>
</Input>
</FormItem>
<FormItem v-if="getAppEnvConfig().VITE_GLOB_TENANT_ENABLED && getAppEnvConfig().VITE_GLOB_TENANT_INPUT_REQUIRED!=='false' && loginType =='pw'" name="tenantCode" class="enter-x">
<FormItem v-if="getAppEnvConfig().VITE_GLOB_TENANT_ENABLED && getAppEnvConfig().VITE_GLOB_TENANT_INPUT_REQUIRED !== 'false' && loginType == 'pw'" name="tenantCode" class="enter-x">
<label class="form-title"> {{ t('租户码') }}</label>
<Input
size="large"
visibilityToggle
v-model:value="formData.tenantCode"
:placeholder="t('租户码')"
style="height: 58px; width: 450px;"
>
<Input size="large" visibilityToggle v-model:value="formData.tenantCode" :placeholder="t('租户码')" style="height: 58px; width: 450px">
<template #prefix>
<IconFontSymbol icon="zuzhiguanli" class="user-icon" />
</template>
</Input>
</FormItem>
<FormItem class="enter-x" name="mobile" v-if="loginType =='mobile'">
<FormItem class="enter-x" name="mobile" v-if="loginType == 'mobile'">
<label class="form-title"> {{ t('手机号') }}</label>
<Input v-model:value="formData.mobile" :placeholder="t('手机号')" class="fix-auto-fill" size="large" style="height: 58px;">
<Input v-model:value="formData.mobile" :placeholder="t('手机号')" class="fix-auto-fill" size="large" style="height: 58px">
<template #prefix>
<IconFontSymbol class="user-icon" icon="yonghu-xianxing" />
</template>
</Input>
</FormItem>
<FormItem class="enter-x" name="code" v-if="loginType =='mobile'">
<FormItem class="enter-x" name="code" v-if="loginType == 'mobile'">
<label class="form-title"> {{ t('验证码') }}</label>
<Input v-model:value="formData.code" :placeholder="t('验证码')" class="fix-auto-fill" size="large" style="height: 58px;">
<Input v-model:value="formData.code" :placeholder="t('验证码')" class="fix-auto-fill" size="large" style="height: 58px">
<template #prefix>
<PhoneOutlined :style="{fontSize: '25px', color: '#717c91'}"/>
<PhoneOutlined :style="{ fontSize: '25px', color: '#717c91' }" />
</template>
<template #suffix>
<Button type="link" class="f-16" @click="getLoginCode" size="small" :disabled="codeButtonDisabled">
@ -71,14 +61,14 @@
</FormItem>
<ARow class="enter-x">
<ACol :span="12">
<FormItem v-if="loginType =='pw'">
<FormItem v-if="loginType == 'pw'">
<!-- No logic, you need to deal with it yourself -->
<Checkbox v-model:checked="rememberMe" class="f-16" size="small">
{{ t('记住我') }}
</Checkbox>
</FormItem>
</ACol>
<ACol :span="12" style="text-align: right;">
<ACol :span="12" style="text-align: right">
<FormItem>
<!-- No logic, you need to deal with it yourself -->
<Button type="link" class="f-16" @click="changeLoginType" size="small">
@ -105,28 +95,15 @@
<div class="tip-msg">本平台为非涉密平台，严禁处理、传输国家秘密、工作秘密、商业秘密、敏感信息</div>
</div>
</Form>
<a-modal
v-model:visible="visible"
@ok="handleOk"
@cancel="handleCancel"
:maskClosable="false"
centered
title="请完成下列验证后继续"
width="20%"
cancelText=""
>
<div class="login-modal-content">
<div class="refresh" @click="refreshTodo">
刷新
<Icon :spin="refreshLoading" icon="ant-design:redo-outlined" class="redo-outlined" />
<a-modal v-model:visible="visible" @ok="handleOk" @cancel="handleCancel" :maskClosable="false" centered title="请完成下列验证后继续" width="20%" cancelText="">
<div class="login-modal-content">
<div class="refresh" @click="refreshTodo">
刷新
<Icon :spin="refreshLoading" icon="ant-design:redo-outlined" class="redo-outlined" />
</div>
<a-image :width="200" :src="imgObj.imgBase64 || ''" />
<Input v-model:value="imgCode" :placeholder="t('验证码')" size="large" />
</div>
<a-image
:width="200"
:src="imgObj.imgBase64 || ''"
/>
<Input v-model:value="imgCode" :placeholder="t('验证码')" size="large" />
</div>
</a-modal>
</template>
<script lang="ts" setup>
@ -138,7 +115,7 @@
import { useUserStore } from '/@/store/modules/user';
import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from '/@/views/sys/login/useLogin';
import { getMobileLoginCode, getMobileLoginImg, sendMobileLoginCode, checkAccountCaptchaApi, } from '/@/api/system/login';
import { getMobileLoginCode, getMobileLoginImg, sendMobileLoginCode, checkAccountCaptchaApi } from '/@/api/system/login';
import { useDesign } from '/@/hooks/web/useDesign';
import { Base64 } from 'js-base64';
@ -146,7 +123,7 @@
import { useRouter } from 'vue-router';
import { getAppEnvConfig } from '/@/utils/env';
import Icon from '/@/components/Icon/index';
import { PhoneOutlined, PictureOutlined, ReloadOutlined } from '@ant-design/icons-vue';
const ACol = Col;
@ -167,36 +144,36 @@
// const iframeRef = ref();
const loading = ref(false);
const rememberMe = ref(false);
const loginType = ref('pw')
const loginType = ref('pw');
const loginUseType = ref();
const countdown = ref(60)
const countdown = ref(60);
const visible = ref(false);
const refreshLoading = ref(false);
const imgObj = ref({
imgBase64: ''
})
});
const captchaImage = ref({
imgBase64: ''
})
const imgCode = ref('')
});
const imgCode = ref('');
const formData = reactive({
account: '',
password: '',
mobile: '',
code: '',
tenantCode: 'system',
tenantCode: 'system',
captchaCode: ''
});
const getCodeButtonName = ref('获取验证码')
const codeButtonDisabled = ref(false)
let setCodeInterval = null
const getCodeButtonName = ref('获取验证码');
const codeButtonDisabled = ref(false);
let setCodeInterval = null;
onMounted(async () => {
//如果是第三方登录跳转回来 会携带token
if (currentRoute.value.query.token) {
oauthLogin(currentRoute.value.query.token)
oauthLogin(currentRoute.value.query.token);
}
//如果第三方登录 登录错误 会携带错误信息
if (currentRoute.value.query.error) {
@ -236,16 +213,16 @@
} finally {
loading.value = false;
}
}
};
const changeLoginType = () => {
loginType.value = loginType.value == 'pw' ? 'mobile' : 'pw'
}
loginType.value = loginType.value == 'pw' ? 'mobile' : 'pw';
};
const getLoginCode = async () => {
countdown.value = 60
if(isValidPhoneNumber(formData.mobile)) {
visible.value = true
imgCode.value = ''
onMobileLoginImg()
countdown.value = 60;
if (isValidPhoneNumber(formData.mobile)) {
visible.value = true;
imgCode.value = '';
onMobileLoginImg();
} else {
notification.error({
message: t('手机号有误'),
@ -253,7 +230,7 @@
duration: 3
});
}
}
};
/**
* 账号失焦 请求后台获取业务状态
@ -262,8 +239,8 @@
if (!formData.account) {
return;
}
let checkAccountCaptcha = await checkAccountCaptchaApi({username: formData.account})
if(checkAccountCaptcha == true) {
let checkAccountCaptcha = await checkAccountCaptchaApi({ username: formData.account });
if (checkAccountCaptcha == true) {
loginUseType.value = 'captcha';
// setLoginState(LoginStateEnum.LOGIN_WITH_CAPTCHA)
refreshCaptcha();
@ -274,34 +251,34 @@
}
function refreshTodo() {
refreshLoading.value = true
onMobileLoginImg()
refreshLoading.value = false
refreshLoading.value = true;
onMobileLoginImg();
refreshLoading.value = false;
}
// 图形验证
async function onMobileLoginImg() {
imgObj.value = await getMobileLoginImg({account: formData.mobile})
imgObj.value = await getMobileLoginImg({ account: formData.mobile });
}
// 图形账号验证
async function refreshCaptcha() {
captchaImage.value = await getMobileLoginImg({account: formData.account})
captchaImage.value = await getMobileLoginImg({ account: formData.account });
}
async function handleOk() {
await getMobileLoginCode({captchaCode: imgCode.value ,mobile: formData.mobile})
await getMobileLoginCode({ captchaCode: imgCode.value, mobile: formData.mobile });
setCodeInterval = setInterval(updateCountdown, 1000);
onVisible()
onVisible();
}
function handleCancel() {
onVisible()
onVisible();
}
function onVisible () {
visible.value = false
srcImg.value = ''
function onVisible() {
visible.value = false;
srcImg.value = '';
}
// 更新倒计时显示
@ -309,7 +286,7 @@
if (countdown.value === 0) {
getCodeButtonName.value = '获取验证码';
codeButtonDisabled.value = false;
clearInterval(setCodeInterval)
clearInterval(setCodeInterval);
} else {
countdown.value--;
getCodeButtonName.value = countdown.value + ' 秒后可重发';
@ -318,9 +295,9 @@
}
const isValidPhoneNumber = (phoneNumber) => {
// 中国大陆手机号码正则表达式
const reg = /^1[3|4|5|7|8]\d{9}$/
const reg = /^1[3|4|5|7|8]\d{9}$/;
return reg.test(phoneNumber);
}
};
const { validForm } = useFormValid(formRef);
@ -389,9 +366,9 @@
let params = {
mobile: data.mobile,
code: data.code
}
let res = await sendMobileLoginCode(params)
await oauthLogin(res.token)
};
let res = await sendMobileLoginCode(params);
await oauthLogin(res.token);
} catch (error) {
createErrorModal({
title: t('错误提示'),
@ -402,7 +379,6 @@
loading.value = false;
}
}
}
</script>
<style lang="less" scoped>
@ -488,9 +464,9 @@
// }
</style>
<style lang="less">
.pic-code {
input {
min-width: 0!important;
.pic-code {
input {
min-width: 0 !important;
}
}
}
</style>

35
src/views/secondDev/SingleLogin.vue
View File

@ -1,24 +1,21 @@
<template>
<div style="width: 100%; height: 300px; display: flex;justify-content: center;align-items: center;">
<a-spin />
</div>
<div style="width: 100%; height: 300px; display: flex; justify-content: center; align-items: center">
<a-spin />
</div>
</template>
<script lang="ts" setup>
import { useUserStore } from '/@/store/modules/user';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';
const { currentRoute } = useRouter();
const userStore = useUserStore();
onMounted(async () => {
const fullPath = currentRoute.value.fullPath;
const list = fullPath.split('targetURL=');
const targetURL = list[1];
let params = {...currentRoute.value.query, targetURL: targetURL, mode: 'none' }; //不要默认的错误提示
await userStore.singleLogin(params);
});
import { useUserStore } from '/@/store/modules/user';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';
const { currentRoute } = useRouter();
const userStore = useUserStore();
onMounted(async () => {
const fullPath = currentRoute.value.fullPath;
const list = fullPath.split('targetURL=');
const targetURL = list[1];
let params = { ...currentRoute.value.query, targetURL: targetURL, mode: 'none' }; //不要默认的错误提示
await userStore.singleLogin(params);
});
</script>
<style lang="less">
</style>
<style lang="less"></style>

64
src/views/secondDev/TokenLogin.vue
View File

@ -1,40 +1,38 @@
<template>
<div style="width: 100%; height: 300px; display: flex;justify-content: center;align-items: center;">
<a-spin />
</div>
<div style="width: 100%; height: 300px; display: flex; justify-content: center; align-items: center">
<a-spin />
</div>
</template>
<script lang="ts" setup>
import { useUserStore } from '/@/store/modules/user';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';
import { useUserStore } from '/@/store/modules/user';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';
const { currentRoute } = useRouter();
const userStore = useUserStore();
const { currentRoute } = useRouter();
const userStore = useUserStore();
onMounted(async () => {
const fullPath = currentRoute.value.fullPath;
let targetURL = ''
let redirect = ''
if (fullPath.includes('targetURL')) {
const list = fullPath.split('targetURL=');
targetURL = list[1];
} else {
const list = fullPath.split('redirect=');
redirect = list[1];
}
let params = {...currentRoute.value.query, targetURL: targetURL,redirect: redirect, mode: 'none',goHome:true }; //不要默认的错误提示
const token=currentRoute.value.query?.token;
//cas ticket的话走一遍后端换成token
const ticket=currentRoute.value.query?.ticket;
if(ticket){
params.ticket=ticket;
await userStore.casLogin(params);
}else if (token) {
await userStore.tokenLogin(token,params);
}
});
onMounted(async () => {
const fullPath = currentRoute.value.fullPath;
let targetURL = '';
let redirect = '';
if (fullPath.includes('targetURL')) {
const list = fullPath.split('targetURL=');
targetURL = list[1];
} else {
const list = fullPath.split('redirect=');
redirect = list[1];
}
let params = { ...currentRoute.value.query, targetURL: targetURL, redirect: redirect, mode: 'none', goHome: true }; //不要默认的错误提示
const token = currentRoute.value.query?.token;
//cas ticket的话走一遍后端换成token
const ticket = currentRoute.value.query?.ticket;
if (ticket) {
params.ticket = ticket;
await userStore.casLogin(params);
} else if (token) {
await userStore.tokenLogin(token, params);
}
});
</script>
<style lang="less">
</style>
<style lang="less"></style>

405
src/views/secondDev/approveFlowPage.vue
View File

@ -1,78 +1,75 @@
<template>
<a-spin :spinning="spinning" tip="请稍后...">
<div class="page-bg-wrap">
<div class="geg-flow-page">
<div class="top-toolbar">
<a-space :size="10" wrap>
<a-button style="margin-right: 10px" @click="close">
<slot name="icon">
<close-outlined />
</slot>
关闭
</a-button>
<template v-for="(btn, index) in buttonMap.normal">
<a-button @click="onClickBtn(btn)" :type="btn.buttonCode === ApproveCode.AGREE ? 'primary' : ''">
<slot name="icon" v-if="btn.buttonCode === ApproveCode.AGREE">
<check-circle-outlined />
<div class="page-bg-wrap">
<div class="geg-flow-page">
<div class="top-toolbar">
<a-space :size="10" wrap>
<a-button style="margin-right: 10px" @click="close">
<slot name="icon">
<close-outlined />
</slot>
<slot name="icon" v-if="btn.buttonCode === ApproveCode.REJECT">
<stop-outlined />
</slot>
{{btn.buttonName}}
关闭
</a-button>
</template>
<template v-for="(btnGroup, btnGroupKey) in buttonMap">
<a-dropdown v-if="btnGroupKey!=='normal' && btnGroup.length">
<template #overlay>
<a-menu>
<a-menu-item v-for="(btn, index) in btnGroup" :key="btn.buttonCode" @click="onClickBtn(btn)">
{{btn.buttonName}}
</a-menu-item>
</a-menu>
</template>
<a-button>
{{btnGroupKey}}
<down-outlined />
<template v-for="(btn, index) in buttonMap.normal">
<a-button @click="onClickBtn(btn)" :type="btn.buttonCode === ApproveCode.AGREE ? 'primary' : ''">
<slot name="icon" v-if="btn.buttonCode === ApproveCode.AGREE">
<check-circle-outlined />
</slot>
<slot name="icon" v-if="btn.buttonCode === ApproveCode.REJECT">
<stop-outlined />
</slot>
{{ btn.buttonName }}
</a-button>
</a-dropdown>
</template>
</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)"
/>
<Title :font-size="18" default-value="流转信息"></Title>
<flow-history :items="getTaskRecords()"></flow-history>
<opinion-dialog ref="opinionDlg" />
<transfer-dialog ref="transferDlg" />
<a-modal :closable="false" v-if="showFlowChart" visible="true" centered class="geg" title="流程图" width="1200px" @cancel="closeFlowChart">
<process-information :process-id="processId" :xml="data.xml"
:currentTaskInfo="data.currentTaskInfo"
:currentTaskAssigneeNames="data.currentTaskAssigneeNames"
:currentTaskAssignees="data.currentTaskAssignees"/>
<template #footer>
<a-button type="primary" @click="closeFlowChart">关闭</a-button>
</template>
</a-modal>
<a-modal :closable="false" v-if="showRecord" visible="true" centered class="geg" title="流程记录" width="1200px" @cancel="closeFlowRecord">
<div class="flow-record-box">
<FlowRecord :list="data.taskRecords" :processId="processId"/>
</template>
<template v-for="(btnGroup, btnGroupKey) in buttonMap">
<a-dropdown v-if="btnGroupKey !== 'normal' && btnGroup.length">
<template #overlay>
<a-menu>
<a-menu-item v-for="(btn, index) in btnGroup" :key="btn.buttonCode" @click="onClickBtn(btn)">
{{ btn.buttonName }}
</a-menu-item>
</a-menu>
</template>
<a-button>
{{ btnGroupKey }}
<down-outlined />
</a-button>
</a-dropdown>
</template>
</a-space>
</div>
<template #footer>
<a-button type="primary" @click="closeFlowRecord">关闭</a-button>
</template>
</a-modal>
<SelectUserV2 ref="selectUser" v-model:value="addStepUser" @change="changeAddStepUser" just-dialog title="加签减签"/>
<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" />
<transfer-dialog ref="transferDlg" />
<a-modal :closable="false" v-if="showFlowChart" visible="true" centered class="geg" title="流程图" width="1200px" @cancel="closeFlowChart">
<process-information :process-id="processId" :xml="data.xml" :currentTaskInfo="data.currentTaskInfo" :currentTaskAssigneeNames="data.currentTaskAssigneeNames" :currentTaskAssignees="data.currentTaskAssignees" />
<template #footer>
<a-button type="primary" @click="closeFlowChart">关闭</a-button>
</template>
</a-modal>
<a-modal :closable="false" v-if="showRecord" visible="true" centered class="geg" title="流程记录" width="1200px" @cancel="closeFlowRecord">
<div class="flow-record-box">
<FlowRecord :list="data.taskRecords" :processId="processId" />
</div>
<template #footer>
<a-button type="primary" @click="closeFlowRecord">关闭</a-button>
</template>
</a-modal>
<SelectUserV2 ref="selectUser" v-model:value="addStepUser" @change="changeAddStepUser" just-dialog title="加签减签" />
</div>
</div>
</div>
</a-spin>
</a-spin>
</template>
<script setup>
@ -100,7 +97,6 @@
import { TaskTypeUrl } from '/@/enums/workflowEnum';
import { postSetSign, postSetSignV2 } from '/@/api/workflow/task';
import FlowRecord from '/@/views/workflow/task/components/flow/FlowRecord.vue';
const spinning = ref(false);
const userStore = useUserStore();
@ -120,37 +116,37 @@
const taskId = ref(rQuery.taskId);
const processId = ref(rParams.arg2);
const readonly = ref(!!rQuery.readonly); // 查看流程会触发只读模式
const rDraftsId = ref(rQuery.draftId || '')
const rDraftsId = ref(rQuery.draftId || '');
const renderKey = ref('');
const formConfigs = ref();
const opinionDlg = ref();
const transferDlg = ref();
const validateSuccess = ref(false);
const formInformation = ref();
const selectUser = ref()
const addStepUser = ref('')
const lastAddStepUser = ref('')
const hasBtnAddStep = ref(false)
const hasBtnTransfer = ref(false)
const selectUser = ref();
const addStepUser = ref('');
const lastAddStepUser = ref('');
const hasBtnAddStep = ref(false);
const hasBtnTransfer = ref(false);
const showFlowChart = ref(false);
const showRecord = ref(false)
const showRecord = ref(false);
const hasBtnApprove = ref(false);
const hasBtnDisagree = ref(false)
const hasBtnDisagree = ref(false);
const hasBtnReject = ref(false);
const hasBtnFinish = ref(false);
const hasBtnDraft = ref(false)
const approveBtnName = ref('同意')
const transferBtnName = ref('转办')
const addStepBtnName = ref('会签')
const finishBtnName = ref('终止')
const rejectBtnName = ref('拒绝')
const drawBackBtnName = ref('撤回')
const draftBtnName = ref('暂存')
const disagreeBtnName = ref('不同意')
const hasBtnDraft = ref(false);
const approveBtnName = ref('同意');
const transferBtnName = ref('转办');
const addStepBtnName = ref('会签');
const finishBtnName = ref('终止');
const rejectBtnName = ref('拒绝');
const drawBackBtnName = ref('撤回');
const draftBtnName = ref('暂存');
const disagreeBtnName = ref('不同意');
const buttonMap = ref({
normal: []
})
let draftData = {}
});
let draftData = {};
const drawNode = ref('');
const props = defineProps({
rowKeyData: {
@ -158,7 +154,7 @@
}
});
const processInfo = ref();
provide("processInfo", processInfo);
provide('processInfo', processInfo);
let approvalData = reactive({
isCountersign: false,
@ -181,46 +177,48 @@
function showButton(btn) {
// 撤回有drawNode才显示，流程图任何情况下都显示
let show = (btn.checked && ((!readonly.value && btn.buttonCode !== ApproveCode.DRAWBACK) || (readonly.value && btn.buttonCode === ApproveCode.DRAWBACK && drawNode.value))) || (btn.buttonCode === ApproveCode.FLOWBPMN || btn.buttonCode === ApproveCode.FLOWRECORD)
return show
let show =
(btn.checked && ((!readonly.value && btn.buttonCode !== ApproveCode.DRAWBACK) || (readonly.value && btn.buttonCode === ApproveCode.DRAWBACK && drawNode.value))) ||
btn.buttonCode === ApproveCode.FLOWBPMN ||
btn.buttonCode === ApproveCode.FLOWRECORD;
return show;
}
function onClickBtn(btn) {
const key = btn.buttonCode;
if(btn.buttonType === ButtonType.DEFAULT) {
let funName = `handle${key}`
methods[funName](btn)
} else if(btn.buttonType === ButtonType.SCRIPT) {
handleFunction(btn)
if (btn.buttonType === ButtonType.DEFAULT) {
let funName = `handle${key}`;
methods[funName](btn);
} else if (btn.buttonType === ButtonType.SCRIPT) {
handleFunction(btn);
}
}
function onMoreClick(e) {
const key = e.key;
if(btn.buttonType === ButtonType.DEFAULT) {
let funName = `handle${key}`
methods[funName](btn)
} else if(btn.buttonType === ButtonType.SCRIPT) {
handleFunction(btn)
if (btn.buttonType === ButtonType.DEFAULT) {
let funName = `handle${key}`;
methods[funName](btn);
} else if (btn.buttonType === ButtonType.SCRIPT) {
handleFunction(btn);
}
}
function handleFunction(btn) {
// eval(script)
if (btn.handleFuncName) {
formInformation.value?.handleInnerFun(btn.handleFuncName)
formInformation.value?.handleInnerFun(btn.handleFuncName);
}
}
const methods = {
handlesetDraft() {
setDraft()
setDraft();
},
handledraft() {
saveDraft();
},
handleaddStep() {
selectUser.value.show()
selectUser.value.show();
},
handledrawBack() {
Modal.confirm({
@ -232,23 +230,25 @@
cancelText: t('取消'),
onOk() {
openSpinning();
withdraw(processId.value, drawNode.value).then((res) => {
if (res) {
notification.open({
type: 'success',
message: t('撤回'),
description: t('撤回成功')
});
} else {
notification.open({
type: 'error',
message: t('撤回'),
description: t('撤回失败')
});
}
}).finally(()=>{
closeSpinning();
});
withdraw(processId.value, drawNode.value)
.then((res) => {
if (res) {
notification.open({
type: 'success',
message: t('撤回'),
description: t('撤回成功')
});
} else {
notification.open({
type: 'error',
message: t('撤回'),
description: t('撤回失败')
});
}
})
.finally(() => {
closeSpinning();
});
},
onCancel() {}
});
@ -269,30 +269,30 @@
onTransferClick();
},
handleagree() {
onApproveClick()
onApproveClick();
},
handledisagree() {
onDisagreeClick()
onDisagreeClick();
},
handlereject() {
onDenyClick()
onDenyClick();
},
handleflowRecord() {
showRecord.value = true;
},
}
}
};
function closeFlowChart() {
showFlowChart.value = false;
}
function closeFlowRecord() {
showRecord.value = false
showRecord.value = false;
}
function close() {
tabStore.closeTab(currentRoute, router);
if(window?.isOnlyShowContent=='Y') {
if (window?.isOnlyShowContent == 'Y') {
window.close();
}
}
@ -300,13 +300,13 @@
let formData = [];
let params = {
taskId: taskId.value,
userId: userStore.getUserInfo.id,
}
let res = await getDraftInfo('', taskId.value, userStore.getUserInfo.id)
if(res) {
draftData = JSON.parse(res.formData)
rDraftsId.value = res.id
if(!needModal) return
userId: userStore.getUserInfo.id
};
let res = await getDraftInfo('', taskId.value, userStore.getUserInfo.id);
if (res) {
draftData = JSON.parse(res.formData);
rDraftsId.value = res.id;
if (!needModal) return;
Modal.confirm({
title: () => '提示',
content: () => '确认使用草稿覆盖当前数据？',
@ -329,10 +329,10 @@
let res = await putDraft(schemaId.value, formModels, rDraftsId.value, props.rowKeyData, processId.value, taskId.value);
showResult(res, '保存草稿');
} else {
let res = await postDraft(schemaId.value, formModels, props.rowKeyData, processId.value, taskId.value );
let res = await postDraft(schemaId.value, formModels, props.rowKeyData, processId.value, taskId.value);
showResult(res, '保存草稿');
}
setDraft(false)
setDraft(false);
spinning.value = false;
} catch (error) {
spinning.value = false;
@ -346,36 +346,35 @@
notificationError(title);
}
}
async function changeAddStepUser (ids, memberList) {
async function changeAddStepUser(ids, memberList) {
try {
spinning.value = true;
let idList = memberList.map(item => {
return item.id
})
let lastIdList = lastAddStepUser.value.split(',')
let addUserIds = idList.filter(item => {
return lastIdList.indexOf(item) == -1
})
let subUserIds = lastIdList.filter(item => {
return idList.indexOf(item) == -1
})
let idList = memberList.map((item) => {
return item.id;
});
let lastIdList = lastAddStepUser.value.split(',');
let addUserIds = idList.filter((item) => {
return lastIdList.indexOf(item) == -1;
});
let subUserIds = lastIdList.filter((item) => {
return idList.indexOf(item) == -1;
});
let data = {
addUserIds,
subUserIds,
schemaId: schemaId.value,
taskId: taskId.value
}
};
await postSetSignV2(data);
let res = await getApprovalProcess(unref(taskId), unref(processId));
initProcessData(res);
spinning.value = false;
message.success('操作成功');
} catch (e) {
message.error(e)
message.error(e);
spinning.value = false;
message.error('操作失败，请稍后再试');
}
}
async function onApproveClick(isAutoAgreeBreak = false) {
@ -394,7 +393,7 @@
approvalData.approvedResult = ApproveCode.AGREE;
//如果是自动同意触发的，关闭弹层的loading
if (isAutoAgreeBreak) {
opinionDlg.value.stopLoading()
opinionDlg.value.stopLoading();
}
closeSpinning();
opinionDlg.value.toggleDialog({
@ -403,20 +402,18 @@
callback: (args) => {
approvalData.approvedContent = args.opinion;
approvalData.nextTaskUser = args.nextTaskUser;
approvalData.isEnd=args.isEnd;
approvalData.isEnd = args.isEnd;
onFinish('approve');
}
});
} catch (e) {
console.error(e)
console.error(e);
closeSpinning();
throw new Error(e);
}
}
async function onDisagreeClick() {
try {
openSpinning();
await submit();
@ -437,9 +434,8 @@
onFinish('disagree');
}
});
} catch (e) {
console.error(e)
console.error(e);
closeSpinning();
throw new Error(e);
}
@ -534,37 +530,37 @@
function setBtnStatus() {
const btnConfigs = approvalData.buttonConfigs;
let draftBtn = btnConfigs.find((item) => item.buttonCode === ApproveCode.DRAFT)
if(draftBtn && rDraftsId.value) {
btnConfigs.push({
...draftBtn,
buttonName: t('从草稿导入'),
buttonCode: 'setDraft',
approveType: ApproveType.DRAFT,
index: 1
})
let draftBtn = btnConfigs.find((item) => item.buttonCode === ApproveCode.DRAFT);
if (draftBtn && rDraftsId.value) {
btnConfigs.push({
...draftBtn,
buttonName: t('从草稿导入'),
buttonCode: 'setDraft',
approveType: ApproveType.DRAFT,
index: 1
});
}
btnConfigs.forEach((btn) => {
const index = btn.index
const buttonGroup = btn?.buttonGroup
if(buttonGroup) {
if(!buttonMap.value[buttonGroup]) {
buttonMap.value[buttonGroup] = []
const index = btn.index;
const buttonGroup = btn?.buttonGroup;
if (buttonGroup) {
if (!buttonMap.value[buttonGroup]) {
buttonMap.value[buttonGroup] = [];
}
if(showButton(btn)) {
buttonMap.value[buttonGroup].push(btn)
if (showButton(btn)) {
buttonMap.value[buttonGroup].push(btn);
}
} else {
if(showButton(btn)) {
buttonMap.value['normal'].push(btn)
if (showButton(btn)) {
buttonMap.value['normal'].push(btn);
}
}
for(let key in buttonMap.value) {
for (let key in buttonMap.value) {
buttonMap.value[key].sort((a, b) => {
let aIndex = a?.index || 0
let bIndex = b?.index || 0
return aIndex - bIndex
})
let aIndex = a?.index || 0;
let bIndex = b?.index || 0;
return aIndex - bIndex;
});
}
});
}
@ -586,13 +582,13 @@
const tabPrefix = readonly.value ? '查看' : '审批';
tabStore.changeTitle(fullPath, `${tabPrefix}：${title}`);
}
if(taskId.value) {
let ids = ''
if (taskId.value) {
let ids = '';
res.currentTaskAssignees[res.taskInfo.taskDefinitionKey].forEach((item, index) => {
ids = `${ids}${index == 0 ? '' : ','}${item.assigneeIdStr}`
})
addStepUser.value = ids
lastAddStepUser.value = ids
ids = `${ids}${index == 0 ? '' : ','}${item.assigneeIdStr}`;
});
addStepUser.value = ids;
lastAddStepUser.value = ids;
}
if (res.buttonConfigs) {
approvalData.buttonConfigs = res.buttonConfigs;
@ -614,7 +610,7 @@
approvalData.circulateConfigs = [];
}
renderKey.value = Math.random() + '';
setDraft()
setDraft();
} catch (error) {}
});
@ -686,11 +682,11 @@
/*stampId: values.stampId,
stampPassword: values.password,*/
isOldSystem: system,
isEnd:approvalData.isEnd,
isEnd: approvalData.isEnd,
nextTaskUser: approvalData.nextTaskUser
};
} catch (e) {
console.error(e)
console.error(e);
}
}
@ -700,7 +696,7 @@
let params = await getApproveParams();
let response = await postApproval(params);
// 判断返回值是否带有isAutoAgree 来判断中间是否有自动审批的业务，如有再执行判断待审人员是否包含自己，不包含就直接flowSuccess
if (checkIsAutoAgree(response)) return
if (checkIsAutoAgree(response)) return;
flowSuccess();
data.submitLoading = false;
}
@ -712,13 +708,15 @@
/**
* 判断该次审核是否触发自动同意事务，并且检验返回得task 是否是自身作为被审需要弹框再次审核
* @param response
* @param response
*/
function checkIsAutoAgree(response) {
if (response != null
&& response.length != 0
&& response[0].isAutoAgree == true //
&& response[0].approveUserIds.includes(userStore.getUserInfo.id)) {
function checkIsAutoAgree(response) {
if (
response != null &&
response.length != 0 &&
response[0].isAutoAgree == true && //
response[0].approveUserIds.includes(userStore.getUserInfo.id)
) {
// 注入新得taskId
taskId.value = response[0].taskId;
data.submitLoading = false;
@ -727,8 +725,7 @@
} else {
return false;
}
}
}
function openSpinning() {
spinning.value = true;
@ -739,8 +736,8 @@
</script>
<style lang="less" scoped>
.flow-record-box {
height: 500px;
overflow: auto;
}
.flow-record-box {
height: 500px;
overflow: auto;
}
</style>

18
src/views/secondDev/createFlow.vue
View File

@ -22,9 +22,7 @@
</slot>
暂存
</a-button>
<a-button @click="handleDelete" danger v-if="rDraftsId!='0'">
删除
</a-button>
<a-button @click="handleDelete" danger v-if="rDraftsId != '0'"> 删除 </a-button>
<a-button @click="openFlowChart">
<slot name="icon">
<apartment-outlined />
@ -169,7 +167,7 @@
if (formJsonStr) {
let formDataJson = JSON.parse(formJsonStr);
let formData = [];
if(rQuery.fromKey&&formDataJson[rQuery.fromKey]){
if (rQuery.fromKey && formDataJson[rQuery.fromKey]) {
formData.push(formDataJson[rQuery.fromKey]);
}
await formInformation.value.setFormData(formData);
@ -185,7 +183,7 @@
showResult(res, '保存草稿');
} else {
let res = await postDraft(rSchemaId, formModels, props.rowKeyData);
rDraftsId.value = res
rDraftsId.value = res;
showResult(res, '保存草稿');
}
} catch (error) {
@ -222,7 +220,7 @@
async function approvalCreate() {
const params = await getApproveParams();
const nextNodes = await postGetNextTaskMaybeArrival(params);
if(nextNodes.length==0){
if (nextNodes.length == 0) {
message.error('流程没有可以选择的下一节点');
loading.value = false;
data.submitLoading = false;
@ -289,12 +287,12 @@
stampPassword: values.password,*/
isOldSystem: system,
nextTaskUser: approvalData.nextTaskUser,
draftId: rDraftsId.value,
draftId: rDraftsId.value
};
}
async function saveLaunch() {
if (!taskId.value && rDraftsId.value!='0') {
if (!taskId.value && rDraftsId.value != '0') {
try {
await new Promise((resolve, reject) => {
Modal.confirm({
@ -320,7 +318,7 @@
let successValidate = validateForms.filter((ele) => {
return ele.validate;
});
console.info("validateForms:"+JSON.stringify(validateForms));
console.info('validateForms:' + JSON.stringify(validateForms));
if (successValidate.length == validateForms.length) {
mainFormModels.value = await formInformation.value.getFormModels(true);
/*for (let i in mainFormModels.value) {
@ -423,7 +421,7 @@
}
} catch (error) {}
},
onCancel() {},
onCancel() {}
});
}
</script>

890
src/views/secondDev/flowFormInformation.vue
View File

@ -1,493 +1,489 @@
<template>
<!-- 表单信息 -->
<div class="form-container">
<div class="box">
<div class="form-right">
<div v-for="(item, index) in forms.configs" :key="index" :tab="item.formName">
<div v-show="activeIndex == index">
<div class="page-bg-wrap">
<div class="top-toolbar" style="display: flex;margin-bottom: 10px">
<div id="adminButtons" v-show="activeIndex == index" style="margin-right:10px">
<a-button @click="handleCancel" v-if="forms.modes[index] == 'edit'">取消</a-button>
<a-button @click="handleSave" v-if="forms.modes[index] == 'edit'" type="primary" style="margin-left: 12px">保存</a-button>
<a-button @click="handleEdit" v-if="forms.modes[index] == 'view'">编辑</a-button>
<a-button @click="handleDelete" type="danger" style="margin-left: 12px">删除</a-button>
<!-- 表单信息 -->
<div class="form-container">
<div class="box">
<div class="form-right">
<div v-for="(item, index) in forms.configs" :key="index" :tab="item.formName">
<div v-show="activeIndex == index">
<div class="page-bg-wrap">
<div class="top-toolbar" style="display: flex; margin-bottom: 10px">
<div id="adminButtons" v-show="activeIndex == index" style="margin-right: 10px">
<a-button @click="handleCancel" v-if="forms.modes[index] == 'edit'">取消</a-button>
<a-button @click="handleSave" v-if="forms.modes[index] == 'edit'" type="primary" style="margin-left: 12px">保存</a-button>
<a-button @click="handleEdit" v-if="forms.modes[index] == 'view'">编辑</a-button>
<a-button @click="handleDelete" type="danger" style="margin-left: 12px">删除</a-button>
</div>
<div id="approveExtendButton"></div>
<div id="approveRightButton"></div>
<div id="approveExtendButtonLeft" v-show="false"></div>
</div>
<SystemForm class="form-box" v-if="item.formType == FormType.SYSTEM" :systemComponent="item.systemComponent" :isViewProcess="props.disabled" :formModel="item.formModel" :workflowConfig="item" :ref="setItemRef" />
<SimpleForm v-else-if="item.formType == FormType.CUSTOM" class="form-box testClass" :ref="setItemRef" :formProps="item.formProps" :formModel="item.formModel" :isWorkFlow="true" />
</div>
</div>
</div>
<div id="approveExtendButton"></div>
<div id="approveRightButton"></div>
<div id="approveExtendButtonLeft" v-show="false"></div>
</div>
<SystemForm class="form-box" v-if="item.formType == FormType.SYSTEM"
:systemComponent="item.systemComponent" :isViewProcess="props.disabled" :formModel="item.formModel"
:workflowConfig="item" :ref="setItemRef" />
<SimpleForm v-else-if="item.formType == FormType.CUSTOM" class="form-box testClass" :ref="setItemRef"
:formProps="item.formProps" :formModel="item.formModel" :isWorkFlow="true" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { FewerLeft, FewerRight } from '/@/components/ModalPanel';
import { NodeHead } from '/@/components/ModalPanel/index';
import IconFontSymbol from '/@/components/IconFontSymbol/Index.vue';
import { onBeforeUpdate, nextTick, onMounted, reactive, computed, ref, inject, createVNode } from 'vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { TaskApproveOpinion, ValidateForms } from '/@/model/workflow/bpmnConfig';
import { cloneDeep } from 'lodash-es';
import { useI18n } from '/@/hooks/web/useI18n';
import { GeneratorConfig } from '/@/model/generator/generatorConfig';
import { FormEventColumnConfig } from '/@/model/generator/formEventConfig';
import { changeFormJson } from '/@/hooks/web/useWorkFlowForm';
import { SystemForm } from '/@/components/SystemForm/index';
import { FormType } from '/@/enums/workflowEnum';
import { createFormEvent, loadFormEvent, submitFormEvent } from '/@/hooks/web/useFormEvent';
import { message, Modal } from "ant-design-vue";
import { updateWorkflow } from '/@/api/workflow/adminOperation';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import { useRouter } from 'vue-router';
import useEventBus from '/@/hooks/event/useEventBus';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { FewerLeft, FewerRight } from '/@/components/ModalPanel';
import { NodeHead } from '/@/components/ModalPanel/index';
import IconFontSymbol from '/@/components/IconFontSymbol/Index.vue';
import { onBeforeUpdate, nextTick, onMounted, reactive, computed, ref, inject, createVNode } from 'vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { TaskApproveOpinion, ValidateForms } from '/@/model/workflow/bpmnConfig';
import { cloneDeep } from 'lodash-es';
import { useI18n } from '/@/hooks/web/useI18n';
import { GeneratorConfig } from '/@/model/generator/generatorConfig';
import { FormEventColumnConfig } from '/@/model/generator/formEventConfig';
import { changeFormJson } from '/@/hooks/web/useWorkFlowForm';
import { SystemForm } from '/@/components/SystemForm/index';
import { FormType } from '/@/enums/workflowEnum';
import { createFormEvent, loadFormEvent, submitFormEvent } from '/@/hooks/web/useFormEvent';
import { message, Modal } from 'ant-design-vue';
import { updateWorkflow } from '/@/api/workflow/adminOperation';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import { useRouter } from 'vue-router';
import useEventBus from '/@/hooks/event/useEventBus';
const tabStore = useMultipleTabStore();
const { bus, FLOW_PROCESSED } = useEventBus();
const router = useRouter();
const { currentRoute } = useRouter();
const tabStore = useMultipleTabStore();
const { bus, FLOW_PROCESSED } = useEventBus();
const router = useRouter();
const { currentRoute } = useRouter();
const { t } = useI18n();
const props = withDefaults(
defineProps<{
disabled: boolean | undefined;
formInfos: Array<any>;
opinions?: Array<TaskApproveOpinion> | undefined;
opinionsComponents?: Array<string> | undefined;
formAssignmentData?: null | Recordable;
processId: string;
}>(),
{
disabled: false,
formInfos: () => {
return [];
},
processId: ''
},
);
const flowInfo = inject('flowInfo')
const emits = defineEmits(['getFormConfigs']);
let uploadComponent: { ids: Array<string> } = reactive({ ids: [] });
let activeIndex = ref(0);
let itemRefs = ref([]) as any;
const setItemRef = (el: never) => {
itemRefs.value.push(el);
};
onBeforeUpdate(() => {
itemRefs.value = [];
});
let forms: {
formModels: Array<Recordable>;
configs: Array<{
formName: string;
formProps: {};
formModel: Recordable;
formKey: string;
validate: boolean;
formType: FormType;
workflowPermissions?: Array<any>;
opinions?: Array<any>;
opinionsComponents?: Array<any>;
systemComponent?: {
functionalModule: string;
functionName: string;
functionFormName: string;
};
formJson?: Array<any>;
isOldSystem?: boolean;
}>;
formEventConfigs: FormEventColumnConfig[];
modes: string[];
} = reactive({
formModels: [],
configs: [],
formEventConfigs: [],
modes: []
});
onMounted(async () => {
for await (let element of props.formInfos) {
let formModels = {};
if (element.formData) {
formModels = cloneDeep(element.formData);
}
// 参数赋值[赋值权限最大]
if (props.formAssignmentData) {
if (props.formAssignmentData[element.formConfig.formId]) {
formModels = { ...formModels, ...props.formAssignmentData[element.formConfig.formId] };
const { t } = useI18n();
const props = withDefaults(
defineProps<{
disabled: boolean | undefined;
formInfos: Array<any>;
opinions?: Array<TaskApproveOpinion> | undefined;
opinionsComponents?: Array<string> | undefined;
formAssignmentData?: null | Recordable;
processId: string;
}>(),
{
disabled: false,
formInfos: () => {
return [];
},
processId: ''
}
}
forms.formModels.push(formModels);
// 默认赋值view
forms.modes.push('view');
// 系统表单
if (element.formType == FormType.SYSTEM) {
forms.configs.push({
formName: element.formConfig.formName,
formProps: {},
formModel: formModels,
formKey: element.formConfig.key,
validate: true,
formType: element.formType,
workflowPermissions: element.formConfig.children,
opinions: props.opinions,
opinionsComponents: props.opinionsComponents,
systemComponent: {
functionalModule: element.functionalModule,
functionName: element.functionName,
functionFormName: 'Form',
},
formJson: element.formJson,
isOldSystem: false,
});
// 上传组件Id集合
);
const flowInfo = inject('flowInfo');
const emits = defineEmits(['getFormConfigs']);
let uploadComponent: { ids: Array<string> } = reactive({ ids: [] });
let activeIndex = ref(0);
let itemRefs = ref([]) as any;
const setItemRef = (el: never) => {
itemRefs.value.push(el);
};
onBeforeUpdate(() => {
itemRefs.value = [];
});
let forms: {
formModels: Array<Recordable>;
configs: Array<{
formName: string;
formProps: {};
formModel: Recordable;
formKey: string;
validate: boolean;
formType: FormType;
workflowPermissions?: Array<any>;
opinions?: Array<any>;
opinionsComponents?: Array<any>;
systemComponent?: {
functionalModule: string;
functionName: string;
functionFormName: string;
};
formJson?: Array<any>;
isOldSystem?: boolean;
}>;
formEventConfigs: FormEventColumnConfig[];
modes: string[];
} = reactive({
formModels: [],
configs: [],
formEventConfigs: [],
modes: []
});
onMounted(async () => {
for await (let element of props.formInfos) {
let formModels = {};
if (element.formData) {
formModels = cloneDeep(element.formData);
}
// 参数赋值[赋值权限最大]
if (props.formAssignmentData) {
if (props.formAssignmentData[element.formConfig.formId]) {
formModels = { ...formModels, ...props.formAssignmentData[element.formConfig.formId] };
}
}
forms.formModels.push(formModels);
// 默认赋值view
forms.modes.push('view');
// 系统表单
if (element.formType == FormType.SYSTEM) {
forms.configs.push({
formName: element.formConfig.formName,
formProps: {},
formModel: formModels,
formKey: element.formConfig.key,
validate: true,
formType: element.formType,
workflowPermissions: element.formConfig.children,
opinions: props.opinions,
opinionsComponents: props.opinionsComponents,
systemComponent: {
functionalModule: element.functionalModule,
functionName: element.functionName,
functionFormName: 'Form'
},
formJson: element.formJson,
isOldSystem: false
});
// 上传组件Id集合
setTimeout(() => {
getSystemUploadComponentIds();
}, 0);
} else {
const model = JSON.parse(element.formJson) as GeneratorConfig;
const { formJson, formEventConfig } = model;
if (formEventConfig) {
forms.formEventConfigs.push(formEventConfig);
//初始化表单
await createFormEvent(formEventConfig, formModels, true);
//加载表单
await loadFormEvent(formEventConfig, formModels, true);
//TODO 暂不放开 工作流没有获取表单数据这个步骤 获取表单数据
// getFormDataEvent(formEventConfig, formModels,true);
}
let formKey = element.formConfig.key;
let config = {
formName: element.formConfig.formName,
formProps: {},
formModel: {},
formKey,
validate: true,
formType: element.formType
};
let isViewProcess = props.disabled;
let { buildOptionJson, uploadComponentIds } = changeFormJson(
{
formJson,
formConfigChildren: element.formConfig.children,
formConfigKey: element.formConfig.key,
opinions: props.opinions,
opinionsComponents: props.opinionsComponents
},
isViewProcess,
uploadComponent.ids
);
uploadComponent.ids = uploadComponentIds;
if (buildOptionJson.schemas) {
config.formProps = buildOptionJson;
forms.configs.push(config);
}
}
// });
}
await nextTick();
setTimeout(() => {
getSystemUploadComponentIds();
setFormModel();
}, 0);
} else {
const model = JSON.parse(element.formJson) as GeneratorConfig;
const { formJson, formEventConfig } = model;
if (formEventConfig) {
forms.formEventConfigs.push(formEventConfig);
emits('getFormConfigs', forms.configs.length ? forms.configs[activeIndex.value] : null);
});
//初始化表单
await createFormEvent(formEventConfig, formModels, true);
//加载表单
await loadFormEvent(formEventConfig, formModels, true);
//TODO 暂不放开 工作流没有获取表单数据这个步骤 获取表单数据
// getFormDataEvent(formEventConfig, formModels,true);
function setFormModel() {
for (let index = 0; index < itemRefs.value.length; index++) {
if (itemRefs.value[index]) {
itemRefs.value[index].setFieldsValue(forms.formModels[index]);
}
}
let formKey = element.formConfig.key;
}
let config = {
formName: element.formConfig.formName,
formProps: {},
formModel: {},
formKey,
validate: true,
formType: element.formType,
};
let isViewProcess = props.disabled;
let { buildOptionJson, uploadComponentIds } = changeFormJson(
{
formJson,
formConfigChildren: element.formConfig.children,
formConfigKey: element.formConfig.key,
opinions: props.opinions,
opinionsComponents: props.opinionsComponents,
},
isViewProcess,
uploadComponent.ids,
);
uploadComponent.ids = uploadComponentIds;
if (buildOptionJson.schemas) {
config.formProps = buildOptionJson;
forms.configs.push(config);
async function setFormData(formData) {
await nextTick();
forms.formModels = formData;
setFormModel();
}
function changeActiveIndex(index: number) {
activeIndex.value = index;
emits('getFormConfigs', forms.configs[activeIndex.value]);
}
function getSystemUploadComponentIds() {
for (let index = 0; index < itemRefs.value.length; index++) {
if (itemRefs.value[index] && itemRefs.value[index].getUploadComponentIds) {
let ids = itemRefs.value[index].getUploadComponentIds();
uploadComponent.ids = [...uploadComponent.ids, ...ids];
}
}
}
// });
}
await nextTick();
setTimeout(() => {
setFormModel();
}, 0);
emits('getFormConfigs', forms.configs.length ? forms.configs[activeIndex.value] : null);
});
function setFormModel() {
for (let index = 0; index < itemRefs.value.length; index++) {
if (itemRefs.value[index]) {
itemRefs.value[index].setFieldsValue(forms.formModels[index]);
}
// 获取上传组件的字段值集合
function getUploadComponentIds() {
return uploadComponent.ids;
}
}
async function setFormData(formData) {
await nextTick();
forms.formModels = formData;
setFormModel();
}
function changeActiveIndex(index: number) {
activeIndex.value = index;
emits('getFormConfigs', forms.configs[activeIndex.value]);
}
function getSystemUploadComponentIds() {
for (let index = 0; index < itemRefs.value.length; index++) {
if (itemRefs.value[index] && itemRefs.value[index].getUploadComponentIds) {
let ids = itemRefs.value[index].getUploadComponentIds();
uploadComponent.ids = [...uploadComponent.ids, ...ids];
}
}
}
// 获取上传组件的字段值集合
function getUploadComponentIds() {
return uploadComponent.ids;
}
async function validateForm() {
let validateForms: ValidateForms = [];
for (let index = 0; index < itemRefs.value.length; index++) {
if (itemRefs.value[index]) {
try {
await itemRefs.value[index]?.validate();
validateForms.push({
validate: true,
msgs: [],
isOldSystem: forms.configs[index].isOldSystem,
});
forms.configs[index].validate = true;
} catch (error: any | Array<{ errors: Array<string>; name: Array<string> }>) {
validateForms.push({
validate: false,
msgs: error?.errorFields,
});
forms.configs[index].validate = false;
async function validateForm() {
let validateForms: ValidateForms = [];
for (let index = 0; index < itemRefs.value.length; index++) {
if (itemRefs.value[index]) {
try {
await itemRefs.value[index]?.validate();
validateForms.push({
validate: true,
msgs: [],
isOldSystem: forms.configs[index].isOldSystem
});
forms.configs[index].validate = true;
} catch (error: any | Array<{ errors: Array<string>; name: Array<string> }>) {
validateForms.push({
validate: false,
msgs: error?.errorFields
});
forms.configs[index].validate = false;
}
}
}
}
return validateForms;
}
return validateForms;
}
async function saveDraftData() {
let formModes = {};
async function saveDraftData() {
let formModes = {};
for (let index = 0; index < forms.configs.length; index++) {
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
let values = await itemRefs.value[index].validate();
formModes[ele.formKey] = values;
} else {
formModes[ele.formKey] = ele.formModel;
}
for (let index = 0; index < forms.configs.length; index++) {
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
let values = await itemRefs.value[index].validate();
formModes[ele.formKey] = values;
} else {
formModes[ele.formKey] = ele.formModel;
}
}
return formModes;
}
return formModes;
}
async function getFormModels(saveRowKey,isOnlyActive) {
let formModes = {};
for (let index = 0; index < forms.configs.length; index++) {
if (isOnlyActive && index != activeIndex.value) {
continue;
async function getFormModels(saveRowKey, isOnlyActive) {
let formModes = {};
for (let index = 0; index < forms.configs.length; index++) {
if (isOnlyActive && index != activeIndex.value) {
continue;
}
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
let values = await itemRefs.value[index].workflowSubmit(saveRowKey);
formModes[ele.formKey] = values;
} else {
formModes[ele.formKey] = ele.formModel;
}
}
// forms.configs.forEach((ele) => {
// formModes[ele.formKey] = ele.formModel;
// });
forms.formEventConfigs.forEach(async (ele, i) => {
if (isOnlyActive && i != activeIndex.value) {
return true;
}
//此组件 获取数据 就是为了提交表单 所以 表单提交数据 事件 就此处执行
await submitFormEvent(ele, forms.configs[i]?.formModel);
});
return formModes;
}
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
let values = await itemRefs.value[index].workflowSubmit(saveRowKey);
formModes[ele.formKey] = values;
} else {
formModes[ele.formKey] = ele.formModel;
function getSystemType() {
let system = {};
for (let index = 0; index < forms.configs.length; index++) {
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
system[ele.formKey] = itemRefs.value[index].getIsOldSystem();
}
}
return system;
}
}
// forms.configs.forEach((ele) => {
// formModes[ele.formKey] = ele.formModel;
// });
forms.formEventConfigs.forEach(async (ele, i) => {
if (isOnlyActive && i != activeIndex.value) {
return true;
function handleCancel() {
itemRefs.value[activeIndex.value].setDisabledForm(true);
forms.modes[activeIndex.value] = 'view';
itemRefs.value[activeIndex.value].setFieldsValue(forms.formModels[activeIndex.value]);
}
//此组件 获取数据 就是为了提交表单 所以 表单提交数据 事件 就此处执行
await submitFormEvent(ele, forms.configs[i]?.formModel);
});
return formModes;
}
function getSystemType() {
let system = {};
for (let index = 0; index < forms.configs.length; index++) {
const ele = forms.configs[index];
if (ele.formType == FormType.SYSTEM) {
system[ele.formKey] = itemRefs.value[index].getIsOldSystem();
}
async function handleDelete() {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除？',
okText: '确认',
cancelText: '取消',
async onOk() {
try {
let formVal = await itemRefs.value[activeIndex.value].getFormModels();
await itemRefs.value[activeIndex.value].handleDelete(formVal.id);
message.success('删除成功');
setTimeout(() => {
tabStore.closeTab(currentRoute.value, router);
bus.emit(FLOW_PROCESSED);
}, 1000);
} catch (err) {
message.error('删除失败，请稍后再试');
}
},
onCancel() {}
});
}
return system;
}
function handleCancel() {
itemRefs.value[activeIndex.value].setDisabledForm(true);
forms.modes[activeIndex.value] = 'view';
itemRefs.value[activeIndex.value].setFieldsValue(forms.formModels[activeIndex.value]);
}
async function handleDelete() {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除？',
okText: '确认',
cancelText: '取消',
async onOk() {
try{
let formVal = await itemRefs.value[activeIndex.value].getFormModels();
await itemRefs.value[activeIndex.value].handleDelete(formVal.id)
message.success('删除成功')
setTimeout(() => {
tabStore.closeTab(currentRoute.value, router);
bus.emit(FLOW_PROCESSED);
}, 1000)
} catch (err){
message.error('删除失败，请稍后再试');
}
},
onCancel() {},
});
}
async function handleSave() {
const params = await getFormModels(true, true);
const code = await updateWorkflow({ variables: params, processInstanceId: flowInfo.value.processId });
async function handleSave() {
const params = await getFormModels(true, true);
const code = await updateWorkflow({ 'variables': params, 'processInstanceId': flowInfo.value.processId })
if (code) {
message.success(t('保存成功'));
} else {
message.success(t('保存失败，请稍后再试'));
}
itemRefs.value[activeIndex.value].setDisabledForm(true);
forms.modes[activeIndex.value] = 'view';
}
if (code) {
message.success(t('保存成功'));
} else {
message.success(t('保存失败，请稍后再试'));
}
itemRefs.value[activeIndex.value].setDisabledForm(true);
forms.modes[activeIndex.value] = 'view';
}
function handleEdit() {
itemRefs.value[activeIndex.value].setDisabledForm(false);
forms.modes[activeIndex.value] = 'edit';
}
function handleEdit() {
itemRefs.value[activeIndex.value].setDisabledForm(false);
forms.modes[activeIndex.value] = 'edit';
}
defineExpose({
validateForm,
getFormModels,
saveDraftData,
setFormData,
getUploadComponentIds,
getSystemType,
handleEdit,
handleSave,
handleCancel,
handleDelete
});
defineExpose({
validateForm,
getFormModels,
saveDraftData,
setFormData,
getUploadComponentIds,
getSystemType,
handleEdit,
handleSave,
handleCancel,
handleDelete
});
</script>
<style lang="less" scoped>
.form-container {
display: flex;
height: 100%;
margin-top: -10px;
}
.box {
width: 100%;
.form-left {
float: left;
height: 100vh;
box-shadow: 5px 5px 5px rgb(0 0 0 / 10%);
z-index: 9998;
.resize-shrink-sidebar {
cursor: col-resize;
.form-container {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
bottom: 0;
right: 0;
z-index: 9999;
height: 100%;
margin-top: -10px;
}
.shrink-sidebar-text {
padding: 0 2px;
background: #f2f2f2;
border-radius: 10px;
.box {
width: 100%;
.form-left {
float: left;
height: 100vh;
box-shadow: 5px 5px 5px rgb(0 0 0 / 10%);
z-index: 9998;
.resize-shrink-sidebar {
cursor: col-resize;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
bottom: 0;
right: 0;
z-index: 9999;
.shrink-sidebar-text {
padding: 0 2px;
background: #f2f2f2;
border-radius: 10px;
}
}
.left-box {
margin-right: 10px;
border-right: 1px solid #f0f0f0;
height: 80vh;
}
span {
font-size: 16px;
font-weight: 500;
padding-left: 4px;
}
.form-name {
height: 36px;
display: flex;
align-items: center;
font-size: 14px;
cursor: pointer;
color: rgb(102 102 102 / 99.6%);
margin-right: -2px;
padding-left: 4px;
}
.actived {
border-right: 1px solid #5e95ff;
}
.dot {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: transparent;
margin-right: 4px;
}
.validate {
background-color: @clear-color;
}
.icon-box {
font-size: 16px;
margin-right: 4px;
}
.left-title {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
padding: 10px 4px 10px 0;
top: 0;
left: 0;
.in-or-out {
position: absolute;
right: 10px;
}
}
}
}
.left-box {
margin-right: 10px;
border-right: 1px solid #f0f0f0;
height: 80vh;
}
span {
font-size: 16px;
font-weight: 500;
padding-left: 4px;
}
.form-name {
height: 36px;
display: flex;
align-items: center;
font-size: 14px;
cursor: pointer;
color: rgb(102 102 102 / 99.6%);
margin-right: -2px;
padding-left: 4px;
}
.actived {
border-right: 1px solid #5e95ff;
}
.dot {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: transparent;
margin-right: 4px;
}
.validate {
background-color: @clear-color;
}
.icon-box {
font-size: 16px;
margin-right: 4px;
}
.left-title {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
padding: 10px 4px 10px 0;
top: 0;
left: 0;
.in-or-out {
position: absolute;
right: 10px;
.form-box {
overflow: auto;
height: calc(100vh - 280px);
}
.form-right {
width: 100%;
padding-top: 20px;
}
}
}
.form-box {
overflow: auto;
height: calc(100vh - 280px);
.page-bg-wrap {
background-color: #fff;
}
.form-right {
width: 100%;
padding-top: 20px;
.top-toolbar {
min-height: 44px;
margin-bottom: 12px;
border-bottom: 1px solid #eee;
}
}
.page-bg-wrap {
background-color: #fff;
}
.top-toolbar {
min-height: 44px;
margin-bottom: 12px;
border-bottom: 1px solid #eee;
}
</style>

212
src/views/secondDev/formCreatePage.vue
View File

@ -2,7 +2,7 @@
<a-spin :spinning="spinning" tip="请稍后...">
<div class="page-bg-wrap">
<div class="top-toolbar" id="formViewPage">
<a-space :size="10" wrap style="gap:0">
<a-space :size="10" wrap style="gap: 0">
<a-button style="margin-right: 10px" @click="close">
<slot name="icon">
<close-outlined />
@ -23,126 +23,126 @@
</template>
<script setup>
import { useRouter } from 'vue-router';
import { FromPageType } from '/@/enums/workflowEnum';
import { ref, computed, onMounted, onBeforeMount, nextTick, defineAsyncComponent } from 'vue';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { CheckCircleOutlined, StopOutlined, CloseOutlined } from '@ant-design/icons-vue';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import useEventBus from '/@/hooks/event/useEventBus';
import { useRouter } from 'vue-router';
import { FromPageType } from '/@/enums/workflowEnum';
import { ref, computed, onMounted, onBeforeMount, nextTick, defineAsyncComponent } from 'vue';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { CheckCircleOutlined, StopOutlined, CloseOutlined } from '@ant-design/icons-vue';
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
import useEventBus from '/@/hooks/event/useEventBus';
const dynamicComponent = ref(null);
const formType = ref('2'); // 0 新建 1 修改 2 查看
const formRef = ref();
const props = defineProps({});
const { bus, FORM_LIST_MODIFIED } = useEventBus();
const dynamicComponent = ref(null);
const formType = ref('2'); // 0 新建 1 修改 2 查看
const formRef = ref();
const props = defineProps({});
const { bus, FORM_LIST_MODIFIED } = useEventBus();
const router = useRouter();
const { currentRoute } = router;
const router = useRouter();
const { currentRoute } = router;
const { formPath } = currentRoute.value.query;
const pathArr = formPath.split('/');
const { formPath } = currentRoute.value.query;
const pathArr = formPath.split('/');
const tabStore = useMultipleTabStore();
const formProps = ref(null);
const formId = ref(currentRoute.value?.params?.id);
const tabStore = useMultipleTabStore();
const formProps = ref(null);
const formId = ref(currentRoute.value?.params?.id);
const spinning = ref(false)
const spinning = ref(false);
const { notification } = useMessage();
const { t } = useI18n();
const hash = location.hash||location.pathname;
const mode = ref('read');
if (hash.indexOf('createForm') > 0) {
mode.value = 'create';
} else if (hash.indexOf('updateForm') > 0) {
mode.value = 'update';
} else if (hash.indexOf('viewForm') > 0) {
mode.value = 'view';
}
dynamicComponent.value = defineAsyncComponent({
loader: () => import(`./../../views/${pathArr[0]}/${pathArr[1]}/components/Form.vue`)
});
function onFormMounted(_formProps) {
formProps.value = _formProps;
setFormType();
}
async function setFormType() {
const _mode = mode.value;
if (_mode === 'create') {
return;
const { notification } = useMessage();
const { t } = useI18n();
const hash = location.hash || location.pathname;
const mode = ref('read');
if (hash.indexOf('createForm') > 0) {
mode.value = 'create';
} else if (hash.indexOf('updateForm') > 0) {
mode.value = 'update';
} else if (hash.indexOf('viewForm') > 0) {
mode.value = 'view';
}
await nextTick();
if (_mode === 'view') {
await formRef.value.setDisabledForm();
dynamicComponent.value = defineAsyncComponent({
loader: () => import(`./../../views/${pathArr[0]}/${pathArr[1]}/components/Form.vue`)
});
function onFormMounted(_formProps) {
formProps.value = _formProps;
setFormType();
}
await formRef.value.setFormDataFromId(formId.value);
}
function close() {
tabStore.closeTab(currentRoute.value, router);
}
async function handleSubmit() {
spinning.value = true
try {
const saveSuccess = await saveModal();
if (saveSuccess) {
notification.success({
message: 'Tip',
description: formType.value === '0' ? t('新增成功！') : t('修改成功！')
}); //提示消息
formRef.value.resetFields();
setTimeout(() => {
bus.emit(FORM_LIST_MODIFIED, { path: formPath, mode });
close();
}, 1000);
async function setFormType() {
const _mode = mode.value;
if (_mode === 'create') {
return;
}
} finally {
spinning.value = false
await nextTick();
if (_mode === 'view') {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(formId.value);
}
}
async function saveModal() {
let saveSuccess = false;
const _mode = mode.value;
try {
await formRef.value?.validate();
const values = (formRef.value?.getFormModal && formRef.value.getFormModal()) || await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (_mode === 'create') {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: formId.value });
}
return saveSuccess;
} catch (error) { }
}
} catch (error) {
console.error('saveModal Error: ', error);
function close() {
tabStore.closeTab(currentRoute.value, router);
}
async function handleSubmit() {
spinning.value = true;
try {
const saveSuccess = await saveModal();
if (saveSuccess) {
notification.success({
message: 'Tip',
description: formType.value === '0' ? t('新增成功！') : t('修改成功！')
}); //提示消息
formRef.value.resetFields();
setTimeout(() => {
bus.emit(FORM_LIST_MODIFIED, { path: formPath, mode });
close();
}, 1000);
}
} finally {
spinning.value = false;
}
}
async function saveModal() {
let saveSuccess = false;
const _mode = mode.value;
try {
await formRef.value?.validate();
const values = (formRef.value?.getFormModal && formRef.value.getFormModal()) || (await formRef.value?.validate());
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (_mode === 'create') {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: formId.value });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
console.error('saveModal Error: ', error);
}
}
}
</script>
<style lang="less" scoped>
.page-bg-wrap {
background-color: #fff;
}
.page-bg-wrap {
background-color: #fff;
}
.top-toolbar {
min-height: 44px;
margin-bottom: 12px;
border-bottom: 1px solid #eee;
}
.top-toolbar {
min-height: 44px;
margin-bottom: 12px;
border-bottom: 1px solid #eee;
}
</style>

43
src/views/secondDev/processMonitoringFlowPage.vue
View File

@ -11,7 +11,7 @@
:opinionsComponents="data.opinionsComponents"
@get-form-configs="(config) => (formConfigs = config)"
/>
<component v-else-if="data" :is="componentName" :formData="data" :flowData="flowData"/>
<component v-else-if="data" :is="componentName" :formData="data" :flowData="flowData" />
</div>
</template>
@ -26,28 +26,21 @@
// 流程编码
// 'exchange_opinion',
// 'audit_programme'
]
];
const selfFormMap = {
// 流程编码对应文件路径
// 'exchange_opinion': 'auditOperationsCenter/exchangeViews/index.vue',
// 'audit_programme': 'auditOperationsCenter/preAuditProgramme/index.vue'
}
};
const isSelfForm = computed(() => {
return selfFormList.includes(props.data.item.code)
})
return selfFormList.includes(props.data.item.code);
});
const componentName = computed(() => {
return defineAsyncComponent({
loader: () =>
import(
`../${selfFormMap[props.data.item.code]}`
),
})
})
loader: () => import(`../${selfFormMap[props.data.item.code]}`)
});
});
const readonly = ref(true); // 查看流程会触发只读模式
const renderKey = ref('');
@ -62,21 +55,17 @@
type: Object,
default: () => null
}
});
onMounted(async () => {
});
defineExpose({
})
onMounted(async () => {});
defineExpose({});
</script>
<style lang="less" scoped>
.flow-page {
position: relative;
box-sizing: border-box;
width: 100%;
height: 100%;
}
.flow-page {
position: relative;
box-sizing: border-box;
width: 100%;
height: 100%;
}
</style>

111
src/views/secondDev/processMonitoringPage.vue
View File

@ -2,21 +2,15 @@
<div class="process-monitoring-page">
<a-spin :spinning="spinning" tip="请稍后...">
<a-tabs tab-position="top" v-model:activeKey="activeKey" type="card">
<a-tab-pane :key="1" :tab="'表单信息'" force-render>
</a-tab-pane>
<a-tab-pane :key="2" :tab="'流程信息'">
</a-tab-pane>
<a-tab-pane :key="3" :tab="'流转记录'" style="overflow: auto">
</a-tab-pane>
<a-tab-pane :key="1" :tab="'表单信息'" force-render> </a-tab-pane>
<a-tab-pane :key="2" :tab="'流程信息'"> </a-tab-pane>
<a-tab-pane :key="3" :tab="'流转记录'" style="overflow: auto"> </a-tab-pane>
<!-- <a-tab-pane :key="4" :tab="'附件汇总'">
<SummaryOfAttachments :processId="processId"/>
</a-tab-pane> -->
<a-tab-pane :key="5" :tab="'流程变更记录'">
</a-tab-pane>
<a-tab-pane :key="6" :tab="'审批记录'">
</a-tab-pane>
<a-tab-pane :key="7" :tab="'流程变量'">
</a-tab-pane>
<a-tab-pane :key="5" :tab="'流程变更记录'"> </a-tab-pane>
<a-tab-pane :key="6" :tab="'审批记录'"> </a-tab-pane>
<a-tab-pane :key="7" :tab="'流程变量'"> </a-tab-pane>
<!-- <a-tab-pane :key="8 + index" v-for="(item, index) in predecessorTasks" :tab="item.schemaName">
<LookRelationTask
v-show="activeKey === 8 + index"
@ -28,14 +22,12 @@
</a-tabs>
<div class="tab-content" v-if="dataComplete">
<processMonitoringFlowPage :data="data" :flowData="flowData" v-show="activeKey == '1'"></processMonitoringFlowPage>
<ProcessInformationWithInfo :process-id="processId" :data="data" :flowData="flowData" v-if="activeKey == '2'" :canClick="true" :key="ProcessInformationKey"/>
<FlowRecord :list="data.taskRecords" :processId="processId" v-show="activeKey == '3'"/>
<ProcessInformationWithInfo :process-id="processId" :data="data" :flowData="flowData" v-if="activeKey == '2'" :canClick="true" :key="ProcessInformationKey" />
<FlowRecord :list="data.taskRecords" :processId="processId" v-show="activeKey == '3'" />
<ChangeRecord v-if="activeKey == 5" :processId="processId" :formDataId="data.formInfos[0].formData.id" :formInfos="data.formInfos" />
<AuditRecord :processId="processId" :schemaId="schemaId" :xml="xml" v-show="activeKey == '6'"/>
<ProcVarPage :processId="processId" :schemaId="schemaId" :xml="xml" v-show="activeKey == '7'"/>
<AuditRecord :processId="processId" :schemaId="schemaId" :xml="xml" v-show="activeKey == '6'" />
<ProcVarPage :processId="processId" :schemaId="schemaId" :xml="xml" v-show="activeKey == '7'" />
</div>
</a-spin>
</div>
</template>
@ -50,15 +42,14 @@
import { SchemaTaskItem } from '/@/model/workflow/bpmnConfig';
import ChangeRecord from '/@/views/formChange/formChangeLog/index.vue';
import AuditRecord from '/@/views/auditOpt/auditRecord/index.vue';
import processMonitoringFlowPage from './processMonitoringFlowPage.vue'
import processMonitoringFlowPage from './processMonitoringFlowPage.vue';
// import ProcVarPage from '/@/views/editProVar/procVarManage/index.vue';
import { getApprovalProcess } from '/@/api/workflow/task';
import { Modal } from 'ant-design-vue';
import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
const { data, initProcessData } = userTaskItem();
import { useRouter } from 'vue-router';
const router = useRouter();
const currentRoute = router.currentRoute.value;
@ -67,7 +58,7 @@
const rParams = currentRoute.params;
const schemaId = ref(rParams.arg1);
const processId = ref(rParams.arg2);
const ProcessInformationKey = ref(0)
const ProcessInformationKey = ref(0);
const spinning = ref(false);
const dataComplete = ref(false);
@ -75,70 +66,68 @@
const flowInfo = ref({
schemaId: schemaId.value,
processId: processId.value
})
const flowData = ref({})
provide('flowInfo', flowInfo)
provide('refreshApproveInfo', getApproveInfo)
});
const flowData = ref({});
provide('flowInfo', flowInfo);
provide('refreshApproveInfo', getApproveInfo);
const activeKey = ref(1);
onMounted(async () => {
await getApproveInfo()
await getApproveInfo();
});
async function getApproveInfo() {
try {
spinning.value = true
spinning.value = true;
let res = await getApprovalProcess('', unref(processId.value));
initProcessData(res);
flowData.value = res
spinning.value = false
dataComplete.value = true
ProcessInformationKey.value++
flowData.value = res;
spinning.value = false;
dataComplete.value = true;
ProcessInformationKey.value++;
} catch (error) {
console.error('processMonitoringPage Error', error)
console.error('processMonitoringPage Error', error);
}
}
</script>
<style lang="less" scoped>
.process-monitoring-page {
height: 100%;
width: 100%;
:deep(.ant-spin-nested-loading) {
.process-monitoring-page {
height: 100%;
width: 100%;
display: flex;
.ant-spin-container {
:deep(.ant-spin-nested-loading) {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
flex: 1;
padding: 20px;
.ant-tabs-nav {
margin: 0;
}
.top-toolbar {
.ant-spin-container {
height: 100%;
display: flex;
border-bottom: none;
padding: 16px 0;
}
.tab-content {
flex-direction: column;
flex: 1;
min-height: 0;
overflow: auto;
box-sizing: border-box;
display: flex;
.process-information-with-info {
flex: 1;
padding: 20px;
.ant-tabs-nav {
margin: 0;
}
.top-toolbar {
display: flex;
flex-direction: column;
.flow-record-box {
border-bottom: none;
padding: 16px 0;
}
.tab-content {
flex: 1;
min-height: 0;
overflow: auto;
box-sizing: border-box;
display: flex;
.process-information-with-info {
flex: 1;
display: flex;
flex-direction: column;
.flow-record-box {
flex: 1;
}
}
}
}
}
}
}
</style>

2
src/views/secondDev/processTasksPage.vue
View File

@ -95,7 +95,7 @@
const selectedKeys = ref(['ToDoTasks']);
const query = unref(currentRoute).query;
let id = 'ToDoTasks';
const lHash = location.hash||location.pathname;
const lHash = location.hash || location.pathname;
if (lHash.indexOf('/draft') > 0) {
id = 'Drafts';
} else if (lHash.indexOf('/myProcess') > 0) {