369 lines
9.2 KiB
Vue
369 lines
9.2 KiB
Vue
<template>
|
||
<view class="content">
|
||
<statusNav returnColor="#c2c2c2" navBarTitle="审核工单"></statusNav>
|
||
<container-subgroup-two>
|
||
<view slot="content" style="margin: 0 -30rpx;" class="bacf">
|
||
<view class="work-order-audit">
|
||
<view class="item disac">
|
||
<view class="title">工单编号：</view>
|
||
<input type="text" disabled class="input" :value="auditData.order_number" />
|
||
</view>
|
||
<view class="item disac">
|
||
<view class="title">项目名称：</view>
|
||
<input type="text" disabled class="input input-black" :value="auditData.project_name" />
|
||
</view>
|
||
<view class="item disac">
|
||
<view class="title">客户名称：</view>
|
||
<input type="text" disabled class="input input-black" :value="auditData.member_name" />
|
||
</view>
|
||
<view class="item">
|
||
<view class="son disac">
|
||
<view class="title">结算方式：</view>
|
||
<input type="text" disabled class="input" :value="auditData.settlement_type" />
|
||
</view>
|
||
<view class="son disac">
|
||
<view class="title">支付方式：</view>
|
||
<input type="text" disabled class="input" :value="auditData.pay_type" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="work-order-cost">
|
||
<view class="list">
|
||
<view class="item disac">
|
||
<view class="title">上门费</view>
|
||
<input type="text" disabled class="input" :value="auditData.artificial_price" />
|
||
</view>
|
||
<view class="item disac">
|
||
<view class="title">税金</view>
|
||
<input type="text" disabled class="input" :value="auditData.tax_price" />
|
||
</view>
|
||
<view class="item disac">
|
||
<view class="title">材料费</view>
|
||
<input type="text" disabled class="input" :value="auditData.material_price" />
|
||
</view>
|
||
<view class="item disac">
|
||
<view class="title">其他费用</view>
|
||
<input type="text" disabled class="input" :value="auditData.other_price" />
|
||
</view>
|
||
</view>
|
||
<view class="item item-center">实际付款：<view class="title-price">￥{{auditData.pay_price}}</view></view>
|
||
<view class="item">
|
||
<view class="title">是否开票</view>
|
||
<view class="btns btns-invoicing">
|
||
<view class="input-radio">
|
||
<view :class="auditData.invoice_type==1?'checked btn':'btn'">
|
||
<image class="img" src="../../static/iocn/icon-yes.png" mode="aspectFill" ></image>
|
||
</view>
|
||
是
|
||
</view>
|
||
<view class="input-radio">
|
||
<view :class="auditData.invoice_type==0?'checked btn':'btn'">
|
||
<image class="img" src="../../static/iocn/icon-yes.png" mode="aspectFill"></image>
|
||
</view>
|
||
否
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="item">
|
||
<view class="title">是否收款</view>
|
||
<view class="btns btns-collection">
|
||
<view class="input-radio">
|
||
<view :class="auditData.is_collection==1?'checked btn':'btn'">
|
||
<image class="img" src="../../static/iocn/icon-yes.png" mode="aspectFill" ></image>
|
||
</view>
|
||
是
|
||
</view>
|
||
<view class="input-radio">
|
||
<view :class="auditData.is_collection==0?'checked btn':'btn'">
|
||
<image class="img" src="../../static/iocn/icon-yes.png" mode="aspectFill"></image>
|
||
</view>
|
||
否
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="item">
|
||
<view class="title disac">提交时间：</view>
|
||
<input type="text" disabled class="input" :value="setTime" />
|
||
</view>
|
||
<view class="item item-textarea">
|
||
<view class="title">备注内容：</view>
|
||
<textarea name="msg" v-model="remarksMsg" cols="30" rows="10" placeholder="请输入备注内容"></textarea>
|
||
</view>
|
||
</view>
|
||
<view class="form-btns">
|
||
<view class="btn" @tap="setFormEv(1)">审核通过</view>
|
||
<view class="btn" @tap="setFormEv(0)">审核不通过</view>
|
||
</view>
|
||
</view>
|
||
</container-subgroup-two>
|
||
<!-- 底部tab -->
|
||
<foot-tab></foot-tab>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||
import statusNav from '../../components/status-nav.vue';
|
||
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
|
||
import {
|
||
handleWorkOrderGet
|
||
} from '../../jsFile/public-api.js';
|
||
export default {
|
||
components: {
|
||
'foot-tab' :footTabOne,
|
||
statusNav,
|
||
containerSubgroupTwo
|
||
},
|
||
data() {
|
||
return {
|
||
remarksMsg:'', //备注信息
|
||
auditData:[], //工单展示数据
|
||
setTime:'', //提交时间
|
||
type: 0, //接口状态
|
||
}
|
||
},
|
||
mounted() {
|
||
|
||
},
|
||
onLoad(op) {
|
||
if (op.orderId != undefined) {
|
||
this.orderId = op.orderId;
|
||
// 调取获取工单详情事件
|
||
this.getDetail();
|
||
}
|
||
},
|
||
methods: {
|
||
// 获取当前时间
|
||
getDate() {
|
||
const date = new Date();
|
||
let year = date.getFullYear();
|
||
let month = date.getMonth() + 1;
|
||
let day = date.getDate();
|
||
let hour = date.getHours();
|
||
let minute = date.getMinutes();
|
||
|
||
month = month > 9 ? month : '0' + month;
|
||
day = day > 9 ? day : '0' + day;
|
||
this.setTime = `${year}-${month}-${day} ${hour}:${minute}`
|
||
},
|
||
// 获取工单详情
|
||
getDetail() {
|
||
let params = {
|
||
order_id: this.orderId,
|
||
}
|
||
this.$requst.get('/universal/api.order/audit', params).then(res => {
|
||
console.log('查询接口')
|
||
if (res.code) {
|
||
this.auditData = res.data;
|
||
this.getDate();
|
||
}
|
||
})
|
||
},
|
||
// 提交审核结果
|
||
setFormEv(audit) {
|
||
if(this.checkEmpty()){
|
||
// 提交审核结果
|
||
let params = {
|
||
order_id: this.orderId,
|
||
is_audit: audit,
|
||
settlement_remark: this.remarksMsg
|
||
}
|
||
this.$requst.post('/universal/api.order/audit', params).then(res => {
|
||
if (res.code == 0) {
|
||
this.$toolAll.tools.showToast('提交成功');
|
||
setTimeout(()=>{
|
||
uni.navigateBack({
|
||
delta:1
|
||
})
|
||
// uni.navigateTo({
|
||
// url:`/pagesA/workOrder/workOrderLlsit?status='待审批'&statusId=6`
|
||
// })
|
||
},500)
|
||
}
|
||
})
|
||
}
|
||
},
|
||
// 判空事件
|
||
checkEmpty(){
|
||
let result = false;
|
||
if(this.remarksMsg == '') {
|
||
this.$toolAll.tools.showToast('请填写备注信息');
|
||
} else {
|
||
result = true;
|
||
}
|
||
return result;
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.work-order-audit {
|
||
margin-top: -10rpx;
|
||
background-color: #FFFFFF;
|
||
}
|
||
|
||
.work-order-audit .item {
|
||
display: flex;
|
||
padding: 20rpx 40rpx;
|
||
border-bottom: 2rpx solid #ececec;
|
||
}
|
||
|
||
.work-order-audit .item .title {
|
||
width: 150rpx;
|
||
font-size: 28rpx;
|
||
white-space: nowrap;
|
||
/* flex: 1; */
|
||
}
|
||
|
||
.work-order-audit .item .input {
|
||
width: calc(100% - 150rpx);
|
||
font-size: 27rpx;
|
||
color: #8b8b8b;
|
||
padding-left: 0;
|
||
}
|
||
|
||
.work-order-audit .item .son{
|
||
display: flex;
|
||
width: 50%;
|
||
}
|
||
.work-order-audit .item:last-child{
|
||
border-bottom: 0;
|
||
}
|
||
|
||
.work-order-cost{
|
||
width: 96%;
|
||
padding: 0 2%;
|
||
background-color: #f7f7f7;
|
||
}
|
||
|
||
.work-order-cost .item{
|
||
display: flex;
|
||
padding: 20rpx;
|
||
margin-top: 10rpx;
|
||
background-color: #FFFFFF;
|
||
}
|
||
|
||
.work-order-cost .item .title {
|
||
width: 150rpx;
|
||
font-size: 28rpx;
|
||
white-space: nowrap;
|
||
/* flex: 1; */
|
||
}
|
||
|
||
.work-order-cost .item .input {
|
||
width: calc(100% - 150rpx);
|
||
font-size: 27rpx;
|
||
color: #8b8b8b;
|
||
padding-left: 0;
|
||
}
|
||
|
||
.work-order-cost .list{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.work-order-cost .list .item{
|
||
box-sizing: border-box;
|
||
width: calc(50% - 5rpx);
|
||
}
|
||
.work-order-cost .list .item .title{
|
||
color: #999999;
|
||
}
|
||
.work-order-cost .list .item .input{
|
||
color: #333333;
|
||
text-align: right;
|
||
}
|
||
.work-order-cost .item.item-center{
|
||
justify-content: center;
|
||
font-size: 32rpx;
|
||
white-space: nowrap;
|
||
text-align: center;
|
||
}
|
||
.work-order-cost .item.item-center .title-price{
|
||
color: #e52e2e;
|
||
}
|
||
|
||
.work-order-cost .item .btns{
|
||
display: flex;
|
||
}
|
||
|
||
.btns .input-radio{
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 27rpx;
|
||
}
|
||
.btns .input-radio:nth-of-type(1){
|
||
margin-right: 40rpx;
|
||
}
|
||
.btns .input-radio .btn{
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
border-radius: 100%;
|
||
background-color: #f7f7f7;
|
||
border: 2rpx solid #eee;
|
||
margin-right: 14rpx;
|
||
}
|
||
.btns .input-radio .btn image{
|
||
width: 0;
|
||
height: 0;
|
||
}
|
||
.btns .input-radio .btn.checked{
|
||
background-color: #00a2e9;
|
||
border: 2rpx solid #00a2e9;
|
||
}
|
||
.btns .input-radio .btn.checked image{
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
.work-order-cost .item.item-textarea{
|
||
flex-wrap: wrap;
|
||
}
|
||
.work-order-cost .item.item-textarea textarea{
|
||
width: 100%;
|
||
height: 160rpx;
|
||
font-size: 27rpx;
|
||
background-color: #f5f5f5;
|
||
padding: 16rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
.item-textarea textarea::-webkit-input-placeholder {
|
||
color: #ccc;
|
||
}
|
||
.item-textarea textarea:-moz-placeholder {
|
||
color: #ccc;
|
||
}
|
||
.item-textarea textarea::-moz-placeholder {
|
||
color: #ccc;
|
||
}
|
||
.item-textarea textarea:-ms-input-placeholder {
|
||
color: #ccc;
|
||
}
|
||
.form-btns{
|
||
display: flex;
|
||
justify-content: space-around;
|
||
width: 100%;
|
||
background-color: #f7f7f7;
|
||
padding: 50rpx 0;
|
||
}
|
||
.form-btns .btn{
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 40%;
|
||
height: 88rpx;
|
||
border-radius: 44rpx;
|
||
font-size: 30rpx;
|
||
color: #FFFFFF;
|
||
background-color: #d50606;
|
||
}
|
||
.form-btns .btn:nth-of-type(1){
|
||
background-color: #009944;
|
||
}
|
||
</style>
|