From b81b27ce3e7e9e7cda18bb6a621c34e84e7e2311 Mon Sep 17 00:00:00 2001
From: 劉鈞霖 <benson@gmail.com>
Date: 星期一, 27 十二月 2021 12:27:55 +0800
Subject: [PATCH] [ Ref ] : refactor page : quickFilter , recommendConsultant , userReviews , userReviewsRecord and some related component

---
 PAMapp/components/AddressPicker.vue |   60 ++++++++++++++++++++++++++++++++++++++++--------------------
 1 files changed, 40 insertions(+), 20 deletions(-)

diff --git a/PAMapp/components/AddressPicker.vue b/PAMapp/components/AddressPicker.vue
index a184983..a5749c5 100644
--- a/PAMapp/components/AddressPicker.vue
+++ b/PAMapp/components/AddressPicker.vue
@@ -1,43 +1,63 @@
 <template>
     <div class="text--center">
-        <div class="subTitle mb-10">������</div>
-        <el-input
-            type="text"
-            class="p mt-10"
-            v-model="keyWord"
-            @change="searchDistrict"
-            placeholder="隢撓���摮�"
-        ></el-input>
-       <Ui-ScrollPicker
-            :options="filterOptions"
-            :initValue="district"
-            @change="change"
-        ></Ui-ScrollPicker>
+      <div class="subTitle mb-10">�����</div>
+      <el-input
+          type="text"
+          class="p mt-10 cursor--pointer input-radius"
+          tabindex="-1"
+          v-model="keyWord"
+          @change="searchDistrict"
+          placeholder="隢撓���摮�"
+      ></el-input>
+      <Ui-ScrollPicker
+          :options="filterOptions"
+          :initValue="district"
+          @change="selectDistrict"
+      ></Ui-ScrollPicker>
+      <div class="text--center mt-10">
+          <el-button type="primary" @click="confirm">蝣箄��</el-button>
+      </div>
     </div>
 </template>
 
 <script lang="ts">
-import { Vue, Component } from 'nuxt-property-decorator';
+import { Vue, Component, Emit } from 'nuxt-property-decorator';
+
+import { taiwanCities } from '~/shared/const/taiwan-cities';
 
 @Component
 export default class AddressPicker extends Vue {
 
-    options = ['�����', '�����', '�����', '獢�腦', '�蝡孵��', '�蝡寧腦', '���腦', '�銝剖��', '敶啣�腦', '���腦', '���腦', '��儔撣�', '��儔蝮�', '�����', '擃���', '撅蝮�', '��蝮�', '��蝮�', '摰蝮�', '瞉�腦', '���蝮�', '��瘙腦'];
-    keyWord = '';
+    options      : string[] = taiwanCities;
+    keyWord      : string   = '';
     filterOptions: string[] = [];
-    district = '�����';
+    district     : string   = '�����';
+
+    //////////////////////////////////////////////////////////////////////
 
     mounted() {
         this.filterOptions = JSON.parse(JSON.stringify(this.options));
     }
 
+    //////////////////////////////////////////////////////////////////////
+
+    @Emit('confirm')
+    confirm(): string {
+        return this.district;
+    }
+
+    //////////////////////////////////////////////////////////////////////
+
     searchDistrict() {
         this.filterOptions = this.options.filter(e => e.match(this.keyWord));
     }
 
-    change(value: string) {
-        console.log('change', value)
+    selectDistrict(value: string): void {
+        this.district = value;
     }
+
+
+
 }
 </script>
 
@@ -45,4 +65,4 @@
     .cus-input {
         font-size: 20px;
     }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0