|
|
@@ -0,0 +1,346 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <view class="top-fixed">
|
|
|
+ <view class="search-box ddflex">
|
|
|
+ <view class="search-input ddflex fflex">
|
|
|
+ <image src="/static/images/ssico.png"></image>
|
|
|
+ <input @confirm="searchFn" confirm-type="search" @input="searchFn" v-model="searchVal" class="fflex"
|
|
|
+ placeholder="请输入关键词" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="filter ddflex">
|
|
|
+ <view :class="'filter-item fflex ddflex '+(filterType==2&&isShowPop?'f-active':'')" @click="changeFilterType(2)">
|
|
|
+ <text style="max-width: 150rpx;" class="tover">{{stateIndex!=-1?stateList[stateIndex].label:'智能筛选'}}</text>
|
|
|
+ <image class="filter-item-icon" :style="filterType==2&&isShowPop?'transform: rotate(180deg);':''" src="../static/images/down.png"></image>
|
|
|
+ </view>
|
|
|
+ <view :class="'filter-item fflex ddflex '+(filterType==1&&isShowPop?'f-active':'')" @click="changeFilterType(1)">
|
|
|
+ 筛选
|
|
|
+ <image class="filter-item-icon" :style="filterType==1&&isShowPop?'transform: rotate(180deg);':''" src="../static/images/down.png"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <view class="ceng" v-if="isShowPop" @click="hidePop()"></view>
|
|
|
+
|
|
|
+ <view class="hx-pop" :style="'top:calc(' +popBottom+' + '+(isShowPop?190:0)+'rpx' ">
|
|
|
+ <view class="pop-con" v-if="filterType==1">
|
|
|
+ <view class="pop-list">
|
|
|
+ <view v-for="(item, index) in dateList" :key="index" style="margin-bottom: 30rpx;">
|
|
|
+ <view>{{ item.title }}</view>
|
|
|
+ <view class="ddflex">
|
|
|
+ <view :class="'opt' + (it.isActive? ' opt-active' : '')" v-for="(it, idx) in item.option" :key="idx" @click="switchFilterType(index,idx)">
|
|
|
+ <view>{{ it.label }}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="pop-con" v-if="filterType==2">
|
|
|
+ <view class="pop-list">
|
|
|
+ <view :class="'li' + (stateIndex == index ? ' active' : '')" v-for="(item, index) in stateList" :key="index" @click="switchType(index)">
|
|
|
+ {{ item.label }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="pop-btn ddflex" v-if="filterType!=2">
|
|
|
+ <view @click="reset">重置</view>
|
|
|
+ <view class="fflex" @click="confirm">确定</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view style="height: 190rpx;"></view>
|
|
|
+ <!-- 订单列表 -->
|
|
|
+ <view style="position: relative;overflow: hidden;" v-if="dataList.length>0">
|
|
|
+ <view class="register-box" v-for="item,index in dataList" :key="index" @click="jumpUrl('/mine/clientDetail/clientDetail?id='+item.id)">
|
|
|
+ <view class="register-title dflex fflex">
|
|
|
+ <image class="register-title-icon" :src="item.avatar?item.avatar:'/static/images/userimg.png'"></image>
|
|
|
+ <view class="flex" style="min-width: 0;">
|
|
|
+ <view class="ddflex">
|
|
|
+ <view class="card-name fflex tover">{{item.nickName?item.nickName:''}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="ddflex" style="margin-top: 4rpx;">
|
|
|
+ <view class="card-tag">客户</view>
|
|
|
+ <view class="card-tag">高价值</view>
|
|
|
+ </view>
|
|
|
+ <view class="ddflex" style="font-size: 24rpx;color: #999;font-weight: 400;margin: 20rpx 0;">
|
|
|
+ <text>保单</text><text style="color: #000000;">{{item.warrantyCount?item.warrantyCount:0}}</text>
|
|
|
+ <view class="card-line" style="height: 23rpx;margin: 0 10rpx;"></view>
|
|
|
+ <text>共计保费</text><text style="color: #FF5700;">{{item.warrantyMoney?item.warrantyMoney:0}}元</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ddflex" style="margin-top: 41rpx;font-size: 24rpx;padding: 0 30rpx;">
|
|
|
+ <view class="ddflex fflex">
|
|
|
+ <view style="color: #999;margin-right: 16rpx;">服务策略</view>
|
|
|
+ <view style="color: #333333;">刺激消费频率</view>
|
|
|
+ </view>
|
|
|
+ <view v-if="item.mobile">
|
|
|
+ <image style="width: 140rpx;height: 64rpx;margin-left: 20rpx;" src="/mine/static/images/lx.png" @click.stop="goPhone(item.mobile)"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-else class="nodata">
|
|
|
+ <image src="../../card/static/images/empty.png" mode="widthFix"></image>
|
|
|
+ <view>暂无数据</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ const app = getApp();
|
|
|
+ const req = require("../../utils/request.js");
|
|
|
+ const util = require('../../utils/util.js');
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {},
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+
|
|
|
+ filterType:null,
|
|
|
+
|
|
|
+ popBottom: '-100%',
|
|
|
+ isShowPop: false,
|
|
|
+
|
|
|
+ dateIndex: -1,
|
|
|
+ // 时间类型 1、今日 2、昨日 3、近7日 4、近30天 5、本月 6、本季度 7、本年度
|
|
|
+ dateList: [
|
|
|
+ {
|
|
|
+ title:'性别',
|
|
|
+ key:'sex',
|
|
|
+ option:[
|
|
|
+ {
|
|
|
+ label: '男',
|
|
|
+ value: 1
|
|
|
+ },{
|
|
|
+ label: '女',
|
|
|
+ value: 2
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ },{
|
|
|
+ title:'客户标签',
|
|
|
+ key:'job',
|
|
|
+ option:[
|
|
|
+ {
|
|
|
+ label: '经理',
|
|
|
+ value: 1
|
|
|
+ },{
|
|
|
+ label: '负责人',
|
|
|
+ value: 2
|
|
|
+ },{
|
|
|
+ label: '业务员',
|
|
|
+ value: 3
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+
|
|
|
+ stateIndex: 0,
|
|
|
+ stateList:[{
|
|
|
+ label: '智能推荐',
|
|
|
+ value: null
|
|
|
+ },{
|
|
|
+ label: '保费从高到低',
|
|
|
+ value: 'avage'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '保费从低到高',
|
|
|
+ value: 'bCount',
|
|
|
+ behavior:4
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '保单从高到低',
|
|
|
+ value: 'bCount',
|
|
|
+ behavior:3
|
|
|
+ },{
|
|
|
+ label: '保单从低到高',
|
|
|
+ value: 'bCount',
|
|
|
+ behavior:3
|
|
|
+ }],
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ isLoad: true,
|
|
|
+ searchVal: '',
|
|
|
+ dataList: [],
|
|
|
+ isReference:false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async onLoad(options) {
|
|
|
+ await this.getDict()
|
|
|
+ this.getDataList()
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ if(this.isReference){
|
|
|
+ this.isReference = false
|
|
|
+ this.page=1;
|
|
|
+ this.isLoad = true
|
|
|
+ this.getDataList();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ this.page++;
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ jumpUrl(url) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: url
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getDict(){
|
|
|
+ return new Promise((r,j)=>{
|
|
|
+ req.getRequest('/api/other/dict/info',{dictType:'job'},res=>{
|
|
|
+ this.dateList.map(item=>{
|
|
|
+ if(item.key=='job'){
|
|
|
+ item.option = []
|
|
|
+ res.map(it=>{
|
|
|
+ item.option.push({
|
|
|
+ label:it.dictName,
|
|
|
+ value:it.dictValue
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ r(res)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 切换筛选类型
|
|
|
+ changeFilterType(type){
|
|
|
+ // if(this.filterType==type) return false
|
|
|
+ this.filterType = type
|
|
|
+ if(type==3) {
|
|
|
+ this.hidePop()
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.openPop()
|
|
|
+ },
|
|
|
+ // 打开弹窗
|
|
|
+ openPop(){
|
|
|
+ this.isShowPop = true
|
|
|
+ this.popBottom = '0%'
|
|
|
+ },
|
|
|
+ // 关闭弹窗
|
|
|
+ hidePop() {
|
|
|
+ this.isShowPop = false;
|
|
|
+ this.popBottom = '-100%';
|
|
|
+ },
|
|
|
+
|
|
|
+ // 筛选
|
|
|
+ switchType(index) {
|
|
|
+ if (this.stateIndex == index) return false;
|
|
|
+ this.stateIndex = index;
|
|
|
+ this.confirm()
|
|
|
+ },
|
|
|
+ switchFilterType(index,idx) {
|
|
|
+ if(!this.dateList[index].option[idx].isActive){
|
|
|
+ this.dateList[index].option.map(item=>{
|
|
|
+ item.isActive = false
|
|
|
+ })
|
|
|
+ this.dateList[index].option[idx].isActive = true
|
|
|
+ }else{
|
|
|
+ this.dateList[index].option[idx].isActive = false
|
|
|
+ }
|
|
|
+ this.dateList = JSON.parse(JSON.stringify(this.dateList))
|
|
|
+ },
|
|
|
+ confirm() {
|
|
|
+ this.hidePop();
|
|
|
+ this.isLoad = true;
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ reset() {
|
|
|
+ this.dateIndex = -1;
|
|
|
+ this.stateIndex = 0;
|
|
|
+ this.dateList.map(item=>{
|
|
|
+ item.option.map(it=>{
|
|
|
+ it.isActive = false
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.dateList = JSON.parse(JSON.stringify(this.dateList))
|
|
|
+ },
|
|
|
+ // 分页查询
|
|
|
+ getDataList() {
|
|
|
+ if (!this.isLoad) return false;
|
|
|
+ this.isLoad = false;
|
|
|
+ let queryParams = {
|
|
|
+ page: this.page,
|
|
|
+ limit: this.limit,
|
|
|
+ latitude: this.latitude,
|
|
|
+ longitude: this.longitude,
|
|
|
+ }
|
|
|
+ if (this.searchVal) {
|
|
|
+ queryParams.realName = this.searchVal
|
|
|
+ }
|
|
|
+ // 筛选
|
|
|
+ if (this.dateIndex != -1) {
|
|
|
+ queryParams.dateType = this.dateList[this.dateIndex].value;
|
|
|
+ }else if (this.dateIndex == -1) {
|
|
|
+ } else {
|
|
|
+ queryParams.dateType = 8
|
|
|
+ queryParams.end = this.endTime?this.endTime:null;
|
|
|
+ queryParams.start = this.startTime?this.startTime:null;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 状态筛选
|
|
|
+ if (this.stateIndex != -1) {
|
|
|
+ queryParams.orderFiled = this.stateList[this.stateIndex].value;
|
|
|
+ if(this.stateList[this.stateIndex].behavior){
|
|
|
+ queryParams.behavior = this.stateList[this.stateIndex].behavior;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.dateList.map(item=>{
|
|
|
+ if(item.key=="sex"){
|
|
|
+ let sl = item.option.filter(it=>{return it.isActive})
|
|
|
+ if(sl.length>0){
|
|
|
+ queryParams.gender = sl[0].value
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(item.key=="job"){
|
|
|
+ let jl = item.option.filter(it=>{return it.isActive})
|
|
|
+ if(jl.length>0){
|
|
|
+ queryParams.job = jl[0].value
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ req.getRequest('/api/user/getUserBySaleNo', queryParams, data => {
|
|
|
+ data = data.list
|
|
|
+ if (data != null && data.length == this.limit) {
|
|
|
+ this.isLoad = true;
|
|
|
+ }
|
|
|
+ if (this.page == 1) {
|
|
|
+ this.dataList = [];
|
|
|
+ }
|
|
|
+ if (this.page > 0) {
|
|
|
+ data = this.dataList.concat(data);
|
|
|
+ }
|
|
|
+ this.dataList = data;
|
|
|
+ console.log('列表数据>>>', this.dataList);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 搜索
|
|
|
+ searchFn() {
|
|
|
+ this.page = 1;
|
|
|
+ this.isLoad = true;
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ // 拨打电话
|
|
|
+ goPhone(phone) {
|
|
|
+ if(!phone) return false
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: phone,
|
|
|
+ success(res){
|
|
|
+ }
|
|
|
+ }); // 传参带入号码即可
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ @import "./clientManage.css";
|
|
|
+</style>
|