310 lines
6.4 KiB
Vue
310 lines
6.4 KiB
Vue
<template>
|
|
<view>
|
|
<!-- 顶部标签栏 -->
|
|
<selectTemp
|
|
:isSeas="true"
|
|
:sortData="sortData"
|
|
:de_type="de_type"
|
|
:de_starttime="de_starttime"
|
|
:de_endtime="de_endtime"
|
|
@sortClick="sortClick"
|
|
@screenClick="screenClick"
|
|
@queryData="queryData"></selectTemp>
|
|
|
|
<!-- 客户信息 -->
|
|
<view class="manage_con">
|
|
<view class="clineInfo" v-for="(item,index) in list" :key="index" @tap.stop="toMore(item.id,2)">
|
|
<view class="info_head">
|
|
<view style="width: #333333; font-size: 34rpx;">{{item.name}}</view>
|
|
</view>
|
|
<view class="info_main">
|
|
<view class="main_left">
|
|
<view class="left_followUp">
|
|
<view>下次跟进时间：{{item.next_time}}</view>
|
|
</view>
|
|
<view class="left_star">
|
|
<view>客户星级：</view>
|
|
<view>
|
|
<u-rate :count="5" v-model="item.level" disabled active-color="#FFD049" inactive-color="#b2b2b2" :size="30" :gutter="20"></u-rate>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="info_footer" @tap.stop.prevent>
|
|
<view class="footer_content" @tap.stop="toGroupCompany(item)">
|
|
<image :src="BASE_IMG_URL+'tj.png'" mode="scaleToFill"></image>
|
|
<view>领取</view>
|
|
</view>
|
|
<view class="footer_content" @tap.stop="telClick(item.contacts)">
|
|
<image :src="BASE_IMG_URL+'dh.png'" mode="scaleToFill"></image>
|
|
<view>电话</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="height: 200rpx;"></view>
|
|
<u-empty v-if="list.length == 0" text="暂无更多"></u-empty>
|
|
</view>
|
|
<u-action-sheet
|
|
:list="taskActions"
|
|
v-model="taskShow"
|
|
:cancel-btn = "true"
|
|
@cancel.natice="onCancel"
|
|
></u-action-sheet>
|
|
|
|
<u-action-sheet
|
|
:list="telActions"
|
|
v-model="telShow"
|
|
:cancel-btn = "true"
|
|
@click="selectPhone"
|
|
></u-action-sheet>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import selectTemp from '@/components/content/selectTemp/selectTemp.vue';
|
|
import {customerSortDatas} from 'components/content/data/data.js';
|
|
import { BASE_IMG_URL } from '@/util/api.js'
|
|
import {customerPageJumps} from "../crm_page_jumps.js";
|
|
import { netKehuList, netReceiveKehu } from '@/api/kehu.js'
|
|
export default {
|
|
mixins:[customerPageJumps],
|
|
data() {
|
|
return {
|
|
sort: false,
|
|
screen: false,
|
|
date: '',
|
|
show: false,
|
|
sortData:customerSortDatas,
|
|
screenData:[],
|
|
taskShow: false,
|
|
telShow: false,
|
|
taskActions: [
|
|
{name:'普通任务',color:'#008EFF'},
|
|
{name:'跟进任务',color:'#008EFF'}
|
|
],
|
|
telActions: [],
|
|
queryObj:{},
|
|
page:1,
|
|
totalPage:1,
|
|
limit:10,
|
|
list:[],
|
|
//默认 筛选条件
|
|
de_type:null,
|
|
de_starttime:'',
|
|
de_endtime:'',
|
|
de_flag:false,
|
|
BASE_IMG_URL:BASE_IMG_URL,
|
|
count: 5,
|
|
value: 2
|
|
}
|
|
},
|
|
components: {
|
|
selectTemp,
|
|
},
|
|
onLoad (options) {
|
|
console.log(options)
|
|
if(options.type){
|
|
this.de_type = options.type
|
|
this.de_starttime = options.startTime
|
|
this.de_endtime = options.endTime
|
|
}
|
|
this.de_flag = true
|
|
this.list = []
|
|
this.page = 1
|
|
this.totalPage = 1
|
|
//获取客户 列表
|
|
this.getList()
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
onReachBottom() {
|
|
if(this.page >= this.totalPage){
|
|
return
|
|
}
|
|
this.page ++
|
|
this.getList()
|
|
},
|
|
methods: {
|
|
queryData(params) {
|
|
this.queryObj = params
|
|
this.list = []
|
|
this.page = 1
|
|
this.getList()
|
|
},
|
|
getList() {
|
|
let params = {
|
|
is_seas: 1,
|
|
page:this.page,
|
|
limit: this.limit,
|
|
...this.queryObj
|
|
}
|
|
netKehuList(params).then(res=>{
|
|
res = res.data
|
|
this.list = this.list.concat(res.data)
|
|
this.page = res.current_page
|
|
this.totalPage = res.last_page
|
|
})
|
|
},
|
|
sortClick(data) {
|
|
this.sort = data;
|
|
this.screen = false;
|
|
},
|
|
screenClick(data) {
|
|
this.screen = data;
|
|
this.sort = false;
|
|
},
|
|
switchover(value){
|
|
this.screenData = value;
|
|
|
|
},
|
|
// 任务
|
|
taskClick() {
|
|
this.taskShow = true;
|
|
},
|
|
// 电话
|
|
telClick(item) {
|
|
if(item){
|
|
this.telShow = true;
|
|
this.telActions[0] = {
|
|
text:item.name+item.mobile,
|
|
color:'#008EFF',
|
|
mobile:item.mobile
|
|
}
|
|
}else{
|
|
uni.showToast({
|
|
title:'暂无联系方式',
|
|
icon:'none'
|
|
})
|
|
this.telActions = []
|
|
}
|
|
},
|
|
selectPhone(e) {
|
|
// #ifdef MP-ALIPAY
|
|
dd.showCallMenu({
|
|
phoneNumber: this.telActions[0].mobile,
|
|
code: '+86'
|
|
})
|
|
// #endif
|
|
// #ifndef MP-ALIPAY || APP-PLUS
|
|
uni.makePhoneCall({
|
|
phoneNumber: this.telActions[0].mobile
|
|
})
|
|
// #endif
|
|
// #ifdef APP-PLUS
|
|
plus.device.dial(this.telActions[0].mobile, true);
|
|
// #endif
|
|
},
|
|
onCancel() {
|
|
this.taskShow = false;
|
|
this.telShow = false;
|
|
},
|
|
//领取
|
|
toGroupCompany(item) {
|
|
uni.showModal({
|
|
title:'是否确定领取公池客户',
|
|
content:'领取后长时间未跟进，客户将自动转为公共客户',
|
|
success:(res)=>{
|
|
if(res.confirm){
|
|
netReceiveKehu({customer_id:item.id}).then(res=>{
|
|
uni.showToast({
|
|
title:res.msg,
|
|
icon:'none'
|
|
})
|
|
setTimeout(()=>{
|
|
this.list = []
|
|
this.page = 1
|
|
this.getList()
|
|
},2000)
|
|
})
|
|
}
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.clineInfo {
|
|
background-color: #fff;
|
|
padding: 24rpx;
|
|
margin-bottom: 20rpx;
|
|
border-radius: 10rpx;
|
|
box-shadow: 2rpx 2rpx 50rpx rgba(0,0,0,0.1);
|
|
.info_head {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
:first-child {
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
color: #333;
|
|
}
|
|
}
|
|
|
|
.info_main {
|
|
border-bottom: 1px solid #ededed;
|
|
.main_left {
|
|
.left_followUp {
|
|
display: flex;
|
|
font-size: 30rpx;
|
|
color: #666;
|
|
margin: 20rpx 0;
|
|
}
|
|
.left_star {
|
|
display: flex;
|
|
padding-bottom: 20rpx;
|
|
font-size: 30rpx;
|
|
color: #666;
|
|
background-size: 15rpx 15rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.info_footer {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
padding-top: 24rpx;
|
|
.footer_content {
|
|
line-height: 28rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
image{
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
margin-right: 15rpx;
|
|
}
|
|
.icon-iconmore-copy,
|
|
.icon-follow {
|
|
font-size: 22rpx;
|
|
}
|
|
|
|
.icon-follow,
|
|
.icon-task,
|
|
.icon-tel {
|
|
margin-right: 5rpx;
|
|
}
|
|
|
|
.icon-iconmore-copy {
|
|
margin-left: 5rpx;
|
|
margin-top: 2rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.icon_creat {
|
|
position: fixed;
|
|
z-index: 1;
|
|
bottom: 100rpx;
|
|
right: 100rpx;
|
|
|
|
image {
|
|
width: 80rpx;
|
|
height: 80rpx;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
</style>
|