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