From a1511c6fe993e10668dcd0ee20aac20a1cfee2e2 Mon Sep 17 00:00:00 2001
From: HelenHuang <LinHuang@pollex.com.tw>
Date: 星期四, 11 十一月 2021 11:19:30 +0800
Subject: [PATCH] [update]:#129049 嚴選配對畫面調整

---
 PAMapp/pages/recommendConsultant/index.vue |   88 +++++++++++++++++++++++++++++++++----------
 1 files changed, 67 insertions(+), 21 deletions(-)

diff --git a/PAMapp/pages/recommendConsultant/index.vue b/PAMapp/pages/recommendConsultant/index.vue
index 3678695..106a164 100644
--- a/PAMapp/pages/recommendConsultant/index.vue
+++ b/PAMapp/pages/recommendConsultant/index.vue
@@ -1,4 +1,4 @@
-<template>
+ <template>
 <div  class="pam-page">
     <div class="pb-10 mdTxt">����批</div>
     <div class="mb-30 pam-tags ">
@@ -7,25 +7,38 @@
     </div>
     <div class="mb-30">
         <div class="pb-10 mdTxt required">������</div>
-        <div class="area-choice"><div class="fz-20 area-txt">�����</div><i class="icon-down area-icon"></i></div>
+        <div class="job-pick" @click="showAddress = true">      
+            <input class="fz-20 pl-18 input" 
+                style="outline:none margin-right:-18px"
+                :value="district"
+                placeholder="隢���">
+            <i class="icon-down down-icon " style="margin-right:18px"></i>
+        </div> 
+        <PopUpFrame :isOpen.sync="showAddress" :drawerSize=" '45%' ">
+            <AddressPicker 
+            @close="showAddress = false"
+            @change="selectedDistrict"/>
+        </PopUpFrame>
     </div>
+
+    
     <div class="mb-10">
         <div class="pb-10 mdTxt required">�閬岷������<span class="hint text--bold" @click="showDialog = true"><i class="icon-information text--bold" @click="showDialog = true"></i>�銴</span></div>
         
     </div>
-        <ConsultantQues class="mb-30"/>
-
+        <ConsultantQues @change="selectedQuestion = $event" class="mb-30"/>
+    
 
     <div class="mb-30 pam-tags">
         <div class= "pb-10 mdTxt">憿批�僑鞈�</div>
-        <div class="rec-ageDesktop">
-            <el-button class="mb-10 qaTags" @click="seniority = 'unlimited'" :class="{'active':seniority === 'unlimited'}">
+        <div>
+            <el-button class="mb-10" @click="seniority = 'unlimited'" :class="{'active':seniority === 'unlimited'}">
                 <span class="text--bold">銝�� </span><span>撟湧翩銝����</span>
             </el-button>
-            <el-button class="mb-10 qaTags" @click="seniority = 'junior'" :class="{'active':seniority === 'junior'}">
+            <el-button style="margin-left:-0.5px" class="mb-10 " @click="seniority = 'junior'" :class="{'active':seniority === 'junior'}">
                 <span class="text--bold">撟渲�� </span><span>蝯血僑頛犖銝�����</span>
             </el-button>
-            <el-button class="mb-10 qaTags" @click="seniority = 'senior'" :class="{'active':seniority === 'senior'}">                
+            <el-button style="margin-left:-0.5px" class="mb-10" @click="seniority = 'senior'" :class="{'active':seniority === 'senior'}">                
                 <span class="text--bold">鞈楛 </span><span>����麾</span>
             </el-button>
         </div>
@@ -62,11 +75,13 @@
 
     <div class="rec-footer">
         <el-button
-            :disabled="disableActionButton"
-            @click="$router.push('recommendConsultant/result')">擐砌����</el-button>
+        type="primary"
+        
+            :disabled="!district || !selectedQuestion.length"
+            @click="$router.push('/recommendConsultant/result')">擐砌����</el-button>
     </div>
-    <UiDrawer :is-visible.sync="showDialog" size='95%'>
-            
+
+    <PopUpFrame :isOpen.sync="showDialog" :drawerSize=" '95%' ">
             <div class="qaTextTitle mdTxt"><strong>�閬岷������</strong></div>
 
                 <div class="qa-dialog">                   
@@ -77,14 +92,9 @@
                         </div>                
                     </div>
                 </div>
-            <div class="qa-dialog-footer mdTxt" @click="showDialog = false"><p>������</p></div>  
-        </UiDrawer>
-        <!-- <UiDialog :is-visible.sync="showDialog" >
+            <div class="qa-dialog-footer mdTxt" @click="showDialog = false"><p>������</p></div> 
+        </PopUpFrame>
 
-
-
-
-        </UiDialog> -->
 </div>
 </template>
 <script lang="ts">
@@ -94,6 +104,9 @@
         
         ratevalue = null;
         showDialog = false;
+        showAddress=false;
+        district = '';
+        selectedQuestion = [];
         elRateColors=['#ED1B2E','#ED1B2E','#ED1B2E'];
         gender: 'male'|'female' = 'male';
         seniority:'unlimited'|'junior'|'senior' = 'unlimited' ;
@@ -148,7 +161,7 @@
                 name:'����',
                 reversation:false
             }
-        ]
+        ];
         queaAboutList=[
                     {
                         title:'�摨瑁����',
@@ -178,7 +191,7 @@
                         title:'�隞�',
                         content:'���漲��������翰�祟�敺����雿�憿批����脰�������蝯行�����潘��隞乩������“������潦��'
                     },
-                ]
+                ];
         ageTarget(index: any){
             this.yearList[index].reversation = !this.yearList[index].reversation ;
         }
@@ -189,6 +202,7 @@
         get disableActionButton(): boolean {
             return true;
         }
+
 
 
 
@@ -204,10 +218,42 @@
         selected() {
             console.log(this.ratevalue);
         }
+
+        selectedDistrict(selectDistrict: string): void {
+            console.log('sel', selectDistrict);
+            this.district = selectDistrict;
+            console.log('sel2', selectDistrict);
+
+            // this.showAddress = false;
+        }
     }
 </script>
 
 <style lang="scss">
+
+input:focus,textarea:focus {
+    outline: none;
+}
+.input{
+    border:none;
+    border-radius: 10px;
+}
+.job-pick{
+    height: 50px;
+    border-radius:10px;
+    border:1px solid #D0D0CE ;
+    display: flex;
+    justify-content: space-between;
+    background-color: #FFFFFF;
+}
+.down-icon{
+        color:#ED1B2E;
+        font-size: 25px;
+        display: flex;
+        justify-content: flex-end;
+        padding-top: 11px;
+        margin-left: -20px;
+    }
 .popOtherBtn{
 
     margin-left: -190px;

--
Gitblit v1.8.0