627 lines
14 KiB
Vue
627 lines
14 KiB
Vue
<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 warnstatus" v-if="info && info.check_status == 3">
|
|
审核未通过
|
|
</view>
|
|
<view class="con_status warnstatus" v-if="info && info.check_status == 4">
|
|
已撤回
|
|
</view>
|
|
</view>
|
|
<view class="nameli">
|
|
<view class="name">{{info && info.name}}</view>
|
|
</view>
|
|
<view class="content" v-if="info">
|
|
采购编号：{{info.num ? info.num : ''}}
|
|
</view>
|
|
<view class="li_text">
|
|
<view class="protext">
|
|
回款进度
|
|
</view>
|
|
<view class="pro_out">
|
|
<view class="pro_in"
|
|
v-if="info"
|
|
:style="{width:(info.receivables.ratio >= 100 ? 100 : info.receivables.ratio) +'%'}"></view>
|
|
|
|
</view>
|
|
<view class="protext" v-if="info">
|
|
{{info.receivables.ratio >= 100 ? 100 : info.receivables.ratio }}%
|
|
</view>
|
|
</view>
|
|
<view class="li_text">
|
|
<view class="protext" v-if="info">
|
|
采购金额：¥{{info.money ? info.money : ''}}
|
|
</view>
|
|
</view>
|
|
<view class="content" v-if="info">
|
|
已回款：¥{{info.receivables ? info.receivables.repayment_money : ''}}
|
|
</view>
|
|
<view class="content" v-if="info">
|
|
待回款：¥ {{info.receivables ? info.receivables.be_money : ''}}
|
|
</view>
|
|
<!-- <view class="content" v-if="info">
|
|
签约时间：{{info.order_date ? info.order_date : ''}}
|
|
</view> -->
|
|
|
|
<view class="roll">
|
|
<scroll-view scroll-x="true" class="scrollView" lower-threshold="50" enable-flex>
|
|
<view class="scrolllist">
|
|
<view class="scrollView_item" @click="payment(info.id)">
|
|
<view class="scroll_top">
|
|
{{payment_list.length}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
回款记录
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="plan(info.id)">
|
|
<view class="scroll_top">
|
|
{{plan_list.length}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
回款计划
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="accessory(info.id)">
|
|
<view class="scroll_top">
|
|
{{fileList.length}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
附件
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="opera(info.id)">
|
|
<view class="scroll_top">
|
|
{{opera_list.length}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
操作记录
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</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">
|
|
<u-tabs name="cate_name" :list="lists" :is-scroll="false" active-color="#008EFF" :current="current"
|
|
@change="change"></u-tabs>
|
|
<view class="processing_title" v-if="current == 0">
|
|
<customer-dynamic v-if="info" :kehuid="info.id" :type="3"></customer-dynamic>
|
|
</view>
|
|
<view class="processing_title" v-if="current == 1">
|
|
<base-info v-if="info" :info="info" :payment_approval="payment_approval"></base-info>
|
|
</view>
|
|
</view>
|
|
<view style="height:100rpx;"></view>
|
|
<!-- 底部导航栏 -->
|
|
<!-- <view class="bottom_nav">
|
|
<view class="bottom_item" style="width: 300rpx; margin: 0 auto;" @click="moreClick">
|
|
<image style="width: 48rpx;height: 48rpx;float: left;" :src="BASE_IMG_URL+'morebtn.png'" mode="scaleToFill"></image>
|
|
<view style="font-size: 34rpx;">更多操作</view>
|
|
</view>
|
|
<u-popup v-model="show" mode="bottom" border-radius="20">
|
|
<view class="pull_head">更多操作</view>
|
|
<view class="pull_con">
|
|
<view class="bottom_item" @click="followClick(info.id,3)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">写新跟进</view>
|
|
</view>
|
|
<view class="bottom_item" @click="toAddPlan(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">回款计划</view>
|
|
</view>
|
|
<view class="bottom_item" v-if="info && info.check_status == 2" @click="toAddPayment(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">回款</view>
|
|
</view>
|
|
<view class="bottom_item" v-if="info && (info.check_status == 0 || info.check_status == 1)" @click="removeExamine(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">撤回审批</view>
|
|
</view>
|
|
<view class="bottom_item" v-if="info && (info.check_status == 4 || info.check_status == 3)" @click="toEditcontract(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">编辑采购</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
</view> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { BASE_IMG_URL } from '@/util/api.js'
|
|
import customerDynamic from 'components/content/customerDynamic/customerDynamic.vue';
|
|
import baseInfo from './baseInfo.vue'
|
|
import {
|
|
pageJumps
|
|
} from "@/pages/index/groupCompany/group_page_jumps.js";
|
|
import {
|
|
netContractDetail,
|
|
netCancelExamine,
|
|
netContractFileList,
|
|
netOperationList,
|
|
netEditFileName,
|
|
netPlanListf,
|
|
netPaymentList
|
|
} from '@/api/kehu.js'
|
|
import { netApprovalDetail } from '@/api/index.js'
|
|
export default {
|
|
mixins: [pageJumps],
|
|
created() {
|
|
|
|
},
|
|
data() {
|
|
return {
|
|
id: '', //采购id
|
|
contract_id:'',
|
|
relation_id:'',
|
|
relation_type: 3,
|
|
info: {},
|
|
srollLeft: 0,
|
|
taskShow: false,
|
|
show: false,
|
|
|
|
fileList:[], //附件列表
|
|
opera_list: [], //操作记录
|
|
plan_list: [], //回款计划 列表
|
|
payment_list: [], //回款 列表
|
|
type:3,
|
|
types:3,
|
|
BASE_IMG_URL:BASE_IMG_URL,
|
|
list: [{
|
|
num: "123",
|
|
name: "回款记录",
|
|
},
|
|
{
|
|
num: "321",
|
|
name: "回款计划",
|
|
},
|
|
{
|
|
num: "222",
|
|
name: "操作记录",
|
|
},
|
|
],
|
|
current: 0,
|
|
lists: [{
|
|
name: '跟进记录',
|
|
status: 0
|
|
},
|
|
{
|
|
name: '基本信息',
|
|
status: 1
|
|
},
|
|
],
|
|
payment_approval:{}, //审批流程
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.id = options.id
|
|
},
|
|
onHide() {
|
|
this.show = false
|
|
},
|
|
onShow() {
|
|
this.info = null
|
|
this.getInfo()
|
|
|
|
//操作记录
|
|
this.getOperalist()
|
|
//获取 回款计划 列表
|
|
this.getPlanlist()
|
|
//获取 回款 列表
|
|
this.getPaymentlist()
|
|
//附件 列表
|
|
this.getFile()
|
|
//审批流程
|
|
this.getApprovalList()
|
|
},
|
|
components: {
|
|
customerDynamic,
|
|
baseInfo,
|
|
},
|
|
methods: {
|
|
getApprovalList() {
|
|
let params = {
|
|
type: 'contract',
|
|
relation_id: this.id
|
|
}
|
|
netApprovalDetail(params).then(res=>{
|
|
this.payment_approval = res.data
|
|
})
|
|
},
|
|
change(index) {
|
|
this.current = index;
|
|
},
|
|
tabs_change(e) {
|
|
this.current = e;
|
|
this.mescroll.resetUpScroll();
|
|
},
|
|
moreClick() {
|
|
this.show = true
|
|
},
|
|
onClose() {
|
|
this.show = false
|
|
},
|
|
//附件跳转
|
|
accessory(id){
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/attachment/attachment?id=' + id +'&types=' + this.types
|
|
})
|
|
},
|
|
//点击 附件 查看
|
|
lookDetail(item) {
|
|
if(item.types.indexOf('image') != -1){
|
|
uni.previewImage({
|
|
urls: [ item.file_path ]
|
|
})
|
|
}else{
|
|
uni.downloadFile({
|
|
url: item.file_path,
|
|
success:(res)=>{
|
|
uni.openDocument({
|
|
filePath:res.tempFilePath,
|
|
success:(res)=>console.log('成功打开文档')
|
|
})
|
|
},
|
|
fail:(err)=>{
|
|
console.log(err,'shibai')
|
|
}
|
|
})
|
|
}
|
|
},
|
|
// 附件 列表
|
|
getFile() {
|
|
let params = { contract_id:this.id }
|
|
netContractFileList(params).then(res=>{
|
|
this.fileList = res.data
|
|
})
|
|
},
|
|
//回款计划 列表
|
|
getPlanlist() {
|
|
netPlanListf({
|
|
contract_id: this.id
|
|
}).then(res => {
|
|
this.plan_list = res.data.data
|
|
})
|
|
|
|
},
|
|
//回款 列表
|
|
getPaymentlist() {
|
|
netPaymentList({
|
|
contract_id: this.id,
|
|
}).then(res => {
|
|
this.payment_list = res.data.data
|
|
})
|
|
},
|
|
//操作 记录
|
|
getOperalist() {
|
|
let params = {
|
|
relation_type: 3, //1客户 2联系人 3采购
|
|
relation_id: this.id
|
|
}
|
|
netOperationList(params).then(res => {
|
|
this.opera_list = res.data
|
|
})
|
|
},
|
|
//回款列表
|
|
payment(id){
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/returned?id=' + id+'&kehuid='+this.info.customer.id
|
|
})
|
|
},
|
|
//回款计划
|
|
plan(id){
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/plan?id=' + id+'&kehuid='+this.info.customer.id
|
|
})
|
|
},
|
|
//操作列表
|
|
opera(id){
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/operation?id='+id +'&relation_type=' + this.type
|
|
})
|
|
},
|
|
//新增采购
|
|
addContract(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesA/crm/contract/contract?id=' + id
|
|
})
|
|
},
|
|
//获取采购 详情信息
|
|
getInfo() {
|
|
netContractDetail({
|
|
id: this.id
|
|
}).then(res => {
|
|
this.info = res.data
|
|
})
|
|
},
|
|
//客户信息
|
|
toKehuInfo() {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/groupCompany?id=' + this.info.customer.id
|
|
})
|
|
},
|
|
//添加 回款计划
|
|
toAddPlan(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/addPaymentPlan?id=' + id+'&kehuid='+this.info.customer.id
|
|
})
|
|
},
|
|
//添加 回款
|
|
toAddPayment(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/addPayment?id=' + id+'&kehuid='+this.info.customer.id
|
|
})
|
|
},
|
|
//编辑采购
|
|
toEditcontract(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/editContract?id=' + id + '&kehuid=' + this.info.customer.id
|
|
})
|
|
},
|
|
//撤回 审批
|
|
removeExamine(id) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '请确认是否撤回?',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
netCancelExamine({
|
|
id
|
|
}).then(res => {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
setTimeout(() => {
|
|
this.getInfo()
|
|
}, 2000)
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//通过
|
|
toPass() {
|
|
uni.navigateTo({ //status 1成功 2失败
|
|
url: '/pages/examine/examine?id=' + this.id + '&type=contract&status=1'
|
|
})
|
|
},
|
|
//拒绝
|
|
toRefuse() {
|
|
uni.navigateTo({ //status 1成功 2失败
|
|
url: '/pages/examine/examine?id=' + this.id + '&type=contract&status=2'
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.scrollView {
|
|
margin:24rpx 0;
|
|
.scrolllist{
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
.scrollView_item {
|
|
flex-shrink: 0;
|
|
width:145rpx;
|
|
padding:15rpx 0;
|
|
background: #fff;
|
|
border-radius: 20rpx;
|
|
text-align: center;
|
|
margin-right: 15rpx;
|
|
.scroll_top{
|
|
color: $uni-text-color;
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
}
|
|
.scroll_foot{
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.warnstatus {
|
|
color: #ec7f51;
|
|
}
|
|
|
|
.contractinfo {
|
|
background: $uni-text-color;
|
|
padding: 20rpx 42rpx;
|
|
position: relative;
|
|
|
|
.constatus {
|
|
position: absolute;
|
|
right: 24rpx;
|
|
top: 24rpx;
|
|
background: #fff;
|
|
padding: 5rpx 12rpx;
|
|
border-radius: 5px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 24rpx;
|
|
color: black;
|
|
.con_status{
|
|
color:$uni-text-color;
|
|
}
|
|
.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: #fff;
|
|
font-size: 36rpx;
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
.li_text {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
|
|
// margin: 0 15rpx;
|
|
.biaoimg {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
margin-right: 15rpx;
|
|
}
|
|
|
|
.protext {
|
|
margin: 15rpx 0;
|
|
font-size: 30rpx;
|
|
color: #fff;
|
|
margin-right: 24rpx;
|
|
}
|
|
|
|
.pro_out {
|
|
width: 150rpx;
|
|
height: 30rpx;
|
|
border-radius: 15rpx;
|
|
background: #DDDDDD;
|
|
margin-right: 27rpx;
|
|
|
|
.pro_in {
|
|
width: 20%;
|
|
height: 30rpx;
|
|
border-radius: 15rpx;
|
|
background: #FE9440;
|
|
}
|
|
}
|
|
|
|
.money {
|
|
font-size: 30rpx;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.content {
|
|
font-size: 30rpx;
|
|
color: #fff;
|
|
margin: 15rpx 0;
|
|
}
|
|
}
|
|
|
|
.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: 26rpx;
|
|
color: $uni-text-color;
|
|
margin-left: 24rpx;
|
|
}
|
|
}
|
|
|
|
.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;
|
|
}
|
|
}
|
|
|
|
.group_tab {
|
|
margin: 20rpx 0;
|
|
}
|
|
|
|
.bottom_nav {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
padding: 20rpx 0;
|
|
background-color: #fff;
|
|
text-align: center;
|
|
color: #999;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
z-index: 9;
|
|
}
|
|
.pull_head{
|
|
font-size: 34rpx;
|
|
color: #999;
|
|
padding: 30rpx 0;
|
|
}
|
|
.pull_con {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
padding: 20rpx 0 100rpx;
|
|
}
|
|
</style>
|