gitee/vben-web
1
0
Fork 1
mirror of https://gitee.com/vben/vben-web.git synced 2026-10-06 14:13:10 +08:00
Code Issues Packages Projects Releases Wiki Activity

~~

Browse Source
This commit is contained in:
zsvg
2022-05-20 06:29:26 +08:00
parent 4e6acf27d6
commit d1ebf277e6
8 changed files with 228 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+1 -1
View File
@@ -27,6 +27,6 @@
<!-- })();-->
<!-- </script>-->
<script type="module" src="/src/main.ts"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=wsijQt8sLXrCW71YesmispvYHitfG9gv&s=1"></script>
<!-- <script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=wsijQt8sLXrCW71YesmispvYHitfG9gv&s=1"></script>-->
</body>
</html>
src/comps/bpm/edit.vue
+141 -81
View File
@@ -1,103 +1,163 @@
<template>
<el-form class='zform' :model='form' label-width='180px'>
<el-row style='border-top: 1px solid #d2d2d2;'>
<el-col :span='24'>
<el-form-item label='流程说明：'>
<div class='zinput'>
xxxxxx
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='紧急程度：'>
<div class='zinput'>
<el-radio-group v-model='form.opurg'>
<el-radio :label='1'><span style='color:red'>紧急</span></el-radio>
<el-radio :label='2'><span style='color:blue'>急</span></el-radio>
<el-radio :label='3'><span>一般</span></el-radio>
</el-radio-group>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='即将流向：'>
<div class='zinput'>
N5.部门负责人(张三)
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='处理意见：'>
<div class='zinput' style='height: auto'>
<el-input v-model='form.opnot' type='textarea' :rows='5' placeholder=' ' />
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='附件：'>
<div class='zinput' style='height: auto'>
<el-upload class='upload-demo' action='https://jsonplaceholder.typicode.com/posts/' :file-list='fileList'>
<el-button type='primary'>上 传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<div style='padding-left: 105px;border-right: 1px solid #ccc'>
<el-checkbox v-model="checked2">流程图</el-checkbox>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form class='zform' :model='form' label-width='180px'>
<el-row style='border-top: 1px solid #d2d2d2;'>
<el-col :span='24'>
<el-form-item label='流程说明：'>
<div class='zinput'>
这是一个测试的流程，目前功能还不完善
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='紧急程度：'>
<div class='zinput'>
<el-radio-group v-model='form.opurg'>
<el-radio :label='1'><span style='color:red'>紧急</span></el-radio>
<el-radio :label='2'><span style='color:blue'>急</span></el-radio>
<el-radio :label='3'><span>一般</span></el-radio>
</el-radio-group>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='即将流向：'>
<div class='zinput'>
N5.部门负责人(张三)
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='处理意见：'>
<div class='zinput' style='height: auto'>
<el-input v-model='form.opnot' type='textarea' :rows='5' placeholder=' '/>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<el-form-item label='附件：'>
<div class='zinput' style='height: auto'>
<el-upload class='upload-demo' action='https://jsonplaceholder.typicode.com/posts/' :file-list='fileList'>
<el-button type='primary'>上 传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
<div style='padding-left: 105px;border-right: 1px solid #ccc'>
<el-checkbox v-model="checked2">流程图</el-checkbox>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span='24'>
</el-col>
</el-row>
</el-form>
</el-col>
</el-row>
</el-form>
</template>
<script lang='ts' setup>
import { onMounted, reactive, toRaw, toRefs } from 'vue';
import { useRoute } from 'vue-router';
import {onMounted, reactive, toRaw, toRefs} from 'vue';
import {useRoute} from 'vue-router';
import request from "/@/utils/request";
import {BpmnStore} from "/@/bpmn/store";
const route = useRoute();
const state = reactive({
form: {
},
params: {
path: '',
query: '',
},
form: {},
params: {
path: '',
query: '',
},
xml: null as any,
});
const {
form, params,
form, params,
} = toRefs(state);
onMounted(() => {
state.params = <any>route;
if (params.value.query?.id) {
onMounted(async () => {
state.params = <any>route;
if (params.value.query?.id) {
}
}
await toggleFlowChart();
});
const getOperateInfo = () => {
return toRaw(form.value);
const getOperateInfo = () => {
return toRaw(form.value);
};
defineExpose({getOperateInfo});
const props = defineProps({
temid: String,
});
const toggleFlowChart = async () => {
if (!state.xml) {
state.xml = await request({
url: '/bpm/proc/main/texml/' + props.temid,
method: 'get',
});
console.log(state.xml)
await BpmnStore.importXML(state.xml);
// const bpmnViewer = new Viewer({
// container: '#modeler-container',
// }) as any;
// try {
// const { warnings } = await bpmnViewer.importXML(state.xml);
// // bpmnViewer.get("canvas").zoom("fit-viewport", "auto");
// console.log('rendered');
// } catch (err) {
// console.log('error rendering', err);
// }
const elementRegistry = BpmnStore.getModeler().get('elementRegistry');
// const userTaskList = elementRegistry.filter(
// (item) => item.type === 'bpmn:Task'
// );
console.log(elementRegistry);
const list1 = [] as any;
elementRegistry.forEach((item: any) => {
if (item.id == 'L7' || item.id == 'N1' || item.id == 'N2') {
list1.push(item);
}
});
const list2 = [] as any;
elementRegistry.forEach((item: any) => {
if (item.id == 'N4') {
list2.push(item);
}
});
const list3 = [] as any;
elementRegistry.forEach((item: any) => {
if (item.id == 'L1' || item.id == 'L3') {
list3.push(item);
}
});
let modeling = BpmnStore.modeler.get('modeling');
modeling.setColor(list1, {fill: '#e4feef'});
modeling.setColor(list2, {fill: '#fed6d6'});
modeling.setColor(list3, {stroke: '#009900'});
}
};
defineExpose({ getOperateInfo });
// const fileList = ref<UploadUserFile[]>([
src/comps/bpm/view.vue
+5 -4
View File
@@ -4,7 +4,7 @@
<el-col :span='24'>
<el-form-item label='流程说明' style='margin-left: 10px;'>
<div class='zinput'>
xxxxxx
这是一个测试的流程，目前功能还不完善
</div>
</el-form-item>
</el-col>
@@ -196,6 +196,7 @@ const props = defineProps({
onMounted(async () => {
await bpmInit();
await toggleFlowChart();
// state.params = <any>route;
// if (params.value.query?.id) {
//也可以拿到alert(params.value.query?.id);
@@ -251,9 +252,6 @@ const bpmInit = async () => {
const emit = defineEmits(['submit']);
const bpmSubmit = async () => {
console.log('86811');
emit('submit');
console.log('86822');
if (form.value.opkey == 'pass') {
await request({
@@ -273,6 +271,9 @@ const bpmSubmit = async () => {
});
}
console.log('86811');
emit('submit');
console.log('86822');
};
const toggleFlowChart = async () => {
src/comps/page/view.ts
+41 -5
View File
@@ -1,9 +1,11 @@
import request from '/@/utils/request';
import router from '/@/router';
import {ElMessage,ElLoading} from "element-plus";
import { ArrowDown } from '@element-plus/icons-vue';
import {NextLoading} from "/@/utils/loading";
export const viewClose = (proxy: any, route: any) => {
proxy.mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
};
export const viewInit = async (state: any, route: any) => {
state.params = <any>route;
@@ -18,11 +20,45 @@ export const viewInit = async (state: any, route: any) => {
}
};
export const viewEdit = async (state: any, proxy: any, route: any) => {
viewClose(proxy, route);
export const tabEdit = async (state: any, proxy: any, route: any) => {
tabClose(proxy, route);
router.push({
path: state.url + '/edit',
query: { id: state.form.id },
});
};
export const tabClose = (proxy: any, route: any) => {
proxy.mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
};
export const pageClose = (duration:number) => {
if(!duration){
window.close();
}
// ElLoading.service({
// lock: true,
// fullscreen: true,
// // spinner:'el-icon-loading',
// text:'保存成功，'+(duration/1000)+'秒后页面按自动关闭',
// background: 'rgba(0, 0, 0, 0.1)',
// });
ElLoading.service({
lock: true,
fullscreen: true,
spinner:'el-icon-loading',
text:'',
background: 'rgba(0, 0, 0, 0.1)',
});
ElMessage({
showClose: true,
message: '保存成功，'+(duration/1000)+'秒后页面按自动关闭',
type: 'success',
duration:duration
})
setTimeout(() => {
window.close();
}, duration);
};
src/comps/sys/DeptTree.vue
+7 -4
View File
@@ -17,6 +17,7 @@
<el-dropdown-menu>
<el-dropdown-item command='expandAll'>全部展开</el-dropdown-item>
<el-dropdown-item command='collapseAll'>全部折叠</el-dropdown-item>
<el-dropdown-item command='rootNode'>根节点</el-dropdown-item>
<el-dropdown-item command='refresh'>刷新</el-dropdown-item>
</el-dropdown-menu>
</template>
@@ -36,7 +37,6 @@ import { defineExpose, onMounted, reactive, ref, watch } from 'vue';
import type { ElTree } from 'element-plus';
import { Search, MoreFilled } from '@element-plus/icons-vue';
import request from '/@/utils/request';
import { ElMessage } from 'element-plus';
interface Tree {
@@ -70,7 +70,7 @@ const state = reactive({
});
const handleCommand = (command: string | number | object) => {
const handleCommand =async (command: string | number | object) => {
if ('expandAll' == command) {
for (let i = 0; i < treeRef.value!.store._getAllNodes().length; i++) {
treeRef.value!.store._getAllNodes()[i].expanded = true;
@@ -79,8 +79,11 @@ const handleCommand = (command: string | number | object) => {
for (let i = 0; i < treeRef.value!.store._getAllNodes().length; i++) {
treeRef.value!.store._getAllNodes()[i].expanded = false;
}
}
ElMessage(`click on item ${command}`);
}else if('refresh' == command){
await initTreeData();
}else if('rootNode' == command){
emits('node-click', { id: '', name: '' });
}
};
src/pages/oa/flow/main/FlowModal.vue
+22 -11
View File
@@ -109,7 +109,7 @@ async function onSearch() {
const receInit = async () => {
receItems.value = await request({
url: '/gen/org/rece?type=' + p_flow_type,
url: '/oa/flow/rece/list?type=' + p_flow_type,
method: 'get',
});
};
@@ -117,6 +117,11 @@ const receInit = async () => {
function receItemClick(item: any) {
item.checked = !item.checked;
if(item.checked==true){
for (let i = 0; i < receItems.value.length; i++) {
if (receItems.value[i].id !== item.id) {
receItems.value[i].checked = false;
}
}
seldItem.value=item;
}else{
seldItem.value = null;
@@ -141,6 +146,11 @@ async function nodeClick(node: any) {
function tierItemClick(item: any) {
item.checked = !item.checked;
if(item.checked==true){
for (let i = 0; i < tierItems.value.length; i++) {
if (tierItems.value[i].id !== item.id) {
tierItems.value[i].checked = false;
}
}
seldItem.value=item;
}else{
seldItem.value = null;
@@ -161,6 +171,7 @@ function tierItemClick(item: any) {
//region 与父组件的交互逻辑
const openModal = async () => {
await receInit();
state.isShow = true;
};
@@ -173,21 +184,21 @@ const closeModal = () => {
return false;
}
const rawSeldItem = toRaw(seldItem.value) as any;
// if (rawSeldItem && rawSeldItem.id) {
// //更新后台数据库最近使用的TEMPS
// request({
// url: '/gen/org/rece',
// method: 'post',
// data: rawSeldItem,
// });
// }
emits('close', rawSeldItem);
if (rawSeldItem && rawSeldItem.id) {
//更新后台数据库最近使用的TEMPS
request({
url: '/oa/flow/rece',
method: 'post',
data: [rawSeldItem],
});
}
state.isShow = false;
emits('close', rawSeldItem);
};
const clearAndcloseModal = () => {
emits('close', null);
state.isShow = false;
emits('close', null);
};
//endregion
src/pages/oa/flow/main/index.vue
+7 -4
View File
@@ -6,7 +6,8 @@
<el-col :span='14'>
<el-input v-model='state.form.name' placeholder='输入名称回车查询' clearable class="list-search" @keyup.enter='listQuery(state)' />
<el-button type='primary' @click='listQuery(state)' plain>查 询</el-button>
<el-button class='more-button' :icon='state.moreParams?ArrowUp:ArrowDown' plain @click='state.moreParams=!state.moreParams'>更多</el-button>
<span style="margin-left: 10px;color: green">流程测试：张三账号z3,李四账号l4,王五账号w5,赵六账号zhao6。密码都是1</span>
<!-- <el-button class='more-button' :icon='state.moreParams?ArrowUp:ArrowDown' plain @click='state.moreParams=!state.moreParams'>更多</el-button>-->
</el-col>
<el-col :span='10' style='text-align: right'>
<el-button type='success' :icon='Plus' @click='openFlowModal()' plain>新增</el-button>
@@ -92,9 +93,11 @@ const openFlowModal = () => {
flowModalRef.value.openModal();
};
const closeFlowModal=(node:any)=>{
if(node&&node.id){
window.open("#/page/ofme?temid="+node.id);
}
setTimeout(() => {
if(node&&node.id){
window.open("#/page/ofme?temid="+node.id);
}
}, 50);
}
src/pages/oa/flow/main/view.vue
+4 -3
View File
@@ -9,8 +9,8 @@
<div style='line-height: 32px'>流程实例</div>
</el-col>
<el-col :span='14' style='text-align: right'>
<el-button type='success' @click='viewEdit(state,proxy,route)' plain>编 辑</el-button>
<el-button type='info' @click='viewClose(proxy,route)' plain>关 闭</el-button>
<el-button type='success' @click='tabEdit(state,proxy,route)' plain>编 辑</el-button>
<el-button type='info' @click='pageClose()' plain>关 闭</el-button>
</el-col>
</el-row>
</template>
@@ -47,7 +47,7 @@ export default { name: 'oaFlowMainView' };
</script>
<script lang='ts' setup>
import { getCurrentInstance, onMounted, reactive, ref, toRefs } from 'vue';
import { viewEdit, viewClose } from '/@/comps/page/view';
import { tabEdit,pageClose} from '/@/comps/page/view';
import { useRoute } from 'vue-router';
import BpmView from '/@/comps/bpm/view.vue';
import request from '/@/utils/request';
@@ -81,6 +81,7 @@ const viewInitx = async (state: any, route: any) => {
const submit = () => {
console.log('submit');
pageClose(2000);
};
onMounted(() => {