update

mobile-code/src/api/home/index.js

@@ -0,0 +1,8 @@
+import https from '@/plugins/luch-request_0.0.7/request'
+
+/** *
+ * 首页 m
+ */
+export const getMainIndex = data => {
+	return https.get('/main/index', data)
+}

mobile-code/src/components/app-swiper.vue

@@ -2,7 +2,7 @@
 	<div class="swiper-wrap" :style="{'width': widthFn,'height': heightFn}">
 		<swiper :indicator-dots="!tagShow" :autoplay="autoplay" :interval="5000" :duration="150" class="tui-banner-swiper" :circular="true" indicator-color="#969696" indicator-active-color="#F04545" @change="bannerChange">
 			<swiper-item v-for="(item, index) in list" :key="index" @tap.stop="detail">
-				<img :src="item" class="tui-slide-image" mode="center" />
+				<img :src="item.img" class="tui-slide-image" mode="center" />
 			</swiper-item>
 		</swiper>
 		<app-tag v-if="tagShow" type="translucent" shape="circleLeft" size="small">{{index + 1}}/{{list.length}}</app-tag>

mobile-code/src/pages/goods/detail.vue

@@ -98,7 +98,10 @@ export default {
 		_getDetail() {
 			getDetail({ id: this.option.id }).then(res => {
 				this.data = res.data
-				this.imgList = this.data.imgList.filter(item => item.middle)
+				this.imgList = this.data.imgList.filter(e => {
+					e.img = e.middle
+					return e
+				})
 			})
 		},
 		// 更换数量

mobile-code/src/pages/home/components/goods-list-big.vue

@@ -0,0 +1,81 @@
+<template>
+	<div class="goods-list-big-module">
+		<div class="title-tag">
+			<div class="title-text">{{ info.categoryName }}</div>
+			<div class="title-img">
+				<img src="../../../static/images/home/goods-big-tit.png" alt />
+			</div>
+		</div>
+		<div class="goods-wrap">
+			<div class="goods-list" v-for="(item, index) in info.goodsInfoList" :key="index">
+				<div class="goods-img">
+					<img :src="item.img" alt="商品图片" mode="aspectFit" />
+				</div>
+				<div class="goods-det">
+					<div class="goods-left">
+						<div class="goods-name">{{ item.goodsName }}</div>
+						<div class="app-price">￥{{ item.price }}</div>
+					</div>
+					<div class="button-com red buy-com-btn" @click="$util.pageTo(`/pages/goods/detail?id=${item.id}`)">购买</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'goods-list-big',
+	props: {
+		info: {
+			type: Object,
+			default: () => {}
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style lang="scss" scoped>
+	.goods-list-big-module {
+		.title-tag {
+            position: relative;
+			.title-text {
+                position: absolute;
+                left: 0;
+                right: 0;
+                font-size: 34px;
+                text-align: center;
+            }
+            .title-img {
+                width: 94%;
+                margin: 0 auto 30px;
+            }
+        }
+        // 商品列表
+		.goods-list {
+			background-color: #fff;
+			box-shadow: 4px 4px 10px #eee;
+			margin-top: 20px;
+			&:first-child {
+				margin-top: 0;
+			}
+			.goods-img {
+				height: 534px;
+				img {
+					height: 100%;
+				}
+			}
+			.goods-det {
+				@include disFlex(flex-end, space-between);
+				font-size: 28px;
+				padding: 0 20px 30px;
+				.goods-left {
+					& > div {
+						margin-top: 24px;
+					}
+				}
+			}
+		}
+	}
+</style>

mobile-code/src/pages/home/components/goods-list-middle.vue

@@ -0,0 +1,89 @@
+<template>
+	<div class="goods-list-middle-module">
+		<div class="title-tag">
+			<div class="title-text">{{ info.categoryName }}</div>
+			<div class="title-img">
+				<img src="../../../static/images/home/goods-middle-tit.png" alt />
+			</div>
+		</div>
+		<div class="goods-wrap">
+			<div class="goods-list" v-for="(item, index) in info.goodsInfoList" :key="index">
+				<div class="goods-img">
+					<img :src="item.img" alt="商品图片" mode="aspectFit" />
+				</div>
+				<div class="goods-det">
+					<div class="goods-left">
+						<div class="goods-name">{{ item.goodsName }}</div>
+						<div class="app-price">￥{{ item.price }}</div>
+					</div>
+					<div class="button-com red buy-com-btn" @click="$util.pageTo(`/pages/goods/detail?id=${item.id}`)">购买</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'goods-list-middle',
+	props: {
+		info: {
+			type: Object,
+			default: () => {}
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+	.goods-list-middle-module {
+		.title-tag {
+            position: relative;
+			.title-text {
+                position: absolute;
+                top: 60px;
+                left: 0;
+                right: 0;
+                font-size: 36px;
+                text-align: center;
+                color: #DB112D;
+            }
+            .title-img {
+                width: 100%;
+                margin: 0 auto 30px;
+            }
+        }
+		.goods-list {
+			position: relative;
+			@include disFlex(center, flex-start);
+			background-color: #fff;
+			box-shadow: 4px 4px 10px #eee;
+			margin-top: 20px;
+			&:first-child {
+				margin-top: 0;
+			}
+			.goods-img {
+				width: 346px;
+				height: 346px;
+				img {
+					height: 100%;
+				}
+			}
+			.goods-det {
+				width: calc(100% - 386px);
+				font-size: 28px;
+				padding: 20px 20px 40px;
+				.goods-left {
+					.goods-name {
+						margin-bottom: 24px;
+					}
+				}
+			}
+			.buy-com-btn {
+				position: absolute;
+				right: 20px;
+				bottom: 20px;
+			}
+		}
+	}
+</style>

mobile-code/src/pages/home/components/goods-list-small.vue

@@ -0,0 +1,81 @@
+<template>
+	<div class="goods-list-big-module">
+		<div class="title-tag">
+			<div class="title-text">{{ info.categoryName }}</div>
+			<div class="title-img">
+				<img src="../../../static/images/home/goods-small-tit.png" alt />
+			</div>
+		</div>
+		<div class="goods-wrap">
+			<div class="goods-list" v-for="(item, index) in info.goodsInfoList" :key="index">
+				<div class="goods-img">
+					<img :src="item.img" alt="商品图片" mode="aspectFit" />
+				</div>
+				<div class="goods-det">
+					<div class="goods-left">
+						<div class="goods-name">{{ item.goodsName }}</div>
+						<div class="app-price">￥{{ item.price }}</div>
+					</div>
+					<div class="button-com red buy-com-btn" @click="$util.pageTo(`/pages/goods/detail?id=${item.id}`)">购买</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'goods-list-big',
+	props: {
+		info: {
+			type: Object,
+			default: () => {}
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+	.goods-list-big-module {
+		.title-tag {
+			.title-text {
+                font-size: 38px;
+                text-align: center;
+            }
+            .title-img {
+                width: 296px;
+                margin: 10px auto 48px;
+            }
+		}
+		.goods-wrap {
+			@include disFlex(flex-start, space-between);
+			flex-wrap: wrap;
+		}
+		.goods-list {
+			width: 48%;
+			background-color: #fff;
+			box-shadow: 4px 4px 10px #eee;
+			margin-top: 20px;
+			&:nth-child(-n + 2) {
+				margin-top: 0;
+			}
+			.goods-img {
+				width: 346px;
+				height: 346px;
+				img {
+					height: 100%;
+				}
+			}
+			.goods-det {
+				@include disFlex(flex-end, space-between);
+				font-size: 28px;
+				padding: 0 20px 30px;
+				.goods-left {
+					& > div {
+						margin-top: 24px;
+					}
+				}
+			}
+		}
+	}
+</style>

mobile-code/src/pages/home/index.vue

@@ -1,37 +1,90 @@
 <template>
 	<div class="app-main app-content">
-		<button @click="toPay">去支付页</button>
-		<button @click="$util.pageTo('/pages/callback/index')">支付回调</button>
+		<!-- <button @click="toPay">去支付页</button>
 		<button @click="$util.pageTo('/pages/user/register')">注册</button>
-		<button @click="$util.pageTo('/pages/chat/index')">聊天</button>
+		<button @click="$util.pageTo('/pages/chat/index')">聊天</button>-->
 		<!-- <app-footer /> -->
+		<app-swiper v-if="!$util.isEmpty(ad)" :list="ad" @detail="adDetailFn" />
+		<block v-if="!$util.isEmpty(category)">
+			<div class="goods-module" v-for="(item, index) in category" :key="index">
+				<goods-list-big v-if="item.showRow == 1" :info="item" />
+				<!-- <goods-list-middle :list="[]" /> -->
+				<goods-list-small v-if="item.showRow == 2" :info="item" />
+			</div>
+		</block>
+		<app-trademark />
 	</div>
 </template>
 
 <script>
+import AppSwiper from '@/components/app-swiper'
+import AppTrademark from '@/components/module/app-trademark'
+// 商品组件
+import goodsListBig from '@/pages/home/components/goods-list-big'
+import goodsListMiddle from '@/pages/home/components/goods-list-middle'
+import goodsListSmall from '@/pages/home/components/goods-list-small'
 // import AppFooter from '@/components/app-footer'
+// api
+import { getMainIndex } from '@/api/home'
 export default {
 	name: 'home',
 	components: {
+		AppSwiper,
+		AppTrademark,
+		goodsListBig,
+		goodsListMiddle,
+		goodsListSmall
 		// AppFooter
 	},
 	data() {
-		return {}
+		return {
+			data: {},
+			ad: [],
+			category: [],
+			columnStyle: null
+		}
 	},
 	onLoad(option) {
-		uni.setNavigationBarTitle({
-			title: '国兰花尚'
-		})
+		this.init()
 	},
 	methods: {
-		toPay() {
-			uni.navigateTo({
-				url: '/pages/pay/index'
+		init() {
+			uni.setNavigationBarTitle({
+				title: '国兰花尚'
+			})
+			this._detail()
+		},
+		_detail() {
+			getMainIndex().then(res => {
+				this.data = res.data
+				if (this.$util.isEmpty(res.data)) return false
+				this.ad = res.data.ad.map(e => {
+					e.img = e.adImg
+					return e
+				})
+				this.category = res.data.category
+				this.columnStyle = res.data.columnStyle
 			})
+		},
+		// operate
+		adDetailFn(item) {
+			location.href = item.url
 		}
 	}
 }
 </script>
 
 <style lang="scss" scoped>
+	.app-content {
+		// padding-bottom: 100px;
+	}
+	.goods-module {
+		padding: 0 20px;
+		margin-top: 40px;
+		/deep/.buy-com-btn {
+			font-size: 24px;
+			padding: 10px 20px 12px;
+			box-shadow: 8px 8px 20px #eee;
+		}
+	}
 </style>

mobile-code/src/pages/home/shop.vue

@@ -77,7 +77,10 @@ export default {
 			getShop(form).then(res => {
 				this.data = res.data
 				if (this.$util.isEmpty(res.data)) return false
-				this.ad = res.data.ad
+				this.ad = res.data.ad.map(e => {
+					e.img = e.adImg
+					return e
+				})
 				this.shop = res.data.shop
 			})
 		},

mobile-code/src/pages/order/detail.vue

@@ -125,7 +125,7 @@
 <script>
 import { mapGetters } from 'vuex'
 import ListModule from '@/components/module/app-order-list'
-import AppCoupon from '@/components/app-coupon-sel'
+import AppCouponSel from '@/components/app-coupon-sel'
 // api
 import { getDetail } from '@/api/order'
 import { getShopUser } from '@/utils/auth'
@@ -138,7 +138,7 @@ export default {
 	name: 'order-detail',
 	components: {
 		ListModule,
-		AppCoupon
+		AppCouponSel
 	},
 	data() {
 		return {