新闻发布

src/project/szpc/AppContentPc/AppContentPc.vue

@@ -0,0 +1,228 @@
+<template>
+  <div class="wrapper" :style="{ paddingTop: categorys.length ? '54px' : '10px' }" v-if="pageShow">
+    <div class="tabs">
+      <u-tabs
+          :list="categorys && categorys.map(e=>({name:e.categoryName}))"
+          font-size="36"
+          bg-color="transparent"
+          :bold="false"
+          inactive-color="#ccddff"
+          :is-scroll="true"
+          :gutter="16"
+          active-color="#fff"
+          :current="index"
+          @change="tabChange">
+      </u-tabs>
+    </div>
+    <div class="list-wrap" v-if="categoryList && categoryList.length">
+      <div class="list-card" hover-class="bg-hover" v-for="(category,index) in categoryList" :key="index"
+           @click="$linkTo('./contentDetail?id='+category.id)">
+        <div class="header">{{ category.title }}</div>
+        <div class="content-wrap" v-if="category.contentType==0 && category.files && category.files.length == 1">
+          <img class="img" :src="item.url" v-for="(item,index) in category.files" :key="index.id" alt="">
+        </div>
+        <div class="content-wrap" v-if="category.contentType==0 && category.files && category.files.length > 1">
+          <img class="min-img" :src="item.url" v-for="(item,index) in category.files && category.files.slice(0,3)"
+               :key="index.id" alt="">
+        </div>
+        <div class="content-wrap" v-if="category.contentType==1">
+          <img class="img" :src="category.pictureUrl" alt="">
+          <img class="play-icon" src="https://cdn.cunwuyun.cn/AppContent/play.png" alt="">
+        </div>
+        <div class="bottom">
+          <div class="left">
+            <div class="tag">{{ category.categoryName || names }}</div>
+            {{ category.createTime }}
+          </div>
+          <div class="right">
+            <em>{{ category.viewCount }}</em>
+            人看过
+          </div>
+        </div>
+      </div>
+    </div>
+    <AiEmpty v-else></AiEmpty>
+  </div>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: "AppContent",
+  appName: "内容管理",
+  data() {
+    return {
+      index: 0,
+      names: "新闻发布",
+      categorys: [],
+      categoryList: [],
+      pageShow: false,
+      search: {moduleId: '', categoryId: ''},
+      current: 1
+    }
+  },
+  onLoad(option) {
+    this.$loading()
+    // this.names = option.names;
+    this.search.areaId = option.areaId || this.user.areaId || ""
+    // this.search.moduleId = option.moduleId
+    // this.search.categoryId = option.categoryId
+    this.getName()
+    // this.getCategoryList();
+    if (option.names) {
+      uni.setNavigationBarTitle({
+        title: option.names
+      })
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+    active() {
+      return {
+        fontSize: "22px",
+        color: "#fff",
+      };
+    },
+  },
+  methods: {
+    getName() {
+      this.$instance.post("/app/appcontentmoduleinfo/listByName", null, {
+        params: {names: this.names}
+      }).then(res => {
+        if (res?.data) {
+          this.categorys = res.data?.[0]?.categoryList || [];
+          this.search.moduleId = res.data?.[0]?.id || "";
+          this.search.categoryId = res.data?.[0]?.categoryList?.[0]?.id || "";
+          this.getCategoryList();
+        } else {
+          this.$hideLoading()
+        }
+      })
+    },
+    tabChange(e) {
+      this.index = e
+      this.search.categoryId = this.categorys?.[e]?.id
+      this.getCategoryList();
+    },
+    getCategoryList() {
+      this.$instance.post("/app/appcontentinfo/list", null, {
+        params: {...this.search, size: 10, current: this.current}
+      }).then(res => {
+        if (res?.data) {
+          this.categoryList = this.current > 1 ? [...this.categoryList, ...res.data.records] : res.data.records;
+        }
+        this.pageShow = true
+        this.$hideLoading()
+      })
+    },
+  },
+  onReachBottom() {
+    this.current++;
+    this.getCategoryList();
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.wrapper {
+  padding-top: 100px;
+
+  .list-wrap {
+    box-sizing: border-box;
+    padding: 32px;
+
+    .list-card {
+      width: 100%;
+      min-height: 100px;
+      background: #FFFFFF;
+      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.02);
+      border-radius: 16px;
+      box-sizing: border-box;
+      padding: 32px;
+      margin-bottom: 24px;
+
+      .header {
+        font-size: 36px;
+        font-weight: 600;
+        color: #333333;
+        line-height: 50px;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        overflow: hidden;
+      }
+
+      .content-wrap {
+        display: flex;
+        gap: 4px;
+        flex-wrap: wrap;
+        margin-top: 24px;
+        position: relative;
+
+        .img {
+          width: 100%;
+          height: 350px;
+        }
+
+        .min-img {
+          width: 204px;
+          height: 204px;
+        }
+
+        .play-icon {
+          width: 80px;
+          height: 80px;
+          border-radius: 50%;
+          position: absolute;
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%, -50%);
+        }
+      }
+
+      .bottom {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-top: 24px;
+
+        .left {
+          display: flex;
+          align-items: center;
+          font-size: 28px;
+          font-weight: 400;
+          color: #999999;
+
+          .tag {
+            width: 144px;
+            height: 48px;
+            background: #EEEEEE;
+            border-radius: 24px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 28px;
+            font-weight: 400;
+            color: #999999;
+            margin-right: 16px;
+          }
+        }
+
+        .right {
+          font-size: 28px;
+          font-weight: 400;
+          color: #999999;
+          display: flex;
+          align-items: center;
+
+          em {
+            font-style: normal;
+            color: #4181FF;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/project/szpc/AppContentPc/contentDetail.vue

@@ -0,0 +1,55 @@
+<template>
+  <section class="contentDetail">
+    <AiDetail :detail="detail" :props="props"/>
+    <u-gap height="16"/>
+    <AiComment v-if="detail.id&&detail.isComment==1" :bid="detail.id"/>
+  </section>
+</template>
+
+<script>
+
+export default {
+  name: "contentDetail",
+  appName: "内容详情",
+  data() {
+    return {
+      detail: {title: "内容详情"},
+      props: {
+        count: "viewCount"
+      },
+      id: "",
+    }
+  },
+  onLoad({id}) {
+    if (id) {
+      this.id = id;
+      this.getDetail(id);
+    }
+  },
+  methods: {
+    getDetail(id) {
+      this.$instance.post(`/app/appcontentinfo/queryDetailById`, null, {
+        params: {id},  withoutToken: true
+      }).then(res => {
+        if (res?.data) {
+          this.detail = res.data
+        }
+      })
+    },
+  },
+  onShareAppMessage() {
+    return {
+      title: this.detail.title,
+      path: '/mods/AppContent/contentDetail?id=' + this.id
+    };
+  },
+  onReachBottom() {
+    uni.$emit("moreComments")
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.contentDetail {
+}
+</style>

src/project/szpc/AppContentPc/contentManager.vue

@@ -0,0 +1,103 @@
+<template>
+  <section class="contentManager">
+    <AiNewsList :list="list" :loadmore="loadmore" @select="showDetail">
+      <template #header>
+        <div class="search-wrap">
+          <div class="search">
+            <u-icon name="search" color="rgba(255,255,255,0.5)" size="40"></u-icon>
+            <input placeholder="请输入需要搜索的内容" class="desc" placeholder-style="color:rgba(255,255,255,0.5);"
+                   confirm-type="search" @change="onChange"/>
+          </div>
+        </div>
+      </template>
+    </AiNewsList>
+  </section>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: "contentManager",
+  appName: "搜索结果",
+  computed: {
+    ...mapState(['user']),
+    loadmore() {
+      return this.pages <= this.current ? 'loading ' : 'nomore'
+    }
+  },
+  data() {
+    return {
+      list: [],
+      current: 1,
+      pages: 0,
+      name: "",
+    }
+  },
+  onLoad(params) {
+    if (params.moduleId) {
+      this.moduleId = params.moduleId
+      this.getData(params.moduleId)
+    }
+  },
+  methods: {
+    onChange(val) {
+      this.current = 1;
+      this.getData(val.detail.value);
+    },
+    getData(title = "") {
+      let {current} = this
+      this.moduleId && this.$instance.post("/app/appcontentinfo/list", null, {
+        params: {moduleId: this.moduleId, current, size: 10, title}
+      }).then(res => {
+        if (res?.data) {
+          this.list = current > 1 ? [...this.list, ...res.data.records] : res.data.records
+          this.pages = res.data.pages
+        }
+      })
+    },
+    handleSelectArea(e) {
+      this.search.areaId = e.id
+      this.getData()
+    },
+    showDetail(row) {
+      uni.navigateTo({url: `./contentDetail?id=${row.id}`})
+    },
+  },
+  onReachBottom() {
+    this.current++;
+    this.getData()
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .search-wrap {
+  width: 750px;
+  height: 112px;
+  box-sizing: border-box;
+  padding: 0 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #4181FF;
+
+  .search {
+    width: 100%;
+    height: 64px;
+    background: rgba(0, 0, 0, .2);
+    border-radius: 32px;
+    box-sizing: border-box;
+    padding: 0 32px;
+    display: flex;
+    align-items: center;
+
+    .desc {
+      flex: 1;
+      font-size: 28px;
+      color: #FFFFFF;
+      margin-left: 16px;
+    }
+  }
+}
+</style>

src/project/szpc/AppHome/AppHome.vue

@@ -102,7 +102,7 @@
               </div>
             </div>
           </div>
-          <div class="more-text" v-if="row[categoryIndexList[r]].records.length > 5" @click="$linkTo('/mods/AppContent/AppContent?names='+row[categoryIndexList[r]].categoryName)">查看更多 ></div>
+          <div class="more-text" v-if="row[categoryIndexList[r]].records.length > 5" @click="$linkTo(`/mods/AppContent/AppContent?names=新闻发布`)">查看更多 ></div>
           <AiEmpty v-if="row[categoryIndexList[r]].records && !row[categoryIndexList[r]].records.length"/>
         </div>
       </div>
@@ -189,8 +189,12 @@ export default {
         })
       })
     },
+    toAppContent(row, index) {
+      this.$linkTo(`/mods/AppContentPc/AppContentPc?names=新闻发布&moduleId=${row[index].moduleId}&categoryId=${row[index].id}`)
+    },
     tabClick(index, val) {
       this.categoryIndexList[index] = val
+      // this.search.categoryId = this.categorys[val]
       this.$forceUpdate()
     },
     tabChange(idx) {