TODO#130020 [快速篩選] API 串接

Mila

2021-11-10 7c291a812e980917bc9f64a3f251f2a08ae7f157

 PAMapp/components/QuickFilter/QuickFilterSelector.vue

@@ -6,16 +6,16 @@
            </span>
            <span
                class="smTxt_bold text--primary"
                v-if="questionOption.name === 'style'"
                v-if="questionOption.name === 'communicationStyles'"
            >可複選</span>
            <span
                class="smTxt_bold text--primary"
                v-if="questionOption.name === 'satisfaction'"
                v-if="questionOption.name === 'avgScore'"
            >選取星星</span>
        </div>

        <div class="quickBtnBlock" v-if="questionOption.name === 'style'">
            <el-checkbox-group class="pam-quickFilter-checkbox" v-model="pickedItem.style">
        <div class="quickBtnBlock" v-if="questionOption.name === 'communicationStyles'">
            <el-checkbox-group class="pam-quickFilter-checkbox" v-model="pickedItem.communicationStyles">
                <el-checkbox
                    v-for="(i, index) in questionOption.detail"
                    :key="index"
@@ -33,12 +33,12 @@
                    :key="index"
                    :label="i.value"
                    :class="i.className"
                ></el-radio>
                >{{i.name}}</el-radio>
            </el-radio-group>
        </div>

        <div class="quickBtnBlock" v-else-if="questionOption.name === 'loginState'">
            <el-radio-group class="pam-quickFilter-radio" v-model="pickedItem.loginState">
        <div class="quickBtnBlock" v-else-if="questionOption.name === 'status'">
            <el-radio-group class="pam-quickFilter-radio" v-model="pickedItem.status">
                <el-radio
                    v-for="(i, index) in QuestionOption.detail"
                    :key="index"
@@ -49,30 +49,35 @@
        </div>

        <div v-else>
            <el-rate class="pam-quickFilter-rate" v-model="pickedItem.satisfaction"></el-rate>
            <el-rate class="pam-quickFilter-rate" v-model="pickedItem.avgScore"></el-rate>
        </div>
    </div>
</template>

<script lang="ts">
import { Vue, Component, PropSync, Prop, Watch } from 'nuxt-property-decorator';
import { QuestionOption, selectedItem } from '~/pages/quickFilter/index.vue';
import { FastQueryParams } from '~/assets/ts/api/consultant';
import { QuestionOption } from '~/pages/quickFilter/index.vue';

@Component
export default class QuickFilterDrawer extends Vue {

    pickedItem: selectedItem = {
        style: [],
        onlineState: '',
    pickedItem: FastQueryParams = {
        communicationStyles: [],
        status: '',
        gender: '',
        satisfaction: 0
        avgScore: 0
    }

    mounted() {
        console.log(this.questionOption, 'questionOption')
    }

    @PropSync('drawerVisible') isVisible!: boolean;
    @Prop() selectedItem!: selectedItem;
    @Prop() selectedItem!: FastQueryParams;
    @Prop() questionOption!: QuestionOption;

    @Watch('selectedItem', {deep: true, immediate: true}) watchSelected(newValue: selectedItem) {
    @Watch('selectedItem', {deep: true, immediate: true}) watchSelected(newValue: FastQueryParams) {
        if (newValue) {
            this.pickedItem = JSON.parse(JSON.stringify(this.selectedItem))
        }