github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-17 06:32:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 审批评论图片浏览可滑动连续查看

Browse Source
This commit is contained in:
kuaifan 2024-10-27 11:47:26 +08:00
parent 7fdc7a47e3
commit 8eaff830ad
1 changed files with 14 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
resources/assets/js/pages/manage/approve/details.vue
View File

@ -54,7 +54,7 @@
<div class="approve-details-text" v-if="datas.var?.other"> <div class="approve-details-text" v-if="datas.var?.other">
<h4>{{$L('图片')}}</h4> <h4>{{$L('图片')}}</h4>
<div class="img-body"> <div class="img-body">
<div v-for="(src,key) in (datas.var.other).split(',')" @click="onViewPicture(src, datas.var.other, 1)"> <div v-for="(src,key) in (datas.var.other).split(',')" @click="onViewPicture(src, 1)">
<ImgView :src="src" :key="key" class="img-view"/> <ImgView :src="src" :key="key" class="img-view"/>
</div> </div>
</div> </div>
@ -148,13 +148,13 @@
<h3 class="approve-details-subtitle">{{$L('全文评论')}}</h3> <h3 class="approve-details-subtitle">{{$L('全文评论')}}</h3>
<div class="approve-record-comment"> <div class="approve-record-comment">
<List :split="false" :border="false"> <List :split="false" :border="false">
<ListItem v-for="(item,key) in datas.global_comments" :key="key"> <ListItem v-for="(item, key) in datas.global_comments" :key="key">
<div> <div>
<div class="top"> <div class="top">
<Avatar :src="item.userimg" size="38"/> <Avatar :src="item.userimg" size="38"/>
<div> <div>
<p>{{item.nickname}}</p> <p>{{ item.nickname }}</p>
<p class="time">{{item.created_at}}</p> <p class="time">{{ item.created_at }}</p>
</div> </div>
<span>{{ getTimeAgo(item.created_at) }}</span> <span>{{ getTimeAgo(item.created_at) }}</span>
</div> </div>
@ -162,8 +162,8 @@
{{ getContent(item.content) }} {{ getContent(item.content) }}
</div> </div>
<div class="content" style="display: flex; gap: 10px;"> <div class="content" style="display: flex; gap: 10px;">
<div v-for="(src,k) in getPictures(item.content)" :key="k" @click="onViewPicture(src, item.content, 2)"> <div v-for="(src, k) in getPictures(item.content)" :key="k" @click="onViewPicture(src, 2)">
<ImgView :src="getPictureThumb(src)" class="img-view"/> <ImgView :src="getPictureThumb(src)" :error-src="src" class="img-view"/>
</div> </div>
</div> </div>
</div> </div>
@ -483,20 +483,23 @@ export default {
return src + '_thumb.' + src.split('.').pop() return src + '_thumb.' + src.split('.').pop()
}, },
// 打开图片 // 打开图片
onViewPicture(currentUrl, datas, type) { onViewPicture(currentUrl, type) {
const datas = [];
if (type == 1) { if (type == 1) {
datas = datas.split(',') datas.push(...this.datas.var.other.split(','))
} }
if (type == 2) { if (type == 2) {
datas = this.getPictures(datas) this.datas.global_comments.map(h => {
datas.push(...this.getPictures(h.content))
})
} }
const list = datas.map(src => { const list = datas.map(src => {
return { return {
src: $A.mainUrl(src) src: $A.mainUrl(src)
} }
}); });
const index = list.findIndex(({ src }) => src === $A.mainUrl(currentUrl)); const index = list.findIndex(({src}) => src === $A.mainUrl(currentUrl));
this.$store.dispatch("previewImage", { index, list }) this.$store.dispatch("previewImage", {index, list})
} }
} }
} }