评论分页,我的证书
This commit is contained in:
		@@ -8,14 +8,14 @@
 | 
			
		||||
      <div class="comment" @click="showComment = true;getComment()">
 | 
			
		||||
        <img src="https://cdn.cunwuyun.cn/qujing/message.png" alt="">
 | 
			
		||||
        <div class="comm_num">
 | 
			
		||||
          <span>{{ commentList.length || 0}}</span><span v-show="commentList.length > 999">+</span>
 | 
			
		||||
          <span>{{ total || 0}}</span><span v-show="commentList.length > 999">+</span>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <u-popup v-model="showComment" mode="bottom" border-radius="32" height="80%">
 | 
			
		||||
			<h4 class="message_num">共{{ commentList.length }}条评论</h4>
 | 
			
		||||
      <div v-if="commentList.length" style="padding-bottom:70px;">
 | 
			
		||||
			<h4 class="message_num">共{{ total || 0 }}条评论</h4>
 | 
			
		||||
      <scroll-view scroll-y="true" @scrolltolower="scrollLower" class="comment_box" v-if="commentList.length">
 | 
			
		||||
        <div class="comment_card" v-for="item in commentList" :key="item.id">
 | 
			
		||||
          <div class="avatar">
 | 
			
		||||
            <img :src="item.avatar" alt="" v-if="item.avatar">
 | 
			
		||||
@@ -29,7 +29,7 @@
 | 
			
		||||
            <div class="comm_content">{{ item.content }}</div>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
      </scroll-view>
 | 
			
		||||
      <AiEmpty :description="`暂无相关评论`" class="emptyWrap" v-else/>
 | 
			
		||||
 | 
			
		||||
      <div class="comm_input_btn" @click="showSend = true,showComment= false">
 | 
			
		||||
@@ -77,6 +77,9 @@ export default {
 | 
			
		||||
      commentList: [],
 | 
			
		||||
      id: '',
 | 
			
		||||
      flag: false,
 | 
			
		||||
      current: 1,
 | 
			
		||||
      pages: 2,
 | 
			
		||||
      total: 0
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  onLoad({id}) {
 | 
			
		||||
@@ -98,9 +101,12 @@ export default {
 | 
			
		||||
    },
 | 
			
		||||
    // 评论集合
 | 
			
		||||
    getComment() {
 | 
			
		||||
      this.$instance.post(`/app/appcontentcomment/listForWX?contentId=${this.id}`).then(res=> {
 | 
			
		||||
      if(this.current > this.pages) return
 | 
			
		||||
      this.$instance.post(`/app/appcontentcomment/listForWX?contentId=${this.id}¤t=${this.current}`).then(res=> {
 | 
			
		||||
        if(res?.data) {
 | 
			
		||||
          this.commentList = res.data.records
 | 
			
		||||
          this.commentList = this.current==1? res.data.records: [...this.commentList,...res.data.records]
 | 
			
		||||
          this.total = res.data.total
 | 
			
		||||
          this.pages = res.data.pages
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
@@ -131,6 +137,10 @@ export default {
 | 
			
		||||
        this.$u.toast(err.msg)
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    scrollLower() {
 | 
			
		||||
      this.current++
 | 
			
		||||
      this.getComment()
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
  onShareAppMessage() {
 | 
			
		||||
    return {
 | 
			
		||||
@@ -146,7 +156,7 @@ export default {
 | 
			
		||||
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.contentDetail {
 | 
			
		||||
    .btn_box {
 | 
			
		||||
  .btn_box {
 | 
			
		||||
    position: fixed;
 | 
			
		||||
    bottom: 0;
 | 
			
		||||
    left: 0;
 | 
			
		||||
@@ -201,47 +211,51 @@ export default {
 | 
			
		||||
    color: #333333;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .comment_card {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    padding: 24px 32px;
 | 
			
		||||
    box-sizing: border-box;
 | 
			
		||||
  .comment_box {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    max-height: 60vh;
 | 
			
		||||
    .comment_card {
 | 
			
		||||
      display: flex;
 | 
			
		||||
      padding: 24px 32px;
 | 
			
		||||
      box-sizing: border-box;
 | 
			
		||||
 | 
			
		||||
    .avatar {
 | 
			
		||||
      width: 64px;
 | 
			
		||||
      height: 64px;
 | 
			
		||||
      border-radius: 50%;
 | 
			
		||||
      .avatar {
 | 
			
		||||
        width: 64px;
 | 
			
		||||
        height: 64px;
 | 
			
		||||
        border-radius: 50%;
 | 
			
		||||
 | 
			
		||||
      img {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
        height: 100%;
 | 
			
		||||
        img {
 | 
			
		||||
          width: 100%;
 | 
			
		||||
          height: 100%;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .comment_info {
 | 
			
		||||
      margin-left: 16px;
 | 
			
		||||
      width: calc(100% - 80px);
 | 
			
		||||
      .comment_info {
 | 
			
		||||
        margin-left: 16px;
 | 
			
		||||
        width: calc(100% - 80px);
 | 
			
		||||
 | 
			
		||||
      .avatar_info {
 | 
			
		||||
        display: flex;
 | 
			
		||||
        justify-content: space-between;
 | 
			
		||||
        .avatar_info {
 | 
			
		||||
          display: flex;
 | 
			
		||||
          justify-content: space-between;
 | 
			
		||||
 | 
			
		||||
        .avatar_name {
 | 
			
		||||
          font-weight: 500;
 | 
			
		||||
          font-size: 28px;
 | 
			
		||||
          .avatar_name {
 | 
			
		||||
            font-weight: 500;
 | 
			
		||||
            font-size: 28px;
 | 
			
		||||
            color: #333333;
 | 
			
		||||
          }
 | 
			
		||||
          .avatar_time {
 | 
			
		||||
            font-weight: 400;
 | 
			
		||||
            font-size: 26px;
 | 
			
		||||
            color: #999999;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .comm_content {
 | 
			
		||||
          margin-top: 8px;
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          font-size: 32rpx;
 | 
			
		||||
          color: #333333;
 | 
			
		||||
        }
 | 
			
		||||
        .avatar_time {
 | 
			
		||||
          font-weight: 400;
 | 
			
		||||
          font-size: 26px;
 | 
			
		||||
          color: #999999;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .comm_content {
 | 
			
		||||
        margin-top: 8px;
 | 
			
		||||
        font-weight: 400;
 | 
			
		||||
        font-size: 32rpx;
 | 
			
		||||
        color: #333333;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 
 | 
			
		||||
@@ -80,12 +80,12 @@ export default {
 | 
			
		||||
            path: "./testList",
 | 
			
		||||
            type: 'token'
 | 
			
		||||
          },
 | 
			
		||||
          // {
 | 
			
		||||
          //   icon: 'https://cdn.cunwuyun.cn/qujing/wdzs.png',
 | 
			
		||||
          //   label: "我的证书",
 | 
			
		||||
          //   path: "/mods/AppHometown/AppHometown",
 | 
			
		||||
          //   type: 'token'
 | 
			
		||||
          // }
 | 
			
		||||
          {
 | 
			
		||||
            icon: 'https://cdn.cunwuyun.cn/qujing/wdzs.png',
 | 
			
		||||
            label: "我的证书",
 | 
			
		||||
            path: "./myCertificate",
 | 
			
		||||
            type: 'token'
 | 
			
		||||
          }
 | 
			
		||||
        ],
 | 
			
		||||
      ]
 | 
			
		||||
    }
 | 
			
		||||
@@ -159,7 +159,7 @@ export default {
 | 
			
		||||
  },
 | 
			
		||||
  onShareAppMessage() {
 | 
			
		||||
    return {
 | 
			
		||||
      title: `欢迎使用数字平昌~`,
 | 
			
		||||
      title: `欢迎使用法制曲靖~`,
 | 
			
		||||
      path: `/pages/AppHome/AppHome`
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										75
									
								
								src/project/qujing/AppMine/myCertificate.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										75
									
								
								src/project/qujing/AppMine/myCertificate.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,75 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="page">
 | 
			
		||||
    <div class="list" v-if="files.length">
 | 
			
		||||
      <img v-for="(item, index) in files" :key="index" :src="item.imageUrl" alt="" @click="previewImage(index)">
 | 
			
		||||
    </div>
 | 
			
		||||
    <AiEmpty :description="`暂无数据`" class="emptyWrap" v-else/>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import {mapState} from 'vuex'
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  name: "myCertificate",
 | 
			
		||||
  appName: "我的证书",
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      files: [],
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  computed: {
 | 
			
		||||
    ...mapState(['user', 'token']),
 | 
			
		||||
  },
 | 
			
		||||
  onLoad() {
 | 
			
		||||
    uni.setNavigationBarTitle({ 
 | 
			
		||||
      title: '我的证书'
 | 
			
		||||
    })
 | 
			
		||||
    uni.setNavigationBarColor({
 | 
			
		||||
      frontColor: "#000000",
 | 
			
		||||
      backgroundColor: "#F4F6FA",
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  onLoad() {
 | 
			
		||||
    this.getFile()
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getFile() {
 | 
			
		||||
      this.$instance.post(`/app/appcertificateinfo/list?size=100`).then(res => {
 | 
			
		||||
        if (res.code == 0) {
 | 
			
		||||
          
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    previewImage(index) {
 | 
			
		||||
      var tempList = []
 | 
			
		||||
      for (var i in this.files) {
 | 
			
		||||
        tempList.push(this.files[i].imageUrl)
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      uni.previewImage({
 | 
			
		||||
        current: tempList[index],
 | 
			
		||||
        urls: tempList
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
@import "~dvcp-wui/common";
 | 
			
		||||
 | 
			
		||||
.page {
 | 
			
		||||
  width: 100%;
 | 
			
		||||
  background-color: #F4F5FA;
 | 
			
		||||
  .list {
 | 
			
		||||
    padding: 50px 0 0 32px;
 | 
			
		||||
    img {
 | 
			
		||||
      width: calc(100%/2 - 13px);
 | 
			
		||||
      height: 462px;
 | 
			
		||||
      margin: 0 26px 24px 0;
 | 
			
		||||
    }
 | 
			
		||||
    img:nth-of-type(2n) {
 | 
			
		||||
      margin-right: 0;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
		Reference in New Issue
	
	Block a user