|
|
@@ -0,0 +1,428 @@
|
|
|
+<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="fflex">
|
|
|
+ <picker mode="region" v-model="regionIndex" @change="regionChange">
|
|
|
+ <view :class="'filter-item fflex ddflex '+(areaIndex!=-1?'f-active':'')" @click="changeFilterType(3)">
|
|
|
+ <text style="max-width: 150rpx;" class="tover">{{regionText?regionText:'地区'}}</text>
|
|
|
+ <image class="filter-item-icon" :style="filterType==1&&isShowPop?'transform: rotate(180deg);':''" src="../static/images/down.png"></image>
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ </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.realName?item.realName:''}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="ddflex" style="margin-top: 4rpx;">
|
|
|
+ <view class="card-tag">{{ item.jobName }}</view>
|
|
|
+ <view class="card-tag">入司{{item.inDate?monthDayDiff(item.inDate):'1年'}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="ddflex" style="font-size: 24rpx;color: #999;font-weight: 400;margin: 20rpx 0;">
|
|
|
+ <text>保单</text><text style="color: #000000;">1</text>
|
|
|
+ <view class="card-line" style="height: 23rpx;margin: 0 10rpx;"></view>
|
|
|
+ <text>共计保费</text><text style="color: #FF5700;">139元</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>
|
|
|
+ <image style="width: 140rpx;height: 64rpx;margin-left: 20rpx;" src="/mine/static/images/lx.png"></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');
|
|
|
+ const QQMapWX = require("../../utils/qqmap.js");
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {},
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ statusBarHeight:0,
|
|
|
+
|
|
|
+ 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:'inDate',
|
|
|
+ option:[
|
|
|
+ {
|
|
|
+ label: '1~2年',
|
|
|
+ value: 1
|
|
|
+ },{
|
|
|
+ label: '2~3年',
|
|
|
+ value: 2
|
|
|
+ },{
|
|
|
+ label: '3~4年',
|
|
|
+ value: 3
|
|
|
+ },{
|
|
|
+ label: '4年以上',
|
|
|
+ value: 4
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },{
|
|
|
+ title:'职务',
|
|
|
+ key:'job',
|
|
|
+ option:[
|
|
|
+ {
|
|
|
+ label: '经理',
|
|
|
+ value: 1
|
|
|
+ },{
|
|
|
+ label: '负责人',
|
|
|
+ value: 2
|
|
|
+ },{
|
|
|
+ label: '业务员',
|
|
|
+ value: 3
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+
|
|
|
+ ],
|
|
|
+ startTime: '',
|
|
|
+ endTime: '',
|
|
|
+
|
|
|
+ regionText:'',
|
|
|
+ regionCode:[],
|
|
|
+ areaIndex:-1,
|
|
|
+
|
|
|
+ stateIndex: 0,
|
|
|
+ stateList:[{
|
|
|
+ label: '智能推荐',
|
|
|
+ value: null
|
|
|
+ },{
|
|
|
+ label: '评价分从高到低',
|
|
|
+ value: 'avage'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '浏览量从高到低',
|
|
|
+ value: 'bCount',
|
|
|
+ behavior:4
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '点赞量从高到低',
|
|
|
+ value: 'bCount',
|
|
|
+ behavior:3
|
|
|
+ }],
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ isLoad: true,
|
|
|
+ searchVal: '',
|
|
|
+ dataList: [],
|
|
|
+ isReference:false,
|
|
|
+ latitude: '23.027923',
|
|
|
+ longitude: '113.753815',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ QQMapWX.initMap();
|
|
|
+ req.getLocation(async res => {
|
|
|
+ const to = {
|
|
|
+ latitude: res.latitude,
|
|
|
+ longitude: res.longitude
|
|
|
+ };
|
|
|
+ this.latitude = res.latitude;
|
|
|
+ this.longitude = res.longitude;
|
|
|
+ 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))
|
|
|
+ },
|
|
|
+ regionChange(e){
|
|
|
+ this.regionText = e.detail.value.join('')
|
|
|
+ this.regionCode = e.detail.code
|
|
|
+ this.confirm()
|
|
|
+ },
|
|
|
+ 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))
|
|
|
+ this.regionText=''
|
|
|
+ this.regionCode=[]
|
|
|
+ },
|
|
|
+ // 分页查询
|
|
|
+ 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;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(this.regionCode.length>0){
|
|
|
+ queryParams.areaCode = this.regionCode[2]
|
|
|
+ }
|
|
|
+ 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
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(item.key=="inDate"){
|
|
|
+ console.log('indate')
|
|
|
+ let il = item.option.filter(it=>{return it.isActive})
|
|
|
+ console.log(il)
|
|
|
+ if(il.length>0){
|
|
|
+ let d = il[0].value
|
|
|
+ if(d==4){
|
|
|
+ queryParams.endTime = this.getYear(d+1)
|
|
|
+ }else{
|
|
|
+ queryParams.startTime = this.getYear(d)
|
|
|
+ queryParams.endTime = this.getYear(d+1)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(item.key=="job"){
|
|
|
+ // queryParams.gender = item.option.filter(it=>{return it.isActive})[0].value
|
|
|
+ }
|
|
|
+ })
|
|
|
+ req.getRequest('/api/visiting/card/cardInfoList', 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);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getYear(index){
|
|
|
+ let dateTime = new Date().getFullYear(); /* 获取现在的年份 */
|
|
|
+ dateTime = new Date(new Date().setFullYear(dateTime-index))
|
|
|
+ let y = dateTime.getFullYear()
|
|
|
+ let m = dateTime.getMonth()+1<10?('0'+(dateTime.getMonth()+1)):dateTime.getMonth()+1
|
|
|
+ let d = dateTime.getDate()<10?('0'+(dateTime.getDate())):dateTime.getDate()
|
|
|
+ return y+'-'+m+'-'+d
|
|
|
+ },
|
|
|
+ // 搜索
|
|
|
+ searchFn() {
|
|
|
+ this.page = 1;
|
|
|
+ this.isLoad = true;
|
|
|
+ this.getDataList();
|
|
|
+ },
|
|
|
+ formatTimeFn(data) {
|
|
|
+ if (data) {
|
|
|
+ return utils.formatTimeCommStr(data, 'Y-M-D')
|
|
|
+ } else {
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ monthDayDiff(date) {
|
|
|
+ return util.monthDayDiff(date)
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ const systemInfo = uni.getSystemInfoSync();
|
|
|
+ // px转换到rpx的比例
|
|
|
+ let pxToRpxScale = 750 / systemInfo.windowWidth;
|
|
|
+ this.statusBarHeight = uni.getSystemInfoSync().windowTop*pxToRpxScale
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ @import "./clientManage.css";
|
|
|
+</style>
|
xhj
