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

Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/121
This commit is contained in:
2024-05-10 09:31:43 +00:00
9 changed files with 249 additions and 86 deletions

View File

@@ -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 {

View File

@@ -1,30 +1,39 @@
<template>
<div class="detail-block">
<div class="left-info">
<baseTitle title="需求征集详情"></baseTitle>
<div class="info">
<div v-for="item in list">
<span>{{ item.title }}</span>
<span>{{ item.text }}</span>
<el-row gutter="20">
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="14">
<div class="left-info">
<baseTitle title="需求征集详情"></baseTitle>
<div class="info">
<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>
<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 class="approval-record">
<baseTitle title="审批记录"></baseTitle>
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="10">
<div class="approval-record" >
<baseTitle title="审批记录"></baseTitle>
<div class="process" id="approvalRecord">
<process-tree ref="processTree" mode="view" id-name="approvalRecord"/>
</div>
</div>
</el-col>
</el-row>
<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;
}
}
}
}

View File

@@ -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"
v-model:value="formData" mode="E"/>
<!-- todo 关闭以前的表单渲染 , 此处需要根据参数来定制当前需要展示的页面信息 -->
<!-- <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({

View File

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

View File

@@ -29,8 +29,8 @@
</div>
</div>
<div style="height: 15px;background:#f5f5f5;"></div>
<form-render ref="taskViewForm" :form-items="processInstanceData.formItems"
v-model:value="processInstanceData.formData"/>
<!-- <form-render ref="taskViewForm" :form-items="processInstanceData.formItems"-->
<!-- 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";

View File

@@ -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'">
<form-design ref="formDesign"/>
</div>
<!-- <div v-show="activeSelect === 'formDesign'">-->
<!-- <form-design ref="formDesign"/>-->
<!-- </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: {
icon: "el-icon-eleme",
background: "#1e90ff"
},
settings: {
commiter: [],
admin: [],
sign: false,
notify: {
types: ["APP"],
title: "消息通知标题"
}
},
// logo: {
// icon: "el-icon-eleme",
// background: "#1e90ff"
// },
// settings: {
// commiter: [],
// admin: [],
// sign: false,
// notify: {
// types: ["APP"],
// 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)

View File

@@ -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))
if (conditionItems.length === 0 || conditionItems[0].id !== 'root') {
conditionItems.unshift({id: 'root', title: '发起人', valueType: 'User'})
}
filterConditionMosr(conditionItems)
// processStore.getDesign().formItems.forEach(item => filterCondition(item, conditionItems))
// 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)

View File

@@ -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"

View File

@@ -1,15 +1,16 @@
<template>
<el-tabs v-model="active" v-if="visible && name && formConfig.length > 0">
<el-tab-pane :label="name" name="properties">
<component :is="com" :config="selectNode.props" @initRender="emit('initRender')"/>
</el-tab-pane>
<el-tab-pane label="表单权限设置" name="permissions">
<form-authority-config :node-type="selectNode.type"/>
</el-tab-pane>
</el-tabs>
<div v-else>
<!-- <el-tabs v-model="active" v-if="visible && name && formConfig.length > 0">-->
<el-tabs v-model="active" v-if="visible && name">
<el-tab-pane :label="name" name="properties">
<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(() => {
return processStore.getDesign().formItems
})
// const formConfig = computed(() => {
// 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;