From a3716f72066d25d745f4d5103ff23a553c3e102b Mon Sep 17 00:00:00 2001 From: wayne <wayne8692wayne8692@gmail.com> Date: 星期四, 17 二月 2022 11:41:19 +0800 Subject: [PATCH] Merge branch 'sit' into uat --- PAMapp/components/QuickFilter/QuickFilterSelector.vue | 132 +++++++++++++++++++++++++++++-------------- 1 files changed, 89 insertions(+), 43 deletions(-) diff --git a/PAMapp/components/QuickFilter/QuickFilterSelector.vue b/PAMapp/components/QuickFilter/QuickFilterSelector.vue index 915eca1..5baa545 100644 --- a/PAMapp/components/QuickFilter/QuickFilterSelector.vue +++ b/PAMapp/components/QuickFilter/QuickFilterSelector.vue @@ -2,7 +2,7 @@ <div> <div class="mb-10" v-if="questionOption.title !== '憿批��批'"> <span class="mdTxt" - >{{questionOption.title === '憿批�遛��漲' ? '靽憿批�遛��漲' : questionOption.title}} + >{{questionOption.title}} </span> <span class="smTxt_bold text--primary" @@ -14,7 +14,10 @@ >������</span> </div> - <div class="quickBtnBlock" v-if="questionOption.name === 'communicationStyles'"> + <!-------------------- 皞�◢� --------------------> + <div class="quickBtnBlock" + v-if="questionOption.name === 'communicationStyles'" + > <el-checkbox-group class="pam-quickFilter-checkbox" v-model="pickedItem.communicationStyles" @@ -29,8 +32,29 @@ ></el-checkbox> </el-checkbox-group> </div> - - <div class="quickBtnBlock" v-else-if="questionOption.name === 'gender'"> + <!-------------------- 撟渲�� --------------------> + <div class="quickBtnBlock" + v-else-if="questionOption.name === 'seniority'" + > + <el-radio-group + class="pam-quickFilter-radio pam-radio-group" + v-model="pickedItem.seniority" + > + <el-radio + v-for="(i, index) in questionOption.detail" + :key="index" + :label="i.value" + :class="i.className" + > + <div>{{i.name}}</div> + <div class="subtitle">{{i.subTitle}}</div> + </el-radio> + </el-radio-group> + </div> + <!-------------------- �批 --------------------> + <div class="quickBtnBlock" + v-else-if="questionOption.name === 'gender'" + > <el-radio-group class="pam-quickFilter-radio" v-model="pickedItem.gender" @@ -43,10 +67,11 @@ >{{i.name}}</el-radio> </el-radio-group> </div> - + <!-------------------- 皛踵�漲 --------------------> <div v-else> <el-rate - class="pam-quickFilter-rate" + v-if="!hideReviews" + class="pam-rate mt-30" v-model="pickedItem.avgScore" ></el-rate> </div> @@ -65,53 +90,58 @@ <script lang="ts"> import { Vue, Component, Prop, Watch, Emit } from 'nuxt-property-decorator'; -import { FastQueryParams } from '~/assets/ts/api/consultant'; -import { QuestionOption } from '~/pages/quickFilter/index.vue'; - +import { hideReviews } from '~/shared/const/hide-reviews'; +import { FastQueryParams, QuestionOption, Selected } from '~/shared/models/quick-filter.model'; @Component export default class QuickFilterDrawer extends Vue { + @Prop() + questionOption!: QuestionOption; + + @Prop() + isOpenQuestionPopUp!: boolean; + + @Prop() + confirmItem!: Selected[]; pickedItem: FastQueryParams = { communicationStyles: [], status: '', gender: '', - avgScore: 0 + avgScore: 0, + seniority: '' } + hideReviews = hideReviews ; - @Prop() questionOption!: QuestionOption; - @Prop() isOpenQuestionPopUp!: boolean; - @Prop() confirmItem!: Selected[]; + ////////////////////////////////////////////////////////////////// - @Watch('isOpenQuestionPopUp', {immediate: true}) onPopUpChange() { + @Watch('isOpenQuestionPopUp', {immediate: true}) + onPopUpChange() { this.pickedItem = { - communicationStyles: this.communicationStyles, + communicationStyles: this.getCommunicationStyles(), status: '', - gender: this.gender, - avgScore: this.avgScore + gender: this.getGender(), + avgScore: this.getAvgScore(), + seniority: this.getSeniority() } } - get gender() { - const filter = this.confirmItem.filter(item => item.option === 'gender'); - return filter.length > 0 ? filter[0].value : ''; + @Emit('confirm') + confirm() { + const name = this.questionOption.name; + return { + option: name, + value: this.pickedItem[name] + } } - get avgScore() { - const filter = this.confirmItem.filter(item => item.option === 'avgScore'); - return filter.length > 0 ? filter[0].value : 0; - } - - get communicationStyles() { - return this.confirmItem - .filter(item => item.option === 'communicationStyles') - .map(item => item.value); - } + ////////////////////////////////////////////////////////////////// get isDisabled() { const name = this.questionOption.name; return name === 'gender' && !this.pickedItem[name] || name === 'avgScore' && !this.pickedItem[name] || name === 'communicationStyles' && !this.pickedItem[name].length + || name === 'seniority' && !this.pickedItem[name] } selectedCommunicationStyles() { @@ -120,20 +150,32 @@ } } - @Emit('confirm') - confirm() { - const name = this.questionOption.name; - return { - option: this.questionOption.name, - value: this.pickedItem[name] - } + ////////////////////////////////////////////////////////////////// + + private getGender(): string { + return this.filterSingleSelected('gender'); } -} + private getAvgScore(): number { + return this.filterSingleSelected('avgScore'); + } -export interface Selected { - option: string; - value: any; + private getCommunicationStyles(): string[] { + return this.confirmItem + .filter(item => item.option === 'communicationStyles') + .map(item => item.value); + } + + private getSeniority(): string { + return this.filterSingleSelected('seniority'); + } + + private filterSingleSelected(name: string) { + const filter = this.confirmItem.filter(item => item.option === name); + return filter.length > 0 + ? filter[0].value + : (name === 'avgScore' ? 0 : ''); + } } </script> @@ -142,8 +184,12 @@ .quickBtnBlock { display: flex; justify-content: space-between; - align-content: space-between; flex-wrap: wrap; } -</style> \ No newline at end of file + .pam-radio-group { + height: 240px; + flex-wrap: wrap; + } + +</style> -- Gitblit v1.8.0