From f3071eeab28fbe9cb850cf9dd00bd8f77fae0798 Mon Sep 17 00:00:00 2001
From: li-guang <153605324@qq.com>
Date: Tue, 15 Dec 2020 11:41:06 +0800
Subject: [PATCH] 会员详情,个人中心设置

---
 hive-app/pages/member/index.vue |   88 ++++++++++++++++++++++++++++++++++++++++---
 1 files changed, 81 insertions(+), 7 deletions(-)

diff --git a/hive-app/pages/member/index.vue b/hive-app/pages/member/index.vue
index 5066033..4edbb8d 100644
--- a/hive-app/pages/member/index.vue
+++ b/hive-app/pages/member/index.vue
@@ -2,19 +2,20 @@
 	<view class="container">
 		<search-bar></search-bar>
 		<view class="sort-wrap">
-			<view>
-				<text>到店次数</text>
+			<view @click="filterCustom(1)">
+				<text>到店排序</text>
 				<text class="iconfont iconjiantouarrow486"></text>
 			</view>
-			<view>
-				<text>消费金额</text>
+			<view @click="filterCustom(2)">
+				<text>卡项排序</text>
 				<text class="iconfont iconjiantouarrow486"></text>
 			</view>
-			<view>
+			<view @click="filterCustom(3)">
 				<text>全部筛选</text>
 				<text class="iconfont iconjiantouarrow486"></text>
 			</view>
 		</view>
+		<filter-dropdown ref="filterDropdownEl" :list="filterList" :type="filterType"></filter-dropdown>
 		<view class="sort-tab">
 			<text class="sort-tab-item">正式客户</text>
 			<text class="sort-tab-item">体验客户</text>
@@ -45,15 +46,75 @@
 <script>
 	import searchBar from '../../components/searchBar/index.vue';
 	import indexedList from '../../components/indexedList/index.vue';
+	import filterDropdown from '../../components/filterDropdown/index.vue';
 	export default {
 		components:{
 			searchBar,
-			indexedList
+			indexedList,
+			filterDropdown
 		},
 		data() {
 			return {
-				colors: ['#CCC6B4', '#C0CCB4', '#B4C2CC', '#BEB4CC', '#B4CCBE', '#B4CCCA', '#CCB4C6', '#CCB4B4']
+				colors: ['#CCC6B4', '#C0CCB4', '#B4C2CC', '#BEB4CC', '#B4CCBE', '#B4CCCA', '#CCB4C6', '#CCB4B4'],
+				filterType: 1,
+				filterList: [],
+				filter1: ['本月到店次数(由低到高)','本月到店次数(由高到低)','本年到店次数(由低到高)','本年到店次数(由高到低)','本月消费(由高到低)','本月消费(由低到高)','本月消耗(由高到低)','本月消耗(由低到高)'],
+				filter2: ['7天内卡项到期','15天内卡项到期','30天内卡项到期'],
+				filter3: [{
+					title: '到店途径',
+					list: [
+						{
+							'title': '美团预约',
+							'value': ''
+						},
+						{
+							'title': '网络预约',
+							'value': ''
+						}
+					]
+				},
+				{
+					title: '会员等级',
+					list: [
+						{
+							'title': '一级会员',
+							'value': ''
+						},
+						{
+							'title': '二级会员',
+							'value': ''
+						},
+						{
+							'title': '三级会员',
+							'value': ''
+						}
+					]
+				},
+				{
+					title: '活跃度',
+					list: [
+						{
+							'title': '活跃',
+							'value': ''
+						},
+						{
+							'title': '不活跃',
+							'value': ''
+						},
+						{
+							'title': '睡眠',
+							'value': ''
+						},
+						{
+							'title': '沉睡',
+							'value': ''
+						}
+					]
+				}]
 			};
+		},
+		onHide(){
+			this.$refs.filterDropdownEl.hide();
 		},
 		methods:{
 			caculateBgcolor(index){
@@ -63,6 +124,19 @@
 				uni.navigateTo({
 					url:'./detail'
 				})
+			},
+			filterCustom(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.filterType = 0;
+				}
 			}
 		}
 	}

--
Gitblit v1.9.1