feat: 审核流程配置功能

dev_ksck2.0
chenhc 1 year ago
parent 09d7bf67bc
commit 81294d4104

@ -81,3 +81,11 @@ export function filterByUser(query) {
params: query
});
}
export function companyUserList(query) {
return axios({
url: "/admin/auth/companyUser/list",
method: "get",
params: query
});
}

@ -0,0 +1,19 @@
import axios from "@/utils/request";
let BUSINESS_PRE = "/udiwms";
export function getDetailList(approvalFlowId) {
return axios({
url: BUSINESS_PRE+`/sysApprovalFlow/approvalFlowDetailList/${approvalFlowId}`,
method: "GET"
});
}
export function submitApprovalFlow(query) {
return axios({
url: BUSINESS_PRE+"/sysApprovalFlow/submitApprovalFlow",
method: "post",
data: query
});
}

@ -0,0 +1,35 @@
import axios from "@/utils/request";
let BUSINESS_PRE = "/udiwms";
export function getList(query) {
return axios({
url: BUSINESS_PRE + '/sysApprovalFlowConfig/filter',
method: 'get',
params: query
})
}
export function getConfigDetailList(query) {
return axios({
url: BUSINESS_PRE + '/sysApprovalFlowConfig/detail',
method: 'get',
params: query
})
}
export function addConfigDetail(query) {
return axios({
url: BUSINESS_PRE+"/sysApprovalFlowConfig/addConfigDetail",
method: "post",
data: query
});
}
// 删除
export function removeDetail(id) {
return axios({
url: BUSINESS_PRE+`/sysApprovalFlowConfig/removeDetail/${id}`,
method: "DELETE"
});
}

@ -0,0 +1,183 @@
<template>
<!-- 时间线 -->
<div class="block" style="padding-top: 40px; padding-left: 200px">
<el-timeline>
<el-timeline-item v-for="(activity, index) in activities" :key="index" :color="colors(activity.approvalStatus)">
<!-- 方案一 -->
<el-card v-if="activity.nodeType == 2 " style="width: 85%" shadow="hover">
<div class="content">
<span>
<b v-if="activity.approvalStatus != 2"></b>
<b v-else></b>
{{ activity.approvalUserName }}</span>
<span v-if="activity.approvalStatus != 2"><b>办理时间</b>{{ activity.approvalTime }}</span>
</div>
<hr color="#eee"/>
<div style="margin-top: 8px">
状态
<el-button type="text" size="small" :style="fontstyle(activity.approvalStatus)" class="status"
@click.native="approvalFlowUpdate(activity)">
{{
activity.approvalStatus == 2 ?
'待审核' : activity.approvalStatus == 3 ? '通过' : activity.approvalStatus == 4 ? '拒绝' : '审核中'
}}
</el-button>
<div style="margin-bottom: 8px" v-if="activity.approvalStatus != 2">
审批意见<span>{{ activity.approvalOpinion }}</span>
</div>
<el-dialog title="编辑审批" :visible.sync="approvalFlowUpdateShow">
<el-form :model="approvalFlow">
<el-form-item label="审批意见" label-width="120px">
<el-input v-model="approvalFlow.approvalOpinion" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="审批结果" label-width="120px">
<el-select v-model="approvalFlow.approvalStatus" placeholder="请选择审批结果">
<el-option label="通过" value="3"></el-option>
<el-option label="驳回" value="4"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="approvalFlowUpdateShow = false"> </el-button>
<el-button type="primary" @click=submitApprovalFlow> </el-button>
</div>
</el-dialog>
</div>
</el-card>
<!-- 方案二 -->
<el-card v-else style="width: 85%" shadow="hover">
<div class="content">
<span><b>申请人</b>{{ activity.userName }}</span>
<span><b>申请标题</b>{{ activity.title }}</span>
<span><b>提交时间</b>{{ activity.createTime }}</span>
</div>
<hr color="#eee"/>
<div style="margin-top: 8px">
状态
<el-button type="text" size="small" :style="fontstyle(activity.approvalStatus)" class="status">
{{
activity.approvalStatus == 2 ? '待审核' : activity.approvalStatus == 3 ? '通过' : activity.approvalStatus == 4 ? '拒绝' : '审核中'
}}
</el-button>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</template>
<script>
import {getDetailList, submitApprovalFlow} from "@/api/basic/sysApprovalFlow";
export default {
name: "ApprovalFlow",
props: {
closeDialog: {
type: Function,
required: true,
},
idQuery: {
type: Object,
required: true,
},
isChang: {
type: Boolean,
required: true,
},
},
data() {
return {
approvalFlowUpdateShow: false,
query: {
approvalFlowId: ''
},
idQuery: {},
approvalFlow: {
id: "",
approvalOpinion: "",
approvalStatus: ""
},
activities: []
}
},
methods: {
submitApprovalFlow() {
this.approvalFlow.approvalOpinion = this.approvalFlow.approvalOpinion.trim()
submitApprovalFlow(this.approvalFlow)
.then((response) => {
if (response.code == 20000) {
this.$message.success("审批完成");
this.approvalFlowUpdateShow = false
this.approvalFlow = {}
this.getList();
} else {
this.$message.error(response.message);
}
})
.catch(() => {
});
},
approvalFlowUpdate(row) {
if (row.approvalStatus == 2){
this.approvalFlow.id = row.id
this.approvalFlowUpdateShow = !this.approvalFlowUpdateShow
}
},
//
colors(index) {
if (index == 3) {
return '#2a9c4a';
} else if (index == 4) {
return 'red';
}
},
getList() {
this.loading = true;
this.idQuery.approvalFlowId
getDetailList(this.idQuery.approvalFlowId)
.then((response) => {
this.activities = response.data || [];
})
.catch(() => {
});
}
},
computed: {
// agree
fontstyle() {
return (icontent) => {
if (icontent == '3') {
return {color: 'green'};
} else if (icontent == '4') {
return {color: 'red'};
} else {
return {color: 'blue'};
}
};
},
},
created() {
this.getList();
}
}
</script>
<style scoped lang="scss" rel="stylesheet/scss">
.content {
display: flex;
justify-content: space-between;
padding: 15px 0px;
span {
flex: 1;
}
}
</style>

@ -0,0 +1,162 @@
<template>
<div>
<el-card class="el-card">
<el-form :model="filterQuery" class="query-form" label-width="100px" v-if="showSearch">
<el-row>
<el-col :span="11">
<el-form-item label="单据标识">
<el-input v-model="filterQuery.type" style="width: 90%" placeholder="请输入单据标识" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="单据名称">
<el-input v-model="filterQuery.typeName" style="width: 90%" placeholder="请输入单据名称" clearable></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="top-right-btn">
<el-button-group style="display:flex;">
<el-button icon="el-icon-view" type="primary" @click="hideSearch">/</el-button>
<el-button type="primary" icon="el-icon-refresh" @click="onReset"></el-button>
<el-button type="primary" icon="el-icon-search" @click="onSubmitFind"></el-button>
<!-- <el-button type="primary" icon="el-icon-plus" @click="onAdd"></el-button>-->
</el-button-group>
</div>
<el-divider style="margin: 15px"></el-divider>
<el-table v-loading="loading" :data="list" style="width: 100%" border highlight-current-row>
<el-table-column label="序号" type="index" width="60"></el-table-column>
<el-table-column label="单据标识" prop="type"></el-table-column>
<el-table-column label="单据名称" prop="typeName"></el-table-column>
<el-table-column label="排序" prop="approvalSort"></el-table-column>
<el-table-column label="操作" width="120">
<template slot-scope="scope">
<el-button type="text" size="small" @click.native.stop="openEdit(scope.row)">审批过程
</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<el-dialog
title="审批过程"
:visible.sync="openEditVisible"
width="80%"
v-if="openEditVisible"
@close='closeDialog'
:close-on-click-modal="false"
:close-on-press-escape="false"
:before-close="handleClose"
>
<sysApprovalFlowConfigEdit
:closeDialog="closeDialog"
v-on:cancelDialog="getId"
:idQuery="idQuery"
></sysApprovalFlowConfigEdit>
</el-dialog>
</div>
</template>
<script>
import {getList} from "@/api/basic/sysApprovalFlowConfig";
import sysApprovalFlowConfigEdit from "@/views/basic/approval/sysApprovalFlowConfigEdit";
export default {
name: "SysApprovalFlowConfig",
data() {
return {
openEditVisible: false,
showSearch: true,
activities: [],
filterQuery: {
type: '',
typeName: '',
page: 1,
limit: 10
},
detailList: [],
list: [],
total: 0,
idQuery: {},
}
}
,
methods: {
getId(id) {
return
},
handleClose() {
this.openEditVisible = false
this.getList();
},
closeDialog() {
this.openEditVisible = false;
this.getList();
},
openEdit(row) {
this.idQuery.type = row.type;
this.idQuery.formData = row;
this.openEditVisible = true;
},
hideSearch() {
this.showSearch = !this.showSearch;
},
onSubmitFind() {
this.filterQuery.page = 1;
this.getList();
},
onReset() {
this.filterQuery = {
type: '',
typeName: '',
page: 1,
limit: 10
};
this.getList();
},
getList() {
this.loading = true;
getList(this.filterQuery).then((response) => {
if (response.code == 20000) {
this.list = response.data.list || [];
this.total = response.data.total || 0;
this.detailList = []
} else {
this.$message.error(response.message);
}
this.loading = false;
})
.catch(() => {
this.loading = false;
this.list = [];
this.total = 0;
});
}
}
,
computed: {
},
components: {
sysApprovalFlowConfigEdit
},
created() {
this.getList();
}
}
</script>
<style scoped lang="scss" rel="stylesheet/scss">
.content {
display: flex;
justify-content: space-between;
padding: 15px 0px;
span {
flex: 1;
}
}
</style>

@ -0,0 +1,259 @@
<template>
<div>
<el-form :model="formData" :rules="formRules" ref="dataForm" label-width="120px">
<el-card style="margin-top: -5px;">
<el-row>
<el-col :span="11">
<el-form-item label="单据标识:" prop="type">
<el-input v-model="formData.type" auto-complete="off" :disabled="true"></el-input>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="单据名称:" prop="typeName">
<el-input v-model="formData.typeName" auto-complete="off" :disabled="true"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-card>
</el-form>
<el-card>
<el-row type="flex" justify="end">
<el-button-group style="display: flex;margin-bottom: 15px; margin-right: 50px">
<el-button v-if="!addVisible " type="primary" @click.native="add()" round>新增节点</el-button>
<el-button v-if="addVisible " type="primary" @click.native="add()" round>取消新增节点</el-button>
</el-button-group>
</el-row>
<el-form :model="addformData" class="order-el-form" ref="dataForm" label-width="120px">
<el-row v-show="addVisible" type="flex">
<el-col :span="7">
<el-form-item prop="userName" label="审批人员:">
<el-select
v-model="addformData.approvalUserId"
filterable
remote
clearable
reserve-keyword
placeholder="请输入审批人员信息"
:remote-method="findMethod"
>
<el-option
v-for="item in userList"
:key="item.id"
:label="item.employeeName"
:value="item.id"
>
<span style="float: left">{{ item.employeeName }}</span>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item prop="approvalSort" label="审批顺序:">
<el-input-number
v-model="addformData.approvalSort"
auto-complete="off"
clearable
placeholder="请输入审批顺序" oninput="value=value.replace(/[^0-9.]/g,'')"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="2">
</el-col>
<el-col :span="6">
<el-button type="success" round @click.native="addConfigMx()">提交</el-button>
</el-col>
</el-row>
</el-form>
<!-- 时间线 -->
<div class="block" style="padding-top: 40px; padding-left: 200px">
<el-timeline>
<el-timeline-item v-for="(activity,index) in activities"
:key="index">
<el-card style="width: 85%" shadow="hover">
<div class="content">
<span><b>审批人</b>{{ activity.approvalUserName }}</span>
<span><b>审批顺序</b>{{ activity.approvalSort }}</span>
<span>
<!-- <el-button type='primary' icon='el-icon-edit' circle @click.native="edit()"></el-button>-->
<el-button type='danger' icon='el-icon-delete' circle @click.native="removeDetail(activity.id)"></el-button>
</span>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</el-card>
</div>
</template>
<script>
import {getConfigDetailList,addConfigDetail,removeDetail} from "@/api/basic/sysApprovalFlowConfig";
import {companyUserList} from "@/api/auth/authAdmin";
export default {
name: "sysApprovalFlowConfigEdit",
props: {
closeDialog: {
type: Function,
required: true,
},
idQuery: {
type: Object,
required: true,
},
isChang: {
type: Boolean,
required: true,
},
},
data() {
return {
input: '',
userList: [],
addVisible: false,
addformData: {
type: '',
approvalUserName: '',
approvalSort: '',
approvalUserId: '',
},
query: {
type: ''
},
innerQuery: {
userName: ''
},
formData: {
type: '',
typeName: ''
},
showSearch: true,
activities: [],
filterQuery: {
keyWords: '',
type: '',
typeName: '',
page: 1,
limit: 10
},
list: [],
total: 0,
idQuery: {},
}
},
methods: {
removeDetail(id){
removeDetail(id).then((response) => {
if (response.code !== 20000) {
this.$message.error(response.message);
return false
}
this.getList();
})
.catch(() => {
})
},
addConfigMx() {
const selectedItem = this.userList.find((item) => { // chargingWorkNameList
return item.id === this.addformData.approvalUserId
})
this.addformData.approvalUserName = selectedItem.employeeName
this.addformData.type = this.formData.type
addConfigDetail(this.addformData)
.then((response) => {
this.loading = false;
if (response.code !== 20000) {
this.$message.error(response.message);
return false
}
this.getList();
})
.catch(() => {
this.unitLoading = false;
this.userList = [];
})
this.add();
},
findMethod(query) {
this.fromOptions = [];
let cQuery = {
userName: query.trim()
};
companyUserList(cQuery)
.then((response) => {
this.loading = false;
if (response.code !== 20000) {
this.$message.error(response.message);
return false
}
this.userList = response.data || [];
this.unitLoading = false;
})
.catch(() => {
this.unitLoading = false;
this.userList = [];
})
},
selectMediaId(id) {
console.log(id, '选中的ID值')
const selectedItem = this.materialList.find((item) => { // chargingWorkNameList
return item.id === id
//
})
console.log(selectedItem, '当前选项的对象')
},
add() {
this.addVisible = !this.addVisible
},
getList() {
this.loading = true;
this.query.type = this.idQuery.type
getConfigDetailList(this.query) //
.then((response) => {
this.activities = response.data || [];
this.total = response.data.total || 0;
this.loading = false;
})
.catch(() => {
this.loading = false;
this.list = [];
this.total = 0;
});
}
},
watch: {
'searchcursom': {
handler: function () {
this.focusCustomer()
}
}
},
computed: {},
components: {
getConfigDetailList
},
created() {
this.formData = this.idQuery.formData;
this.getList();
}
}
</script>
<style scoped lang="scss" rel="stylesheet/scss">
.content {
display: flex;
justify-content: space-between;
padding: 15px 0px;
span {
flex: 1;
}
}
</style>
Loading…
Cancel
Save