| | |
| | | <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{ |