最新楼层装修模块

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()
         }
     }

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;
 
 }

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-list flex flex-j-sb" >
-              <div class="icon-item" :key="index" v-for="(item,index) in recentList">
+              <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-list flex flex-j-sb" >
-            <div class="icon-item" :key="index" v-for="(item,index) in entranceList">
+            <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-list flex flex-j-sb" >
-            <div class="icon-item" :key="index" v-for="(item,index) in appendList">
+            <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() {

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>

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;

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;

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">
+            <div class="badge"  @click="linkTo(data.options.right.data.image.url)">
-              {{data.options.left.data.badge}}
+              {{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;

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;

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>

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

@@ -66,7 +66,6 @@ export default {
       }, []);
       this.wap.forEach((items,indexs) => {
         if(items.title == '活动'){
-          console.log(32323232323232)
           this.wap.splice(indexs,1)
         }
       })

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

@@ -117,7 +117,6 @@ export default {
     if(urls.indexOf('/floorList/renovation') != -1){
       this.linkList.forEach((items,indexs)=>{
         if(items.title == '砍价'){
-          console.log(12321322,indexs)
           this.linkList.splice(indexs,1)
         }
       })
@@ -136,7 +135,7 @@ export default {
       this.linkVisible = false
     }
 
-  },  
+  },
   methods: {
     handleLink(val, index) {
       val = { ...val, ___type: "other" };

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

@@ -1,7 +1,7 @@
 <template>
   <div class="wrapper">
     <div class="content">
-      <div >
+      <div>
         <div class="tables">
           <Table
            border
@@ -22,7 +22,7 @@
             :current="params.pageNumber"
             :page-size="params.pageSize"
             class="mt_10"
-            :total="Number(totals)"
+            :total="Number(total)"
             size="small"
             show-elevator
           />

manager/src/views/page-decoration/modelConfig.js

@@ -789,7 +789,7 @@ export const modelData = [{
         data:{
           image:{
             url:"",
-            src:require('@/assets/mix-bg1.png'),
+            src:'https://lili-system.oss-cn-beijing.aliyuncs.com/mix-bg1.png',
             size:"197 * 344"
           },
           list:[
@@ -830,7 +830,7 @@ export const modelData = [{
         data:{
           image:{
             url:"",
-            src:require('@/assets/mix-bg2.png'),
+            src:'https://lili-system.oss-cn-beijing.aliyuncs.com/mix-bg2.png',
             size:"254 * 344"
           },
           list:[
@@ -872,6 +872,80 @@ export const modelData = [{
     },
   },
 
+  {
+    type: 'forYour',
+    name: '为你推荐',
+    icon: 'md-image',
+    options: {
+        model:'goods',
+        title:"为你推荐",
+        //数据集合
+        data:{
+          image:{
+            url:"",
+            src:'https://lili-system.oss-cn-beijing.aliyuncs.com/mix-bg3.png',
+            size:"197 * 344"
+          },
+          list:[
+            {
+              img:"https://lili-system.oss-cn-beijing.aliyuncs.com/example1.png",
+              title:"标题",
+              desc:"精品好物等你挑",
+              url:"",
+              size:"346 * 554"
+            },
+            {
+              img:"https://lili-system.oss-cn-beijing.aliyuncs.com/example2.png",
+              title:"标题",
+              desc:"精品好物等你挑",
+              url:"",
+              size:"190 * 156"
+            },
+            {
+              img:"https://lili-system.oss-cn-beijing.aliyuncs.com/example3.png",
+              title:"标题",
+              desc:"精品好物等你挑",
+              url:"",
+              size:"190 * 156"
+            },
+            {
+              img:"https://lili-system.oss-cn-beijing.aliyuncs.com/example4.png",
+              title:"标题",
+              desc:"精品好物等你挑",
+              url:"",
+              size:"190 * 156"
+            },
+          ],
+          hot:{
+            title:"最近热卖",
+            list:[
+              {
+                img:"https://i.loli.net/2021/05/14/KTLSrOVJmEdX12A.png",
+                title:"商品标题",
+                price:"120",
+                url:"",
+              },{
+                img:"https://i.loli.net/2021/05/14/KTLSrOVJmEdX12A.png",
+                title:"商品标题",
+                price:"120",
+                url:"",
+              },{
+                img:"https://i.loli.net/2021/05/14/KTLSrOVJmEdX12A.png",
+                title:"商品标题",
+                price:"120",
+                url:"",
+              },{
+                img:"https://i.loli.net/2021/05/14/KTLSrOVJmEdX12A.png",
+                title:"商品标题",
+                price:"120",
+                url:"",
+              },
+            ]
+          }
+      },
+
+    },
+  },
 
   {
     type: 'notEnough',

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

@@ -127,6 +127,10 @@
     <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 == 'oneRowThreeColumns'">
       <oneRowThreeColumns :data="element" class="mb_20 width_1200_auto"></oneRowThreeColumns>
@@ -261,6 +265,7 @@ import goodsType from "./modelList/goodsAndType.vue";
 import ossManage from "@/views/sys/oss-manage/ossManage";
 
 import mixModel from "./modelList/mixModel.vue";
+import forYour from "./modelList/forYour.vue";
 import onlyGoodsModel from "./modelList/onlyGoodsModel.vue";
 
 import oneRowThreeColumns from "./modelList/oneRowThreeColumns.vue";
@@ -282,7 +287,8 @@ export default {
     oneRowThreeColumns,
     "seckill-only-album":seckillOnlyAlbum,
     onlyGoodsModel,
-    mixModel
+    mixModel,
+    forYour
   },
   data() {
     return {

manager/src/views/page-decoration/modelList/forYour.vue

@@ -0,0 +1,444 @@
+<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"
+          >
+            <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"
+          >
+            <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 class="setup-box">
+        <div>
+          <Button size="small" @click.stop="handleSelectModel()">编辑 </Button>
+        </div>
+      </div>
+    </div>
+
+    <Modal
+      v-model="showModal"
+      title="装修"
+      draggable
+      width="800"
+      :z-index="100"
+      :mask-closable="false"
+    >
+      <div>
+        <div class="modal-tab-bar">
+          <div>
+            主标题:
+            <Input style="width: 200px" v-model="data.options.title"></Input>
+          </div>
+          <Divider>左侧商品部分</Divider>
+          <div class="flex">
+            <div>图片 :</div>
+            <div>
+              <img class="image" :src="data.options.data.image.src" alt="" />
+              <div>
+                <div>推荐尺寸：{{ data.options.data.image.size }}</div>
+                <div class="link-src">
+                  链接地址：
+                  <Input
+                    style="width: 200px"
+                    v-model="data.options.data.image.url"
+                    disabled
+                  />
+                </div>
+                <Button
+                  size="small"
+                  type="primary"
+                  @click="handleSelectImg('image')"
+                  >选择图片
+                </Button>
+                <Button
+                  size="small"
+                  class="ml_10"
+                  type="primary"
+                  @click="handleSelectLink('image')"
+                  >选择链接
+                </Button>
+              </div>
+            </div>
+          </div>
+
+          <Divider>中间商品部分</Divider>
+          <div class="flex column-list">
+            <div
+              v-for="(item, index) in data.options.data.list"
+              :key="index"
+              class="draggable"
+            >
+              <div class="flex">
+                <img :src="item.img" class="column-img" />
+                <div class="column-goods-list">
+                  <div><Input v-model="item.title"></Input></div>
+                  <div><Input v-model="item.desc"></Input></div>
+                  <div><Input disabled v-model="item.url"></Input></div>
+                  <div>{{ item.size }}</div>
+                  <Button
+                    size="small"
+                    class="ml_10"
+                    type="primary"
+                    @click="handleSelectLink('list', index)"
+                    >选择链接
+                  </Button>
+                  <Button
+                    size="small"
+                    class="ml_10"
+                    type="primary"
+                    @click="handleSelectImg('list', index)"
+                    >选择图片
+                  </Button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <Divider>右侧商品部分</Divider>
+          <div class="flex">
+            <div>右侧标题 :</div>
+            <Input
+              style="width: 200px"
+              v-model="data.options.data.hot.title"
+            ></Input>
+          </div>
+          <div class="flex column-list">
+            <div
+              v-for="(item, index) in data.options.data.hot.list"
+              :key="index"
+              class="draggable"
+            >
+              <div class="flex">
+                <img :src="item.img" class="column-img" />
+                <div class="column-goods-list">
+                  <Button
+                    size="small"
+                    class="ml_10"
+                    type="primary"
+                    @click="handleSelectGoods('hot', index)"
+                    >选择商品
+                  </Button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </Modal>
+
+    <!-- 选择商品。链接 -->
+    <liliDialog
+      ref="liliDialog"
+      @selectedLink="selectedLink"
+      @selectedGoodsData="selectedGoodsData"
+    ></liliDialog>
+
+    <!-- 选择图片 -->
+    <Modal width="1200px" v-model="picModelFlag" footer-hide>
+      <ossManage
+        @callback="callbackSelected"
+        :isComponent="true"
+        ref="ossManage"
+      />
+    </Modal>
+  </div>
+</template>
+
+<script>
+import ossManage from "@/views/sys/oss-manage/ossManage.vue";
+
+export default {
+  name: "forYour",
+  data() {
+    return {
+      showModal: false,
+
+      picModelFlag: false,
+      selectedData: "", //选中的数据
+      goodsIndex: 0, // 商品索引
+      align: "",
+      defaultCallbackImageType: "",
+      current: "",
+    };
+  },
+  props: {
+    data: {
+      type: Object,
+      default: {},
+    },
+  },
+  components: {
+    ossManage,
+  },
+  mounted() {
+   },
+  methods: {
+    handleSelectImg(type, index) {
+      this.defaultCallbackImageType = type;
+      this.goodsIndex = index;
+      // 选择图片
+      this.$refs.ossManage.selectImage = true;
+      this.picModelFlag = true;
+    },
+
+    handleSelectGoods(val, index) {
+      this.$refs.liliDialog.open("goods");
+      this.$refs.liliDialog.singleGoods();
+      this.selectedData = val;
+      this.goodsIndex = index;
+    },
+    handleSelectLink(val, index) {
+      // 调起选择链接弹窗
+      this.$refs.liliDialog.open("link");
+      this.selectedData = val;
+
+      this.goodsIndex = index;
+    },
+    // 回显图片
+    callbackSelected(val) {
+      this.picModelFlag = false;
+      if (this.defaultCallbackImageType == "image") {
+        this.data.options.data.image.src = val.url;
+      } else {
+        this.data.options.data[this.defaultCallbackImageType][
+          this.goodsIndex
+        ].img = val.url;
+      }
+    },
+    // 选择商品回调
+    selectedGoodsData(val) {
+      this.data.options.data.hot.list[this.goodsIndex].img = val[0].thumbnail;
+      this.data.options.data.hot.list[this.goodsIndex].title = val[0].goodsName;
+      this.data.options.data.hot.list[this.goodsIndex].price = val[0].price;
+      this.data.options.data.hot.list[this.goodsIndex].url =
+        this.$options.filters.formatLinkType(val[0]);
+
+      console.log(val, this.selectedData, this.goodsIndex);
+    },
+    // 选择链接回调
+    selectedLink(val) {
+      console.log(val,this.selectedData)
+      if (this.selectedData == "image") {
+        this.data.options.data.image.url =
+          this.$options.filters.formatLinkType(val);
+      } else {
+        console.log(this.data.options.data.list,this.goodsIndex)
+        this.data.options.data.list[
+          this.goodsIndex
+        ].url =  this.$options.filters.formatLinkType(val);
+      }
+    },
+    /*
+     * 点击不同模块进行编辑
+     * 判断也很简单，就是第一个第二个模块进行判断
+     *
+     * */
+    handleSelectModel() {
+      this.showModal = true;
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+@import "./setup-box.scss";
+.goods-list {
+  display: flex;
+  width: 558px;
+  flex-wrap: wrap;
+}
+.goods-item {
+  width: 278px;
+  height: 277px;
+  text-align: center;
+  box-sizing: border-box;
+  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;
+  }
+}
+.active {
+  color: #f31947;
+}
+
+.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;
+  border-radius: 10px;
+  margin-top: 19px;
+}
+.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;
+}
+.column-goods-list {
+  > div {
+    margin: 10px;
+  }
+}
+.link-src {
+  margin: 10px 0;
+}
+
+.card,
+.right-card {
+  opacity: 1;
+  background: #ffffff;
+
+  position: relative;
+
+  &:hover {
+    .setup-box {
+      display: block;
+    }
+  }
+}
+
+.column-img {
+  width: 100px;
+  height: 100px;
+}
+
+.column-list {
+  flex-wrap: wrap;
+
+  > div {
+    width: 50%;
+  }
+}
+
+.image {
+  max-width: 100px;
+}
+
+.modal-tab-bar {
+  > .flex {
+    align-items: center;
+    margin: 10px 0;
+  }
+}
+
+.draggable {
+  margin: 10px 0;
+  > .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 {
+  box-sizing: border-box;
+  border-top: 1.4px solid #e2e2e2;
+  height: 122px;
+  padding-left: 14px;
+  align-items: center;
+  > 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: #f31947;
+}
+</style>

manager/src/views/page-decoration/modelList/mixModel.vue

@@ -2,29 +2,23 @@
   <div class="mix-model">
     <!-- 左侧 -->
     <div class="left-card">
-      <left :data="data"/>
+      <left :data="data" />
       <div class="setup-box">
         <div>
-          <Button
+          <Button size="small" @click.stop="handleSelectModel('left')"
-            size="small"
+            >编辑
-            @click.stop="handleSelectModel('left')"
+          </Button>
-          >编辑
-          </Button
-          >
         </div>
       </div>
     </div>
     <!-- 右侧 -->
     <div class="right-card">
-      <right :data="data"/>
+      <right :data="data" />
       <div class="setup-box">
         <div>
-          <Button
+          <Button size="small" @click.stop="handleSelectModel('right')"
-            size="small"
+            >编辑
-            @click.stop="handleSelectModel('right')"
+          </Button>
-          >编辑
-          </Button
-          >
         </div>
       </div>
     </div>
@@ -41,56 +35,65 @@
           <div>
             当前模块 :
             <ButtonGroup>
-              <Button :type="current.model == 'goods' ? 'primary' : 'default'">商品</Button>
+              <Button :type="current.model == 'goods' ? 'primary' : 'default'"
-              <Button :type="current.model == 'brand' ? 'primary' : 'default'">品牌</Button>
+                >商品</Button
+              >
+              <Button :type="current.model == 'brand' ? 'primary' : 'default'"
+                >品牌</Button
+              >
             </ButtonGroup>
           </div>
 
           <div class="flex">
-
+            <div>图片 :</div>
             <div>
-              图片 :
+              <img class="image" :src="current.data.image.src" alt="" />
-            </div>
-            <div>
-              <img class="image" :src="current.data.image.src" alt="">
               <div>
                 <div>推荐尺寸：{{ current.data.image.size }}</div>
                 <div class="link-src">
                   链接地址：
-                  <Input style="width: 200px;" v-model="current.data.image.url" disabled/>
+                  <Input
+                    style="width: 200px"
+                    v-model="current.data.image.url"
+                    disabled
+                  />
                 </div>
                 <Button
                   size="small"
                   type="primary"
-                  @click="handleSelectImg(current.data.image)"
+                  @click="handleSelectImg('default')"
-                >选择图片
+                  >选择图片
-                </Button
+                </Button>
-                >
                 <Button
                   size="small"
                   class="ml_10"
                   type="primary"
                   @click="handleSelectLink('image')"
-                >选择链接
+                  >选择链接
-                </Button
+                </Button>
-                >
               </div>
             </div>
           </div>
           <div class="flex" v-if="current.model == 'goods'">
-            <div>
+            <div>标签 :</div>
-              标签 :
+            <Input
-            </div>
+              style="width: 200px"
-            <Input style="width:200px" type="text" v-model="current.data.badge.label"/>
+              type="text"
-            <Input style="width:100px; margin-left:10px" disabled type="text" v-model="current.data.badge.value"/>
+              v-model="current.data.badge.label"
+            />
+            <Input
+              style="width: 100px; margin-left: 10px"
+              disabled
+              type="text"
+              v-model="current.data.badge.url"
+            />
             <Button
               size="small"
               class="ml_10"
               type="primary"
               @click="handleSelectLink('badge')"
-            >选择链接
+              >选择链接
-            </Button
+            </Button>
-            >
           </div>
           <div class="flex column-list">
             <div
@@ -99,39 +102,36 @@
               class="draggable"
             >
               <div class="flex">
-                <img :src="item.img" class="column-img"/>
+                <img :src="item.img" class="column-img" />
                 <Button
                   size="small"
                   class="ml_10"
                   type="primary"
                   v-if="current.model == 'goods'"
-                  @click="handleSelectGoods('list',index)"
+                  @click="handleSelectGoods('list', index)"
-                >选择商品
+                  >选择商品
-                </Button
+                </Button>
-                >
                 <div>
-                  <div style="margin-bottom: 10px">
+                  <div  v-if="current.model == 'brand'" style="margin-bottom: 10px">
-                    <Input v-model="item.url" />
+                    <Input disabled v-model="item.url" />
                   </div>
                   <Button
                     size="small"
                     class="ml_10"
                     type="primary"
                     v-if="current.model == 'brand'"
-                    @click="handleSelectLink('list',index)"
+                    @click="handleSelectLink('list', index)"
                   >
                     选择链接
-                  </Button
+                  </Button>
-                  >
                   <Button
                     size="small"
                     class="ml_10"
                     type="primary"
                     v-if="current.model == 'brand'"
-                    @click="handleSelectImg('list',index)"
+                    @click="handleSelectImg('list', index)"
-                  >选择图片
+                    >选择图片
-                  </Button
+                  </Button>
-                  >
                 </div>
               </div>
             </div>
@@ -159,8 +159,8 @@
 </template>
 
 <script>
-import left from './mixs/mix-goods'
+import left from "./mixs/mix-goods";
-import right from './mixs/mix-brand'
+import right from "./mixs/mix-brand";
 import ossManage from "@/views/sys/oss-manage/ossManage.vue";
 
 export default {
@@ -172,25 +172,26 @@ export default {
       picModelFlag: false,
       selectedData: "", //选中的数据
       goodsIndex: 0, // 商品索引
-      align: ""
+      align: "",
-    }
+      defaultCallbackImageType: "",
+    };
   },
   props: {
     data: {
       type: Object,
-      default: {}
+      default: {},
-    }
+    },
   },
   components: {
     left,
     right,
-    ossManage
+    ossManage,
-  },
-  mounted() {
-
   },
+  mounted() {},
   methods: {
-    handleSelectImg() {
+    handleSelectImg(type, index) {
+      this.defaultCallbackImageType = type;
+      this.goodsIndex = index;
       // 选择图片
       this.$refs.ossManage.selectImage = true;
       this.picModelFlag = true;
@@ -199,54 +200,68 @@ export default {
     handleSelectGoods(val, index) {
       this.$refs.liliDialog.open("goods");
       this.$refs.liliDialog.singleGoods();
-      this.selectedData = val
+      this.selectedData = val;
-      this.goodsIndex = index
+      this.goodsIndex = index;
     },
     handleSelectLink(val, index) {
       // 调起选择链接弹窗
       this.$refs.liliDialog.open("link");
-      this.selectedData = val
+      this.selectedData = val;
-      this.goodsIndex = index
+      this.goodsIndex = index;
-
     },
     // 回显图片
     callbackSelected(val) {
       this.picModelFlag = false;
-      this.current.data.image.src = val.url;
+      if (this.defaultCallbackImageType == "default") {
+        console.log(this.current.data.image);
+        this.current.data.image.src = val.url;
+      } else {
+        console.log(this.goodsIndex, this.data.options[this.align].data.list);
+        this.data.options[this.align].data.list[this.goodsIndex].img = val.url;
 
+        // this.data.options[this.align].data[this.selectedData][this.goodsIndex].url = val.img
+      }
     },
     // 选择商品回调
     selectedGoodsData(val) {
-      console.log(val)
+      console.log(val);
       this.$nextTick(() => {
-        this.data.options[this.align].data.list[this.goodsIndex].img = val[0].thumbnail
+        this.data.options[this.align].data.list[this.goodsIndex].img =
-        this.data.options[this.align].data.list[this.goodsIndex].title = val[0].goodsName
+          val[0].thumbnail;
-        this.data.options[this.align].data.list[this.goodsIndex].price = val[0].price
+        this.data.options[this.align].data.list[this.goodsIndex].title =
-        this.data.options[this.align].data.list[this.goodsIndex].url = val[0].url
+          val[0].goodsName;
-      })
+        this.data.options[this.align].data.list[this.goodsIndex].price =
-      console.log(this.data.options[this.align].data.list[this.goodsIndex])
+          val[0].price;
+        this.data.options[this.align].data.list[this.goodsIndex].url =
+          val[0].url;
+      });
+      console.log(this.data.options[this.align].data.list[this.goodsIndex]);
       this.$forceUpdate();
     },
     // 选择链接回调
     selectedLink(val) {
-      console.log(val)
+      if (this.selectedData != "list") {
-      this.data.options[this.align].data[this.selectedData].url = this.$options.filters.formatLinkType(val);
+        this.data.options[this.align].data[this.selectedData].url = this.$options.filters.formatLinkType(val);
-      console.log(this.data.options[this.align].data[this.selectedData]);
+        console.log(this.data.options[this.align].data[this.selectedData])
+      }
+      if (this.selectedData == "list") {
+         this.data.options[this.align].data[this.selectedData][this.goodsIndex]
+        .url = this.$options.filters.formatLinkType(val);
+      }
     },
     /*
-    * 点击不同模块进行编辑
+     * 点击不同模块进行编辑
-    * 判断也很简单，就是第一个第二个模块进行判断
+     * 判断也很简单，就是第一个第二个模块进行判断
-    *
+     *
-    * */
+     * */
     handleSelectModel(align) {
       this.align = align;
-      this.current = this.data.options[align]
+      this.current = this.data.options[align];
-      console.log(this.data.options[align])
+      console.log(this.data.options[align]);
-      this.showModal = true
+      this.showModal = true;
-
     },
-  }
+  },
-}
+};
 </script>
 
 <style scoped lang="scss">
@@ -261,13 +276,14 @@ export default {
   justify-content: space-between;
 }
 
-.left-card, .right-card {
+.left-card,
+.right-card {
   width: 584px;
   height: 344px;
   border-radius: 10px;
   opacity: 1;
-  background: #FFFFFF;
+  background: #ffffff;
-  box-shadow: 0px 1px 13px 0px #E5E5E5;
+  box-shadow: 0px 1px 13px 0px #e5e5e5;
   position: relative;
 
   &:hover {
@@ -294,7 +310,6 @@ export default {
   max-width: 100px;
 }
 
-
 .modal-tab-bar {
   > .flex {
     align-items: center;

manager/src/views/page/article-manage/articleList.vue

@@ -149,7 +149,7 @@ import {
 import Editor from "@tinymce/tinymce-vue";
 import { initEditor } from "@/components/editor/config";
 export default {
-  name: "article",
+
   components: {
     editor: Editor,
   },