mirror of
https://gitee.com/vben/vben-web.git
synced 2026-10-06 06:12:56 +08:00
适配最新版vue-next-admin
This commit is contained in:
zsvg
@@ -4,4 +4,5 @@ ENV = 'development'
|
||||
# 本地环境接口地址
|
||||
#VITE_API_URL = 'http://localhost:5301/'
|
||||
VITE_API_URL = 'http://localhost:5000/'
|
||||
#VITE_API_URL = 'http://222.92.228.219:5301/'
|
||||
VITE_UI_URL = 'http://localhost:8888/'
|
||||
|
||||
@@ -7,4 +7,3 @@ ENV = 'production'
|
||||
#VITE_API_URL = 'http://222.92.228.219:5301/'
|
||||
|
||||
VITE_API_URL = 'http://localhost:5000/'
|
||||
|
||||
|
||||
+3
-1
@@ -20,8 +20,9 @@
|
||||
- 🎯 优化 [如果 url 中有中文等特殊字符，第一次切换该 tab 时 keep-alive 失效#I55JS7](https://gitee.com/lyt-top/vue-next-admin/issues/I55JS7),感谢[yuyong1566](https://gitee.com/yuyong1566)
|
||||
- 🎯 优化 [wangEditor](https://www.wangeditor.com/) 更新到 v5，[vue3 版本线上示例中 wangeditor 富文本编辑器 demo 实例,无法换行#I5565B](https://gitee.com/lyt-top/vue-next-admin/issues/I5565B)，感谢@[jenchih](https://gitee.com/jenchih)
|
||||
- 🎯 优化 [在关闭 tagview 时，高度刷新时会会变化，出现滚动条](https://gitee.com/lyt-top/vue-next-admin/issues/I55FHM)，感谢[张松](https://gitee.com/zs310071113)
|
||||
- 🎯 优化 [路由参数](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)演示
|
||||
- 🎉 新增 [vuex](https://vuex.vuejs.org/) 替换成 [pinia](https://pinia.vuejs.org/getting-started.html)
|
||||
- 🎉 新增 tagsView 支持自定义 tagsView 名称（文章详情时有用），前往体验：[路由参数/普通路由](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)
|
||||
- 🎉 新增 tagsView 支持自定义 tagsView 名称（文章详情时有用），前往体验：[路由参数/普通路由](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)。新增 tagsView 支持自定义名称国际化，感谢[@q7but](https://gitee.com/q7but)、[!22 add 添加自定义 tagVIewName 拓展,支持国际化](https://gitee.com/lyt-top/vue-next-admin/pulls/22/files)、感谢[@tony_tong_xin](https://gitee.com/tony_tong_xin)
|
||||
- 🐞 修复 适配 `"element-plus": "^2.1.9"，2.2.0` 版本
|
||||
- 🐞 修复 [导航栏横向布局后，一级菜单显示问题#I4Z3M3](https://gitee.com/lyt-top/vue-next-admin/issues/I4Z3M3)
|
||||
- 🐞 修复 横向布局三级及以上导航菜单高亮、导航高度不统一问题
|
||||
@@ -33,6 +34,7 @@
|
||||
- 🐞 修复 `router.push` 路径找不到时报错问题，`404、401 界面` 已移入到 `main` 主布局里（之前全屏）
|
||||
- 🐞 修复 [全局修改组件大小失效了](https://gitee.com/lyt-top/vue-next-admin/issues/I551RP)，感谢[lg_boy](https://gitee.com/lg_boy)
|
||||
- 🐞 修复 [修改一下配置时，需要每次都清理 `window.localStorage` 浏览器永久缓存，配置才会生效，问题解决#I567R1](https://gitee.com/lyt-top/vue-next-admin/issues/I567R1),感谢[@lanbao123](https://gitee.com/lanbao123)
|
||||
- 🐞 修复 [标记为需要缓存的 tab 页后，再次从左侧菜单打开，还是显示被缓存的页面内容#I4UY3G](https://gitee.com/lyt-top/vue-next-admin/issues/I4UY3G)，感谢@axcc1234、特别感谢群友@华仔
|
||||
- 🌈 重构 路由（`/src/router/index.ts`）解决 No match found for location with path "xxx"(前端控制，后端控制未解决) 问题
|
||||
|
||||
## 2.0.2
|
||||
|
||||
@@ -70,7 +70,7 @@ cnpm run build
|
||||
|
||||
#### 💯 学习交流加 QQ 群
|
||||
|
||||
- 若加群了没同意（一般秒过），那就是群满了（500 人群），请换一个群试试。群会定期清理半年（6 个月）未发言的群友，资源有限，请谅解。
|
||||
- 若加群了没同意（一般秒过），那就是群满了（500 人群），请换一个群试试。群会定期清理半年（6 个月）未发言的群友，资源有限，请谅解。建议勿加多群，可能会误伤！
|
||||
- 查看开发文档：<a href="https://lyt-top.gitee.io/vue-next-admin-doc-preview" target="_blank">vue-next-admin-doc</a>
|
||||
- 群号码：
|
||||
1 群：<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=RdUY97Vx0T0vZ_1OOu-X1yFNkWgDwbjC&jump_from=webapi">665452019</a>
|
||||
@@ -94,6 +94,8 @@ cnpm run build
|
||||
- <a target="_blank" href="https://gitee.com/GionConnection/niupi-free">@甜蜜蜜 NiuPi 平台</a>
|
||||
- <a target="_blank" href="https://gitee.com/tiger1103/gfast/tree/os-v3/">@游子 GFast-V3</a>
|
||||
- <a target="_blank" href="https://gitee.com/diygw/diygw-ui-php/">@diygw.com gw-ui-php</a>
|
||||
- <a target="_blank" href="https://gitee.com/zsvg/vboot-net">@zsvg vboot-net</a>
|
||||
- <a target="_blank" href="https://gitee.com/zsvg/vboot-java">@zsvg vboot-java</a>
|
||||
|
||||
#### ❤️ 鸣谢列表
|
||||
|
||||
@@ -129,6 +131,7 @@ cnpm run build
|
||||
- <a href="https://gitee.com/click33/sa-plus" target="_blank">@省长</a>
|
||||
- <a href="https://gitee.com/jskz/Jskz-SpringCloud" target="_blank">@唐参
|
||||
- <a href="https://gitee.com/chuange" target="_blank">@川歌</a>
|
||||
- @华仔
|
||||
|
||||
#### 💌 支持作者
|
||||
|
||||
|
||||
Generated
+867
-809
File diff suppressed because it is too large
Load Diff
+15
-14
@@ -13,12 +13,13 @@
|
||||
"@element-plus/icons-vue": "^1.1.4",
|
||||
"@wangeditor/editor": "^5.0.1",
|
||||
"axios": "^0.27.2",
|
||||
"countup.js": "^2.1.0",
|
||||
"countup.js": "^2.2.0",
|
||||
"cropperjs": "^1.5.12",
|
||||
"echarts": "^5.3.2",
|
||||
"echarts-gl": "^2.0.9",
|
||||
"echarts-wordcloud": "^2.0.0",
|
||||
"element-plus": "^2.2.0",
|
||||
"element-plus": "^2.2.1",
|
||||
"js-cookie": "^3.0.1",
|
||||
"jsplumb": "^2.15.6",
|
||||
"mitt": "^3.0.0",
|
||||
"nprogress": "^0.2.0",
|
||||
@@ -28,7 +29,7 @@
|
||||
"screenfull": "^6.0.1",
|
||||
"sortablejs": "^1.15.0",
|
||||
"splitpanes": "^3.1.1",
|
||||
"vue": "^3.2.33",
|
||||
"vue": "^3.2.35",
|
||||
"vue-clipboard3": "^2.0.0",
|
||||
"vue-grid-layout": "^3.0.0-beta1",
|
||||
"vue-i18n": "^9.1.10",
|
||||
@@ -39,23 +40,23 @@
|
||||
"vform3-builds": "^3.0.7"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^17.0.32",
|
||||
"@types/node": "^17.0.35",
|
||||
"@types/nprogress": "^0.2.0",
|
||||
"@types/sortablejs": "^1.13.0",
|
||||
"@typescript-eslint/eslint-plugin": "^5.23.0",
|
||||
"@typescript-eslint/parser": "^5.23.0",
|
||||
"@vitejs/plugin-vue": "^2.3.2",
|
||||
"@typescript-eslint/eslint-plugin": "^5.25.0",
|
||||
"@typescript-eslint/parser": "^5.25.0",
|
||||
"@vitejs/plugin-vue": "^2.3.3",
|
||||
"@vitejs/plugin-vue-jsx": "^1.1.6",
|
||||
"@vue/compiler-sfc": "^3.2.33",
|
||||
"@vue/compiler-sfc": "^3.2.35",
|
||||
"dotenv": "^16.0.1",
|
||||
"eslint": "^8.15.0",
|
||||
"eslint-plugin-vue": "^8.7.1",
|
||||
"eslint": "^8.16.0",
|
||||
"eslint-plugin-vue": "^9.0.1",
|
||||
"prettier": "^2.6.2",
|
||||
"sass": "^1.51.0",
|
||||
"sass-loader": "^12.6.0",
|
||||
"sass": "^1.52.1",
|
||||
"sass-loader": "^13.0.0",
|
||||
"typescript": "^4.6.4",
|
||||
"vite": "^2.9.8",
|
||||
"vue-eslint-parser": "^8.3.0"
|
||||
"vite": "^2.9.9",
|
||||
"vue-eslint-parser": "^9.0.2"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
|
||||
Vendored
+1
@@ -1,3 +1,4 @@
|
||||
declare module 'vue-grid-layout';
|
||||
declare module 'qrcodejs2-fixes';
|
||||
declare module 'splitpanes';
|
||||
declare module 'js-cookie';
|
||||
|
||||
+6
-3
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<el-config-provider :size="getGlobalComponentSize" :locale="i18nLocale">
|
||||
<router-view v-show="themeConfig.lockScreenTime !== 0" />
|
||||
<router-view v-show="themeConfig.lockScreenTime > 1" />
|
||||
<LockScreen v-if="themeConfig.isLockScreen" />
|
||||
<Setings ref="setingsRef" v-show="themeConfig.lockScreenTime !== 0" />
|
||||
<CloseFull />
|
||||
<Setings ref="setingsRef" v-show="themeConfig.lockScreenTime > 1" />
|
||||
<CloseFull v-if="!themeConfig.isLockScreen" />
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
@@ -80,6 +80,9 @@ export default defineComponent({
|
||||
() => route.path,
|
||||
() => {
|
||||
other.useTitle();
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
return {
|
||||
|
||||
@@ -19,7 +19,7 @@ export default defineComponent({
|
||||
setup(props) {
|
||||
const stores = useUserInfo();
|
||||
const { userInfos } = storeToRefs(stores);
|
||||
// 获取 vuex 中的用户权限
|
||||
// 获取 pinia 中的用户权限
|
||||
const getUserAuthBtnList = computed(() => {
|
||||
return judementSameArr(props.value, userInfos.value.authBtnList);
|
||||
});
|
||||
|
||||
+10
-5
@@ -149,11 +149,11 @@
|
||||
import {onMounted, reactive, toRaw, toRefs} from 'vue';
|
||||
import request from '/@/utils/request';
|
||||
// import { useRoute } from 'vue-router';
|
||||
// import { Cookie, Session } from '/@/utils/storage';
|
||||
// import { store } from '/@/store';
|
||||
// const route = useRoute();
|
||||
import Modeler2 from '/@/comps/Activiti/modeler2/index';
|
||||
import {BpmnStore} from '/@/bpmn/store';
|
||||
import { ElMessage } from 'element-plus';
|
||||
// import Viewer from 'bpmn-js/lib/NavigatedViewer';
|
||||
// import Viewer from 'bpmn-js/lib/Modeler';
|
||||
// import Viewer from 'bpmn-js/lib/Viewer';
|
||||
@@ -264,10 +264,15 @@ const bpmSubmit = async () => {
|
||||
// });
|
||||
} else if (form.value.opkey == 'refuse') {
|
||||
const refInfo = toRaw(form.value);
|
||||
refInfo.tarno = refInfo.refno;
|
||||
refInfo.tarna = refInfo.refna;
|
||||
refInfo.exman = refInfo.reman;
|
||||
emit('submit',form.value);
|
||||
if(refInfo.refno){
|
||||
refInfo.tarno = refInfo.refno;
|
||||
refInfo.tarna = refInfo.refna;
|
||||
refInfo.exman = refInfo.reman;
|
||||
emit('submit',form.value);
|
||||
}else{
|
||||
ElMessage.warning("请选择驳回节点后再驳回");
|
||||
}
|
||||
|
||||
// await request({
|
||||
// url: '/bpm/proc/main/hrefuse',
|
||||
// method: 'post',
|
||||
|
||||
@@ -0,0 +1,361 @@
|
||||
<template>
|
||||
<div class="containers">
|
||||
<div class="canvas" ref="canvasRef" style='height: 1000px;'></div>
|
||||
<OrgModal ref='orgModal' @close='closeOrgModal'/>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script lang='ts' setup>
|
||||
import BpmnModeler from 'bpmn-js/lib/Modeler'
|
||||
import { onMounted, reactive, ref, toRefs } from 'vue';
|
||||
import 'bpmn-js/dist/assets/diagram-js.css' // 左边工具栏以及编辑节点的样式
|
||||
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
|
||||
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
|
||||
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
|
||||
import OrgModal from '/@/comps/sys/OrgModal.vue';
|
||||
|
||||
|
||||
|
||||
const orgModal = ref();
|
||||
|
||||
const openOrgModal = () => {
|
||||
orgModal.value.openModal({
|
||||
opener: 'opman',
|
||||
orgType: 8,
|
||||
});
|
||||
};
|
||||
|
||||
const canvasRef = ref();
|
||||
|
||||
const state = reactive({
|
||||
data: [] as any,
|
||||
bpmnModeler:{} as any,
|
||||
});
|
||||
|
||||
const { bpmnModeler } = toRefs(state);
|
||||
|
||||
onMounted( () => {
|
||||
bpmnModeler.value=new BpmnModeler({
|
||||
container: canvasRef.value
|
||||
})
|
||||
bpmnModeler.value.importXML(xmlStr, (err:any) => {
|
||||
if (err) {
|
||||
console.error(err)
|
||||
} else {
|
||||
console.log("ok")
|
||||
}
|
||||
})
|
||||
// addModelerListener();
|
||||
addEventBusListener();
|
||||
});
|
||||
|
||||
|
||||
const addModelerListener=()=> {
|
||||
// const bpmnjs = this.bpmnModeler
|
||||
// const that = this
|
||||
// 这里我是用了一个forEach给modeler上添加要绑定的事件
|
||||
const events = ['shape.added', 'shape.move.end', 'shape.removed', 'connect.end','connect.move']
|
||||
events.forEach(function(event) {
|
||||
bpmnModeler.value.on(event, e => {
|
||||
console.log(event, e)
|
||||
var elementRegistry = bpmnModeler.value.get('elementRegistry')
|
||||
var shape = e.element ? elementRegistry.get(e.element.id) : e.shape
|
||||
console.log(shape)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
let lastClickTime=0;
|
||||
let currNode={};
|
||||
|
||||
const addEventBusListener=()=> {
|
||||
const eventBus = bpmnModeler.value.get('eventBus') // 需要使用eventBus
|
||||
const eventTypes = ['element.click'] // 需要监听的事件集合
|
||||
eventTypes.forEach(function(eventType) {
|
||||
eventBus.on(eventType, function(e) {
|
||||
if (!e || e.element.type == 'bpmn:Process') return
|
||||
|
||||
var elementRegistry = bpmnModeler.value.get('elementRegistry')
|
||||
var shape = elementRegistry.get(e.element.id) // 传递id进去
|
||||
|
||||
if(new Date().getTime()-lastClickTime<=500){
|
||||
openOrgModal();
|
||||
currNode=shape;
|
||||
}
|
||||
lastClickTime=new Date().getTime();
|
||||
// console.log(e)
|
||||
|
||||
console.log(shape.businessObject.id);
|
||||
shape.businessObject.name='李四';
|
||||
bpmnModeler.value.get('modeling').updateProperties(shape,{
|
||||
name: '我是修改后的Task名称'
|
||||
})
|
||||
|
||||
// this.getModeling().updateProperties(this.getShape(), {
|
||||
// [modelName]: multiple ? [newElement] : newElement,
|
||||
// });
|
||||
console.log(shape) // {Shape}
|
||||
// console.log(e.element) // {Shape}
|
||||
// console.log(JSON.stringify(shape)===JSON.stringify(e.element)) // true
|
||||
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
const closeOrgModal=()=>{
|
||||
|
||||
bpmnModeler.value.get('modeling').updateProperties(currNode,{
|
||||
name: '我是双击修改后的Task名称'
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const xmlStr = '<?xml version="1.0" encoding="UTF-8"?>\n' +
|
||||
'<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:activiti="http://activiti.org/bpmn" id="sample-diagram" targetNamespace="http://activiti.org/bpmn" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd">\n' +
|
||||
' <bpmn2:process id="Process_1" name="1" isExecutable="true">\n' +
|
||||
' <bpmn2:startEvent id="N1" name="开始节点">\n' +
|
||||
' <bpmn2:outgoing>L1</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:startEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L1" sourceRef="N1" targetRef="N2" />\n' +
|
||||
' <bpmn2:exclusiveGateway id="N9" name="条件分支">\n' +
|
||||
' <bpmn2:documentation>判断审批金额是否大于100</bpmn2:documentation>\n' +
|
||||
' <bpmn2:incoming>L4</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L6</bpmn2:outgoing>\n' +
|
||||
' <bpmn2:outgoing>L5</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:exclusiveGateway>\n' +
|
||||
' <bpmn2:sequenceFlow id="L4" sourceRef="N4" targetRef="N9" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L6" name="王五分支线" sourceRef="N9" targetRef="N6">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money<=100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L5" name="李四分支线" sourceRef="N9" targetRef="N5">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money>100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L7" sourceRef="N5" targetRef="N7" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L8" sourceRef="N6" targetRef="N7" />\n' +
|
||||
' <bpmn2:endEvent id="N3" name="结束节点">\n' +
|
||||
' <bpmn2:incoming>L2</bpmn2:incoming>\n' +
|
||||
' </bpmn2:endEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L2" sourceRef="N7" targetRef="N3" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L3" sourceRef="N2" targetRef="N4" />\n' +
|
||||
' <bpmn2:userTask id="N2" name="起草节点" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>起草节点，表单数据一般从绑定的表单提取</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:formProperty id="money" type="int" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="编辑" value="edit" />\n' +
|
||||
' <activiti:property name="撤回" value="back" />\n' +
|
||||
' <activiti:property name="提交" value="commit" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L1</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L3</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N4" name="张三审批" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>审批节点</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L3</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L4</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N5" name="李四审批" activiti:assignee="l4" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L5</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L7</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N6" name="王五审批" activiti:assignee="w5" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L6</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L8</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N7" name="赵六审批" activiti:assignee="zhao6" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:taskListener class="do some thing" event="complete" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L7</bpmn2:incoming>\n' +
|
||||
' <bpmn2:incoming>L8</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L2</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' </bpmn2:process>\n' +
|
||||
' <bpmndi:BPMNDiagram id="BPMNDiagram_1">\n' +
|
||||
' <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_0uh8wmt_di" bpmnElement="L3">\n' +
|
||||
' <di:waypoint x="560" y="200" />\n' +
|
||||
' <di:waypoint x="560" y="250" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_01hb865_di" bpmnElement="L2">\n' +
|
||||
' <di:waypoint x="560" y="670" />\n' +
|
||||
' <di:waypoint x="560" y="732" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1t81399_di" bpmnElement="L8">\n' +
|
||||
' <di:waypoint x="690" y="550" />\n' +
|
||||
' <di:waypoint x="690" y="630" />\n' +
|
||||
' <di:waypoint x="610" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_00vdr2t_di" bpmnElement="L7">\n' +
|
||||
' <di:waypoint x="430" y="550" />\n' +
|
||||
' <di:waypoint x="430" y="630" />\n' +
|
||||
' <di:waypoint x="510" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1bnjbaa_di" bpmnElement="L5">\n' +
|
||||
' <di:waypoint x="535" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="456" y="382" width="55" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_12ug1tp_di" bpmnElement="L6">\n' +
|
||||
' <di:waypoint x="585" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="611" y="382" width="56" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1miguqf_di" bpmnElement="L4">\n' +
|
||||
' <di:waypoint x="560" y="330" />\n' +
|
||||
' <di:waypoint x="560" y="375" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1u6pmzo_di" bpmnElement="L1">\n' +
|
||||
' <di:waypoint x="560" y="68" />\n' +
|
||||
' <di:waypoint x="560" y="120" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_0byql27_di" bpmnElement="N1">\n' +
|
||||
' <dc:Bounds x="542" y="32" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="2" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Gateway_0qd58o6_di" bpmnElement="N9" isMarkerVisible="true">\n' +
|
||||
' <dc:Bounds x="535" y="375" width="50" height="50" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="538" y="432" width="44" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_1h4oob7_di" bpmnElement="N3">\n' +
|
||||
' <dc:Bounds x="542" y="732" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="775" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0g48n8q_di" bpmnElement="N2">\n' +
|
||||
' <dc:Bounds x="510" y="120" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_04wpn1b_di" bpmnElement="N4">\n' +
|
||||
' <dc:Bounds x="510" y="250" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0j8meci_di" bpmnElement="N5">\n' +
|
||||
' <dc:Bounds x="380" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0pa1f64_di" bpmnElement="N6">\n' +
|
||||
' <dc:Bounds x="640" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0qmb4lo_di" bpmnElement="N7">\n' +
|
||||
' <dc:Bounds x="510" y="590" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' </bpmndi:BPMNPlane>\n' +
|
||||
' </bpmndi:BPMNDiagram>\n' +
|
||||
'</bpmn2:definitions>\n';
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.containers{
|
||||
position: absolute;
|
||||
background-color: #ffffff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.canvas{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.panel{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -49,9 +49,9 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-lock-screen-login-icon">
|
||||
<SvgIcon name="ele-Microphone" />
|
||||
<SvgIcon name="ele-AlarmClock" />
|
||||
<SvgIcon name="ele-SwitchButton" />
|
||||
<SvgIcon name="ele-Microphone" :size="20" />
|
||||
<SvgIcon name="ele-AlarmClock" :size="20" />
|
||||
<SvgIcon name="ele-SwitchButton" :size="20" />
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
@@ -255,11 +255,11 @@ export default defineComponent({
|
||||
bottom: 50px;
|
||||
&-time {
|
||||
font-size: 100px;
|
||||
color: var(--color-whites);
|
||||
color: var(--el-color-white);
|
||||
}
|
||||
&-info {
|
||||
font-size: 40px;
|
||||
color: var(--color-whites);
|
||||
color: var(--el-color-white);
|
||||
}
|
||||
&-minutes {
|
||||
font-size: 16px;
|
||||
@@ -272,7 +272,7 @@ export default defineComponent({
|
||||
border-radius: 100%;
|
||||
border: 1px solid var(--el-border-color-light, #ebeef5);
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
color: var(--color-whites);
|
||||
color: var(--el-color-white);
|
||||
opacity: 0.8;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
@@ -288,7 +288,7 @@ export default defineComponent({
|
||||
position: absolute;
|
||||
top: 150%;
|
||||
font-size: 12px;
|
||||
color: var(--color-whites);
|
||||
color: var(--el-color-white);
|
||||
left: 50%;
|
||||
line-height: 1.2;
|
||||
transform: translate(-50%, -50%);
|
||||
@@ -299,7 +299,7 @@ export default defineComponent({
|
||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.5);
|
||||
color: var(--color-whites);
|
||||
color: var(--el-color-white);
|
||||
opacity: 1;
|
||||
transition: all 0.3s ease;
|
||||
i {
|
||||
@@ -324,7 +324,7 @@ export default defineComponent({
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
color: var(--color-whites);
|
||||
color: var(--el-color-white);
|
||||
&-box {
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
|
||||
@@ -1,17 +1,18 @@
|
||||
<template>
|
||||
<div v-if="isShowBreadcrumb" class="layout-navbars-breadcrumb">
|
||||
<span class='breadcrumbSpan' style='' @click="onThemeConfigChange">
|
||||
<SvgIcon
|
||||
class="layout-navbars-breadcrumb-icon"
|
||||
:name="themeConfig.isCollapse ? 'ele-Expand' : 'ele-Fold'"
|
||||
:size="16"
|
||||
/>
|
||||
</span>
|
||||
<SvgIcon
|
||||
class="layout-navbars-breadcrumb-icon"
|
||||
:name="themeConfig.isCollapse ? 'ele-Expand' : 'ele-Fold'"
|
||||
:size="16"
|
||||
@click="onThemeConfigChange"
|
||||
/>
|
||||
<el-breadcrumb class="layout-navbars-breadcrumb-hide">
|
||||
<transition-group name="breadcrumb" mode="out-in">
|
||||
<el-breadcrumb-item v-for="(v, k) in breadcrumbList" :key="v.meta.title">
|
||||
<transition-group name="breadcrumb">
|
||||
<el-breadcrumb-item v-for="(v, k) in breadcrumbList" :key="!v.meta.tagsViewName ? v.meta.title : v.meta.tagsViewName">
|
||||
<span v-if="k === breadcrumbList.length - 1" class="layout-navbars-breadcrumb-span">
|
||||
<SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon" />{{ $t(v.meta.title) }}
|
||||
<SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon" />
|
||||
<div v-if="!v.meta.tagsViewName">{{ $t(v.meta.title) }}</div>
|
||||
<div v-else>{{ v.meta.tagsViewName }}</div>
|
||||
</span>
|
||||
<a v-else @click.prevent="onBreadcrumbClick(v)">
|
||||
<SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon" />{{ $t(v.meta.title) }}
|
||||
@@ -26,6 +27,7 @@
|
||||
import { toRefs, reactive, computed, onMounted, defineComponent } from 'vue';
|
||||
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
|
||||
import { Local } from '/@/utils/storage';
|
||||
import other from '/@/utils/other';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||
import { useRoutesList } from '/@/stores/routesList';
|
||||
@@ -78,8 +80,8 @@ export default defineComponent({
|
||||
};
|
||||
// 处理面包屑数据
|
||||
const getBreadcrumbList = (arr: Array<string>) => {
|
||||
arr.map((item: any) => {
|
||||
state.routeSplit.map((v: any, k: number, arrs: any) => {
|
||||
arr.forEach((item: any) => {
|
||||
state.routeSplit.forEach((v: any, k: number, arrs: any) => {
|
||||
if (state.routeSplitFirst === item.path) {
|
||||
state.routeSplitFirst += `/${arrs[state.routeSplitIndex]}`;
|
||||
state.breadcrumbList.push(item);
|
||||
@@ -98,6 +100,9 @@ export default defineComponent({
|
||||
state.routeSplitFirst = `/${state.routeSplit[0]}`;
|
||||
state.routeSplitIndex = 1;
|
||||
getBreadcrumbList(routesList.value);
|
||||
if (route.name === 'home') state.breadcrumbList.shift();
|
||||
// console.log(state.breadcrumbList[state.breadcrumbList.length - 1]);
|
||||
state.breadcrumbList[state.breadcrumbList.length - 1].meta.tagsViewName = other.setTagsViewNameI18n(route);
|
||||
};
|
||||
// 页面加载时
|
||||
onMounted(() => {
|
||||
@@ -124,12 +129,17 @@ export default defineComponent({
|
||||
height: inherit;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 0;
|
||||
.layout-navbars-breadcrumb-icon {
|
||||
cursor: pointer;
|
||||
font-size: 18px;
|
||||
margin-right: 12px;
|
||||
color: var(--next-bg-topBarColor);
|
||||
height: 100%;
|
||||
width: 40px;
|
||||
//opacity: 0.8;
|
||||
&:hover {
|
||||
//opacity: 1;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
}
|
||||
.layout-navbars-breadcrumb-span {
|
||||
opacity: 0.7;
|
||||
@@ -151,13 +161,4 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.breadcrumbSpan{
|
||||
cursor: pointer;
|
||||
padding-left: 12px;margin-right: 4px;height: 100%;padding-top: 17px
|
||||
}
|
||||
.breadcrumbSpan:hover{
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -97,7 +97,7 @@ export default defineComponent({
|
||||
});
|
||||
// 页面卸载时
|
||||
onUnmounted(() => {
|
||||
proxy.mittBus.off('getBreadcrumbIndexSetFilterRoutes');
|
||||
proxy.mittBus.off('getBreadcrumbIndexSetFilterRoutes', () => {});
|
||||
});
|
||||
return {
|
||||
setIsShowLogo,
|
||||
|
||||
@@ -64,7 +64,9 @@ export default defineComponent({
|
||||
state.isShowSearch = true;
|
||||
initTageView();
|
||||
nextTick(() => {
|
||||
layoutMenuAutocompleteRef.value.focus();
|
||||
setTimeout(() => {
|
||||
layoutMenuAutocompleteRef.value.focus();
|
||||
});
|
||||
});
|
||||
};
|
||||
// 搜索弹窗关闭
|
||||
|
||||
@@ -643,7 +643,7 @@ export default defineComponent({
|
||||
});
|
||||
});
|
||||
onUnmounted(() => {
|
||||
proxy.mittBus.off('layoutMobileResize');
|
||||
proxy.mittBus.off('layoutMobileResize', () => {});
|
||||
});
|
||||
return {
|
||||
openDrawer,
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
<i class="icon-skin iconfont" :title="$t('message.user.title3')"></i>
|
||||
</div>
|
||||
<div class="layout-navbars-breadcrumb-user-icon">
|
||||
<el-popover placement="bottom" trigger="click" transition="el-zoom-in-top" :width="300">
|
||||
<el-popover placement="bottom" trigger="click" transition="el-zoom-in-top" :width="300" :persistent="false">
|
||||
<template #reference>
|
||||
<el-badge :is-dot="true">
|
||||
<el-icon :title="$t('message.user.title4')">
|
||||
|
||||
@@ -18,9 +18,7 @@
|
||||
>
|
||||
<i class="iconfont icon-webicon318 layout-navbars-tagsview-ul-li-iconfont" v-if="isActive(v)"></i>
|
||||
<SvgIcon :name="v.meta.icon" v-if="!isActive(v) && getThemeConfig.isTagsviewIcon" class="pr5" />
|
||||
<span>
|
||||
{{ v.meta.isHide===false ? $t(v.meta.title) : v.query ? (v.query.tagsViewName?v.query.tagsViewName:$t(v.meta.title)) : (v.params.tagsViewName?v.params.tagsViewName:$t(v.meta.title)) }}
|
||||
</span>
|
||||
<span>{{ setTagsViewNameI18n(v) }}</span>
|
||||
<template v-if="isActive(v)">
|
||||
<SvgIcon
|
||||
name="ele-RefreshRight"
|
||||
@@ -69,6 +67,7 @@ import { storeToRefs } from 'pinia';
|
||||
import pinia from '/@/stores/index';
|
||||
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
|
||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||
import { useKeepALiveNames } from '/@/stores/keepAliveNames';
|
||||
import { Session } from '/@/utils/storage';
|
||||
import { isObjectValueEqual } from '/@/utils/arrayOperation';
|
||||
import other from '/@/utils/other';
|
||||
@@ -82,9 +81,9 @@ interface TagsViewState {
|
||||
x: string | number;
|
||||
y: string | number;
|
||||
};
|
||||
sortable: any;
|
||||
tagsRefsIndex: number;
|
||||
tagsViewList: any[];
|
||||
sortable: any;
|
||||
tagsViewRoutesList: any[];
|
||||
}
|
||||
interface RouteParams {
|
||||
@@ -117,15 +116,16 @@ export default defineComponent({
|
||||
const storesTagsViewRoutes = useTagsViewRoutes();
|
||||
const { themeConfig } = storeToRefs(storesThemeConfig);
|
||||
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes);
|
||||
const storesKeepALiveNames = useKeepALiveNames();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const state = reactive<TagsViewState>({
|
||||
routeActive: '',
|
||||
routePath: route.path,
|
||||
dropdown: { x: '', y: '' },
|
||||
sortable: '',
|
||||
tagsRefsIndex: 0,
|
||||
tagsViewList: [],
|
||||
sortable: '',
|
||||
tagsViewRoutesList: [],
|
||||
});
|
||||
// 动态设置 tagsView 风格样式
|
||||
@@ -136,6 +136,12 @@ export default defineComponent({
|
||||
const getThemeConfig = computed(() => {
|
||||
return themeConfig.value;
|
||||
});
|
||||
// 设置 自定义 tagsView 名称、 自定义 tagsView 名称国际化
|
||||
const setTagsViewNameI18n = computed(() => {
|
||||
return (v: any) => {
|
||||
return other.setTagsViewNameI18n(v);
|
||||
};
|
||||
});
|
||||
// 设置 tagsView 高亮
|
||||
const isActive = (v: RouteParams) => {
|
||||
if (getThemeConfig.value.isShareTagsView) {
|
||||
@@ -172,6 +178,7 @@ export default defineComponent({
|
||||
if (v.meta.isAffix && !v.meta.isHide) {
|
||||
v.url = setTagsViewHighlight(v);
|
||||
state.tagsViewList.push({ ...v });
|
||||
storesKeepALiveNames.addCachedView(v);
|
||||
}
|
||||
});
|
||||
await addTagsView(route.path, route);
|
||||
@@ -198,6 +205,7 @@ export default defineComponent({
|
||||
if (findItem.meta.isLink && !findItem.meta.isIframe) return false;
|
||||
to.meta.isDynamic ? (findItem.params = to.params) : (findItem.query = to.query);
|
||||
findItem.url = setTagsViewHighlight(findItem);
|
||||
await storesKeepALiveNames.addCachedView(findItem);
|
||||
state.tagsViewList.push({ ...findItem });
|
||||
addBrowserSetSession(state.tagsViewList);
|
||||
}
|
||||
@@ -243,19 +251,26 @@ export default defineComponent({
|
||||
if (to && to.meta.isDynamic) item.params = to?.params ? to?.params : route.params;
|
||||
else item.query = to?.query ? to?.query : route.query;
|
||||
item.url = setTagsViewHighlight(item);
|
||||
await storesKeepALiveNames.addCachedView(item);
|
||||
await state.tagsViewList.push({ ...item });
|
||||
await addBrowserSetSession(state.tagsViewList);
|
||||
});
|
||||
};
|
||||
// 2、刷新当前 tagsView：
|
||||
const refreshCurrentTagsView = (fullPath: string) => {
|
||||
proxy.mittBus.emit('onTagsViewRefreshRouterView', fullPath);
|
||||
const refreshCurrentTagsView = async (fullPath: string) => {
|
||||
const item = state.tagsViewList.find((v: any) => (getThemeConfig.value.isShareTagsView ? v.path === fullPath : v.url === fullPath));
|
||||
if (item != null) {
|
||||
await storesKeepALiveNames.delCachedView(item);
|
||||
proxy.mittBus.emit('onTagsViewRefreshRouterView', fullPath);
|
||||
if (item.meta.isKeepAlive) storesKeepALiveNames.addCachedView(item);
|
||||
}
|
||||
};
|
||||
// 3、关闭当前 tagsView：如果是设置了固定的（isAffix），不可以关闭
|
||||
const closeCurrentTagsView = (path: string) => {
|
||||
state.tagsViewList.map((v: any, k: number, arr: any) => {
|
||||
if (!v.meta.isAffix) {
|
||||
if (getThemeConfig.value.isShareTagsView ? v.path === path : v.url === path) {
|
||||
storesKeepALiveNames.delCachedView(v);
|
||||
state.tagsViewList.splice(k, 1);
|
||||
setTimeout(() => {
|
||||
if (state.tagsViewList.length === k && getThemeConfig.value.isShareTagsView ? state.routePath === path : state.routeActive === path) {
|
||||
@@ -294,6 +309,7 @@ export default defineComponent({
|
||||
Session.get('tagsViewList').map((v: any) => {
|
||||
if (v.meta.isAffix && !v.meta.isHide) {
|
||||
v.url = setTagsViewHighlight(v);
|
||||
storesKeepALiveNames.delOthersCachedViews(v);
|
||||
state.tagsViewList.push({ ...v });
|
||||
}
|
||||
});
|
||||
@@ -304,6 +320,7 @@ export default defineComponent({
|
||||
// 5、关闭全部 tagsView：如果是设置了固定的（isAffix），不进行关闭
|
||||
const closeAllTagsView = () => {
|
||||
if (Session.get('tagsViewList')) {
|
||||
storesKeepALiveNames.delAllCachedViews();
|
||||
state.tagsViewList = [];
|
||||
Session.get('tagsViewList').map((v: any) => {
|
||||
if (v.meta.isAffix && !v.meta.isHide) {
|
||||
@@ -527,11 +544,11 @@ export default defineComponent({
|
||||
// 页面卸载时
|
||||
onUnmounted(() => {
|
||||
// 取消非本页面调用监听
|
||||
proxy.mittBus.off('onCurrentContextmenuClick');
|
||||
proxy.mittBus.off('onCurrentContextmenuClick', () => {});
|
||||
// 取消监听布局配置界面开启/关闭拖拽
|
||||
proxy.mittBus.off('openOrCloseSortable');
|
||||
proxy.mittBus.off('openOrCloseSortable', () => {});
|
||||
// 取消监听布局配置开启 TagsView 共用
|
||||
proxy.mittBus.off('openShareTagsView');
|
||||
proxy.mittBus.off('openShareTagsView', () => {});
|
||||
// 取消窗口 resize 监听
|
||||
window.removeEventListener('resize', onSortableResize);
|
||||
});
|
||||
@@ -541,11 +558,11 @@ export default defineComponent({
|
||||
});
|
||||
// 页面加载时
|
||||
onMounted(() => {
|
||||
// 初始化 vuex 中的 tagsViewRoutes 列表
|
||||
// 初始化 pinia 中的 tagsViewRoutes 列表
|
||||
getTagsViewRoutes();
|
||||
initSortable();
|
||||
});
|
||||
// 路由更新时
|
||||
// 路由更新时（组件内生命钩子）
|
||||
onBeforeRouteUpdate(async (to) => {
|
||||
state.routeActive = setTagsViewHighlight(to);
|
||||
state.routePath = to.meta.isDynamic ? to.meta.isDynamicPath : to.path;
|
||||
@@ -563,24 +580,6 @@ export default defineComponent({
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
// 监听路由的变化，用于设置不同的 tagsViewName
|
||||
watch(
|
||||
() => route,
|
||||
(route: any) => {
|
||||
setTimeout(() => {
|
||||
// 区分 "动态路由" 与 "普通路由"
|
||||
state.tagsViewList.forEach((tagsItem: any) => {
|
||||
const path = route.meta.isDynamic ? route.meta.isDynamicPath : route.path;
|
||||
const tagsName = route.meta.isDynamic ? route.params.tagsViewName : route.query.tagsViewName;
|
||||
if (path === tagsItem.path && tagsName) tagsItem.meta.title = tagsName;
|
||||
});
|
||||
});
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true,
|
||||
}
|
||||
);
|
||||
return {
|
||||
isActive,
|
||||
onContextmenu,
|
||||
@@ -592,6 +591,7 @@ export default defineComponent({
|
||||
onHandleScroll,
|
||||
getThemeConfig,
|
||||
setTagsStyle,
|
||||
setTagsViewNameI18n,
|
||||
refreshCurrentTagsView,
|
||||
closeCurrentTagsView,
|
||||
onCurrentContextmenuClick,
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="h100">
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition :name="setTransitionName" mode="out-in">
|
||||
<keep-alive :include="keepAliveNameList">
|
||||
<keep-alive :include="getKeepAliveNames">
|
||||
<component :is="Component" :key="refreshRouterViewKey" class="w100" />
|
||||
</keep-alive>
|
||||
</transition>
|
||||
@@ -28,9 +28,9 @@ export default defineComponent({
|
||||
setup() {
|
||||
const { proxy } = <any>getCurrentInstance();
|
||||
const route = useRoute();
|
||||
const stores = useKeepALiveNames();
|
||||
const storesKeepAliveNames = useKeepALiveNames();
|
||||
const storesThemeConfig = useThemeConfig();
|
||||
const { keepAliveNames } = storeToRefs(stores);
|
||||
const { keepAliveNames, cachedViews } = storeToRefs(storesKeepAliveNames);
|
||||
const { themeConfig } = storeToRefs(storesThemeConfig);
|
||||
const state = reactive<ParentViewState>({
|
||||
refreshRouterViewKey: null,
|
||||
@@ -40,6 +40,10 @@ export default defineComponent({
|
||||
const setTransitionName = computed(() => {
|
||||
return themeConfig.value.animation;
|
||||
});
|
||||
// 获取组件缓存列表(name值)
|
||||
const getKeepAliveNames = computed(() => {
|
||||
return themeConfig.value.isTagsview ? cachedViews.value : state.keepAliveNameList;
|
||||
});
|
||||
// 页面加载前，处理缓存，页面刷新时路由缓存处理
|
||||
onBeforeMount(() => {
|
||||
state.keepAliveNameList = keepAliveNames.value;
|
||||
@@ -54,7 +58,7 @@ export default defineComponent({
|
||||
});
|
||||
// 页面卸载时
|
||||
onUnmounted(() => {
|
||||
proxy.mittBus.off('onTagsViewRefreshRouterView');
|
||||
proxy.mittBus.off('onTagsViewRefreshRouterView', () => {});
|
||||
});
|
||||
// 监听路由变化，防止 tagsView 多标签时，切换动画消失
|
||||
watch(
|
||||
@@ -65,6 +69,7 @@ export default defineComponent({
|
||||
);
|
||||
return {
|
||||
setTransitionName,
|
||||
getKeepAliveNames,
|
||||
...toRefs(state),
|
||||
};
|
||||
},
|
||||
|
||||
@@ -53,7 +53,7 @@
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='审批内容' name='tab2'>
|
||||
<el-tab-pane label='表单配置' name='tab2'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<v-form-designer ref='vform' />
|
||||
|
||||
@@ -1,395 +0,0 @@
|
||||
<template>
|
||||
|
||||
<el-card class='box-card' :body-style="{padding:'2px 8px'}" shadow='never'>
|
||||
<template #header>
|
||||
<el-row>
|
||||
<el-col :span='10'>
|
||||
<div style='line-height: 32px'>流程模板</div>
|
||||
</el-col>
|
||||
<el-col :span='14' style='text-align: right'>
|
||||
<el-button type='success' @click='save(state)' plain>保 存</el-button>
|
||||
<el-button type='info' plain>复 制</el-button>
|
||||
<el-button type='info' @click='pageClose' plain>关 闭</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<CateModal url='oa/flow/cate/tree' ref='cateModal' @close='cateChoose' />
|
||||
<div style='margin-top: 8px;margin-bottom: 8px'>
|
||||
<el-form ref='formRef' :model='form' label-width='140px'>
|
||||
<el-tabs type='card' v-model='activeName'>
|
||||
<el-tab-pane label='基本信息' name='tab1' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='模板名称：' prop='name' :rules="[{ required: true, message: '名称不能为空'}]">
|
||||
<div class='zinput'>
|
||||
<el-input v-model='form.name'></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='所属分类：' prop='cate' :rules="[{ required: true, message: '分类不能为空'}]">
|
||||
<div class='zinput'>
|
||||
<el-input :value='form.cate?.name' :suffix-icon='Search' :readonly='true' @click='openCateModal'></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='排序号：'>
|
||||
<div class='zinput'>
|
||||
<el-input-number v-model='form.ornum' controls-position='right' style='width: 100%' />
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='是否可用：'>
|
||||
<div class='zinput'>
|
||||
<el-switch v-model='form.avtag'>
|
||||
</el-switch>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='审批内容' name='tab2'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<v-form-designer ref='vform' />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='流程配置' name='tab3'>
|
||||
<div style='width: 100%;height: 720px'>
|
||||
<!-- <Modeler2 @bpmnMounted='bpmnMounted' />-->
|
||||
<Modeler @bpmnMounted='bpmnMounted' />
|
||||
<Panel />
|
||||
<BpmnActions />
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='权限配置' name='tab4' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<el-form-item label='备注：'>
|
||||
<div class='zinput' style='height: auto'>
|
||||
<el-input style="font-family: 'Courier New', Helvetica, Arial, sans-serif; font-size:16px"
|
||||
type='textarea' :rows='4'
|
||||
v-model='form.notes'>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='其他信息' name='tab9' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<el-form-item label='备注：'>
|
||||
<div class='zinput' style='height: auto'>
|
||||
<el-input style="font-family: 'Courier New', Helvetica, Arial, sans-serif; font-size:16px"
|
||||
type='textarea' :rows='4'
|
||||
v-model='form.notes'>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-show='form.crtim'>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='创建人：'>
|
||||
<div class='zinput'>
|
||||
{{ form.crman ? form.crman.name : '' }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='创建时间：'>
|
||||
<div class='zinput'>
|
||||
{{ form.crtim }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='更新人：'>
|
||||
<div class='zinput'>
|
||||
{{ form.upman ? form.upman.name : '' }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='更新时间：'>
|
||||
<div class='zinput'>
|
||||
{{ form.uptim }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
<script lang='ts'>
|
||||
export default { name: 'oaFlowTempEdit' };
|
||||
</script>
|
||||
<script lang='ts' setup>
|
||||
import { onMounted, reactive, ref, toRefs } from 'vue';
|
||||
import { pageSave, pageClose } from '/@/comps/page/edit';
|
||||
import { useRoute } from 'vue-router';
|
||||
import Modeler from '/@/comps/Activiti/Modeler';
|
||||
import Panel from '/@/comps/Activiti/panel';
|
||||
import BpmnActions from '/@/comps/Activiti/bpmn-actions';
|
||||
import { BpmnStore } from '/@/bpmn/store';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import CateModal from '/@/comps/gen/GenModal.vue';
|
||||
import { FormInstance } from 'element-plus';
|
||||
import request from '/@/utils/request';
|
||||
|
||||
const route = useRoute();
|
||||
const formRef = ref<FormInstance>();
|
||||
const activeName = ref('tab1');
|
||||
|
||||
const state = reactive({
|
||||
url: '/oa/flow/temp',
|
||||
params: { path: '', query: {} as any},
|
||||
form: { avtag: true } as any,
|
||||
});
|
||||
|
||||
const { form } = toRefs(state);
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
NextLoading.done();
|
||||
state.params = <any>route;
|
||||
let id = state.params.query?.id;
|
||||
if (id) {
|
||||
state.form = await request({
|
||||
url: state.url + '/one/' + id,
|
||||
method: 'get',
|
||||
});
|
||||
} else {
|
||||
let catid = state.params.query?.catid;
|
||||
if (catid) {
|
||||
state.form.cate = { id: catid, name: state.params.query?.catna };
|
||||
}
|
||||
state.form.avtag = true;
|
||||
}
|
||||
|
||||
if (form.value.id) {
|
||||
await BpmnStore.importXML(form.value.prxml);
|
||||
} else {
|
||||
await BpmnStore.importXML(defxml);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
async function save(state: any) {
|
||||
|
||||
const bpmn = await BpmnStore.getXML();
|
||||
// console.log(typeof (bpmn.xml));
|
||||
// xFlow.value.getData();
|
||||
form.value.vform = JSON.stringify(vform.value.getFormJson());
|
||||
form.value.prxml = bpmn.xml;
|
||||
console.log(bpmn.xml);
|
||||
await pageSave(formRef.value, state);
|
||||
}
|
||||
|
||||
const vform = ref();
|
||||
|
||||
|
||||
const defxml = '<?xml version="1.0" encoding="UTF-8"?>\n' +
|
||||
'<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:activiti="http://activiti.org/bpmn" id="sample-diagram" targetNamespace="http://activiti.org/bpmn" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd">\n' +
|
||||
' <bpmn2:process id="Process_1" name="1" isExecutable="true">\n' +
|
||||
' <bpmn2:startEvent id="N1" name="开始节点">\n' +
|
||||
' <bpmn2:outgoing>L1</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:startEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L1" sourceRef="N1" targetRef="N2" />\n' +
|
||||
' <bpmn2:exclusiveGateway id="N9" name="条件分支">\n' +
|
||||
' <bpmn2:documentation>判断审批金额是否大于100</bpmn2:documentation>\n' +
|
||||
' <bpmn2:incoming>L4</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L6</bpmn2:outgoing>\n' +
|
||||
' <bpmn2:outgoing>L5</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:exclusiveGateway>\n' +
|
||||
' <bpmn2:sequenceFlow id="L4" sourceRef="N4" targetRef="N9" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L6" name="王五分支线" sourceRef="N9" targetRef="N6">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money<=100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L5" name="李四分支线" sourceRef="N9" targetRef="N5">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money>100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L7" sourceRef="N5" targetRef="N7" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L8" sourceRef="N6" targetRef="N7" />\n' +
|
||||
' <bpmn2:endEvent id="N3" name="结束节点">\n' +
|
||||
' <bpmn2:incoming>L2</bpmn2:incoming>\n' +
|
||||
' </bpmn2:endEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L2" sourceRef="N7" targetRef="N3" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L3" sourceRef="N2" targetRef="N4" />\n' +
|
||||
' <bpmn2:userTask id="N2" name="起草节点" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>起草节点，表单数据一般从绑定的表单提取</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:formProperty id="money" type="int" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="编辑" value="edit" />\n' +
|
||||
' <activiti:property name="撤回" value="back" />\n' +
|
||||
' <activiti:property name="提交" value="commit" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L1</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L3</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N4" name="张三审批" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>审批节点</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L3</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L4</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N5" name="李四审批" activiti:assignee="l4" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L5</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L7</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N6" name="王五审批" activiti:assignee="w5" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L6</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L8</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N7" name="赵六审批" activiti:assignee="zhao6" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:taskListener class="do some thing" event="complete" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L7</bpmn2:incoming>\n' +
|
||||
' <bpmn2:incoming>L8</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L2</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' </bpmn2:process>\n' +
|
||||
' <bpmndi:BPMNDiagram id="BPMNDiagram_1">\n' +
|
||||
' <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_0uh8wmt_di" bpmnElement="L3">\n' +
|
||||
' <di:waypoint x="560" y="200" />\n' +
|
||||
' <di:waypoint x="560" y="250" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_01hb865_di" bpmnElement="L2">\n' +
|
||||
' <di:waypoint x="560" y="670" />\n' +
|
||||
' <di:waypoint x="560" y="732" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1t81399_di" bpmnElement="L8">\n' +
|
||||
' <di:waypoint x="690" y="550" />\n' +
|
||||
' <di:waypoint x="690" y="630" />\n' +
|
||||
' <di:waypoint x="610" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_00vdr2t_di" bpmnElement="L7">\n' +
|
||||
' <di:waypoint x="430" y="550" />\n' +
|
||||
' <di:waypoint x="430" y="630" />\n' +
|
||||
' <di:waypoint x="510" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1bnjbaa_di" bpmnElement="L5">\n' +
|
||||
' <di:waypoint x="535" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="456" y="382" width="55" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_12ug1tp_di" bpmnElement="L6">\n' +
|
||||
' <di:waypoint x="585" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="611" y="382" width="56" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1miguqf_di" bpmnElement="L4">\n' +
|
||||
' <di:waypoint x="560" y="330" />\n' +
|
||||
' <di:waypoint x="560" y="375" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1u6pmzo_di" bpmnElement="L1">\n' +
|
||||
' <di:waypoint x="560" y="68" />\n' +
|
||||
' <di:waypoint x="560" y="120" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_0byql27_di" bpmnElement="N1">\n' +
|
||||
' <dc:Bounds x="542" y="32" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="2" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Gateway_0qd58o6_di" bpmnElement="N9" isMarkerVisible="true">\n' +
|
||||
' <dc:Bounds x="535" y="375" width="50" height="50" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="538" y="432" width="44" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_1h4oob7_di" bpmnElement="N3">\n' +
|
||||
' <dc:Bounds x="542" y="732" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="775" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0g48n8q_di" bpmnElement="N2">\n' +
|
||||
' <dc:Bounds x="510" y="120" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_04wpn1b_di" bpmnElement="N4">\n' +
|
||||
' <dc:Bounds x="510" y="250" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0j8meci_di" bpmnElement="N5">\n' +
|
||||
' <dc:Bounds x="380" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0pa1f64_di" bpmnElement="N6">\n' +
|
||||
' <dc:Bounds x="640" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0qmb4lo_di" bpmnElement="N7">\n' +
|
||||
' <dc:Bounds x="510" y="590" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' </bpmndi:BPMNPlane>\n' +
|
||||
' </bpmndi:BPMNDiagram>\n' +
|
||||
'</bpmn2:definitions>\n';
|
||||
|
||||
|
||||
//region -----分类弹框逻辑-----
|
||||
const cateModal = ref();
|
||||
const openCateModal = () => {
|
||||
cateModal.value.openModal();
|
||||
};
|
||||
const cateChoose = (node: any) => {
|
||||
if (node == null) {
|
||||
form.value.cate = null;
|
||||
} else {
|
||||
form.value.cate = { id: node.id, name: node.name };
|
||||
}
|
||||
};
|
||||
//endregion
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,395 @@
|
||||
<template>
|
||||
|
||||
<el-card class='box-card' :body-style="{padding:'2px 8px'}" shadow='never'>
|
||||
<template #header>
|
||||
<el-row>
|
||||
<el-col :span='10'>
|
||||
<div style='line-height: 32px'>流程模板</div>
|
||||
</el-col>
|
||||
<el-col :span='14' style='text-align: right'>
|
||||
<el-button type='success' @click='save(state)' plain>保 存</el-button>
|
||||
<el-button type='info' plain>复 制</el-button>
|
||||
<el-button type='info' @click='pageClose' plain>关 闭</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<CateModal url='oa/flow/cate/tree' ref='cateModal' @close='cateChoose' />
|
||||
<div style='margin-top: 8px;margin-bottom: 8px'>
|
||||
<el-form ref='formRef' :model='form' label-width='140px'>
|
||||
<el-tabs type='card' v-model='activeName'>
|
||||
<el-tab-pane label='基本信息' name='tab1' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='模板名称：' prop='name' :rules="[{ required: true, message: '名称不能为空'}]">
|
||||
<div class='zinput'>
|
||||
<el-input v-model='form.name'></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='所属分类：' prop='cate' :rules="[{ required: true, message: '分类不能为空'}]">
|
||||
<div class='zinput'>
|
||||
<el-input :value='form.cate?.name' :suffix-icon='Search' :readonly='true' @click='openCateModal'></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='排序号：'>
|
||||
<div class='zinput'>
|
||||
<el-input-number v-model='form.ornum' controls-position='right' style='width: 100%' />
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='是否可用：'>
|
||||
<div class='zinput'>
|
||||
<el-switch v-model='form.avtag'>
|
||||
</el-switch>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='审批内容' name='tab2'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<v-form-designer ref='vform' />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='流程配置' name='tab3'>
|
||||
<div style='width: 100%;height: 720px'>
|
||||
<!-- <Modeler2 @bpmnMounted='bpmnMounted' />-->
|
||||
<Modeler @bpmnMounted='bpmnMounted' />
|
||||
<Panel />
|
||||
<BpmnActions />
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='权限配置' name='tab4' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<el-form-item label='备注：'>
|
||||
<div class='zinput' style='height: auto'>
|
||||
<el-input style="font-family: 'Courier New', Helvetica, Arial, sans-serif; font-size:16px"
|
||||
type='textarea' :rows='4'
|
||||
v-model='form.notes'>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='其他信息' name='tab9' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<el-form-item label='备注：'>
|
||||
<div class='zinput' style='height: auto'>
|
||||
<el-input style="font-family: 'Courier New', Helvetica, Arial, sans-serif; font-size:16px"
|
||||
type='textarea' :rows='4'
|
||||
v-model='form.notes'>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-show='form.crtim'>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='创建人：'>
|
||||
<div class='zinput'>
|
||||
{{ form.crman ? form.crman.name : '' }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='创建时间：'>
|
||||
<div class='zinput'>
|
||||
{{ form.crtim }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='更新人：'>
|
||||
<div class='zinput'>
|
||||
{{ form.upman ? form.upman.name : '' }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='更新时间：'>
|
||||
<div class='zinput'>
|
||||
{{ form.uptim }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
<script lang='ts'>
|
||||
export default { name: 'oaFlowTempEdit' };
|
||||
</script>
|
||||
<script lang='ts' setup>
|
||||
import { onMounted, reactive, ref, toRefs } from 'vue';
|
||||
import { pageSave, pageClose } from '/@/comps/page/edit';
|
||||
import { useRoute } from 'vue-router';
|
||||
import Modeler from '/@/comps/Activiti/Modeler';
|
||||
import Panel from '/@/comps/Activiti/panel';
|
||||
import BpmnActions from '/@/comps/Activiti/bpmn-actions';
|
||||
import { BpmnStore } from '/@/bpmn/store';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import CateModal from '/@/comps/gen/GenModal.vue';
|
||||
import { FormInstance } from 'element-plus';
|
||||
import request from '/@/utils/request';
|
||||
|
||||
const route = useRoute();
|
||||
const formRef = ref<FormInstance>();
|
||||
const activeName = ref('tab1');
|
||||
|
||||
const state = reactive({
|
||||
url: '/oa/flow/temp',
|
||||
params: { path: '', query: {} as any},
|
||||
form: { avtag: true } as any,
|
||||
});
|
||||
|
||||
const { form } = toRefs(state);
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
NextLoading.done();
|
||||
state.params = <any>route;
|
||||
let id = state.params.query?.id;
|
||||
if (id) {
|
||||
state.form = await request({
|
||||
url: state.url + '/one/' + id,
|
||||
method: 'get',
|
||||
});
|
||||
} else {
|
||||
let catid = state.params.query?.catid;
|
||||
if (catid) {
|
||||
state.form.cate = { id: catid, name: state.params.query?.catna };
|
||||
}
|
||||
state.form.avtag = true;
|
||||
}
|
||||
|
||||
if (form.value.id) {
|
||||
await BpmnStore.importXML(form.value.prxml);
|
||||
} else {
|
||||
await BpmnStore.importXML(defxml);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
async function save(state: any) {
|
||||
|
||||
const bpmn = await BpmnStore.getXML();
|
||||
// console.log(typeof (bpmn.xml));
|
||||
// xFlow.value.getData();
|
||||
form.value.vform = JSON.stringify(vform.value.getFormJson());
|
||||
form.value.prxml = bpmn.xml;
|
||||
console.log(bpmn.xml);
|
||||
await pageSave(formRef.value, state);
|
||||
}
|
||||
|
||||
const vform = ref();
|
||||
|
||||
|
||||
const defxml = '<?xml version="1.0" encoding="UTF-8"?>\n' +
|
||||
'<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:activiti="http://activiti.org/bpmn" id="sample-diagram" targetNamespace="http://activiti.org/bpmn" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd">\n' +
|
||||
' <bpmn2:process id="Process_1" name="1" isExecutable="true">\n' +
|
||||
' <bpmn2:startEvent id="N1" name="开始节点">\n' +
|
||||
' <bpmn2:outgoing>L1</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:startEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L1" sourceRef="N1" targetRef="N2" />\n' +
|
||||
' <bpmn2:exclusiveGateway id="N9" name="条件分支">\n' +
|
||||
' <bpmn2:documentation>判断审批金额是否大于100</bpmn2:documentation>\n' +
|
||||
' <bpmn2:incoming>L4</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L6</bpmn2:outgoing>\n' +
|
||||
' <bpmn2:outgoing>L5</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:exclusiveGateway>\n' +
|
||||
' <bpmn2:sequenceFlow id="L4" sourceRef="N4" targetRef="N9" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L6" name="王五分支线" sourceRef="N9" targetRef="N6">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money<=100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L5" name="李四分支线" sourceRef="N9" targetRef="N5">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money>100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L7" sourceRef="N5" targetRef="N7" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L8" sourceRef="N6" targetRef="N7" />\n' +
|
||||
' <bpmn2:endEvent id="N3" name="结束节点">\n' +
|
||||
' <bpmn2:incoming>L2</bpmn2:incoming>\n' +
|
||||
' </bpmn2:endEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L2" sourceRef="N7" targetRef="N3" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L3" sourceRef="N2" targetRef="N4" />\n' +
|
||||
' <bpmn2:userTask id="N2" name="起草节点" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>起草节点，表单数据一般从绑定的表单提取</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:formProperty id="money" type="int" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="编辑" value="edit" />\n' +
|
||||
' <activiti:property name="撤回" value="back" />\n' +
|
||||
' <activiti:property name="提交" value="commit" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L1</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L3</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N4" name="张三审批" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>审批节点</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L3</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L4</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N5" name="李四审批" activiti:assignee="l4" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L5</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L7</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N6" name="王五审批" activiti:assignee="w5" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L6</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L8</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N7" name="赵六审批" activiti:assignee="zhao6" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:taskListener class="do some thing" event="complete" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L7</bpmn2:incoming>\n' +
|
||||
' <bpmn2:incoming>L8</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L2</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' </bpmn2:process>\n' +
|
||||
' <bpmndi:BPMNDiagram id="BPMNDiagram_1">\n' +
|
||||
' <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_0uh8wmt_di" bpmnElement="L3">\n' +
|
||||
' <di:waypoint x="560" y="200" />\n' +
|
||||
' <di:waypoint x="560" y="250" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_01hb865_di" bpmnElement="L2">\n' +
|
||||
' <di:waypoint x="560" y="670" />\n' +
|
||||
' <di:waypoint x="560" y="732" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1t81399_di" bpmnElement="L8">\n' +
|
||||
' <di:waypoint x="690" y="550" />\n' +
|
||||
' <di:waypoint x="690" y="630" />\n' +
|
||||
' <di:waypoint x="610" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_00vdr2t_di" bpmnElement="L7">\n' +
|
||||
' <di:waypoint x="430" y="550" />\n' +
|
||||
' <di:waypoint x="430" y="630" />\n' +
|
||||
' <di:waypoint x="510" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1bnjbaa_di" bpmnElement="L5">\n' +
|
||||
' <di:waypoint x="535" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="456" y="382" width="55" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_12ug1tp_di" bpmnElement="L6">\n' +
|
||||
' <di:waypoint x="585" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="611" y="382" width="56" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1miguqf_di" bpmnElement="L4">\n' +
|
||||
' <di:waypoint x="560" y="330" />\n' +
|
||||
' <di:waypoint x="560" y="375" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1u6pmzo_di" bpmnElement="L1">\n' +
|
||||
' <di:waypoint x="560" y="68" />\n' +
|
||||
' <di:waypoint x="560" y="120" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_0byql27_di" bpmnElement="N1">\n' +
|
||||
' <dc:Bounds x="542" y="32" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="2" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Gateway_0qd58o6_di" bpmnElement="N9" isMarkerVisible="true">\n' +
|
||||
' <dc:Bounds x="535" y="375" width="50" height="50" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="538" y="432" width="44" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_1h4oob7_di" bpmnElement="N3">\n' +
|
||||
' <dc:Bounds x="542" y="732" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="775" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0g48n8q_di" bpmnElement="N2">\n' +
|
||||
' <dc:Bounds x="510" y="120" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_04wpn1b_di" bpmnElement="N4">\n' +
|
||||
' <dc:Bounds x="510" y="250" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0j8meci_di" bpmnElement="N5">\n' +
|
||||
' <dc:Bounds x="380" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0pa1f64_di" bpmnElement="N6">\n' +
|
||||
' <dc:Bounds x="640" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0qmb4lo_di" bpmnElement="N7">\n' +
|
||||
' <dc:Bounds x="510" y="590" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' </bpmndi:BPMNPlane>\n' +
|
||||
' </bpmndi:BPMNDiagram>\n' +
|
||||
'</bpmn2:definitions>\n';
|
||||
|
||||
|
||||
//region -----分类弹框逻辑-----
|
||||
const cateModal = ref();
|
||||
const openCateModal = () => {
|
||||
cateModal.value.openModal();
|
||||
};
|
||||
const cateChoose = (node: any) => {
|
||||
if (node == null) {
|
||||
form.value.cate = null;
|
||||
} else {
|
||||
form.value.cate = { id: node.id, name: node.name };
|
||||
}
|
||||
};
|
||||
//endregion
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,367 @@
|
||||
<template>
|
||||
|
||||
<el-card class='box-card' :body-style="{padding:'2px 8px'}" shadow='never'>
|
||||
<template #header>
|
||||
<el-row>
|
||||
<el-col :span='10'>
|
||||
<div style='line-height: 32px'>流程模板</div>
|
||||
</el-col>
|
||||
<el-col :span='14' style='text-align: right'>
|
||||
<el-button type='success' @click='save(state)' plain>保 存</el-button>
|
||||
<el-button type='info' plain>复 制</el-button>
|
||||
<el-button type='info' @click='pageClose' plain>关 闭</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<CateModal url='oa/flow/cate/tree' ref='cateModal' @close='cateChoose' />
|
||||
<div style='margin-top: 8px;margin-bottom: 8px'>
|
||||
<el-form ref='formRef' :model='form' label-width='140px'>
|
||||
<el-tabs type='card' v-model='activeName'>
|
||||
<el-tab-pane label='基本信息' name='tab1' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='模板名称：' prop='name' :rules="[{ required: true, message: '名称不能为空'}]">
|
||||
<div class='zinput'>
|
||||
<el-input v-model='form.name'></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='所属分类：' prop='cate' :rules="[{ required: true, message: '分类不能为空'}]">
|
||||
<div class='zinput'>
|
||||
<el-input :value='form.cate?.name' :suffix-icon='Search' :readonly='true' @click='openCateModal'></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='排序号：'>
|
||||
<div class='zinput'>
|
||||
<el-input-number v-model='form.ornum' controls-position='right' style='width: 100%' />
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item label='是否可用：'>
|
||||
<div class='zinput'>
|
||||
<el-switch v-model='form.avtag'>
|
||||
</el-switch>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
|
||||
<el-tab-pane label='流程配置' name='tab3'>
|
||||
<div style='width: 100%;height: 720px'>
|
||||
<MyBpmn/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='权限配置' name='tab4' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<el-form-item label='备注：'>
|
||||
<div class='zinput' style='height: auto'>
|
||||
<el-input style="font-family: 'Courier New', Helvetica, Arial, sans-serif; font-size:16px"
|
||||
type='textarea' :rows='4'
|
||||
v-model='form.notes'>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label='其他信息' name='tab9' class='zform'>
|
||||
<el-row style='border-top: 1px solid #d2d2d2;'>
|
||||
<el-col :span='24'>
|
||||
<el-form-item label='备注：'>
|
||||
<div class='zinput' style='height: auto'>
|
||||
<el-input style="font-family: 'Courier New', Helvetica, Arial, sans-serif; font-size:16px"
|
||||
type='textarea' :rows='4'
|
||||
v-model='form.notes'>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-show='form.crtim'>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='创建人：'>
|
||||
<div class='zinput'>
|
||||
{{ form.crman ? form.crman.name : '' }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='创建时间：'>
|
||||
<div class='zinput'>
|
||||
{{ form.crtim }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='更新人：'>
|
||||
<div class='zinput'>
|
||||
{{ form.upman ? form.upman.name : '' }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='6'>
|
||||
<el-form-item label='更新时间：'>
|
||||
<div class='zinput'>
|
||||
{{ form.uptim }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
<script lang='ts'>
|
||||
export default { name: 'oaFlowTempEdit' };
|
||||
</script>
|
||||
<script lang='ts' setup>
|
||||
import { onMounted, reactive, ref, toRefs } from 'vue';
|
||||
import { pageSave, pageClose } from '/@/comps/page/edit';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import CateModal from '/@/comps/gen/GenModal.vue';
|
||||
import MyBpmn from '/@/comps/bpmn/MyBpmn.vue';
|
||||
import { FormInstance } from 'element-plus';
|
||||
import request from '/@/utils/request';
|
||||
|
||||
const route = useRoute();
|
||||
const formRef = ref<FormInstance>();
|
||||
const activeName = ref('tab1');
|
||||
|
||||
const state = reactive({
|
||||
url: '/oa/flow/temp',
|
||||
params: { path: '', query: {} as any},
|
||||
form: { avtag: true } as any,
|
||||
});
|
||||
|
||||
const { form } = toRefs(state);
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
NextLoading.done();
|
||||
state.params = <any>route;
|
||||
let id = state.params.query?.id;
|
||||
if (id) {
|
||||
state.form = await request({
|
||||
url: state.url + '/one/' + id,
|
||||
method: 'get',
|
||||
});
|
||||
} else {
|
||||
let catid = state.params.query?.catid;
|
||||
if (catid) {
|
||||
state.form.cate = { id: catid, name: state.params.query?.catna };
|
||||
}
|
||||
state.form.avtag = true;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
async function save(state: any) {
|
||||
await pageSave(formRef.value, state);
|
||||
}
|
||||
|
||||
|
||||
|
||||
const defxml = '<?xml version="1.0" encoding="UTF-8"?>\n' +
|
||||
'<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:activiti="http://activiti.org/bpmn" id="sample-diagram" targetNamespace="http://activiti.org/bpmn" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd">\n' +
|
||||
' <bpmn2:process id="Process_1" name="1" isExecutable="true">\n' +
|
||||
' <bpmn2:startEvent id="N1" name="开始节点">\n' +
|
||||
' <bpmn2:outgoing>L1</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:startEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L1" sourceRef="N1" targetRef="N2" />\n' +
|
||||
' <bpmn2:exclusiveGateway id="N9" name="条件分支">\n' +
|
||||
' <bpmn2:documentation>判断审批金额是否大于100</bpmn2:documentation>\n' +
|
||||
' <bpmn2:incoming>L4</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L6</bpmn2:outgoing>\n' +
|
||||
' <bpmn2:outgoing>L5</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:exclusiveGateway>\n' +
|
||||
' <bpmn2:sequenceFlow id="L4" sourceRef="N4" targetRef="N9" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L6" name="王五分支线" sourceRef="N9" targetRef="N6">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money<=100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L5" name="李四分支线" sourceRef="N9" targetRef="N5">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:executionListener expression="money>100" event="take" />\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' </bpmn2:sequenceFlow>\n' +
|
||||
' <bpmn2:sequenceFlow id="L7" sourceRef="N5" targetRef="N7" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L8" sourceRef="N6" targetRef="N7" />\n' +
|
||||
' <bpmn2:endEvent id="N3" name="结束节点">\n' +
|
||||
' <bpmn2:incoming>L2</bpmn2:incoming>\n' +
|
||||
' </bpmn2:endEvent>\n' +
|
||||
' <bpmn2:sequenceFlow id="L2" sourceRef="N7" targetRef="N3" />\n' +
|
||||
' <bpmn2:sequenceFlow id="L3" sourceRef="N2" targetRef="N4" />\n' +
|
||||
' <bpmn2:userTask id="N2" name="起草节点" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>起草节点，表单数据一般从绑定的表单提取</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:formProperty id="money" type="int" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="编辑" value="edit" />\n' +
|
||||
' <activiti:property name="撤回" value="back" />\n' +
|
||||
' <activiti:property name="提交" value="commit" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L1</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L3</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N4" name="张三审批" activiti:assignee="z3" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:documentation>审批节点</bpmn2:documentation>\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L3</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L4</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N5" name="李四审批" activiti:assignee="l4" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L5</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L7</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N6" name="王五审批" activiti:assignee="w5" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' <activiti:property name="驳回" value="reject" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L6</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L8</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' <bpmn2:userTask id="N7" name="赵六审批" activiti:assignee="zhao6" activiti:candidateUsers="">\n' +
|
||||
' <bpmn2:extensionElements>\n' +
|
||||
' <activiti:formProperty id="userid" type="string" />\n' +
|
||||
' <activiti:taskListener class="do some thing" event="complete" />\n' +
|
||||
' <activiti:properties>\n' +
|
||||
' <activiti:property name="审批" value="approve" />\n' +
|
||||
' </activiti:properties>\n' +
|
||||
' </bpmn2:extensionElements>\n' +
|
||||
' <bpmn2:incoming>L7</bpmn2:incoming>\n' +
|
||||
' <bpmn2:incoming>L8</bpmn2:incoming>\n' +
|
||||
' <bpmn2:outgoing>L2</bpmn2:outgoing>\n' +
|
||||
' </bpmn2:userTask>\n' +
|
||||
' </bpmn2:process>\n' +
|
||||
' <bpmndi:BPMNDiagram id="BPMNDiagram_1">\n' +
|
||||
' <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_0uh8wmt_di" bpmnElement="L3">\n' +
|
||||
' <di:waypoint x="560" y="200" />\n' +
|
||||
' <di:waypoint x="560" y="250" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_01hb865_di" bpmnElement="L2">\n' +
|
||||
' <di:waypoint x="560" y="670" />\n' +
|
||||
' <di:waypoint x="560" y="732" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1t81399_di" bpmnElement="L8">\n' +
|
||||
' <di:waypoint x="690" y="550" />\n' +
|
||||
' <di:waypoint x="690" y="630" />\n' +
|
||||
' <di:waypoint x="610" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_00vdr2t_di" bpmnElement="L7">\n' +
|
||||
' <di:waypoint x="430" y="550" />\n' +
|
||||
' <di:waypoint x="430" y="630" />\n' +
|
||||
' <di:waypoint x="510" y="630" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1bnjbaa_di" bpmnElement="L5">\n' +
|
||||
' <di:waypoint x="535" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="400" />\n' +
|
||||
' <di:waypoint x="430" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="456" y="382" width="55" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_12ug1tp_di" bpmnElement="L6">\n' +
|
||||
' <di:waypoint x="585" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="400" />\n' +
|
||||
' <di:waypoint x="690" y="470" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="611" y="382" width="56" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1miguqf_di" bpmnElement="L4">\n' +
|
||||
' <di:waypoint x="560" y="330" />\n' +
|
||||
' <di:waypoint x="560" y="375" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNEdge id="Flow_1u6pmzo_di" bpmnElement="L1">\n' +
|
||||
' <di:waypoint x="560" y="68" />\n' +
|
||||
' <di:waypoint x="560" y="120" />\n' +
|
||||
' </bpmndi:BPMNEdge>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_0byql27_di" bpmnElement="N1">\n' +
|
||||
' <dc:Bounds x="542" y="32" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="2" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Gateway_0qd58o6_di" bpmnElement="N9" isMarkerVisible="true">\n' +
|
||||
' <dc:Bounds x="535" y="375" width="50" height="50" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="538" y="432" width="44" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Event_1h4oob7_di" bpmnElement="N3">\n' +
|
||||
' <dc:Bounds x="542" y="732" width="36" height="36" />\n' +
|
||||
' <bpmndi:BPMNLabel>\n' +
|
||||
' <dc:Bounds x="539" y="775" width="43" height="14" />\n' +
|
||||
' </bpmndi:BPMNLabel>\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0g48n8q_di" bpmnElement="N2">\n' +
|
||||
' <dc:Bounds x="510" y="120" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_04wpn1b_di" bpmnElement="N4">\n' +
|
||||
' <dc:Bounds x="510" y="250" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0j8meci_di" bpmnElement="N5">\n' +
|
||||
' <dc:Bounds x="380" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0pa1f64_di" bpmnElement="N6">\n' +
|
||||
' <dc:Bounds x="640" y="470" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' <bpmndi:BPMNShape id="Activity_0qmb4lo_di" bpmnElement="N7">\n' +
|
||||
' <dc:Bounds x="510" y="590" width="100" height="80" />\n' +
|
||||
' </bpmndi:BPMNShape>\n' +
|
||||
' </bpmndi:BPMNPlane>\n' +
|
||||
' </bpmndi:BPMNDiagram>\n' +
|
||||
'</bpmn2:definitions>\n';
|
||||
|
||||
|
||||
//region -----分类弹框逻辑-----
|
||||
const cateModal = ref();
|
||||
const openCateModal = () => {
|
||||
cateModal.value.openModal();
|
||||
};
|
||||
const cateChoose = (node: any) => {
|
||||
if (node == null) {
|
||||
form.value.cate = null;
|
||||
} else {
|
||||
form.value.cate = { id: node.id, name: node.name };
|
||||
}
|
||||
};
|
||||
//endregion
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -3,7 +3,7 @@ import { storeToRefs } from 'pinia';
|
||||
import pinia from '/@/stores/index';
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import { useRequestOldRoutes } from '/@/stores/requestOldRoutes';
|
||||
import { Cookie, Session } from '/@/utils/storage';
|
||||
import { Session } from '/@/utils/storage';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import { dynamicRoutes, notFoundAndNoPower } from '/@/router/route';
|
||||
import { formatTwoStageRoutes, formatFlatteningRoutes, router } from '/@/router/index';
|
||||
@@ -39,8 +39,7 @@ export async function initBackEndControlRoutes() {
|
||||
// 界面 loading 动画开始执行
|
||||
if (window.nextLoading === undefined) NextLoading.start();
|
||||
// 无 token 停止执行下一步
|
||||
// if (!Session.get('token')) return false;
|
||||
if (!Cookie.get('token')) return false;
|
||||
if (!Session.get('token')) return false;
|
||||
// 触发初始化用户信息 pinia
|
||||
useUserInfo().setUserInfos();
|
||||
// 获取路由菜单数据
|
||||
@@ -148,17 +147,13 @@ export function dynamicImport(dynamicViewsModules: Record<string, Function>, com
|
||||
const matchKeys = keys.filter((key) => {
|
||||
// const k = key.replace(/..\/views|../, '');
|
||||
const k = key.replace(/..\/pages|../, '');
|
||||
console.log(k);
|
||||
console.log(`${component}`);
|
||||
return k.startsWith(`${component}`) || k.startsWith(`/${component}`);
|
||||
});
|
||||
console.log(matchKeys);
|
||||
if (matchKeys?.length === 1) {
|
||||
const matchKey = matchKeys[0];
|
||||
return dynamicViewsModules[matchKey];
|
||||
}
|
||||
if (matchKeys?.length > 1) {
|
||||
// return dynamicViewsModules[matchKeys[1]];
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
+1
-2
@@ -6,7 +6,7 @@ import { storeToRefs } from 'pinia';
|
||||
import { useKeepALiveNames } from '/@/stores/keepAliveNames';
|
||||
import { useRoutesList } from '/@/stores/routesList';
|
||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||
import { Cookie, Session } from '/@/utils/storage';
|
||||
import { Session } from '/@/utils/storage';
|
||||
import { staticRoutes } from '/@/router/route';
|
||||
import { initFrontEndControlRoutes } from '/@/router/frontEnd';
|
||||
import { initBackEndControlRoutes } from '/@/router/backEnd';
|
||||
@@ -93,7 +93,6 @@ router.beforeEach(async (to, from, next) => {
|
||||
NProgress.configure({ showSpinner: false });
|
||||
if (to.meta.title) NProgress.start();
|
||||
const token = Session.get('token');
|
||||
// const token = Cookie.get('token');
|
||||
if (to.path === '/login' && !token) {
|
||||
next();
|
||||
NProgress.done();
|
||||
|
||||
+9
-9
@@ -48,7 +48,7 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
},
|
||||
{
|
||||
path: '/sys',
|
||||
name: 'Sys',
|
||||
name: 'sys',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/sys/org/user',
|
||||
meta: {
|
||||
@@ -64,7 +64,7 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
children: [
|
||||
{
|
||||
path: '/sys/org',
|
||||
name: 'SysOrg',
|
||||
name: 'sysOrg',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/sys/org/user',
|
||||
meta: {
|
||||
@@ -264,7 +264,7 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
},
|
||||
{
|
||||
path: '/sys/job',
|
||||
name: 'SysJob',
|
||||
name: 'sysJob',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/sys/job/main',
|
||||
meta: {
|
||||
@@ -326,7 +326,7 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
},
|
||||
{
|
||||
path: '/sys/log',
|
||||
name: 'SysLog',
|
||||
name: 'sysLog',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/sys/log/login',
|
||||
meta: {
|
||||
@@ -374,8 +374,8 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/oa/flow',
|
||||
name: 'OaFlow',
|
||||
path: '/oa',
|
||||
name: 'oa',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/oa/flow/main',
|
||||
meta: {
|
||||
@@ -498,7 +498,7 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
},
|
||||
{
|
||||
path: '/sys/todo',
|
||||
name: 'SysTodo',
|
||||
name: 'sysTodo',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/sys/todo/main',
|
||||
meta: {
|
||||
@@ -545,8 +545,8 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/demo',
|
||||
name: 'Demo',
|
||||
path: '/sa',
|
||||
name: 'sa',
|
||||
component: () => import('/@/layout/routerView/parent.vue'),
|
||||
redirect: '/sa/cust/main',
|
||||
meta: {
|
||||
|
||||
@@ -18,6 +18,7 @@ export interface UserInfosStates {
|
||||
// 路由缓存列表
|
||||
export interface KeepAliveNamesState {
|
||||
keepAliveNames: string[];
|
||||
cachedViews: string[];
|
||||
}
|
||||
|
||||
// 后端返回原始路由(未处理时)
|
||||
|
||||
@@ -3,15 +3,35 @@ import { KeepAliveNamesState } from './interface';
|
||||
|
||||
/**
|
||||
* 路由缓存列表
|
||||
* @methods setCacheKeepAlive 设置要缓存的路由 names
|
||||
* @methods setCacheKeepAlive 设置要缓存的路由 names（开启 Tagsview）
|
||||
* @methods addCachedView 添加要缓存的路由 names（关闭 Tagsview）
|
||||
* @methods delCachedView 删除要缓存的路由 names（关闭 Tagsview）
|
||||
* @methods delOthersCachedViews 右键菜单`关闭其它`，删除要缓存的路由 names（关闭 Tagsview）
|
||||
* @methods delAllCachedViews 右键菜单`全部关闭`，删除要缓存的路由 names（关闭 Tagsview）
|
||||
*/
|
||||
export const useKeepALiveNames = defineStore('keepALiveNames', {
|
||||
state: (): KeepAliveNamesState => ({
|
||||
keepAliveNames: [],
|
||||
cachedViews: [],
|
||||
}),
|
||||
actions: {
|
||||
async setCacheKeepAlive(data: Array<string>) {
|
||||
this.keepAliveNames = data;
|
||||
},
|
||||
async addCachedView(view: any) {
|
||||
if (this.cachedViews.includes(view.name)) return;
|
||||
if (view.meta.isKeepAlive) this.cachedViews.push(view.name);
|
||||
},
|
||||
async delCachedView(view: any) {
|
||||
const index = this.cachedViews.indexOf(view.name);
|
||||
index > -1 && this.cachedViews.splice(index, 1);
|
||||
},
|
||||
async delOthersCachedViews(view: any) {
|
||||
if (view.meta.isKeepAlive) this.cachedViews = [view.name];
|
||||
else this.cachedViews = [];
|
||||
},
|
||||
async delAllCachedViews() {
|
||||
this.cachedViews = [];
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
+45
-11
@@ -1,5 +1,6 @@
|
||||
import { defineStore } from 'pinia';
|
||||
import { UserInfosStates, UserInfosState } from './interface';
|
||||
import Cookies from 'js-cookie';
|
||||
import { UserInfosStates } from './interface';
|
||||
import { Session } from '/@/utils/storage';
|
||||
|
||||
/**
|
||||
@@ -9,21 +10,54 @@ import { Session } from '/@/utils/storage';
|
||||
export const useUserInfo = defineStore('userInfo', {
|
||||
state: (): UserInfosStates => ({
|
||||
userInfos: {
|
||||
authBtnList: [],
|
||||
photo: '',
|
||||
roles: [],
|
||||
time: 0,
|
||||
userName: '',
|
||||
photo: '',
|
||||
time: 0,
|
||||
roles: [],
|
||||
authBtnList: [],
|
||||
},
|
||||
}),
|
||||
actions: {
|
||||
async setUserInfos(data?: UserInfosState) {
|
||||
if (data) {
|
||||
this.userInfos = <any>data;
|
||||
async setUserInfos() {
|
||||
// 模拟数据，请求接口时，记得删除多余代码及对应依赖的引入
|
||||
const userName = Cookies.get('userName');
|
||||
// 模拟数据
|
||||
let defaultRoles: Array<string> = [];
|
||||
let defaultAuthBtnList: Array<string> = [];
|
||||
// admin 页面权限标识，对应路由 meta.roles，用于控制路由的显示/隐藏
|
||||
let adminRoles: Array<string> = ['admin'];
|
||||
// admin 按钮权限标识
|
||||
let adminAuthBtnList: Array<string> = ['btn.add', 'btn.del', 'btn.edit', 'btn.link'];
|
||||
// test 页面权限标识，对应路由 meta.roles，用于控制路由的显示/隐藏
|
||||
let testRoles: Array<string> = ['common'];
|
||||
// test 按钮权限标识
|
||||
let testAuthBtnList: Array<string> = ['btn.add', 'btn.link'];
|
||||
// 不同用户模拟不同的用户权限
|
||||
if (true||userName === 'admin') {
|
||||
defaultRoles = adminRoles;
|
||||
defaultAuthBtnList = adminAuthBtnList;
|
||||
} else {
|
||||
if (Session.get('userInfo')) {
|
||||
this.userInfos = Session.get('userInfo');
|
||||
}
|
||||
defaultRoles = testRoles;
|
||||
defaultAuthBtnList = testAuthBtnList;
|
||||
}
|
||||
// 用户信息模拟数据
|
||||
const userInfos = {
|
||||
userName: userName,
|
||||
photo:
|
||||
userName === 'admin'
|
||||
? 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1813762643,1914315241&fm=26&gp=0.jpg'
|
||||
: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=317673774,2961727727&fm=26&gp=0.jpg',
|
||||
time: new Date().getTime(),
|
||||
roles: defaultRoles,
|
||||
authBtnList: defaultAuthBtnList,
|
||||
};
|
||||
// 存储用户信息到浏览器缓存
|
||||
Session.set('userInfo', userInfos);
|
||||
|
||||
if (Session.get('userInfo')) {
|
||||
this.userInfos = Session.get('userInfo');
|
||||
} else {
|
||||
this.userInfos = userInfos;
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
@@ -1,15 +1,17 @@
|
||||
/**
|
||||
* 判断两数组是否相同
|
||||
* 判断两数组字符串是否相同（用于按钮权限验证），数组字符串中存在相同时会自动去重（按钮权限标识不会重复）
|
||||
* @param news 新数据
|
||||
* @param old 源数据
|
||||
* @returns 两数组相同返回 `true`，反之则反
|
||||
*/
|
||||
export function judementSameArr(news: unknown[] | string[], old: string[]): boolean {
|
||||
export function judementSameArr(newArr: unknown[] | string[], oldArr: string[]): boolean {
|
||||
const news = removeDuplicate(newArr);
|
||||
const olds = removeDuplicate(oldArr);
|
||||
let count = 0;
|
||||
const leng = old.length;
|
||||
for (let i in old) {
|
||||
const leng = olds.length;
|
||||
for (let i in olds) {
|
||||
for (let j in news) {
|
||||
if (old[i] === news[j]) count++;
|
||||
if (olds[i] === news[j]) count++;
|
||||
}
|
||||
}
|
||||
return count === leng ? true : false;
|
||||
@@ -39,3 +41,26 @@ export function isObjectValueEqual(a: { [key: string]: any }, b: { [key: string]
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
* 数组、数组对象去重
|
||||
* @param arr 数组内容
|
||||
* @param attr 需要去重的键值（数组对象）
|
||||
* @returns
|
||||
*/
|
||||
export function removeDuplicate(arr: any, attr?: string) {
|
||||
if (!arr && !arr.length) {
|
||||
return arr;
|
||||
} else {
|
||||
if (attr) {
|
||||
const obj: any = {};
|
||||
const newArr = arr.reduce((cur: any, item: any) => {
|
||||
obj[item[attr]] ? '' : (obj[item[attr]] = true && item[attr] && cur.push(item));
|
||||
return cur;
|
||||
}, []);
|
||||
return newArr;
|
||||
} else {
|
||||
return Array.from(new Set([...arr]));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+34
-3
@@ -32,13 +32,40 @@ export function useTitle() {
|
||||
nextTick(() => {
|
||||
let webTitle = '';
|
||||
let globalTitle: string = themeConfig.value.globalTitle;
|
||||
router.currentRoute.value.path === '/login'
|
||||
? (webTitle = router.currentRoute.value.meta.title as any)
|
||||
: (webTitle = i18n.global.t(router.currentRoute.value.meta.title as any));
|
||||
const { path, meta } = router.currentRoute.value;
|
||||
if (path === '/login') {
|
||||
webTitle = <any>meta.title;
|
||||
} else {
|
||||
webTitle = setTagsViewNameI18n(router.currentRoute.value);
|
||||
}
|
||||
document.title = `${webTitle} - ${globalTitle}` || globalTitle;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置 自定义 tagsView 名称、 自定义 tagsView 名称国际化
|
||||
* @param params 路由 query、params 中的 tagsViewName
|
||||
* @returns 返回当前 tagsViewName 名称
|
||||
*/
|
||||
export function setTagsViewNameI18n(item: any) {
|
||||
let tagsViewName: any = '';
|
||||
const { query, params, meta } = item;
|
||||
if (query?.tagsViewName || params?.tagsViewName) {
|
||||
if (/zh-cn|en|zh-tw/.test(query?.tagsViewName) || /zh-cn|en|zh-tw/.test(params?.tagsViewName)) {
|
||||
// 国际化
|
||||
const urlTagsParams = (query?.tagsViewName && JSON.parse(query?.tagsViewName)) || (params?.tagsViewName && JSON.parse(params?.tagsViewName));
|
||||
tagsViewName = urlTagsParams[i18n.global.locale];
|
||||
} else {
|
||||
// 非国际化
|
||||
tagsViewName = query?.tagsViewName || params?.tagsViewName;
|
||||
}
|
||||
} else {
|
||||
// 非自定义 tagsView 名称
|
||||
tagsViewName = i18n.global.t(<any>meta.title);
|
||||
}
|
||||
return tagsViewName;
|
||||
}
|
||||
|
||||
/**
|
||||
* 图片懒加载
|
||||
* @param el dom 目标元素
|
||||
@@ -135,6 +162,7 @@ export function handleEmpty(list: any) {
|
||||
* 统一批量导出
|
||||
* @method elSvg 导出全局注册 element plus svg 图标
|
||||
* @method useTitle 设置浏览器标题国际化
|
||||
* @method setTagsViewNameI18n 设置 自定义 tagsView 名称、 自定义 tagsView 名称国际化
|
||||
* @method lazyImg 图片懒加载
|
||||
* @method globalComponentSize() element plus 全局组件大小
|
||||
* @method deepClone 对象深克隆
|
||||
@@ -148,6 +176,9 @@ const other = {
|
||||
useTitle: () => {
|
||||
useTitle();
|
||||
},
|
||||
setTagsViewNameI18n(route: any) {
|
||||
return setTagsViewNameI18n(route);
|
||||
},
|
||||
lazyImg: (el: any, arr: any) => {
|
||||
lazyImg(el, arr);
|
||||
},
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import axios from 'axios';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
import { Cookie,Session } from '/@/utils/storage';
|
||||
import { Session } from '/@/utils/storage';
|
||||
|
||||
// 配置新建一个 axios 实例
|
||||
const service = axios.create({
|
||||
@@ -13,11 +13,8 @@ const service = axios.create({
|
||||
service.interceptors.request.use(
|
||||
(config) => {
|
||||
// 在发送请求之前做些什么 token
|
||||
// if (Session.get('token')) {
|
||||
// (<any>config.headers).common['Authorization'] = `${Session.get('token')}`;
|
||||
// }
|
||||
if (Cookie.get('token')) {
|
||||
(<any>config.headers).common['Authorization'] = `${Cookie.get('token')}`;
|
||||
if (Session.get('token')) {
|
||||
(<any>config.headers).common['Authorization'] = `${Session.get('token')}`;
|
||||
}
|
||||
return config;
|
||||
},
|
||||
|
||||
+6
-29
@@ -1,3 +1,5 @@
|
||||
import Cookies from 'js-cookie';
|
||||
|
||||
/**
|
||||
* window.localStorage 浏览器永久缓存
|
||||
* @method set 设置永久缓存
|
||||
@@ -35,48 +37,23 @@ export const Local = {
|
||||
export const Session = {
|
||||
// 设置临时缓存
|
||||
set(key: string, val: any) {
|
||||
if (key === 'token') return Cookies.set(key, val);
|
||||
window.sessionStorage.setItem(key, JSON.stringify(val));
|
||||
},
|
||||
// 获取临时缓存
|
||||
get(key: string) {
|
||||
if (key === 'token') return Cookies.get(key);
|
||||
let json: any = window.sessionStorage.getItem(key);
|
||||
return JSON.parse(json);
|
||||
},
|
||||
// 移除临时缓存
|
||||
remove(key: string) {
|
||||
if (key === 'token') return Cookies.remove(key);
|
||||
window.sessionStorage.removeItem(key);
|
||||
},
|
||||
// 移除全部临时缓存
|
||||
clear() {
|
||||
Cookies.remove('token');
|
||||
window.sessionStorage.clear();
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
export const Cookie = {
|
||||
// 设置临时缓存
|
||||
set(key: string, val: any) {
|
||||
const dateTime = new Date();
|
||||
dateTime.setTime( dateTime.getTime() + 0.5*24*3600*1000);
|
||||
document.cookie = key + "="+ val + "; expires=" + dateTime.toGMTString();
|
||||
},
|
||||
// 获取临时缓存
|
||||
get(key: string) {
|
||||
const cookies = document.cookie;
|
||||
const cookieArr = cookies.split("; ");
|
||||
for( let i = 0; i < cookieArr.length; i++ ){
|
||||
const cookie = cookieArr[i].split("=");
|
||||
if( cookie[0] == key ){
|
||||
return cookie[1];
|
||||
}
|
||||
}
|
||||
},
|
||||
// 移除临时缓存
|
||||
remove() {
|
||||
|
||||
},
|
||||
// 移除全部临时缓存
|
||||
clear() {
|
||||
|
||||
},
|
||||
};
|
||||
|
||||
@@ -24,16 +24,16 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { toRefs, reactive, onMounted, defineComponent } from 'vue';
|
||||
import Cookies from 'js-cookie';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import { frontEndsResetRoute, setAddRoute, setFilterMenuAndCacheTagsViewRoutes } from '/@/router/frontEnd';
|
||||
import { Session } from '/@/utils/storage';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'limitsFrontEndPage',
|
||||
setup() {
|
||||
const stores = useUserInfo();
|
||||
const { userInfos } = storeToRefs(stores);
|
||||
const storesUserInfo = useUserInfo();
|
||||
const { userInfos } = storeToRefs(storesUserInfo);
|
||||
const state = reactive({
|
||||
val: '',
|
||||
userAuth: '',
|
||||
@@ -46,36 +46,9 @@ export default defineComponent({
|
||||
const onRadioChange = async () => {
|
||||
// 模拟数据
|
||||
frontEndsResetRoute();
|
||||
let defaultRoles: string[] = [];
|
||||
let defaultAuthBtnList: string[] = [];
|
||||
// admin 页面权限标识，对应路由 meta.roles，用于控制路由的显示/隐藏
|
||||
let adminRoles: string[] = ['admin'];
|
||||
// admin 按钮权限标识
|
||||
let adminAuthBtnList: string[] = ['btn.add', 'btn.del', 'btn.edit', 'btn.link'];
|
||||
// test 页面权限标识，对应路由 meta.roles，用于控制路由的显示/隐藏
|
||||
let testRoles: string[] = ['common'];
|
||||
// test 按钮权限标识
|
||||
let testAuthBtnList: string[] = ['btn.add', 'btn.link'];
|
||||
// 不同用户模拟不同的用户权限
|
||||
if (state.userAuth === 'admin') {
|
||||
defaultRoles = adminRoles;
|
||||
defaultAuthBtnList = adminAuthBtnList;
|
||||
} else {
|
||||
defaultRoles = testRoles;
|
||||
defaultAuthBtnList = testAuthBtnList;
|
||||
}
|
||||
const userInfos = {
|
||||
userName: state.userAuth,
|
||||
photo:
|
||||
state.userAuth === 'admin'
|
||||
? 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1813762643,1914315241&fm=26&gp=0.jpg'
|
||||
: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=317673774,2961727727&fm=26&gp=0.jpg',
|
||||
time: new Date().getTime(),
|
||||
roles: defaultRoles,
|
||||
authBtnList: defaultAuthBtnList,
|
||||
};
|
||||
Session.set('userInfo', userInfos);
|
||||
stores.setUserInfos({ ...userInfos }); // 请注意执行顺序(存储用户信息 pinia)
|
||||
Cookies.set('userName', state.userAuth);
|
||||
// 模拟切换不同权限用户
|
||||
storesUserInfo.setUserInfos();
|
||||
await setAddRoute();
|
||||
setFilterMenuAndCacheTagsViewRoutes();
|
||||
};
|
||||
|
||||
@@ -60,12 +60,12 @@ import { toRefs, reactive, defineComponent, computed } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import Cookies from 'js-cookie';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||
import { initFrontEndControlRoutes } from '/@/router/frontEnd';
|
||||
import { initBackEndControlRoutes } from '/@/router/backEnd';
|
||||
import { useUserInfo } from '/@/stores/userInfo';
|
||||
import { Cookie, Session } from '/@/utils/storage';
|
||||
import { Session } from '/@/utils/storage';
|
||||
import { formatAxis } from '/@/utils/formatTime';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import request from '/@/utils/request';
|
||||
@@ -74,7 +74,6 @@ export default defineComponent({
|
||||
name: 'loginAccount',
|
||||
setup() {
|
||||
const { t } = useI18n();
|
||||
const stores = useUserInfo();
|
||||
const storesThemeConfig = useThemeConfig();
|
||||
const { themeConfig } = storeToRefs(storesThemeConfig);
|
||||
const route = useRoute();
|
||||
@@ -101,50 +100,14 @@ export default defineComponent({
|
||||
method: 'post',
|
||||
data:{username:state.ruleForm.userName,password:state.ruleForm.password},
|
||||
});
|
||||
// 模拟数据
|
||||
state.loading.signIn = true;
|
||||
let defaultRoles: Array<string> = [];
|
||||
let defaultAuthBtnList: Array<string> = [];
|
||||
// admin 页面权限标识，对应路由 meta.roles，用于控制路由的显示/隐藏
|
||||
let adminRoles: Array<string> = ['admin'];
|
||||
// admin 按钮权限标识
|
||||
let adminAuthBtnList: Array<string> = ['btn.add', 'btn.del', 'btn.edit', 'btn.link'];
|
||||
// test 页面权限标识，对应路由 meta.roles，用于控制路由的显示/隐藏
|
||||
let testRoles: Array<string> = ['common'];
|
||||
// test 按钮权限标识
|
||||
let testAuthBtnList: Array<string> = ['btn.add', 'btn.link'];
|
||||
// 不同用户模拟不同的用户权限
|
||||
if (state.ruleForm.userName === 'admin') {
|
||||
defaultRoles = adminRoles;
|
||||
defaultAuthBtnList = adminAuthBtnList;
|
||||
} else {
|
||||
defaultRoles = testRoles;
|
||||
defaultAuthBtnList = testAuthBtnList;
|
||||
}
|
||||
defaultRoles = adminRoles;
|
||||
defaultAuthBtnList = adminAuthBtnList;
|
||||
// 用户信息模拟数据
|
||||
const userInfos = {
|
||||
userid:result.zuser.id,//vboot添加
|
||||
userName: state.ruleForm.userName,
|
||||
photo:
|
||||
state.ruleForm.userName === 'admin'
|
||||
? 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1813762643,1914315241&fm=26&gp=0.jpg'
|
||||
: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=317673774,2961727727&fm=26&gp=0.jpg',
|
||||
time: new Date().getTime(),
|
||||
roles: defaultRoles,
|
||||
authBtnList: defaultAuthBtnList,
|
||||
};
|
||||
// 存储 token 到浏览器缓存
|
||||
Session.set('token', Math.random().toString(36).substr(0));
|
||||
// 存储用户信息到浏览器缓存
|
||||
Session.set('userInfo', userInfos);
|
||||
Cookie.set('userid',userInfos.userid);//vboot添加
|
||||
Cookie.set('token',"Bearer "+result.token);//vboot添加
|
||||
// 1、请注意执行顺序(存储用户信息到vuex)
|
||||
stores.setUserInfos({ ...userInfos });
|
||||
const { isRequestRoutes } = themeConfig.value;
|
||||
if (!isRequestRoutes) {
|
||||
// Session.set('token', Math.random().toString(36).substr(0));
|
||||
Session.set('token', "Bearer "+result.token);
|
||||
// 模拟数据，对接接口时，记得删除多余代码及对应依赖的引入。用于 `/src/stores/userInfo.ts` 中不同用户登录判断（模拟数据）
|
||||
// Cookies.set('userName', state.ruleForm.userName);
|
||||
Cookies.set('userName', result.zuser.name);
|
||||
if (!themeConfig.value.isRequestRoutes) {
|
||||
// 前端控制路由，2、请注意执行顺序
|
||||
await initFrontEndControlRoutes();
|
||||
signInSuccess();
|
||||
|
||||
@@ -3,12 +3,30 @@
|
||||
<div class="flex-margin" style="width: 400px">
|
||||
<el-result icon="success" title="普通路由" subTitle="可 `开启 TagsView 共用` 进行单标签测试">
|
||||
<template #extra>
|
||||
<el-alert type="success" :closable="false" class="mb30">
|
||||
<template #default>
|
||||
<div>1、设置非国际化：格式：tagsViewName=xxx</div>
|
||||
<br />
|
||||
<div>2、设置国际化：格式：tagsViewName=JSON.stringify({"zh-cn":"测试用","en":"test+page","zh-tw":"測試用"})</div>
|
||||
<br />
|
||||
<div>3、设置国际化后，去顶栏切换语言查看演示效果</div>
|
||||
<br />
|
||||
<div>
|
||||
4、 <a href="https://gitee.com/q7but" target="_black">感谢@q7but</a>、
|
||||
<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/22/files" target="_black">!22 add 添加自定义 tagVIewName 拓展,支持国际化</a>
|
||||
</div>
|
||||
</template>
|
||||
</el-alert>
|
||||
<el-input v-model="tagsViewName" placeholder="请输入tagsView 名称" clearable class="mb15" style="width: 400px"></el-input>
|
||||
<el-input v-model="value" placeholder="请输入路由参数 id 值" clearable style="width: 400px"></el-input>
|
||||
<el-button type="primary" size="default" class="mt15" @click="onGoDetailsClick">
|
||||
<SvgIcon name="iconfont icon-putong" />
|
||||
普通路由传参
|
||||
</el-button>
|
||||
<el-button type="primary" size="default" class="mt15" @click="onChangeI18n">
|
||||
<SvgIcon name="iconfont icon-fuhao-zhongwen" />
|
||||
{{ tagsViewNameIsI18n ? '普通的演示' : '国际化演示' }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-result>
|
||||
</div>
|
||||
@@ -31,7 +49,8 @@ export default defineComponent({
|
||||
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
|
||||
const state = reactive({
|
||||
value: '',
|
||||
tagsViewName: null,
|
||||
tagsViewName: '',
|
||||
tagsViewNameIsI18n: false,
|
||||
});
|
||||
const router = useRouter();
|
||||
// 设置 view 的高度
|
||||
@@ -50,15 +69,30 @@ export default defineComponent({
|
||||
* 传不同的 tagsViewName 值
|
||||
*/
|
||||
const onGoDetailsClick = () => {
|
||||
const params: any = { id: state.value };
|
||||
if (state.tagsViewName) params.tagsViewName = state.tagsViewName;
|
||||
router.push({
|
||||
path: '/params/common/details',
|
||||
query: { id: state.value, tagsViewName: state.tagsViewName },
|
||||
query: params,
|
||||
});
|
||||
state.value = '';
|
||||
};
|
||||
const onChangeI18n = () => {
|
||||
state.tagsViewNameIsI18n = !state.tagsViewNameIsI18n;
|
||||
if (state.tagsViewNameIsI18n) {
|
||||
state.tagsViewName = JSON.stringify({
|
||||
'zh-cn': '测试用',
|
||||
en: 'test page',
|
||||
'zh-tw': '測試用',
|
||||
});
|
||||
} else {
|
||||
state.tagsViewName = '我是普通路由测试tagsViewName(非国际化)';
|
||||
}
|
||||
};
|
||||
return {
|
||||
setViewHeight,
|
||||
onGoDetailsClick,
|
||||
onChangeI18n,
|
||||
...toRefs(state),
|
||||
};
|
||||
},
|
||||
|
||||
@@ -3,12 +3,30 @@
|
||||
<div class="flex-margin" style="width: 400px">
|
||||
<el-result icon="warning" title="动态路由" subTitle="可 `开启 TagsView 共用` 进行单标签测试">
|
||||
<template #extra>
|
||||
<el-alert type="success" :closable="false" class="mb30">
|
||||
<template #default>
|
||||
<div>1、设置非国际化：格式：tagsViewName=xxx</div>
|
||||
<br />
|
||||
<div>2、设置国际化：格式：tagsViewName=JSON.stringify({"zh-cn":"测试用","en":"test+page","zh-tw":"測試用"})</div>
|
||||
<br />
|
||||
<div>3、设置国际化后，去顶栏切换语言查看演示效果</div>
|
||||
<br />
|
||||
<div>
|
||||
4、 <a href="https://gitee.com/q7but" target="_black">感谢@q7but</a>、
|
||||
<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/22/files" target="_black">!22 add 添加自定义 tagVIewName 拓展,支持国际化</a>
|
||||
</div>
|
||||
</template>
|
||||
</el-alert>
|
||||
<el-input v-model="tagsViewName" placeholder="请输入tagsView 名称" clearable class="mb15" style="width: 400px"></el-input>
|
||||
<el-input v-model="value" placeholder="请输入路由参数id值" clearable style="width: 400px"></el-input>
|
||||
<el-button type="primary" size="default" class="mt15" @click="onGoDetailsClick">
|
||||
<SvgIcon name="iconfont icon-dongtai" />
|
||||
动态路由传参
|
||||
</el-button>
|
||||
<el-button type="primary" size="default" class="mt15" @click="onChangeI18n">
|
||||
<SvgIcon name="iconfont icon-fuhao-zhongwen" />
|
||||
{{ tagsViewNameIsI18n ? '普通的演示' : '国际化演示' }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-result>
|
||||
</div>
|
||||
@@ -18,6 +36,7 @@
|
||||
<script lang="ts">
|
||||
import { defineComponent, toRefs, reactive, computed } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
|
||||
@@ -32,6 +51,7 @@ export default defineComponent({
|
||||
const state = reactive({
|
||||
value: '',
|
||||
tagsViewName: '',
|
||||
tagsViewNameIsI18n: false,
|
||||
});
|
||||
const router = useRouter();
|
||||
// 设置 view 的高度
|
||||
@@ -46,6 +66,8 @@ export default defineComponent({
|
||||
});
|
||||
// 跳转到详情
|
||||
const onGoDetailsClick = () => {
|
||||
if (!state.tagsViewName) return ElMessage.warning('动态路由tagsViewName为必填，因为路由配置了');
|
||||
if (!state.value) return ElMessage.warning('路由参数id值为必填');
|
||||
// name 值为路由中的 name
|
||||
router.push({
|
||||
name: 'paramsDynamicDetails',
|
||||
@@ -57,9 +79,22 @@ export default defineComponent({
|
||||
});
|
||||
state.value = '';
|
||||
};
|
||||
const onChangeI18n = () => {
|
||||
state.tagsViewNameIsI18n = !state.tagsViewNameIsI18n;
|
||||
if (state.tagsViewNameIsI18n) {
|
||||
state.tagsViewName = JSON.stringify({
|
||||
'zh-cn': '我是动态路由',
|
||||
en: 'Im dynamic routing',
|
||||
'zh-tw': '我是動態路由',
|
||||
});
|
||||
} else {
|
||||
state.tagsViewName = '我是动态路由测试tagsViewName(非国际化)';
|
||||
}
|
||||
};
|
||||
return {
|
||||
setViewHeight,
|
||||
onGoDetailsClick,
|
||||
onChangeI18n,
|
||||
...toRefs(state),
|
||||
};
|
||||
},
|
||||
|
||||
+1217
-1217
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user