<template>
|
<GlobalWindow
|
:title="title"
|
:visible.sync="visible"
|
:withFooter="false"
|
width="calc(100% - 250px)"
|
:confirm-working="isWorking"
|
@close="close"
|
@confirm="confirm">
|
<div class="main">
|
<div class="renzheng" >
|
<div class="info" >
|
<span class="m10">订单信息</span>
|
<el-tag type="primary" class="ml10 tag2" v-if="info.status == 0||info.status == 1||info.status == 3">{{ info.statusName }}</el-tag>
|
<el-tag type="success" class="ml10 tag2" v-if="info.status == 4">{{ info.statusName }}</el-tag>
|
<el-tag type="danger" class="ml10 tag2" v-if="info.status == 99">{{ info.statusName }}</el-tag>
|
</div>
|
<div class="detail" >
|
<div class="line">
|
<div class="cont"><span class="label"> 订单号:</span> <span class="txt">{{info.code }}</span></div>
|
<div class="cont"> <span class="label"> 下单时间:</span> <span class="txt">{{info.createTime }}</span></div>
|
<div class="cont"><span class="label"> 接单时间:</span> <span class="txt">{{info.acceptTime || '' }}</span></div>
|
</div>
|
<div class="line">
|
<div class="cont"><span class="label">开始时间:</span> <span class="txt">{{info.workStartTime || '' }}</span></div>
|
<div class="cont" style="flex: 2"><span class="label">完成时间:</span><span class="txt">{{info.finishTime || '' }}</span></div>
|
</div>
|
</div>
|
</div>
|
<div class="renzheng" >
|
<div class="info" >
|
<span class="m10">支付信息</span>
|
</div>
|
<div class="detail" >
|
<div class="line">
|
<div class="cont"><span class="label"> 实付金额:</span> <span class="txt yellowbtn">{{((info.payAccount||0)/100).toFixed(2) }}元</span></div>
|
<div class="cont"><span class="label">平台手续费:</span> <span class="txt yellowbtn">{{(((info.payAccount||0) - (info.receiveAccount||0))/100).toFixed(2) }}元</span></div>
|
<div class="cont"><span class="label">接单方收到金额:</span> <span class="txt yellowbtn">{{((info.receiveAccount||0)/100).toFixed(2) }}元</span></div>
|
</div>
|
<div class="line">
|
<div class="cont"><span class="label">支付时间:</span> <span class="txt">{{info.payTime || '' }}</span></div>
|
<div class="cont"><span class="label">支付方式:</span><span class="txt">{{info.payMethod==0?'微信支付':'其他' }}</span></div>
|
<div class="cont"><span class="label">交易单号:</span><span class="txt">{{info.wxExternalNo || '' }}</span></div>
|
</div>
|
</div>
|
</div>
|
<div class="renzheng" >
|
<div class="info" >
|
<span class="m10">需求信息</span>
|
</div>
|
<div class="detail" v-if="info.type==0">
|
<div class="line">
|
<div class="cont"><span class="label"> 订单类型:</span> <span class="txt">{{(info.type==0?'用工单':(info.type==1?'货运单':'订单单')) }}</span></div>
|
<div class="cont"><span class="label">工种:</span>
|
<span class="txt" v-if="info.type==0">{{(info.workType==0?'采摘工':(info.workType==1?'分拣工':'包装工')) }}</span>
|
<span v-else>-</span>
|
</div>
|
<div class="cont"><span class="label">采摘品种:</span> <span class="txt">{{info.categoryName || ''}}</span></div>
|
</div>
|
<div class="line">
|
<div class="cont"><span class="label">采摘重量:</span> <span class="txt">{{info.priceNum1 || '' }}斤</span></div>
|
<div class="cont"><span class="label">用工时间:</span><span class="txt">{{info.startDate|| '' }}-{{info.endDate|| '' }}</span></div>
|
<div class="cont"><span class="label">用工天数:</span><span class="txt">{{info.totalDays || 0 }}</span></div>
|
</div>
|
<div class="line">
|
<div class="cont"><span class="label">用工地点:</span> <span class="txt">{{info.location || '' }}</span></div>
|
<div class="cont"><span class="label">费用标准:</span><span class="txt">{{((info.price||0)/100).toFixed(2) }}{{info.priceUnit || '' }}</span></div>
|
<div class="cont"><span class="label">预估总费用:</span><span class="txt yellowbtn">{{((info.estimatedAccount||0)/100).toFixed(2) }}元</span></div>
|
</div>
|
<div class="line">
|
<div class="cont"><span class="label">地点描述:</span><span class="txt">{{info.locationRemark || '' }}</span></div>
|
</div>
|
<div class="line">
|
<div class="cont" ><span class="label">需求描述:</span><span class="txt">{{info.supplement || '' }}</span></div>
|
</div>
|
<div class="line">
|
<div class="cont">
|
<span class="label">图片:</span>
|
<span class="txt" v-if="!info.multifileList || info.multifileList.length ==0">无</span>
|
</div>
|
</div>
|
<div class="line" v-if="info.multifileList && info.multifileList.length>0">
|
<div class="cont">
|
<template v-if="info.multifileList && info.multifileList.length>0">
|
<div v-for="item in info.multifileList" style="display: inline-block" :key="item">
|
<el-image v-if="item.fileurlFull" style="width: 50px; height: 50px; margin-right: 10px" :src="item.fileurlFull"
|
:preview-src-list="[info.fileurlFull]">
|
</el-image>
|
</div>
|
</template>
|
</div>
|
</div>
|
<div class="line" v-if="info.auditStatus == 3 || info.auditStatus == 2" :style="'background-color: '+(info.auditStatus==2?'#eff8ea':'rgb(253 226 226)')+';padding: 20px'">
|
<span class="label"> 审核人:</span> <span class="txt">{{info.editorName}} </span><span class="label">{{info.auditTime || '' }} </span>
|
<div style="margin-top: 20px"> <span class="label"> 审核信息:</span> <span class="txt">{{info.auditRemark || '' }}</span></div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import BaseOpera from '@/components/base/BaseOpera'
|
import { getById,cancel } from '@/api/business/orders'
|
export default {
|
components: {
|
GlobalWindow
|
},
|
extends: BaseOpera,
|
data () {
|
return {
|
id: '',
|
info: {},
|
loading: false
|
}
|
},
|
methods: {
|
open (title, row) {
|
this.title = title
|
this.visible = true
|
this.tableData2 = []
|
this.id = row.id
|
this.getData()
|
},
|
getData () {
|
getById(this.id)
|
.then(res => {
|
this.info = res
|
this.visible = true
|
console.log(this.info)
|
})
|
},
|
close () {
|
|
},
|
checkDo (status) {
|
console.log(this.$refs.formCheck.length)
|
this.$refs.formCheck.validate((valid) => {
|
if (!valid) {
|
return
|
}
|
this.$dialog.actionConfirm('您确认【取消】该申请吗?', '操作确认')
|
.then(() => {
|
this.dealing = true
|
cancel({
|
id: this.id,
|
auditStatus: status,
|
auditRemark: this.form.auditRemark
|
})
|
.then(res => {
|
this.$tip.apiSuccess('操作成功')
|
this.getData()
|
this.$emit('success')
|
})
|
.catch(e => {
|
this.$tip.apiFailed(e)
|
})
|
.finally(() => {
|
this.dealing = false
|
})
|
})
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import '@/assets/style/variables.scss';
|
.bottom{
|
text-align: center;
|
display: block;
|
height: auto;
|
background-color: #e4ecfe;
|
width: calc(100% - 32px);
|
z-index: 999;
|
padding: 16px;
|
}
|
.renzheng{
|
margin: 0px 0px 50px 20px;
|
width: calc(100% - 60px);
|
.detail{
|
font-size: 14px;
|
.label{
|
//color: #8c939d;
|
}
|
.txt{
|
margin-right: 30px;
|
}
|
.line{
|
font-size: 12px;
|
margin-top: 15px;
|
display: flex;
|
width: calc(100% - 60px);
|
.cont{
|
flex: 1;
|
}
|
}
|
}
|
.ml10{
|
margin-left: 10px;
|
}
|
.info{
|
font-size: 14px;
|
font-weight: bold;
|
color: #5a72c5;
|
}
|
.tag2{
|
font-size: 12px;
|
}
|
}
|
.home_title {
|
.mr10{
|
margin-right: 10px;
|
}
|
.m10{
|
margin: 10px;
|
}
|
.bluebtn{
|
color: #2985f7;
|
}
|
.tag1{
|
border-radius: 10px;
|
font-size: 10px;
|
padding: 0px 15px;
|
height: 24px;
|
}
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
.left {
|
font-weight: 500;
|
font-size: 14px;
|
margin-right: 10px;
|
display: flex;
|
align-items: center;
|
.status {
|
padding: 0 6px;
|
height: 22px;
|
line-height: 22px;
|
border-radius: 2px;
|
border: 1px solid #00BA92;
|
color: #00BA92;
|
font-weight: 400;
|
font-size: 12px;
|
color: #00BA92;
|
}
|
}
|
}
|
.tab{
|
width: 20%;
|
}
|
.remark {
|
//background: #E8EBF7;
|
border-radius: 2px;
|
font-size: 14px;
|
margin: 10px 10px 0px -10px;
|
button{
|
border: none;
|
cursor: default;
|
margin-right: 20px;
|
background: #e4ecfe;
|
}
|
}
|
.bluebtn{
|
font-weight: bold;
|
color: #2985f7;
|
}
|
|
.redbtn{
|
font-weight: bold;
|
color: #ff1b1b;
|
}
|
.yellowbtn{
|
font-weight: bold;
|
color: #fc9d20;
|
}
|
|
.tabs {
|
border-bottom: 1px solid #DFE2E8;
|
display: flex;
|
margin-bottom: 20px;
|
.tab {
|
height: 58px;
|
line-height: 58px;
|
font-size: 14px;
|
color: #666666;
|
margin-right: 30px;
|
cursor: pointer;
|
}
|
|
.active {
|
font-weight: 500;
|
color: $primary-color;
|
border-bottom: 2px solid $primary-color;
|
}
|
}
|
|
.main {
|
padding: 12px 16px;
|
.title {
|
font-weight: 500;
|
font-size: 12px;
|
color: $primary-color;
|
margin-bottom: 15px;
|
}
|
/deep/ .el-form-item__label{
|
font-size: 12px;
|
}
|
.list {
|
display: flex;
|
flex-wrap: wrap;
|
/*background: #F7F7F7;*/
|
border-radius: 2px;
|
/*padding: 15px 20px;*/
|
margin-bottom: 20px;
|
|
.item {
|
font-size: 14px;
|
width: 25%;
|
margin-bottom: 16px;
|
|
.la {
|
color: #7f7f7f;
|
margin-bottom: 10px;
|
}
|
}
|
}
|
}
|
|
/deep/ .window__body {
|
padding: 0px !important;
|
}
|
</style>
|