|
@@ -1,269 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="container">
|
|
|
- <u-sticky>
|
|
|
- <view class="pop-top">
|
|
|
- <view class="top-box">
|
|
|
- <view class="top-black-box"></view>
|
|
|
- </view>
|
|
|
- <view class="top-title"> {{ total }}条回复 </view>
|
|
|
- </view>
|
|
|
- </u-sticky>
|
|
|
-
|
|
|
- <view class="center-box">
|
|
|
- <view class="center-item" v-for="(item, index) of init_list" :key="index">
|
|
|
- <view class="item-top">
|
|
|
- <view class="top-left">
|
|
|
- <view class="top-img">
|
|
|
- <image :src="item.userDTO.avatar" class="img" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="top-text">
|
|
|
- <view class="text-title">{{ item.userDTO.nickname }}</view>
|
|
|
- <view class="text-address"> {{ item.distanceTime }} </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="top-right">
|
|
|
- <u-icon
|
|
|
- :name="item.clickStatus == 0 ? 'heart' : 'heart-fill'"
|
|
|
- size="22"
|
|
|
- @click="handlerFocus(item)"
|
|
|
- ></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="item-text"> {{ item.content }} </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- <empty v-if="total == 0" /> -->
|
|
|
-
|
|
|
- <view class="bottom-box">
|
|
|
- <view class="bottom-item">
|
|
|
- <view class="item-left">
|
|
|
- <u--input
|
|
|
- placeholder="写回复"
|
|
|
- border="surround"
|
|
|
- v-model="content"
|
|
|
- shape="circle"
|
|
|
- customStyle="background-color:#F2F2F2"
|
|
|
- ></u--input>
|
|
|
- </view>
|
|
|
- <view class="item-right">
|
|
|
- <button @click="handlerPopPublishBtn" class="btn">发布</button>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { addClientComment, clientCommentList } from '@/api/client/message.js';
|
|
|
-import { addEvaulateRecords } from '@/api/client/community.js';
|
|
|
-// import empty from '@/components/empty/index.vue';
|
|
|
-import { GetDateToNewData } from "@/utils/tools.js"
|
|
|
-export default {
|
|
|
- // components: { empty },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- content: '',
|
|
|
- init_list: [],
|
|
|
- total: 0,
|
|
|
- };
|
|
|
- },
|
|
|
- props: ['dynamicId', 'dynamicUserId'],
|
|
|
- watch: {
|
|
|
- dynamicId(newValue) {
|
|
|
- if (newValue != null) {
|
|
|
- this.handlerInitList();
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 初始化评论列表
|
|
|
- handlerInitList() {
|
|
|
- let params = {
|
|
|
- dynamicId: this.dynamicId,
|
|
|
- parentId: 0,
|
|
|
- userId: this.dynamicUserId,
|
|
|
- };
|
|
|
- clientCommentList(params).then(res => {
|
|
|
- res.data.records.map(rs=>{
|
|
|
- let time = GetDateToNewData(rs.createTime)
|
|
|
- this.$set(rs,'distanceTime',time)
|
|
|
- })
|
|
|
- this.init_list = res.data.records;
|
|
|
- this.total = res.data.total;
|
|
|
- });
|
|
|
- },
|
|
|
- // 发布评论
|
|
|
- handlerPopPublishBtn() {
|
|
|
- let params = {
|
|
|
- dynamicId: this.dynamicId,
|
|
|
- targetUserId:this.dynamicUserId,
|
|
|
- parentId: 0,
|
|
|
- content: this.content,
|
|
|
- status: 0,
|
|
|
- };
|
|
|
- addClientComment(params).then(res => {
|
|
|
- if (res.code === 'OK') {
|
|
|
- uni.showToast({
|
|
|
- title: '发布成功',
|
|
|
- icon: 'none',
|
|
|
- });
|
|
|
- this.content = '';
|
|
|
- this.handlerInitList();
|
|
|
- this.$emit('uploadComment');
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- // 关注按钮
|
|
|
- handlerFocus(item) {
|
|
|
- let params = {
|
|
|
- dynamicStatusType: 'GOOD', // 操作类型:1-点赞;2-踩 允许值: GOOD, BAD
|
|
|
- recordType: 'COMMENT', // 内容类型:1-动态;2-评论/回复 允许值: DYNAMIC, COMMENT, USER
|
|
|
- actionType: item.clickStatus == 0 ? 'ADD' : 'CANCEL', // 点击类型:1-点赞/踩;2-取消赞/取消踩 允许值: ADD, CANCEL
|
|
|
- contentId: item.id,
|
|
|
- targetUserId: item.userId,
|
|
|
- };
|
|
|
- addEvaulateRecords(params).then(res => {
|
|
|
- if (res.code === 'OK') {
|
|
|
- uni.showToast({
|
|
|
- title: '关注成功',
|
|
|
- icon: 'none',
|
|
|
- });
|
|
|
- this.handlerInitList();
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: res.msg,
|
|
|
- icon: 'none',
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-.container {
|
|
|
- height: 70vh;
|
|
|
- overflow-y: auto;
|
|
|
- box-sizing: border-box;
|
|
|
- padding-bottom: 120rpx;
|
|
|
-
|
|
|
- .pop-top {
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 40rpx;
|
|
|
- padding: 20rpx 0;
|
|
|
- }
|
|
|
-
|
|
|
- .top-box {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
-
|
|
|
- .top-black-box {
|
|
|
- width: 10%;
|
|
|
- height: 10rpx;
|
|
|
- background-color: #000;
|
|
|
- border-radius: 10%;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .top-title {
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #000;
|
|
|
- text-align: center;
|
|
|
- margin-top: 20rpx;
|
|
|
- letter-spacing: 2rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .center-box {
|
|
|
- margin-bottom: 20rpx;
|
|
|
- padding: 0 20rpx;
|
|
|
-
|
|
|
- .center-item {
|
|
|
- margin-bottom: 40rpx;
|
|
|
- border-radius: 20rpx;
|
|
|
-
|
|
|
- .item-top {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .top-left {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .top-img {
|
|
|
- .img {
|
|
|
- width: 80rpx;
|
|
|
- height: 80rpx;
|
|
|
- border-radius: 50%;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .top-text {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-around;
|
|
|
- margin-left: 10rpx;
|
|
|
-
|
|
|
- .text-title {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #000;
|
|
|
- }
|
|
|
-
|
|
|
- .text-address {
|
|
|
- color: #8f8f8f;
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .item-text {
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 0 40rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .bottom-box {
|
|
|
- position: absolute;
|
|
|
- bottom: 0;
|
|
|
- background-color: #fff;
|
|
|
- width: 100%;
|
|
|
- height: 150rpx;
|
|
|
-
|
|
|
- .bottom-item {
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- padding: 10rpx 20rpx 0;
|
|
|
- box-sizing: border-box;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .item-left {
|
|
|
- width: 60%;
|
|
|
- height: 70rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .item-right {
|
|
|
- width: 30%;
|
|
|
- padding: 20rpx;
|
|
|
-
|
|
|
- .btn {
|
|
|
- border-radius: 20rpx;
|
|
|
- text-align: center;
|
|
|
- color: #fff;
|
|
|
- background: linear-gradient(to right, #e8cbc0, #636fa4);
|
|
|
- height: 70rpx;
|
|
|
- font-size: 28rpx;
|
|
|
- line-height: 70rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|