From 31f6ff0ebbf3d374e6e0acdeda72bccdd86de2d5 Mon Sep 17 00:00:00 2001
From: Tomas <tomasysh@gmail.com>
Date: 星期四, 10 二月 2022 14:16:15 +0800
Subject: [PATCH] update#134662: [ 顧問管理流程 ] 編輯顧問個人資料 : 所在地區，無產生選擇器

---
 PAMapp/pages/agentInfo/edit/_agentNo.vue |   63 +++++++++++++++++++++++++++----
 1 files changed, 55 insertions(+), 8 deletions(-)

diff --git a/PAMapp/pages/agentInfo/edit/_agentNo.vue b/PAMapp/pages/agentInfo/edit/_agentNo.vue
index cbd0ce3..f0bc55f 100644
--- a/PAMapp/pages/agentInfo/edit/_agentNo.vue
+++ b/PAMapp/pages/agentInfo/edit/_agentNo.vue
@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div class="edit-agent-info-page">
       <el-row
         type="flex"
         justify="center">
@@ -12,7 +12,6 @@
         class="pt-10"
         justify="center"
         align="middle" v-if="!hideReviews">
-        <!-- TODO:���遛��漲 -->
           <i class="pam-icon icon--primary icon-star"></i>
           <h3 class="mdTxt">{{ agentInfo.avgScore }}</h3>
       </el-row>
@@ -27,6 +26,29 @@
       <el-row
         type="flex"
         class="pam-paragraph">
+        <el-col :span="24" class="pam-field">
+          <div class="pam-field__label pam-progress__label">
+            <div>
+              <div class="pam-field__title mb-10">
+                <i class="pam-icon icon-phone"
+                  ></i>����Ⅳ
+                  <span class="hint text--bold" v-show="!phoneValid">����Ⅳ�撘�炊</span>
+                  <span class="hint text--bold" v-show="editInfoValue.phoneNumber.length === 0">����Ⅳ�敹‵</span>
+              </div>
+            </div>
+            <el-input
+            v-model="editInfoValue.phoneNumber"
+            :class="{'is-invalid': !phoneValid}"
+            maxlength="10"
+            minlength="10"></el-input>
+          </div>
+        </el-col>
+      </el-row>
+
+
+      <el-row
+        type="flex"
+        class="pam-paragraph">
         <UiField :span="12" icon="agent" label="����">
           <el-input  v-model="editInfoValue.title"></el-input>
         </UiField>
@@ -36,7 +58,12 @@
         type="flex"
         class="pam-paragraph">
         <UiField icon="company" label="�����">
-          <el-input  v-model="editInfoValue.serveArea"></el-input>
+          <MultiSelectBtn class="mt-30"
+            :mutiSelect.sync="editInfoValue.serveArea"
+            :nameOfSelectAll="'��'"
+            :options="serveAreaOptions"
+            >
+          </MultiSelectBtn>
         </UiField>
       </el-row>
 
@@ -102,7 +129,7 @@
             <MultiSelectBtn class="mt-30"
             :mutiSelect.sync="editInfoValue.communicationStyle"
             :options="agentCommunicationStyleList"
-            @change="selectCommunicationStyles"
+            :maxLength="2"
             >
             </MultiSelectBtn>
           </div>
@@ -200,6 +227,7 @@
 import { AgentInfoSetting } from '~/shared/models/account.model';
 import { Role } from '~/shared/models/enum/Role';
 import { agentCommunicationStyleList } from '~/shared/const/agent-communication-style-list';
+import { taiwanCities } from '~/shared/const/taiwan-cities';
 
 const localStorageTest = namespace('localStorage');
 
@@ -216,13 +244,14 @@
   hideReviews     : boolean = hideReviews ;
   isAlertFieldInfo: boolean = false;
   isInfoUpdate    : boolean = false;
+  serveAreaOptions: any[] = taiwanCities.map((city) => ({ title: city, label: city }));
 
   editInfoValue = {
     agentNo           : '',
     name              : '',
     expertise         : [] as string[],
     title             : '',
-    serveArea         : '',
+    serveArea         : [] as string[],
     companyAddress    : '',
     seniorityYear     : 1,
     seniorityMonth    : 0,
@@ -231,6 +260,7 @@
     awards            : '',
     communicationStyle: [] as string[],
     photoBase64       : '',
+    phoneNumber       : ''
   };
 
   communicationStyleList: string[] = agentCommunicationStyleList;
@@ -301,7 +331,7 @@
       expertise         : agentInfo.expertise || [],
       title             : agentInfo.title || '',
       role              : agentInfo.role||'',
-      serveArea         : agentInfo.serveArea || '',
+      serveArea         : agentInfo?.serveArea.split('��'),
       gender            : agentInfo.gender||'',
       phoneNumber       : agentInfo.phoneNumber||'',
       companyAddress    : agentInfo.companyAddress || '',
@@ -328,6 +358,7 @@
     const editSettingInfo: any = {
       ...this.editInfoValue,
       communicationStyle: this.editInfoValue.communicationStyle.join('��'),
+      serveArea: this.editInfoValue.serveArea.join('��'),
     }
     accountSettingService.editAgentInfoSetting(editSettingInfo).then((res: AgentInfoSetting) => {
       this.isInfoUpdate = true;
@@ -359,6 +390,13 @@
     }
   }
   ////////////////////////////////////////////////////////////
+  get phoneValid(): boolean {
+            const rule = /^09[0-9]{8}$/;
+            return this.editInfoValue.phoneNumber
+            ? rule.test(this.editInfoValue.phoneNumber) && _.isEqual(this.editInfoValue.phoneNumber.length,10)
+            : true;
+        }
+
   get isSubmitBtnDisabled(): boolean {
       const isFormValid =  this.editInfoValue.name
                         && this.editInfoValue.title
@@ -366,7 +404,7 @@
                         && this.editInfoValue.serveArea
                         && this.editInfoValue.concept
                         && this.editInfoValue.experiences
-                        && this.editInfoValue.awards
+                        && this.editInfoValue.phoneNumber.length
                         && this.editInfoValue.seniorityYear
                         && this.editInfoValue.expertise.length
                         && this.editInfoValue.communicationStyle.length;
@@ -376,7 +414,12 @@
 
 </script>
 
-<style lang="scss">
+<style lang="scss" >
+.edit-agent-info-page{
+  .el-textarea__inner{
+  font-size: 15px;
+}
+}
 .pam-icon {
   font-size    : 15px;
   padding-right: 8px;
@@ -437,4 +480,8 @@
 .el-input--suffix .el-input__inner {
   padding-right: 20px;
 }
+
+.el-textarea__inner{
+  font-size: 18px;
+}
 </style>

--
Gitblit v1.8.0