Merge branch 'dev' of https://fcd.gdyditc.com/itc-framework/ma/2024/front into dev-zhaoDN/feat-all-className-startwith-Up
This commit is contained in:
lvjunzhao
16
.vscode/settings.json
vendored
16
.vscode/settings.json
vendored
@ -86,13 +86,13 @@
|
||||
"editor.codeActionsOnSave": {
|
||||
"source.fixAll.eslint": "explicit"
|
||||
},
|
||||
"[vue]": {
|
||||
"editor.codeActionsOnSave": {
|
||||
"source.fixAll.eslint": "explicit",
|
||||
"source.fixAll.stylelint": "explicit"
|
||||
},
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
},
|
||||
// "[vue]": {
|
||||
// "editor.codeActionsOnSave": {
|
||||
// "source.fixAll.eslint": "explicit",
|
||||
// "source.fixAll.stylelint": "explicit"
|
||||
// },
|
||||
// "editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
// },
|
||||
"i18n-ally.localesPaths": ["src/locales/lang"],
|
||||
"i18n-ally.keystyle": "nested",
|
||||
"i18n-ally.sortKeys": true,
|
||||
@ -137,6 +137,8 @@
|
||||
"pnpm",
|
||||
"antd"
|
||||
],
|
||||
// "files.autoSave": "onFocusChange",
|
||||
// "editor.formatOnSave": true,
|
||||
"eslint.codeActionsOnSave.rules": null,
|
||||
"vue3snippets.enable-compile-vue-file-on-did-save-code": false
|
||||
}
|
||||
|
||||
116
src/api/editProVar/procVarManage/index.ts
Normal file
116
src/api/editProVar/procVarManage/index.ts
Normal file
@ -0,0 +1,116 @@
|
||||
import {ActRuVariablePageModel, ActRuVariablePageParams, ActRuVariablePageResult} from './model/ProcVarManageModel';
|
||||
import {defHttp} from '/@/utils/http/axios';
|
||||
import {ErrorMessageMode} from '/#/axios';
|
||||
|
||||
enum Api {
|
||||
Page = '/editProVar/procVarManage/page',
|
||||
List = '/editProVar/procVarManage/list',
|
||||
Info = '/editProVar/procVarManage/info',
|
||||
ActRuVariable = '/editProVar/procVarManage',
|
||||
GetSerializedVal = '/editProVar/procVarManage/getSerializedVal',
|
||||
UpdateFormVariable = '/editProVar/procVarManage/updateFormVariable',
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 查询ActRuVariable分页列表
|
||||
*/
|
||||
export async function getActRuVariablePage(params: ActRuVariablePageParams, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.get<ActRuVariablePageResult>(
|
||||
{
|
||||
url: Api.Page,
|
||||
params,
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 获取ActRuVariable信息
|
||||
*/
|
||||
export async function getActRuVariable(params: String, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.get<ActRuVariablePageModel>(
|
||||
{
|
||||
url: Api.Info,
|
||||
params,
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 新增ActRuVariable
|
||||
*/
|
||||
export async function addActRuVariable(actRuVariable: Recordable, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.post<boolean>(
|
||||
{
|
||||
url: Api.ActRuVariable,
|
||||
params: actRuVariable,
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 更新ActRuVariable
|
||||
*/
|
||||
export async function updateActRuVariable(actRuVariable: Recordable, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.put<boolean>(
|
||||
{
|
||||
url: Api.ActRuVariable,
|
||||
params: actRuVariable,
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: 删除ActRuVariable（批量删除）
|
||||
*/
|
||||
export async function deleteActRuVariable(ids: string[], mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.delete<boolean>(
|
||||
{
|
||||
url: Api.ActRuVariable,
|
||||
data: ids,
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取表单变量
|
||||
*/
|
||||
export async function getSerializedVal(params, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.get({
|
||||
url: Api.GetSerializedVal,
|
||||
params
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改表单变量
|
||||
*/
|
||||
export async function updateFormVariable(params, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.post(
|
||||
{
|
||||
url: Api.UpdateFormVariable,
|
||||
params: params,
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
79
src/api/editProVar/procVarManage/model/procVarManageModel.ts
Normal file
79
src/api/editProVar/procVarManage/model/procVarManageModel.ts
Normal file
@ -0,0 +1,79 @@
|
||||
import {BasicPageParams, BasicFetchResult} from '/@/api/model/baseModel';
|
||||
|
||||
/**
|
||||
* @description: ActRuVariable分页参数 模型
|
||||
*/
|
||||
export interface ActRuVariablePageParams extends BasicPageParams {
|
||||
name: string;
|
||||
|
||||
type: string;
|
||||
|
||||
value: string;
|
||||
|
||||
varScope: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: ActRuVariable分页返回值模型
|
||||
*/
|
||||
export interface ActRuVariablePageModel {
|
||||
id: string;
|
||||
|
||||
name: string;
|
||||
|
||||
type: string;
|
||||
|
||||
value: string;
|
||||
|
||||
varScope: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: ActRuVariable表类型
|
||||
*/
|
||||
export interface ActRuVariableModel {
|
||||
id: string;
|
||||
|
||||
rev: number;
|
||||
|
||||
type: string;
|
||||
|
||||
value: string;
|
||||
|
||||
executionId: string;
|
||||
|
||||
procInstId: string;
|
||||
|
||||
procDefId: string;
|
||||
|
||||
caseExecutionId: string;
|
||||
|
||||
caseInstId: string;
|
||||
|
||||
taskId: string;
|
||||
|
||||
batchId: string;
|
||||
|
||||
bytearrayId: string;
|
||||
|
||||
doubleVal: number;
|
||||
|
||||
longVal: number;
|
||||
|
||||
text: string;
|
||||
|
||||
text2: string;
|
||||
|
||||
varScope: string;
|
||||
|
||||
sequenceCounter: number;
|
||||
|
||||
isConcurrentLocal: string;
|
||||
|
||||
tenantId: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description: ActRuVariable分页返回值结构
|
||||
*/
|
||||
export type ActRuVariablePageResult = BasicFetchResult<ActRuVariablePageModel>;
|
||||
@ -72,3 +72,15 @@ export async function getFileList(params: FilePageListParams, mode: ErrorMessage
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
export async function getAppToken(params, mode: ErrorMessageMode = 'modal') {
|
||||
return defHttp.get(
|
||||
{
|
||||
url: '/v1/3rd/weboffice/url',
|
||||
params
|
||||
},
|
||||
{
|
||||
errorMessageMode: mode,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
1
src/assets/libs/open-jssdk-v0.1.3.es.js
Normal file
1
src/assets/libs/open-jssdk-v0.1.3.es.js
Normal file
File diff suppressed because one or more lines are too long
@ -29,6 +29,12 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="user-select-box">
|
||||
<div class="select-depart-all" @click="selectAll">
|
||||
<span>全选</span>
|
||||
<div class="select-circle" :class="departAllSelected ? 'selected' : ''" v-if="!viewList">
|
||||
<check-outlined v-if="departAllSelected" />
|
||||
</div>
|
||||
</div>
|
||||
<SelectUserListV2 :multiple="multiple" :data="searchDepartMemberList" emptyDescription="暂无人员" @selectId="changeDepMemberSelect"></SelectUserListV2>
|
||||
<div v-if="false" class="user-select-pagination">
|
||||
<a-pagination v-model:current="searchDepartMemberParams.limit" :pageSize="searchDepartMemberParams.size" :total="searchDepartMemberTotal" />
|
||||
@ -75,6 +81,7 @@
|
||||
import { camelCaseString } from '/@/utils/stringUtil';
|
||||
import { useUserStore } from '/@/store/modules/user';
|
||||
import { Icon } from '/@/components/Icon';
|
||||
import { CheckOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
const emits = defineEmits(['update:value', 'selectedId', 'change']);
|
||||
const { t } = useI18n();
|
||||
@ -128,6 +135,7 @@
|
||||
let resetMemberList = [];
|
||||
const searchPlaceholder = '请输入姓名或工号搜索';
|
||||
const defaultDepts = ref('')
|
||||
const departAllSelected = ref(false)
|
||||
if(props.onlyUserCompany) {
|
||||
const userStore = useUserStore();
|
||||
const userInfo = userStore.getUserInfo;
|
||||
@ -223,7 +231,22 @@
|
||||
});
|
||||
const searchAllMemberTotal = ref(0);
|
||||
const searchAllMemberList = ref([]);
|
||||
|
||||
|
||||
watch(searchDepartMemberList, (val) => {
|
||||
let allSelected = true
|
||||
searchDepartMemberList.value.forEach(item => {
|
||||
if(!item.selected) {
|
||||
allSelected = false
|
||||
}
|
||||
})
|
||||
if(!searchDepartMemberList.value.length) {
|
||||
allSelected = false
|
||||
}
|
||||
departAllSelected.value = allSelected
|
||||
},
|
||||
{
|
||||
deep: true
|
||||
})
|
||||
async function departChange(e) {
|
||||
searchDepartMemberParams.value.departmentId = e.id;
|
||||
let res = await getUserList(searchDepartMemberParams.value);
|
||||
@ -260,6 +283,25 @@
|
||||
return await getUserPageListNew(params);
|
||||
}
|
||||
|
||||
function selectAll() {
|
||||
departAllSelected.value = !departAllSelected.value
|
||||
if(departAllSelected.value) {
|
||||
searchDepartMemberList.value.forEach(item => {
|
||||
if(!item.selected) {
|
||||
selectedMemberList.value.push(item)
|
||||
}
|
||||
item.selected = true
|
||||
})
|
||||
} else {
|
||||
searchDepartMemberList.value.forEach(item => {
|
||||
if(item.selected) {
|
||||
selectedMemberList.value = selectedMemberList.value.filter(m => m.id !== item.id)
|
||||
}
|
||||
item.selected = false
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function departCompleted() {
|
||||
treeLoading.value = false;
|
||||
}
|
||||
@ -441,6 +483,34 @@
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.select-depart-all {
|
||||
height: 30px;
|
||||
padding-left: 14px;
|
||||
padding-right: 21px;
|
||||
padding-bottom: 5px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-radius: 2px;
|
||||
margin-top: 5px;
|
||||
border-bottom: 1px solid #eaeaea;
|
||||
color: #111111;
|
||||
.select-circle {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border: 1px solid rgba(144, 147, 153, 0.7);
|
||||
border-radius: 50%;
|
||||
}
|
||||
.selected {
|
||||
border: none;
|
||||
background-color: #5d9cec;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: white;
|
||||
font-size: 10px
|
||||
}
|
||||
}
|
||||
|
||||
.user-select-title {
|
||||
}
|
||||
|
||||
@ -70,6 +70,19 @@
|
||||
点击上传
|
||||
</a-button>
|
||||
</div>
|
||||
|
||||
<template #itemRender="{ file, actions }">
|
||||
<a-space class="file-space">
|
||||
<PaperClipOutlined/>
|
||||
<span class="file-name-span" @click="actions.preview">{{ file.name }}</span>
|
||||
<a-tooltip v-if="showDownloadIcon" title="下载"><span @click="actions.download" class="file-outlined-span"><DownloadOutlined /></span></a-tooltip>
|
||||
<a-tooltip v-if="!disabled && showRemoveIcon" title="删除"><span @click="actions.remove" class="file-outlined-span"><DeleteOutlined /></span></a-tooltip>
|
||||
<a-tooltip v-if="'.doc,.docx,.xls,.xlsx,.pdf'.includes(file.fileType)" title="编辑文档">
|
||||
<span @click="editFile(file)" class="file-outlined-span"><EditOutlined /></span>
|
||||
</a-tooltip>
|
||||
</a-space>
|
||||
</template>
|
||||
|
||||
</a-upload>
|
||||
<a-modal
|
||||
:bodyStyle="bodyStyle"
|
||||
@ -81,19 +94,31 @@
|
||||
>
|
||||
<iframe v-if="previewVisible" :src="previewFile" class="iframe-box"></iframe>;
|
||||
</a-modal>
|
||||
<a-modal
|
||||
wrap-class-name="full-modal"
|
||||
width="100%"
|
||||
:visible="wpsPreviewVisible"
|
||||
:title="previewTitle"
|
||||
:footer="null"
|
||||
@cancel="handleCancelWps"
|
||||
>
|
||||
<div v-if="wpsPreviewVisible" id="office-container"></div>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import { nextTick, ref, watch } from 'vue';
|
||||
import { Upload } from 'ant-design-vue';
|
||||
import { UploadOutlined, PlusOutlined } from '@ant-design/icons-vue';
|
||||
import { UploadOutlined, PlusOutlined, DownloadOutlined, DeleteOutlined, EditOutlined, PaperClipOutlined } from '@ant-design/icons-vue';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { deleteSingleFile, getFileList } from '/@/api/system/file';
|
||||
import {deleteSingleFile, getAppToken, getFileList, getOnlineEditUrl} from '/@/api/system/file';
|
||||
import { downloadByUrl } from '/@/utils/file/download';
|
||||
import { uploadMultiApi } from '/@/api/sys/upload';
|
||||
import Icon from '/@/components/Icon/index';
|
||||
import { Base64 } from 'js-base64';
|
||||
import { getAppEnvConfig } from '/@/utils/env';
|
||||
import WebOfficeSDK from "/@/assets/libs/open-jssdk-v0.1.3.es.js";
|
||||
import {getToken} from "/@/utils/auth";
|
||||
|
||||
const props = defineProps({
|
||||
value: String,
|
||||
@ -133,6 +158,7 @@
|
||||
const loading = ref(false);
|
||||
|
||||
const previewVisible = ref(false);
|
||||
const wpsPreviewVisible = ref(false);
|
||||
const previewFile = ref('');
|
||||
const previewTitle = ref('');
|
||||
|
||||
@ -254,6 +280,42 @@
|
||||
downloadByUrl({ url, fileName: fileName + fileType });
|
||||
};
|
||||
|
||||
const handleCancelWps = () => {
|
||||
wpsPreviewVisible.value = false;
|
||||
previewTitle.value = '';
|
||||
};
|
||||
|
||||
const refreshToken = async () => {
|
||||
return getToken();
|
||||
}
|
||||
|
||||
const editFile = async (file) => {
|
||||
wpsPreviewVisible.value = true;
|
||||
previewTitle.value = file.name || file.fileName;
|
||||
let appToken = await getAppToken({_w_fileid: file.id});
|
||||
let containerNode = document.getElementById('office-container')
|
||||
containerNode.style.height = "calc(100vh - 50px)";
|
||||
containerNode.style.width = "100%";
|
||||
let webOfficeSdk = WebOfficeSDK.config({
|
||||
mount: containerNode,
|
||||
url: appToken.wpsUrl + '&_w_tokentype=1',
|
||||
refreshToken: refreshToken,
|
||||
})
|
||||
webOfficeSdk.setToken({
|
||||
token: appToken.token,
|
||||
timeout: 10 * 60 * 1000,
|
||||
});
|
||||
|
||||
|
||||
/*await webOfficeSdk.ready();
|
||||
const app = webOfficeSdk.Application;
|
||||
// 获取总页数
|
||||
const totalPages = await app.ActiveDocument.Range.Information(
|
||||
app.Enum.WdInformation.wdNumberOfPagesInDocument
|
||||
);
|
||||
console.log("总页数为：", totalPages);*/
|
||||
}
|
||||
|
||||
const handlePreview = async (file) => {
|
||||
const fileUrl = file.response?.data?.fileUrl || file.fileUrl;
|
||||
previewFile.value =
|
||||
@ -330,4 +392,41 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.file-name-span {
|
||||
margin-right: 16px;
|
||||
color: #1890ff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-outlined-span {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-space:hover {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.file-space {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.full-modal {
|
||||
.ant-modal {
|
||||
max-width: 100%;
|
||||
top: 0;
|
||||
padding-bottom: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.ant-modal-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh);
|
||||
}
|
||||
.ant-modal-body {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,6 +26,10 @@
|
||||
mainKey: String,
|
||||
//组件在子表中的Index
|
||||
tableIndex: Number,
|
||||
valueType: {
|
||||
default: 'Array',
|
||||
type: String
|
||||
}
|
||||
});
|
||||
|
||||
const formModel = inject<any>('formModel', null);
|
||||
@ -34,7 +38,7 @@
|
||||
watch(
|
||||
() => props.value,
|
||||
(val: any) => {
|
||||
modelValue.value = val || [];
|
||||
modelValue.value = props.valueType == 'Array' ? (val || []) : (val ? val.split(',') : '');
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
@ -56,20 +60,20 @@
|
||||
formModel[props.mainKey][props.tableIndex!]?.[props.startField!],
|
||||
formModel[props.mainKey][props.tableIndex!]?.[props.endField!],
|
||||
];
|
||||
emit('update:value', emitData);
|
||||
emit('update:value', props.valueType == 'Array' || !emitData ? emitData : emitData.join(','));
|
||||
} else {
|
||||
if (props.startField && props.endField && Object.keys(formModel).length) {
|
||||
const emitData =
|
||||
!formModel[props.startField] || !formModel[props.endField]
|
||||
? null
|
||||
: [formModel[props.startField], formModel[props.endField]];
|
||||
emit('update:value', emitData);
|
||||
emit('update:value', props.valueType == 'Array' || !emitData ? emitData : emitData.join(','));
|
||||
}
|
||||
}
|
||||
});
|
||||
const handleChange = (time) => {
|
||||
emit('update:value', time);
|
||||
emit('change', time);
|
||||
emit('update:value', props.valueType == 'Array' || !time ? time : time.join(','));
|
||||
emit('change', props.valueType == 'Array' || !time ? time : time.join(','));
|
||||
if (formModel && props.startField && props.endField) {
|
||||
if (props.mainKey) {
|
||||
formModel[props.mainKey][props.tableIndex!][props.startField!] = time?.length
|
||||
|
||||
@ -401,7 +401,7 @@ export default {
|
||||
return ele.id
|
||||
}).join(',');
|
||||
SetChangeProcessNode({
|
||||
'processInstanceId': processId,
|
||||
'taskId': assignee.value.taskId,
|
||||
'targetTaskNodeId': info.taskId,
|
||||
'nextTaskUserMap': {
|
||||
[key]: userIds
|
||||
|
||||
235
src/views/editProVar/procVarManage/components/Form.vue
Normal file
235
src/views/editProVar/procVarManage/components/Form.vue
Normal file
@ -0,0 +1,235 @@
|
||||
<template>
|
||||
<SimpleForm
|
||||
ref="systemFormRef"
|
||||
:formProps="data.formDataProps"
|
||||
:formModel="{}"
|
||||
:isWorkFlow="props.fromPage!=FromPageType.MENU"
|
||||
/>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import {reactive, ref, onMounted, createVNode} from 'vue';
|
||||
import {formProps, formEventConfigs} from './config';
|
||||
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
|
||||
import {addActRuVariable, getActRuVariable, updateActRuVariable, deleteActRuVariable} from '/@/api/editProVar/procVarManage';
|
||||
import {cloneDeep} from 'lodash-es';
|
||||
import {FormDataProps} from '/@/components/Designer/src/types';
|
||||
import {usePermission} from '/@/hooks/web/usePermission';
|
||||
import {FromPageType} from '/@/enums/workflowEnum';
|
||||
import {createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
|
||||
import {changeWorkFlowForm, changeSchemaDisabled} from '/@/hooks/web/useWorkFlowForm';
|
||||
import {WorkFlowFormParams} from '/@/model/workflow/bpmnConfig';
|
||||
import {ExclamationCircleOutlined} from '@ant-design/icons-vue';
|
||||
import {Modal} from "ant-design-vue";
|
||||
import {useMessage} from '/@/hooks/web/useMessage';
|
||||
import {useI18n} from '/@/hooks/web/useI18n';
|
||||
import {useRouter} from "vue-router";
|
||||
|
||||
const router = useRouter();
|
||||
const {filterFormSchemaAuth} = usePermission();
|
||||
const RowKey = 'id';
|
||||
const emits = defineEmits(['changeUploadComponentIds', 'loadingCompleted', 'form-mounted']);
|
||||
const props = defineProps({
|
||||
fromPage: {
|
||||
type: Number,
|
||||
default: FromPageType.MENU,
|
||||
},
|
||||
});
|
||||
const systemFormRef = ref();
|
||||
const data: { formDataProps: FormDataProps } = reactive({
|
||||
formDataProps: cloneDeep(formProps),
|
||||
});
|
||||
const state = reactive({
|
||||
formModel: {},
|
||||
});
|
||||
const {notification} = useMessage();
|
||||
const {t} = useI18n();
|
||||
|
||||
onMounted(async () => {
|
||||
try {
|
||||
if (props.fromPage == FromPageType.MENU) {
|
||||
setMenuPermission();
|
||||
await createFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：初始化表单
|
||||
await loadFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：加载表单
|
||||
} else if (props.fromPage == FromPageType.FLOW) {
|
||||
emits('loadingCompleted'); //告诉系统表单已经加载完毕
|
||||
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
|
||||
} else if (props.fromPage == FromPageType.PREVIEW) {
|
||||
// 预览 无需权限，表单事件也无需执行
|
||||
} else if (props.fromPage == FromPageType.DESKTOP) {
|
||||
// 桌面设计 表单事件需要执行
|
||||
emits('loadingCompleted'); //告诉系统表单已经加载完毕
|
||||
await createFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：初始化表单
|
||||
await loadFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：加载表单
|
||||
}
|
||||
emits('form-mounted', formProps);
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
// 根据菜单页面权限，设置表单属性（必填，禁用，显示）
|
||||
function setMenuPermission() {
|
||||
data.formDataProps.schemas = filterFormSchemaAuth(formProps.schemas!);
|
||||
}
|
||||
|
||||
// 校验form 通过返回表单数据
|
||||
async function validate() {
|
||||
let values = [];
|
||||
try {
|
||||
values = await systemFormRef.value?.validate();
|
||||
//添加隐藏组件
|
||||
if (data.formDataProps.hiddenComponent?.length) {
|
||||
data.formDataProps.hiddenComponent.forEach((component) => {
|
||||
values[component.bindField] = component.value;
|
||||
});
|
||||
}
|
||||
} finally {
|
||||
}
|
||||
return values;
|
||||
}
|
||||
|
||||
// 根据行唯一ID查询行数据，并设置表单数据 【编辑】
|
||||
async function setFormDataFromId(rowId, skipUpdate) {
|
||||
try {
|
||||
const currentRoute = router.currentRoute.value;
|
||||
const queryParams = currentRoute.query;
|
||||
let reqParam = {
|
||||
name: queryParams.name,
|
||||
type: queryParams.type,
|
||||
value: queryParams.value,
|
||||
processInstId: queryParams.processId,
|
||||
};
|
||||
const record = await getActRuVariable(reqParam);
|
||||
if (skipUpdate) {
|
||||
return record;
|
||||
}
|
||||
reqParam.value = record;
|
||||
setFieldsValue(reqParam);
|
||||
state.formModel = reqParam;
|
||||
await getFormDataEvent(formEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件：获取表单数据
|
||||
return reqParam;
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 辅助设置表单数据
|
||||
function setFieldsValue(record) {
|
||||
systemFormRef.value.setFieldsValue(record);
|
||||
}
|
||||
|
||||
// 重置表单数据
|
||||
async function resetFields() {
|
||||
await systemFormRef.value.resetFields();
|
||||
}
|
||||
|
||||
// 设置表单数据全部为Disabled 【查看】
|
||||
async function setDisabledForm(isDisabled) {
|
||||
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas), isDisabled);
|
||||
}
|
||||
|
||||
// 获取行键值
|
||||
function getRowKey() {
|
||||
return RowKey;
|
||||
}
|
||||
|
||||
// 更新api表单数据
|
||||
async function update({values, rowId}) {
|
||||
try {
|
||||
let res = systemFormRef.value.getFieldsValue();
|
||||
debugger
|
||||
let saveVal = await updateActRuVariable(res);
|
||||
await submitFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：提交表单
|
||||
return saveVal;
|
||||
} catch (error) {
|
||||
}
|
||||
}
|
||||
|
||||
// 新增api表单数据
|
||||
async function add(values) {
|
||||
try {
|
||||
state.formModel = values;
|
||||
let saveVal = await addActRuVariable(values);
|
||||
await submitFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：提交表单
|
||||
return saveVal;
|
||||
} catch (error) {
|
||||
}
|
||||
}
|
||||
|
||||
// 根据工作流页面权限，设置表单属性（必填，禁用，显示）
|
||||
async function setWorkFlowForm(obj: WorkFlowFormParams) {
|
||||
try {
|
||||
let flowData = changeWorkFlowForm(cloneDeep(formProps), obj);
|
||||
let {buildOptionJson, uploadComponentIds, formModels, isViewProcess} = flowData;
|
||||
data.formDataProps = buildOptionJson;
|
||||
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
|
||||
if (isViewProcess) {
|
||||
setDisabledForm(); //查看
|
||||
}
|
||||
state.formModel = formModels;
|
||||
if(formModels[RowKey]) {
|
||||
setFormDataFromId(formModels[RowKey], false)
|
||||
} else {
|
||||
setFieldsValue(formModels)
|
||||
}
|
||||
} catch (error) {
|
||||
}
|
||||
await createFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：初始化表单
|
||||
await loadFormEvent(formEventConfigs, state.formModel,
|
||||
systemFormRef.value,
|
||||
formProps.schemas); //表单事件：加载表单
|
||||
}
|
||||
|
||||
// 详情页删除功能
|
||||
function handleDelete(record: Recordable) {
|
||||
deleteList([record]);
|
||||
}
|
||||
|
||||
function deleteList(ids) {
|
||||
Modal.confirm({
|
||||
title: '提示信息',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: '是否确认删除？',
|
||||
okText: '确认',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
deleteActRuVariable(ids).then((_) => {
|
||||
notification.success({
|
||||
message: 'Tip',
|
||||
description: t('删除成功！'),
|
||||
});
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
setFieldsValue,
|
||||
resetFields,
|
||||
validate,
|
||||
add,
|
||||
update,
|
||||
setFormDataFromId,
|
||||
setDisabledForm,
|
||||
setMenuPermission,
|
||||
setWorkFlowForm,
|
||||
getRowKey,
|
||||
handleDelete
|
||||
});
|
||||
</script>
|
||||
101
src/views/editProVar/procVarManage/components/VarModal.vue
Normal file
101
src/views/editProVar/procVarManage/components/VarModal.vue
Normal file
@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:mask-closable="false"
|
||||
:title="title"
|
||||
:visible="visible"
|
||||
:width="600"
|
||||
class="geg"
|
||||
style="top: 120px"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<div class="dialog-wrap">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="Serialized">
|
||||
<a-textarea v-model:value="formData.value" :rows="16" @change="handleChange"/>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<a-alert
|
||||
v-if="showAlert"
|
||||
style="margin-top: 12px"
|
||||
message="警告：您确定要更改此对象的值吗？以不兼容的方式更改变量可能会导致严重的运行时问题。"
|
||||
banner
|
||||
/>
|
||||
</div>
|
||||
<template #footer>
|
||||
<a-button :loading="false" type="default" @click="handleCancel">取消</a-button>
|
||||
<a-button
|
||||
:loading="false"
|
||||
type="danger"
|
||||
@click="handleSubmit"
|
||||
:disabled="disabledSubmit"
|
||||
>
|
||||
修改
|
||||
</a-button>
|
||||
</template>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref, watch} from 'vue';
|
||||
|
||||
const props = defineProps({
|
||||
variableId: String,
|
||||
visible: Boolean,
|
||||
title: {type: String, default: '编辑表单变量'},
|
||||
initialData: {type: Object, default: () => ({value: ''})},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:visible', 'submit', 'cancel']);
|
||||
|
||||
const formData = ref({
|
||||
processId: props.processId,
|
||||
value: props.initialData.value,
|
||||
});
|
||||
|
||||
const oldData = ref({
|
||||
processId: props.initialData.processId,
|
||||
value: props.initialData.value,
|
||||
});
|
||||
|
||||
const activeKey = ref('1');
|
||||
const showAlert = ref(false);
|
||||
const disabledSubmit = ref(true);
|
||||
|
||||
watch(
|
||||
() => props.initialData,
|
||||
(newData) => {
|
||||
formData.value = {...newData};
|
||||
oldData.value = {...newData};
|
||||
disabledSubmit.value = true;
|
||||
showAlert.value = false;
|
||||
activeKey.value = '1'; //默认打开第一个tab
|
||||
},
|
||||
{deep: true},
|
||||
);
|
||||
|
||||
const handleChange = () => {
|
||||
const isModified =
|
||||
formData.value.processId !== oldData.value.processId ||
|
||||
formData.value.value !== oldData.value.value;
|
||||
disabledSubmit.value = !isModified;
|
||||
showAlert.value = isModified;
|
||||
};
|
||||
|
||||
// 提交数据
|
||||
const handleSubmit = () => {
|
||||
emit('submit', formData.value);
|
||||
//emit('update:visible', false);
|
||||
};
|
||||
|
||||
// 关闭弹窗
|
||||
const handleCancel = () => {
|
||||
emit('cancel');
|
||||
emit('update:visible', false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.dialog-wrap {
|
||||
padding: 12px;
|
||||
}
|
||||
</style>
|
||||
225
src/views/editProVar/procVarManage/components/config.ts
Normal file
225
src/views/editProVar/procVarManage/components/config.ts
Normal file
@ -0,0 +1,225 @@
|
||||
import {FormProps, FormSchema} from '/@/components/Form';
|
||||
import {BasicColumn} from '/@/components/Table';
|
||||
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'name',
|
||||
label: '名称',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'type',
|
||||
label: '类型',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'value',
|
||||
label: '值',
|
||||
component: 'Input',
|
||||
},
|
||||
];
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'name',
|
||||
title: '名称',
|
||||
componentType: 'input',
|
||||
align: 'left',
|
||||
sorter: false,
|
||||
},
|
||||
{
|
||||
dataIndex: 'type',
|
||||
title: '类型',
|
||||
componentType: 'input',
|
||||
align: 'left',
|
||||
sorter: false,
|
||||
},
|
||||
{
|
||||
dataIndex: 'value',
|
||||
title: '值',
|
||||
componentType: 'input',
|
||||
align: 'left',
|
||||
sorter: false
|
||||
},
|
||||
];
|
||||
|
||||
//表单事件
|
||||
export const formEventConfigs = {
|
||||
0: [
|
||||
{
|
||||
type: 'circle',
|
||||
color: '#2774ff',
|
||||
text: '开始节点',
|
||||
icon: '#icon-kaishi',
|
||||
bgcColor: '#D8E5FF',
|
||||
isUserDefined: false,
|
||||
},
|
||||
{
|
||||
color: '#F6AB01',
|
||||
icon: '#icon-chushihua',
|
||||
text: '初始化表单',
|
||||
bgcColor: '#f9f5ea',
|
||||
isUserDefined: false,
|
||||
nodeInfo: {processEvent: []},
|
||||
},
|
||||
],
|
||||
1: [
|
||||
{
|
||||
color: '#B36EDB',
|
||||
icon: '#icon-shujufenxi',
|
||||
text: '获取表单数据',
|
||||
detail: '(新增无此操作)',
|
||||
bgcColor: '#F8F2FC',
|
||||
isUserDefined: false,
|
||||
nodeInfo: {processEvent: []},
|
||||
},
|
||||
],
|
||||
2: [
|
||||
{
|
||||
color: '#F8625C',
|
||||
icon: '#icon-jiazai',
|
||||
text: '加载表单',
|
||||
bgcColor: '#FFF1F1',
|
||||
isUserDefined: false,
|
||||
nodeInfo: {processEvent: []},
|
||||
},
|
||||
],
|
||||
3: [
|
||||
{
|
||||
color: '#6C6AE0',
|
||||
icon: '#icon-jsontijiao',
|
||||
text: '提交表单',
|
||||
bgcColor: '#F5F4FF',
|
||||
isUserDefined: false,
|
||||
nodeInfo: {processEvent: []},
|
||||
},
|
||||
],
|
||||
4: [
|
||||
{
|
||||
type: 'circle',
|
||||
color: '#F8625C',
|
||||
text: '结束节点',
|
||||
icon: '#icon-jieshuzhiliao',
|
||||
bgcColor: '#FFD6D6',
|
||||
isLast: true,
|
||||
isUserDefined: false,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export const formProps: FormProps = {
|
||||
labelCol: {span: 3, offset: 0},
|
||||
labelAlign: 'right',
|
||||
layout: 'horizontal',
|
||||
size: 'default',
|
||||
schemas: [
|
||||
{
|
||||
key: 'f3a754603cf54ea98d8a05eee8fbb1ea',
|
||||
field: 'name',
|
||||
label: '名称',
|
||||
type: 'input',
|
||||
component: 'Input',
|
||||
colProps: {span: 24},
|
||||
defaultValue: '',
|
||||
componentProps: {
|
||||
width: '100%',
|
||||
span: '',
|
||||
defaultValue: '',
|
||||
labelWidthMode: 'fix',
|
||||
labelFixWidth: 120,
|
||||
responsive: true,
|
||||
respNewRow: false,
|
||||
placeholder: '请输入名称',
|
||||
maxlength: null,
|
||||
prefix: '',
|
||||
suffix: '',
|
||||
addonBefore: '',
|
||||
addonAfter: '',
|
||||
disabled: true,
|
||||
allowClear: false,
|
||||
showLabel: true,
|
||||
required: false,
|
||||
rules: [],
|
||||
events: {},
|
||||
isSave: false,
|
||||
isShow: true,
|
||||
scan: false,
|
||||
style: {width: '100%'},
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'fb6f3446078f47468407d8514614f5f0',
|
||||
field: 'type',
|
||||
label: '类型',
|
||||
type: 'input',
|
||||
component: 'Input',
|
||||
colProps: {span: 24},
|
||||
defaultValue: '',
|
||||
componentProps: {
|
||||
width: '100%',
|
||||
span: '',
|
||||
defaultValue: '',
|
||||
labelWidthMode: 'fix',
|
||||
labelFixWidth: 120,
|
||||
responsive: true,
|
||||
respNewRow: false,
|
||||
placeholder: '请输入类型',
|
||||
maxlength: null,
|
||||
prefix: '',
|
||||
suffix: '',
|
||||
addonBefore: '',
|
||||
addonAfter: '',
|
||||
disabled: false,
|
||||
allowClear: false,
|
||||
showLabel: true,
|
||||
required: false,
|
||||
rules: [],
|
||||
events: {},
|
||||
isSave: false,
|
||||
isShow: true,
|
||||
scan: false,
|
||||
style: {width: '100%'},
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'd1d2c89ec84b4f039be9debce7bdaa88',
|
||||
field: 'value',
|
||||
label: '值',
|
||||
type: 'input',
|
||||
component: 'Input',
|
||||
colProps: {span: 24},
|
||||
defaultValue: '',
|
||||
componentProps: {
|
||||
width: '100%',
|
||||
span: '',
|
||||
defaultValue: '',
|
||||
labelWidthMode: 'fix',
|
||||
labelFixWidth: 120,
|
||||
responsive: true,
|
||||
respNewRow: false,
|
||||
placeholder: '请输入值',
|
||||
maxlength: null,
|
||||
prefix: '',
|
||||
suffix: '',
|
||||
addonBefore: '',
|
||||
addonAfter: '',
|
||||
disabled: false,
|
||||
allowClear: false,
|
||||
showLabel: true,
|
||||
required: false,
|
||||
rules: [],
|
||||
events: {},
|
||||
isSave: false,
|
||||
isShow: true,
|
||||
scan: false,
|
||||
style: {width: '100%'},
|
||||
},
|
||||
},
|
||||
],
|
||||
showActionButtonGroup: false,
|
||||
buttonLocation: 'center',
|
||||
actionColOptions: {span: 24},
|
||||
showResetButton: false,
|
||||
showSubmitButton: false,
|
||||
hiddenComponent: [],
|
||||
};
|
||||
@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
|
||||
<ModalForm ref="formRef" :fromPage="FromPageType.MENU"/>
|
||||
</BasicModal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref, computed, reactive} from 'vue';
|
||||
import {BasicModal, useModalInner} from '/@/components/Modal';
|
||||
import {useMessage} from '/@/hooks/web/useMessage';
|
||||
import {useI18n} from '/@/hooks/web/useI18n';
|
||||
import {formProps} from './config';
|
||||
import ModalForm from './Form.vue';
|
||||
import {FromPageType} from '/@/enums/workflowEnum';
|
||||
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
const {notification} = useMessage();
|
||||
const formRef = ref();
|
||||
const state = reactive({
|
||||
formModel: {},
|
||||
isUpdate: true,
|
||||
isView: false,
|
||||
isCopy: false,
|
||||
rowId: '',
|
||||
});
|
||||
|
||||
const {t} = useI18n();
|
||||
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
|
||||
state.isUpdate = !!data?.isUpdate;
|
||||
state.isView = !!data?.isView;
|
||||
state.isCopy = !!data?.isCopy;
|
||||
|
||||
setModalProps({
|
||||
destroyOnClose: true,
|
||||
maskClosable: false,
|
||||
showCancelBtn: !state.isView,
|
||||
showOkBtn: !state.isView,
|
||||
canFullscreen: true,
|
||||
width: 900,
|
||||
});
|
||||
if (state.isUpdate || state.isView || state.isCopy) {
|
||||
state.rowId = data.id;
|
||||
if (state.isView) {
|
||||
await formRef.value.setDisabledForm();
|
||||
}
|
||||
await formRef.value.setFormDataFromId(state.rowId);
|
||||
} else {
|
||||
formRef.value.resetFields();
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
|
||||
|
||||
async function saveModal() {
|
||||
let saveSuccess = false;
|
||||
try {
|
||||
const values = await formRef.value?.validate();
|
||||
//添加隐藏组件
|
||||
if (formProps.hiddenComponent?.length) {
|
||||
formProps.hiddenComponent.forEach((component) => {
|
||||
values[component.bindField] = component.value;
|
||||
});
|
||||
}
|
||||
if (values !== false) {
|
||||
try {
|
||||
if (!state.isUpdate || state.isCopy) {
|
||||
saveSuccess = await formRef.value.add(values);
|
||||
} else {
|
||||
saveSuccess = await formRef.value.update({values, rowId: state.rowId});
|
||||
}
|
||||
return saveSuccess;
|
||||
} catch (error) {
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
return saveSuccess;
|
||||
}
|
||||
}
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const saveSuccess = await saveModal();
|
||||
setModalProps({confirmLoading: true});
|
||||
if (saveSuccess) {
|
||||
if (!state.isUpdate || state.isCopy) {
|
||||
//false 新增
|
||||
notification.success({
|
||||
message: 'Tip',
|
||||
description: t('新增成功！'),
|
||||
}); //提示消息
|
||||
} else {
|
||||
notification.success({
|
||||
message: 'Tip',
|
||||
description: t('修改成功！'),
|
||||
}); //提示消息
|
||||
}
|
||||
closeModal();
|
||||
formRef.value.resetFields();
|
||||
emit('success');
|
||||
}
|
||||
} finally {
|
||||
setModalProps({confirmLoading: false});
|
||||
}
|
||||
}
|
||||
|
||||
function handleClose() {
|
||||
formRef.value.resetFields();
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,47 @@
|
||||
export const permissionList = [
|
||||
{
|
||||
required: true,
|
||||
view: true,
|
||||
edit: true,
|
||||
disabled: false,
|
||||
isSaveTable: false,
|
||||
tableName: '',
|
||||
fieldName: '名称',
|
||||
fieldId: 'name',
|
||||
isSubTable: false,
|
||||
showChildren: true,
|
||||
type: 'input',
|
||||
key: 'f3a754603cf54ea98d8a05eee8fbb1ea',
|
||||
children: [],
|
||||
},
|
||||
{
|
||||
required: true,
|
||||
view: true,
|
||||
edit: true,
|
||||
disabled: false,
|
||||
isSaveTable: false,
|
||||
tableName: '',
|
||||
fieldName: '类型',
|
||||
fieldId: 'type',
|
||||
isSubTable: false,
|
||||
showChildren: true,
|
||||
type: 'input',
|
||||
key: 'fb6f3446078f47468407d8514614f5f0',
|
||||
children: [],
|
||||
},
|
||||
{
|
||||
required: true,
|
||||
view: true,
|
||||
edit: true,
|
||||
disabled: false,
|
||||
isSaveTable: false,
|
||||
tableName: '',
|
||||
fieldName: '值',
|
||||
fieldId: 'value',
|
||||
isSubTable: false,
|
||||
showChildren: true,
|
||||
type: 'input',
|
||||
key: 'd1d2c89ec84b4f039be9debce7bdaa88',
|
||||
children: [],
|
||||
},
|
||||
];
|
||||
339
src/views/editProVar/procVarManage/index.vue
Normal file
339
src/views/editProVar/procVarManage/index.vue
Normal file
@ -0,0 +1,339 @@
|
||||
<template>
|
||||
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
|
||||
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
|
||||
<template #toolbar>
|
||||
<template v-for="button in tableButtonConfig" :key="button.code">
|
||||
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
|
||||
<template #icon>
|
||||
<Icon :icon="button.icon"/>
|
||||
</template>
|
||||
{{ button.name }}
|
||||
</a-button>
|
||||
<a-button v-else :type="button.type">
|
||||
<template #icon>
|
||||
<Icon :icon="button.icon"/>
|
||||
</template>
|
||||
{{ button.name }}
|
||||
</a-button>
|
||||
</template>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'value'">
|
||||
<div v-if="record.type.indexOf('Object') === 0">
|
||||
<div :style="{color: '#155cb5',cursor: 'pointer'}" @click="handleOpenModalPage(record)">{{record.value}}</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'action'">
|
||||
<TableAction :actions="getActions(record)"/>
|
||||
<div v-if="record.type.indexOf('Object') !== 0">
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<ProcVarManageModal @register="registerModal" @success="handleSuccess"/>
|
||||
|
||||
<VarModal
|
||||
v-model:visible="isOpenVarModal"
|
||||
:initialData="modalFormData"
|
||||
@submit="handleVarModalSubmit"
|
||||
@cancel="handleVarModalCancel"
|
||||
/>
|
||||
|
||||
</PageWrapper>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref, computed, onMounted, onUnmounted, createVNode, watch,} from 'vue';
|
||||
import {Modal} from 'ant-design-vue';
|
||||
import {ExclamationCircleOutlined} from '@ant-design/icons-vue';
|
||||
import {BasicTable, useTable, TableAction, ActionItem} from '/@/components/Table';
|
||||
import {getActRuVariablePage, deleteActRuVariable, getSerializedVal, updateFormVariable} from '/@/api/editProVar/procVarManage';
|
||||
import {PageWrapper} from '/@/components/Page';
|
||||
import {useMessage} from '/@/hooks/web/useMessage';
|
||||
import {useI18n} from '/@/hooks/web/useI18n';
|
||||
import {usePermission} from '/@/hooks/web/usePermission';
|
||||
import {useRouter} from 'vue-router';
|
||||
import {getActRuVariable} from '/@/api/editProVar/procVarManage';
|
||||
import {useModal} from '/@/components/Modal';
|
||||
import ProcVarManageModal from './components/ProcVarManageModal.vue';
|
||||
import {searchFormSchema, columns} from './components/config';
|
||||
import Icon from '/@/components/Icon/index';
|
||||
import useEventBus from '/@/hooks/event/useEventBus';
|
||||
import VarModal from './components/VarModal.vue';
|
||||
|
||||
const props = defineProps({
|
||||
processId: String,
|
||||
xml: String,
|
||||
schemaId: String,
|
||||
});
|
||||
const {bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED} = useEventBus();
|
||||
const {notification} = useMessage();
|
||||
const {t} = useI18n();
|
||||
defineEmits(['register']);
|
||||
const {filterColumnAuth, filterButtonAuth} = usePermission();
|
||||
//const filterColumns = filterColumnAuth(columns);
|
||||
const filterColumns = columns;
|
||||
const tableRef = ref();
|
||||
//展示在列表内的按钮
|
||||
const actionButtons = ref<string[]>(['view', 'edit', 'copyData', 'delete', 'startwork', 'flowRecord']);
|
||||
const buttonConfigs = computed(() => {
|
||||
const list = [
|
||||
/*{"isUse": true, "name": "新增", "code": "add", "icon": "ant-design:plus-outlined", "isDefault": true, "type": "primary"},*/
|
||||
{"isUse": true, "name": "编辑", "code": "edit", "icon": "ant-design:form-outlined", "isDefault": true},
|
||||
{"isUse": true, "name": "刷新", "code": "refresh", "icon": "ant-design:reload-outlined", "isDefault": true},
|
||||
/*{"isUse": true, "name": "查看", "code": "view", "icon": "ant-design:eye-outlined", "isDefault": true},
|
||||
{"isUse": true, "name": "删除", "code": "delete", "icon": "ant-design:delete-outlined", "isDefault": true}*/
|
||||
]
|
||||
//return filterButtonAuth(list);
|
||||
return list;
|
||||
})
|
||||
const tableButtonConfig = computed(() => {
|
||||
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
|
||||
});
|
||||
const actionButtonConfig = computed(() => {
|
||||
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
|
||||
});
|
||||
const btnEvent = {add: handleAdd, edit: handleEdit, refresh: handleRefresh, view: handleView, delete: handleDelete,}
|
||||
const {currentRoute} = useRouter();
|
||||
const router = useRouter();
|
||||
const formIdComputedRef = ref();
|
||||
formIdComputedRef.value = currentRoute.value.meta.formId
|
||||
const schemaIdComputedRef = ref();
|
||||
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
|
||||
const [registerModal, {openModal}] = useModal();
|
||||
const formName = '流程变量编辑功能';
|
||||
const [registerTable, {reload,}] = useTable({
|
||||
title: '' || (formName + '列表'),
|
||||
api: getActRuVariablePage,
|
||||
rowKey: 'id',
|
||||
columns: filterColumns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16,
|
||||
},
|
||||
schemas: searchFormSchema,
|
||||
fieldMapToTime: [],
|
||||
showResetButton: false,
|
||||
},
|
||||
beforeFetch: (params) => {
|
||||
return {...params, FormId: formIdComputedRef.value, PK: 'id', procInstId: props.processId};
|
||||
},
|
||||
afterFetch: (res) => {
|
||||
tableRef.value.setToolBarWidth();
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 160,
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
slots: {customRender: 'action'},
|
||||
},
|
||||
tableSetting: {
|
||||
size: false,
|
||||
setting: false,
|
||||
},
|
||||
});
|
||||
|
||||
const isOpenVarModal = ref(false);
|
||||
const modalFormData = ref({
|
||||
processInstId: '',
|
||||
key: '',
|
||||
value: '',
|
||||
});
|
||||
|
||||
function dbClickRow(record) {
|
||||
const {processId, taskIds, schemaId} = record.workflowData || {};
|
||||
if (taskIds && taskIds.length) {
|
||||
router.push({
|
||||
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
|
||||
query: {
|
||||
taskId: taskIds[0],
|
||||
formName: formName
|
||||
}
|
||||
});
|
||||
} else if (schemaId && !taskIds && processId) {
|
||||
router.push({
|
||||
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
|
||||
query: {
|
||||
readonly: 1,
|
||||
taskId: '',
|
||||
formName: formName
|
||||
}
|
||||
});
|
||||
} else {
|
||||
router.push({
|
||||
path: '/form/procVarManage/' + record.id + '/viewForm',
|
||||
query: {
|
||||
formPath: 'editProVar/procVarManage',
|
||||
formName: formName
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function buttonClick(code) {
|
||||
btnEvent[code]();
|
||||
}
|
||||
|
||||
function handleAdd() {
|
||||
if (schemaIdComputedRef.value) {
|
||||
router.push({
|
||||
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
|
||||
});
|
||||
} else {
|
||||
router.push({
|
||||
path: '/form/procVarManage/0/createForm',
|
||||
query: {
|
||||
formPath: 'editProVar/procVarManage',
|
||||
formName: formName
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function handleEdit(record: Recordable) {
|
||||
router.push({
|
||||
path: '/form/procVarManage/' + props.id + '/updateForm',
|
||||
query: {
|
||||
formPath: 'editProVar/procVarManage',
|
||||
formName: formName,
|
||||
name: record.name,
|
||||
type: record.type,
|
||||
value: record.value,
|
||||
processId: props.processId,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function handleOpenModalPage(record) {
|
||||
let reqParam = {
|
||||
processInstId: props.processId,
|
||||
name: record.name
|
||||
}
|
||||
const res = await getSerializedVal(reqParam);
|
||||
if (res) {
|
||||
modalFormData.value = {
|
||||
processId: props.processId,
|
||||
key: record.name,
|
||||
value: res,
|
||||
};
|
||||
isOpenVarModal.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
// 处理弹窗提交
|
||||
const handleVarModalSubmit = async (data) => {
|
||||
let res = await updateFormVariable(data)
|
||||
if (res) {
|
||||
isOpenVarModal.value = false;
|
||||
notification.success({message: '更新成功'});
|
||||
await reload();
|
||||
}
|
||||
};
|
||||
|
||||
// 处理弹窗取消
|
||||
const handleVarModalCancel = () => {
|
||||
console.log('用户取消编辑');
|
||||
};
|
||||
|
||||
function handleDelete(record: Recordable) {
|
||||
deleteList([record.id]);
|
||||
}
|
||||
|
||||
function deleteList(ids) {
|
||||
Modal.confirm({
|
||||
title: '提示信息',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: '是否确认删除？',
|
||||
okText: '确认',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
deleteActRuVariable(ids).then((_) => {
|
||||
handleSuccess();
|
||||
notification.success({
|
||||
message: 'Tip',
|
||||
description: t('删除成功！'),
|
||||
});
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function handleRefresh() {
|
||||
reload();
|
||||
}
|
||||
|
||||
function handleSuccess() {
|
||||
reload();
|
||||
}
|
||||
|
||||
function handleView(record: Recordable) {
|
||||
dbClickRow(record);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (schemaIdComputedRef.value) {
|
||||
bus.on(FLOW_PROCESSED, handleRefresh);
|
||||
bus.on(CREATE_FLOW, handleRefresh);
|
||||
} else {
|
||||
bus.on(FORM_LIST_MODIFIED, handleRefresh);
|
||||
}
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
if (schemaIdComputedRef.value) {
|
||||
bus.off(FLOW_PROCESSED, handleRefresh);
|
||||
bus.off(CREATE_FLOW, handleRefresh);
|
||||
} else {
|
||||
bus.off(FORM_LIST_MODIFIED, handleRefresh);
|
||||
}
|
||||
});
|
||||
|
||||
function getActions(record: Recordable): ActionItem[] {
|
||||
const actionsList: ActionItem[] = actionButtonConfig.value?.map((button) => {
|
||||
if (!record.workflowData?.processId) {
|
||||
return {
|
||||
icon: button?.icon,
|
||||
tooltip: button?.name,
|
||||
color: button.code === 'delete' ? 'error' : undefined,
|
||||
onClick: btnEvent[button.code].bind(null, record),
|
||||
};
|
||||
} else {
|
||||
if (button.code === 'view') {
|
||||
return {
|
||||
icon: button?.icon,
|
||||
tooltip: button?.name,
|
||||
onClick: btnEvent[button.code].bind(null, record),
|
||||
};
|
||||
} else {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
});
|
||||
return actionsList;
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-table-selection-col) {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.show {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.hide {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.dialog-wrap {
|
||||
padding: 12px 12px 12px 12px;
|
||||
}
|
||||
</style>
|
||||
@ -21,7 +21,7 @@
|
||||
:key="data.renderKey"
|
||||
>
|
||||
<div class="item" v-for="(item, index) in data.dataSource" :key="index">
|
||||
<div class="image"><img :src="item.backgroundUrl" /></div>
|
||||
<div class="image"><img :src="item.backgroundUrlFixed || item.backgroundUrl" /></div>
|
||||
<div class="edit" @click.stop="handleEdit(item.id)">{{ t('设计') }}</div>
|
||||
<div class="mark">
|
||||
<a-switch
|
||||
|
||||
@ -134,7 +134,7 @@
|
||||
align: 'left',
|
||||
customRender: ({ record }) => {
|
||||
return h(Image, {
|
||||
src: record.fileUrl,
|
||||
src: record.fileUrlFixed,
|
||||
width: '60px',
|
||||
height: '22px',
|
||||
});
|
||||
|
||||
@ -18,9 +18,12 @@
|
||||
<a-tab-pane :key="6" :tab="t('审批记录')">
|
||||
<AuditRecord :processId="processId" :schemaId="schemaId" :xml="xml" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane :key="7 + index" v-for="(item, index) in predecessorTasks" :tab="item.schemaName">
|
||||
<a-tab-pane :key="7" :tab="t('流程变量')">
|
||||
<ProcVarPage :processId="processId" :schemaId="schemaId" :xml="xml" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane :key="8 + index" v-for="(item, index) in predecessorTasks" :tab="item.schemaName">
|
||||
<LookRelationTask
|
||||
v-if="activeKey === 7 + index"
|
||||
v-if="activeKey === 8 + index"
|
||||
:taskId="item.taskId"
|
||||
:processId="item.processId"
|
||||
position="left"
|
||||
@ -38,7 +41,8 @@
|
||||
import { SchemaTaskItem } from '/@/model/workflow/bpmnConfig';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import ChangeRecord from '/@/views/formChange/formChangeLog/index.vue';
|
||||
import AuditRecord from '/@/views/auditOpt/auditRecord/index.vue'
|
||||
import AuditRecord from '/@/views/auditOpt/auditRecord/index.vue';
|
||||
import ProcVarPage from '/@/views/editProVar/procVarManage/index.vue';
|
||||
const { t } = useI18n();
|
||||
let props = withDefaults(
|
||||
defineProps<{
|
||||
|
||||
@ -189,12 +189,15 @@
|
||||
};
|
||||
onMounted(async () => {
|
||||
if (props.id) {
|
||||
data.info = { ...defaultInfo, ...cloneDeep(props.info) };
|
||||
if (data.info.fileType === StampFileTypeAttributes.UPLOAD_PICTURES) {
|
||||
data.photoUrl = data.info.fileUrl;
|
||||
} else {
|
||||
data.signUrl = data.info.fileUrl;
|
||||
}
|
||||
data.info = { ...defaultInfo, ...cloneDeep(props.info) };
|
||||
// 回显时使用fileUrlFixed（如果有），否则使用fileUrl（改了）
|
||||
const displayUrl = props.info.fileUrlFixed || props.info.fileUrl;
|
||||
|
||||
if (data.info.fileType === StampFileTypeAttributes.UPLOAD_PICTURES) {
|
||||
data.photoUrl = displayUrl; // 显示用
|
||||
} else {
|
||||
data.signUrl = displayUrl; // 显示用
|
||||
}
|
||||
} else {
|
||||
data.info = defaultInfo;
|
||||
}
|
||||
@ -221,9 +224,13 @@
|
||||
data.info.fileUrl = base64;
|
||||
const blob = dataURLtoBlob(base64);
|
||||
|
||||
const fileUrl = await uploadBlobApi(blob, t('手写签名.png'));
|
||||
if (fileUrl) {
|
||||
data.signUrl = fileUrl;
|
||||
const response = await uploadBlobApi(blob, t('手写签名.png'));
|
||||
if (response) {
|
||||
// 存储原始URL到info.fileUrl（用于提交）（改了）
|
||||
data.info.fileUrl = response.fileUrl;
|
||||
|
||||
// 显示使用fileUrlFixed（如果有），否则使用fileUrl（改了）
|
||||
data.signUrl = response.fileUrlFixed || response.fileUrl;
|
||||
message.success(t('手写签章上传成功'));
|
||||
} else {
|
||||
message.error(t('手写签章上传失败'));
|
||||
@ -283,7 +290,11 @@
|
||||
if (info.file && info.file.response && info.file.response.code == 0) {
|
||||
message.success(t(`{name}上传成功！`, { name: info.file.name }));
|
||||
console.log(info, t('上传成功'));
|
||||
data.photoUrl = info.file.response.data.fileUrl;
|
||||
// 存储原始URL到info.fileUrl（用于提交）（改了）
|
||||
data.info.fileUrl = info.file.response.data.fileUrl;
|
||||
|
||||
// 显示使用fileUrlFixed（如果有），否则使用fileUrl （改了）
|
||||
data.photoUrl = info.file.response.data.fileUrlFixed || info.file.response.data.fileUrl;
|
||||
} else {
|
||||
message.error(t('上传照片失败'));
|
||||
}
|
||||
|
||||
6
types/config.d.ts
vendored
6
types/config.d.ts
vendored
@ -140,7 +140,7 @@ export interface GlobConfig {
|
||||
urlPrefix?: string;
|
||||
// Project abbreviation
|
||||
shortName: string;
|
||||
tenantEnabled: boolean;
|
||||
tenantEnabled: boolean;
|
||||
// outlink
|
||||
outLink?: string;
|
||||
//print url
|
||||
@ -163,8 +163,10 @@ export interface GlobEnvConfig {
|
||||
//file preview
|
||||
VITE_GLOB_UPLOAD_PREVIEW?: string;
|
||||
VITE_GLOB_REPORT_URL: string;
|
||||
VITE_GLOB_TENANT_ENABLED: boolean;
|
||||
VITE_GLOB_TENANT_ENABLED: boolean;
|
||||
VITE_GLOB_DISABLE_NEWS: boolean;
|
||||
VITE_GLOB_CLOSE_ALERT_DISABLED: boolean;
|
||||
VITE_GLOB_TENANT_INPUT_REQUIRED: boolean;
|
||||
}
|
||||
|
||||
export interface LogoConfig {
|
||||
|
||||
Reference in New Issue
Block a user