feat: ✨ pc端新增专题功能

buyer/src/api/index.js

@@ -1,5 +1,16 @@
 import request, { Method } from "@/plugins/request.js";
 
+/**
+ * 获取首页专题数据
+ */
+export function getTopicData(id) {
+  return request({
+    url: `/buyer/other/pageData/get/${id}`,
+    method: Method.GET,
+  });
+}
+
+
 // 获取首页楼层装修数据
 export function indexData(params) {
   return request({

buyer/src/pages/Index.vue

@@ -32,7 +32,7 @@
     <!-- 搜索框、logo -->
     <Search></Search>
     <!-- 商品分类 -->
-    <cateNav :showAlways="true" v-if="showNav" :large="carouselLarge" :opacity="carouselOpacity"></cateNav>
+    <cateNav :showAlways="true" v-if="showNav && $route.query.pageType === 'SPECIAL'" :large="carouselLarge" :opacity="carouselOpacity"></cateNav>
     <!-- 楼层装修部分 -->
     <model-form ref="modelForm" :data="modelForm"></model-form>
     <!-- 底部栏 -->
@@ -79,6 +79,12 @@ export default {
       carouselOpacity: false // 不同轮播分类样式
     };
   },
+  props:{
+    pageData:{
+      type:null,
+      default:""
+    }
+  },
   // created(){
 
   // },
@@ -136,7 +142,6 @@ export default {
                 return cur;
               }, []);
               if(this.autoCoupList != '' && this.autoCoupList.length > 0){
-                console.log(1231232132)
                 this.showCpmodel = true;
               }
               storage.setItem('getTimes',datas)//存储缓存
@@ -147,31 +152,41 @@ export default {
 
     } ,
     getIndexData () {
-      // 获取首页装修数据
+      if(this.pageData){
-      indexData({ clientType: 'PC' }).then(async (res) => {
+        this.parsePageData(JSON.stringify(this.pageData))
-        if (res.success) {
+      }
-          let dataJson = JSON.parse(res.result.pageData);
+      else{
-          // 秒杀活动不是装修的数据，需要调用接口判断是否有秒杀商品
+        // 获取首页装修数据
-          // 轮播图根据不同轮播，样式不同
+        indexData({ clientType: 'PC' }).then(async (res) => {
-          for (let i = 0; i < dataJson.list.length; i++) {
+          if (res.success && res.result) {
-            let type = dataJson.list[i].type
+            this.parsePageData(res.result.pageData)
-            if (type === 'carousel2') {
-              this.carouselLarge = true;
-            } else if (type === 'carousel1') {
-              this.carouselLarge = true
-              this.carouselOpacity = true
-            } else if (type === 'seckill') {
-              let seckill = await this.getListByDay()
-              dataJson.list[i].options.list = seckill
-            }
           }
-          this.modelForm = dataJson;
+        });
-          storage.setItem('navList', dataJson.list[1])
+      }
-          this.showNav = true
-          this.topAdvert = dataJson.list[0];
-        }
-      });
     },
+
+    async parsePageData(pageData){
+      let dataJson = JSON.parse(pageData);
+      // 秒杀活动不是装修的数据，需要调用接口判断是否有秒杀商品
+      // 轮播图根据不同轮播，样式不同
+      for (let i = 0; i < dataJson.list.length; i++) {
+        let type = dataJson.list[i].type
+        if (type === 'carousel2') {
+          this.carouselLarge = true;
+        } else if (type === 'carousel1') {
+          this.carouselLarge = true
+          this.carouselOpacity = true
+        } else if (type === 'seckill') {
+          let seckill = await this.getListByDay()
+          dataJson.list[i].options.list = seckill
+        }
+      }
+      this.modelForm = dataJson;
+      storage.setItem('navList', dataJson.list[1])
+      this.showNav = true
+      this.topAdvert = dataJson.list[0];
+    },
+
     async getListByDay () { // 当天秒杀活动
       const res = await seckillByDay()
       if (res.success && res.result.length) {

buyer/src/pages/Topic.vue

@@ -0,0 +1,37 @@
+<template>
+  <div v-if="pageData">
+    <Index :page-data="pageData" />
+  </div>
+</template>
+
+<script>
+import Index from './Index.vue'
+import { getTopicData } from '@/api/index'
+export default {
+  data() {
+    return {
+      pageData: ""
+    }
+  },
+  components: { Index },
+  mounted() {
+    // 接收id进行查询
+    const id = this.$route.query.id
+    this.init(id)
+  },
+  methods: {
+    async init(id) {
+      const res = await getTopicData(id)
+      if (res.success) {
+        console.log(res.result)
+        // 直接复用首页就行
+        if (res.result.pageData) {
+          this.pageData = JSON.parse(res.result.pageData)
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped></style>

buyer/src/router/index.js

@@ -88,7 +88,7 @@ const Home = (resolve) => require(["@/pages/user/Home"], resolve);
 
 const Merchant = (resolve) => require(["@/pages/Merchant"], resolve);
 const UserMain = (resolve) => require(["@/pages/home/Main"], resolve);
-
+const topic = (resolve) => require(["@/pages/Topic"], resolve);
 /**
  * 店铺入驻
  */
@@ -113,6 +113,11 @@ export default new Router({
       name: "Index",
       component: Index,
     },
+    {
+      path: "/topic", // 首页
+      name: "topic",
+      component: topic,
+    },
     {
       path: "/login", // 登陆
       name: "login",

manager/src/components/lili-dialog/link-dialog.vue

@@ -42,6 +42,7 @@ export default {
   watch: {
     changed: {
       handler(val) {
+        console.log(val,'changed')
         this.$emit("selectedLink", val[0]); //因为是单选，所以直接返回第一个
       },
       deep: true

manager/src/components/lili-dialog/template/special.vue

@@ -14,11 +14,9 @@
           </Table>
 
           <Page
-            @on-change="
+
-              (val) => {
+            @on-change="changePageNum"
-                params.pageNumber = val;
+            @on-page-size-change="changePageSize"
-              }
-            "
             :current="params.pageNumber"
             :page-size="params.pageSize"
             class="mt_10"
@@ -76,7 +74,7 @@ export default {
                   on: {
                     click: () => {
                       this.index = params.index;
-                      params.row = {...params.row,pageType:'special'}
+                      params.row = {...params.row,pageType:'special',___type:'special'}
                       this.$emit("selected", [params.row]);
                     },
                   },
@@ -94,12 +92,24 @@ export default {
   },
 
   methods: {
+    changePageNum (val) { // 修改评论页码
+      this.params.pageNumber = val;
+      this.init();
+    },
+    changePageSize (val) { // 修改评论页数
+      this.params.pageNumber = 1;
+      this.params.pageSize = val;
+      this.init();
+    },
     // 获取话题的标题
     async init() {
+      // 根据当前路径判断当前是H5还是PC
+      this.params.pageClientType = this.$route.name === 'renovation' ? 'PC' : 'H5'
       let res = await getHomeList(this.params);
       if (res.success) {
         this.loading = false;
-         this.data= res.result.records
+        this.data= res.result.records
+        this.total = res.result.total
       } else {
         this.loading = false;
       }

manager/src/utils/filters.js

@@ -237,13 +237,15 @@ export function formatDate(date, fmt) {
 
 // 楼层装修，选择链接处理跳转方式
 export function formatLinkType (item) {
-  const types = ['goods', 'category', 'shops', 'marketing', 'pages', 'other'] // 所有跳转的分类 依次为 商品、分类、店铺、活动、页面、其他
+  const types = ['goods', 'category', 'shops', 'marketing', 'pages', 'other','special'] // 所有跳转的分类 依次为 商品、分类、店铺、活动、页面、其他
   let url = '';
   switch (item.___type) {
     case 'goods':
       url =  `/goodsDetail?skuId=${item.id}&goodsId=${item.goodsId}`;
       break;
-
+    case 'special':
+      url = `/topic?id=${item.id}`
+      break;
     case 'category':
       url = `/goodsList?categoryId=${item.allId}`;
       break;

manager/src/views/page-decoration/floorList.vue

@@ -17,7 +17,9 @@
         <div class="item item-title">
           <div>页面名称</div>
           <div class="item-config">
-            <div>状态</div>
+            <div>
+              <div v-if="searchForm.pageType !== 'SPECIAL'">状态</div>
+            </div>
             <div>操作</div>
           </div>
         </div>
@@ -25,30 +27,35 @@
         <div class="item" v-for="(item, index) in list" :key="index">
           <div>{{ item.name || "暂无模板昵称" }}</div>
           <div class="item-config">
+            <div>
             <i-switch
+              v-if="searchForm.pageType !== 'SPECIAL'"
               v-model="item.pageShow"
               @on-change="releaseTemplate(item.id)"
             >
               <span slot="open">开</span>
               <span slot="close">关</span>
             </i-switch>
-            <Button
+            </div>
-              type="info"
+            <div class="action">
-              placement="right"
+                <Button
-              @click="Template(item)"
+                  type="info"
-              size="small"
+                  placement="right"
-              >编辑</Button
+                  @click="Template(item)"
-            >
+                  size="small"
-            <Button
+                  >编辑</Button
-              type="success"
+                >
-              placement="right"
+                <Button
-              @click="decorate(item)"
+                  type="success"
-              size="small"
+                  placement="right"
-              >装修</Button
+                  @click="decorate(item)"
-            >
+                  size="small"
-            <Poptip confirm title="删除此模板？" @on-ok="delTemplate(item.id)">
+                  >装修</Button
-              <Button type="error" size="small">删除</Button>
+                >
-            </Poptip>
+              <Poptip confirm title="删除此模板？" @on-ok="delTemplate(item.id)">
+                <Button type="error" size="small">删除</Button>
+              </Poptip>
+            </div>
           </div>
         </div>
         <div class="no-more" v-if="list.length == 0">暂无更多模板</div>
@@ -193,9 +200,11 @@ export default {
 
     decorate(val) {
       // 装修
+      const data = { id: val.id, pageShow: val.pageShow,pageType:this.searchForm.pageType }
+
       this.$router.push({
         name: "renovation",
-        query: { id: val.id, pageShow: val.pageShow },
+        query: data,
       });
     },
 
@@ -235,6 +244,8 @@ export default {
     },
 
     releaseTemplate(id) {
+      console.log(id)
+      // id.pageType = 'SPECIAL'
       //发布模板
       API_floor.releasePageHome(id).then((res) => {
         if (res.success) {
@@ -303,6 +314,7 @@ export default {
   align-items: center;
   justify-content: space-between;
   > .item-config {
+
     width: 250px;
     display: flex;
     justify-content: space-between;
@@ -315,4 +327,9 @@ export default {
 .item:nth-of-type(2n + 1) {
   background: #f5f7fa;
 }
+.action{
+  display: flex;
+  align-items: center;
+  width: 100px;
+}
 </style>

manager/src/views/page-decoration/modelForm.vue

@@ -32,7 +32,7 @@
           </i-input>
         </div>
       </div>
-      <div class="nav-con">
+      <div class="nav-con" v-if="$route.query.pageType !== 'SPECIAL'">
         <div class="all-categories">全部商品分类</div>
         <ul class="nav-item">
           <li v-for="(item, index) in navList.list" :key="index">
@@ -134,7 +134,7 @@
               <td>
                 <Input
                   v-model="item.url"
-                  :disabled="!!item.type && item.type !== 'link'"
+                  disabled
                 />
               </td>
               <!-- <td><Input v-model="item.sort"/></td> -->
@@ -232,6 +232,8 @@ export default {
     },
     // 已选链接
     selectedLink(val) {
+
+
       if (this.showModalNav) {
         this.selectedNav.url = this.$options.filters.formatLinkType(val);
         this.selectedNav.type =

manager/src/views/page-decoration/renovation.vue

@@ -102,7 +102,8 @@ export default {
       const data = {
         id: this.$route.query.id,
         pageData: JSON.stringify(modelForm),
-        pageShow
+        // 如果是专题页面永远关闭
+        pageShow: this.$route.query.pageType === 'SPECIAL' ? 'CLOSE' : pageShow,
       };
       API_floor.updateHome(this.$route.query.id, data).then((res) => {
         this.submitLoading = false