最新楼层装修模块

2025-12-19 01:15:53 +08:00 · 2023-04-07 16:47:27 +08:00
parent 816d842a57
commit 1cbafbce25
19 changed files with 940 additions and 144 deletions
--- a/buyer/src/components/fixed/index.vue
+++ b/buyer/src/components/fixed/index.vue
@@ -16,23 +16,28 @@ export default {
      iconList:[
        {
          icon:"user",
-          label:"会员中心"
+          label:"会员中心",
+          path:"/home"
        },
        {
          icon:"consumer",
-          label:"客服"
+          label:"客服",
+          path:"/home"
        },
        {
          icon:"notification",
-          label:"消息"
+          label:"消息",
+          path:"/home/MsgList"
        },
        {
          icon:"feedback",
-          label:"反馈"
+          label:"反馈",
+          path:"/home"
        },
        {
          icon:"back",
-          label:"顶部"
+          label:"顶部",
+          path:"back"
        },
      ],
      isScrolling:false,
@@ -62,7 +67,7 @@ export default {
      }
    },
    handleClickIcon(val){
-        if(val.icon === 'back'){
+        if(val.path === 'back'){
          this.scrollToTop()
        }
    }
--- a/buyer/src/components/indexDecorate/ModelFormItem.vue
+++ b/buyer/src/components/indexDecorate/ModelFormItem.vue
@@ -94,6 +94,14 @@
    <template v-if="element.type == 'onlyGoodsModel'">
      <onlyGoodsModel :data="element" class="mb_20 width_1200_auto"></onlyGoodsModel>
    </template>
+    <!-- 混合模块 -->
+    <template v-if="element.type == 'mixModel'">
+      <mixModel :data="element" class="mb_20 width_1200_auto"></mixModel>
+    </template>
+    <!-- 混合模块 -->
+    <template v-if="element.type == 'forYour'">
+      <forYour :data="element" class="mb_20 width_1200_auto"></forYour>
+    </template>
    <!-- 新品排行 -->
    <template v-if="element.type == 'newGoodsSort'">
      <new-goods-sort
@@ -142,6 +150,8 @@ import Seckill from "./modelList/Seckill.vue";
 import oneRowThreeColumns from "./modelList/oneRowThreeColumns.vue";
 import goodsAndType from "./modelList/goodsAndType.vue";
 import onlyGoodsModel from "./modelList/onlyGoodsModel.vue";
+import mixModel from "./modelList/mixModel.vue";
+import forYour from "./modelList/forYour.vue";


 export default {
@@ -158,7 +168,9 @@ export default {
    Seckill,
    oneRowThreeColumns,
    goodsAndType,
-    onlyGoodsModel
+    onlyGoodsModel,
+    mixModel,
+    forYour
  },
  data() {
    return {
@@ -223,7 +235,7 @@ export default {
 }

 .width_1200_auto {
-  width: 1200px;
+  width: 1184px;
  margin: 0 auto;

 }
--- a/buyer/src/components/indexDecorate/modelList/Carousel.vue
+++ b/buyer/src/components/indexDecorate/modelList/Carousel.vue
@@ -27,8 +27,8 @@
            }}
          </div>
          <div v-if="userInfo.id">
-            <div class="icon-list flex flex-j-sb" @click="entryControl">
-              <div class="icon-item" :key="index" v-for="(item,index) in recentList">
+            <div class="icon-list flex flex-j-sb" >
+              <div class="icon-item" :key="index"  @click="entryControl(item)" v-for="(item,index) in recentList">
                <div class="value">
                  {{ item.value}}
                </div>
@@ -48,16 +48,16 @@
          </div>

          <div class="gray-line"></div>
-          <div class="icon-list flex flex-j-sb" @click="entryControl">
-            <div class="icon-item" :key="index" v-for="(item,index) in entranceList">
+          <div class="icon-list flex flex-j-sb" >
+            <div class="icon-item" @click="entryControl(item)" :key="index" v-for="(item,index) in entranceList">
              <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
              <div>
                {{ item.label}}
              </div>
            </div>
          </div>
-          <div class="icon-list flex flex-j-sb" @click="entryControl">
-            <div class="icon-item" :key="index" v-for="(item,index) in appendList">
+          <div class="icon-list flex flex-j-sb" >
+            <div class="icon-item" :key="index"  @click="entryControl(item)" v-for="(item,index) in appendList">
              <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
              <div>
                {{ item.label}}
@@ -88,19 +88,23 @@ export default {
      entranceList:[
        {
          icon:"collage",
-          label:"宝贝收藏"
+          label:"宝贝收藏",
+          path:"/home/Favorites"
        },
        {
          icon:"shop",
-          label:"收藏店铺"
+          label:"收藏店铺",
+          path:"/home/Favorites?type=STORE"
        },
        {
          icon:"carts",
-          label:"购物车"
+          label:"购物车",
+          path:"/cart"
        },
        {
          icon:"story",
-          label:"我的足迹"
+          label:"我的足迹",
+          path:"/home/MyTracks"
        },
      ],
      appendList:[
@@ -143,8 +147,9 @@ export default {
  },
  methods: {
    // 快捷跳转中心
-    entryControl(){
-
+    entryControl(val){
+      console.log(val)
+      this.$router.push(val.path)
    },
  },
   mounted() {
--- a/buyer/src/components/indexDecorate/modelList/forYour.vue
+++ b/buyer/src/components/indexDecorate/modelList/forYour.vue
@@ -0,0 +1,228 @@
+<template>
+  <div class="model" v-if="data">
+    <div class="for-your">{{ data.options.title }}</div>
+    <div class="flex card">
+      <div class="left">
+        <img :src="data.options.data.image.src" alt="" />
+      </div>
+      <div class="right flex">
+        <!-- 商品区 -->
+        <div class="goods-list">
+          <div
+            class="goods-item"
+            :key="index"
+            v-for="(item, index) in data.options.data.list"
+            @click="linkTo(item.url)"
+          >
+            <div>
+              <div class="goods-name">{{ item.title }}</div>
+              <div class="goods-desc">{{ item.desc }}</div>
+            </div>
+            <img class="goods-img" :src="item.img" alt="" />
+          </div>
+        </div>
+        <!-- 热卖区 -->
+        <div class="hot-list">
+          <div class="hot-title">{{ data.options.data.hot.title }}</div>
+          <div
+            class="hot-item flex flex-a-c"
+            v-for="(item, index) in data.options.data.hot.list"
+            :key="index"
+            @click="linkTo(item.url)"
+          >
+            <img :src="item.img" alt="" />
+            <div class="hot-goods">
+              <div class="hot-goods-title">{{ item.title }}</div>
+              <div>
+                <div class="hot-price">￥{{ item.price | unitPrice }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "forYour",
+  data() {
+    return {
+      current: "",
+    };
+  },
+  props: {
+    data: {
+      type: Object,
+      default: {},
+    },
+  },
+
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style scoped lang="scss">
+.goods-list {
+  display: flex;
+  width: 558px;
+  flex-wrap: wrap;
+}
+.goods-item {
+  width: 278px;
+  height: 277px;
+  text-align: center;
+  box-sizing: border-box;
+  cursor: pointer;
+  border-right: 1.4px solid #e2e2e2;
+  &:nth-of-type(3) {
+    border-top: 1.4px solid #e2e2e2;
+  }
+  &:nth-of-type(4) {
+    border-top: 1.4px solid #e2e2e2;
+  }
+  &:hover {
+    /deep/ .goods-name {
+      color: $theme_color;
+    }
+    /deep/ .goods-desc {
+      color: $theme_color;
+    }
+  }
+}
+
+
+.goods-name {
+  margin-top: 23px;
+  font-size: 25px;
+  font-weight: normal;
+  line-height: 30px;
+  text-align: center;
+  letter-spacing: 0px;
+
+  color: #333333;
+}
+.goods-img {
+  width: 190px;
+  height: 156px;
+  margin-top: 19px;
+  border-radius: 10px;
+}
+.goods-desc {
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 17px;
+  text-align: center;
+  margin-top: 11px;
+  letter-spacing: 0px;
+
+  color: #333333;
+}
+.for-your {
+  font-size: 35px;
+  font-weight: normal;
+  line-height: 42px;
+  text-align: center;
+  letter-spacing: 0px;
+  margin-bottom: 32px;
+
+  color: #333333;
+}
+
+.card,
+.right-card {
+  opacity: 1;
+  background: #ffffff;
+  border-radius: 10px;
+  position: relative;
+  box-shadow: 0px 1px 13px 0px #E5E5E5;
+
+  &:hover {
+    .setup-box {
+      display: block;
+    }
+  }
+}
+
+.modal-tab-bar {
+  > .flex {
+    align-items: center;
+    margin: 10px 0;
+  }
+}
+
+.draggable {
+  > .flex {
+    align-items: center;
+  }
+}
+.left {
+  width: 346px;
+  height: 554px;
+  border-radius: 9.8px 0px 0px 9.8px;
+  > img {
+    max-width: 100%;
+    height: 100%;
+  }
+}
+.right {
+  width: 839px;
+  height: 554px;
+  border-radius: 0px 9.8px 9.8px 0px;
+}
+.hot-list {
+  width: 279px;
+}
+.hot-title {
+  margin-left: 25px;
+  line-height: 63px;
+  font-size: 17px;
+  font-weight: normal;
+
+  letter-spacing: 0px;
+  color: #333333;
+  height: 63px;
+}
+.hot-item {
+  cursor: pointer;
+  box-sizing: border-box;
+  border-top: 1.4px solid #e2e2e2;
+  height: 122px;
+  padding:0 14px;
+  align-items: center;
+  &:hover {
+    > .hot-goods {
+      > .hot-goods-title {
+        color: $theme_color;
+      }
+    }
+  }
+
+  > img {
+    width: 76.3px;
+    height: 77.7px;
+  }
+}
+.hot-goods {
+  margin-left: 14px;
+}
+.hot-goods-title {
+  font-size: 13px;
+  font-weight: normal;
+  line-height: 16px;
+  letter-spacing: 0px;
+
+  color: #333333;
+}
+.hot-price {
+  margin-top: 10.3px;
+  font-size: 24px;
+  font-weight: normal;
+  line-height: 29px;
+  letter-spacing: 0px;
+
+  color: $theme_color;
+}
+</style>
--- a/buyer/src/components/indexDecorate/modelList/goodsAndType.vue
+++ b/buyer/src/components/indexDecorate/modelList/goodsAndType.vue
@@ -15,10 +15,10 @@
      </div>
    </div>
    <!-- 商品部分 -->
-    <div class="goods-list flex-j-sb">
+    <div class="only-goods-list flex-j-sb">
      <div
        v-if="paramData.options"
-        class="goods-list-item"
+        class="only-goods-list-item"
        v-for="(item, index) in paramData.options.list.filter((client) => {
          return client.___index == current;
        })"
@@ -104,7 +104,10 @@ export default {
  color: #ffffff;
  background: $theme_color;
 }
-.goods-list-item {
+.only-goods-list{
+  display: flex;
+}
+.only-goods-list-item {
  padding-top: 30px;
  width: 287px;
  height: 343.7px;
--- a/buyer/src/components/indexDecorate/modelList/mixs/mix-brand.vue
+++ b/buyer/src/components/indexDecorate/modelList/mixs/mix-brand.vue
@@ -1,9 +1,9 @@
 <template>
  <div class="flex" v-if="data.options.right.model == 'brand'">
-    <div class="left-side" >
+    <div class="left-side" @click="linkTo(data.options.right.data.image.url)">
      <img :src="data.options.right.data.image.src" alt="">
    </div>
-    <div>
+    <div class="right-side">
      <div class="badge-box flex">
        <div class="round">
          <Icon type="ios-arrow-forward" />
@@ -12,7 +12,7 @@

      </div>
      <div class="flex goods-list">
-        <div class="goods-item flex" :key="index" v-for="(item,index) in data.options.right.data.list">
+        <div class="goods-item flex" @click="linkTo(item.url)" :key="index" v-for="(item,index) in data.options.right.data.list">
          <div class="goods-thumbnail">
            <img :src="item.img" alt="">
          </div>
@@ -43,8 +43,8 @@ export default {
 </script>

 <style scoped lang="scss">
-.goods-detail{
-
+.right-side{
+  width: 330px;
 }
 .goods-detail-title{
  font-size: 13px;
@@ -59,7 +59,7 @@ export default {
  font-weight: normal;
  line-height: 17px;
  letter-spacing: 0px;
-  color: #F31947;
+  color: $theme_color;
  margin-top: 8px;
  margin-bottom:10px;
 }
@@ -87,6 +87,7 @@ export default {
  }
 }
 .goods-list{
+   width: 330px;
  flex-wrap: wrap;
  justify-content:space-between;
  padding: 0 16px;
--- a/buyer/src/components/indexDecorate/modelList/mixs/mix-goods.vue
+++ b/buyer/src/components/indexDecorate/modelList/mixs/mix-goods.vue
@@ -1,16 +1,17 @@
 <template>
    <div class="flex" v-if="data.options.left.model == 'goods'">
-      <div class="left-side" >
+      <div class="left-side"  @click="linkTo(data.options.right.data.image.url)">
        <img :src="data.options.left.data.image.src" alt="">
      </div>
-      <div>
+      <div class="right-side">
          <div class="badge-box flex">
-            <div class="badge">
-              {{data.options.left.data.badge}}
+            <div class="badge"  @click="linkTo(data.options.right.data.image.url)">
+              {{data.options.left.data.badge.label}}
            </div>
          </div>
          <div class="flex goods-list">
-            <div class="goods-item flex" :key="index" v-for="(item,index) in data.options.left.data.list">
+
+            <div class="goods-item flex"  @click="linkTo(item.url)" :key="index" v-for="(item,index) in data.options.left.data.list">
              <div class="goods-thumbnail">
                <img :src="item.img" alt="">
              </div>
@@ -45,8 +46,8 @@ export default {
 </script>

 <style scoped lang="scss">
-.goods-detail{
-
+.right-side{
+  width: 387px;
 }
 .goods-detail-title{
  font-size: 13px;
@@ -79,11 +80,13 @@ export default {
  justify-content:right;
 }
 .goods-list{
+  width: 387px;
  flex-wrap: wrap;
  justify-content:space-between;
  padding: 0 16px;
 }
 .goods-item{
+  cursor: pointer;
  display: flex;
  align-items: center;
  width: 173.6px;
--- a/buyer/src/components/indexDecorate/modelList/onlyGoodsModel.vue
+++ b/buyer/src/components/indexDecorate/modelList/onlyGoodsModel.vue
@@ -1,9 +1,9 @@
 <template>
  <div class="goods-type-wrapper">
    <!-- 商品部分 -->
-    <div class="goods-list flex" >
+    <div class="only-goods-list flex" >
      <div
-        class="goods-list-item"
+        class="only-goods-list-item"
        v-for="(item, index) in data.options.list"
        :key="index"
        @click="handleClick(item)"
@@ -86,7 +86,7 @@ export default {
  margin-left: 20px;
  margin-bottom: 10px;
 }
-.goods-list {
+.only-goods-list {
  position: relative;
  flex-wrap: wrap;
  justify-content: space-between;
@@ -101,7 +101,7 @@ export default {
  align-items: center;
  justify-content: space-between;
 }
-.goods-list-item {
+.only-goods-list-item {
  padding-top: 34.8px;
  margin-bottom: 14.3px;
  width: 287px;
@@ -155,7 +155,7 @@ export default {
  text-align: center;
  letter-spacing: 0px;

-  color: #f31947;
+  color: $theme_color;
  -webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
 }
 .goods-type-line {
@@ -172,7 +172,7 @@ export default {
  color: #333333;
 }
 .active {
-  color: #f31947;
+  color: $theme_color;
 }
 .goods-type-labels {
  font-size: 21px;
--- a/buyer/src/pages/home/memberCenter/Favorites.vue
+++ b/buyer/src/pages/home/memberCenter/Favorites.vue
@@ -53,11 +53,12 @@ export default {
      params: { // 请求参数
        pageNumber: 1,
        pageSize: 100,
-        type: 'GOODS'
+        type: this.$route.query.type || 'GOODS'
      },
      spinShow: false // 加载状态
    };
  },
+
  methods: {
    getList () { // 获取收藏列表
      this.spinShow = true
@@ -123,6 +124,7 @@ export default {
  mounted () {
    if (this.homePage) this.params.pageSize = 5;
    this.getList()
+
  }
 };
 </script>