hls_crm/pagesB/contract/paymentDetail.vue

380 lines
8.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

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="group_company">
<view class="contractinfo">
<view class="constatus">
<view class="con_status" v-if="info && info.check_status == 0">
待审核
</view>
<view class="con_status" v-if="info && info.check_status == 1">
审核中
</view>
<view class="con_status" v-if="info && info.check_status == 2">
审核通过
</view>
<view class="con_status" style="color:#ec7f51" v-if="info && info.check_status == 3">
审核未通过
</view>
<view class="con_status" style="color:#ec7f51" v-if="info && info.check_status == 4">
已撤回
</view>
</view>
<view class="nameli">
<view class="name">{{info && info.number}}</view>
</view>
<view class="content">
回款方式 {{info && info.return_type}}
</view>
<view class="content">
回款时间 {{info && info.return_time}}
<span>&yen;{{info && info.money}}</span>
</view>
</view>
<view class="btnlist" v-if="payment_approval.is_check == 1">
<view class="btn pass" @click="toPass">通过</view>
<view class="btn refuse" @click="toRefuse">拒绝</view>
</view>
<!-- 标签栏 -->
<view class="group_tab">
<view class="info_detail">
<view class="info_item">
<view class="basic_head">
<view>基本信息</view>
</view>
<view class="basic_main">
<view>负责人</view>
<view class="b_m_right">{{info && info.owner_staff.name}}</view>
</view>
<view class="basic_main">
<view>审核状态</view>
<view class="b_m_right" v-if="info && info.check_status == 0">待审核</view>
<view class="b_m_right" v-if="info && info.check_status == 1">审核中</view>
<view class="b_m_right" v-if="info && info.check_status == 2">审核通过</view>
<view class="b_m_right" v-if="info && info.check_status == 3">审核未通过</view>
</view>
<view class="basic_main">
<view>合同编号</view>
<view class="b_m_right">{{info && info.contract.num}}</view>
</view>
<view class="basic_main">
<view>合同名称</view>
<view class="b_m_right">{{info && info.contract.name}}</view>
</view>
<view class="basic_main">
<view>客户名称</view>
<view class="b_m_right">{{info && info.customer.name}}</view>
</view>
<form-item v-for="(item,index) in otherForm" :key="index" :objInfo="item" :isEdit="false"></form-item>
<view class="basic_main">
<view>创建人</view>
<view class="b_m_right">{{info && info.create_staff.name}}</view>
</view>
<view class="basic_main">
<view>创建时间</view>
<view class="b_m_right">{{info && info.createtime}}</view>
</view>
<view class="basic_main">
<view>更新时间</view>
<view class="b_m_right">{{info && info.updatetime}}</view>
</view>
<!-- 审批流程 -->
<approval-status :process="payment_approval"></approval-status>
</view>
</view>
</view>
<view style="height:130rpx"></view>
</view>
</template>
<script>
import { netPaymentDetail, netPaymentCancel } from '@/api/kehu.js'
import { netSetForm, netApprovalDetail } from '@/api/index.js'
import formItem from '@/components/form/formitem.vue'
import { BASE_IMG_URL } from '@/util/api.js'
import approvalStatus from '@/components/approvalStatus.vue'
export default {
data() {
return {
noClick:true, //防止 重复点击
id:'', //回款 id
info:null,
payment_approval:{}, //审批流程
otherForm:[],
BASE_IMG_URL:BASE_IMG_URL,
}
},
components:{
formItem,
approvalStatus
},
onLoad(options) {
this.id = options.id
},
onShow() {
this.otherForm = []
this.getInfo()
//获取 审批 流程
this.getApprovalList()
},
methods: {
getForm() {
netSetForm({type:'examine'}).then(res=>{
res = res.data.data
res.forEach(ele=>{
ele.value = this.info[ele.id]?this.info[ele.id]:''
this.otherForm.push(ele)
})
})
},
getInfo() {
netPaymentDetail({id:this.id}).then(res=>{
this.info = res.data
this.getForm()
})
},
getApprovalList() {
let params = {
type: 'receivables',
relation_id: this.id
}
netApprovalDetail(params).then(res=>{
this.payment_approval = res.data
})
},
//通过
toPass() {
uni.navigateTo({ //status 1成功 2失败
url:'/pages/examine/examine?id='+this.id+'&type=receivables&status=1'
})
},
//拒绝
toRefuse() {
uni.navigateTo({ //status 1成功 2失败
url:'/pages/examine/examine?id='+this.id+'&type=receivables&status=2'
})
},
//撤回 审批
cancelExamine() {
netPaymentCancel({id:this.id}).then(res=>{
uni.showToast({
title:res.msg,
icon:'none'
})
setTimeout(()=>{
this.getInfo()
},2000)
})
},
//编辑 回款
editPayment() {
uni.navigateTo({
url:'/pagesB/contract/editPayment?id='+this.id+'&contractid='+this.info.contract.id
})
},
//客户详情
toKehuInfo() {
uni.navigateTo({
url:'/pages/index/groupCompany/groupCompany?id='+this.info.customer.id
})
}
}
}
</script>
<style lang="scss">
.contractinfo{
background:#fff;
padding:20rpx 0;
position: relative;
.constatus{
position:absolute;
right:24rpx;
top:24rpx;
background:$uni-text-color-opcity ;
padding: 5rpx 12rpx;
display: flex;
justify-content: center;
align-items: center;
font-size:24rpx;
color:$uni-text-color;
border-radius: 10rpx;
.clockimg{
width:32rpx;
height:32rpx;
margin-right:10rpx;
}
}
.nameli{
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom:24rpx;
.zhangimg{
width:40rpx;
height:40rpx;
margin-right:15rpx;
}
.name{
font-size:32rpx;
color:#333333;
margin-left: 32rpx;
}
}
.content{
font-size:26rpx;
color:#999;
margin:15rpx 0;
margin-left: 32rpx;
margin-right: 30rpx;
span{
float: right;
font-size: 34rpx;
color: $uni-text-color;
font-weight: 600;
}
}
}
.tabinfo{
display: flex;
justify-content: space-between;
align-items: center;
padding:20rpx;
background:#fff;
border-top:1rpx solid #C0C0C0;
.tableft{
display: flex;
justify-content: flex-start;
align-items: center;
.headerimg{
width:45rpx;
height:45rpx;
border-radius: 50%;
}
.name{
font-size:34rpx;
color:#333;
margin-left:30rpx;
}
}
.rightimg{
width:32rpx;
height:32rpx;
}
}
.btnlist{
padding:20rpx 24rpx;
display: flex;
justify-content: space-around;
align-items: center;
border-top:1rpx solid #DDDDDD;
background:#fff;
.btn{
width:300rpx;
height:60rpx;
border-radius: 8rpx;
font-size:24rpx;
color:#fff;
text-align: center;
line-height: 60rpx;
}
.pass{
background:$uni-text-color;
}
.refuse{
background:#F43F3B;
}
}
.info_detail {
margin-bottom: 100rpx;
.basic_head {
display: flex;
padding:26rpx 30rpx;
font-size: 30rpx;
color: #333;
}
.basic_main {
display: flex;
justify-content: space-between;
padding: 0 32rpx;
background-color: #fff;
height: 90rpx;
line-height: 90rpx;
border-bottom: 1rpx solid #EAEAEA;
font-size: 32rpx;
color: #999;
.b_m_right{
color:#333;
font-size: 30rpx;
}
}
}
.operation_record {
background:#fff;
padding: 40rpx 30rpx;
.record_item {
display: flex;
justify-content: space-between;
padding-bottom:20rpx;
border-bottom:1rpx solid #EAEAEA;
margin-bottom:20rpx;
&:last-child{
border-bottom:none;
}
image {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
flex-shrink: 0;
}
.record_info {
flex: 1;
margin-left: 25rpx;
line-height: 40rpx;
font-size: 28rpx;
.info_top{
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom:10rpx;
font-size: 30rpx;
color: #999;
}
.shenhetext{
font-size:26rpx;
color:#666;
line-height: 34rpx;
}
}
.record_line {
position: absolute;
top: -102rpx;
left: -26rpx;
height: 105rpx;
border-left: 4rpx dotted #dedede;
}
}
}
.bntbox{
width:750rpx;
height:120rpx;
background:#fff;
position: fixed;
left:0;
bottom:0;
display: flex;
justify-content: center;
align-items: center;
border-top:1rpx solid #CCCCCC;
.botbtn{
width:680rpx;
height:80rpx;
border-radius: 40rpx;
font-size: 26rpx;
color:#fff;
text-align: center;
line-height: 80rpx;
background:$uni-text-color;
}
}
</style>