<template>
|
<div>
|
<div class="pam-cus-tabs mb-30">
|
<div
|
class="cus-tab-item"
|
:class="{'is-active': activeTabName === 'consultantList'}"
|
@click="tabClick('consultantList')"
|
>顧問清單
|
<span class="p">({{consultantList.length}})</span>
|
</div>
|
<div
|
class="cus-tab-item"
|
:class="{'is-active': activeTabName === 'contactedList'}"
|
@click="tabClick('contactedList')"
|
>已聯絡
|
<span class="p">({{contactedList.length}})</span>
|
</div>
|
</div>
|
|
<NuxtChild
|
:contactedList="contactedList"
|
:consultantList="consultantList"
|
@remove="removeAgent"
|
></NuxtChild>
|
</div>
|
</template>
|
|
<script lang='ts'>
|
import { Vue, Component, Watch } from 'vue-property-decorator';
|
import { Route } from 'vue-router/types/router.d'
|
import { getFavoriteFromStorage, setFavoriteToStorage } from '~/assets/ts/storageConsultant';
|
import { addFavoriteConsultant, Consultants, deleteConsultant, getFavoriteConsultant } from '~/assets/ts/api/consultant';
|
import { isLogin } from '~/assets/ts/auth';
|
|
@Component
|
export default class myConsultantList extends Vue {
|
activeTabName = 'consultantList';
|
agents: Consultants[] = [];
|
contactedList: Consultants[] = [];
|
consultantList: Consultants[] = [];
|
|
tabClick(path: string) {
|
this.activeTabName = path;
|
this.$router.push('/myConsultantList/' + this.activeTabName)
|
}
|
|
mounted() {
|
if (isLogin()) {
|
this.addFavoriteFromStorageToApi();
|
} else {
|
this.agents = getFavoriteFromStorage();
|
this.filterContactedList()
|
}
|
}
|
|
addFavoriteFromStorageToApi() {
|
const agentNoList = getFavoriteFromStorage().map(i => i.agentNo)
|
if (agentNoList.length > 0) {
|
addFavoriteConsultant(agentNoList).then(res => this.getMyConsutant());
|
localStorage.removeItem('favoriteConsultant');
|
return;
|
}
|
this.getMyConsutant();
|
}
|
|
getMyConsutant() {
|
getFavoriteConsultant().then((response) => {
|
this.agents = response.data;
|
this.filterContactedList();
|
});
|
}
|
|
filterContactedList() {
|
this.consultantList = this.agents
|
.filter(item => item.contactStatus !== 'contacted')
|
.sort((a, b) => a.updateTime > b.updateTime ? -1 : 1);
|
this.contactedList = this.agents
|
.filter(item => item.contactStatus === 'contacted')
|
.sort((a, b) => a.updateTime > b.updateTime ? -1 : 1);
|
}
|
|
removeAgent(agentNo: string) {
|
if (!isLogin()) {
|
const fintIndex = this.consultantList.findIndex(item => item.agentNo === agentNo);
|
this.consultantList.splice(fintIndex, 1);
|
setFavoriteToStorage(this.consultantList);
|
} else {
|
deleteConsultant(agentNo).then(res => this.$router.go(0))
|
}
|
}
|
|
@Watch('$route') watchRouter(currentRoute: Route) {
|
const pathArray = currentRoute.fullPath.split('/');
|
this.activeTabName = pathArray[pathArray.length - 1];
|
}
|
|
}
|
</script>
|