beelink/src/components/ReviewItemtwo.vue
2020-10-29 17:50:26 +08:00

155 lines
3.5 KiB
Vue

<template>
<div class="reviewitem">
<div class="top">
<img :src="photo" alt="">
<div class="name myname" v-if="parseInt(memberid)==myid">{{username}}</div>
<div class="name" v-else>{{username}}</div>
</div>
<div class="cont">
{{content}}
</div>
<div class="bottom">
<div class="date">{{date}}</div>
<div class="operate">
<!-- <div class="reply" @click="reply(username)">
回复
</div> -->
<div class="del" @click="del(replyid)" v-if="parseInt(memberid)==myid">
{{lan.$t('shanchu')}}
</div>
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
.reviewitem{
width: 100%;
margin-bottom: 50px;
.top{
display: flex;
align-items: center;
>img{
width: 45px;
height: 45px;
border-radius: 50%;
background-color: #0f0;
}
.name{
font-size: 13px;
color: #111;
margin-left: 10px;
}
.myname{
color: #08AE98;
}
.lv{
display: flex;
align-items: center;
.img{
display: flex;
align-items: center;
>img{
width: 12px;
height: 12px;
// background-color: #0f0;
margin-left: 3px;
}
}
.num{
font-size: 11px;
color: #D12C2E;
margin-left: 3px;
}
}
}
.cont{
margin-left: 67px;
font-size: 11px;
line-height: 1.2;
}
.bottom{
display: flex;
align-items: center;
justify-content: space-between;
margin-left: 67px;
margin-top: 25px;
.operate{
display: flex;
}
.date{
font-size: 10px;
color: #999;
}
.reply{
font-size: 10px;
color: #08AE98;
}
.del{
color:#D12C2D!important;
margin-left: 28px;
}
}
}
</style>
<script lang="ts">
import { delreply } from '@/api';
import store from '@/store';
import { useI18n } from '@/utils/i18n';
import { defineComponent, ref } from 'vue';
export default defineComponent({
props: {
photo: {
type: String
},
username: {
type: String
},
score: {
type: Number,
},
content: {
type: String
},
date: {
type: String
},
memberid: {
type: Number
},
replyid: {
type: Number
}
},
setup(prop,context){
const lan: any = useI18n();
const myid=ref<number>(store.state.userinfo.memberid)
function reply(e?: string){
console.log(155)
context.emit("replying",{name: e,replyid: prop.replyid,score: prop.score})
}
console.log(1)
async function del(e?: number){
console.log(e)
const res=await delreply(e)
if(res.code==0){
context.emit("reload",prop.replyid)
}
console.log(res)
}
return {
reply,
myid,
del,
lan
}
}
})
</script>