cyy-vue-material 1.0.19 → 1.0.21

package/src/common/js/index.js

@@ -1 +1 @@
-export * from './constant.js';
+export * from './constant.js';

package/src/index.js

@@ -1,19 +1,19 @@
-// Import vue component
-import { Goods, Title, Cube, Search, Slider, GoodsOne } from "./package";
-
-const components = [Goods, Title, Cube, Search, Slider, GoodsOne];
-
-// will install the plugin only once
-const install = function (Vue) {
-  components.forEach((component) => {
-    Vue.component(component.name, component);
-  });
-};
-
-if (typeof window !== "undefined" && window.Vue) {
-  install(window.Vue);
-}
-
-export * from "./package";
-
-export default install;
+// Import vue component
+import { Goods, Title, Cube, Search, Slider, GoodsOne } from "./package";
+
+const components = [Goods, Title, Cube, Search, Slider, GoodsOne];
+
+// will install the plugin only once
+const install = function (Vue) {
+  components.forEach((component) => {
+    Vue.component(component.name, component);
+  });
+};
+
+if (typeof window !== "undefined" && window.Vue) {
+  install(window.Vue);
+}
+
+export * from "./package";
+
+export default install;

package/src/package/cyy-goods/cyy-goods.vue

@@ -1,153 +1,153 @@
-<template>
-	<div>
-		<div v-if="!props.goods" :style="noDataStyle">请选择商品</div>
-		<div v-else>
-			<div
-				:class="['cube-container', props.arrange === 1 ? 'one' : 'two']"
-				:style="{
-					paddingTop: props.paddingTop + 'px',
-					paddingLeft: props.paddingLeft + 'px',
-					paddingRight: props.paddingRight + 'px',
-					paddingBottom: props.paddingBottom + 'px',
-					gap: props.margin + 'px'
-				}"
-			>
-				<div
-					v-for="(item, index) in listArr"
-					class="cube-item"
-					:key="cyy"
-					@click="goGoodsDetail(item)"
-				>
-					<img
-						:src="item.dataPic"
-						mode="widthFix"
-						alt=""
-						:style="{
-							borderRadius: props.circular === 2 ? '0px' : '10px'
-						}"
-					/>
-					<div class="goodsName">{{ item.goodsName }}</div>
-					<div class="goodsPrice">
-						￥{{ item.pricesetNprice }}
-						<div class="scribing" v-if="props.markedPrice === 1">
-							￥{{ item.pricesetMakeprice }}
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-</template>
-
-<script>
-import { fetchGoodImpl, isLc } from '../../utils/index.js';
-import { get } from 'lodash-es';
-export default {
-	name: 'cyy-goods',
-	props: {
-		props: {
-			SelectGoods: Object,
-			arrange: Number,
-			circular: Number,
-			margin: Number,
-			markedPrice: Number,
-			paddingTop: Number,
-			paddingLeft: Number,
-			paddingRight: Number,
-			paddingBottom: Number
-		}
-	},
-	data() {
-		return {
-			listArr: [],
-			noDataStyle: {
-				width: '100%',
-				height: '180px',
-				lineHeight: '180px',
-				fontSize: '30px',
-				backgroundColor: '#ccc',
-				color: '#aaa',
-				textAlign: 'center'
-			}
-		};
-	},
-	mounted() {
-		console.log(75);
-		this.init();
-	},
-	methods: {
-		async init() {
-			const { goods = [] } = this.props;
-			const goodsCode = goods.toString();
-			const paramObj = { goodsCode };
-			const res = await fetchGoodImpl(this, paramObj);
-			this.listArr = get(res, 'list', []);
-			console.log('🐽🐽🐽🐽🐽🐽🐽🐽', this.listArr);
-		},
-
-		goGoodsDetail(item) {
-			if (isLc) {
-				return;
-			}
-			const { skuCode, skuNo } = item;
-			let params = {
-				skuCode: skuCode,
-				skuNo: skuNo
-			};
-			this.$routers.push('detail', params);
-		}
-	}
-};
-</script>
-
-<style lang="less" scoped>
-.cube-container {
-	display: grid;
-	&.two {
-		grid-template-columns: repeat(2, 1fr);
-		.goodsName {
-			padding: 15px 0 2px;
-			font-size: 16px;
-		}
-		.goodsPrice {
-			padding: 2px 0 20px;
-			font-size: 14px;
-			.scribing {
-				font-size: 12px;
-			}
-		}
-	}
-	&.one {
-		grid-template-columns: repeat(1, 1fr);
-		.goodsName {
-			padding: 20px 0 5px;
-			font-size: 20px;
-		}
-		.goodsPrice {
-			padding: 5px 0 20px;
-			font-size: 18px;
-			.scribing {
-				font-size: 14px;
-			}
-		}
-	}
-
-	.cube-item {
-		img {
-			width: 100%;
-		}
-		.goodsName {
-			color: #000000;
-		}
-		.goodsPrice {
-			color: #fe4854;
-
-			.scribing {
-				display: inline-block;
-				color: #ccc;
-				text-decoration: line-through;
-			}
-		}
-	}
-}
-</style>
+<template>
+	<div>
+		<div v-if="!props.goods" :style="noDataStyle">请选择商品</div>
+		<div v-else>
+			<div
+				:class="['cube-container', props.arrange === 1 ? 'one' : 'two']"
+				:style="{
+					paddingTop: props.paddingTop + 'px',
+					paddingLeft: props.paddingLeft + 'px',
+					paddingRight: props.paddingRight + 'px',
+					paddingBottom: props.paddingBottom + 'px',
+					gap: props.margin + 'px'
+				}"
+			>
+				<div
+					v-for="(item, index) in listArr"
+					class="cube-item"
+					:key="cyy"
+					@click="goGoodsDetail(item)"
+				>
+					<img
+						:src="item.dataPic"
+						mode="widthFix"
+						alt=""
+						:style="{
+							borderRadius: props.circular === 2 ? '0px' : '10px'
+						}"
+					/>
+					<div class="goodsName">{{ item.goodsName }}</div>
+					<div class="goodsPrice">
+						￥{{ item.pricesetNprice }}
+						<div class="scribing" v-if="props.markedPrice === 1">
+							￥{{ item.pricesetMakeprice }}
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import { fetchGoodImpl, isLc } from '../../utils/index.js';
+import { get } from 'lodash-es';
+export default {
+	name: 'cyy-goods',
+	props: {
+		props: {
+			SelectGoods: Object,
+			arrange: Number,
+			circular: Number,
+			margin: Number,
+			markedPrice: Number,
+			paddingTop: Number,
+			paddingLeft: Number,
+			paddingRight: Number,
+			paddingBottom: Number
+		}
+	},
+	data() {
+		return {
+			listArr: [],
+			noDataStyle: {
+				width: '100%',
+				height: '180px',
+				lineHeight: '180px',
+				fontSize: '30px',
+				backgroundColor: '#ccc',
+				color: '#aaa',
+				textAlign: 'center'
+			}
+		};
+	},
+	mounted() {
+		console.log(75);
+		this.init();
+	},
+	methods: {
+		async init() {
+			const { goods = [] } = this.props;
+			const goodsCode = goods.toString();
+			const paramObj = { goodsCode };
+			const res = await fetchGoodImpl(this, paramObj);
+			this.listArr = get(res, 'list', []);
+			console.log('🐽🐽🐽🐽🐽🐽🐽🐽', this.listArr);
+		},
+
+		goGoodsDetail(item) {
+			if (isLc) {
+				return;
+			}
+			const { skuCode, skuNo } = item;
+			let params = {
+				skuCode: skuCode,
+				skuNo: skuNo
+			};
+			this.$routers.push('detail', params);
+		}
+	}
+};
+</script>
+
+<style lang="less" scoped>
+.cube-container {
+	display: grid;
+	&.two {
+		grid-template-columns: repeat(2, 1fr);
+		.goodsName {
+			padding: 15px 0 2px;
+			font-size: 16px;
+		}
+		.goodsPrice {
+			padding: 2px 0 20px;
+			font-size: 14px;
+			.scribing {
+				font-size: 12px;
+			}
+		}
+	}
+	&.one {
+		grid-template-columns: repeat(1, 1fr);
+		.goodsName {
+			padding: 20px 0 5px;
+			font-size: 20px;
+		}
+		.goodsPrice {
+			padding: 5px 0 20px;
+			font-size: 18px;
+			.scribing {
+				font-size: 14px;
+			}
+		}
+	}
+
+	.cube-item {
+		img {
+			width: 100%;
+		}
+		.goodsName {
+			color: #000000;
+		}
+		.goodsPrice {
+			color: #fe4854;
+
+			.scribing {
+				display: inline-block;
+				color: #ccc;
+				text-decoration: line-through;
+			}
+		}
+	}
+}
+</style>

package/src/package/cyy-goodsOne/cyy-goodsOne.vue

@@ -3,9 +3,10 @@
     <div v-if="!props.goods" :style="noDataStyle">请选择商品样式一</div>
     <div v-else>
       <div class="three-layout">
+        商品样式1
         <div class="three-layout-title" @click="jumpToSearch()">
-          <div class="top-left" v-if="title.isShow">{{ title.title || "" }}</div>
-          <div v-if="more === 1" class="top-right">
+          <div class="top-left" v-if="!props.title.isShow">{{ props.title.title || "" }}</div>
+          <div v-if="props.more === 1" class="top-right">
             <div>更多</div>
             <image :lazy-load="true" src=""></image>
           </div>
@@ -31,35 +32,6 @@
         </div>
       </div>
     </div>
-
-    <!-- <div v-else>
-      <div
-        :class="['cube-container', props.arrange === 1 ? 'one' : 'two']"
-        :style="{
-          paddingTop: props.paddingTop + 'px',
-          paddingLeft: props.paddingLeft + 'px',
-          paddingRight: props.paddingRight + 'px',
-          paddingBottom: props.paddingBottom + 'px',
-          gap: props.margin + 'px',
-        }"
-      >
-        <div v-for="(item, index) in listArr" class="cube-item" :key="cyy" @click="goGoodsDetail(item)">
-          <img
-            :src="item.dataPic"
-            mode="widthFix"
-            alt=""
-            :style="{
-              borderRadius: props.circular === 2 ? '0px' : '10px',
-            }"
-          />
-          <div class="goodsName">{{ item.goodsName }}</div>
-          <div class="goodsPrice">
-            ￥{{ item.pricesetNprice }}
-            <div class="scribing" v-if="props.markedPrice === 1">￥{{ item.pricesetMakeprice }}</div>
-          </div>
-        </div>
-      </div>
-    </div> -->
   </div>
 </template>
 
@@ -104,11 +76,16 @@ export default {
   },
   methods: {
     async init() {
+      console.log(196);
       const { goods = [] } = this.props;
+      console.log(197);
       const goodsCode = goods.toString();
+      console.log(198);
       const paramObj = { goodsCode };
+      console.log(199, paramObj);
       const res = await fetchGoodImpl(this, paramObj);
       this.listArr = get(res, "list", []);
+      console.log(201);
       console.log("🐽🐽🐽🐽🐽🐽🐽🐽", this.listArr);
     },
 
@@ -137,14 +114,14 @@ export default {
 
 <style lang="less" scoped>
 .three-layout {
-  border-radius: 28px;
+  border-radius: 7px;
   .mask-three-more {
     position: absolute;
     top: 0px;
     display: block;
-    width: 392px;
-    height: 392px;
-    line-height: 392px;
+    width: 98px;
+    height: 98px;
+    line-height: 98px;
     background-color: #000;
     opacity: 0.5;
     font-size: 52px;
@@ -152,50 +129,50 @@ export default {
     color: #ffffff;
   }
   .three-layout-title {
-    margin: 60px 50px;
+    margin: 15px 12.5px;
     display: flex;
     justify-content: space-between;
     .top-left {
-      font-size: 64px;
+      font-size: 16px;
       font-family: PingFangSC-Semibold, PingFang SC;
       font-weight: 600;
       color: #333333;
-      line-height: 88px;
+      line-height: 22px;
     }
     .top-right {
       display: flex;
       align-items: center;
       div {
         color: #595959;
-        font-size: 48px;
+        font-size: 12px;
       }
       image {
-        width: 24px;
-        height: 36px;
-        margin-left: 12px;
+        width: 6px;
+        height: 9px;
+        margin-left: 3px;
       }
     }
   }
   .three-layout-content {
-    margin: 60px 58px;
-    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1);
-    border-radius: 28px;
+    margin: 15px 14.5px;
+    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1);
+    border-radius: 7px;
     background: #fff;
     .three-layout-bigImg {
       image {
         border-radius: 28px 28px 0 0;
         display: inline-block;
         width: 100%;
-        height: 756px;
+        height: 189px;
       }
     }
     .three-layout-goods {
       display: flex;
       justify-content: center;
-      padding: 0px 40px;
-      padding-bottom: 40px;
+      padding: 0px 10px;
+      padding-bottom: 10px;
       .goods-items {
-        width: 424px;
+        width: 106px;
       }
     }
   }
@@ -211,31 +188,31 @@ export default {
 
   .scroll-item {
     display: inline-block;
-    margin-right: 40px;
+    margin-right: 10px;
 
     image {
-      width: 392px;
-      height: 392px;
-      border-radius: 20px;
+      width: 98px;
+      height: 98px;
+      border-radius: 5px;
     }
 
     p {
-      width: 392px;
+      width: 98px;
       white-space: normal;
       display: -webkit-box;
       -webkit-box-orient: vertical;
       -webkit-line-clamp: 1;
       overflow: hidden;
-      font-size: 48px;
+      font-size: 12px;
       font-family: PingFangSC-Regular, PingFang SC;
       font-weight: 400;
       color: #000000;
-      line-height: 68px;
+      line-height: 17px;
     }
   }
 }
 
 .scroll-top {
-  margin-top: 40px;
+  margin-top: 10px;
 }
 </style>