hengmei-one/pagesB/customerCheck/customerCheck.vue

126 lines
4.1 KiB
Vue
Raw Normal View History

2021-10-25 01:49:51 +00:00
<template>
<view>
<!-- 状态栏 -->
<status-nav :titleVal="'客服查询'" :statusTitle="true"></status-nav>
<!-- 自定义二级分类 -->
<!-- 列表 -->
<view :style="{paddingTop: statusHNH+'px'}" class="pad-zy30">
<view class="radius20 fon28 col3 mar-sx20">
<view class="disac">
<view class="disjbac width100 radius10 pad-zy20 xialak bacf">
<input class="fon28 width100" type="text" @confirm="searchEv" v-model="keyword" placeholder="客户的手机号/微信昵称查找" placeholder-style="color: #B3B3B3;" />
</view>
<view @tap="searchEv" class="flexs tc mar-z30 colf radius10 customer-btn" :style="{background:publicColor}">搜索</view>
</view>
</view>
<!-- 列表 -->
<view class="bacf radius10 pad20 mar-x20 fon28" v-for="(item,index) in dataList" :key="index">
<view class="col3 bold">客户信息</view>
<view class="mar-sx20 fon24 disjbac col6">
2021-11-05 08:49:56 +00:00
<text class="clips1">昵称{{item.customer_name}}</text>
<text class="flexs mar-z20"><text v-if="item.customer_phone!=''">{{item.customer_phone}}</text><text v-else></text></text>
2021-10-25 01:49:51 +00:00
</view>
<view class="col3 bold">绑定的客服</view>
2021-11-05 08:49:56 +00:00
<view v-if="item.service!=null" class="mar-s20 fon24 disjbac col6">
<text class="clips1">昵称{{item.service.name}}</text>
<text class="flexs mar-z20" v-if="item.service.phone!=''">{{item.service.phone}}</text>
2021-10-25 01:49:51 +00:00
</view>
2021-11-05 08:49:56 +00:00
<!-- <view v-else class="mar-s20 fon24 disjbac col6">
2021-10-25 01:49:51 +00:00
<text>昵称{{item.account.nickname}}</text>
<text><text v-if="item.account.mobile!=''">{{item.account.mobile}}</text><text v-else></text></text>
2021-11-05 08:49:56 +00:00
</view> -->
2021-10-25 01:49:51 +00:00
</view>
<view v-if="dataList.length==0" class="disjcac fc" style="margin-top: 50%;">
<image class="zanw-img" src="/static/public/nothing.png" mode="aspectFill"></image>
<view class="fon24 col3">您搜索的内容暂无结果换个关键词试试吧</view>
</view>
<!-- 返回顶部 -->
<back-top :showTop="showTop" @backTop="backTop"></back-top>
</view>
<!-- 底部客服 -->
<public-customer :nbottom="100"></public-customer>
</view>
</template>
<script>
export default {
data() {
return {
statusHNH:uni.getStorageSync('statusHNH'),
publicColor:uni.getStorageSync('publicColor'),//主题颜色
dataList:[],//数据列表
showTop:false,//是否显示返回顶部的箭头
keyword:'',//关键词
page:1,
size:10,
total:'',//总数
isZanw:true,
ntype:''//类型 mine=自己绑定的客户 否则是全部
}
},
onPageScroll(e) {
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
},
onReachBottom() {//触底事件
if(this.total!=this.dataList.length){
this.page++
this.checkList()
} else {
if(this.isZanw) this.$toolAll.tools.showToast('暂无更多客服数据')
this.isZanw = false
}
},
onShow() {
this.$toolAll.tools.isLogin()
},
onLoad() {
this.checkList()
},
methods: {
searchEv(){//搜索事件
if(this.keyword!='') this.ntype = ''
this.page = 1
this.isZanw = true
this.checkList()
},
checkList(){//查询列表事件
let params = {
page:this.page,
size:this.size,
type:this.ntype,//客户ID
keyword:this.keyword
}
this.$requst.post('user/get-bind-service-list',params).then(res=>{
// console.log('足迹列表查询:',res);
if(res.code==0){
if(this.page==1) this.dataList = []
this.total = res.data.total;
if(res.data.list.length!=0){
res.data.list.forEach(item=>{
let obj = {
id:item.account_id,
2021-11-05 08:49:56 +00:00
customer_name:item.nickname,
customer_phone:item.mobile,
service:item.service,
// staff:item.staff,//绑定的客服
// account:item.account//备用当staff不存在时调用
2021-10-25 01:49:51 +00:00
}
this.dataList.push(obj)
})
}
}
},error=>{})
},
backTop(){//回到顶部事件
uni.pageScrollTo({
scrollTop: 0,
duration: 300
});
},
}
}
</script>
<style>
</style>