|
@@ -1,24 +1,15 @@
|
|
|
<script setup name="BasicInfo">
|
|
|
import { storeToRefs } from 'pinia'
|
|
|
import useFlowStore from '@/store/modules/flow'
|
|
|
-import { ref, nextTick, onMounted, computed, watch, onBeforeUnmount } from 'vue'
|
|
|
+import { ref, nextTick, onMounted, computed, watch } from 'vue'
|
|
|
import UseSelect from '@/components/scWorkflow/select'
|
|
|
import flowDefinition from '@/api/flow/definition'
|
|
|
import process from '@/api/flow/process'
|
|
|
import { useRoute } from 'vue-router'
|
|
|
-import { flowIconPrefix /*, getAssetsFile*/ } from '@/utils/index'
|
|
|
+import { flowIconPrefix } from '@/utils/index'
|
|
|
const route = useRoute()
|
|
|
-
|
|
|
-// 缓存 start
|
|
|
-import { EVENT_ENUM, EVENT_BUS, cacheTriggerFunc } from '@/utils/cacheHelper'
|
|
|
const flowStore = useFlowStore()
|
|
|
-const { flowName, flowProcessId } = storeToRefs(flowStore)
|
|
|
-const cacheLoading = ref(false)
|
|
|
-const cacheLoadingNum = ref(600)
|
|
|
-const cacheLoadingFr = 1000
|
|
|
-const cacheLoadingIndex = ref(null)
|
|
|
-const cacheIndex = ref(null) // 缓存索引
|
|
|
-const cacheUpdateFr = 3000 // 缓存更新频率
|
|
|
+const { flowName, flowProcessId, basicInfo } = storeToRefs(flowStore)
|
|
|
// 缓存 end
|
|
|
const visiblePopover = ref(false)
|
|
|
const selectVisible = ref(false)
|
|
@@ -179,34 +170,11 @@ const getGroupList = async () => {
|
|
|
}
|
|
|
|
|
|
const initBaseicInfEv = item => {
|
|
|
- // item = {
|
|
|
- // processId: '1728240012964925441',
|
|
|
- // processForm:yu
|
|
|
- // '[{"type":"input","field":"userName","title":"输入框","info":"","$required":false,"_fc_drag_tag":"input","hidden":false,"display":true}]',
|
|
|
- // processKey: '003key',
|
|
|
- // processName: '003名称',
|
|
|
- // processIcon: 'https://lf3-ea.bytetos.com/obj/goofy/ee/approval/approval-admin/image/iconLib/v5/cart',
|
|
|
- // categoryId: '1725778939021541378',
|
|
|
- // remark: '003说明',
|
|
|
- // useScope: 1,
|
|
|
- // processActorList: [{ actorId: '1705067852272607233', actorName: 'lanceJiang', actorType: 0 }],
|
|
|
- // processPermissionList: [{ userId: '1705067852272607233', userName: 'lanceJiang', operateApproval: 0, operateOwner: 0, operateData: 0 }]
|
|
|
- // }
|
|
|
const { processForm, modelContent, ...rest } = item
|
|
|
flowInfo.value = rest
|
|
|
flowStore.setProcessForm(processForm)
|
|
|
flowStore.setModelContent(modelContent)
|
|
|
- // updateRemoteCache()
|
|
|
flowProcessId.value = queryObj.value.id // 赋值流程id
|
|
|
- // if (item.useScope === 1) {
|
|
|
- // nodeRoleList.value = item.processActorList.map(item => {
|
|
|
- // return {
|
|
|
- // id: item.actorId,
|
|
|
- // name: item.actorName,
|
|
|
- // actorType: 0
|
|
|
- // }
|
|
|
- // })
|
|
|
- // }
|
|
|
|
|
|
if (item.processPermissionList && item.processPermissionList.length) {
|
|
|
nodeRoleManageList.value = item.processPermissionList.map(item => {
|
|
@@ -236,41 +204,6 @@ const updateRemoteCache = async () => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-const handleRemoteCacheRefresh = () => {
|
|
|
- cacheIndex.value && clearTimeout(cacheIndex.value)
|
|
|
- cacheIndex.value = setTimeout(() => {
|
|
|
- // updateRemoteCache()
|
|
|
- }, cacheUpdateFr)
|
|
|
-}
|
|
|
-
|
|
|
-// 初始化缓存倒计时
|
|
|
-const handleCacheLoading = () => {
|
|
|
- cacheLoading.value = true
|
|
|
- cacheLoadingNum.value = 5
|
|
|
- cacheLoadingIndex.value && clearInterval(cacheLoadingIndex.value)
|
|
|
- cacheLoadingIndex.value = setInterval(() => {
|
|
|
- cacheLoadingNum.value = cacheLoadingNum.value - 1
|
|
|
- if (cacheLoadingNum.value <= 0) {
|
|
|
- cacheLoading.value = false
|
|
|
- cacheLoadingIndex.value && clearInterval(cacheLoadingIndex.value)
|
|
|
- bindCacheEvt()
|
|
|
- }
|
|
|
- }, cacheLoadingFr)
|
|
|
-}
|
|
|
-
|
|
|
-const closeCacheLoading = () => {
|
|
|
- console.log('组件销毁时: 关闭定时器---------')
|
|
|
- cacheLoadingIndex.value && clearInterval(cacheLoadingIndex.value)
|
|
|
-}
|
|
|
-
|
|
|
-const bindCacheEvt = () => {
|
|
|
- EVENT_BUS.off(EVENT_ENUM.UPDATE_CACHE)
|
|
|
- EVENT_BUS.on(EVENT_ENUM.UPDATE_CACHE, res => {
|
|
|
- console.log('dev.2 EVENT_ENUM.UPDATE_CACHE', res)
|
|
|
- handleRemoteCacheRefresh()
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
// 根据id获取详情
|
|
|
const getCurrentProcessDetailEv = id => {
|
|
|
process.processDetailApi(id).then(res => {
|
|
@@ -285,34 +218,9 @@ const chooseIconEv = item => {
|
|
|
visiblePopover.value = !visiblePopover.value
|
|
|
}
|
|
|
|
|
|
-// ----- 缓存相关 start ------
|
|
|
-const flowBaseInfoWatcher = computed(() => {
|
|
|
- const { processKey, processName, processIcon, categoryId, remark, processPermissionList } = flowInfo.value
|
|
|
- // 只关注参数相关的数据变更
|
|
|
- const _s = {
|
|
|
- processKey, // 流程显示名称
|
|
|
- processName, // 流程定义名称
|
|
|
- processIcon, // 流程图标
|
|
|
- categoryId, // 流程组分类ID
|
|
|
- remark, // 备注说明
|
|
|
- processPermissionList // 流程定义权限
|
|
|
- }
|
|
|
- console.log('第一步:监听的对象属性 ------', _s)
|
|
|
- return _s
|
|
|
-})
|
|
|
-
|
|
|
// 当前是否是编辑
|
|
|
const queryObj = computed(() => route.query)
|
|
|
|
|
|
-watch(
|
|
|
- flowBaseInfoWatcher,
|
|
|
- (newVal, oldVal) => {
|
|
|
- console.log('第二步:执行同步emit方法 ------', newVal, oldVal)
|
|
|
- cacheTriggerFunc()
|
|
|
- },
|
|
|
- { deep: true }
|
|
|
-)
|
|
|
-
|
|
|
// 流程名称变化
|
|
|
watch(
|
|
|
() => flowInfo.value.processName,
|
|
@@ -325,7 +233,6 @@ watch(
|
|
|
|
|
|
onMounted(() => {
|
|
|
getGroupList()
|
|
|
- handleCacheLoading()
|
|
|
flowStore.$reset() // 重置缓存
|
|
|
|
|
|
if (queryObj.value.id) {
|
|
@@ -333,10 +240,6 @@ onMounted(() => {
|
|
|
}
|
|
|
})
|
|
|
|
|
|
-onBeforeUnmount(() => {
|
|
|
- closeCacheLoading()
|
|
|
-})
|
|
|
-
|
|
|
defineExpose({
|
|
|
formRef,
|
|
|
validate
|
|
@@ -345,10 +248,6 @@ defineExpose({
|
|
|
|
|
|
<template>
|
|
|
<div class="base-info">
|
|
|
- <div v-if="false" style="font-size: 18px; position: absolute; left: 10px; top: 20px; z-index: 9999; color: red">
|
|
|
- {{ cacheLoadingNum }}秒之后开启自动缓存...
|
|
|
- </div>
|
|
|
-
|
|
|
<div class="base-info-panel" style="position: relative">
|
|
|
<div style="font-size: 18px; position: absolute; right: 10px; top: 20px; z-index: 9999">
|
|
|
<el-button type="primary" @click="updateRemoteCache">下一步</el-button>
|
|
@@ -357,9 +256,6 @@ defineExpose({
|
|
|
<el-form-item label="图标" prop="processIcon">
|
|
|
<el-space>
|
|
|
<LeIcon class="icon-shower" :icon-class="`${flowIconPrefix}${flowInfo.processIcon}`" />
|
|
|
- <!-- <div class="icon-shower">
|
|
|
- <img :src="getAssetsFile(flowInfo.processIcon + '.svg')" :alt="flowInfo.processIcon" />
|
|
|
- </div>-->
|
|
|
</el-space>
|
|
|
|
|
|
<el-popover placement="right-end" :width="450" trigger="focus" class="base-popover" :visible="visiblePopover">
|
|
@@ -367,7 +263,6 @@ defineExpose({
|
|
|
<div class="icon-selector-list">
|
|
|
<div v-for="item in imgsArr" :key="item" class="icon-selector-item" @click="chooseIconEv(item)">
|
|
|
<LeIcon class="icon" :icon-class="`${flowIconPrefix}${item}`" />
|
|
|
- <!-- <img :src="getAssetsFile(item + '.svg')" />-->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -377,7 +272,7 @@ defineExpose({
|
|
|
</el-popover>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="唯一标识 key" prop="processKey">
|
|
|
- <el-input v-model="flowInfo.processKey" clearable></el-input>
|
|
|
+ <el-input v-model="basicInfo.processKey" clearable></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="名称" prop="processName">
|
|
|
<el-input v-model="flowInfo.processName" clearable></el-input>
|