factory_mp_old/pages/home/detail/ticketHandle.vue

1022 lines
25 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="ticket-handle">
<uni-nav-bar @clickLeft="goBack()" class="nav-bar" height="110rpx" leftWidth="200rpx" leftText="工单审批"
leftIcon="left" border backgroundColor="#2cade8" color="#fff" fixed statusBar shadow></uni-nav-bar>
<view class="ticket-info">
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">工单流水号</text>
</view>
<view class="form-right">
<view>{{ticketDetail.sn}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">工单名称</text>
</view>
<view class="form-right">
<view>{{ticketDetail.title}}</view>
</view>
</view>
<view class="form-item" @click="logView">
<view class="form-left">
<text class="form-left-text">工单状态</text>
</view>
<view class="form-right" style="color:blue">
<view v-if="ticketDetail.state">{{ticketDetail.state_.name}}</view>
</view>
</view>
</view>
<block v-if="cateType==='visit'">
<view class="ticket-info">
<view class="form-content ">
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访概述</text>
</view>
<view class="form-right">
<view style="color:blue" @click="goVisit">{{visitDetail.name }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访单位</text>
</view>
<view class="form-right">
<view>{{visitDetail.company }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访人数</text>
</view>
<view class="form-right">
<view>{{ visitDetail.count_people }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">状态</text>
</view>
<view class="form-right">
<view>{{state_[visitDetail.state] }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访时间</text>
</view>
<view class="form-right">
<view>{{visitDetail.visit_time}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">离开时间</text>
</view>
<view class="form-right">
<view>{{visitDetail.leave_time}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访事由</text>
</view>
<view class="form-right">
<view>{{purpose_[visitDetail.purpose] }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访详述</text>
</view>
<view class="form-right">
<view>{{visitDetail.description }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">接待人</text>
</view>
<view class="form-right">
<view>{{visitDetail.receptionist_name}}</view>
</view>
</view>
</view>
</view>
</block>
<block v-else-if="cateType==='rpj'">
<view class="ticket-info">
<view class="form-content ">
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">相关方</text>
</view>
<view class="form-right">
<view style="color:blue" @click="goRpj">{{rpjDetail.rparty_name }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">入厂项目</text>
</view>
<view class="form-right">
<view>{{rpjDetail.name }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">项目类型</text>
</view>
<view class="form-right">
<view>{{rpjType_[rpjDetail.type]}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">合同编号</text>
</view>
<view class="form-right">
<view>{{ rpjDetail.contract_number }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">状态</text>
</view>
<view class="form-right">
<view>{{state_[rpjDetail.state] }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">进厂时间</text>
</view>
<view class="form-right">
<view>{{rpjDetail.come_time}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">离厂时间</text>
</view>
<view class="form-right">
<view>{{rpjDetail.leave_time}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">所属部门</text>
</view>
<view class="form-right">
<view>{{rpjDetail.belong_dept_name }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">来访详述</text>
</view>
<view class="form-right">
<view>{{rpjDetail.description }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">接待人</text>
</view>
<view class="form-right">
<view>{{rpjDetail.receptionist_name}}</view>
</view>
</view>
</view>
</view>
</block>
<block v-else-if="cateType==='opl'">
<view class="ticket-info">
<view class="form-content ">
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">开始时间</text>
</view>
<view class="form-right form-date">
<view style="color:blue" @click="goOpl">{{oplDetail.start_time}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">结束时间</text>
</view>
<view class="form-right form-date">
<view>{{oplDetail.end_time}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">作业级别</text>
</view>
<view class="form-right">
<view>{{oplDetail.level}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">作业部门</text>
</view>
<view class="form-right">
<view v-if="oplDetail.dept_do_">{{oplDetail.dept_do_.name}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">作业负责人</text>
</view>
<view class="form-right">
<view v-if="oplDetail.charger_">{{oplDetail.charger_.name}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">作业监护人</text>
</view>
<view class="form-right">
<view v-if="oplDetail.monitor_">{{oplDetail.monitor_.name}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">风险分析</text>
</view>
<view class="form-right">
<text v-for="item in oplDetail.risks_checked_" :key="item.id">{{ item.name}}|</text>
</view>
</view>
<view class="form-item">
<view class="form-left">
<text class="form-left-text">控制措施</text>
</view>
<view class="form-right">
<text v-for="item in oplDetail.measures_checked_" :key="item.id">{{ item.name}}|</text>
</view>
</view>
</view>
</view>
<view class="ticket-info">
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">所属作业</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_" style="color:blue" @click="goOp">{{oplDetail.operation_.name}}
</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">具体地点</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{oplDetail.operation_.place}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">作业状态</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{state_[oplDetail.operation_.state]}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">生产状态</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{oplDetail.operation_.state_work }}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">作业区域</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{oplDetail.operation_.area_.name}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">业务部门</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{oplDetail.operation_.dept_bus_.name}}</view>
</view>
</view>
<view class="form-item border-bottom">
<view class="form-left">
<text class="form-left-text">属地部门</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{oplDetail.operation_.dept_ter_.name}}</view>
</view>
</view>
<view class="form-item ">
<view class="form-left">
<text class="form-left-text">部门协调员</text>
</view>
<view class="form-right">
<view v-if="oplDetail.operation_">{{oplDetail.operation_.coordinator_.name}}</view>
</view>
</view>
</view>
</block>
<block v-if="type=='handle'">
<view class="ticket-info">
<view class="form-item" v-if="ticketDetail.state_&&ticketDetail.state_.key==='opl_close'">
<view class="form-left-text" style="width: 100%;">
<text class="star">*</text>
<text>作业情况</text>
</view>
<uni-data-select v-model="form.close_note" :localdata="noteOption" label="选择关闭原因"></uni-data-select>
</view>
<view class="form-item" v-if="ticketDetail.state_&&ticketDetail.state_.key==='opl_close'">
<!-- <view class="form-left-text">
<text class="star">*</text>
<text>关闭处理</text>
</view> -->
<uni-data-select v-model="form.close_dos" :localdata="dosOption" label="关闭处理"></uni-data-select>
</view>
<view class="form-item" style="height: 300rpx;">
<view class="form-left-text">
<text class="star">*</text>
<text>审批意见</text>
</view>
<textarea class="apply-reason-text" v-model="form.name" maxlength="250" placeholder="请输入" />
</view>
<view class="btn" style="display: flex;justify-content: space-between;margin-top: 20rpx;">
<view class="left-content">
<button class="mini-btn" size="mini" type="primary" @click="addNode">加签</button>
<button class="mini-btn" size="mini"
v-if="ticketDetail.state_&&ticketDetail.state_.enable_deliver" type="primary" plain
@click="deliverNode">转交
</button>
</view>
<view class="right-time">
<button v-for="item in operationBtn" :key="item.id" class="mini-btn" size="mini"
:type="item.attribute_type===2?'warn':'primary'" @click="operationSubmit(item.id)"
style="margin-left:8upx">
{{item.name}}
</button>
</view>
</view>
</view>
</block>
<view class="dialogWrap" v-if="logDialog">
<view class="dialogCont">
<view class="dialogTitle">
<view>审批日志</view>
<view class="dialogCloseImg" @click="closeDialog"></view>
</view>
<scroll-view style="height: 300px;" scroll-y="true">
<uni-list>
<uni-list-item v-for="item in tLog" :key="item.id">
<text slot="body">
<view>{{item.state_.name}}</view>
<view style="color:gray;font-size: 28rpx;">
<span v-if="item.participant">{{item.participant_.name}}-</span>
<span v-if="item.transition_attribute==1" style="color:green">同意-</span>
<span v-if="item.transition_attribute==2" style="color:red">拒绝-</span>
<span>{{item.create_time}}</span>
</view>
</text>
</uni-list-item>
</uni-list>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
var that;
var promise;
export default {
name: "ticketHandle",
data() {
const currentDate = this.getDate({
format: true
})
return {
logDialog: false,
tLog: [],
form: {
suggestion: '',
close_note: '',
close_dos: ''
},
ticketId: null,
cateType: null,
operation: null,
projectId: null,
date: currentDate,
detail: false,
isDisabled: false,
btnShow: true,
ticketDetail: {},
visitDetail: {},
rpjDetail: {},
oplDetail: {},
opreationDetail: {},
operationBtn: {},
createTimeFromShow: false,
createTimeFromList: [],
createTimeFromCon: '',
depRange: [{
label: "name1",
id: 1
}, {
label: "name2",
id: 2
}],
range: [{
value: "运行",
text: "运行"
},
{
value: "停机",
text: "停机"
},
{
value: "检修",
text: "检修"
},
],
dataTree: [{
text: "曲阳金隅",
value: "1",
children: [{
text: "设计部",
value: "11",
children: [{
text: "设计一部",
value: "111"
},
{
text: "设计一部",
value: "112"
}
]
},
{
text: "12生产部",
value: "12"
}
]
}],
purpose_: {
10: "参观",
20: "拜访",
30: "面试",
40: "开会"
},
rpjType_: {
10: "建筑施工",
20: "设备设施检维修",
30: "保安保洁服务",
40: "其他",
},
state_: {
10: "创建中",
20: "审批中",
30: "待入厂",
40: "进行中",
50: "已完成",
},
noteOption: [{
value: 10,
text: '作业正常结束'
},
{
value: 20,
text: '因计划改变停止作业'
},
{
value: 30,
text: '因发生异常终止作业'
},
{
value: 40,
text: '其他'
},
],
dosOption: [],
}
},
computed: {
startDate() {
return this.getDate('start');
},
endDate() {
return this.getDate('end');
}
},
onLoad(params) {
debugger;
console.log(params)
that = this;
that.ticketId = params.ticketId;
that.projectId = params.projectId;
that.cateType = params.cateType;
that.type = params.type;
},
onShow() {
if (this.cateType === 'visit') {
this.getVisit();
} else if (this.cateType === 'rpj') {
this.getRpj();
} else if (this.cateType === 'opl') {
this.getOpl();
}
this.getticketItem();
this.getBtns();
},
methods: {
closeDialog() {
this.logDialog = false;
},
//日志详情
logView() {
this.$u.api.getTicketLog(this.ticketId).then((res) => {
this.logDialog = true;
this.tLog = res;
});
},
//工单详情
getticketItem() {
this.$u.api.getTicketItem(this.ticketId).then((res) => {
this.ticketDetail = res;
});
},
//访客详情
getVisit() {
debugger;
this.$u.api.visitItem(this.projectId).then(res => {
debugger;
this.visitDetail = res;
})
},
//入厂项目详情
getRpj() {
this.$u.api.rpjItem(this.projectId).then((res) => {
// debugger;
this.rpjDetail = res;
});
},
//许可证详情
getOpl() {
this.$u.api.oplItem(this.projectId).then((res) => {
// debugger;
this.oplDetail = res;
});
},
//获取应有的流转
getBtns() {
this.$u.api.getTicketTransitions(this.ticketId).then(res => {
this.operationBtn = res;
})
},
onnodeclick(e) {
console.log(e);
},
onpopupopened(e) {
console.log('popupopened');
},
onpopupclosed(e) {
console.log('popupclosed');
},
onchange(e) {
console.log('onchange:', e);
},
getDate(type) {
const date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
if (type === 'start') {
year = year - 60;
} else if (type === 'end') {
year = year + 2;
}
month = month > 9 ? month : '0' + month;
day = day > 9 ? day : '0' + day;
return `${year}-${month}-${day}`;
},
bindStartDateChange: function(e) {
this.formData.start_time = e.detail.value
},
bindEndDateChange: function(e) {
this.formData.end_time = e.detail.value
},
happenTimeFun(num) { //时间戳数据处理
let date = new Date(num);
//时间戳为10位需*1000时间戳为13位的话不需乘1000
let y = date.getFullYear();
let MM = date.getMonth() + 1;
MM = MM < 10 ? ('0' + MM) : MM; //月补0
let d = date.getDate();
d = d < 10 ? ('0' + d) : d; //天补0
let h = date.getHours();
h = h < 10 ? ('0' + h) : h; //小时补0
let m = date.getMinutes();
m = m < 10 ? ('0' + m) : m; //分钟补0
let s = date.getSeconds();
s = s < 10 ? ('0' + s) : s; //秒补0
//         return y + '-' + MM + '-' + d + ' ' + h + ':' + m+ ':' + s;
return y + '-' + MM + '-' + d;
},
createTimeToFn(e) {
that.formData.createTimeTo = e.year + '-' + e.month + '-' + e.day;
},
createTimeFromYesFn(e) {
console.log(e)
var index = e[0]
that.formData.createTimeFrom = that.createTimeFromList[index].id
that.createTimeFromCon = that.createTimeFromList[index].label
},
onSubmit(type) {
if (!this.paramsCheck()) return;
if (this.detail && !this.formData.id) {
uni.showToast({
title: '缺少pkid',
icon: "none"
})
return;
}
this._updatePrintList(this.formData, type);
},
publishChange(e) {
var i = e.detail.value;
that.publishRangeCon = that.publishRange[i].name;
that.formData.scopeOfPublication = that.publishRange[i].id;
},
goBack() {
uni.navigateBack({
delta: 1
})
},
//加签
addNode() {
const params = `?ticketId=${this.ticketId}&type=add`;
uni.navigateTo({
url: '../detail/addNode' + params,
})
},
deliverNode() {
let params = `?ticketId=${this.ticketId}&type=deliver`;
uni.navigateTo({
url: '../detail/addNode' + params,
})
},
operationSubmit(id) {
let params = new Object();
params.transition = id;
params.ticket_data = {};
params.suggestion = this.form.suggestion;
if (this.ticketDetail.state_.name === '作业负责人关闭') {
params.ticket_data.close_note = this.form.close_note;
params.ticket_data.close_dos = this.form.close_dos;
}
debugger;
uni.showLoading({
mask: true,
title: '正在提交...'
})
this.$u.api.ticketHandle(this.ticketId, params).then(res => {
uni.hideLoading()
uni.navigateBack()
}).catch(e => {
uni.hideLoading()
})
},
goOp() {
uni.navigateTo({
url: '/pages/workSpace/operation/operationDetail?operationId=' + this.oplDetail.operation
})
},
goOpl() {
uni.navigateTo({
url: '/pages/workSpace/operation/oplDetail?oplId=' + this.oplDetail.id
})
},
goVisit() {
uni.navigateTo({
url: '/pages/workSpace/visit/visitDetail?visit=' + that.projectId
})
},
goRpj() {
uni.navigateTo({
url: '/pages/workSpace/rpj/rpjDetail?rpjId=' + that.projectId
})
}
}
}
</script>
<style scoped>
.handleBtn {
height: 80rpx;
line-height: 80rpx;
font-size: 32rpx;
}
.ticket-handle {
background-color: #f3fbff;
padding-bottom: 227rpx;
}
/*
>>>.uni-status-bar {
height: 0 !important;
} */
>>>.uni-navbar-btn-text text {
font-size: 32rpx !important;
}
.ticket-info {
width: 720rpx;
margin: 0 auto;
background-color: #FFFFFF;
border-radius: 10rpx;
padding: 25rpx 32rpx;
box-sizing: border-box;
margin-top: 24rpx;
}
.border-bottom {
border-bottom: 1rpx solid #eeeeee;
}
.star {
color: red;
}
.top-title-text {
padding-left: 24rpx;
position: relative;
font-family: PingFang-SC-Medium;
font-size: 34rpx;
line-height: 72rpx;
color: #383838;
}
.top-title-text::before {
content: "";
width: 6rpx;
height: 29rpx;
background-image: linear-gradient(90deg, #164cc3 0%, #2c6fd9 100%);
border-radius: 3rpx;
display: block;
position: absolute;
left: -4rpx;
top: 22rpx;
}
.form-item {
/* display: flex; */
font-family: PingFang-SC-Medium;
font-size: 30rpx;
/* line-height: 97rpx; */
min-height: 100rpx;
display: flex;
flex-wrap: wrap;
align-items: center;
}
.form-left-text {
color: #212121;
margin-bottom: 33rpx;
}
.form-left {
/* min-width: 160rpx; */
/* width: 100%; */
}
.form-right {
margin-left: 20rpx;
flex: 1;
color: #414141;
}
.form-right input {
/* height: 100%; */
/* height: 60rpx; */
font-size: 30rpx;
}
.form-date>>>.uni-date__x-input {
height: 97rpx;
font-size: 30rpx;
}
.form-date>>>.uni-icons {
display: none;
}
.ticket-handle>>>uni-input {
/* height: 100%; */
font-size: 30rpx;
}
.apply-reason-text {
width: 653rpx;
height: 179rpx;
background-color: #f6f8fc;
border: solid 1rpx #e5e5e5;
margin-top: 21rpx;
padding: 14rpx 24rpx;
font-size: 26rpx;
box-sizing: border-box;
}
.apply_require {
margin-top: 0rpx !important;
}
.file-list {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding-top: 13rpx;
}
.file-wrap {
margin-top: 20rpx;
margin-right: 20rpx;
}
.file-item {
width: 155rpx;
height: 155rpx;
border: solid 1rpx #e5e5e5;
text-align: center;
display: flex;
align-items: center;
position: relative;
}
.file-content {
width: 100%;
}
.file-item .file-icon {
width: 37rpx;
height: 37rpx;
}
.file-item .file-name {
font-family: PingFang-SC-Regular;
font-size: 20rpx;
line-height: 17rpx;
color: #313131;
margin-top: 11rpx;
padding: 10rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.file-item>>>.uni-icons {
width: 26rpx;
height: 26rpx;
position: absolute;
right: -8rpx;
top: -22rpx;
/*
background-color: #d81e06;
border-radius: 50%;
font-size: 20rpx !important;
padding: 5rpx;
*/
box-sizing: border-box;
}
.form-right {
flex: 1;
color: #414141;
}
/*部门*/
uni-data-picker {
width: 100%;
border: none !important;
}
.my-data-picker>>>.input-value-border {
border: none !important;
}
>>>.input-value {
font-size: 30rpx !important;
;
}
.my-data-picker uni-data-picker {
width: 100% !important;
}
.my-data-picker {
width: 100%;
display: flex;
align-items: center;
margin-left: -10rpx;
}
/* 主体 */
>>>.uni-navbar__header,
>>>.uni-status-bar {
background-image: linear-gradient(90deg, #164cc3 0%, #2c6fd9 100%), linear-gradient(#e60012, #e60012) !important;
}
.title {
font-size: 14px;
font-weight: bold;
margin: 20px 0 5px 0;
}
.data-pickerview {
height: 400px;
border: 1px #e5e5e5 solid;
}
.popper__arrow {
top: -6px;
left: 50%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.popper__arrow {
top: -6px;
left: 50%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.dialogWrap {
position: fixed;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, .3);
top: 0;
left: 0;
z-index: 110;
}
.dialogCont {
width: 90vw;
position: absolute;
top: 50%;
margin: auto;
background-color: #ffffff;
left: 5vw;
transform: translateY(-50%);
padding: 20rpx;
border-radius: 20rpx;
}
.dialogTitle {
font-size: 36rpx;
padding-bottom: 20rpx;
border-bottom: 1px solid #eeeeee;
display: flex;
justify-content: space-between;
}
.dialogCloseImg {
width: 52rpx;
height: 52rpx;
background-image: url('../../../static/my/my_apply/zuofei.png');
background-repeat: no-repeat;
background-size: cover;
}
</style>