89 lines
2.2 KiB
Vue
89 lines
2.2 KiB
Vue
<template>
|
|
<section class="AiEvaluation">
|
|
<ai-card :title="title" v-if="detail.id">
|
|
<template #content>
|
|
<slot v-if="$scopedSlots.default" :detail="detail"/>
|
|
<ai-wrapper v-else>
|
|
<ai-info-item label="评价时间" :value="detail.createTime"/>
|
|
<ai-info-item label="评价分数">
|
|
<el-rate v-model="detail.score" show-text :texts="rateTexts"/>
|
|
</ai-info-item>
|
|
<ai-info-item label="评价详情" is-line>
|
|
<div class="mar-b8" v-html="detail.content"/>
|
|
<div flex class="wrap">
|
|
<el-image v-for="op in annex" :key="op.id" :src="op.url" :preview-src-list="[op.url]" lazy class="mar-b8 mar-r8"/>
|
|
</div>
|
|
</ai-info-item>
|
|
</ai-wrapper>
|
|
</template>
|
|
</ai-card>
|
|
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
import instance from "../../lib/js/request";
|
|
import AiCard from "../layout/AiCard";
|
|
import AiWrapper from "../basic/AiWrapper";
|
|
import AiInfoItem from "../basic/AiInfoItem";
|
|
|
|
export default {
|
|
name: "AiEvaluation",
|
|
components: {AiInfoItem, AiWrapper, AiCard},
|
|
props: {
|
|
/**
|
|
* 业务id
|
|
*/
|
|
bid: {default: ""},
|
|
/**
|
|
* 面板标题
|
|
*/
|
|
title: {default: "办事评价"},
|
|
/**
|
|
* 评价数据
|
|
*/
|
|
info: {default: () => ({})},
|
|
/**
|
|
* 评价等级文案
|
|
*/
|
|
rateTexts: {default: () => ['非常不满意', '不满意', '一般', '满意', '非常满意']}
|
|
},
|
|
computed: {
|
|
annex: v => v.detail?.files || []
|
|
},
|
|
data() {
|
|
return {
|
|
instance,
|
|
detail: {},
|
|
}
|
|
},
|
|
methods: {
|
|
getDetail() {
|
|
const {bid: bizId} = this.$props
|
|
bizId && this.instance.post("/app/appbusinesscompletionevaluation/queryMyEvaluationByBizId", null, {
|
|
params: {bizId}
|
|
}).then(res => {
|
|
if (res?.data) {
|
|
this.detail = res.data?.[0] || {}
|
|
this.$emit("update:info", {...res.data, rateText: this.rateTexts?.[this.detail.score - 1] || ""})
|
|
}
|
|
})
|
|
}
|
|
},
|
|
created() {
|
|
this.getDetail()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.AiEvaluation {
|
|
.wrap {
|
|
:deep .el-image__inner {
|
|
width: 120px;
|
|
height: 120px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|