修改评论区域显示
于肖磊
parent
ac30ac18cc
commit
99ce11b02f
|
|
@ -94,49 +94,57 @@
|
|||
</view>
|
||||
<view class="flex-1 flex-row oh" :style="'width:' + windowWidth + 'px;'" data-type="scroll" @tap.stop @touchstart.prevent="handle_comment_touch_start" @touchmove.prevent="handle_comment_touch_move" @touchend="handle_comment_touch_end">
|
||||
<!-- 评论内容区域 -->
|
||||
<scroll-view class="flex-1 comment-list flex-row" scroll-y :scroll-top="comment_scroll_top" show-scrollbar="false" scroll-with-animation :scroll-with-touch="!is_dragging" @scrolltolower="handle_comment_to_lower_scroll" @scroll="handle_comment_scroll">
|
||||
<view class="comment-scroll" :style="'width:' + windowWidth + 'px;'">
|
||||
<!-- <scroll-view class="flex-1 comment-list flex-row" scroll-y :scroll-top="comment_scroll_top" show-scrollbar="false" scroll-with-animation :scroll-with-touch="!is_dragging" @scrolltolower="handle_comment_to_lower_scroll" @scroll="handle_comment_scroll"> -->
|
||||
<list class="comment-list comment-scroll" :show-scrollbar="false" :scrollable="!is_dragging" loadmoreoffset="50" @scroll="handle_comment_scroll" @loadmore="handle_comment_to_lower_scroll">
|
||||
<template v-if="active_comments && active_comments.length > 0">
|
||||
<view class="comment-item flex-col" v-for="(comment_item, index) in active_comments" :key="index" :style="window_more_style">
|
||||
<commentInfoComponent :style="window_more_style" :propComment="comment_item" :propId="comment_item.id" :propDropDownVisible="active_dropdown_id == comment_item.id" @comment_reply="comment_reply" @comment_like="comment_like" @toggle_dropdown="handle_toggle_dropdown" @dropdown_item_click="handle_dropdown_item_click"></commentInfoComponent>
|
||||
<!-- 子评论 -->
|
||||
<view class="sub-comment flex-col jc-c mt-10">
|
||||
<view v-if="comment_item.sub_comments && Array.isArray(comment_item.sub_comments) && comment_item.sub_comments.length > 0 && comment_item.show_sub_comment" style="margin-buttom: 20rpx;" class="sub-comment-list flex-col jc-c">
|
||||
<view v-for="(sub_comment_item, sub_comment_index) in comment_item.sub_comments" :key="sub_comment_index" class="sub-comment-item flex-row align-s" style="margin-bottom: 20rpx;">
|
||||
<commentInfoComponent :style="window_sub_more_style" :propComment="sub_comment_item" :propId="sub_comment_item.id" :propDropDownVisible="active_dropdown_id == sub_comment_item.id" @comment_reply="comment_reply" @comment_like="comment_like" @toggle_dropdown="handle_toggle_dropdown" @dropdown_item_click="handle_dropdown_item_click"></commentInfoComponent>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="comment_item.comments_count > 0">
|
||||
<template v-if="!comment_item.show_sub_comment">
|
||||
<commentMoreComponent :style="window_more_style" :propId="comment_item.id" :propIsLevel="1" :propText="'—— '+ $t('common.expand') + (comment_item.comments_count ? comment_item.comments_count || 0 : 0) + $t('ask-comments.ask-comments.ymmd24')" @comment_more_event="open_sub_comment"></commentMoreComponent>
|
||||
</template>
|
||||
<template v-else>
|
||||
<template v-if="comment_item.show_sub_comment_loading">
|
||||
<loading-component :style="window_more_style"></loading-component>
|
||||
</template>
|
||||
<view v-else class="sub-comment-more flex-row align-c gap-10">
|
||||
<template v-if="comment_item.page != null && comment_item.page < comment_item.page_total">
|
||||
<commentMoreComponent :style="window_more_style" :propId="comment_item.id" :propIsLevel="2" :propText="$t('common.expand')" @comment_more_event="open_sub_comment"></commentMoreComponent>
|
||||
</template>
|
||||
<commentMoreComponent :style="window_more_style" :propId="comment_item.id" :propText="$t('common.retract')" propIconName="arrow-top" @comment_more_event="close_sub_comment"></commentMoreComponent>
|
||||
<cell v-for="(comment_item, index) in active_comments" :key="comment_item.id">
|
||||
<view class="comment-item flex-col">
|
||||
<commentInfoComponent :style="window_more_style" :propComment="comment_item" :propId="comment_item.id" :propDropDownVisible="active_dropdown_id == comment_item.id" @comment_reply="comment_reply" @comment_like="comment_like" @toggle_dropdown="handle_toggle_dropdown" @dropdown_item_click="handle_dropdown_item_click"></commentInfoComponent>
|
||||
<!-- 子评论 -->
|
||||
<view class="sub-comment flex-col jc-c mt-10">
|
||||
<view v-if="comment_item.sub_comments && Array.isArray(comment_item.sub_comments) && comment_item.sub_comments.length > 0 && comment_item.show_sub_comment" style="margin-buttom: 20rpx;" class="sub-comment-list flex-col jc-c">
|
||||
<view v-for="(sub_comment_item, sub_comment_index) in comment_item.sub_comments" :key="sub_comment_index" class="sub-comment-item flex-row align-s" style="margin-bottom: 20rpx;">
|
||||
<commentInfoComponent :style="window_sub_more_style" :propComment="sub_comment_item" :propId="sub_comment_item.id" :propDropDownVisible="active_dropdown_id == sub_comment_item.id" @comment_reply="comment_reply" @comment_like="comment_like" @toggle_dropdown="handle_toggle_dropdown" @dropdown_item_click="handle_dropdown_item_click"></commentInfoComponent>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="comment_item.comments_count > 0">
|
||||
<template v-if="!comment_item.show_sub_comment">
|
||||
<commentMoreComponent :style="window_more_style" :propId="comment_item.id" :propIsLevel="1" :propText="'—— '+ $t('common.expand') + (comment_item.comments_count ? comment_item.comments_count || 0 : 0) + $t('ask-comments.ask-comments.ymmd24')" @comment_more_event="open_sub_comment"></commentMoreComponent>
|
||||
</template>
|
||||
<template v-else>
|
||||
<template v-if="comment_item.show_sub_comment_loading">
|
||||
<loading-component :style="window_more_style"></loading-component>
|
||||
</template>
|
||||
<view v-else class="sub-comment-more flex-row align-c gap-10">
|
||||
<template v-if="comment_item.page != null && comment_item.page < comment_item.page_total">
|
||||
<commentMoreComponent :style="window_more_style" :propId="comment_item.id" :propIsLevel="2" :propText="$t('common.expand')" @comment_more_event="open_sub_comment"></commentMoreComponent>
|
||||
</template>
|
||||
<commentMoreComponent :style="window_more_style" :propId="comment_item.id" :propText="$t('common.retract')" propIconName="arrow-top" @comment_more_event="close_sub_comment"></commentMoreComponent>
|
||||
</view>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</cell>
|
||||
<template v-if="comment_item_loading">
|
||||
<loading-component></loading-component>
|
||||
<cell>
|
||||
<loading-component></loading-component>
|
||||
</cell>
|
||||
</template>
|
||||
<template v-else>
|
||||
<!-- 结尾 -->
|
||||
<component-bottom-line :propStatus="goods_bottom_line_status"></component-bottom-line>
|
||||
<cell>
|
||||
<!-- 结尾 -->
|
||||
<component-bottom-line :propStatus="goods_bottom_line_status"></component-bottom-line>
|
||||
</cell>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<component-no-data :propMsg="$t('common.no_data')"></component-no-data>
|
||||
<cell>
|
||||
<component-no-data :propMsg="$t('common.no_data')"></component-no-data>
|
||||
</cell>
|
||||
</template>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- </view> -->
|
||||
</list>
|
||||
</view>
|
||||
|
||||
<view v-if="base_config_data && base_config_data.is_video_comments_add && base_config_data.is_video_comments_add == 1" class="comment-input-container">
|
||||
|
|
@ -2173,7 +2181,7 @@
|
|||
padding: 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
.comment-item {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue