Commit e53a5c48 authored by renjintao's avatar renjintao

订单审批数据展示

parent 9ee8c772
......@@ -266,6 +266,7 @@ export default {
if (r.success) {
this.$Message.success('审批通过成功')
this.footerStatu = 3
this.$refs.userProcess.load(this.detailId)
} else {
this.$Message.error('审批通过失败')
}
......@@ -282,6 +283,7 @@ export default {
Api.reject(param).then((r) => {
if (r.success) {
this.$Message.success('驳回审批成功')
this.$refs.userProcess.load(this.detailId)
this.footerStatu = 3
} else {
this.$Message.error('加载失败')
......@@ -298,6 +300,7 @@ export default {
Api.terminate(param).then((r) => {
if (r.success) {
this.$Message.success('终止审批成功')
this.$refs.userProcess.load(this.detailId)
this.footerStatu = 3
} else {
this.$Message.error('加载失败')
......
<template>
<div style="padding:30px 0">
<div style="padding:30px 0">
<Detail :idVal="detailId" />
<Process ref="userProcess" :idVal="detailId" />
<div class="footers" v-if="footerStatu === '2'" style="text-align:left;">
<Form
:model="formMyCheck"
:label-width="100"
:rules="ruleValidate"
inline
ref="formValidate"
>
<Row>
<Col span="18">
<FormItem label="审批意见:">
<RadioGroup v-model="formMyCheck.radioSp" style="width:200px">
<Radio label="通过"></Radio>
<Radio label="驳回"></Radio>
<Radio label="终止"></Radio>
</RadioGroup>
</FormItem>
<FormItem
label="驳回节点:"
v-if="formMyCheck.radioSp === '驳回'"
prop="rejectToNodeId"
>
<Select
style="width:200px"
clearable
transfer
placeholder="请选择驳回节点"
v-model="formMyCheck.rejectToNodeId"
>
<Option value class="option-text">请选择驳回节点</Option>
<Option
v-for="(item, index) in nodeList"
:value="item.value"
:label="item.label"
:key="index"
:disabled="item.statu > 0 ? false : true"
></Option>
</Select>
<RadioGroup type="button" size="small" @on-change="changeToNode">
<Radio label="1">上一节点</Radio>
<Radio label="2">第一节点</Radio>
</RadioGroup>
</FormItem>
<FormItem
label="原因:"
v-if="
<Form :model="formMyCheck" :label-width="100" :rules="ruleValidate" inline ref="formValidate">
<Row>
<Col span="18">
<FormItem label="审批意见:">
<RadioGroup v-model="formMyCheck.radioSp" style="width:200px">
<Radio label="通过"></Radio>
<Radio label="驳回"></Radio>
<Radio label="终止"></Radio>
</RadioGroup>
</FormItem>
<FormItem label="驳回节点:" v-if="formMyCheck.radioSp === '驳回'" prop="rejectToNodeId">
<Select style="width:200px" clearable transfer placeholder="请选择驳回节点" v-model="formMyCheck.rejectToNodeId">
<Option value class="option-text">请选择驳回节点</Option>
<Option v-for="(item, index) in nodeList" :value="item.value" :label="item.label" :key="index" :disabled="item.statu > 0 ? false : true"></Option>
</Select>
<RadioGroup type="button" size="small" @on-change="changeToNode">
<Radio label="1">上一节点</Radio>
<Radio label="2">第一节点</Radio>
</RadioGroup>
</FormItem>
<FormItem label="原因:" v-if="
formMyCheck.radioSp === '驳回' || formMyCheck.radioSp === '终止'
"
prop="comment"
>
<Input
v-model="formMyCheck.comment"
style="width:400px;margin-left:10px"
placeholder="请输入原因"
/>
</FormItem>
</Col>
<Col span="6" style="text-align:right;padding-right:40px">
<Button type="primary" @click="nextCheckOk">下一步</Button>
</Col>
</Row>
</Form>
" prop="comment">
<Input v-model="formMyCheck.comment" style="width:400px;margin-left:10px" placeholder="请输入原因" />
</FormItem>
</Col>
<Col span="6" style="text-align:right;padding-right:40px">
<Button type="primary" @click="nextCheckOk">下一步</Button>
</Col>
</Row>
</Form>
</div>
<Modal
v-model="modalCheckNo"
title="订单审批"
width="800"
:scrollable="true"
>
<br />
<h4>
您确定 <span class="new-red">{{ statuTitle }}</span> 此订单审批?
</h4>
<br />
<div slot="footer">
<Button @click="modalCheckNo = false">取消</Button>
<Button type="primary" @click="checkFalse">确定</Button>
</div>
<Modal v-model="modalCheckNo" title="订单审批" width="800" :scrollable="true">
<br />
<h4>
您确定 <span class="new-red">{{ statuTitle }}</span> 此订单审批?
</h4>
<br />
<div slot="footer">
<Button @click="modalCheckNo = false">取消</Button>
<Button type="primary" @click="checkFalse">确定</Button>
</div>
</Modal>
</div>
</div>
</template>
<script>
import Api from '../api'
import Detail from './detail'
import Process from '../process'
export default {
layout: 'empty',
name: 'Index',
components: {
Detail,
Process
},
data() {
return {
currentUserId: 0,
formMyCheck: {
radioSp: '通过',
comment: '',
workHours: 0, //工时
printPeriod: 0, //打印周期
equipment: '', //设备
materialWeight: 0, //材料重量
rejectToNodeId: null
},
modalCheckNo: false,
detailId: null,
statuTitle: '',
footerStatu: null, //是否显示footer
getDetailResults: [], //getdetail返回数据
getDetailResultOrder: [], //getdetail返回订单detail数据
getDetailProcess: [], //getdetail返回process信息
getDetailRecords: [], //getdetail返回当前records信息
passId: null, //通过审批/驳回/终止接口 id,
nodeList: [], //返回节点
currentNodeID: null, //当前节点
firstNodeID: null, //第一个节点
preNodeID: null, //上一个节点
nextNodeUserIdList: [], //通过时提交的下一个节点UserId
ruleValidate: {
rejectToNodeId: [
{
required: true,
message: '请选择驳回节点',
type: 'number',
trigger: 'change'
}
],
comment: [
{
required: true,
message: '请输入原因',
trigger: 'blur'
}
]
}
}
},
props: {},
async fetch({ store, params }) {
await store.dispatch('loadDictionary') // 加载数据字典
},
created() {
this.currentUserId=this.$store.state.userInfo.userId
this.detailId = this.$http.common.getquerystring('id')
this.footerStatu = this.$http.common.getquerystring('statu')
this.getDetailInfos(this.detailId)
},
methods: {
nextCheckOk() {
if (this.formMyCheck.radioSp == '通过') {
this.modalCheckNo = true
this.statuTitle = '通过'
} else if (this.formMyCheck.radioSp == '驳回') {
this.$refs['formValidate'].validate((valid) => {
if (valid) {
this.modalCheckNo = true
this.statuTitle = '驳回'
} else {
}
})
} else {
this.$refs['formValidate'].validate((valid) => {
if (valid) {
this.modalCheckNo = true
this.statuTitle = '终止'
} else {
}
})
}
layout: 'empty',
name: 'Index',
components: {
Detail,
Process
},
getDetailInfos(idVal) {
this.getDetailRecords = []
let param = {
Id: idVal
}
Api.getdetail(param).then((r) => {
if (r.success) {
this.currentNodeID = r.result.currentNodeId
this.passId=r.result.currentRecordId
this.nextNodeUserIdList=this.$refs.userProcess.immutData//获取下一节点的审核人
this.getNodes(r.result.nodes)
} else {
this.$Message.error('加载失败')
data() {
return {
currentUserId: 0,
formMyCheck: {
radioSp: '通过',
comment: '',
workHours: 0, //工时
printPeriod: 0, //打印周期
equipment: '', //设备
materialWeight: 0, //材料重量
rejectToNodeId: null
},
modalCheckNo: false,
detailId: null,
statuTitle: '',
footerStatu: null, //是否显示footer
getDetailResults: [], //getdetail返回数据
getDetailResultOrder: [], //getdetail返回订单detail数据
getDetailProcess: [], //getdetail返回process信息
getDetailRecords: [], //getdetail返回当前records信息
passId: null, //通过审批/驳回/终止接口 id,
nodeList: [], //返回节点
currentNodeID: null, //当前节点
firstNodeID: null, //第一个节点
preNodeID: null, //上一个节点
nextNodeUserIdList: [], //通过时提交的下一个节点UserId
ruleValidate: {
rejectToNodeId: [{
required: true,
message: '请选择驳回节点',
type: 'number',
trigger: 'change'
}],
comment: [{
required: true,
message: '请输入原因',
trigger: 'blur'
}]
}
}
})
},
//获取流程节点
getNodes(nodes) {
this.nodeList = []
nodes.forEach((data) => {
let nodeObj = {}
nodeObj.value = data.id
nodeObj.label = data.name
nodeObj.statu = 1
this.nodeList.push(nodeObj)
})
//第一节点node的ID
this.firstNodeID = this.nodeList[0].value
//根据当前nodeid找到上一节点的nodeId
var index = this.nodeList.findIndex(
(item) => item.value == this.currentNodeID
)
if (index > 0) {
this.preNodeID = this.nodeList[index - 1].value
} else {
this.preNodeID = this.nodeList[0].value
}
},
changeToNode(val) {
if (val == '1') {
this.formMyCheck.rejectToNodeId = this.preNodeID
} else {
this.formMyCheck.rejectToNodeId = this.firstNodeID
}
props: {},
async fetch({
store,
params
}) {
await store.dispatch('loadDictionary') // 加载数据字典
},
//审批通过
checkOk() {
let param = {
id: this.passId,
comment: this.formMyCheck.comment,
nextOperationIdList: this.nextNodeUserIdList,
data: {}
}
Api.pass(param).then((r) => {
if (r.success) {
this.$Message.success('审批通过成功')
this.footerStatu=3
} else {
this.$Message.error('审批通过失败')
}
})
this.modalCheckNo = false
this.footerStatu=3
created() {
this.currentUserId = this.$store.state.userInfo.userId
this.detailId = this.$http.common.getquerystring('id')
this.footerStatu = this.$http.common.getquerystring('statu')
this.getDetailInfos(this.detailId)
},
//审批驳回
checkNo() {
let param = {
id: this.passId,
comment: this.formMyCheck.comment,
rejectToNodeId: this.formMyCheck.rejectToNodeId
}
// alert(JSON.stringify(param))
Api.reject(param).then((r) => {
if (r.success) {
this.$Message.success('驳回审批成功')
this.footerStatu=3
} else {
this.$Message.error('加载失败')
}
})
this.modalCheckNo = false
},
//审批终止
checkCancel() {
let param = {
id: this.passId,
comment: this.formMyCheck.comment
}
//alert(JSON.stringify(param))
Api.terminate(param).then((r) => {
if (r.success) {
this.$Message.success('终止审批成功')
this.footerStatu=3
} else {
this.$Message.error('加载失败')
methods: {
nextCheckOk() {
if (this.formMyCheck.radioSp == '通过') {
this.modalCheckNo = true
this.statuTitle = '通过'
} else if (this.formMyCheck.radioSp == '驳回') {
this.$refs['formValidate'].validate((valid) => {
if (valid) {
this.modalCheckNo = true
this.statuTitle = '驳回'
} else {}
})
} else {
this.$refs['formValidate'].validate((valid) => {
if (valid) {
this.modalCheckNo = true
this.statuTitle = '终止'
} else {}
})
}
},
getDetailInfos(idVal) {
this.getDetailRecords = []
let param = {
Id: idVal
}
Api.getdetail(param).then((r) => {
if (r.success) {
this.currentNodeID = r.result.currentNodeId
this.passId = r.result.currentRecordId
this.nextNodeUserIdList = this.$refs.userProcess.immutData //获取下一节点的审核人
this.getNodes(r.result.nodes)
} else {
this.$Message.error('加载失败')
}
})
},
//获取流程节点
getNodes(nodes) {
this.nodeList = []
nodes.forEach((data) => {
let nodeObj = {}
nodeObj.value = data.id
nodeObj.label = data.name
nodeObj.statu = 1
this.nodeList.push(nodeObj)
})
//第一节点node的ID
this.firstNodeID = this.nodeList[0].value
//根据当前nodeid找到上一节点的nodeId
var index = this.nodeList.findIndex(
(item) => item.value == this.currentNodeID
)
if (index > 0) {
this.preNodeID = this.nodeList[index - 1].value
} else {
this.preNodeID = this.nodeList[0].value
}
},
changeToNode(val) {
if (val == '1') {
this.formMyCheck.rejectToNodeId = this.preNodeID
} else {
this.formMyCheck.rejectToNodeId = this.firstNodeID
}
},
//审批通过
checkOk() {
let param = {
id: this.passId,
comment: this.formMyCheck.comment,
nextOperationIdList: this.nextNodeUserIdList,
data: {}
}
Api.pass(param).then((r) => {
if (r.success) {
this.$Message.success('审批通过成功')
this.footerStatu = 3
} else {
this.$Message.error('审批通过失败')
}
})
this.modalCheckNo = false
this.footerStatu = 3
},
//审批驳回
checkNo() {
let param = {
id: this.passId,
comment: this.formMyCheck.comment,
rejectToNodeId: this.formMyCheck.rejectToNodeId
}
// alert(JSON.stringify(param))
Api.reject(param).then((r) => {
if (r.success) {
this.$Message.success('驳回审批成功')
this.footerStatu = 3
} else {
this.$Message.error('加载失败')
}
})
this.modalCheckNo = false
},
//审批终止
checkCancel() {
let param = {
id: this.passId,
comment: this.formMyCheck.comment
}
//alert(JSON.stringify(param))
Api.terminate(param).then((r) => {
if (r.success) {
this.$Message.success('终止审批成功')
this.footerStatu = 3
} else {
this.$Message.error('加载失败')
}
})
this.modalCheckNo = false
},
//终止或驳回
checkFalse() {
if (this.formMyCheck.radioSp == '通过') {
this.checkOk()
} else if (this.formMyCheck.radioSp == '驳回') {
this.checkNo()
} else if (this.formMyCheck.radioSp == '终止') {
this.checkCancel()
}
},
l(key) {
key = 'MaterialPlacode' + '.' + key
return this.$t(key)
}
})
this.modalCheckNo = false
},
//终止或驳回
checkFalse() {
if (this.formMyCheck.radioSp == '通过') {
this.checkOk()
} else if (this.formMyCheck.radioSp == '驳回') {
this.checkNo()
} else if (this.formMyCheck.radioSp == '终止') {
this.checkCancel()
}
},
l(key) {
key = 'MaterialPlacode' + '.' + key
return this.$t(key)
}
},
watch: {}
watch: {}
}
</script>
<style lang="less" scope>
<style lang="less">
@import "./shen.less";
</style>
<template>
<div class="Design">
<div class="Design">
<h3>{{ processTitle }}</h3>
<Divider />
<Timeline>
<TimelineItem v-for="(item, index) in dataImmut" :key="index">
<Badge :count="index + 1" slot="dot" :type="type(index)"></Badge>
<p class="title">
<state code="workflow.record.status" :value="item.status" type="tag" />
{{ item.name }} &nbsp;(
<state code="workflow.form.audit.type" :value="item.operation" />)
<Icon v-if="item.isFixed" title="固定" type="ios-lock" />
</p>
<div class="content">
<!-- <div class="records" v-if="index==cur">
<TimelineItem v-for="(item, index) in dataImmut" :key="index">
<Badge :count="index + 1" slot="dot" :type="type(index)"></Badge>
<p class="title">
<state code="workflow.record.status" :value="item.status" type="tag" />
{{ item.name }} &nbsp;(
<state code="workflow.form.audit.type" :value="item.operation" />)
<Icon v-if="item.isFixed" title="固定" type="ios-lock" />
</p>
<div class="content">
<!-- <div class="records" v-if="index==cur">
<span>审批人:</span>
<User
v-for="(item3, index3) in item.records"
......@@ -24,186 +24,189 @@
class="mr5"
/>
</div> -->
<div v-if="index>cur">
<CheckboxGroup v-model="immutData">
<span>审批人:</span>
<Checkbox
v-for="(item1, index1) in item.defaultUsers.immutable"
:key="index1"
:label="item1"
:disabled="item.isFixed"
>
<User :value="item1" style="margin-right:5px;" />
</Checkbox>
</CheckboxGroup>
</div>
<div class="wait" v-else>
<span>审批人:</span>
<User
v-for="(item2, index2) in item.defaultUsers.immutable"
:key="index2"
:value="item2"
class="mr5"
/>
</div>
<div style="width:98%" v-if="com(item.records).length>0">
<!-- <Table :columns="columns" border size="small" width="90%" :data="com(item.records)"></Table> -->
<p class="shen_row" v-for="(item3, index3) in item.records" :key="index3" :value="item3">
<User class="user_span" :value="item3.operatorId"/>
<span class="plr row_time">{{item3.operationTime}}</span>
<state code="workflow.record.status" class="row_statu" :value="item3.status" type="text"></state>
<span class="plr remark" v-if="item3.remark">{{item3.remark}}</span>
<a class="plr row_ditill" v-if="item3.contextData" @click="edit(item3)">详情</a>
<!-- <span>{{item3.contextData}}</span> -->
</p>
</div>
</div>
</TimelineItem>
<div v-if="index>cur">
<CheckboxGroup v-model="immutData">
<span>审批人:</span>
<Checkbox v-for="(item1, index1) in item.defaultUsers.immutable" :key="index1" :label="item1" :disabled="item.isFixed">
<User :value="item1" style="margin-right:5px;" />
</Checkbox>
</CheckboxGroup>
</div>
<div class="wait" v-else>
<span>审批人:</span>
<User v-for="(item2, index2) in item.defaultUsers.immutable" :key="index2" :value="item2" class="mr5" />
</div>
<div style="width:98%" v-if="com(item.records).length>0">
<!-- <Table :columns="columns" border size="small" width="90%" :data="com(item.records)"></Table> -->
<p class="shen_row" v-for="(item3, index3) in item.records" :key="index3" :value="item3">
<User class="user_span" :value="item3.operatorId" />
<span class="plr row_time">{{item3.operationTime}}</span>
<state code="workflow.record.status" class="row_statu" :value="item3.status" type="text"></state>
<span class="plr remark" v-if="item3.remark">{{item3.remark}}</span>
<a class="plr row_ditill" v-if="item3.contextData" @click="edit(item3)">详情</a>
<!-- <span>{{item3.contextData}}</span> -->
</p>
</div>
</div>
</TimelineItem>
</Timeline>
</div>
</div>
</template>
<script>
import Api from './api'
export default {
name: 'process',
components: {},
async fetch({ store, params }) {
await store.dispatch('loadDictionary') // 加载数据字典
},
data() {
return {
currentUserId: 0,
processTitle: '审批流程',
currentNodeId: null,
dataImmut: [],
creatRows: [],
cur: 0,
columns: [
{
key: 'status',
title: '结果',
align: 'left',
width: 100,
render: (h, params) => {
return h('state', {
attrs: {
value: params.row.status,
code: 'workflow.record.status'
}
name: 'process',
components: {},
async fetch({
store,
params
}) {
await store.dispatch('loadDictionary') // 加载数据字典
},
data() {
return {
currentUserId: 0,
processTitle: '审批流程',
currentNodeId: null,
dataImmut: [],
creatRows: [],
cur: 0,
columns: [{
key: 'status',
title: '结果',
align: 'left',
width: 100,
render: (h, params) => {
return h('state', {
attrs: {
value: params.row.status,
code: 'workflow.record.status'
}
})
}
},
{
key: 'operatorId',
title: '操作人',
align: 'left',
width: 100,
easy: true,
high: true,
render: (h, params) => {
return h('User', {
attrs: {
value: params.row.operatorId
}
})
}
},
{
title: '时间',
key: 'operationTime',
width: 200,
align: 'center'
},
{
title: '备注',
key: 'remark',
align: 'center'
},
{
key: 'contextData',
title: '详细',
width: 100,
align: 'left',
render: (h, params) => {
if (params.row.contextData.length > 2)
return h(
'a', {
on: {
click: () => this.edit(params.row)
}
},
'详情'
)
return h('span', '')
}
}
],
dataMut: [],
immutData: [],
schemaId: ''
}
},
props: {
idVal: {
type: String,
default: ''
}
},
created() {
this.currentUserId = this.$store.state.userInfo.userId
this.dataImmut = []
this.dataMut = []
this.load(this.idVal)
},
methods: {
load(v) {
Api.getdetail({
Id: v
}).then((r) => {
if (r.success) {
this.dataImmut = r.result.nodes
this.currentNodeId = r.result.currentNodeId
let idUser = []
r.result.nodes.map((u, i) => {
//查找当前节点索引
if (u.id == this.currentNodeId) {
this.cur = i
};
// if(u.defaultUsers.mutable&&u.defaultUsers.mutable.length>0){
// u.defaultUsers.immutable=u.defaultUsers.immutable.concat(u.defaultUsers.mutable)
u.defaultUsers.immutable = u.defaultUsers.immutable || (u.defaultUsers.mutable) //审核人员bug
// }
})
if (this.dataImmut.length > this.cur + 1) {
// console.log("this.dataImmut[this.cur + 1]:",this.dataImmut[this.cur + 1],this.cur,this.dataImmut.length )
this.immutData = this.dataImmut[this.cur + 1].defaultUsers.immutable || (this.dataImmut[this.cur + 1].defaultUsers.mutable) //审核人员bug
}
} else {
this.$Message.error('加载失败')
}
})
}
},
{
key: 'operatorId',
title: '操作人',
align: 'left',
width: 100,
easy: true,
high: true,
render: (h, params) => {
return h('User', { attrs: { value: params.row.operatorId } })
}
type(i) {
if (i < this.cur) {
return 'primary'
} else if (i == this.cur) {
return 'info'
} else if (i == this.cur + 1) {
return 'warning'
} else {
return 'normal'
}
},
{
title: '时间',
key: 'operationTime',
width: 200,
align: 'center'
edit(record) {
// alert(record.id)
this.$emit('node-click', record)
console.log(record)
},
{
title: '备注',
key: 'remark',
align: 'center'
com(items) {
if (items)
return items.filter((u) => {
return [2, 3, 5, 6].indexOf(u.status) > -1
})
else
return [];
},
{
key: 'contextData',
title: '详细',
width: 100,
align: 'left',
render: (h, params) => {
if (params.row.contextData.length > 2)
return h(
'a',
{ on: { click: () => this.edit(params.row) } },
'详情'
)
return h('span', '')
}
l(key) {
key = 'orderInfo' + '.' + key
return this.$t(key)
}
],
dataMut: [],
immutData: [],
schemaId: ''
}
},
props: {
idVal: {
type: String,
default: ''
}
},
created() {
this.currentUserId=this.$store.state.userInfo.userId
this.dataImmut = []
this.dataMut = []
Api.getdetail({ Id: this.idVal }).then((r) => {
if (r.success) {
this.dataImmut = r.result.nodes
this.currentNodeId = r.result.currentNodeId
let idUser = []
r.result.nodes.map((u, i) => {
//查找当前节点索引
if (u.id == this.currentNodeId) {
this.cur = i
};
// if(u.defaultUsers.mutable&&u.defaultUsers.mutable.length>0){
// u.defaultUsers.immutable=u.defaultUsers.immutable.concat(u.defaultUsers.mutable)
u.defaultUsers.immutable=u.defaultUsers.immutable||(u.defaultUsers.mutable)//审核人员bug
// }
})
if (this.dataImmut.length > this.cur + 1) {
// console.log("this.dataImmut[this.cur + 1]:",this.dataImmut[this.cur + 1],this.cur,this.dataImmut.length )
this.immutData = this.dataImmut[this.cur + 1].defaultUsers.immutable||(this.dataImmut[this.cur + 1].defaultUsers.mutable)//审核人员bug
}
} else {
this.$Message.error('加载失败')
}
})
},
methods: {
load(v) {},
type(i) {
if (i < this.cur) {
return 'primary'
} else if (i == this.cur) {
return 'info'
} else if (i == this.cur + 1) {
return 'warning'
} else {
return 'normal'
}
},
edit(record) {
// alert(record.id)
this.$emit('node-click', record)
console.log(record)
},
com(items) {
if(items)
return items.filter((u) => {
return [2, 3, 5, 6].indexOf(u.status) > -1
})
else
return [];
},
l(key) {
key = 'orderInfo' + '.' + key
return this.$t(key)
}
},
computed: {},
watch: {}
computed: {},
watch: {}
}
</script>
\ No newline at end of file
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment