【功能优化】工作流：流程模型的定义，增加谁可以发起、谁可以管理的字段 CRUD

src/views/bpm/model/ModelForm.vue

@@ -123,6 +123,30 @@
           </el-radio>
         </el-radio-group>
       </el-form-item>
+      <el-form-item label="谁可以发起" prop="startUserIds">
+        <el-select
+          v-model="formData.startUserIds"
+          multiple
+          placeholder="请选择可发起人，默认（不选择）则所有人都可以发起"
+        >
+          <el-option
+            v-for="user in userList"
+            :key="user.id"
+            :label="user.nickname"
+            :value="user.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="流程管理员" prop="managerUserIds">
+        <el-select v-model="formData.managerUserIds" multiple placeholder="请选择流程管理员">
+          <el-option
+            v-for="user in userList"
+            :key="user.id"
+            :label="user.nickname"
+            :value="user.id"
+          />
+        </el-select>
+      </el-form-item>
     </el-form>
     <template #footer>
       <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
@@ -137,18 +161,24 @@ import * as ModelApi from '@/api/bpm/model'
 import * as FormApi from '@/api/bpm/form'
 import { CategoryApi } from '@/api/bpm/category'
 import { BpmModelFormType, BpmModelType } from '@/utils/constants'
+import { UserVO } from '@/api/system/user'
+import * as UserApi from '@/api/system/user'
+import { useUserStoreWithOut } from '@/store/modules/user'
 
 defineOptions({ name: 'ModelForm' })
 
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
+const userStore = useUserStoreWithOut() // 用户信息缓存
 
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref({
+  id: undefined,
   name: '',
+  key: '',
   category: undefined,
   icon: undefined,
   description: '',
@@ -157,7 +187,9 @@ const formData = ref({
   formId: '',
   formCustomCreatePath: '',
   formCustomViewPath: '',
-  visible: true
+  visible: true,
+  startUserIds: [],
+  managerUserIds: []
 })
 const formRules = reactive({
   name: [{ required: true, message: '流程名称不能为空', trigger: 'blur' }],
@@ -169,14 +201,16 @@ const formRules = reactive({
   formId: [{ required: true, message: '流程表单不能为空', trigger: 'blur' }],
   formCustomCreatePath: [{ required: true, message: '表单提交路由不能为空', trigger: 'blur' }],
   formCustomViewPath: [{ required: true, message: '表单查看地址不能为空', trigger: 'blur' }],
-  visible: [{ required: true, message: '是否可见不能为空', trigger: 'blur' }]
+  visible: [{ required: true, message: '是否可见不能为空', trigger: 'blur' }],
+  managerUserIds: [{ required: true, message: '流程管理员不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
 const formList = ref([]) // 流程表单的下拉框的数据
 const categoryList = ref([]) // 流程分类列表
+const userList = ref<UserVO[]>([]) // 用户列表
 
 /** 打开弹窗 */
-const open = async (type: string, id?: number) => {
+const open = async (type: string, id?: string) => {
   dialogVisible.value = true
   dialogTitle.value = t('action.' + type)
   formType.value = type
@@ -189,11 +223,15 @@ const open = async (type: string, id?: number) => {
     } finally {
       formLoading.value = false
     }
+  } else {
+    formData.value.managerUserIds.push(userStore.getUser.id)
   }
   // 获得流程表单的下拉框的数据
   formList.value = await FormApi.getFormSimpleList()
   // 查询流程分类列表
   categoryList.value = await CategoryApi.getCategorySimpleList()
+  // 查询用户列表
+  userList.value = await UserApi.getSimpleUserList()
 }
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
@@ -237,7 +275,9 @@ const submitForm = async () => {
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {
+    id: undefined,
     name: '',
+    key: '',
     category: undefined,
     icon: undefined,
     description: '',
@@ -246,7 +286,9 @@ const resetForm = () => {
     formId: '',
     formCustomCreatePath: '',
     formCustomViewPath: '',
-    visible: true
+    visible: true,
+    startUserIds: [],
+    managerUserIds: []
   }
   formRef.value?.resetFields()
 }

src/views/bpm/model/index.vue

@@ -73,6 +73,26 @@
           <el-image :src="scope.row.icon" class="h-32px w-32px" />
         </template>
       </el-table-column>
+      <el-table-column label="可见范围" align="center" prop="startUserIds" min-width="100">
+        <template #default="scope">
+          <el-text v-if="!scope.row.startUsers || scope.row.startUsers.length === 0">
+            全部可见
+          </el-text>
+          <el-text v-else-if="scope.row.startUsers.length == 1">
+            {{ scope.row.startUsers[0].nickname }}
+          </el-text>
+          <el-text v-else>
+            <el-tooltip
+              class="box-item"
+              effect="dark"
+              placement="top"
+              :content="scope.row.startUsers.map((user: any) => user.nickname).join('、')"
+            >
+              {{ scope.row.startUsers[0].nickname }}等 {{ scope.row.startUsers.length }} 人可见
+            </el-tooltip>
+          </el-text>
+        </template>
+      </el-table-column>
       <el-table-column label="流程分类" align="center" prop="categoryName" min-width="100" />
       <el-table-column label="表单信息" align="center" prop="formType" min-width="200">
         <template #default="scope">
@@ -95,17 +115,6 @@
           <label v-else>暂无表单</label>
         </template>
       </el-table-column>
-      <!--      <el-table-column label="激活状态" align="center" prop="processDefinition.version" width="85">-->
-      <!--        <template #default="scope">-->
-      <!--          <el-switch-->
-      <!--            v-if="scope.row.processDefinition"-->
-      <!--            v-model="scope.row.processDefinition.suspensionState"-->
-      <!--            :active-value="1"-->
-      <!--            :inactive-value="2"-->
-      <!--            @change="handleChangeState(scope.row)"-->
-      <!--          />-->
-      <!--        </template>-->
-      <!--      </el-table-column>-->
       <el-table-column label="最后发布" align="center" prop="deploymentTime" min-width="250">
         <template #default="scope">
           <span v-if="scope.row.processDefinition">
@@ -131,6 +140,7 @@
             type="primary"
             @click="openForm('update', scope.row.id)"
             v-hasPermi="['bpm:model:update']"
+            :disabled="!isManagerUser(scope.row)"
           >
             修改
           </el-button>
@@ -140,6 +150,7 @@
             type="primary"
             @click="handleDesign(scope.row)"
             v-hasPermi="['bpm:model:update']"
+            :disabled="!isManagerUser(scope.row)"
           >
             设计
           </el-button>
@@ -149,6 +160,7 @@
             type="primary"
             @click="handleDeploy(scope.row)"
             v-hasPermi="['bpm:model:deploy']"
+            :disabled="!isManagerUser(scope.row)"
           >
             发布
           </el-button>
@@ -169,6 +181,7 @@
                 <el-dropdown-item
                   command="handleChangeState"
                   v-if="checkPermi(['bpm:model:update'])"
+                  :disabled="!isManagerUser(scope.row)"
                 >
                   {{ scope.row.processDefinition.suspensionState === 1 ? '停用' : '启用' }}
                 </el-dropdown-item>
@@ -176,6 +189,7 @@
                   type="danger"
                   command="handleDelete"
                   v-if="checkPermi(['bpm:model:delete'])"
+                  :disabled="!isManagerUser(scope.row)"
                 >
                   删除
                 </el-dropdown-item>
@@ -212,12 +226,14 @@ import { setConfAndFields2 } from '@/utils/formCreate'
 import { CategoryApi } from '@/api/bpm/category'
 import { BpmModelType } from '@/utils/constants'
 import { checkPermi } from '@/utils/permission'
+import { useUserStoreWithOut } from '@/store/modules/user'
 
 defineOptions({ name: 'BpmModel' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 const { push } = useRouter() // 路由
+const userStore = useUserStoreWithOut() // 用户信息缓存
 
 const loading = ref(true) // 列表的加载中
 const total = ref(0) // 列表的总页数
@@ -312,7 +328,7 @@ const handleChangeState = async (row: any) => {
 }
 
 /** 设计流程 */
-const handleDesign = (row) => {
+const handleDesign = (row: any) => {
   if (row.type == BpmModelType.BPMN) {
     push({
       name: 'BpmModelEditor',
@@ -331,7 +347,7 @@ const handleDesign = (row) => {
 }
 
 /** 发布流程 */
-const handleDeploy = async (row) => {
+const handleDeploy = async (row: any) => {
   try {
     // 删除的二次确认
     await message.confirm('是否部署该流程！！')
@@ -359,7 +375,7 @@ const formDetailPreview = ref({
   rule: [],
   option: {}
 })
-const handleFormDetail = async (row) => {
+const handleFormDetail = async (row: any) => {
   if (row.formType == 10) {
     // 设置表单
     const data = await FormApi.getForm(row.formId)
@@ -373,6 +389,12 @@ const handleFormDetail = async (row) => {
   }
 }
 
+/** 判断是否可以操作 */
+const isManagerUser = (row: any) => {
+  const userId = userStore.getUser.id
+  return row.managerUserIds && row.managerUserIds.includes(userId)
+}
+
 /** 初始化 **/
 onMounted(async () => {
   await getList()