baiqiu-cms-decoration-dg 0.0.14 → 0.1.0

package/src/components/cms/buttonItem/buttonItem.js

@@ -1,7 +1,5 @@
 import { cmsMixin } from "../mixin";
 import { dataSaveDecorationPageComponentEventFn } from '../../../utils/utils';
-import * as utils from '../utils'
-const throttle = utils.throttle
 export default {
   name:"buttonItem",
   mixins: [cmsMixin],
@@ -59,11 +57,9 @@ export default {
         paddingLeft: `${space.left}px`,
         paddingRight: `${space.right}px`
       }
-
       if(borderStyle.type === 1&& borderColor) {
         style.border = `1px solid ${borderColor}`
       }
-
       if (borderStyle.type === 2) {
         style.borderTop = borderTop ? `1px solid ${borderTop}` : 'none'
         style.borderRight = borderRight ? `1px solid ${borderRight}` : 'none'
@@ -103,7 +99,7 @@ export default {
             this.envUrl
           )
         } catch(err) {
-  
+          console.log(err)
         }
       }
       

package/src/components/cms/cms.js

@@ -42,12 +42,12 @@ export default {
     }
   },
   watch: {
-    cmsList: {
-      handler(val) {
-        console.log(val)
-      },
-      immediate: true
-    }
+    // cmsList: {
+    //   handler(val) {
+    //     console.log(val)
+    //   },
+    //   immediate: true
+    // }
   },
   data() {
     return {
@@ -63,11 +63,6 @@ export default {
     }
   },
   computed: {
-    judgeSlot() {
-      return function(index) {
-        return this.cmsList[index].attributeJson.componentList.some(ele=> {return ele.type == 106})
-      }
-    }
   },
   mounted() {
     this.$nextTick(()=>{
@@ -99,6 +94,11 @@ export default {
       let item = this.cmsList[index]
       this.$set(item, 'displayType', item.displayType ? 0 : 1)
       this.$emit('componentChange', item.sort)
+    },
+    judgeSlot(index) {
+      if(this.cmsList[index].attributeJson.componentList) {
+        return this.cmsList[index].attributeJson.componentList.some(ele=> {return ele.type == 106})
+      }
     }
   }
 }

package/src/components/cms/cms.vue

@@ -31,8 +31,8 @@
             <template v-if="item.layoutType === 3" slot="customComponent" slot-scope="scope">
               <slot name="customComponent" :attributeJson="scope.attributeJson"></slot>
             </template>
-            <template v-if="judgeSlot(index)" slot="latticeDG" slot-scope="scope">
-              <slot name="latticeDG" :attributeJson="scope.attributeJson"></slot>
+            <template v-if="judgeSlot(index)" slot="dgCustomComponent">
+              <slot name="dgCustomComponent"></slot>
             </template>
           </component>
         </div>

package/src/components/cms/imgNav/imgNav.js

@@ -3,7 +3,6 @@ import 'swiper/css/swiper.css'
 import hotspot from "../hotspot";
 import { cmsMixin } from "../mixin";
 import { dataSaveDecorationPageComponentEventFn } from '../../../utils/utils';
-import * as utils from '../utils.js'
 
 export default {
   name: "imgNav",

package/src/components/cms/mixin.js

@@ -105,7 +105,7 @@ export const cmsMixin = {
     },
     // 入场动画类别
     animateSort: {
-      handler(val) {
+      handler() {
         let type = this.animateInType
         if (type && type != 'slide') {
           this.entranceShow = false
@@ -142,7 +142,6 @@ export const cmsMixin = {
             border: borderStyle.borderColor ? `2px solid ${borderStyle.borderColor}` : 'none'
           }
         }
-
         if (borderStyle.type == 2) {
           let { borderTop, borderRight, borderBottom, borderLeft } = borderStyle
           hoverStyle = {
@@ -153,7 +152,6 @@ export const cmsMixin = {
           }
         }
       }
-
       // 焦点放大镜
       if (val.type === 3) {
         hoverStyle = {
@@ -161,12 +159,10 @@ export const cmsMixin = {
           transformOrigin: 'center center'
         }
       }
-
       // 填充
       if (val.type === 4) {
         this.hoverDirection = val.bgStyle.direction
       }
-
       // 换图
       if (val.type === 5) {
         let { hoverImgList } = val
@@ -225,14 +221,13 @@ export const cmsMixin = {
     // 悬停指令
     hoverAnimate: {
       inserted: function(el, binding, vnode) {
-        el.onmouseover = function(e) {
+        el.onmouseover = function() {
           vnode.context.hoverStyleShow = true
           if (binding.value) {
             vnode.context[binding.value.key] = binding.value.value
           }
         }
-
-        el.onmouseleave = function(e) {
+        el.onmouseleave = function() {
           vnode.context.hoverStyleShow = false
           if (binding.value) {
             vnode.context[binding.value.key] = -1

package/src/components/cms/productItem/productItem.js

@@ -35,7 +35,7 @@ export default {
       deep: true
     },
     ratio: {
-      handler(val) {
+      handler() {
         if (!this.isSwiper && this.productStyle.width) {
           this.productStyle.width = (this.attributeJson.baseStyle.w * this.ratio - this.attributeJson.goodsPaddingSpacing * 2 + this.goodsSpacing) / this.showNum + 'px'
         }
@@ -177,7 +177,7 @@ export default {
     },
     // 初始化轮播图
     initSwiper: function() {
-      let { attributeJson, mode, indicatorType, styleType } = this
+      let { attributeJson, indicatorType, styleType } = this
       this.$nextTick(() => {
         if (this.swiper) {
           this.swiper.destroy(true, true)
@@ -189,18 +189,15 @@ export default {
           slidesPerView: this.showNum,
           spaceBetween: attributeJson.goodsSpacing
         }
-
         if (styleType == 2 && indicatorType == 2) {
           this.options.pagination = { el: `.swiper-pagination-${this.sortId}`, clickable: true }
         }
-
         if (this.hasSwiperButton) {
           this.options.navigation = {
             nextEl: `.swiper-button-next-${this.sortId}`,
             prevEl: `.swiper-button-prev-${this.sortId}`
           }
         }
-
         if (this.hasScrollBar) {
           this.options.scrollbar = {
             el: `.swiper-scrollbar-${this.sortId}`,
@@ -208,7 +205,6 @@ export default {
           }
           this.options.freeMode = true
         }
-
         this.swiper = new Swiper(`.swiper-container-${this.sortId}`, this.options)
         this.$nextTick(()=>{
           this.reportData(this.windowHeight)
@@ -224,7 +220,6 @@ export default {
       this.$nextTick(()=>{
         this.reportData(this.windowHeight)
       })
-      
     },
     gotoPDP(code, colorCode, name, index) {
       try {
@@ -247,7 +242,9 @@ export default {
           },
           this.envUrl
         )
-      } catch (err) {}
+      } catch (err) {
+        console.log(err)
+      }
       this.$emit('gotoPDP', { code, colorCode })
     },
     // 上报数据

package/src/components/cms/productItem/productItem.scss

@@ -31,8 +31,8 @@
         position: relative;
         .hover-con {
           position: absolute;
-          width: fill-available;
-          width: -webkit-fill-available;
+          width: stretch;
+          width: -webkit-stretch;
         }
       }
     }

package/src/components/cms/singleLayout/singleLayout.vue

@@ -6,11 +6,12 @@
     <div
       style="width: 100%; height: 100%"
     >
-      <template v-for="(item, index) in layOutData.componentList">
-        <template v-if="item.type == 106">
-          <slot name="latticeDG" :attributeJson="item.attributeJson"></slot>
+      <div v-for="(item, index) in layOutData.componentList" :key="index">
+        <template v-if="item.type > 100">
+          {{item.sort}}
+          <slot :name="`dgCustomComponent${item.sort}`" :attributeJson="JSON.parse(JSON.stringify(item.attributeJson))"></slot>
         </template>
-        <template v-else>
+        <template v-if="item.type <= 100">
           <component
             ref="singleComponent"
             :is="item.component"
@@ -25,8 +26,7 @@
           >
           </component>
         </template>
-        
-      </template>
+      </div>
       <!--辅助线END-->
     </div>
   </div>

package/src/components/cms/slideLayout/slideLayout.js

@@ -147,7 +147,7 @@ export default {
           return
         }
         let { layWidth } = this
-        this.slideList.forEach((item, i) => {
+        this.slideList.forEach((item) => {
           let ele = item.componentList[0]
           let slideWidth = 0
           if (ele) {

package/src/components/cms/tabLayout/tabLayout.js

@@ -103,7 +103,7 @@ export default {
   },
   watch: {
     'layOutData.tabHeadInfo': {
-      handler: function(val) {
+      handler: function() {
         this.$nextTick(() => {
           this.tabHeadTitleH = this.layOutData.tabHeadInfo.showTitle == 2 ? (this.$refs['tabHeadTitleDom'] ? this.$refs['tabHeadTitleDom'].clientHeight  : 0) : 0
           this.setLayoutH()
@@ -113,9 +113,9 @@ export default {
       deep: true
     },
     'list.length': {
-      handler: function(val) {
+      handler: function() {
         //当导航变化时, 判断当前选中的选项及选中的索引
-        let ind = this.list.findIndex((item, index) => {
+        let ind = this.list.findIndex((item) => {
           return item.sort == this.activeSort
         })
         if (ind > -1) {

package/src/components/cms/textItem/textItem.js

@@ -1,72 +1,65 @@
 import { cmsMixin } from "../mixin";
-import { dataSaveDecorationPageComponentEventFn } from '../../../utils/utils';
-
+import { dataSaveDecorationPageComponentEventFn } from "../../../utils/utils";
 export default {
-  name:'textItem',
-  mixins: [cmsMixin],
-  components: {
-  },
-  props: {
-    
-  },
-  data() {  
-    return {}
-  },
-  watch: {
-    
-  },
-  methods: {
-    pageClick() {
-      if(this.attributeJson.linkObj.jumpLinkType) {
-        try {
-          dataSaveDecorationPageComponentEventFn(
-            {
-              uniqueId: this.recordId + '_' + this.sortId, // 组件_id
-              uniqueName: this.attributeJson.uniqueName, // 组件_名称
-              componentType: 12,
-              popData: {},
-              materialId: this.recordId + '_' + this.sortId, //素材id
-              materialName: this.attributeJson.uniqueName, //素材名称
-              refererPagePath: this.refererPagePath,
-              brand: this.brand,
-              path: this.path,
-              position: 1,
-              event: 'bannerClick'
-            },
-            this.envUrl
-          )
-        } catch(err) {
-  
+	name: "textItem",
+	mixins: [cmsMixin],
+	components: {},
+	props: {},
+	data() {
+		return {};
+	},
+	watch: {},
+	methods: {
+		pageClick() {
+			if (this.attributeJson.linkObj.jumpLinkType) {
+				try {
+					dataSaveDecorationPageComponentEventFn(
+						{
+							uniqueId: this.recordId + "_" + this.sortId, // 组件_id
+							uniqueName: this.attributeJson.uniqueName, // 组件_名称
+							componentType: 12,
+							popData: {},
+							materialId: this.recordId + "_" + this.sortId, //素材id
+							materialName: this.attributeJson.uniqueName, //素材名称
+							refererPagePath: this.refererPagePath,
+							brand: this.brand,
+							path: this.path,
+							position: 1,
+							event: "bannerClick",
+						},
+						this.envUrl
+					);
+				} catch (err) {
+          console.log(err)
         }
-      }
-      
-      this.$emit('jumpLink', this.attributeJson.linkObj)
-    },
-    // 上报数据
-    reportData(h) {
-      if(this.isReport) return
-      let ref = this.$refs[`text${this.attributeJson.sort}`]
-      if(!ref || ref.style.display == 'none') return
-      let el = ref.getBoundingClientRect()
-      if(el.top <= h) {
-        this.isReport = true
-        dataSaveDecorationPageComponentEventFn(
-          {
-            uniqueId: this.recordId + '_' + this.sortId, // 组件_id
-            uniqueName: this.attributeJson.uniqueName, // 组件_名称
-            componentType: 12,
-            popData: {},
-            materialId: this.recordId + '_' + this.sortId, //素材id
-            materialName: this.attributeJson.uniqueName, //素材名称
-            refererPagePath: this.refererPagePath,
-            brand: this.brand,
-            path: this.path,
-            position: 1,
-            event: 'bannerShow'
-          },
-          this.envUrl
-        )
-      }
-    }
-  }
-}
+			}
+      this.$emit("jumpLink", this.attributeJson.linkObj);
+		},
+		// 上报数据
+		reportData(h) {
+			if (this.isReport) return;
+			let ref = this.$refs[`text${this.attributeJson.sort}`];
+			if (!ref || ref.style.display == "none") return;
+			let el = ref.getBoundingClientRect();
+			if (el.top <= h) {
+				this.isReport = true;
+				dataSaveDecorationPageComponentEventFn(
+					{
+						uniqueId: this.recordId + "_" + this.sortId, // 组件_id
+						uniqueName: this.attributeJson.uniqueName, // 组件_名称
+						componentType: 12,
+						popData: {},
+						materialId: this.recordId + "_" + this.sortId, //素材id
+						materialName: this.attributeJson.uniqueName, //素材名称
+						refererPagePath: this.refererPagePath,
+						brand: this.brand,
+						path: this.path,
+						position: 1,
+						event: "bannerShow",
+					},
+					this.envUrl
+				);
+			}
+		},
+	},
+};

package/src/index.js

@@ -1,26 +1,23 @@
-import Vue from 'vue'
 import cms from './components/cms/'
-import singleLayout from './components/cms/singleLayout/'
-
-Vue.component('singleLayout', singleLayout)
-
-const components = [
+const components = {
   cms
-]
-
-const install = function(Vue) {
+}
+const install = function (Vue) {
   // 判断是否安装
-  if (install.installed) return;
+  if (install.installed) return
   // 遍历注册全局组件
-  components.map(component => Vue.component(component.name, component));
-};
-
+  Object.keys(components).forEach(key => {
+    Vue.component(key, components[key])
+  })
+}
+if (typeof window !== 'undefined' && window.Vue) {
+  install(window.Vue)
+}
 export default {
+  // 导出的对象必须具有 install，才能被 Vue.use() 方法安装
   install
-  // picNav
-  // banner
-};
+}
 
 export {
- cms
-};
+  cms
+}

package/src/main.js

@@ -1,7 +1,8 @@
-import Vue from 'vue'
-import App from './App.vue'
-
-new Vue({
-  el: '#app',
-  render: h => h(App)
-})
+import Vue from 'vue'
+import App from './App.vue'
+
+Vue.config.productionTip = false
+
+new Vue({
+  render: h => h(App),
+}).$mount('#app')

package/src/utils/http-client.js

@@ -1,5 +1,4 @@
 import axios from "axios";
-
 export const CONTENT_TYPE = {
   json: "application/json;",
   form: "application/x-www-form-urlencoded;",
@@ -13,7 +12,6 @@ export const REQ_HEADERS = {
   lang: "Accept-Language",
   contentType: "Content-Type"
 };
-
 function checkResponse(response) {
   if (response.status === 200) {
     let result = response.data;
@@ -23,14 +21,10 @@ function checkResponse(response) {
     return response.data;
   }
 }
-
 axios.interceptors.response.use(checkResponse, error => {
   // Do something with response error
-  if (error.message === "Network Error") {
-  }
   return Promise.reject(error);
 });
-
 export class HttpClient {
   static async call(
     url,
@@ -48,9 +42,7 @@ export class HttpClient {
     } else {
       params.data = body;
     }
-
     // console.log("params", params);
-
     const response = await axios(params).catch(error => {
       if (error.response) {
         // The request was made and the server responded with a status code
@@ -69,7 +61,6 @@ export class HttpClient {
     });
     return response;
   }
-
   static get(url, { mask = true, external = false, headers = {} } = {}) {
     return HttpClient.call(url, {
       headers,
@@ -77,7 +68,6 @@ export class HttpClient {
       mask
     });
   }
-
   static postBody(
     url,
     {

package/webpack.config.js

@@ -43,9 +43,6 @@ module.exports = {
         loader: "vue-loader",
         options: {
           loaders: {
-            // Since sass-loader (weirdly) has SCSS as its default parse mode, we map
-            // the "scss" and "sass" values for the lang attribute to the right configs here.
-            // other preprocessors should work out of the box, no loader config like this necessary.
             scss: ["vue-style-loader", "css-loader", "sass-loader"],
             sass: [
               "vue-style-loader",
@@ -53,13 +50,12 @@ module.exports = {
               "sass-loader?indentedSyntax"
             ]
           }
-          // other vue-loader options go here
         }
       },
       {
         test: /\.js$/,
         loader: "babel-loader",
-        // exclude: /node_modules/
+        exclude: /node_modules/
       },
       {
         test: /\.(png|jpg|gif|svg)$/,

package/.babelrc

@@ -1,17 +0,0 @@
-{
-  "presets": [
-    ["env", { "modules": false }],
-    "stage-3"
-  ],
-  "plugins": [
-    [
-      "transform-runtime",
-      {
-        "helpers": false,
-        "polyfill": false,
-        "regenerator": true,
-        "moduleName": "babel-runtime"
-      }
-    ]
-  ]
-}

package/.editorconfig

@@ -1,9 +0,0 @@
-root = true
-
-[*]
-charset = utf-8
-indent_style = space
-indent_size = 2
-end_of_line = lf
-insert_final_newline = true
-trim_trailing_whitespace = true

package/.prettierrc

@@ -1,8 +0,0 @@
-{
-  "printWidth": 200,
-  "tabWidth": 2,
-  "singleQuote": true,
-  "jsxSingleQuote": true,
-  "semi": false,
-  "htmlWhitespaceSensitivity": "ignore"
-}