Files
dvcp_v2_webapp/packages/publicity/AppVillageInfo/components/Comments.vue
2022-12-01 09:35:20 +08:00

131 lines
3.0 KiB
Vue

<template>
<ai-list class="comments" :isTabs="true">
<template slot="content">
<div class="ai-table">
<ai-table
:tableData="tableData"
:col-configs="colConfigs"
:total="total"
:current.sync="search.current"
:size.sync="search.size"
@getList="getList">
<el-table-column prop="type" slot="options" label="评论明细">
<div slot-scope="scope">
<el-row type="flex" justify="space-between">
<p class="comment_p">来自{{ scope.row.title }}</p>
<span title="删除" style="cursor: pointer;color: #26f;user-select: none;" @click="remove(scope.row.id)">删除</span>
</el-row>
<div style="display: flex;">
<b slot="label">回复内容:</b>
<ai-audio single-play v-if="scope.row.audioFile" :src="scope.row.audioFile"/>
<div v-html="scope.row.content" style="white-space: pre-wrap;"></div>
</div>
<p style="float:left;padding-right:8px;"><span style="font-weight:bold;padding-right:8px;">回复人:</span>{{ scope.row.createUser }}
</p>
<p style="float:left;">{{ scope.row.createDate }}</p>
</div>
</el-table-column>
</ai-table>
</div>
</template>
</ai-list>
</template>
<script>
import { mapState } from 'vuex'
export default {
name: 'JoinEvent',
props: {
instance: Function,
dict: Object,
areaId: String,
permissions: Function
},
computed: {
...mapState(['user']),
colConfigs() {
return [
{ slot: 'options' }
]
}
},
data () {
return {
search: {
current: 1,
size: 10,
status: ''
},
total: 0,
ids: [],
tableData: [],
orderDetail: {}
}
},
created () {
this.getList()
},
methods: {
getList () {
this.instance.post(`/app/appvillageinfocomment/list`, null, {
params: {
...this.search,
areaId: this.areaId
}
}).then(res => {
if (res.data) {
this.tableData = res.data.records
this.total = res.data.total
}
})
},
remove (id) {
this.$confirm('确定删除该数据?').then(() => {
this.instance.post(`/app/appvillageinfocomment/delete?ids=${id}`).then(res => {
if (res.code == 0) {
this.$message.success('删除成功!')
this.getList()
}
})
})
}
}
}
</script>
<style lang="scss" scoped>
.join-event {
:deep( th ){
font-weight: bold!important;
}
}
.table-btn {
margin-right: 16px;
font-size: 14px;
color: #2266FF;
cursor: pointer;
&:hover {
opacity: 0.6;
}
&:last-child {
margin-right: 0;
}
&:last-child:hover {
color: #f46;
opacity: 1;
}
}
</style>