优化前段代码

This commit is contained in:
java110 2021-08-31 14:43:49 +08:00
parent 8b5e064612
commit ca2237a7a7
8 changed files with 7763 additions and 7596 deletions

File diff suppressed because one or more lines are too long

View File

@ -5,22 +5,32 @@
<meta charset="utf-8">
<title>bpmn-js流程图</title>
<vc:create path="frame/commonTop" location="head"></vc:create>
<link rel="stylesheet" href="vendor/bpmn-js/assets/diagram-js.css" />
<link rel="stylesheet" href="vendor/bpmn-js/assets/bpmn-font/css/bpmn-embedded.css" />
<link rel="stylesheet" href="vendor/bpmn-js-properties-panel/assets/bpmn-js-properties-panel.css" />
<link rel="stylesheet" href="/css/bootstrap/bootstrap.min.css" />
<link rel="stylesheet" href="/css/vc-ui.css" />
<script src="/js/bootstrap/jquery-3.3.1.min.js"></script>
<script src="/js/vue/vue.min.js"></script>
<script src="/js/vue/vue-resource.min.js"></script>
<script src="/js/bootstrap/bootstrap.min.js"></script>
<link rel="stylesheet" href="app.css" />
<style>
body {
background: #fff;
}
</style>
</head>
<body>
<vc:create path="frame/bodyTop"></vc:create>
<div class="content with-diagram" id="js-drop-zone">
<div id="component" class="message intro">
<div class="note">
</div>
</div>
<div class="message error">
<div class="note">
<p>出错了.</p>
@ -34,6 +44,10 @@
<div class="canvas" id="js-canvas"></div>
<div class="properties-panel-parent" id="js-properties-panel"></div>
<div id="component">
<vc:create path="property/bpmnjsInit"></vc:create>
</div>
</div>
<ul class="buttons">

View File

@ -8,7 +8,7 @@
//发送get请求
let _modelId = vc.getParam('modelId');
let _param = {
'xml': _xml.replaceAll('Process_1',"java110_" + vc.getParam('flowId')),
'xml': _xml.replaceAll('Process_1', "java110_" + vc.getParam('flowId')),
'svg': svg
};
vc.http.apiPost('/activiti/model/' + _modelId + '/save',

View File

@ -0,0 +1,5 @@
<div>
<vc:create path="property/chooseFlowElementCondition"></vc:create>
<vc:create path="property/selectStaff"></vc:create>
</div>

View File

@ -0,0 +1,65 @@
(function (vc) {
vc.extends({
data: {
bpmnjsInfo: {
condition: '',
staffId: ''
}
},
_initMethod: function () {
$that._initBpmnjs();
},
watch: {
'bpmnjsInfo.staffId': {
deep: true,
handler: function () {
let camundaAssignee = document.querySelector('#camunda-assignee');
camundaAssignee.value = $that.bpmnjsInfo.staffId;
//创建输入框修改事件
let changeEvent = document.createEvent("HTMLEvents");
changeEvent.initEvent("change", true, true);
//触发修改事件,触发绑定的事件,更新数据
camundaAssignee.dispatchEvent(changeEvent);
}
}
},
_initEvent: function () {
//初始化侦听
vc.on('bpmnjs', 'index', function (_data) {
let camCondition = document.querySelector('#cam-condition');
camCondition.value = _data.condition;
//创建输入框修改事件
let changeEvent = document.createEvent("HTMLEvents");
changeEvent.initEvent("change", true, true);
//触发修改事件,触发绑定的事件,更新数据
camCondition.dispatchEvent(changeEvent);
})
},
methods: {
_initBpmnjs: function () {
window._elementEvent = function (e) {
console.log('元素被点击', e);
// 线表达式 onclick 处理
let camCondition = document.querySelector('#cam-condition')
if (camCondition) {
camCondition.onclick = function () {
vc.emit('chooseFlowElementCondition', 'openModal', {
condition: camCondition.value
});
};
}
let camundaAssignee = document.querySelector('#camunda-assignee');
if (camundaAssignee) {
camundaAssignee.onclick = function () {
vc.emit('selectStaff', 'openStaff', $that.bpmnjsInfo);
};
}
}
}
}
});
})(window.vc);

View File

@ -0,0 +1,50 @@
<div id="chooseFlowElementConditionModel" class="modal fade" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-body">
<h3 class="m-t-none m-b ">选择条件</h3>
<div class="ibox-content">
<div>
<div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">条件类型</label>
<div class="col-sm-10">
<select class="custom-select" v-model="chooseFlowElementConditionInfo.flag">
<option selected disabled value="">必填,请选择条件类型</option>
<option value="Auto">通用</option>
<option value="Custom">手工输入</option>
</select>
</div>
</div>
<div class="form-group row" v-if="chooseFlowElementConditionInfo.flag == 'Auto'">
<label class="col-sm-2 col-form-label">表达式</label>
<div class="col-sm-10">
<select class="custom-select" v-model="chooseFlowElementConditionInfo.condition">
<option selected disabled value="">必填,请选择表达式</option>
<option value="${auditCode=='1100'}">同意</option>
<option value="${auditCode=='1200'}">退回上一节点</option>
<option value="${auditCode=='1400'}">退回至提交者</option>
</select>
</div>
</div>
<div class="form-group row" v-else>
<label class="col-sm-2 col-form-label">表达式</label>
<div class="col-sm-10">
<input placeholder="输入表达式" type="text" v-model="chooseFlowElementConditionInfo.condition"
class="form-control form-control-sm">
</div>
</div>
<div class="ibox-content">
<button class="btn btn-primary float-right" type="button" v-on:click="chooseFlowCondition()"><i
class="fa fa-check"></i>&nbsp;确定</button>
<button type="button" class="btn btn-warning float-right" style="margin-right:20px;"
data-dismiss="modal">取消</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,33 @@
(function (vc) {
vc.extends({
data: {
chooseFlowElementConditionInfo: {
flag: 'Auto',
condition: '',
}
},
_initMethod: function () {
},
_initEvent: function () {
vc.on('chooseFlowElementCondition', 'openModal', function (_param) {
$that.clearAddActivitiesRuleInfo();
vc.copyObject(_param, $that.chooseFlowElementConditionInfo);
$('#chooseFlowElementConditionModel').modal('show');
});
},
methods: {
chooseFlowCondition: function () {
vc.emit('bpmnjs', 'index', $that.chooseFlowElementConditionInfo);
$('#chooseFlowElementConditionModel').modal('hide');
},
clearAddActivitiesRuleInfo: function () {
vc.component.chooseFlowElementConditionInfo = {
condition: '',
flag: 'Auto',
};
}
}
});
})(window.vc);

View File

@ -12,7 +12,7 @@
<div class=" staff padding padding-top-xs">
<div class=" padding overflow-hidden"
:class="{'select':selectStaffInfo.curCompanyId == item.orgId}"
v-for="(item,index) in selectStaffInfo.companys" @click="_changeCompany(item)">
v-for="(item,index) in selectStaffInfo.companys" @click="_changeCompany(item)" style="cursor:pointer">
<span>
<i class="fa fa-building-o margin-right-xs" aria-hidden="true"></i>
{{item.orgName}}
@ -25,7 +25,7 @@
<div class="padding-left staff padding padding-top-xs">
<div class=" padding overflow-hidden"
:class="{'select':selectStaffInfo.curDepartmentId == item.orgId}"
v-for="(item,index) in selectStaffInfo.departments" @click="_changeDepartment(item)">
v-for="(item,index) in selectStaffInfo.departments" @click="_changeDepartment(item)" style="cursor:pointer">
<span>
<i class="fa fa-sitemap margin-right-xs" aria-hidden="true"></i>
{{item.orgName}}
@ -39,7 +39,7 @@
<div class=" padding overflow-hidden"
:class="{'select':selectStaffInfo.curStaffId == item.staffId}"
v-for="(item,index) in selectStaffInfo.staffs"
@click="_changeStaff(item)"
@click="_changeStaff(item)" style="cursor:pointer"
>
<span>
<i class="fa fa-user margin-right-xs" aria-hidden="true"></i>