666 lines
15 KiB
Vue
666 lines
15 KiB
Vue
<template>
|
|
<view class="group_company">
|
|
<view class="group_head">
|
|
<view class="client">
|
|
{{(info.name) ? info.name : '--'}}
|
|
</view>
|
|
<view class="nickname" v-if="info.contacts">
|
|
{{(info.contacts) ? info.contacts.name : '--'}}<text>
|
|
|</text>{{(info.contacts) ? info.contacts.mobile : '--'}}
|
|
</view>
|
|
<view class="state" v-if="info.follow">
|
|
{{info.follow ? info.follow : '--'}}<text style="padding: 0 30rpx;"> |</text>
|
|
<u-rate :count="5" v-model="info.level" disabled active-color="#FFD049" inactive-color="#b2b2b2" :size="34" :gutter="10"></u-rate>
|
|
</view>
|
|
<view class="time" v-if="info.next_time">
|
|
下次跟进时间：{{info.next_time ? info.next_time : '--'}}
|
|
</view>
|
|
<view class="site" v-if="info.address">
|
|
{{(info.address) ? info.address : '--'}}
|
|
</view>
|
|
<view class="roll">
|
|
<scroll-view scroll-x="true" class="scrollView" lower-threshold="50" enable-flex>
|
|
<view class="scrolllist">
|
|
<view class="scrollView_item" @click="toTeam">
|
|
<view class="scroll_top">
|
|
{{info.teamCount?info.teamCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
团队
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="toBusiness">
|
|
<view class="scroll_top">
|
|
{{info.bussinessCount?info.bussinessCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
商机
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="contact(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.contactsCount?info.contactsCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
联系人
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="subord(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.companyCount?info.companyCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
子公司
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="signList(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.signCount?info.signCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
签到记录
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="Contract(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.contractCount?info.contractCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
合同
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="cost(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.consumeCount?info.consumeCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
费用
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="payment(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.receivalbleCount?info.receivalbleCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
回款记录
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="accessory(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.fileCount?info.fileCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
附件
|
|
</view>
|
|
</view>
|
|
<view class="scrollView_item" @click="operation(info.id)">
|
|
<view class="scroll_top">
|
|
{{info.operateCount?info.operateCount:0}}
|
|
</view>
|
|
<view class="scroll_foot">
|
|
操作记录
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
<!-- 标签栏 -->
|
|
<view class="group_tab">
|
|
<u-tabs name="cate_name" :list="list" :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 && info.id" :isSeas="Number(type)" :kehuid="info.id" :type="1"></customer-dynamic>
|
|
</view>
|
|
<view class="processing_title" v-if="current == 1">
|
|
<info-detail v-if="info && info.id" :info="info"></info-detail>
|
|
</view>
|
|
</view>
|
|
<view style="height:100rpx"></view>
|
|
<!-- 底部导航栏 -->
|
|
<view class="bottom_nav" v-if="type == 1 && info.operation == 'update'">
|
|
<view class="bottom_item" @click="followClick">
|
|
<image :src="BASE_IMG_URL+'tj.png'" class="botimg"></image>
|
|
<view>跟进</view>
|
|
</view>
|
|
<view class="bottom_item" @click="telClick">
|
|
<image :src="BASE_IMG_URL+'dh.png'" class="botimg"></image>
|
|
<view>拨打电话</view>
|
|
</view>
|
|
<view class="bottom_item" @click="moreClick">
|
|
<image :src="BASE_IMG_URL+'morebtn.png'" class="botimg"></image>
|
|
<view>更多操作</view>
|
|
</view>
|
|
</view>
|
|
<u-popup v-model="show" mode="bottom" border-radius="20">
|
|
<view class="pull_head">更多操作</view>
|
|
<view class="pull_con">
|
|
<view class="pull_item" @click="transferClueClick(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">转移客户</view>
|
|
</view>
|
|
<view class="pull_item" @click="removeSeas">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">移入公海</view>
|
|
</view>
|
|
<view class="pull_item" v-if="info && info.is_collect == 0" @click="Tofocus">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">重点关注</view>
|
|
</view>
|
|
<view class="pull_item" v-if="info && info.is_collect == 1" @click="ToRemovefocus">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">取消关注</view>
|
|
</view>
|
|
<view class="pull_item" @click="mapLocation">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">地图定位</view>
|
|
</view>
|
|
<view class="pull_item" @click="editClueClick(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">编辑客户</view>
|
|
</view>
|
|
<view class="pull_item" @click="toSigntrip(info.id)">
|
|
<view style="padding: 5rpx 12rpx;border: 1px solid #ededed;">出差签到</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<u-action-sheet
|
|
:list="telActions"
|
|
v-model="telShow"
|
|
:cancel-btn = "true"
|
|
@click="selectPhone"
|
|
></u-action-sheet>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import customerDynamic from 'components/content/customerDynamic/customerDynamic.vue';
|
|
import infoDetail from 'components/content/infoDetail/infoDetail.vue';
|
|
import {
|
|
moreCompany
|
|
} from 'components/content/data/data.js';
|
|
import {
|
|
pageJumps
|
|
} from "./group_page_jumps.js";
|
|
import {
|
|
BASE_IMG_URL
|
|
} from '@/util/api.js'
|
|
import {
|
|
netKehuDetail,
|
|
netRemoveSeas,
|
|
netReceiveKehu,
|
|
netKeyCollect,
|
|
netRemoveColect,
|
|
} from '@/api/kehu.js'
|
|
import {
|
|
netRelationBusiness
|
|
} from '@/api/index.js'
|
|
export default {
|
|
mixins: [pageJumps],
|
|
data() {
|
|
return {
|
|
BASE_IMG_URL: BASE_IMG_URL,
|
|
show: false,
|
|
taskShow: true,
|
|
statusShow: false,
|
|
// overShow: false,
|
|
moreCompany: [],
|
|
telShow: false,
|
|
telActions: [],
|
|
telname: '',
|
|
id: '', //客户id
|
|
info: {},
|
|
type: 1, //1普通客户 2公海客户
|
|
customer_id: '',
|
|
relation_id: '',
|
|
current: 0,
|
|
list: [{
|
|
name: '跟进记录',
|
|
status: 0
|
|
},
|
|
{
|
|
name: '基本信息',
|
|
status: 1
|
|
},
|
|
],
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.id = options.id
|
|
this.moreCompany = moreCompany
|
|
this.type = options.type
|
|
},
|
|
onShow() {
|
|
this.getInfo()
|
|
},
|
|
components: {
|
|
customerDynamic,
|
|
infoDetail,
|
|
},
|
|
methods: {
|
|
//添加跟进
|
|
followClick() {
|
|
uni.navigateTo({
|
|
url: '/pagesA/crm/customerManagement/newFllow/newFllow?id='+this.id+'&type=1'
|
|
})
|
|
},
|
|
change(index) {
|
|
this.current = index;
|
|
},
|
|
tabs_change(e) {
|
|
this.current = e;
|
|
this.mescroll.resetUpScroll();
|
|
},
|
|
//附件跳转
|
|
accessory(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/attachment/attachment?id=' + id + '&types=2' + '&type=' + this.type
|
|
})
|
|
},
|
|
//点击 附件 查看
|
|
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')
|
|
}
|
|
})
|
|
}
|
|
},
|
|
//新增合同
|
|
addContract(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesA/crm/contract/contract?id=' + id
|
|
})
|
|
},
|
|
//团队
|
|
toTeam() {
|
|
uni.navigateTo({
|
|
url:'/pagesA/circulate/index?id='+this.info.id
|
|
})
|
|
},
|
|
//联系人
|
|
contact(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesA/crm/linkman/linkman?id=' + this.id + '&type=' + this.type
|
|
})
|
|
},
|
|
//子公司
|
|
subord(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/subsidiary/subsidiary?id=' + id + '&type=' + this.type
|
|
})
|
|
},
|
|
//签到记录
|
|
signList(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesA/signin/record/record?id=' + id + '&type=' + this.type
|
|
})
|
|
},
|
|
//合同
|
|
Contract(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/pact/pact?id=' + id + '&type=' + this.type
|
|
})
|
|
},
|
|
//费用
|
|
cost(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/chargelist/chargelist?id=' + id + '&type=' + this.type
|
|
})
|
|
},
|
|
//回款记录
|
|
payment(id) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/payment/payment?id=' + id + '&type=' + this.type
|
|
})
|
|
},
|
|
//操作记录
|
|
operation(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesB/contract/operation?id=' + id + '&relation_type=1'
|
|
})
|
|
},
|
|
//获取客户信息
|
|
getInfo() {
|
|
this.info = {}
|
|
netKehuDetail({
|
|
id: this.id
|
|
}).then(res => {
|
|
this.info = res.data
|
|
uni.setNavigationBarTitle({
|
|
title: res.data.name
|
|
})
|
|
if (res.data.contacts) {
|
|
this.telname = res.data.contacts.name
|
|
this.telActions = [
|
|
{
|
|
text:res.data.contacts.name+res.data.contacts.mobile,
|
|
color:'#008EFF',
|
|
mobile:res.data.contacts.mobile
|
|
}
|
|
]
|
|
}
|
|
})
|
|
},
|
|
moreClick() {
|
|
this.show = true
|
|
},
|
|
//移入公海
|
|
removeSeas() {
|
|
this.show = false
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确认要将当前客户移到公海吗?',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
let params = {
|
|
id: this.info.id
|
|
}
|
|
netRemoveSeas(params).then(res => {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
setTimeout(() => {
|
|
uni.setStorageSync('isJamp',true)
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
}, 1000)
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
//重点关注
|
|
Tofocus() {
|
|
let params = {
|
|
customer_id: this.info.id
|
|
}
|
|
netKeyCollect(params).then(res => {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
this.show = false
|
|
setTimeout(() => {
|
|
this.getInfo()
|
|
}, 1000)
|
|
})
|
|
},
|
|
//取消重点关注
|
|
ToRemovefocus() {
|
|
let params = {
|
|
customer_id: this.info.id
|
|
}
|
|
netRemoveColect(params).then(res => {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
this.show = false
|
|
setTimeout(() => {
|
|
this.getInfo()
|
|
}, 1000)
|
|
})
|
|
},
|
|
//拨打电话
|
|
selectPhone(e) {
|
|
// #ifdef MP-ALIPAY
|
|
dd.showCallMenu({
|
|
phoneNumber: this.telActions[e].mobile,
|
|
code: '+86'
|
|
})
|
|
// #endif
|
|
// #ifndef APP-PLUS || MP-ALIPAY
|
|
uni.makePhoneCall({
|
|
phoneNumber: this.telActions[e].mobile
|
|
})
|
|
// #endif
|
|
// #ifdef APP-PLUS
|
|
plus.device.dial(this.telActions[e].mobile, true);
|
|
// #endif
|
|
},
|
|
//地图定位
|
|
mapLocation() {
|
|
uni.openLocation({
|
|
latitude: Number(this.info.lat),
|
|
longitude: Number(this.info.lng),
|
|
name: this.info.address,
|
|
address: this.info.address_detail,
|
|
success: (res) => {
|
|
console.log(res, this.info.lat, this.info.lng)
|
|
},
|
|
fail: (err) => {
|
|
console.log(err)
|
|
}
|
|
})
|
|
},
|
|
|
|
// 任务
|
|
taskClick() {
|
|
this.taskShow = true;
|
|
this.show = false;
|
|
},
|
|
// 取消底部弹出框
|
|
onCancel() {
|
|
this.taskShow = false;
|
|
this.statusShow = false;
|
|
this.telShow = false;
|
|
this.show = false;
|
|
},
|
|
// 变更状态
|
|
statusClick() {
|
|
this.statusShow = true;
|
|
this.show = false;
|
|
},
|
|
// 电话
|
|
telClick() {
|
|
this.telShow = true;
|
|
this.show = false;
|
|
},
|
|
// 领取线索
|
|
getCluesClick(id) {
|
|
this.show = false;
|
|
uni.showModal({
|
|
title: '是否确定领取客户',
|
|
content: '领取后长时间未跟进，客户将自动转为公共客户',
|
|
cancelColor: "#9abcfb",
|
|
confirmColor: "#9abcfb",
|
|
success: function(ress) {
|
|
if (ress.confirm) {
|
|
netReceiveKehu({
|
|
customer_id: id
|
|
}).then(res => {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateTo({
|
|
url: '/pages/index/groupCompany/groupCompany?id=' +
|
|
res.data.id
|
|
})
|
|
}, 1000)
|
|
})
|
|
} else if (ress.cancel) {
|
|
console.log('用户点击取消');
|
|
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 删除线索
|
|
deleteClueClick() {
|
|
uni.showModal({
|
|
title: '删除线索',
|
|
content: '确定删除该条记录吗？',
|
|
cancelColor: "#9abcfb",
|
|
confirmColor: "#9abcfb",
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
console.log('用户点击确定');
|
|
} else if (res.cancel) {
|
|
console.log('用户点击取消');
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 隐藏遮罩层
|
|
onClickHide() {
|
|
this.overShow = false;
|
|
},
|
|
|
|
//添加 出差 签到
|
|
toSigntrip(id) {
|
|
uni.navigateTo({
|
|
url: '/pagesA/signin/busSign?customerid=' + id
|
|
})
|
|
},
|
|
//商机
|
|
toBusiness() {
|
|
uni.navigateTo({
|
|
url:'/pagesA/business/customer_business?id='+this.id
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.pull_head {
|
|
font-size: 34rpx;
|
|
color: #999;
|
|
padding: 30rpx 0;
|
|
text-align: center;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
width: 0;
|
|
height: 0;
|
|
color: transparent;
|
|
}
|
|
|
|
.group_head {
|
|
padding: 20rpx 42rpx;
|
|
background-color: $uni-text-color;
|
|
text-align: left;
|
|
color: #fff;
|
|
font-size: 30rpx;
|
|
|
|
.client {
|
|
font-size: 36rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.nickname {
|
|
margin-bottom: 20rpx;
|
|
text {
|
|
padding: 0 30rpx;
|
|
}
|
|
}
|
|
|
|
.state {
|
|
margin-bottom: 20rpx;
|
|
|
|
text {
|
|
|
|
}
|
|
}
|
|
.time {
|
|
margin-bottom: 20rpx;
|
|
text {
|
|
padding: 0 30rpx;
|
|
}
|
|
}
|
|
.site {
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.principal {
|
|
margin-bottom: 20rpx;
|
|
}
|
|
}
|
|
|
|
.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;
|
|
z-index: 2;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
border-top:1rpx solid #f5f5f5;
|
|
.bottom_item{
|
|
font-size:24rpx;
|
|
.botimg{
|
|
width:40rpx;
|
|
height:40rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.pull_con {
|
|
padding: 20rpx;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
text-align: center;
|
|
color: #999;
|
|
box-sizing: border-box;
|
|
margin-bottom:calc(env(safe-area-inset-bottom) / 2);
|
|
.pull_item {
|
|
width: 22%;
|
|
margin-bottom: 90rpx;
|
|
margin-right: 20rpx;
|
|
:first-child {
|
|
padding-bottom: 10rpx;
|
|
}
|
|
:last-child {
|
|
padding-bottom: 50rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.scrollView {
|
|
margin:25rpx 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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|