zhangdaihao
6 years ago
parent
8b08589b78
commit
d1253bfeb2
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 4.6 KiB |
@ -1,35 +0,0 @@
|
|||||||
|
|
||||||
<template>
|
|
||||||
<component ref="compModel" :is="comp" :formData="formData" v-if="comp" @ok="callBackOk" @close="callBackClose"></component>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'DynamicComponent',
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
compName: this.path
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
comp: function () {
|
|
||||||
return () => import(`@/views/${this.compName}.vue`)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
props: ['path','formData'],
|
|
||||||
methods: {
|
|
||||||
add () {
|
|
||||||
this.$refs.compModel.add();
|
|
||||||
},
|
|
||||||
callBackClose () {
|
|
||||||
this.$emit('close');
|
|
||||||
},
|
|
||||||
handleOk () {
|
|
||||||
this.$refs.compModel.handleOk();
|
|
||||||
},
|
|
||||||
callBackOk(){
|
|
||||||
this.$emit('ok');
|
|
||||||
this.close();
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
@ -1,72 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:title="title"
|
|
||||||
:width="width"
|
|
||||||
:visible="visible"
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
@ok="handleOk"
|
|
||||||
@cancel="handleCancel"
|
|
||||||
destroyOnClose
|
|
||||||
cancelText="关闭">
|
|
||||||
<a-spin :spinning="confirmLoading">
|
|
||||||
<dynamic-component ref="dynamiclink" :path="path" :formData="formData" @ok="callBackOk" @close="callBackClose"></dynamic-component>
|
|
||||||
</a-spin>
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
|
|
||||||
import DynamicComponent from "./DynamicComponent";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "FormCommonModal",
|
|
||||||
props: ['path'],
|
|
||||||
components: {
|
|
||||||
DynamicComponent
|
|
||||||
},
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
title:"操作",
|
|
||||||
width:"80%",
|
|
||||||
visible: false,
|
|
||||||
confirmLoading: false,
|
|
||||||
formData:{},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created () {
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
add () {
|
|
||||||
this.formData =[];
|
|
||||||
this.title = "新增";
|
|
||||||
this.visible = true;
|
|
||||||
this.$refs.dynamiclink.add();
|
|
||||||
},
|
|
||||||
edit (record) {
|
|
||||||
var data = {
|
|
||||||
dataId:record.id,
|
|
||||||
}
|
|
||||||
this.formData = data;
|
|
||||||
this.visible = true;
|
|
||||||
},
|
|
||||||
callBackClose () {
|
|
||||||
this.$emit('close');
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleOk () {
|
|
||||||
this.$refs.dynamiclink.handleOk();
|
|
||||||
},
|
|
||||||
callBackOk(){
|
|
||||||
this.$emit('ok');
|
|
||||||
this.callBackClose();
|
|
||||||
},
|
|
||||||
handleCancel () {
|
|
||||||
this.callBackClose()
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,120 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:title="title"
|
|
||||||
:width="280"
|
|
||||||
:visible="visible"
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
:bodyStyle ="bodyStyle"
|
|
||||||
:mask = "false"
|
|
||||||
destroyOnClose
|
|
||||||
:footer="null"
|
|
||||||
@cancel="handleCancel"
|
|
||||||
cancelText="关闭">
|
|
||||||
|
|
||||||
<a-spin :spinning="confirmLoading">
|
|
||||||
<div style="height: 300px;overflow: hidden;overflow-y: auto;overflow-x: auto;">
|
|
||||||
<template v-for="(item, key, index) in nodeInfos">
|
|
||||||
<table class="gridtable">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<th width="90">任务名称</th>
|
|
||||||
<td width="150">{{ item.taskName}}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th width="90">执行人</th>
|
|
||||||
<td width="150">{{ item.taskAssigneeId}}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th width="90">开始时间</th>
|
|
||||||
<td width="150">{{ item.taskBeginTime }}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th width="90">结束时间</th>
|
|
||||||
<td width="150">{{ item.taskEndTime }}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th width="90">耗时</th>
|
|
||||||
<td width="150">{{ item.durationStr }}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th width="90">意见</th>
|
|
||||||
<td width="150">{{ item.remarks }}</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</template>
|
|
||||||
</div>
|
|
||||||
</a-spin>
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { httpAction } from '@/api/manage'
|
|
||||||
import pick from 'lodash.pick'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "ProcNodeInfoModel",
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
title:"任务审批详情",
|
|
||||||
visible: false,
|
|
||||||
bodyStyle:{
|
|
||||||
padding: "0",
|
|
||||||
},
|
|
||||||
confirmLoading: false,
|
|
||||||
validatorRules:{
|
|
||||||
},
|
|
||||||
nodeInfos:[],
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created () {
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
showInfo(record,taskId) {
|
|
||||||
this.nodeInfos = [];
|
|
||||||
for (var item of record) {
|
|
||||||
if(item.taskId == taskId){
|
|
||||||
this.nodeInfos.push(item);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.visible = true;
|
|
||||||
},
|
|
||||||
close() {
|
|
||||||
this.nodeInfos = [];
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleCancel () {
|
|
||||||
this.nodeInfos = [];
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
table.gridtable {
|
|
||||||
margin: 0 auto;
|
|
||||||
margin-top: 10px;
|
|
||||||
font-family: verdana,arial,sans-serif;
|
|
||||||
font-size:12px;
|
|
||||||
color:#333333;
|
|
||||||
border-width: 1px;
|
|
||||||
border-color: #ddd;
|
|
||||||
border-collapse: collapse;
|
|
||||||
}
|
|
||||||
table.gridtable th {
|
|
||||||
border-width: 1px;
|
|
||||||
padding: 8px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: #ddd;
|
|
||||||
background-color: #eee;
|
|
||||||
}
|
|
||||||
table.gridtable td {
|
|
||||||
border-width: 1px;
|
|
||||||
padding: 8px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: #ddd;
|
|
||||||
background-color: #ffffff;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,136 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-modal
|
|
||||||
:title="title"
|
|
||||||
:width="900"
|
|
||||||
:visible="visible"
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
@cancel="handleCancel"
|
|
||||||
:bodyStyle="bodyStyle"
|
|
||||||
style="top: 50px;"
|
|
||||||
destroyOnClose
|
|
||||||
:footer="null"
|
|
||||||
cancelText="关闭">
|
|
||||||
|
|
||||||
<a-spin :spinning="confirmLoading">
|
|
||||||
<img :src="picUrl" alt="流程图" usemap="#planetmap"/>
|
|
||||||
<map name="planetmap">
|
|
||||||
<template v-for="(item, key, index) in nodePositionInfo.positionList">
|
|
||||||
<area shape="rect" :coords="item.coords" title="Venus" @mouseover="showNodeInfo(nodePositionInfo.hisTasks,item.id)">
|
|
||||||
</template>
|
|
||||||
</map>
|
|
||||||
</a-spin>
|
|
||||||
<proc-node-info-model ref="nodeInfoModel"></proc-node-info-model>
|
|
||||||
</a-modal>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { getAction } from '@/api/manage'
|
|
||||||
import qs from 'qs';
|
|
||||||
import ProcNodeInfoModel from "./ProcNodeInfoModel.vue";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {ProcNodeInfoModel},
|
|
||||||
name: "ProcessInstPicModal",
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
title:"操作",
|
|
||||||
visible: false,
|
|
||||||
nodePositionInfo:{},
|
|
||||||
model: {},
|
|
||||||
labelCol: {
|
|
||||||
xs: { span: 24 },
|
|
||||||
sm: { span: 5 },
|
|
||||||
},
|
|
||||||
wrapperCol: {
|
|
||||||
xs: { span: 24 },
|
|
||||||
sm: { span: 16 },
|
|
||||||
},
|
|
||||||
bodyStyle:{
|
|
||||||
"overflow-y":"auto",
|
|
||||||
"overflow-x":"auto",
|
|
||||||
height:(window.innerHeight-280)+"px",
|
|
||||||
},
|
|
||||||
confirmLoading: false,
|
|
||||||
picUrl:"",
|
|
||||||
url: {
|
|
||||||
getProcessInfo: "/process/extActFlowData/getProcessInfo",
|
|
||||||
getNodePositionInfo:"/act/task/getNodePositionInfo",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created () {
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
preview(flowCode,dataId){
|
|
||||||
this.visible = true;
|
|
||||||
var params = {
|
|
||||||
flowCode:flowCode,
|
|
||||||
dataId:dataId
|
|
||||||
};//查询条件
|
|
||||||
this.confirmLoading = true;
|
|
||||||
getAction(this.url.getProcessInfo,params).then((res)=>{
|
|
||||||
if(res.success){
|
|
||||||
var processInstanceId = res.result.processInstanceId;
|
|
||||||
this.picUrl = this.getResourceURL(processInstanceId);
|
|
||||||
this.getNodePositionInfoData(processInstanceId);
|
|
||||||
console.log("---流程图----",this.picUrl)
|
|
||||||
}else{
|
|
||||||
this.$message.warning(res.message);
|
|
||||||
}
|
|
||||||
}).catch(e => {
|
|
||||||
console.error(e)
|
|
||||||
}).then(() => {
|
|
||||||
this.confirmLoading = false;
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
},
|
|
||||||
close () {
|
|
||||||
this.$emit('close');
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleCancel () {
|
|
||||||
this.close()
|
|
||||||
},
|
|
||||||
// 获取静态资源访问地址
|
|
||||||
getResourceURL(processInstanceId) {
|
|
||||||
var params = qs.stringify({
|
|
||||||
//'token': Cookies.get('token'),
|
|
||||||
'_t': Date.parse(new Date())/1000,
|
|
||||||
'processInstanceId': processInstanceId
|
|
||||||
})
|
|
||||||
return `${window._CONFIG['domianURL']}/act/process/processPic?${params}`
|
|
||||||
},
|
|
||||||
// 获取静态资源访问地址
|
|
||||||
getResourceURL(processInstanceId) {
|
|
||||||
var params = qs.stringify({
|
|
||||||
//'token': Cookies.get('token'),
|
|
||||||
'_t': Date.parse(new Date())/1000,
|
|
||||||
'processInstanceId': processInstanceId
|
|
||||||
})
|
|
||||||
return `${window._CONFIG['domianURL']}/act/process/processPic?${params}`
|
|
||||||
},
|
|
||||||
|
|
||||||
// 查询坐标信息数据
|
|
||||||
getNodePositionInfoData(processInstanceId) {
|
|
||||||
var params = {processInstanceId:processInstanceId};//查询条件
|
|
||||||
getAction(this.url.getNodePositionInfo,params).then(res => {
|
|
||||||
if (res.success) {
|
|
||||||
this.nodePositionInfo = res.result
|
|
||||||
}
|
|
||||||
}).catch(e => {
|
|
||||||
console.error(e)
|
|
||||||
}).then(() => {
|
|
||||||
})
|
|
||||||
},
|
|
||||||
showNodeInfo(data,taskId){
|
|
||||||
this.$refs.nodeInfoModel.close();
|
|
||||||
this.$refs.nodeInfoModel.showInfo(data,taskId);
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,309 +0,0 @@
|
|||||||
<template>
|
|
||||||
|
|
||||||
<a-modal
|
|
||||||
:width="modalWidth"
|
|
||||||
:visible="visible"
|
|
||||||
:title="title"
|
|
||||||
@ok="handleSubmit"
|
|
||||||
@cancel="close"
|
|
||||||
cancelText="关闭"
|
|
||||||
style="margin-top: -70px"
|
|
||||||
wrapClassName="ant-modal-cust-warp"
|
|
||||||
>
|
|
||||||
<a-row :gutter="10" style="background-color: #ececec; padding: 10px; margin: -10px">
|
|
||||||
<a-col :md="6" :sm="24">
|
|
||||||
<a-card :bordered="false">
|
|
||||||
<!--组织机构-->
|
|
||||||
<a-directory-tree
|
|
||||||
selectable
|
|
||||||
:selectedKeys="selectedKeys"
|
|
||||||
:checkStrictly="true"
|
|
||||||
@select="this.onSelect"
|
|
||||||
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
|
|
||||||
:treeData="departTree"
|
|
||||||
/>
|
|
||||||
</a-card>
|
|
||||||
</a-col>
|
|
||||||
<a-col :md="18" :sm="24">
|
|
||||||
<a-card :bordered="false">
|
|
||||||
用户账号:
|
|
||||||
<a-input-search
|
|
||||||
:style="{width:'150px',marginBottom:'15px'}"
|
|
||||||
placeholder="请输入用户账号"
|
|
||||||
v-model="queryParam.username"
|
|
||||||
@search="onSearch"
|
|
||||||
></a-input-search>
|
|
||||||
<a-button @click="searchReset(1)" style="margin-left: 20px" icon="redo">重置</a-button>
|
|
||||||
<!--用户列表-->
|
|
||||||
<a-table
|
|
||||||
ref="table"
|
|
||||||
:scroll="scrollTrigger"
|
|
||||||
size="middle"
|
|
||||||
rowKey="id"
|
|
||||||
:columns="columns"
|
|
||||||
:dataSource="dataSource"
|
|
||||||
:pagination="ipagination"
|
|
||||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
|
||||||
@change="handleTableChange">
|
|
||||||
</a-table>
|
|
||||||
</a-card>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
</a-modal>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { filterObj } from '@/utils/util'
|
|
||||||
import { queryDepartTreeList, getUserList, queryUserByDepId, queryUserRoleMap } from '@/api/api'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'JSearchUserByDep',
|
|
||||||
components: {},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
queryParam: {
|
|
||||||
username:"",
|
|
||||||
},
|
|
||||||
columns: [
|
|
||||||
{
|
|
||||||
title: '用户账号',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'username'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '真实姓名',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'realname'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '角色名称',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'roleName'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '性别',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'sex',
|
|
||||||
customRender: function(text) {
|
|
||||||
if (text === 1) {
|
|
||||||
return '男'
|
|
||||||
} else if (text === 2) {
|
|
||||||
return '女'
|
|
||||||
} else {
|
|
||||||
return text
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '手机号码',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'phone'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '邮箱',
|
|
||||||
align: 'center',
|
|
||||||
dataIndex: 'email'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
scrollTrigger: {},
|
|
||||||
dataSource: [],
|
|
||||||
selectedKeys: [],
|
|
||||||
userNameArr: [],
|
|
||||||
departName: '',
|
|
||||||
userRolesMap: {},
|
|
||||||
title: '',
|
|
||||||
ipagination: {
|
|
||||||
current: 1,
|
|
||||||
pageSize: 10,
|
|
||||||
pageSizeOptions: ['10', '20', '30'],
|
|
||||||
showTotal: (total, range) => {
|
|
||||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
|
||||||
},
|
|
||||||
showQuickJumper: true,
|
|
||||||
showSizeChanger: true,
|
|
||||||
total: 0
|
|
||||||
},
|
|
||||||
isorter: {
|
|
||||||
column: 'createTime',
|
|
||||||
order: 'desc'
|
|
||||||
},
|
|
||||||
selectedRowKeys: [],
|
|
||||||
selectedRows: [],
|
|
||||||
modalWidth: 1250,
|
|
||||||
departTree: [],
|
|
||||||
visible: false,
|
|
||||||
form: this.$form.createForm(this)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// 该方法触发屏幕自适应
|
|
||||||
this.resetScreenSize();
|
|
||||||
this.queryUserRoleMap();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
loadData(arg) {
|
|
||||||
if (arg === 1) {
|
|
||||||
this.ipagination.current = 1;
|
|
||||||
}
|
|
||||||
let params = this.getQueryParams();//查询条件
|
|
||||||
getUserList(params).then((res) => {
|
|
||||||
if (res.success) {
|
|
||||||
this.dataSource = res.result.records;
|
|
||||||
this.assignRoleName(this.dataSource);
|
|
||||||
this.ipagination.total = res.result.total;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
queryUserRoleMap(){
|
|
||||||
queryUserRoleMap().then((res) => {
|
|
||||||
if (res.success) {
|
|
||||||
this.userRolesMap = res.result;
|
|
||||||
this.loadData();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 触发屏幕自适应
|
|
||||||
resetScreenSize() {
|
|
||||||
let screenWidth = document.body.clientWidth;
|
|
||||||
if (screenWidth < 500) {
|
|
||||||
this.scrollTrigger = { x: 800 };
|
|
||||||
} else {
|
|
||||||
this.scrollTrigger = {};
|
|
||||||
}
|
|
||||||
},
|
|
||||||
showModal() {
|
|
||||||
this.visible = true;
|
|
||||||
this.assignRoleName(this.dataSource);
|
|
||||||
this.queryDepartTree();
|
|
||||||
this.form.resetFields();
|
|
||||||
},
|
|
||||||
getQueryParams() {
|
|
||||||
let param = Object.assign({}, this.queryParam, this.isorter);
|
|
||||||
param.field = this.getQueryField();
|
|
||||||
param.pageNo = this.ipagination.current;
|
|
||||||
param.pageSize = this.ipagination.pageSize;
|
|
||||||
return filterObj(param);
|
|
||||||
},
|
|
||||||
getQueryField() {
|
|
||||||
let str = 'id,';
|
|
||||||
for (let a = 0; a < this.columns.length; a++) {
|
|
||||||
str += ',' + this.columns[a].dataIndex;
|
|
||||||
}
|
|
||||||
return str;
|
|
||||||
},
|
|
||||||
searchReset(num) {
|
|
||||||
let that = this;
|
|
||||||
if(num !== 0){
|
|
||||||
that.queryParam = {};
|
|
||||||
that.loadData(1);
|
|
||||||
}
|
|
||||||
that.selectedRowKeys = [];
|
|
||||||
that.userNameArr = [];
|
|
||||||
that.selectedKeys = [];
|
|
||||||
},
|
|
||||||
close() {
|
|
||||||
this.searchReset(0);
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleTableChange(pagination, filters, sorter) {
|
|
||||||
//TODO 筛选
|
|
||||||
if (Object.keys(sorter).length > 0) {
|
|
||||||
this.isorter.column = sorter.field;
|
|
||||||
this.isorter.order = 'ascend' === sorter.order ? 'asc' : 'desc';
|
|
||||||
}
|
|
||||||
this.ipagination = pagination;
|
|
||||||
this.loadData();
|
|
||||||
},
|
|
||||||
handleSubmit() {
|
|
||||||
let that = this;
|
|
||||||
for (let i = 0, len = this.selectedRowKeys.length; i < len; i++) {
|
|
||||||
this.getUserNames(this.selectedRowKeys[i]);
|
|
||||||
}
|
|
||||||
that.$emit('ok', that.userNameArr.join(','));
|
|
||||||
that.close();
|
|
||||||
},
|
|
||||||
// 遍历匹配,获取用户真实姓名
|
|
||||||
getUserNames(rowId) {
|
|
||||||
let dataSource = this.dataSource;
|
|
||||||
for (let i = 0, len = dataSource.length; i < len; i++) {
|
|
||||||
if (rowId === dataSource[i].id) {
|
|
||||||
this.userNameArr.push(dataSource[i].realname);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 点击树节点,筛选出对应的用户
|
|
||||||
onSelect(selectedKeys) {
|
|
||||||
if (selectedKeys[0] != null) {
|
|
||||||
this.queryUserByDepId(selectedKeys); // 调用方法根据选选择的id查询用户信息
|
|
||||||
if (this.selectedKeys[0] !== selectedKeys[0]) {
|
|
||||||
this.selectedKeys = [selectedKeys[0]];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
onSelectChange(selectedRowKeys, selectionRows) {
|
|
||||||
this.selectedRowKeys = selectedRowKeys;
|
|
||||||
this.selectionRows = selectionRows;
|
|
||||||
},
|
|
||||||
onSearch() {
|
|
||||||
this.loadData(1);
|
|
||||||
},
|
|
||||||
// 根据选择的id来查询用户信息
|
|
||||||
queryUserByDepId(selectedKeys) {
|
|
||||||
queryUserByDepId({ id: selectedKeys.toString() }).then((res) => {
|
|
||||||
if (res.success) {
|
|
||||||
this.dataSource = res.result;
|
|
||||||
this.ipagination.total = res.result.length;
|
|
||||||
this.assignRoleName(this.dataSource);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 传入用户id,找到匹配的角色名称
|
|
||||||
queryUserRole(userId) {
|
|
||||||
let map = this.userRolesMap;
|
|
||||||
let roleName = [];
|
|
||||||
for (var key in map) {
|
|
||||||
if (userId === key) {
|
|
||||||
roleName.push(map[key]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return roleName.join(',');
|
|
||||||
},
|
|
||||||
queryDepartTree() {
|
|
||||||
queryDepartTreeList().then((res) => {
|
|
||||||
if (res.success) {
|
|
||||||
this.departTree = res.result;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 为角色名称赋值
|
|
||||||
assignRoleName(data) {
|
|
||||||
let userId = '';
|
|
||||||
let role = '';
|
|
||||||
for (let i = 0, length = data.length; i < length; i++) {
|
|
||||||
userId = this.dataSource[i].id;
|
|
||||||
role = this.queryUserRole(userId);
|
|
||||||
this.dataSource[i].roleName = role;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
modalFormOk() {
|
|
||||||
this.loadData();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.ant-table-tbody .ant-table-row td {
|
|
||||||
padding-top: 10px;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#components-layout-demo-custom-trigger .trigger {
|
|
||||||
font-size: 18px;
|
|
||||||
line-height: 64px;
|
|
||||||
padding: 0 24px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: color .3s;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,276 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<a-modal
|
|
||||||
centered
|
|
||||||
:title="title"
|
|
||||||
:width="1000"
|
|
||||||
:visible="visible"
|
|
||||||
@ok="handleOk"
|
|
||||||
@cancel="handleCancel"
|
|
||||||
cancelText="关闭">
|
|
||||||
<a-row :gutter="18">
|
|
||||||
<a-col :span="16">
|
|
||||||
<a-card title="选择人员" :bordered="true">
|
|
||||||
<!-- 查询区域 -->
|
|
||||||
<div class="table-page-search-wrapper">
|
|
||||||
<a-form layout="inline">
|
|
||||||
<a-row :gutter="24">
|
|
||||||
|
|
||||||
<a-col :span="10">
|
|
||||||
<a-form-item label="姓名">
|
|
||||||
<a-input placeholder="请输入姓名" v-model="queryParam.name"></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="8" >
|
|
||||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
|
||||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
|
||||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
|
||||||
</span>
|
|
||||||
</a-col>
|
|
||||||
|
|
||||||
</a-row>
|
|
||||||
</a-form>
|
|
||||||
</div>
|
|
||||||
<!-- table区域-begin -->
|
|
||||||
<div>
|
|
||||||
<a-table
|
|
||||||
size="small"
|
|
||||||
bordered
|
|
||||||
rowKey="id"
|
|
||||||
:columns="columns1"
|
|
||||||
:dataSource="dataSource1"
|
|
||||||
:pagination="ipagination"
|
|
||||||
:loading="loading"
|
|
||||||
:scroll="{ y: 240 }"
|
|
||||||
:rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
|
|
||||||
@change="handleTableChange">
|
|
||||||
|
|
||||||
</a-table>
|
|
||||||
</div>
|
|
||||||
<!-- table区域-end -->
|
|
||||||
</a-card>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="8">
|
|
||||||
<a-card title="用户选择" :bordered="true">
|
|
||||||
<!-- table区域-begin -->
|
|
||||||
<div>
|
|
||||||
<a-table
|
|
||||||
size="small"
|
|
||||||
bordered
|
|
||||||
rowKey="id"
|
|
||||||
:columns="columns2"
|
|
||||||
:dataSource="dataSource2"
|
|
||||||
:loading="loading"
|
|
||||||
:scroll="{ y: 240 }"
|
|
||||||
>
|
|
||||||
<span slot="action" slot-scope="text, record">
|
|
||||||
<a-button type="primary" size="small" @click="handleDelete(record)" icon="delete">删除</a-button>
|
|
||||||
</span>
|
|
||||||
</a-table>
|
|
||||||
</div>
|
|
||||||
<!-- table区域-end -->
|
|
||||||
</a-card>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
</a-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { filterObj } from '@/utils/util'
|
|
||||||
import { getAction } from '@/api/manage'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "SelectDemoModal",
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
title: "用户列表",
|
|
||||||
names: [],
|
|
||||||
visible: false,
|
|
||||||
placement: 'right',
|
|
||||||
description: '人员管理页面',
|
|
||||||
// 查询条件
|
|
||||||
queryParam: {},
|
|
||||||
// 表头
|
|
||||||
columns1: [
|
|
||||||
{
|
|
||||||
title: '#',
|
|
||||||
dataIndex: '',
|
|
||||||
key:'rowIndex',
|
|
||||||
width:50,
|
|
||||||
align:"center",
|
|
||||||
customRender:function (t,r,index) {
|
|
||||||
return parseInt(index)+1;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '姓名',
|
|
||||||
align:"center",
|
|
||||||
width:113,
|
|
||||||
dataIndex: 'name'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '年龄',
|
|
||||||
align:"center",
|
|
||||||
width:100,
|
|
||||||
dataIndex: 'age'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '出生日期',
|
|
||||||
align:"center",
|
|
||||||
width:100,
|
|
||||||
dataIndex: 'birthday'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
columns2: [
|
|
||||||
|
|
||||||
{
|
|
||||||
title: '用户账号',
|
|
||||||
align:"center",
|
|
||||||
width:100,
|
|
||||||
dataIndex: 'name'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '操作',
|
|
||||||
dataIndex: 'action',
|
|
||||||
align:"center",
|
|
||||||
width:100,
|
|
||||||
scopedSlots: { customRender: 'action' },
|
|
||||||
}
|
|
||||||
],
|
|
||||||
//数据集
|
|
||||||
dataSource1:[],
|
|
||||||
dataSource2:[],
|
|
||||||
// 分页参数
|
|
||||||
ipagination:{
|
|
||||||
current: 1,
|
|
||||||
pageSize: 10,
|
|
||||||
pageSizeOptions: ['10', '20', '30'],
|
|
||||||
showTotal: (total, range) => {
|
|
||||||
return range[0] + "-" + range[1] + " 共" + total + "条"
|
|
||||||
},
|
|
||||||
showQuickJumper: true,
|
|
||||||
showSizeChanger: true,
|
|
||||||
total: 0
|
|
||||||
},
|
|
||||||
isorter:{
|
|
||||||
column: 'createTime',
|
|
||||||
order: 'desc',
|
|
||||||
},
|
|
||||||
loading:false,
|
|
||||||
selectedRowKeys: [],
|
|
||||||
selectedRows: [],
|
|
||||||
url: {
|
|
||||||
list: "/test/jeecgDemo/list",
|
|
||||||
},
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
this.loadData();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
searchQuery(){
|
|
||||||
this.loadData(1);
|
|
||||||
},
|
|
||||||
searchReset(){
|
|
||||||
this.queryParam={};
|
|
||||||
this.loadData(1);
|
|
||||||
},
|
|
||||||
handleCancel() {
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleOk() {
|
|
||||||
this.$emit("selectFinished",this.dataSource2);
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
add() {
|
|
||||||
this.visible = true;
|
|
||||||
},
|
|
||||||
loadData (arg){
|
|
||||||
//加载数据 若传入参数1则加载第一页的内容
|
|
||||||
if(arg===1){
|
|
||||||
this.ipagination.current = 1;
|
|
||||||
}
|
|
||||||
var params = this.getQueryParams();//查询条件
|
|
||||||
getAction(this.url.list,params).then((res)=>{
|
|
||||||
if(res.success){
|
|
||||||
this.dataSource1 = res.result.records;
|
|
||||||
this.ipagination.total = res.result.total;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
getQueryParams(){
|
|
||||||
var param = Object.assign({}, this.queryParam,this.isorter);
|
|
||||||
param.field = this.getQueryField();
|
|
||||||
param.pageNo = this.ipagination.current;
|
|
||||||
param.pageSize = this.ipagination.pageSize;
|
|
||||||
return filterObj(param);
|
|
||||||
},
|
|
||||||
getQueryField(){
|
|
||||||
//TODO 字段权限控制
|
|
||||||
},
|
|
||||||
onSelectAll (selected, selectedRows, changeRows) {
|
|
||||||
if(selected===true){
|
|
||||||
for(var a = 0;a<changeRows.length;a++){
|
|
||||||
this.dataSource2.push(changeRows[a]);
|
|
||||||
}
|
|
||||||
}else{
|
|
||||||
for(var b = 0;b<changeRows.length;b++){
|
|
||||||
this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]),1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// console.log(selected, selectedRows, changeRows);
|
|
||||||
},
|
|
||||||
onSelect (record,selected) {
|
|
||||||
if(selected===true){
|
|
||||||
this.dataSource2.push(record);
|
|
||||||
}else{
|
|
||||||
var index = this.dataSource2.indexOf(record);
|
|
||||||
//console.log();
|
|
||||||
if(index >=0 ){
|
|
||||||
this.dataSource2.splice(this.dataSource2.indexOf(record),1);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
onSelectChange (selectedRowKeys,selectedRows) {
|
|
||||||
this.selectedRowKeys = selectedRowKeys;
|
|
||||||
this.selectionRows = selectedRows;
|
|
||||||
},
|
|
||||||
onClearSelected(){
|
|
||||||
this.selectedRowKeys = [];
|
|
||||||
this.selectionRows = [];
|
|
||||||
},
|
|
||||||
handleDelete: function(record){
|
|
||||||
this.dataSource2.splice(this.dataSource2.indexOf(record),1);
|
|
||||||
},
|
|
||||||
handleTableChange(pagination, filters, sorter){
|
|
||||||
//分页、排序、筛选变化时触发
|
|
||||||
console.log(sorter);
|
|
||||||
//TODO 筛选
|
|
||||||
if (Object.keys(sorter).length>0){
|
|
||||||
this.isorter.column = sorter.field;
|
|
||||||
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
|
|
||||||
}
|
|
||||||
this.ipagination = pagination;
|
|
||||||
this.loadData();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.ant-card-body .table-operator{
|
|
||||||
margin-bottom: 18px;
|
|
||||||
}
|
|
||||||
.ant-table-tbody .ant-table-row td{
|
|
||||||
padding-top:15px;
|
|
||||||
padding-bottom:15px;
|
|
||||||
}
|
|
||||||
.anty-row-operator button{margin: 0 5px}
|
|
||||||
.ant-btn-danger{background-color: #ffffff}
|
|
||||||
|
|
||||||
.ant-modal-cust-warp{height: 100%}
|
|
||||||
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
|
|
||||||
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
|
|
||||||
</style>
|
|
||||||
@ -1,87 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<a-modal
|
|
||||||
:title="title"
|
|
||||||
:width="800"
|
|
||||||
:visible="visible"
|
|
||||||
:confirmLoading="confirmLoading"
|
|
||||||
@ok="handleSubmit"
|
|
||||||
@cancel="handleCancel">
|
|
||||||
<div>
|
|
||||||
<a-form-item label="用户名：" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
|
|
||||||
<a-input-search placeholder="点击右侧按钮选择用户" disabled @search="onSearch" v-model="userNames">
|
|
||||||
<a-button slot="enterButton" icon="search">选择</a-button>
|
|
||||||
</a-input-search>
|
|
||||||
</a-form-item>
|
|
||||||
</div>
|
|
||||||
</a-modal>
|
|
||||||
|
|
||||||
<!-- 用户查询列表 -->
|
|
||||||
<select-user-list-modal ref="selectUserListModal" @ok="getUserCallBack"></select-user-list-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import {getUserList} from '@/api/api'
|
|
||||||
import SelectUserListModal from './modal/SelectUserListModal'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "SelectUserModal",
|
|
||||||
components: {
|
|
||||||
SelectUserListModal,
|
|
||||||
},
|
|
||||||
props: ['taskId'],
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
title: "操作",
|
|
||||||
visible: false,
|
|
||||||
selectUserListVisible: false,
|
|
||||||
model: {},
|
|
||||||
confirmLoading: false,
|
|
||||||
userNames: '',
|
|
||||||
userKeys: '',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
open() {
|
|
||||||
this.userNames = ''
|
|
||||||
this.userKeys = ''
|
|
||||||
this.visible = true;
|
|
||||||
},
|
|
||||||
close() {
|
|
||||||
this.$emit('close');
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleCancel() {
|
|
||||||
this.close()
|
|
||||||
},
|
|
||||||
onSearch() {
|
|
||||||
this.$refs.selectUserListModal.open();
|
|
||||||
},
|
|
||||||
getUserCallBack(selectionRows) {
|
|
||||||
console.log(selectionRows)
|
|
||||||
let names = ''
|
|
||||||
let keys = ''
|
|
||||||
for (let row of selectionRows) {
|
|
||||||
names = row.realname + "," + names
|
|
||||||
keys = row.username + "," + keys
|
|
||||||
}
|
|
||||||
this.userNames = names
|
|
||||||
this.userKeys = keys
|
|
||||||
|
|
||||||
console.log('--userkeys--' + this.userKeys)
|
|
||||||
},
|
|
||||||
handleSubmit() {
|
|
||||||
console.log("taskId: "+ this.taskId)
|
|
||||||
this.$emit('ok', this.userKeys,this.taskId);
|
|
||||||
this.close()
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@ -1,250 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-card :bordered="false">
|
|
||||||
|
|
||||||
<!-- 查询区域 -->
|
|
||||||
<div class="table-page-search-wrapper">
|
|
||||||
<a-form layout="inline">
|
|
||||||
<a-row :gutter="24">
|
|
||||||
|
|
||||||
<a-col :md="6" :sm="8" class="1">
|
|
||||||
<a-form-item label="请假人">
|
|
||||||
<a-input placeholder="请输入请假人" v-model="queryParam.name"></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :md="6" :sm="8" class="1">
|
|
||||||
<a-form-item label="请假天数">
|
|
||||||
<a-input placeholder="请输入请假天数" v-model="queryParam.days"></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<template v-if="toggleSearchStatus">
|
|
||||||
<a-col :md="6" :sm="8">
|
|
||||||
<a-form-item label="开始时间">
|
|
||||||
<a-input placeholder="请输入开始时间" v-model="queryParam.beginDate"></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :md="6" :sm="8">
|
|
||||||
<a-form-item label="请假结束时间">
|
|
||||||
<a-input placeholder="请输入请假结束时间" v-model="queryParam.endDate"></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :md="6" :sm="8">
|
|
||||||
<a-form-item label="请假原因">
|
|
||||||
<a-input placeholder="请输入请假原因" v-model="queryParam.reason"></a-input>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</template>
|
|
||||||
<a-col :md="6" :sm="8" >
|
|
||||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
|
||||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
|
||||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
|
||||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
|
||||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
|
||||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</a-col>
|
|
||||||
|
|
||||||
</a-row>
|
|
||||||
</a-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 操作按钮区域 -->
|
|
||||||
<div class="table-operator">
|
|
||||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
|
||||||
<a-button type="primary" icon="download" @click="handleExportXls">导出</a-button>
|
|
||||||
<a-upload name="file" :showUploadList="false" :multiple="false" :action="importExcelUrl" @change="handleImportExcel">
|
|
||||||
<a-button type="primary" icon="import">导入</a-button>
|
|
||||||
</a-upload>
|
|
||||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
|
||||||
<a-menu slot="overlay">
|
|
||||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
|
||||||
</a-menu>
|
|
||||||
<a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
|
|
||||||
</a-dropdown>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- table区域-begin -->
|
|
||||||
<div>
|
|
||||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
|
||||||
<i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
|
|
||||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<a-table
|
|
||||||
ref="table"
|
|
||||||
size="middle"
|
|
||||||
bordered
|
|
||||||
rowKey="id"
|
|
||||||
:columns="columns"
|
|
||||||
:dataSource="dataSource"
|
|
||||||
:pagination="ipagination"
|
|
||||||
:loading="loading"
|
|
||||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
|
||||||
@change="handleTableChange">
|
|
||||||
|
|
||||||
<span slot="action" slot-scope="text, record">
|
|
||||||
<template v-if="record.bpmStatus === '1'">
|
|
||||||
<a @click="handleEdit(record)">编辑</a>
|
|
||||||
<a-divider type="vertical"/>
|
|
||||||
<a @click="startProcess(record)">提交流程</a>
|
|
||||||
<a-divider type="vertical"/>
|
|
||||||
</template>
|
|
||||||
<a-dropdown>
|
|
||||||
<a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
|
|
||||||
<a-menu slot="overlay">
|
|
||||||
<a-menu-item v-if="record.bpmStatus === '1'">
|
|
||||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
|
||||||
<a>删除</a>
|
|
||||||
</a-popconfirm>
|
|
||||||
</a-menu-item>
|
|
||||||
<a-menu-item v-else @click="handlePreviewPic(record)">审批进度</a-menu-item>
|
|
||||||
</a-menu>
|
|
||||||
</a-dropdown>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
</a-table>
|
|
||||||
</div>
|
|
||||||
<!-- table区域-end -->
|
|
||||||
|
|
||||||
<!-- 表单区域 -->
|
|
||||||
<form-common-modal ref="modalForm" :path="path" @ok="modalFormOk"></form-common-modal>
|
|
||||||
<!-- 审批流程 -->
|
|
||||||
<process-inst-pic-modal ref="processInstPicModal"></process-inst-pic-modal>
|
|
||||||
|
|
||||||
</a-card>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { postAction } from '@/api/manage'
|
|
||||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
||||||
import JDate from '@/components/jeecg/JDate.vue'
|
|
||||||
import FormCommonModal from "@/components/bpm/FormCommonModal";
|
|
||||||
import ProcessInstPicModal from "@/components/bpm/ProcessInstPicModal";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "JoaDemoList",
|
|
||||||
mixins:[JeecgListMixin],
|
|
||||||
components: {
|
|
||||||
FormCommonModal,
|
|
||||||
ProcessInstPicModal,
|
|
||||||
JDate
|
|
||||||
},
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
description: '流程测试管理页面',
|
|
||||||
// 表头
|
|
||||||
columns: [
|
|
||||||
{
|
|
||||||
title: '#',
|
|
||||||
dataIndex: '',
|
|
||||||
key:'rowIndex',
|
|
||||||
width:60,
|
|
||||||
align:"center",
|
|
||||||
customRender:function (t,r,index) {
|
|
||||||
return parseInt(index)+1;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '请假人',
|
|
||||||
align:"center",
|
|
||||||
dataIndex: 'name'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '请假天数',
|
|
||||||
align:"center",
|
|
||||||
dataIndex: 'days'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '开始时间',
|
|
||||||
align:"center",
|
|
||||||
dataIndex: 'beginDate'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '结束时间',
|
|
||||||
align:"center",
|
|
||||||
dataIndex: 'endDate'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '请假原因',
|
|
||||||
align:"center",
|
|
||||||
dataIndex: 'reason'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '流程状态',
|
|
||||||
align:"center",
|
|
||||||
dataIndex: 'bpmStatus',
|
|
||||||
customRender:function (text) {
|
|
||||||
if(text=='1'){
|
|
||||||
return "待提交";
|
|
||||||
}else if(text=='2'){
|
|
||||||
return "处理中";
|
|
||||||
}else if(text=='3'){
|
|
||||||
return "已完成";
|
|
||||||
}else if(text=='4'){
|
|
||||||
return "已作废";
|
|
||||||
}else{
|
|
||||||
return text;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '操作',
|
|
||||||
dataIndex: 'action',
|
|
||||||
align:"center",
|
|
||||||
scopedSlots: { customRender: 'action' },
|
|
||||||
}
|
|
||||||
],
|
|
||||||
flowCode:"dev_joa_demo_001",
|
|
||||||
path:"jeecg/modules/JoaDemoForm",
|
|
||||||
url: {
|
|
||||||
list: "/test/joaDemo/list",
|
|
||||||
delete: "/test/joaDemo/delete",
|
|
||||||
deleteBatch: "/test/joaDemo/deleteBatch",
|
|
||||||
exportXlsUrl: "test/joaDemo/exportXls",
|
|
||||||
importExcelUrl: "test/joaDemo/importExcel",
|
|
||||||
startProcess: "/process/extActProcess/startMutilProcess",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
importExcelUrl: function(){
|
|
||||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
startProcess: function(record){
|
|
||||||
var that = this;
|
|
||||||
this.$confirm({
|
|
||||||
title:"提示",
|
|
||||||
content:"确认提交流程吗?",
|
|
||||||
onOk: function(){
|
|
||||||
var param = {
|
|
||||||
flowCode:that.flowCode,
|
|
||||||
id:record.id,
|
|
||||||
formUrl:that.path,
|
|
||||||
formUrlMobile:that.path
|
|
||||||
}
|
|
||||||
postAction(that.url.startProcess,param).then((res)=>{
|
|
||||||
if(res.success){
|
|
||||||
that.$message.success(res.message);
|
|
||||||
that.loadData();
|
|
||||||
that.onClearSelected();
|
|
||||||
}else{
|
|
||||||
that.$message.warning(res.message);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handlePreviewPic: function(record){
|
|
||||||
var flowCode = this.flowCode;
|
|
||||||
var dataId = record.id;
|
|
||||||
this.$refs.processInstPicModal.preview(flowCode,dataId);
|
|
||||||
this.$refs.processInstPicModal.title="流程图";
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style scoped>
|
|
||||||
@import '~@assets/less/common.less'
|
|
||||||
</style>
|
|
||||||
@ -1,160 +0,0 @@
|
|||||||
<template>
|
|
||||||
|
|
||||||
<a-form :form="form">
|
|
||||||
<a-form-item
|
|
||||||
:labelCol="labelCol"
|
|
||||||
:wrapperCol="wrapperCol"
|
|
||||||
label="请假人">
|
|
||||||
<a-input placeholder="请输入请假人" v-decorator="['name', {}]" />
|
|
||||||
</a-form-item>
|
|
||||||
<a-form-item
|
|
||||||
:labelCol="labelCol"
|
|
||||||
:wrapperCol="wrapperCol"
|
|
||||||
label="请假天数">
|
|
||||||
<a-input-number v-decorator="[ 'days', {}]" />
|
|
||||||
</a-form-item>
|
|
||||||
<a-form-item
|
|
||||||
:labelCol="labelCol"
|
|
||||||
:wrapperCol="wrapperCol"
|
|
||||||
label="开始时间">
|
|
||||||
<a-date-picker showTime format='YYYY-MM-DD' v-decorator="[ 'beginDate', {}]" />
|
|
||||||
</a-form-item>
|
|
||||||
<a-form-item
|
|
||||||
:labelCol="labelCol"
|
|
||||||
:wrapperCol="wrapperCol"
|
|
||||||
label="请假结束时间">
|
|
||||||
<a-date-picker showTime format='YYYY-MM-DD' v-decorator="[ 'endDate', {}]" />
|
|
||||||
</a-form-item>
|
|
||||||
<a-form-item
|
|
||||||
:labelCol="labelCol"
|
|
||||||
:wrapperCol="wrapperCol"
|
|
||||||
label="请假原因">
|
|
||||||
<a-input placeholder="请输入请假原因" v-decorator="['reason', {}]" />
|
|
||||||
</a-form-item>
|
|
||||||
</a-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { httpAction,getAction } from '@/api/manage'
|
|
||||||
import moment from "moment"
|
|
||||||
import pick from 'lodash.pick'
|
|
||||||
import JDate from '@/components/jeecg/JDate.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "JoaDemoModal",
|
|
||||||
components: { JDate },
|
|
||||||
props: ['formData'],
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
title:"操作",
|
|
||||||
visible: false,
|
|
||||||
model: {},
|
|
||||||
labelCol: {
|
|
||||||
xs: { span: 24 },
|
|
||||||
sm: { span: 5 },
|
|
||||||
},
|
|
||||||
wrapperCol: {
|
|
||||||
xs: { span: 24 },
|
|
||||||
sm: { span: 16 },
|
|
||||||
},
|
|
||||||
|
|
||||||
confirmLoading: false,
|
|
||||||
form: this.$form.createForm(this),
|
|
||||||
validatorRules:{
|
|
||||||
name:{},
|
|
||||||
days:{},
|
|
||||||
beginDate:{},
|
|
||||||
endDate:{},
|
|
||||||
reason:{},
|
|
||||||
bpmStatus:{},
|
|
||||||
},
|
|
||||||
url: {
|
|
||||||
queryById: "/test/joaDemo/queryById",
|
|
||||||
add: "/test/joaDemo/add",
|
|
||||||
edit: "/test/joaDemo/edit",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created () {
|
|
||||||
console.log("form start");
|
|
||||||
console.log("formdata",this.formData);
|
|
||||||
if(this.formData.dataId){
|
|
||||||
var params = {id:this.formData.dataId};//查询条件
|
|
||||||
getAction(this.url.queryById,params).then((res)=>{
|
|
||||||
if(res.success){
|
|
||||||
console.log("获取表单数据",res);
|
|
||||||
this.edit (res.result);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
add () {
|
|
||||||
this.edit({});
|
|
||||||
},
|
|
||||||
edit (record) {
|
|
||||||
this.form.resetFields();
|
|
||||||
this.model = Object.assign({}, record);
|
|
||||||
this.visible = true;
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.form.setFieldsValue(pick(this.model,'name','days','reason','bpmStatus'))
|
|
||||||
//时间格式化
|
|
||||||
this.form.setFieldsValue({beginDate:this.model.beginDate?moment(this.model.beginDate):null})
|
|
||||||
this.form.setFieldsValue({endDate:this.model.endDate?moment(this.model.endDate):null})
|
|
||||||
});
|
|
||||||
|
|
||||||
},
|
|
||||||
close () {
|
|
||||||
this.$emit('close');
|
|
||||||
this.visible = false;
|
|
||||||
},
|
|
||||||
handleOk () {
|
|
||||||
const that = this;
|
|
||||||
// 触发表单验证
|
|
||||||
this.form.validateFields((err, values) => {
|
|
||||||
if (!err) {
|
|
||||||
that.confirmLoading = true;
|
|
||||||
let httpurl = '';
|
|
||||||
let method = '';
|
|
||||||
if(!this.model.id){
|
|
||||||
httpurl+=this.url.add;
|
|
||||||
method = 'post';
|
|
||||||
}else{
|
|
||||||
httpurl+=this.url.edit;
|
|
||||||
method = 'put';
|
|
||||||
}
|
|
||||||
let formData = Object.assign(this.model, values);
|
|
||||||
//时间格式化
|
|
||||||
formData.beginDate = formData.beginDate?formData.beginDate.format('YYYY-MM-DD HH:mm:ss'):null;
|
|
||||||
formData.endDate = formData.endDate?formData.endDate.format('YYYY-MM-DD HH:mm:ss'):null;
|
|
||||||
|
|
||||||
console.log(formData)
|
|
||||||
httpAction(httpurl,formData,method).then((res)=>{
|
|
||||||
if(res.success){
|
|
||||||
that.$message.success(res.message);
|
|
||||||
that.$emit('ok');
|
|
||||||
}else{
|
|
||||||
that.$message.warning(res.message);
|
|
||||||
}
|
|
||||||
}).finally(() => {
|
|
||||||
that.confirmLoading = false;
|
|
||||||
that.close();
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
handleCancel () {
|
|
||||||
this.close()
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 78 KiB After Width: | Height: | Size: 78 KiB |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 8.7 KiB |
|
Before Width: | Height: | Size: 8.7 KiB After Width: | Height: | Size: 8.7 KiB |
|
After Width: | Height: | Size: 8.7 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 50 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue