| | |
| | | <template> |
| | | <div> |
| | | <el-row type="flex" class="rowStyle" :class="{'new': !agentInfo.customerViewTime }"> |
| | | |
| | | <el-col :xs="2" :sm="1"></el-col> |
| | | <el-col :xs="22" :sm="23"> |
| | | <el-row type="flex"> |
| | | <el-col class="flex_column" :xs="5" :sm="3"> |
| | | <UiAvatar |
| | | :size="50" |
| | | :agentNo="agentInfo.agentNo" |
| | | @click.native="showAgentDetail(agentInfo.agentNo)" |
| | | ></UiAvatar> |
| | | <!-- TODO:隱藏滿意度 --> |
| | | <div v-if="!hideReviews"> |
| | | <i class="icon-star pam-icon icon--yellow satisfaction" v-if="notScoreAppointmentYet"></i> |
| | | <span v-if="notScoreAppointmentYet"> |
| | | {{ agentInfo.satisfactionScore }} |
| | | </span> |
| | | <div class="unfilled text--center " |
| | | style="display:flex" |
| | | v-if="notScoreAppointmentYet">未填<br />滿意度</div> |
| | | <span v-if="agentInfo.contactStatus !== 'contacted'">{{ agentInfo.avgScore }}</span> |
| | | </div> |
| | | </el-col> |
| | | <el-col :xs="10" :sm="15"> |
| | | <div class="smTxt_bold name">{{agentInfo.name}}</div> |
| | | <div class="professionals"> |
| | | <span |
| | | class="professionalsTxt" |
| | | v-for="(expertise, index) in agentInfo.expertise" |
| | | :key="index" |
| | | >#{{expertise}}</span> |
| | | </div> |
| | | <div |
| | | class="delete" |
| | | v-if="showRemoveBtn" |
| | | @click="removeAgent" |
| | | >移除</div> |
| | | </el-col> |
| | | <el-col class="flex_column" :xs="9" :sm="6"> |
| | | <el-button |
| | | class="smTxt_bold outline_btn" |
| | | @click="reserveCommunication" |
| | | :class="actionBtnStyle" |
| | | >{{ actionBtnLabel }}</el-button> |
| | | <div |
| | | v-if="notScoreAppointmentYet" |
| | | class="text--primary mt-10 text--center text--underline cursor--pointer" |
| | | @click="reviewsBtn = true">給予滿意度評分</div> |
| | | <div class="updateTime mt-10"> |
| | | {{ agentInfo.updateTime | formatDate }} |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-col class="flex_column pl-5" :xs="5" :sm="3"> |
| | | <UiAvatar |
| | | :size="50" |
| | | :agentNo="agentInfo.agentNo" |
| | | @click.native="showAgentDetail(agentInfo.agentNo)" |
| | | ></UiAvatar> |
| | | <!-- TODO:隱藏滿意度 --> |
| | | <div v-if="!hideReviews"> |
| | | <i class="icon-star pam-icon icon--yellow satisfaction" v-if="notScoreAppointmentYet"></i> |
| | | <span v-if="notScoreAppointmentYet"> |
| | | {{ agentInfo.satisfactionScore }} |
| | | </span> |
| | | <div class="unfilled text--center " |
| | | style="display:flex" |
| | | v-if="notScoreAppointmentYet">未填<br />滿意度</div> |
| | | <span v-if="agentInfo.contactStatus !== 'contacted'">{{ agentInfo.avgScore }}</span> |
| | | </div> |
| | | </el-col> |
| | | <el-col :xs="10" :sm="15"> |
| | | <div class="smTxt_bold name">{{agentInfo.name}}</div> |
| | | <div class="professionals"> |
| | | <span |
| | | class="professionalsTxt" |
| | | v-for="(expertise, index) in agentInfo.expertise" |
| | | :key="index" |
| | | >#{{expertise}}</span> |
| | | </div> |
| | | <div |
| | | class="delete" |
| | | v-if="showRemoveBtn" |
| | | @click="removeAgent" |
| | | >移除</div> |
| | | </el-col> |
| | | <el-col class="flex_column" :xs="9" :sm="6"> |
| | | <el-button |
| | | class="smTxt_bold outline_btn" |
| | | @click="reserveCommunication" |
| | | :class="actionBtnStyle" |
| | | >{{ actionBtnLabel }}</el-button> |
| | | <div |
| | | v-if="notScoreAppointmentYet" |
| | | class="text--primary mt-10 text--center text--underline cursor--pointer" |
| | | @click="reviewsBtn = true">給予滿意度評分</div> |
| | | <div class="updateTime mt-10"> |
| | | {{ agentInfo.updateTime | formatDate }} |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | |