<template>
|
<GlobalWindow
|
:title="title"
|
width="100%"
|
:visible.sync="visible"
|
>
|
<div class="detail-box">
|
<div class="header">
|
<div class="header-b">基本信息</div>
|
<div v-if="form.status ==0" class="header-orange">待审批</div>
|
<div v-if="form.status ==1" class="header-green">已通过</div>
|
<div v-if="form.status ==2" class="header-red">已驳回</div>
|
</div>
|
<div class="info-item">
|
<div class="info-item-a">经销商名称：<span>{{form.shopName || ''}}</span> </div>
|
<div class="info-item-a">门店ID：<span>{{form.shopCode || ''}}</span></div>
|
<div class="info-item-a">申请时间：<span>{{form.createDate || ''}}</span></div>
|
</div>
|
<div class="info-item"></div>
|
</div>
|
<div class="detail-box">
|
<div class="header">
|
<div class="header-b">提现信息</div>
|
</div>
|
<div class="info-item">
|
<div class="info-item-a">提现金额：<span class="orange">￥{{(form.amount || 0).toFixed(2)}}</span> </div>
|
<div class="info-item-a"> </div>
|
<div class="info-item-a"> </div>
|
</div>
|
<div class="info-item">
|
<div class="info-item-a">户名：<span >{{ form.name||'' }}</span> </div>
|
<div class="info-item-a">账号：<span >{{ form.bankAccount||'' }}</span> </div>
|
<div class="info-item-a">银行：<span >{{ form.bankName||'' }}</span> </div>
|
</div>
|
<div class="info-item"></div>
|
</div>
|
<div class="detail-box">
|
<div class="header">
|
<div class="header-b">审核流程</div>
|
</div>
|
<div class="info-item">
|
<div class="time-line">
|
<el-timeline :reverse="true">
|
<el-timeline-item
|
v-for="(item, index) in logList"
|
:key="index"
|
color="#2991FF"
|
size="large"
|
type="primary"
|
>
|
<div class="ml10">
|
<div class="list-title">{{ item.title }}
|
<i v-if="item.status ==1" class="el-icon-success green"></i>
|
<i v-if="item.status ==2" class="el-icon-error red"></i>
|
</div>
|
<div class="list-company"><span>{{item.info }}</span><span style="margin-left: 10px">{{item.createTime }}</span></div>
|
<div class="list-company1" v-if="item.status ===1"><span>打款凭证：</span>
|
<div v-if="item.files && item.files.length"; style="display: block;margin-left: 100px;">
|
<el-image
|
v-for="file in item.files "
|
:key="'file_'+file.fileurl"
|
style="margin-right: 20px; width: 100px; height: 100px; border-radius: 2px;"
|
:src="file.fileFullUrl"
|
:preview-src-list="[file.fileFullUrl]"
|
></el-image>
|
</div>
|
<span v-else>无</span>
|
</div>
|
<div class="list-company1" v-if="item.status ===1"><span>打款银行：</span><span>{{item.payBank||'-' }}</span></div>
|
<div class="list-company1" v-if="item.status ===1||item.status ==2"><span>审核备注：</span><span>{{item.auditRemark||'' }}</span></div>
|
</div>
|
</el-timeline-item>
|
</el-timeline>
|
</div>
|
</div>
|
</div>
|
<div v-if="form && form.status == 0">
|
<p class="tip-header" >申请审批</p>
|
<el-form :model="checkForm" ref="checkForm" :rules="rules" label-width="110px" label-suffix="：" style="margin-left: 20px;width: 500px;" inline >
|
<el-form-item label="审核结果" prop="status">
|
<el-radio-group v-model="checkForm.status">
|
<el-radio :label="1">通过</el-radio>
|
<el-radio :label="2">驳回</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="打款凭证" prop="payFileList" v-if="checkForm.status ==1">
|
<div style="margin-left: 150px">
|
<UploadImage
|
:fileList="checkForm.payFileList"
|
:uploadData="{folder:'transfer'}"
|
@beginUpload="isUploading=true"
|
@endUpload="isUploading=false"/>
|
<p class="tip-warn">
|
建议尺寸：750px X 750px，上限6张
|
支持png、jpg、jpeg格式，大小不超过2M，上传图片不允许涉及政治敏感与色情
|
</p>
|
</div>
|
</el-form-item>
|
<el-form-item label="打款银行" prop="payBank" v-if="checkForm.status ==1">
|
<el-input v-model="checkForm.payBank" placeholder="请输入打款银行" style="width: 350px" v-trim/>
|
</el-form-item>
|
<el-form-item label="审核备注" prop="auditRemark">
|
<el-input v-model="checkForm.auditRemark" placeholder="请输入审核备注" type="textarea" style="width: 350px; " rows="6" v-trim/>
|
</el-form-item>
|
</el-form>
|
<div class="info-item-a"></div>
|
</div>
|
<template v-slot:footer>
|
<el-button :loading="isWorking" @click="confirmDo" v-if="form && form.status ==0" :type="checkForm.status==2?'danger':'primary'" >{{checkForm.status==2?'审核驳回':'审核通过'}}</el-button>
|
<el-button @click="visible=false">返回</el-button>
|
</template>
|
</GlobalWindow>
|
</template>
|
<script>
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import BaseOpera from '@/components/base/BaseOpera'
|
import UploadImage from '@/components/common/UploadImage'
|
export default {
|
name: 'OperaShopInfoWindow',
|
extends: BaseOpera,
|
components: { GlobalWindow, UploadImage },
|
data () {
|
return {
|
title: '',
|
visible: false,
|
tabelHeight: null,
|
isUploading: false,
|
form: {},
|
logList: [],
|
checkForm: {
|
id: '',
|
status: '',
|
auditRemark: '',
|
payBank: '',
|
payFileList: null
|
},
|
rules: {
|
status: [
|
{ required: true, message: '请选择审核结果' }
|
]
|
}
|
}
|
},
|
created () {
|
this.config({
|
module: '提现申请表',
|
api: '/business/withdrawRecord',
|
'field.id': 'id',
|
'field.main': 'id'
|
})
|
},
|
methods: {
|
confirmDo () {
|
this.$refs.checkForm.validate((valid) => {
|
if (!valid) {
|
return
|
}
|
this.$dialog.confirm('您确定提交该审批结果吗？', '操作提示', {
|
confirmButtonText: this.checkForm.status === 1 ? '确认通过' : '确定驳回',
|
type: 'warning'
|
})
|
.then(() => {
|
this.isWorking = true
|
this.api.updateById(this.checkForm)
|
.then(() => {
|
this.$tip.apiSuccess('审批成功')
|
this.loadInfo()
|
this.$emit('success')
|
}).catch(e => {
|
this.$tip.apiFailed(e)
|
})
|
.finally(() => {
|
this.isWorking = false
|
})
|
})
|
.catch(e => {
|
|
})
|
// 调用新建接口
|
})
|
},
|
loadInfo () {
|
this.api.detail(this.form.id).then(res => {
|
this.form = res || this.form
|
this.logList = []
|
if (this.form.status == 1) {
|
this.logList.push({ title: '平台审核通过', info: this.form.auditUserName, createTime: this.form.auditTime || '', status: 1, files: this.form.payFileList || [], bank: this.form.payBank || '', auditRemark: this.form.auditRemark || '' })
|
} else if (this.form.status == 2) {
|
this.logList.push({ title: '平台审核驳回', info: this.form.auditUserName, createTime: this.form.auditTime || '', status: 2, auditRemark: this.form.auditRemark || '' })
|
}
|
this.logList.push({ title: '经销商发起提现申请', info: '恒达机械销售有限公司 ', createTime: this.form.createDate || '', status: 0 })
|
})
|
},
|
open (title, info) {
|
this.title = title
|
this.visible = true
|
this.form = info || {}
|
this.loadInfo()
|
this.logList = []
|
this.checkForm = {
|
id: info.id,
|
status: 1,
|
auditRemark: '',
|
payBank: '',
|
payFileList: []
|
}
|
}
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
.platgroup_tabs {
|
flex: 1;
|
display: flex;
|
border-bottom: 1px solid #dfe2e8;
|
margin-bottom: 30px;
|
.tab {
|
color: #666666;
|
margin-right: 40px;
|
cursor: pointer;
|
padding-bottom: 10px;
|
border-bottom: 2px solid #fff;
|
}
|
|
.active {
|
font-weight: 500;
|
font-size: 15px;
|
color: #216EEE;
|
border-bottom: 2px solid #216EEE;
|
}
|
}
|
.table-pagination{
|
position: fixed !important;
|
bottom: 50px;
|
}
|
.header-b{
|
display: inline-block;
|
font-size: 16px;
|
font-weight: bold;
|
}
|
.confirmbtn1{
|
color: #FFFFFF;
|
background-color: #0e83d1!important;
|
border-color: #0e83d1!important;
|
}
|
.confirmbtn2{
|
color: #FFFFFF;
|
background-color: red!important;
|
border-color: red!important;
|
}
|
.header-green{
|
display: inline-block;
|
font-size: 12px;
|
border: 1px solid green;
|
padding: 2px 10px;
|
margin-left: 20px;
|
color: green;
|
border-radius: 5px ;
|
}
|
.header-red{
|
display: inline-block;
|
font-size: 12px;
|
border: 1px solid red;
|
padding: 2px 10px;
|
margin-left: 20px;
|
color: red;
|
border-radius: 5px ;
|
}
|
.header-orange{
|
display: inline-block;
|
font-size: 12px;
|
border: 1px solid orange;
|
padding: 2px 10px;
|
margin-left: 20px;
|
color: orange;
|
border-radius: 5px ;
|
}
|
.header-btn{
|
display: inline-block;
|
border: none;
|
padding: 2px 10px;
|
margin-left: 20px;
|
}
|
.info-item{
|
display: flex;
|
width: 100%;
|
margin: 15px;
|
}
|
.info-item-a{
|
flex: 1;
|
font-size: 14px;
|
|
}
|
.info-item-a span{
|
font-weight: 600;
|
}
|
.info-item-a .btn{
|
font-size: 12px !important;
|
cursor: pointer !important;
|
}
|
|
.time-line {
|
margin-top: 20px;
|
margin-left: 20px;
|
}
|
.list-title {
|
font-size: 12px;
|
font-family: PingFangSC-Medium, PingFang SC;
|
font-weight: 500;
|
//color: #181b1e;
|
margin-bottom: 5px;
|
}
|
.list-company {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: #596878;
|
margin-bottom: 15px;
|
}
|
.list-company1 {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
margin-bottom: 15px;
|
}
|
.list-desc {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: #596878;
|
}
|
//左侧时间
|
.time {
|
color: #409eff;
|
position: absolute;
|
left: -94px;
|
top: 1px;
|
.year {
|
font-size: 14px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: #20354a;
|
}
|
.day {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: black;
|
text-align: right;
|
margin-top: 0px;
|
}
|
}
|
</style>
|
