Merge branch 'master' of https://gitee.com/jyyforjava/hive-app
8 files modified
1 files added
| | |
| | | color: #a5abaf; |
| | | } |
| | | .light-gray{ |
| | | color: #a7a7a7; |
| | | color: #d8d6d6; |
| | | } |
| | | .dark-gray{ |
| | | color: #3a3f3f; |
| | |
| | | <view :class="isShow?'dropdown-wrap-open':'dropdown-wrap-close'"> |
| | | <view class="mask" @touchmove.stop.prevent="moveHandle" @click.stop="hide"> |
| | | <view v-if="type===1" class="dropdown-wrap-con"> |
| | | <view v-for="(item, index) in list" class="flex justify-between"> |
| | | <text :class="index===0?'blue':''">{{item}}</text> |
| | | <text v-if="index===0" class="iconfont icongouxuan blue font-18"></text> |
| | | <view v-for="(item, index) in list" class="flex justify-between" @click="_changeItem(item, index)"> |
| | | <text :class="selectIndex==index?'blue':''">{{item.title}}</text> |
| | | <text v-if="selectIndex==index" class="iconfont icongouxuan blue font-18"></text> |
| | | </view> |
| | | </view> |
| | | <view v-else class="all-screen-wrap"> |
| | | <view v-for="(item, index) in list" class="all-screen"> |
| | | <view v-for="(item, index) in list" class="all-screen" @click.stop="show"> |
| | | <text class="title">{{item.title}}</text> |
| | | <view> |
| | | <text v-for="op in item.list" class="name">{{op.title}}</text> |
| | | <text class="name" |
| | | v-for="op in item.list" |
| | | :class="_handleActiveClass(item, op)" |
| | | @click="_chooseItem(item, op)"> |
| | | {{op.title}} |
| | | </text> |
| | | </view> |
| | | </view> |
| | | <view class="btn-group"> |
| | | <text class="btn">重置</text> |
| | | <text class="btn btn-blue">完成</text> |
| | | <text class="btn" @click="_reset">重置</text> |
| | | <text class="btn btn-blue" @click="_confirm">完成</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | }, |
| | | type: { |
| | | default: 1 //0表示全部筛选 |
| | | }, |
| | | filterKey: { |
| | | default: {} |
| | | } |
| | | }, |
| | | data(){ |
| | | return { |
| | | isShow: false |
| | | isShow: false, |
| | | selectItem: {}, |
| | | selectIndex: 0 |
| | | } |
| | | }, |
| | | created() { |
| | | |
| | | this.init(); |
| | | }, |
| | | methods:{ |
| | | moveHandle(){ |
| | | |
| | | }, |
| | | init(){ |
| | | this.selectItem = JSON.parse(JSON.stringify(this.filterKey)); |
| | | }, |
| | | show(){ |
| | | this.isShow = true; |
| | | }, |
| | | hide(){ |
| | | this.isShow = false |
| | | }, |
| | | // 普通下拉选择 |
| | | _changeItem(item, index){ |
| | | this.selectIndex = index; |
| | | this.$emit('confirm', item); |
| | | }, |
| | | |
| | | // 处理选项选中/不选中状态class |
| | | _handleActiveClass(item, option){ |
| | | return this.selectItem[item.key] == option.value?'active':''; |
| | | }, |
| | | // 选中筛选条件 |
| | | _chooseItem(item, option){ |
| | | if(this.selectItem[item.key] === option.value){ |
| | | this.selectItem[item.key] = '' |
| | | } else { |
| | | this.selectItem[item.key] = option.value; |
| | | } |
| | | }, |
| | | _reset(){ |
| | | this.init(); |
| | | this.$emit('reset'); |
| | | }, |
| | | _confirm(){ |
| | | this.$emit('confirm', this.selectItem); |
| | | } |
| | | } |
| | | } |
| | |
| | | } |
| | | .dropdown-wrap-con{ |
| | | background: #FFFFFF; |
| | | padding: 10px 10px; |
| | | padding: 5px 10px 10px; |
| | | font-size: 14px; |
| | | line-height: 32px; |
| | | color: #999999; |
| | |
| | | .all-screen .title{ |
| | | display: block; |
| | | font-size: 14px; |
| | | padding: 10px 0; |
| | | padding: 5px 0 10px; |
| | | color: #666666; |
| | | } |
| | | .all-screen .name{ |
| | | font-size: 12px; |
| | | font-size: 10px; |
| | | background: #F2f2f2; |
| | | color: #666666; |
| | | padding: 5px 10px; |
| | | min-width: 56px; |
| | | padding: 5px 0; |
| | | width: 160rpx; |
| | | box-sizing: border-box; |
| | | text-align: center; |
| | | display: inline-block; |
| | | margin-right: 10px; |
| | | border-radius: 2px; |
| | | margin-bottom: 5px; |
| | | margin-bottom: 8px; |
| | | } |
| | | .all-screen .name.active{ |
| | | background: #518EFF; |
| | | color: #FFFFFF; |
| | | } |
| | | .btn-group{ |
| | | display: flex; |
| | |
| | | <template> |
| | | <view class="search-group"> |
| | | <text class="iconfont iconsousuo"></text> |
| | | <input class="uni-input" confirm-type="search" :placeholder=placeholder placeholder-class="placeholder" /> |
| | | <input class="uni-input" confirm-type="search" @confirm="confirm" :placeholder="placeholder" placeholder-class="placeholder" /> |
| | | </view> |
| | | </template> |
| | | |
| | |
| | | export default { |
| | | props:{ |
| | | placeholder: { |
| | | default: '输入会员姓名、手机号、编号查询' |
| | | default: '输入会员姓名、手机号、会员编号、拼音' |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | }; |
| | | }, |
| | | methods:{ |
| | | confirm(e){ |
| | | this.$emit('confirm', e.detail.value); |
| | | } |
| | | } |
| | | |
| | | } |
| | | </script> |
| | | |
| | |
| | | <!-- 会员详情 --> |
| | | <view> |
| | | <view class="header flex flex-v align-center"> |
| | | <image class="header-img" src="../../static/images/head-img.jpg"></image> |
| | | <text class="font-18 mt-5">333</text> |
| | | <text class="font-14 mt-5">会员编号: 101010</text> |
| | | <image class="avatar" :src="memberInfo.photo?memberInfo.photo:'../../static/images/default-avatar.png'"></image> |
| | | <text class="font-18 mt-5">{{memberInfo.vipName}}</text> |
| | | <text class="font-14 mt-5">会员编号: {{memberInfo.vipNo}}</text> |
| | | <view class="flex align-center mt-5"> |
| | | <text class="font-12 mr-10">{{handlePhone(15569216885)}}</text> |
| | | <text class="font-12 mr-10">{{handlePhone(memberInfo.phone)}}</text> |
| | | <text class="icon iconfont" :class="isHidePhone?'iconyanjing':'iconyanjing1'" @click="isHidePhone=!isHidePhone"></text> |
| | | </view> |
| | | <view class="flex mt-10"> |
| | |
| | | <view class="content"> |
| | | <view class="content-row flex justify-around"> |
| | | <view class="center"> |
| | | <text class="font-18 red">600.00</text> |
| | | <text class="font-18 red">{{memberInfo.totalBalance}}</text> |
| | | <text class="font-14 mt-10 block">余额</text> |
| | | </view> |
| | | <view class="center"> |
| | | <text class="font-18 green">600.00</text> |
| | | <text class="font-18 green">{{memberInfo.giftBalance}}</text> |
| | | <text class="font-14 mt-10 block">赠送余额</text> |
| | | </view> |
| | | <view class="center"> |
| | | <text class="font-18 blue">600.00</text> |
| | | <text class="font-18 blue">{{memberInfo.totalShopping}}</text> |
| | | <text class="font-14 mt-10 block">累计消费</text> |
| | | </view> |
| | | </view> |
| | | <view class="content-row flex flex-wrap"> |
| | | <view class="detail-item"> |
| | | <navigator url="./editMember" hover-class="none" > |
| | | <navigator :url="'./editMember?id='+id" hover-class="none" > |
| | | <image class="detail-icon" mode="aspectFit" src="../../static/images/member-detail1.png"></image> |
| | | <text class="mt-5">会员信息</text> |
| | | </navigator> |
| | |
| | | export default{ |
| | | data(){ |
| | | return{ |
| | | isHidePhone: true |
| | | isHidePhone: true, |
| | | id: '', |
| | | memberInfo: {} |
| | | } |
| | | }, |
| | | onLoad(options) { |
| | | this.id = options.id; |
| | | }, |
| | | onShow() { |
| | | this.loadMemberInfo() |
| | | }, |
| | | methods:{ |
| | | loadMemberInfo(){ |
| | | this.$httpUtils.request('/api/vip/findVipInfoById/'+this.id).then((res) => { |
| | | if(res.status == 200){ |
| | | this.memberInfo = res.mapInfo.vipInfo; |
| | | } |
| | | }) |
| | | }, |
| | | handlePhone(val){ |
| | | if(this.isHidePhone){ |
| | | return this.$utils.encryptAccount(val); |
| | | } |
| | | return val; |
| | | }, |
| | | // 打电话 |
| | | call(){ |
| | | uni.makePhoneCall({ |
| | | phoneNumber: '15200889645', |
| | | success: (res) => { |
| | | |
| | | }, |
| | | fail: (err) => { |
| | | |
| | | } |
| | | phoneNumber: this.memberInfo.phone |
| | | }) |
| | | }, |
| | | // 发信息 |
| | | sendMessage(){ |
| | | // #ifdef APP-PLUS |
| | | let msg = plus.messaging.createMessage(plus.messaging.TYPE_SMS); |
| | | msg.to = ['15200889645']; |
| | | msg.body = 'This is HTML5 Plus example test message'; |
| | | msg.to = [this.memberInfo.phone]; |
| | | msg.body = ''; |
| | | plus.messaging.sendMessage(msg); |
| | | // #endif |
| | | } |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | |
| | | border-bottom-right-radius: 20px; |
| | | padding: 0 15px 15px; |
| | | } |
| | | .header-img{ |
| | | width: 80px; |
| | | height: 80px; |
| | | .avatar{ |
| | | width: 60px; |
| | | height: 60px; |
| | | border-radius: 50%; |
| | | } |
| | | .icon-box{ |
| | |
| | | <template> |
| | | <view class="container"> |
| | | <form @submit="add"> |
| | | <form @submit="submit" id="list"> |
| | | <view class="input-group-row"> |
| | | <text class="label">会员姓名<text class="require">*</text></text> |
| | | <input name="account" type="text" value="" placeholder="请填写会员姓名" placeholder-class='placeholder'/> |
| | | <input name="vipName" v-model="formData.vipName" type="text" maxlength="20" placeholder="请填写会员姓名" placeholder-class='placeholder'/> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">会员编号<text class="require">*</text></text> |
| | | <input name="vipNo" v-model="formData.vipNo" type="text" maxlength="10" placeholder="请填写会员编号" placeholder-class='placeholder'/> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">手机号码<text class="require">*</text></text> |
| | | <input name="account" type="number" value="" placeholder="请填写手机号码" placeholder-class='placeholder'/> |
| | | <input name="phone" v-model="formData.phone" type="number" maxlength="11" placeholder="请填写手机号码" placeholder-class='placeholder'/> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">性别<text class="require">*</text></text> |
| | | <view class="right-text"> |
| | | <radio-group @change="sexChange"> |
| | | <label><radio name="sex" value="1" color="#518EFF" class="radio" checked/>男</label> |
| | | <label><radio name="sex" value="2" color="#518EFF" class="radio"/>女</label> |
| | | <radio-group name="sex"> |
| | | <label><radio value="男" color="#518EFF" class="radio" :checked="formData.sex==='男'"/>男</label> |
| | | <label><radio value="女" color="#518EFF" class="radio" :checked="formData.sex==='女'"/>女</label> |
| | | </radio-group> |
| | | </view> |
| | | </view> |
| | |
| | | <text class="label">生日</text> |
| | | <view class="right-text"> |
| | | <picker mode="date" @change="dateChange" :end="endDate"> |
| | | <view>{{birthday}}</view> |
| | | <text :class="formData.birthday?'':'gray'">{{formData.birthday?formData.birthday:'请选择生日'}}</text> |
| | | </picker> |
| | | </view> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">省市区</text> |
| | | <view @click="openAddres" class="right-text"> |
| | | <text v-if="regionText">{{regionText}}</text> |
| | | <text v-else class="gray">请选择省市区</text> |
| | | <text :class="formData.areas?'':'gray'">{{formData.areas?formData.areas:'请选择省市区'}}</text> |
| | | </view> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">详细地址</text> |
| | | <input name="account" type="text" value="" placeholder="请填写详细地址" placeholder-class='placeholder'/> |
| | | <input name="address" v-model="formData.address" type="text" value="" placeholder="请填写详细地址" placeholder-class='placeholder'/> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">到店途径</text> |
| | | <view class="right-text"> |
| | | <picker mode="selector" :range="wayList" @change="wayChange"> |
| | | <picker mode="selector" range-key="value" :range="arrivalWayList" @change="wayChange"> |
| | | <view> |
| | | {{way}} |
| | | <text :class="formData.arrivalWay?'':'gray'">{{formData.arrivalWay?formData.arrivalWay:'请选择到店途径'}}</text> |
| | | <text class="iconfont iconjiantouarrow486 gray"></text> |
| | | </view> |
| | | </picker> |
| | |
| | | <view class="input-group-row"> |
| | | <text class="label">推荐人</text> |
| | | <view class="right-text"> |
| | | <picker mode="selector" :range="referrerList" @change="referrerChange"> |
| | | <picker mode="selector" range-key="vipName" :range="referrerList" @change="referrerChange"> |
| | | <view> |
| | | {{referrer}} |
| | | <text :class="recommendName?'':'gray'">{{recommendName?recommendName:'请选择推荐人'}}</text> |
| | | <text class="iconfont iconjiantouarrow486 gray"></text> |
| | | </view> |
| | | </picker> |
| | |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">备注</text> |
| | | <input name="account" type="text" value="" placeholder="请填写备注" placeholder-class='placeholder'/> |
| | | <input name="remark" v-model="formData.remark" maxlength="60" type="text" placeholder="请填写备注" placeholder-class='placeholder'/> |
| | | </view> |
| | | <view class="input-group-row"> |
| | | <text class="label">标签</text> |
| | | <view class="right-text"> |
| | | <text class="tag">大方<text class="iconfont iconguanbi gray"></text></text> |
| | | <text class="tag">大方<text class="iconfont iconguanbi gray"></text></text> |
| | | <!-- <text class="tag">大方<text class="iconfont iconguanbi gray"></text></text> --> |
| | | </view> |
| | | </view> |
| | | <button type="submit" class="blue-btn sticky-footer">保存</button> |
| | | <button form-type="submit" :disabled="isDisabled" class="blue-btn sticky-footer">保存</button> |
| | | </form> |
| | | <region ref="simpleAddress" @onConfirm="addressChange" themeColor="#518EFF" cancelColor="#8c9fad"></region> |
| | | </view> |
| | |
| | | }, |
| | | data(){ |
| | | return { |
| | | birthday: '1990-01-02', |
| | | regionText: '', |
| | | wayList: ['美团','户外广告'], |
| | | way: '美团', |
| | | referrerList: ['张三'], |
| | | referrer: '张三' |
| | | formData: { |
| | | vipName: '', |
| | | vipNo: '', |
| | | phone: '', |
| | | sex: '女', |
| | | birthday: '', |
| | | areas: '', |
| | | address: '', |
| | | arrivalWay: '', |
| | | recommendId: '', |
| | | remark: '', |
| | | labels: [] |
| | | }, |
| | | id: '', |
| | | isDisabled: false, |
| | | arrivalWayList: [], |
| | | referrerList: [], |
| | | recommendName: '' |
| | | } |
| | | }, |
| | | onLoad(options) { |
| | | if(options.id){ |
| | | this.id = options.id; |
| | | uni.setNavigationBarTitle({ |
| | | title: '编辑会员' |
| | | }); |
| | | this.getMemberInfo() |
| | | } |
| | | this.loadArrivalWayList(); |
| | | this.loadReferrerList(); |
| | | }, |
| | | computed: { |
| | | endDate() { |
| | |
| | | } |
| | | }, |
| | | methods:{ |
| | | add(){ |
| | | |
| | | // 加载到店途径列表 |
| | | loadArrivalWayList(){ |
| | | this.$httpUtils.request('/api/vip/findArrivalWayList').then((res) => { |
| | | if(res.status == 200){ |
| | | this.arrivalWayList = res.rows; |
| | | } |
| | | }) |
| | | }, |
| | | sexChange(e){ |
| | | console.log(e) |
| | | // 加载推荐人列表 |
| | | loadReferrerList(){ |
| | | this.$httpUtils.request('/api/vip/findAllVipInfo').then((res) => { |
| | | if(res.status == 200){ |
| | | this.referrerList = res.rows; |
| | | if(this.id){ |
| | | for(var i in this.referrerList){ |
| | | if(this.referrerList[i].id === this.formData.recommendId){ |
| | | this.recommendName = this.referrerList[i].vipName; |
| | | break; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | // 查询会员详情 |
| | | getMemberInfo(){ |
| | | this.$httpUtils.request('/api/vip/findVipInfoDetailById/'+this.id).then((res) => { |
| | | if(res.status == 200){ |
| | | const result = res.mapInfo.vipInfo; |
| | | const {province, city, area} = result; |
| | | for(var key in this.formData){ |
| | | this.formData[key] = result[key]; |
| | | } |
| | | let arr = [province, city, area].filter((item) => { |
| | | return item |
| | | }) |
| | | this.formData.areas = arr.join('-') |
| | | } |
| | | }) |
| | | }, |
| | | dateChange(e){ |
| | | this.birthday = e.detail.value; |
| | | console.log(e) |
| | | this.formData.birthday = e.detail.value; |
| | | }, |
| | | getDate(type) { |
| | | const date = new Date(); |
| | |
| | | this.$refs.simpleAddress.open(); |
| | | }, |
| | | addressChange(e){ |
| | | this.regionText = e.labelArr.join(' '); |
| | | this.formData.areas = e.labelArr.join('-'); |
| | | }, |
| | | wayChange(e){ |
| | | this.way = this.wayList[e.detail.value]; |
| | | this.formData.arrivalWay = this.arrivalWayList[e.detail.value].value; |
| | | }, |
| | | referrerChange(e){ |
| | | this.referrer = this.referrerList[e.detail.value]; |
| | | } |
| | | this.formData.recommendId = this.referrerList[e.detail.value].id; |
| | | this.recommendName = this.referrerList[e.detail.value].vipName; |
| | | }, |
| | | valid(){ |
| | | const {vipName, vipNo, phone, sex} = this.formData; |
| | | if(!vipName){ |
| | | this.$toast.info('请填写会员姓名'); |
| | | return false; |
| | | } |
| | | if(!vipNo){ |
| | | this.$toast.info('请填写会员编号'); |
| | | return false; |
| | | } |
| | | if(!this.$utils.checkPhone(phone)){ |
| | | this.$toast.info('请填写正确的手机号码'); |
| | | return false; |
| | | } |
| | | if(!sex){ |
| | | this.$toast.info('请选择性别'); |
| | | return false; |
| | | } |
| | | }, |
| | | submit(e){ |
| | | let url = ''; |
| | | if(this.valid() === false){ |
| | | return; |
| | | } |
| | | this.isDisabled = true; |
| | | if(this.id){ |
| | | url = '/api/vip/modifyVip'; |
| | | Object.assign(this.formData, {vipId: this.id}) |
| | | } else { |
| | | url = '/api/vip/addVip'; |
| | | } |
| | | this.$httpUtils.request(url, this.formData, 'POST').then((res) => { |
| | | if(res.status == 200){ |
| | | uni.navigateBack() |
| | | } |
| | | this.$toast.info(res.info); |
| | | this.isDisabled = false; |
| | | }).catch(() => { |
| | | this.isDisabled = false; |
| | | }) |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | |
| | | <!-- #ifndef H5 --> |
| | | <view class="status_bar"></view> |
| | | <!-- #endif --> |
| | | <search-bar></search-bar> |
| | | <search-bar @confirm="search"></search-bar> |
| | | <view class="sort-wrap"> |
| | | <view @click="filterCustom(1)"> |
| | | <text>本月到店次数</text> |
| | | <view @click="showFilterCustom(1)"> |
| | | <text>{{filterText}}</text> |
| | | <text class="iconfont iconjiantouarrow486 gray"></text> |
| | | </view> |
| | | <view @click="filterCustom(3)"> |
| | | <view @click="showFilterCustom(2)"> |
| | | <text>筛选</text> |
| | | <text class="iconfont iconshaixuan gray"></text> |
| | | </view> |
| | | </view> |
| | | <filter-dropdown ref="filterDropdownEl" :list="filterList" :type="filterType"></filter-dropdown> |
| | | <view class="flex justify-between" @click="toDetail"> |
| | | <filter-dropdown ref="filterDropdownEl" :list="filterList" :filterKey="filterKeys" :type="filterType" @confirm="confirmFilter" @reset="resetFilter"></filter-dropdown> |
| | | <view class="flex justify-between"> |
| | | <view class="flex-1 mr-10"> |
| | | <view class="member-list flex align-center" v-for="(item, index) in 15"> |
| | | <text class="first-name" :style="{background: caculateBgcolor(index)}">李</text> |
| | | <navigator :url="'./detail?id='+item.id" hover-class="none" class="member-list" v-for="(item, index) in list"> |
| | | <text class="first-name" :style="{background: caculateBgcolor(index)}">{{item.vipName | formatName}}</text> |
| | | <view class="flex-1 flex align-center justify-between member-list-con"> |
| | | <view> |
| | | <text>李广</text> |
| | | <text class="ml-10">152****9645</text> |
| | | <view class="flex flex-v"> |
| | | <text>{{item.vipName}}</text> |
| | | <text class="font-13 gray mt-5">{{$utils.encryptAccount(item.phone)}}</text> |
| | | </view> |
| | | <view> |
| | | <text class="blue">30天未到店</text> |
| | | <text class="iconfont iconarrow-backimg gray"></text> |
| | | <text class="blue">到店{{item.arriveCnt || 0}}次</text> |
| | | <text class="iconfont iconarrow-backimg light-gray"></text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </navigator> |
| | | </view> |
| | | <indexed-list></indexed-list> |
| | | </view> |
| | |
| | | colors: ['#CCC6B4', '#C0CCB4', '#B4C2CC', '#BEB4CC', '#B4CCBE', '#B4CCCA', '#CCB4C6', '#CCB4B4'], |
| | | filterType: 1, |
| | | filterList: [], |
| | | filter1: ['本月到店次数(由低到高)','本月到店次数(由高到低)','本年到店次数(由低到高)','本年到店次数(由高到低)','本月消费(由高到低)','本月消费(由低到高)','本月消耗(由高到低)','本月消耗(由低到高)'], |
| | | filter2: ['7天内卡项到期','15天内卡项到期','30天内卡项到期'], |
| | | filter3: [{ |
| | | title: '到店途径', |
| | | filterText: '首字母排序', |
| | | filter1: [{ |
| | | title: '首字母排序', |
| | | key: '', |
| | | value: '' |
| | | },{ |
| | | title: '本月到店次数(由高到低)', |
| | | key: 'monthArrived', |
| | | value: 'desc' |
| | | },{ |
| | | title: '本月到店次数(由低到高)', |
| | | key: 'monthArrived', |
| | | value: 'asc' |
| | | },{ |
| | | title: '本年到店次数(由高到低)', |
| | | key: 'yearArrived', |
| | | value: 'desc' |
| | | },{ |
| | | title: '本年到店次数(由低到高)', |
| | | key: 'yearArrived', |
| | | value: 'asc' |
| | | },{ |
| | | title: '本月消费(由高到低)', |
| | | key: 'used', |
| | | value: 'desc' |
| | | },{ |
| | | title: '本月消费(由低到高)', |
| | | key: 'used', |
| | | value: 'asc' |
| | | },{ |
| | | title: '本月消耗(由高到低)', |
| | | key: 'consume', |
| | | value: 'desc' |
| | | },{ |
| | | title: '本月消耗(由低到高)', |
| | | key: 'consume', |
| | | value: 'asc' |
| | | },{ |
| | | title: '会员级别(由高到低)', |
| | | key: 'vipLevel', |
| | | value: 'desc' |
| | | },{ |
| | | title: '会员级别(由低到高)', |
| | | key: 'vipLevel', |
| | | value: 'asc' |
| | | },{ |
| | | title: '上次到店时间(由近到远)', |
| | | key: 'arriveTime', |
| | | value: 'desc' |
| | | },{ |
| | | title: '上次到店时间(由远到近)', |
| | | key: 'arriveTime', |
| | | value: 'asc' |
| | | }], |
| | | filterKeys: {birthType: '', vipType: '', other: ''}, |
| | | filter2: [{ |
| | | title: '生日', |
| | | key: 'birthType', |
| | | list: [ |
| | | { |
| | | 'title': '美团预约', |
| | | 'value': '' |
| | | 'title': '三天内生日', |
| | | 'value': 1 |
| | | }, |
| | | { |
| | | 'title': '网络预约', |
| | | 'value': '' |
| | | 'title': '本月生日', |
| | | 'value': 2 |
| | | }, |
| | | { |
| | | 'title': '下月生日', |
| | | 'value': 3 |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | title: '会员等级', |
| | | list: [ |
| | | { |
| | | 'title': '一级会员', |
| | | 'value': '' |
| | | }, |
| | | { |
| | | 'title': '二级会员', |
| | | 'value': '' |
| | | }, |
| | | { |
| | | 'title': '三级会员', |
| | | 'value': '' |
| | | } |
| | | ] |
| | | title: '会员类型', |
| | | key: 'vipType', |
| | | list: [] |
| | | }, |
| | | { |
| | | title: '活跃度', |
| | | title: '其他', |
| | | key: 'other', |
| | | list: [ |
| | | { |
| | | 'title': '活跃', |
| | | 'value': '' |
| | | 'title': '老客户', |
| | | 'value': 1 |
| | | }, |
| | | { |
| | | 'title': '不活跃', |
| | | 'value': '' |
| | | }, |
| | | { |
| | | 'title': '睡眠', |
| | | 'value': '' |
| | | }, |
| | | { |
| | | 'title': '沉睡', |
| | | 'value': '' |
| | | 'title': '新客户', |
| | | 'value': 2 |
| | | } |
| | | ] |
| | | }] |
| | | }], |
| | | queryKey: '', |
| | | sort: '', |
| | | order: '', |
| | | list: [] |
| | | }; |
| | | }, |
| | | onLoad() { |
| | | this.loadMemberType() |
| | | this.loadMemberList() |
| | | }, |
| | | onHide(){ |
| | | this.$refs.filterDropdownEl.hide(); |
| | |
| | | caculateBgcolor(index){ |
| | | return this.colors[index%8]; |
| | | }, |
| | | toDetail(){ |
| | | uni.navigateTo({ |
| | | url:'./detail' |
| | | }) |
| | | }, |
| | | filterCustom(type){ |
| | | showFilterCustom(type){ |
| | | this.$refs.filterDropdownEl.show(); |
| | | if(type===1){ |
| | | this.filterList = this.filter1; |
| | | this.filterType = 1; |
| | | } else if(type===2){ |
| | | this.filterList = this.filter2; |
| | | this.filterType = 1; |
| | | } else { |
| | | this.filterList = this.filter3; |
| | | this.filterList = this.filter2; |
| | | this.filterType = 0; |
| | | } |
| | | }, |
| | | |
| | | // 搜索 |
| | | search(val){ |
| | | this.queryKey = val; |
| | | this.loadMemberList(); |
| | | }, |
| | | // 重置筛选 |
| | | resetFilter(){ |
| | | this.filterKeys = {birthType: '', vipType: '', other: ''}; |
| | | this.loadMemberList(); |
| | | }, |
| | | // 全部筛选 |
| | | confirmFilter(val){ |
| | | if(this.filterType == 1){ |
| | | this.sort = val.key; |
| | | this.order = val.value; |
| | | this.filterText = val.title; |
| | | } else { |
| | | this.filterKeys = val; |
| | | } |
| | | this.loadMemberList(); |
| | | }, |
| | | // 获取会员类型 |
| | | loadMemberType(){ |
| | | this.$httpUtils.request('/api/vip/findVipType').then((res) => { |
| | | if(res.status == 200){ |
| | | let result = res.rows.map((item) => { |
| | | return { |
| | | title: item.levelName, |
| | | value: item.id |
| | | } |
| | | }); |
| | | this.filter2[1].list = result; |
| | | } |
| | | }) |
| | | }, |
| | | loadMemberList(){ |
| | | let parma = Object.assign({ |
| | | order: this.order, |
| | | queryKey: this.queryKey, |
| | | sort: this.sort |
| | | }, this.filterKeys) |
| | | this.$httpUtils.request('/api/vip/findVipInfoList', parma, 'POST').then((res) => { |
| | | if(res.status == 200){ |
| | | this.list = res.rows; |
| | | } else { |
| | | this.list = []; |
| | | } |
| | | }).catch((err) => { |
| | | this.list = []; |
| | | }) |
| | | } |
| | | }, |
| | | filters:{ |
| | | formatName(val){ |
| | | if(!val){ |
| | | return '无' |
| | | } |
| | | val = val.trim(); |
| | | return val.substr(0, 1) |
| | | } |
| | | } |
| | | } |
| | |
| | | font-size: 16px; |
| | | } |
| | | .member-list{ |
| | | display: flex; |
| | | align-items: center; |
| | | font-size: 14px; |
| | | } |
| | | .member-list-con{ |
| | | padding: 18px 0 18px 5px; |
| | | padding: 15px 0 15px 5px; |
| | | border-bottom: 1px solid #EDEAF4; |
| | | } |
| | | .quick-entry{ |
| | |
| | | border-radius: 50%; |
| | | background: #518EFF; |
| | | color: #FFFFFF; |
| | | box-shadow: 4px 4px 5px #ddd; |
| | | } |
| | | .quick-entry .iconfont{ |
| | | font-size: 24px; |
| | |
| | | <!-- 客户信息 --> |
| | | <view class="container"> |
| | | <view class="header"> |
| | | <image class="avatar" src="../../static/images/head-img.jpg"></image> |
| | | <text>李某</text> |
| | | <image class="avatar" :src="memberInfo.photo?memberInfo.photo:'../../static/images/default-avatar.png'"></image> |
| | | <text>{{memberInfo.vipName}}</text> |
| | | </view> |
| | | <view> |
| | | <view class="list-row"> |
| | | <text class="font-14">手机号码</text> |
| | | <text class="font-14 gray">15569218888</text> |
| | | <text class="font-14 gray">{{memberInfo.phone}}</text> |
| | | </view> |
| | | <view class="list-row"> |
| | | <text class="font-14">会员级别</text> |
| | | <text class="font-14 gray">普通会员</text> |
| | | <text class="font-14 gray">{{memberInfo.vipLevel || '-'}}</text> |
| | | </view> |
| | | <view class="list-row"> |
| | | <text class="font-14">卡号</text> |
| | | <text class="font-14 gray">Q232</text> |
| | | <text class="font-14">会员编号</text> |
| | | <text class="font-14 gray">{{memberInfo.vipNo}}</text> |
| | | </view> |
| | | <view class="list-row"> |
| | | <text class="font-14">总余额</text> |
| | | <text class="font-14 gray">¥2,323</text> |
| | | <text class="font-14 gray">¥{{memberInfo.totalBalance}}</text> |
| | | </view> |
| | | <view class="list-row"> |
| | | <text class="font-14">赠送余额</text> |
| | | <text class="font-14 gray">¥1,323</text> |
| | | <text class="font-14 gray">¥{{memberInfo.giftBalance}}</text> |
| | | </view> |
| | | <view class="list-row"> |
| | | <text class="font-14">剩余积分</text> |
| | | <text class="font-14 gray">123</text> |
| | | <text class="font-14 gray">{{memberInfo.integral}}</text> |
| | | </view> |
| | | <view class="list-row"> |
| | | <text class="font-14">所属门店</text> |
| | | <text class="font-14 gray">东莞店</text> |
| | | <text class="font-14 gray">{{memberInfo.shopName}}</text> |
| | | </view> |
| | | </view> |
| | | <navigator :url="url"> |
| | |
| | | export default{ |
| | | data(){ |
| | | return{ |
| | | url: './selectProduct/index', |
| | | memberInfo: {}, |
| | | url: './selectProduct/index' |
| | | } |
| | | }, |
| | | onLoad(options) { |
| | |
| | | } else { |
| | | this.url = './selectService'; |
| | | } |
| | | this.loadMemberInfo(options.id); |
| | | }, |
| | | methods:{ |
| | | |
| | | loadMemberInfo(id){ |
| | | this.$httpUtils.request('/api/vip/findVipInfoById/'+id).then((res) => { |
| | | if(res.status == 200){ |
| | | this.memberInfo = res.mapInfo.vipInfo; |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | <template> |
| | | <view class="container"> |
| | | <search-bar placeholder="客户姓名、手机、卡号、拼音"></search-bar> |
| | | <search-bar @confirm="search"></search-bar> |
| | | <view class="flex justify-between"> |
| | | <navigator :url="'./customerInfo?type='+type" hover-class="none" class="flex-1 mr-10"> |
| | | <view class="member-list flex align-center" v-for="(item, index) in 15"> |
| | | <text class="first-name" :style="{background: caculateBgcolor(index)}">李</text> |
| | | <view class="flex-1 mr-10"> |
| | | <navigator class="member-list flex align-center" |
| | | :url="'./customerInfo?type='+type+'&id='+item.id" |
| | | hover-class="none" |
| | | v-for="(item, index) in list"> |
| | | <text class="first-name" :style="{background: caculateBgcolor(index)}">{{item.vipName | formatName}}</text> |
| | | <view class="flex-1 flex align-center justify-between member-list-con"> |
| | | <view> |
| | | <text>李广</text> |
| | | <text class="ml-10">152****9645</text> |
| | | <view class="flex flex-v"> |
| | | <text>{{item.vipName}}</text> |
| | | <text class="font-13 gray mt-5">{{$utils.encryptAccount(item.phone)}}</text> |
| | | </view> |
| | | <view> |
| | | <text class="blue">东莞店</text> |
| | | <text class="iconfont iconarrow-backimg gray"></text> |
| | | <text class="blue">{{item.shopName}}</text> |
| | | <text class="iconfont iconarrow-backimg light-gray"></text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </navigator> |
| | | </navigator> |
| | | </view> |
| | | <indexed-list></indexed-list> |
| | | </view> |
| | | </view> |
| | |
| | | data() { |
| | | return { |
| | | type: 1 ,//1新建订单 2新建服务单 |
| | | colors: ['#CCC6B4', '#C0CCB4', '#B4C2CC', '#BEB4CC', '#B4CCBE', '#B4CCCA', '#CCB4C6', '#CCB4B4'] |
| | | colors: ['#CCC6B4', '#C0CCB4', '#B4C2CC', '#BEB4CC', '#B4CCBE', '#B4CCCA', '#CCB4C6', '#CCB4B4'], |
| | | queryKey: '', |
| | | list: [] |
| | | }; |
| | | }, |
| | | onLoad(options) { |
| | | if(options.type){ |
| | | this.type = options.type; |
| | | } |
| | | this.loadMemberList() |
| | | }, |
| | | methods:{ |
| | | caculateBgcolor(index){ |
| | | return this.colors[index%8]; |
| | | }, |
| | | search(val){ |
| | | this.queryKey = val; |
| | | this.loadMemberList(); |
| | | }, |
| | | loadMemberList(){ |
| | | let parma = Object.assign({ |
| | | order: this.order, |
| | | queryKey: this.queryKey, |
| | | sort: this.sort |
| | | }, this.filterKeys) |
| | | this.$httpUtils.request('/api/vip/findVipInfoList', parma, 'POST').then((res) => { |
| | | if(res.status == 200){ |
| | | this.list = res.rows; |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | filters:{ |
| | | formatName(val){ |
| | | if(!val){ |
| | | return '无' |
| | | } |
| | | val = val.trim(); |
| | | return val.substr(0, 1) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | font-size: 14px; |
| | | } |
| | | .member-list-con{ |
| | | padding: 18px 0 18px 5px; |
| | | padding: 15px 0 15px 5px; |
| | | border-bottom: 1px solid #EDEAF4; |
| | | } |
| | | .quick-entry{ |