在线表单流程用户任务支持组件显隐设置

OrangeFormsOpen-VUE3/src/api/flow/FlowOperationController.ts

@@ -278,4 +278,12 @@ export default class FlowOperationController extends BaseController {
       httpOptions,
     );
   }
+  // 获取用户任务信息
+  static viewTaskFormKey(params: ANY_OBJECT, httpOptions?: RequestOption) {
+    return super.get<ANY_OBJECT>(
+      API_CONTEXT + '/flow/flowOperation/viewTaskFormKey',
+      params,
+      httpOptions,
+    );
+  }
 }

OrangeFormsOpen-VUE3/src/api/system/DictionaryController.ts

@@ -7,7 +7,8 @@ import { API_CONTEXT } from '../config';
 export default class DictionaryController extends BaseController {
   static dictSysRole(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/sysRole/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/sysRole/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('角色字典', res.data);
           resolve(dictData);
@@ -20,7 +21,8 @@ export default class DictionaryController extends BaseController {
   // 全局编码字典
   static dictGlobalDict(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/globalDict/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/globalDict/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase(
             '编码字典',
@@ -42,7 +44,8 @@ export default class DictionaryController extends BaseController {
 
   static dictGlobalDictByIds(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/globalDict/listDictByIds', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/globalDict/listDictByIds', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('编码字典', res.data);
           resolve(dictData);
@@ -55,7 +58,8 @@ export default class DictionaryController extends BaseController {
 
   static dictSysDept(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/sysDept/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/sysDept/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('部门字典', res.data);
           resolve(dictData);
@@ -71,7 +75,8 @@ export default class DictionaryController extends BaseController {
     httpOptions?: RequestOption,
   ): Promise<DictionaryBase> {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/sysDept/listDictByParentId', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/sysDept/listDictByParentId', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('部门字典', res.data);
           resolve(dictData);
@@ -84,7 +89,8 @@ export default class DictionaryController extends BaseController {
 
   static dictSysMenu(params: ANY_OBJECT, httpOptions?: RequestOption): Promise<DictionaryBase> {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/sysMenu/listMenuDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/sysMenu/listMenuDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('菜单字典', res.data);
           resolve(dictData);
@@ -97,7 +103,8 @@ export default class DictionaryController extends BaseController {
 
   static dictDeptPost(params: ANY_OBJECT, httpOptions?: RequestOption): Promise<ANY_OBJECT[]> {
     return new Promise((resolve, reject) => {
-      super.get<ANY_OBJECT[]>(
+      super
+        .get<ANY_OBJECT[]>(
           API_CONTEXT + '/upms/sysDept/listSysDeptPostWithRelation',
           params,
           httpOptions,
@@ -112,7 +119,8 @@ export default class DictionaryController extends BaseController {
   }
   static dictSysPost(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/upms/sysPost/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/upms/sysPost/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('岗位字典', res.data);
           resolve(dictData);
@@ -125,7 +133,8 @@ export default class DictionaryController extends BaseController {
 
   static dictReportDblink(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/report/reportDblink/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/report/reportDblink/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('数据库链接', res.data);
           resolve(dictData);
@@ -138,7 +147,8 @@ export default class DictionaryController extends BaseController {
 
   static dictReportDict(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/report/reportDict/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/report/reportDict/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('报表字典', res.data);
           resolve(dictData);
@@ -150,7 +160,8 @@ export default class DictionaryController extends BaseController {
   }
   static dictAreaCode(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/app/areaCode/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/app/areaCode/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('行政区划', res.data);
           resolve(dictData);
@@ -163,7 +174,8 @@ export default class DictionaryController extends BaseController {
 
   static dictAreaCodeByParentId(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/app/areaCode/listDictByParentId', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/app/areaCode/listDictByParentId', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('行政区划', res.data);
           resolve(dictData);
@@ -177,7 +189,8 @@ export default class DictionaryController extends BaseController {
   // 业务相关的接口
   static dictKnowledge(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>('/admin/app/knowledge/listDict', params, httpOptions)
+      super
+        .get<DictData[]>('/admin/app/knowledge/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('知识点字典', res.data);
           resolve(dictData);
@@ -190,7 +203,8 @@ export default class DictionaryController extends BaseController {
 
   static dictStudent(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>(API_CONTEXT + '/app/student/listDict', params, httpOptions)
+      super
+        .get<DictData[]>(API_CONTEXT + '/app/student/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('学生字典', res.data);
           dictData.setList(res.data);
@@ -204,7 +218,8 @@ export default class DictionaryController extends BaseController {
 
   static dictTeacher(params: ANY_OBJECT, httpOptions?: RequestOption) {
     return new Promise<DictionaryBase>((resolve, reject) => {
-      super.get<DictData[]>('/admin/app/teacher/listDict', params, httpOptions)
+      super
+        .get<DictData[]>('/admin/app/teacher/listDict', params, httpOptions)
         .then(res => {
           const dictData = new DictionaryBase('老师字典', res.data);
           resolve(dictData);

OrangeFormsOpen-VUE3/src/common/staticDict/generated.ts

@@ -1,4 +1,3 @@
 import { DictionaryBase } from './types';
 
-
 export {};

OrangeFormsOpen-VUE3/src/online/components/OnlineCustomBlock.vue

@@ -220,7 +220,6 @@ const values = computed({
     return props.value;
   },
   set(val: Array<ANY_OBJECT>) {
-    console.log('block values>>>>>>>>>>>>', val);
     emit('update:value', val);
   },
 });

OrangeFormsOpen-VUE3/src/online/components/OnlineCustomWidget.vue

@@ -355,6 +355,10 @@ const getWidgetProps = computed(() => {
 });
 
 const getDisabledStatus = () => {
+  const formWidgetAuth: ANY_OBJECT | null = form().formAuth()
+    ? form().formAuth().pc[pps.widget.variableName]
+    : null;
+  if (formWidgetAuth && formWidgetAuth.disabled) return true;
   return pps.widget.props.disabled;
 };
 

OrangeFormsOpen-VUE3/src/pages/online/OnlinePageRender/OnlineEditForm/index.vue

@@ -259,7 +259,6 @@ const {
 } = useForm(props);
 
 provide('form', () => {
-  console.log('provide form1', props, form);
   return {
     ...form.value,
     mode: props.mode || 'pc',

OrangeFormsOpen-VUE3/src/pages/online/OnlinePageRender/OnlineWorkFlowForm/index.vue

@@ -68,6 +68,7 @@ const props = withDefaults(
     isEdit: false,
     readOnly: false,
     fullscreen: false,
+    flowInfo: undefined,
     mode: 'pc',
   },
 );
@@ -82,6 +83,7 @@ const {
   rules,
   masterTable,
   formData,
+  formAuth,
   richEditWidgetList,
   tableWidgetList,
   getWidgetValue,
@@ -132,6 +134,9 @@ provide('form', () => {
       return props.currentWidget === widget;
     },
     getWidgetObject: widgetData.getWidgetObject,
+    formAuth: () => {
+      return formAuth.value;
+    },
   };
 });
 
@@ -228,11 +233,58 @@ const initFormData = () => {
   });
 };
 
+const viewTaskFormKey = () => {
+  if (
+    props.flowInfo == null ||
+    props.flowInfo.taskId == null ||
+    props.flowInfo.taskId === '' ||
+    props.flowInfo.processInstanceId == null ||
+    props.flowInfo.processInstanceId === ''
+  ) {
+    return Promise.resolve();
+  }
+  let paraams = {
+    processInstanceId: props.flowInfo.processInstanceId,
+    taskId: props.flowInfo.taskId,
+  };
+  return new Promise<void>((resolve, reject) => {
+    FlowOperationController.viewTaskFormKey(paraams)
+      .then(res => {
+        try {
+          let temp = JSON.parse(res.data);
+          formAuth.value = temp.formAuth;
+          Object.keys(formAuth.value || {}).forEach(key => {
+            let formAuthItem = formAuth.value[key];
+            Object.keys(formAuthItem).forEach(subKey => {
+              let authItem = formAuthItem[subKey];
+              if (authItem && authItem != null && authItem !== '') {
+                formAuthItem[subKey] = authItem.split(',').map(item => parseInt(item));
+              } else {
+                formAuthItem[subKey] = [0, 0];
+              }
+              let disabled = formAuthItem[subKey][0] === 1;
+              let hide = formAuthItem[subKey][1] === 1;
+              formAuthItem[subKey].disabled = disabled;
+              formAuthItem[subKey].hide = hide;
+            });
+          });
+          console.log(formAuth.value);
+        } catch (e) {
+          formAuth.value = null;
+        }
+        resolve();
+      })
+      .catch(e => {
+        reject(e);
+      });
+  });
+};
+
 onMounted(() => {
   isReady.value = false;
   if (!props.isEdit) {
+    viewTaskFormKey().then(() => {
       initWidgetRule();
-
       initFormData()
         .then(() => {
           initWidgetLinkage();
@@ -243,8 +295,11 @@ onMounted(() => {
         .catch((e: Error) => {
           console.warn(e);
         });
-  }
       isReady.value = true;
+    });
+  } else {
+    isReady.value = true;
+  }
 });
 
 const getFormDataImpl = (variableList: ANY_OBJECT[] | null = null) => {

OrangeFormsOpen-VUE3/src/pages/online/OnlinePageRender/hooks/useForm.ts

@@ -142,7 +142,11 @@ export const useForm = (props: ANY_OBJECT, formRef: Ref<FormInstance> | null = n
       return getSystemVariableValue(widget.bindData.systemVariableType);
     }
   };
-  const getWidgetVisible = () => {
+  const getWidgetVisible = widget => {
+    const formWidgetAuth: ANY_OBJECT | null = formAuth.value
+      ? formAuth.value.pc[widget.variableName]
+      : null;
+    if (formWidgetAuth && formWidgetAuth.hide) return false;
     return true;
   };
   const onValueChange = (widget: ANY_OBJECT, value: ANY_OBJECT) => {
@@ -295,7 +299,8 @@ export const useForm = (props: ANY_OBJECT, formRef: Ref<FormInstance> | null = n
     }
   };
   const checkOperationPermCode = (operation: ANY_OBJECT | null) => {
-    if (dialogParams.value.formConfig.formType !== SysOnlineFormType.QUERY || props.isEdit) return true;
+    if (dialogParams.value.formConfig.formType !== SysOnlineFormType.QUERY || props.isEdit)
+      return true;
     return checkPermCodeExist(getOperationPermCode(operation));
   };
   const checkOperationDisabled = (
@@ -592,7 +597,9 @@ export const useForm = (props: ANY_OBJECT, formRef: Ref<FormInstance> | null = n
         });
       }
       if (widget.props.dictInfo && widget.props.dictInfo.dictId) {
-        widget.props.dictInfo.dict = dialogParams.value.formConfig.dictMap.get(widget.props.dictInfo.dictId);
+        widget.props.dictInfo.dict = dialogParams.value.formConfig.dictMap.get(
+          widget.props.dictInfo.dictId,
+        );
       }
       if (widget.column && widget.column.dictInfo != null) {
         dropdownWidgetList.push(widget);
@@ -663,8 +670,10 @@ export const useForm = (props: ANY_OBJECT, formRef: Ref<FormInstance> | null = n
       });
     }
     errorMessage.value = [];
-    if (dialogParams.value.formConfig.tableWidget) initWidget(dialogParams.value.formConfig.tableWidget);
+    if (dialogParams.value.formConfig.tableWidget)
-    if (dialogParams.value.formConfig.leftWidget) initWidget(dialogParams.value.formConfig.leftWidget);
+      initWidget(dialogParams.value.formConfig.tableWidget);
+    if (dialogParams.value.formConfig.leftWidget)
+      initWidget(dialogParams.value.formConfig.leftWidget);
     if (errorMessage.value.length > 0) {
       console.error(errorMessage);
     }
@@ -899,12 +908,15 @@ export const useForm = (props: ANY_OBJECT, formRef: Ref<FormInstance> | null = n
       });
   };
 
+  const formAuth = ref();
+
   return {
     rules,
     isReady,
     dialogParams,
     form,
     formData,
+    formAuth,
     masterTable,
     isRelation,
     tableWidgetList,

OrangeFormsOpen-VUE3/src/pages/workflow/handlerFlowTask/index.vue

@@ -352,7 +352,8 @@ const handlerStart = (
   } else {
     preHandlerOperation(operation, true, xml)
       .then(res => {
-        getMasterData(operation.type, (res || {}).assignee).then(formData => {
+        getMasterData(operation.type, (res || {}).assignee)
+          .then(formData => {
             FlowOperationController.startAndTakeUserTask(
               {
                 processDefinitionKey: dialogParams.value.processDefinitionKey,

OrangeFormsOpen-VUE3/src/pages/workflow/package/refactor/form/flowFormConfig.vue

@@ -35,6 +35,8 @@
           />
         </el-select>
       </el-form-item>
+      <el-row>
+        <el-col :span="12">
           <el-form-item label="允许编辑" style="margin-bottom: 4px">
             <template #label>
               <span>允许编辑</span>
@@ -45,6 +47,24 @@
               />
             </template>
           </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+            v-if="flowEntryComputed.bindFormType === SysFlowEntryBindFormType.ONLINE_FORM"
+          >
+            <template #label>
+              <span>表单权限设置</span>
+              <el-button
+                type="primary"
+                size="mini"
+                style="margin-left: 18px"
+                @click="onSetOnlineFormAuth"
+                >设置</el-button
+              >
+            </template>
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
     <el-row v-else-if="tabType === 'button'" style="padding-top: 3px">
       <!-- <el-col :span="24">
@@ -107,15 +127,17 @@
 </template>
 
 <script setup lang="ts">
-import { ElMessageBox } from 'element-plus';
+import { getUUID } from '@/common/utils/index';
+import { ElMessageBox, ElMessage } from 'element-plus';
 import { VxeTable, VxeColumn } from 'vxe-table';
 import { ANY_OBJECT } from '@/types/generic';
 import { Dialog } from '@/components/Dialog';
 import { SysOnlineFormType } from '@/common/staticDict/index';
 import { SysFlowEntryBindFormType, SysFlowTaskOperationType } from '@/common/staticDict/flow';
 import EditOperation from './formEditOperation.vue';
-
+import FormSetOnlineFormAuth from './formSetOnlineFormAuth.vue';
 import { useLayoutStore } from '@/store';
+
 const layoutStore = useLayoutStore();
 
 const props = defineProps<{ id: string; type: string; tabType: string }>();
@@ -137,6 +159,7 @@ const form = ref();
 const formData = ref<ANY_OBJECT>({
   formId: flowEntry().value.defaultFormId,
   routerName: flowEntry().value.defaultRouterName,
+  formAuth: {},
   editable: false,
 });
 const operationList = ref<ANY_OBJECT>({});
@@ -163,9 +186,94 @@ const getFlowEntryValidStatus = computed(() => {
   }
 });
 
+const currentForm = computed(() => {
+  return formList().find((item: ANY_OBJECT) => item.formId === formData.value.formId);
+});
+
+const formatOnlineFormInfo = formInfo => {
+  if (formInfo == null) return null;
+  let children;
+  if (Array.isArray(formInfo.childWidgetList) && formInfo.childWidgetList.length > 0) {
+    children = formInfo.childWidgetList.map(subWidget => formatOnlineFormInfo(subWidget));
+  }
+  return {
+    formId: getUUID(),
+    showName: formInfo.showName,
+    variableName: formInfo.variableName,
+    widgetType: formInfo.widgetType,
+    children: children,
+  };
+};
+
+const onSetOnlineFormAuth = () => {
+  if (currentForm.value == null) {
+    ElMessage.error('请先选择表单！');
+    return;
+  }
+  let formWidgetConfig = JSON.parse(currentForm.value.widgetJson);
+  let tempConfig = {
+    pc: {
+      widgetList: [],
+    },
+    mobile: {
+      widgetList: [],
+    },
+  };
+  if (formWidgetConfig != null) {
+    if (
+      formWidgetConfig.pc &&
+      Array.isArray(formWidgetConfig.pc.widgetList) &&
+      formWidgetConfig.pc.widgetList.length > 0
+    ) {
+      tempConfig.pc = {
+        widgetList: formWidgetConfig.pc.widgetList.map(subWidget =>
+          formatOnlineFormInfo(subWidget),
+        ),
+      };
+    }
+    if (
+      formWidgetConfig.mobile &&
+      Array.isArray(formWidgetConfig.mobile.widgetList) &&
+      formWidgetConfig.mobile.widgetList.length > 0
+    ) {
+      tempConfig.mobile = {
+        widgetList: formWidgetConfig.mobile.widgetList.map(subWidget => formatOnlineFormInfo(subWidget))
+      };
+    }
+  }
+  console.log(tempConfig);
+  Dialog.show<ANY_OBJECT>(
+    '设置表单权限',
+    FormSetOnlineFormAuth,
+    {
+      area: ['1000px', '700px']
+    },
+    {
+      formAuth: formData.value.formAuth || {},
+      formWidgetConfig: tempConfig,
+      path: 'thirdSetOnlineFormAuth'
+    },
+    {
+      width: '1000px',
+      height: '700px',
+      pathName: '/thirdParty/formSetOnlineFormAuth',
+    },
+  )
+    .then(res => {
+      formData.value.formAuth = res;
+      updateElementFormKey();
+    })
+    .catch(e => {
+      console.warn(e);
+    });
+};
+
 const refreshData = (data: ANY_OBJECT) => {
   if (data.path === 'thirdEditOperation' && data.isSuccess) {
     updateEditOperation(data.data);
+  } else if (data.path === 'thirdSetOnlineFormAuth' && data.isSuccess) {
+    formData.value.formAuth = data.data;
+    updateElementFormKey();
   }
 };
 const resetFormList = () => {
@@ -176,6 +284,7 @@ const resetFormList = () => {
     formData.value = {
       formId: formObj.formId,
       routerName: formObj.routerName,
+      formAuth: formObj.formAuth || {},
       editable: !formObj.readOnly,
       groupType: formObj.groupType || 'ASSIGNEE',
     };
@@ -208,6 +317,7 @@ const updateElementFormKey = () => {
         flowEntry().value.bindFormType === SysFlowEntryBindFormType.ONLINE_FORM
           ? undefined
           : formData.value.routerName,
+      formAuth: formData.value.formAuth,
       readOnly: !formData.value.editable,
       groupType: formData.value.groupType || 'ASSIGNEE',
     });

OrangeFormsOpen-VUE3/src/router/systemRouters.ts

@@ -309,13 +309,20 @@ export const routers: Array<RouteRecordRaw> = [
         props: getProps,
         component: () => import('@/pages/workflow/components/CopyForSelect/addCopyForItem.vue'),
       },
-      // 流程设计-抄送
+      // 流程设计-任务操作按钮
       {
         path: 'thirdEditOperation',
         name: 'thirdEditOperation',
         props: getProps,
         component: () => import('@/pages/workflow/package/refactor/form/formEditOperation.vue'),
       },
+      // 流程设计-设置表单权限
+      {
+        path: 'thirdSetOnlineFormAuth',
+        name: 'thirdSetOnlineFormAuth',
+        props: getProps,
+        component: () => import('@/pages/workflow/package/refactor/form/formSetOnlineFormAuth.vue'),
+      },
       // 流程设计-添加变量
       {
         path: 'thirdFormEditFlowEntryVariable',