| | |
| | | <template> |
| | | <div> |
| | | <div class="flex mb-30"> |
| | | <div class="pam-cus-tabs mb-30"> |
| | | <div |
| | | class="cus-tab-item" |
| | | :class="{'is-active': activeTabName === 'consultantList'}" |
| | |
| | | import { Context } from '@nuxt/types'; |
| | | import { Vue, Component, Watch } from 'vue-property-decorator'; |
| | | import { Route } from 'vue-router/types/router.d' |
| | | import { Agents } from '~/plugins/api/home'; |
| | | import { Consultants, getFavoriteConsultant } from '~/assets/ts/api/consultant'; |
| | | import { isLogin } from '~/assets/ts/auth'; |
| | | |
| | | @Component |
| | | export default class myConsultantList extends Vue { |
| | | activeTabName = 'consultantList'; |
| | | agents: Agents[] = []; |
| | | contactedList: Agents[] = []; |
| | | consultantList: Agents[] = []; |
| | | agents: Consultants[] = []; |
| | | contactedList: Consultants[] = []; |
| | | consultantList: Consultants[] = []; |
| | | |
| | | tabClick(path: string) { |
| | | this.activeTabName = path; |
| | |
| | | } |
| | | |
| | | async asyncData(context: Context) { |
| | | let agents: Agents[] = []; |
| | | let contactedList: Agents[] = []; |
| | | let consultantList: Agents[] = []; |
| | | let agents: Consultants[] = []; |
| | | let contactedList: Consultants[] = []; |
| | | let consultantList: Consultants[] = []; |
| | | |
| | | await context.$service.home.recommendConsultantList().then((result: Agents[]) => { |
| | | agents = result; |
| | | }) |
| | | if (isLogin()) { |
| | | await getFavoriteConsultant().then((response) => agents = response.data); |
| | | } |
| | | |
| | | contactedList = agents.filter(item => item.contactStatus === 'contacted'); |
| | | consultantList = agents.filter(item => item.contactStatus !== 'contacted'); |
| | |
| | | } |
| | | |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .flex { |
| | | display: flex; |
| | | width: 100%; |
| | | height: 45px; |
| | | |
| | | .cus-tab-item { |
| | | width: 50%; |
| | | text-align: center; |
| | | font-size: 24px; |
| | | border-bottom: solid 3px $LIGHT_GREY; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .is-active { |
| | | font-weight: bold; |
| | | border-bottom: solid 3px $PRIMARY_BLACK; |
| | | |
| | | } |
| | | } |
| | | |
| | | </style> |
| | | </script> |