接口对接

2023-03-17 14:10:05 +08:00
parent 5e7bae967e
commit c276a3f908
3 changed files with 157 additions and 43 deletions
--- a/src/project/fengdu/AppCircle/AppCircle.vue
+++ b/src/project/fengdu/AppCircle/AppCircle.vue
@@ -2,16 +2,19 @@
  <div class="AppCircle">
    <div class="top">
      <div class="left">
-        <span @click="currIndex = 0" :class="[currIndex === 0 ? 'active' : '']">广场</span>
-        <span @click="currIndex = 1" :class="[currIndex === 1 ? 'active' : '']">社区</span>
+        <span @click="changeTab(0)" :class="[currIndex === 0 ? 'active' : '']">广场</span>
+        <span @click="changeTab(1)" :class="[currIndex === 1 ? 'active' : '']">社区</span>
      </div>
      <div class="right" @click="$linkTo('./MyPostList')">
        <span>我的贴子</span>
        <i>1</i>
      </div>
    </div>
-    <div class="nav">
-      <div class="nav-item" hover-class="text-hover" v-for="(item, index) in topic" :key="index" @click="$linkTo('./TopicDetail')">
+    <div class="nav" v-if="topic.length">
+      <div
+        class="nav-item"
+        hover-class="text-hover"
+        v-for="(item, index) in topic" :key="index" @click="$linkTo('./TopicDetail?themeId=' + item.id + '&name=' + item.title)">
        <image :src="item.picUrl" mode="aspectFill" />
        <h2>{{ item.title }}</h2>
      </div>
@@ -21,7 +24,7 @@
      </div>
    </div>
    <div class="AppCircle-list">
-      <div class="item" v-for="(item, index) in list" :key="index" @click="$linkTo('./Detail')" hover-class="bg-hover">
+      <div class="item" v-for="(item, index) in list" :key="index" @click="$linkTo('./Detail?id=' + item.id + '&name=' + item.topicName + '&themeId=' + item.themeId)">
        <div class="item-top">
          <image :src="item.createUserAvatar" />
          <div class="right">
@@ -30,7 +33,7 @@
          </div>
        </div>
        <div class="item-content">
-          <span v-if="item.themeId" @click="$linkTo('./TopicDetail')">#【{{ item.topicName }}】</span>
+          <span v-if="item.themeId" @click.stop="$linkTo('./TopicDetail?themeId=' + item.themeId + '&name=' + item.topicName)">#【{{ item.topicName }}】</span>
          <text>{{ item.content }}</text>
        </div>
        <div class="item-imgs" v-if="item.files.length">
@@ -52,6 +55,7 @@
          </div>
        </div>
      </div>
+      <AiEmpty v-if="!list.length"></AiEmpty>
    </div>
    <div class="add" hover-class="text-hover" @click="$linkTo('./Add')">
      <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fatie.png" />
@@ -70,7 +74,9 @@
      return {
        currIndex: 0,
        topicList: [],
-        list: []
+        list: [],
+        isMore: false,
+        current: 1
      }
    },

@@ -102,6 +108,16 @@
        })
      },

+      changeTab (index) {
+        this.currIndex = index
+        this.isMore = false
+        this.current = 1
+
+        this.$nextTick(() => {
+          this.getList()
+        })
+      },
+
      getList () {
        if (this.isMore) return

@@ -199,9 +215,10 @@
        }

        h2 {
+          line-height: 32px;
+          margin-top: 8px;
          font-size: 26px;
          font-weight: 400;
-          line-height: 32px;
        }
      }
    }
--- a/src/project/fengdu/AppCircle/Detail.vue
+++ b/src/project/fengdu/AppCircle/Detail.vue
@@ -1,35 +1,33 @@
 <template>
-  <div class="Detail">
+  <div class="Detail" v-if="isShow">
    <div class="top">
      <div class="item-top">
-        <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fangwuchuzu.png" />
+        <image :src="info.createUserAvatar" />
        <div class="right">
-          <h3>李在地</h3>
-          <span>清风街道</span>
+          <h3>{{ info.createUserName }}</h3>
+          <span>{{ info.publishDepartName }}</span>
        </div>
      </div>
      <div class="item-content">
-        <span @click="$linkTo('./TopicDetail')">#【闲置物品交易】</span>
-        <text>社家用闲置柜子自用，原价212，现价80要的联系</text>
+        <span v-if="name" @click="toTopic('./TopicDetail?themeId=' + themeId + '&name=' + name)">#【{{ name }}】</span>
+        <text>{{ info.content }}</text>
      </div>
-      <div class="item-imgs">
-        <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
-        <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
-        <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
+      <div class="item-imgs" v-if="info.files && info.files.length">
+        <image mode="aspectFill" v-for="(item, index) in item.files" :key="index" :src="item.url" />
      </div>
-      <p>2020-12-11 10:10</p>
+      <p>{{ info.createTime }}</p>
      <div class="item-bottom">
        <div>
          <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-zhuanfa.png" />
-          <i>10</i>
+          <i>{{ info.sharedCount }}</i>
        </div>
        <div>
          <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png" />
-          <i>10</i>
+          <i>{{ info.appreciateCount }}</i>
        </div>
        <div>
          <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-pinglun.png" />
-          <i>10</i>
+          <i>{{ info.commentCount }}</i>
        </div>
      </div>
    </div>
@@ -63,13 +61,46 @@

    data () {
      return {
+        id: '',
+        isShow: false,
+        info: {},
+        name: '',
+        themeId: '',
+        isFrom: ''
      }
    },

-    onLoad() {
+    onLoad (query) {
+      this.isFrom = query.isFrom
+      this.id = query.id
+      this.$loading()
+      this.getInfo(query.id)
+      this.themeId = query.themeId
+      this.name = query.name || ''
    },

    methods: {
+      getInfo (id) {
+        this.$instance.post(`/app/appneighborhoodassistance/queryDetailById?id=${id}`).then(res => {
+          if (res.code === 0) {
+            this.info = res.data
+
+            this.isShow = true
+          }
+
+          uni.hideLoading()
+        })
+      },
+
+      toTopic (url) {
+        if (this.isFrom === 'topic') {
+          uni.navigateBack({
+            delta: 1
+          })
+        } else {
+          this.$linkTo(url)
+        }
+      }
    }
  }
 </script>
--- a/src/project/fengdu/AppCircle/TopicDetail.vue
+++ b/src/project/fengdu/AppCircle/TopicDetail.vue
@@ -1,45 +1,47 @@
 <template>
  <div class="TopicDetail">
-    <h2>#闲置物品交易</h2>
+    <h2>#{{ name }}</h2>
    <p>贴子：23913</p>
    <div class="tab">
-      <span @click="currIndex = 0" :class="[currIndex === 0 ? 'active' : '']">广场</span>
-      <span @click="currIndex = 1" :class="[currIndex === 1 ? 'active' : '']">社区</span>
+      <span @click="changeTab(0)" :class="[currIndex === 0 ? 'active' : '']">广场</span>
+      <span @click="changeTab(1)" :class="[currIndex === 1 ? 'active' : '']">社区</span>
    </div>
    <div class="AppCircle-list">
-      <div class="item" v-for="(item, index) in 10" :key="index">
+      <div
+        class="item"
+        v-for="(item, index) in list"
+        :key="index"
+        @click="$linkTo('./Detail?isFrom=topic&id=' + item.id + '&name=' + name + '&themeId=' + themeId)">
        <div class="item-top">
-          <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fangwuchuzu.png" />
+          <image :src="item.createUserAvatar" />
          <div class="right">
-            <h3>李在地</h3>
-            <span>清风街道</span>
+            <h3>{{ item.createUserName }}</h3>
+            <span>{{ item.publishDepartName }}</span>
          </div>
        </div>
        <div class="item-content">
-          <span @click="$linkTo('./TopicDetail')">#【闲置物品交易】</span>
-          <text>社家用闲置柜子自用，原价212，现价80要的联系</text>
+          <text>{{ item.content }}</text>
        </div>
-        <div class="item-imgs">
-          <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
-          <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
-          <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
+        <div class="item-imgs" v-if="item.files.length">
+          <image mode="aspectFill" v-for="(item, index) in item.files" :key="index" :src="item.url" />
        </div>
-        <p>2020-12-11 10:10</p>
+        <p>{{ item.createTime }}</p>
        <div class="item-bottom">
          <div>
            <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-zhuanfa.png" />
-            <i>10</i>
+            <i>{{ item.sharedCount }}</i>
          </div>
          <div>
            <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png" />
-            <i>10</i>
+            <i>{{ item.appreciateCount }}</i>
          </div>
          <div>
            <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-pinglun.png" />
-            <i>10</i>
+            <i>{{ item.commentCount }}</i>
          </div>
        </div>
      </div>
+      <AiEmpty v-if="!list.length"></AiEmpty>
    </div>
    <AiLogin ref="login"/>
  </div>
@@ -53,7 +55,13 @@

    data () {
      return {
-        currIndex: 0
+        currIndex: 0,
+        name: '',
+        themeId: '',
+        list: [],
+        isMore: false,
+        current: 1,
+        total: 0
      }
    },

@@ -61,11 +69,69 @@
      ...mapState(['user', 'token'])
    },

-    onLoad() {
+    onLoad (query) {
+      this.themeId = query.themeId
+      this.name = query.name
+
+      this.$nextTick(() => {
+        this.getList()
+      })
    },

    methods: {
-      ...mapActions(['autoLogin', 'authCheck'])
+      ...mapActions(['autoLogin', 'authCheck']),
+
+      changeTab (index) {
+        this.currIndex = index
+        this.isMore = false
+        this.current = 1
+
+        this.$nextTick(() => {
+          this.getList()
+        })
+      },
+
+      getList () {
+        if (this.isMore) return
+
+        this.$loading()
+        this.$instance.post(`/app/appneighborhoodassistance/list`, null, {
+          params: {
+            current: this.current,
+            size: 10,
+            source: 0,
+            themeId: this.themeId,
+            visibleRange: this.currIndex === 0 ? 1 : 0
+          }
+        }).then(res => {
+          if (res.code === 0) {
+            this.$hideLoading()
+            if (this.current > 1) {
+              this.list = [...this.list, ...res.data.records]
+            } else {
+              this.list = res.data.records
+            }
+
+            this.total = res.data.total
+
+            if (res.data.records.length < 10) {
+              this.isMore = true
+
+              return false
+            }
+
+            this.current = this.current + 1
+          } else {
+            this.isMore = true
+          }
+        }).catch(() => {
+          this.$hideLoading()
+        })
+      }
+    },
+
+    onReachBottom () {
+      this.getList()
    },

    onShareAppMessage() {