Merge pull request 'master' (#121) from master into prod

Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/121

src/views/home/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="home-bg">
     <el-row gutter="20">
-      <el-col :xs="24" :sm="16" :md="18" :lg="20" :xl="20">
+      <el-col :xs="24" :sm="24" :md="18" :lg="18" :xl="18">
         <div class="left">
           <h3>我的科创工作</h3>
           <el-row :gutter="20" class="statistics">
@@ -16,14 +16,14 @@
             </el-col>
           </el-row>
           <h4>待办 ({{ todoNum }})</h4>
-          <fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick">
+          <fvTable ref="tableIns" class="home-table" :tableConfig="tableConfig" @headBtnClick="headBtnClick">
             <template #empty>
               <el-empty description="暂无待办"/>
             </template>
           </fvTable>
         </div>
       </el-col>
-      <el-col :xs="24" :sm="8" :md="6" :lg="4" :xl="4">
+      <el-col :xs="24" :sm="24" :md="6" :lg="6" :xl="6">
         <div class="right">
           <!--          <div class="right-top">-->
           <!--            <h3>欢迎回来， Sunshine</h3>-->
@@ -161,13 +161,31 @@ const headBtnClick = (key) => {
   .right {
     margin-top: 10px;
   }
-}
+  :deep(.el-table) {
+    height: 300px!important;
+  }
 
+
+}
+@media only screen and (max-width: 1000px) {
+  .right {
+    margin-top: 10px;
+  }
+  :deep(.el-table) {
+    height: 300px!important;
+  }
+
+}
 //.right-gap {
 //  background-color: #EFEFEF;
 //  width: 20px;
 //  //margin-right: -10px;
 //}
+:deep(.el-table) {
+  //height: 200px;
+  //max-height: 400px;
+}
+
 .home-bg {
   height: calc(100vh - 130px);
   max-height: calc(100vh - 96px);
@@ -201,6 +219,7 @@ const headBtnClick = (key) => {
     border-radius: 10px;
     background-color: #ffffff;
 
+
     .el-table__empty-block {
       .el-empty {
         padding: 10px 0;
@@ -276,7 +295,7 @@ const headBtnClick = (key) => {
       background-color: #ffffff;
     }
 
-     .right-top {
+    .right-top {
       flex: 0.48;
 
       > div:first-child {

src/views/projectdemand/demandcollection/detail.vue

@@ -1,30 +1,39 @@
 <template>
   <div class="detail-block">
-    <div class="left-info">
+    <el-row gutter="20">
-      <baseTitle title="需求征集详情"></baseTitle>
+      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="14">
-      <div class="info">
+        <div class="left-info">
-        <div v-for="item in list">
+          <baseTitle title="需求征集详情"></baseTitle>
-          <span>{{ item.title }}：</span>
+          <div class="info">
-          <span>{{ item.text }}</span>
+            <div v-for="item in list">
+              <span>{{ item.title }}：</span>
+              <span>{{ item.text }}</span>
+            </div>
+          </div>
+          <baseTitle title="征集说明"></baseTitle>
+          <el-card>
+            {{ instructions }}
+          </el-card>
+          <baseTitle title="申请文件"></baseTitle>
+          <fvTable ref="tableIns" style="max-height: 200px" :tableConfig="tableConfig" @headBtnClick="headBtnClick" :pagination="false"></fvTable>
+          <baseTitle title="审核意见"></baseTitle>
+          <el-input
+              v-model="auditOpinion"
+              :rows="3"
+              type="textarea"
+              placeholder="请输入审核意见"
+          />
         </div>
-      </div>
+      </el-col>
-      <baseTitle title="征集说明"></baseTitle>
+      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="10">
-      <el-card>
+        <div class="approval-record" >
-        {{ instructions }}
+          <baseTitle title="审批记录"></baseTitle>
-      </el-card>
+          <div class="process" id="approvalRecord">
-      <baseTitle title="申请文件"></baseTitle>
+            <process-tree ref="processTree" mode="view" id-name="approvalRecord"/>
-      <fvTable ref="tableIns" style="max-height: 200px" :tableConfig="tableConfig" @headBtnClick="headBtnClick" :pagination="false"></fvTable>
+          </div>
-      <baseTitle title="审核意见"></baseTitle>
+        </div>
-      <el-input
+      </el-col>
-          v-model="auditOpinion"
+    </el-row>
-          :rows="3"
-          type="textarea"
-          placeholder="请输入审核意见"
-      />
-    </div>
-    <div class="approval-record">
-      <baseTitle title="审批记录"></baseTitle>
-    </div>
     <div class="oper-page-btn">
       <el-button  @click="handleSubmit">驳回</el-button>
       <el-button color="#DED0B2" @click="handleBack">同意</el-button>
@@ -33,7 +42,11 @@
 </template>
 
 <script setup lang="jsx">
-
+import {getInitiateInfo} from "@/api/workflow/process-definition.js";
+import ProcessTree from '@/views/workflow/process/ProcessTree.vue';
+import {useProcessStore} from '@/stores/processStore.js';
+import {ElMessage} from "element-plus";
+const processStore = useProcessStore()
 const list = ref([
   {
     title: '名称',
@@ -49,6 +62,7 @@ const list = ref([
     text: '名称名称名称名称'
   },
 ])
+const processTree = ref()
 const instructions = ref('ds')
 const auditOpinion = ref('')
 const tableConfig = reactive({
@@ -79,19 +93,33 @@ const tableConfig = reactive({
       }
     }
   ],
-  api: '/admin/role'
+  api: ''
 })
-
+const getTree=async()=>{
+   getInitiateInfo('pronode_46c5e446-b4d1-495e-a97d-40667fa6aa9f').then(res => {
+    console.log('res11',res)
+    // processDefinition.value = res.data;
+    //构建表单及校验规则
+    processStore.setDesign(res.data)
+    nextTick(() => {
+      processTree.value.init()
+    })
+  }).catch(err => {
+    ElMessage.error(err);
+  });
+}
+getTree()
 </script>
 
 <style lang="scss" scoped>
 .detail-block {
   display: flex;
-  justify-content: space-around;
+  justify-content: space-between;
+  overflow-x: hidden;
+  overflow-y: auto;
 
   .left-info {
     flex: 0.6;
-    margin-right: 30px;
 
     .info {
       display: flex;
@@ -113,6 +141,31 @@ const tableConfig = reactive({
 
   .approval-record {
     flex: 0.4;
+
+
+    .process{
+      //max-height: calc(100vh - 96px);
+      height: calc(100vh - 250px);
+      overflow: auto;
+      &::-webkit-scrollbar {
+        width: 6px;
+        height: 6px;
+      }
+
+      // 滚动条轨道
+      &::-webkit-scrollbar-track {
+        background: rgb(239, 239, 239);
+        border-radius: 2px;
+      }
+
+      // 小滑块
+      &::-webkit-scrollbar-thumb {
+        background: rgba(80, 81, 82, 0.29);
+        border-radius: 10px;
+      }
+    }
+
+
   }
 }
 

src/views/workflow/approve/InitiateProcess.vue

@@ -2,8 +2,9 @@
   <div v-loading="loading" class="initiate_process">
     <div v-if="!loading" style="min-width:30%">
       <!--渲染表单-->
-      <form-render class="process-form" ref="initiateForm" :form-items="processDefinition.formItems"
+      <!--      todo 关闭以前的表单渲染 , 此处需要根据参数来定制当前需要展示的页面信息 -->
-                   v-model:value="formData" mode="E"/>
+      <!--      <form-render class="process-form" ref="initiateForm" :form-items="processDefinition.formItems"-->
+      <!--                   v-model:value="formData" mode="E"/>-->
     </div>
     <div v-if="!loading" id="approveTree"
          style="display: flex;justify-content: center;flex-direction: column;min-width:60%">
@@ -18,8 +19,9 @@ import {getInitiateInfo} from "@/api/workflow/process-definition.js";
 import ProcessTree from '@/views/workflow/process/ProcessTree.vue'
 import FormRender from '@/views/workflow/form/FormRender.vue'
 import {useProcessStore} from '@/stores/processStore.js'
+
 const processStore = useProcessStore()
-import {defineProps,defineExpose} from 'vue'
+import {defineProps, defineExpose} from 'vue'
 import {ElMessage} from "element-plus";
 
 const props = defineProps({

src/views/workflow/approve/index.vue

@@ -101,6 +101,7 @@ const handleReset = () => {
 }
 
 const submitForm = () => {
+  // todo 重新编写表单数据, 不适用当前的动态表单
   let formData = processInstance.value.formData
   let paramsData = {
     processDefinitionId: selectItem.value.processDefinitionId,

src/views/workflow/common/InstanceDetails.vue

@@ -29,8 +29,8 @@
           </div>
         </div>
         <div style="height: 15px;background:#f5f5f5;"></div>
-        <form-render ref="taskViewForm" :form-items="processInstanceData.formItems"
+<!--        <form-render ref="taskViewForm" :form-items="processInstanceData.formItems"-->
-                     v-model:value="processInstanceData.formData"/>
+<!--                     v-model:value="processInstanceData.formData"/>-->
         <div style="height: 15px;background:#f5f5f5;"></div>
         <operation-render :operation-list="processInstanceData.operationList"
                           :state="instance.state"/>
@@ -45,7 +45,7 @@
 
 <script setup>
 import Tag from '@/components/Tag.vue'
-import FormRender from '@/views/workflow/form/FormRender.vue'
+// import FormRender from '@/views/workflow/form/FormRender.vue'
 import OperationRender from '@/views/workflow/common/OperationRender.vue'
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
 import {getInitiatedInstanceInfo} from "@/api/workflow/process-instance.js";

src/views/workflow/process/ProcessEdit.vue

@@ -1,7 +1,7 @@
 <template>
   <div style="margin-top: 15px">
     <el-button @click="changPan('processSetting')">流程设置</el-button>
-    <el-button @click="changPan('formDesign')">表单</el-button>
+    <!--    <el-button @click="changPan('formDesign')">表单</el-button>-->
     <el-button @click="changPan('processDesign')">流程</el-button>
     <el-button @click="publishProcess">发布</el-button>
     <div class="layout-body" v-if="visible">
@@ -11,9 +11,9 @@
       <div v-show="activeSelect === 'processDesign'">
         <process-design ref="processDesign"/>
       </div>
-      <div v-show="activeSelect === 'formDesign'">
+      <!--      <div v-show="activeSelect === 'formDesign'">-->
-        <form-design ref="formDesign"/>
+      <!--        <form-design ref="formDesign"/>-->
-      </div>
+      <!--      </div>-->
     </div>
 
   </div>
@@ -72,7 +72,8 @@ import {ElMessage, ElMessageBox} from "element-plus";
 const processDesign = ref()
 const visible = ref(false)
 const timer = ref(null)
-const validComponents = ref(['processSetting', 'formDesign', 'processDesign'])
+// const validComponents = ref(['processSetting', 'formDesign', 'processDesign'])
+const validComponents = ref(['processSetting', 'processDesign'])
 // const activeSelect = ref('formDesign')
 // const activeSelect = ref('processSetting')
 const activeSelect = ref('processDesign')
@@ -81,7 +82,7 @@ const validStep = ref(0)
 const validResult = ref({})
 const validOptions = ref([
   {title: '基础信息', description: '', icon: '', status: ''},
-  {title: '审批表单', description: '', icon: '', status: ''},
+  // {title: '审批表单', description: '', icon: '', status: ''},
   {title: '审批流程', description: '', icon: '', status: ''},
   // {title: '扩展设置', description: '', icon: '', status: ''}
 ])
@@ -118,21 +119,21 @@ const loadInitFrom = () => {
   let design = {
     processDefinitionKey: 'pro' + getRandomId(),
     deploymentName: "未命名表单",
-    logo: {
+    // logo: {
-      icon: "el-icon-eleme",
+    //   icon: "el-icon-eleme",
-      background: "#1e90ff"
+    //   background: "#1e90ff"
-    },
+    // },
-    settings: {
+    // settings: {
-      commiter: [],
+    //   commiter: [],
-      admin: [],
+    //   admin: [],
-      sign: false,
+    //   sign: false,
-      notify: {
+    //   notify: {
-        types: ["APP"],
+    //     types: ["APP"],
-        title: "消息通知标题"
+    //     title: "消息通知标题"
-      }
+    //   }
-    },
+    // },
     groupId: 1,
-    formItems: [],
+    // formItems: [],
     process: [
       {
         id: "root",
@@ -151,6 +152,27 @@ const loadInitFrom = () => {
         type: "END",
       }
     ],
+    processFromPerms: [{
+      id: "projectName",
+      title: "项目名称",
+      required: true,
+      perm: "R"
+    }, {
+      id: "projectType",
+      title: "项目类型",
+      required: true,
+      perm: "R"
+    }, {
+      id: "projectDesc",
+      title: "项目描述",
+      required: true,
+      perm: "R"
+    }, {
+      id: "projectManager",
+      title: "项目经理",
+      required: true,
+      perm: "R"
+    }],
     remark: "备注说明"
   }
   processStore.setDesign(design)

src/views/workflow/process/config/ConditionGroupItemConfig.vue

@@ -94,7 +94,9 @@
                 <org-items :modelValue="users"/>
               </span>
             <span v-else-if="condition.valueType === ValueType.date"></span>
-            <el-icon class="delete-icon" @click="delSubCondition(group, cindex)"><Minus /></el-icon>
+            <el-icon class="delete-icon" @click="delSubCondition(group, cindex)">
+              <Minus/>
+            </el-icon>
           </el-form-item>
         </el-form>
       </div>
@@ -140,14 +142,20 @@ const selectedNode = computed(() => {
   return processStore.getSelectedNode()
 })
 
+const processFromPerms = computed(() => {
+  return processStore.getDesign().processFromPerms;
+});
+
 const conditionList = computed(() => {
   //条件数组
   //构造可用条件选项
   const conditionItems = []
-  processStore.getDesign().formItems.forEach(item => filterCondition(item, conditionItems))
+  filterConditionMosr(conditionItems)
-  if (conditionItems.length === 0 || conditionItems[0].id !== 'root') {
+  // processStore.getDesign().formItems.forEach(item => filterCondition(item, conditionItems))
-    conditionItems.unshift({id: 'root', title: '发起人', valueType: 'User'})
+  // if (conditionItems.length === 0 || conditionItems[0].id !== 'root') {
-  }
+  //   conditionItems.unshift({id: 'root', title: '发起人', valueType: 'User'})
+  // }
+  conditionItems.unshift({id: 'root', title: '发起人', valueType: 'User'})
   return conditionItems
 })
 
@@ -184,6 +192,14 @@ const selectUser = (value, orgType) => {
   users.value = value
   orgPicker.value.showUserPicker()
 }
+const filterConditionMosr = (list) => {
+  processFromPerms.value.forEach((item) => {
+    console.log(item)
+    if (item.required){
+      list.push({title: item.title, id: item.id, valueType: item.valueType})
+    }
+  })
+}
 
 const filterCondition = (item, list) => {
   //从表单中过滤出可以选择的条件
@@ -206,8 +222,7 @@ const selected = (selected) => {
   users.value = userInfoList
   //组织选择器的选中回调函数
   // users.value.length = 0
-  // console.log('processStore.getAssignedUser()',processStore.getAssignedUser())
+  processStore.getAssignedUser().forEach(u => users.value = userInfoList)
-  processStore.getAssignedUser().forEach(u => users.value=userInfoList)
 }
 
 const delGroup = (index) => {
@@ -228,7 +243,6 @@ const conditionChange = (index, group) => {
     if (0 > group.conditions.findIndex(cd => cd.id === cid)) {
       //新增条件
       let condition = {...conditionList.value[index]}
-      console.log('fs', condition, conditionList.value, index)
       condition.compare = '';
       condition.value = []
       group.conditions.push(condition)

src/views/workflow/process/config/FormAuthorityConfig.vue

@@ -66,7 +66,30 @@ const init = () => {
     }
   }
   processStore.getSelectedNode().props.formPerms = [];
-  formPermsLoad(oldPermMap, processStore.getDesign().formItems);
+  //todo 项目字段测试
+  let perms = [{
+    id: "projectName",
+    title: "项目名称",
+    required: true,
+    perm: "R"
+  }, {
+    id: "projectType",
+    title: "项目类型",
+    required: true,
+    perm: "R"
+  }, {
+    id: "projectDesc",
+    title: "项目描述",
+    required: true,
+    perm: "R"
+  }, {
+    id: "projectManager",
+    title: "项目经理",
+    required: true,
+    perm: "R"
+  }];
+  // formPermsLoad(oldPermMap, processStore.getDesign().formItems);
+  formPermsLoadMosr(oldPermMap, processFromPerms.value);
 };
 
 const formPerms = computed(() => {
@@ -81,12 +104,40 @@ const formItems = computed(() => {
   return processStore.getDesign().formItems;
 });
 
+const processFromPerms = computed(() => {
+  return processStore.getDesign().processFromPerms;
+});
+
+
+
+
+
 const allSelect = (type) => {
   permSelect.value = type;
   formPerms.value.forEach(f => f.perm = type);
 };
+const formPermsLoadMosr = (oldPermMap, perms) => {
 
+  perms.forEach(perm =>{
+    console.log(perm)
+    //刷新名称
+    let old = oldPermMap.get(perm.id)
+    if (old) {
+      old.title = perm.title;
+      old.required = perm.required;
+      formPerms.value.push(old);
+    } else {
+      formPerms.value.push({
+        id: perm.id, //todo ,id 就是字段名称
+        title: perm.title,
+        required: perm.required,
+        perm: nowNode.type === "ROOT" ? "E" : "R"
+      });
+    }
+  })
+}
 
+//todo  初始化表单权限的位置,表单字段信息放在config配置中心
 const formPermsLoad = (oldPermMap, forms) => {
   forms.forEach(form => {
     if (form.name === "SpanLayout") {
@@ -100,7 +151,7 @@ const formPermsLoad = (oldPermMap, forms) => {
         formPerms.value.push(old);
       } else {
         formPerms.value.push({
-          id: form.id,
+          id: form.id, //todo ,id 就是字段名称
           title: form.title,
           required: form.props.required,
           perm: nowNode.type === "ROOT" ? "E" : "R"

src/views/workflow/process/config/NodeConfig.vue

@@ -1,15 +1,16 @@
 <template>
-    <el-tabs v-model="active" v-if="visible && name && formConfig.length > 0">
+  <!--  <el-tabs v-model="active" v-if="visible && name && formConfig.length > 0">-->
-      <el-tab-pane :label="name" name="properties">
+  <el-tabs v-model="active" v-if="visible && name">
-        <component :is="com" :config="selectNode.props" @initRender="emit('initRender')"/>
+    <el-tab-pane :label="name" name="properties">
-      </el-tab-pane>
-      <el-tab-pane label="表单权限设置" name="permissions">
-        <form-authority-config :node-type="selectNode.type"/>
-      </el-tab-pane>
-    </el-tabs>
-    <div v-else>
       <component :is="com" :config="selectNode.props" @initRender="emit('initRender')"/>
-    </div>
+    </el-tab-pane>
+    <el-tab-pane label="表单权限设置" name="permissions">
+      <form-authority-config :node-type="selectNode.type"/>
+    </el-tab-pane>
+  </el-tabs>
+  <div v-else>
+    <component :is="com" :config="selectNode.props" @initRender="emit('initRender')"/>
+  </div>
 </template>
 
 <script setup>
@@ -21,7 +22,8 @@ import CcNode from './CcNodeConfig.vue'
 import Condition from './ConditionNodeConfig.vue'
 import Trigger from './TriggerNodeConfig.vue'
 import {useProcessStore} from '@/stores/processStore.js'
-import {computed,defineEmits} from 'vue'
+import {computed, defineEmits} from 'vue'
+
 const emit = defineEmits()
 
 const processStore = useProcessStore()
@@ -31,9 +33,9 @@ const selectNode = computed(() => {
 })
 
 
-const formConfig = computed(() => {
+// const formConfig = computed(() => {
-  return processStore.getDesign().formItems
+//   return processStore.getDesign().formItems
-})
+// })
 
 
 const com = ref()
@@ -41,7 +43,7 @@ const active = ref('properties')
 const visible = ref(false)
 
 
-const name = computed(()=>{
+const name = computed(() => {
   switch (processStore.getSelectedNode().type) {
     case 'ROOT':
       return '设置发起人';
@@ -56,7 +58,6 @@ const name = computed(()=>{
 
 
 const init = () => {
-  console.log(processStore.getSelectedNode().type)
   switch (processStore.getSelectedNode().type) {
     case 'APPROVAL' :
       com.value = Approval;