user change

pages/index/index.vue

@@ -11,15 +11,21 @@
 		<view class="mp-height"></view>
 		<!-- #endif -->
 		<!-- 头部轮播 -->
-		<view class="carousel-section">
+		<!-- <view class="carousel-section"> -->
 			<!-- 标题栏和状态栏占位符 -->
-			<view class="titleNview-placing"></view>
+<!-- 			<view class="titleNview-placing"></view> -->
 			<!-- 背景色区域 -->
 			<!-- <view class="titleNview-background" :style="{ backgroundColor: '#5DBC7C' }"></view> -->
-			<view class="titleNview-background" :style="{ backgroundColor: '#efe9df' }"></view>
+<!-- 			<view class="titleNview-background" ></view>
 			<swiper class="carousel" autoplay="true" duration="400" interval="5000" @change="swiperChange">
 				<swiper-item v-for="(item, index) in carouselList" :key="index" class="carousel-item" @click="bannerNavToUrl(item)"><image :src="item.pic" /></swiper-item>
 			</swiper>
+		</view> -->
+		<view class="titleNview-placing"></view>
+		<view class="swiper-wrapper">
+			<swiper class="swiper" autoplay="true" duration="400" interval="5000" @change="swiperChange" circular>
+				<swiper-item v-for="(item, index) in carouselList" :key="index" class="swiper-item" @click="bannerNavToUrl(item)"><image :src="item.pic" /></swiper-item>
+			</swiper>
 		</view>
 		<!-- 自定义swiper指示器 -->
 		<view class="swiper-dot">
@@ -82,11 +88,11 @@
 				<view class="left-wrapper"><image src="../../static/img/spimg1.jpg" mode="scaleToFill"></image></view>
 				<view class="right-wrapper">
 					<view class="right-title">湿热肝上火气肺痰煲汤材料</view>
-					<view class="right-addr">
-						<view class="shop-img"><image src="../../static/img/shop.png" mode=""></image></view>
-						<view class="shop-name">子臣台州旗舰店</view>
-						<view class="point-img"><image src="../../static/img/point.png" mode=""></image></view>
-						<view class="point-disc">200m</view>
+					<view class="ex-addr">
+						<image src="../../static/img/shop.png" mode="" class="name-img"></image>
+						子臣台州旗舰店
+						<image src="../../static/img/point.png" mode="" class="point-img"></image>
+						200m
 					</view>
 					<view class="right-bottom">
 						<view class="sp-price">
@@ -102,11 +108,11 @@
 				<view class="left-wrapper"><image src="../../static/img/spimg1.jpg" mode="scaleToFill"></image></view>
 				<view class="right-wrapper">
 					<view class="right-title">湿热肝上火气肺痰煲汤材料</view>
-					<view class="right-addr">
-						<view class="shop-img"><image src="../../static/img/shop.png" mode=""></image></view>
-						<view class="shop-name">子臣台州旗舰店</view>
-						<view class="point-img"><image src="../../static/img/point.png" mode=""></image></view>
-						<view class="point-disc">200m</view>
+					<view class="ex-addr">
+						<image src="../../static/img/shop.png" mode="" class="name-img"></image>
+						子臣台州旗舰店
+						<image src="../../static/img/point.png" mode="" class="point-img"></image>
+						200m
 					</view>
 					<view class="right-bottom">
 						<view class="sp-price">
@@ -122,11 +128,11 @@
 				<view class="left-wrapper"><image src="../../static/img/spimg1.jpg" mode="scaleToFill"></image></view>
 				<view class="right-wrapper">
 					<view class="right-title">湿热肝上火气肺痰煲汤材料</view>
-					<view class="right-addr">
-						<view class="shop-img"><image src="../../static/img/shop.png" mode=""></image></view>
-						<view class="shop-name">子臣台州旗舰店</view>
-						<view class="point-img"><image src="../../static/img/point.png" mode=""></image></view>
-						<view class="point-disc">200m</view>
+					<view class="ex-addr">
+						<image src="../../static/img/shop.png" mode="" class="name-img"></image>
+						子臣台州旗舰店
+						<image src="../../static/img/point.png" mode="" class="point-img"></image>
+						200m
 					</view>
 					<view class="right-bottom">
 						<view class="sp-price">
@@ -150,30 +156,33 @@
 				<view class="exgood-title">湿热肝上火气肺痰煲湿热肝上火气肺痰煲</view>
 				<view class="ex-addr">
 					<image src="../../static/img/shop.png" mode="" class="name-img"></image>
-					  子臣台州旗舰店
+					子臣台州旗舰店
 					<image src="../../static/img/point.png" mode="" class="point-img"></image>
-					 200m
+					200m
 				</view>
 				<view class="ex-price">
 					￥26+20
 					<text class="tx1">积分</text>
 					<text class="tx2">￥99</text>
 				</view>
+				<view class="bg"></view>
 			</view>
+
 			<view class="exgood-wrapper">
 				<view class="ex-img-wrapper"><image src="../../static/img/ex1.jpg" mode=""></image></view>
 				<view class="exgood-title">湿热肝上火气肺痰煲湿热肝上火气肺痰煲</view>
 				<view class="ex-addr">
 					<image src="../../static/img/shop.png" mode="" class="name-img"></image>
-					  子臣台州旗舰店
+					子臣台州旗舰店
 					<image src="../../static/img/point.png" mode="" class="point-img"></image>
-					 200m
+					200m
 				</view>
 				<view class="ex-price">
 					￥26+20
 					<text class="tx1">积分</text>
 					<text class="tx2">￥99</text>
 				</view>
+				<view class="bg"></view>
 			</view>
 		</view>
 		<!-- 分类 -->
@@ -1012,11 +1021,14 @@ export default {
 }
 
 page {
+	// background-color: red;
+
 	.cate-section {
 		position: relative;
 		z-index: 5;
 		border-radius: 16rpx 16rpx 0 0;
 		margin-top: -20rpx;
+
 	}
 
 	.carousel-section {
@@ -1559,13 +1571,10 @@ page {
 				width: 192rpx;
 				height: 231rpx;
 				margin: 0 42rpx 0 0;
-				// padding: 0 10rpx;
-				// background-color: #009688;
 				flex-shrink: 0;
 				.image-wrapper {
 					width: 192rpx;
 					height: 150rpx;
-					// background: #e5e5e5;
 					border-radius: 10rpx;
 					overflow: hidden;
 					image {
@@ -1575,8 +1584,6 @@ page {
 					}
 				}
 				.good-title {
-					// width: 174rpx;
-					// height: 25rpx;
 					padding: 15rpx 0rpx 0rpx 6rpx;
 					font-size: 26rpx;
 					font-weight: 500;
@@ -1622,6 +1629,7 @@ page {
 	background-image: url(../../static/img/bg2.png);
 	background-size: 100% 100%;
 	margin: 35rpx auto 39rpx;
+	background-color: #fff;
 	.spgood {
 		width: 100%;
 		height: 200rpx;
@@ -1684,6 +1692,26 @@ page {
 					color: #dcb876;
 				}
 			}
+			.ex-addr {
+				margin-top: 16rpx;
+				padding-left: 22rpx;
+				height: 22rpx;
+				font-size: 22rpx;
+				font-weight: 500;
+				color: #dcb876;
+				image {
+					height: 22rpx;
+				}
+				.name-img {
+					// vertical-align: ;
+					width: 26rpx;
+					margin: 0 4rpx -3rpx 0;
+				}
+				.point-img {
+					width: 16rpx;
+					margin: 0 4rpx -3rpx 14rpx;
+				}
+			}
 			.right-bottom {
 				margin-top: 47rpx;
 				// justify-items: flex-end;
@@ -1730,19 +1758,18 @@ page {
 	}
 }
 .exchange-wrapper {
+	background-color: #fff;
 	width: 696rpx;
 	// height: 100rpx;
 	margin: 37rpx auto 39rpx;
 	// padding: 0 27rpx;
 	display: flex;
-	flex-wrap: wrap;
 	justify-content: space-between;
+	position: relative;
 	.exgood-wrapper {
 		width: 342rpx;
 		height: 540rpx;
-		background-image: url(../../static/img/bg3.png);
-		background-size: 100% 100%;
-		// margin-right: 12rpx;
+		box-shadow: 0px 4px 18px 0px rgba(144, 27, 33, 0.13);
 		.ex-img-wrapper {
 			width: 342rpx;
 			height: 338rpx;
@@ -1767,44 +1794,84 @@ page {
 			height: 22rpx;
 			font-size: 22rpx;
 			font-weight: 500;
-			color: #DCB876;
+			color: #dcb876;
 			image {
 				height: 22rpx;
 			}
 			.name-img {
 				width: 26rpx;
-				margin: 0 4rpx 0 0;
+				margin: 0 4rpx -3rpx 0;
 			}
 			.point-img {
 				width: 16rpx;
-				margin: 0 4rpx 0 14rpx;
+				margin: 0 4rpx -3rpx 14rpx;
 			}
 		}
 		.ex-price {
 			margin-top: 17rpx;
 			padding-left: 22rpx;
-			// height: 30rpx;
 			font-size: 36rpx;
 			font-weight: bold;
-			color: #901B21;
-			vertical-align:bottom;
-			// line-height: 35rpx;
+			color: #901b21;
+			vertical-align: bottom;
 			.tx1 {
 				font-size: 24rpx;
 				vertical-align: baseline;
 				position: relative;
 				top: -2rpx;
-				// line-height: 20rpx;
 			}
 			.tx2 {
 				margin-left: 9rpx;
 				font-size: 26rpx;
 				font-weight: 500;
 				text-decoration: line-through;
-				color: #9D9D9D;
+				color: #9d9d9d;
 				line-height: 35rpx;
 			}
 		}
+		.bg {
+			position: absolute;
+			top: 0;
+			width: 342rpx;
+			height: 540rpx;
+			background-image: url(../../static/img/bg3.png);
+			background-size: 100% 100%;
+		}
+	}
+}
+.titleNview-placing {
+	height: var(--status-bar-height);
+	padding-top: 44px;
+	box-sizing: content-box;
+}
+.swiper-wrapper {
+	width: 720rpx;
+	height: 370rpx;
+	border-radius: 15rpx;
+	// background-color: #bfa;
+	overflow: hidden;
+	margin: 0 auto;
+	.swiper {
+		width: 100%;
+		height: 370rpx;
+		.swiper-item {
+			width: 100%;
+			height: 100%;
+			// box-sizing: content-box;
+			padding:0 10rpx;
+
+			image {
+				width: 100%;
+				height: 100%;
+				
+				border-radius: $border-radius-sm;
+			}
+		}
 	}
 }
+.container {
+	// background-color: red;
+	background-image: url(../../static/img/main_bg.png);
+	background-size: 100%;
+}
 </style>

pages/user/user.vue

@@ -14,11 +14,11 @@
 					</view>
 					<view class="config iconfont">
 						<text class="setting iconsetting" @click="navTo('/pages/set/set')"></text>
-						<text class="message iconmessage" @click="navTo('/pages/user/notice')"></text>
+						<!-- <text class="message iconmessage" @click="navTo('/pages/user/notice')"></text> -->
 					</view>
 				</view>
 				<!-- 会员卡功能 -->
-				<view class="vip-card-box">
+				<!-- <view class="vip-card-box">
 					<image class="card-bg" src="/static/img/vip-card-bg.png" mode=""></image>
 					<view class="b-btn">我要升级</view>
 					<view class="tit">
@@ -27,10 +27,14 @@
 					</view>
 					<text class="e-m">DCloud Union</text>
 					<text class="e-b">开通会员开发无bug 一测就上线</text>
-				</view>
-			</view>
-
-			<view
+				</view> -->
+			</view>
+			
+<!-- 			<view class="user-info">
+				
+			</view> -->
+			
+<!-- 			<view
 				class="cover-container"
 				:style="[
 					{
@@ -41,21 +45,22 @@
 				@touchstart="coverTouchstart"
 				@touchmove="coverTouchmove"
 				@touchend="coverTouchend"
-			>
-				<image class="arc" src="/static/img/arc.png"></image>
-
+			> -->
+				<!-- <image class="arc" src="/static/img/arc.png"></image> -->
+			<view class="cover-container">
 				<view class="tj-sction">
 					<view class="tj-item" @click="navTo('/pages/money/wallet')">
+						<text>我的余额</text>
 						<text class="num">{{ userInfo.now_money || '0.00' }}</text>
-						<text>余额</text>
-					</view>
-					<view class="tj-item" @click="navTo('/pages/user/award')">
-						<text class="num">{{ userInfo.brokerage_price || '0.00' }}</text>
-						<text>佣金</text>
 					</view>
 					<view class="tj-item" @click="navTo('/pages/user/scoreAccumulate')">
+						<text>我的积分</text>
 						<text class="num">{{ userInfo.integral || '0.00' }}</text>
-						<text>积分</text>
+					</view>
+					<view class="tj-item" @click="navTo('/pages/user/award')">
+						<text>我的推广</text>
+						<!-- <text>我的佣金</text> -->
+						<text class="num">{{ userInfo.brokerage_price || '0.00' }}</text>
 					</view>
 				</view>
 				<!-- 订单 -->
@@ -67,7 +72,11 @@
 							<text>全部订单</text>
 							<text class="iconfont iconenter"></text>
 						</view>
-					</view> -->
+					</view> -->
+					<view class="user-item">
+						<text>我的订单</text>
+						<text class="iconfont iconenter" @click="loadMore()"></text>
+					</view>
 					<view class="order-section">
 						<view class="order-item" @click="navTo('/pages/order/order?state=0')" hover-class="common-hover" :hover-stay-time="50">
 							<view class=" icon position-relative">
@@ -110,7 +119,11 @@
 				<view class="item-box">
 					<!-- <view class="box-title flex borde-b">
 						<view class="title"><text>我的资产</text></view>
-					</view> -->
+					</view> -->
+					<view class="user-item">
+						<text>我的工具</text>
+						<!-- <text class="iconfont iconenter" @click="loadMore()"></text> -->
+					</view>
 					<view class="order-section">
 						<view class="order-item" @click="navTo('/pages/money/wallet')" hover-class="common-hover" :hover-stay-time="50">
 							<view class="icon"><image class="icon-img" src="/static/icon/u1.png" mode="aspectFit"></image></view>
@@ -132,7 +145,7 @@
 				</view>
 
 				<!-- 浏览历史 -->
-				<view class="history-section icon">
+				<!-- <view class="history-section icon">
 					<view class="sec-header">
 						<text class="iconfont iconfavor"></text>
 						<text>浏览历史</text>
@@ -153,7 +166,7 @@
 						<uni-list-item title="邀请好友" @click="navTo('/pages/user/shareQrCode')" thumb="/static/icon/img10.png"></uni-list-item>
 						<uni-list-item title="关于我们" @click="navTo('/pages/shareQrCode/index')" thumb="/static/icon/img09.png"></uni-list-item>
 					</uni-list>
-				</view>
+				</view> -->
 			</view>
 		</scroll-view>
 	</view>
@@ -318,7 +331,8 @@ export default {
 </script>
 <style lang="scss">
 page {
-	height: 100%;
+	height: 100%;
+	background-color: #f8f6f6;
 }
 %flex-center {
 	display: flex;
@@ -387,9 +401,17 @@ page {
 	}
 	.config {
 		font-size: 48rpx;
-		height: 130rpx;
+		height: 130rpx;
+		position: relative;
+		left: -32rpx;
+		bottom: -41rpx;
 		.setting {
-			margin-right: 51rpx;
+			// margin-right: 51rpx;
+			// margin-top: 50rpx;
+			// position: absolute;
+			// top: 0;
+			// bottom: 0;
+			// margin: auto 0;
 		}
 	}
 }
@@ -552,5 +574,24 @@ page {
 			border-radius: 10rpx;
 		}
 	}
+}
+.user-item {
+	font-size: 30rpx;
+	font-weight: bold;
+	color: #666666;
+	border-bottom: 1px #F5F5F5 solid;
+	padding: 25rpx 20rpx 26rpx 20rpx;
+	display: flex;
+	justify-content: space-between;
+	text {
+		
+	}
+}
+.user-info {
+	width: 750rpx;
+	height: 445rpx;
+	// background: #3B3B3B;
+	background-image: url(../../static/img/main_bg.png);
+	background-size: 100% 100%;
 }
 </style>

uni.scss

@@ -1,68 +1,68 @@
-/* 页面左右间距 */
-$page-row-spacing: 30rpx;
-//页面基础颜色
-$page-color-base: #f8f8f8;//页面背景颜色
-$page-color-light: #f8f6fc;
-// 主题颜色
-$base-color: #5dbc7c;//项目颜色
-$box-shadow-color:#5dbc7c;//阴影颜色
-$font-color:#5dbc7c;//字体颜色
-$font-color-spec: #5dbc7c;//可操作文字颜色
-$background-color:#5dbc7c;//按钮背景颜色
-// 小图标大小
-$uni-img-size-base:36rpx;
-/* 文字尺寸 */
-$font-sm: 24rpx;
-$font-base: 28rpx;
-$font-lg: 32rpx;
-/*文字颜色*/
-$font-color-dark: #303133;//黑
-$font-color-base: #606266;//基础
-$font-color-white:#ffffff;//白色
-$font-color-light: #909399;//灰色
-$font-color-disabled: #c0c4cc;//禁用
-/* 边框颜色 */
-$border-color-dark: #dcdfe6;//黑
-$border-color-base: #e4e7ed;//基础灰
-$border-color-light: #ebeef5;//亮灰
-// uni自带边框颜色
-$uni-border-color:#ebeef5;
-/*颜色*/
-$color-yellow: #fd5b23;
-$color-gray: #999999;
-$color-green: #5dbc7c;
-$color-red: #dd524d;
-/* 图片加载中颜色 */
-$image-bg-color: #eee;
-/* 行为相关颜色 */
-$uni-color-primary: #5dbc7c;
-$uni-color-success: #4cd964;
-$uni-color-warning: #f0ad4e;
-$uni-color-error: #dd524d;
-// 提交框阴影
-$box-shadow: 0rpx 0rpx 10rpx 10rpx #f3f3f3;
-// 圆角
-$border-radius-sm: 15rpx;
-// 渐变背景颜色
-$bg-green-gradual: linear-gradient(#5dbc7c, #71d094);
-/* 功能栏字体大小 */
-%font-title {
-	font-size: $font-lg + 2rpx;
-	color: $font-color-dark;
-	line-height: 1;
-	font-weight: bold;
-}
-// 功能栏字体包裹框
-%font-title-box {
-	flex: 1;
-	display: flex;
-	flex-direction: column;
-}
-/*功能栏左侧小图标*/
-%f-left-icon {
-	height: $font-lg + 2rpx;
-	width: 8rpx;
-	background-image: $bg-green-gradual;
-	margin-right: 10rpx;
-	border-radius: 10rpx;
+/* 页面左右间距 */
+$page-row-spacing: 30rpx;
+//页面基础颜色
+$page-color-base: #f8f6f6;//页面背景颜色
+$page-color-light: #f8f6fc;
+// 主题颜色
+$base-color:#921a23;//项目颜色
+$box-shadow-color:#5dbc7c;//阴影颜色
+$font-color:#5dbc7c;//字体颜色
+$font-color-spec: #5dbc7c;//可操作文字颜色
+$background-color:#5dbc7c;//按钮背景颜色
+// 小图标大小
+$uni-img-size-base:36rpx;
+/* 文字尺寸 */
+$font-sm: 24rpx;
+$font-base: 28rpx;
+$font-lg: 32rpx;
+/*文字颜色*/
+$font-color-dark: #303133;//黑
+$font-color-base: #606266;//基础
+$font-color-white:#ffffff;//白色
+$font-color-light: #909399;//灰色
+$font-color-disabled: #c0c4cc;//禁用
+/* 边框颜色 */
+$border-color-dark: #dcdfe6;//黑
+$border-color-base: #e4e7ed;//基础灰
+$border-color-light: #ebeef5;//亮灰
+// uni自带边框颜色
+$uni-border-color:#ebeef5;
+/*颜色*/
+$color-yellow: #fd5b23;
+$color-gray: #999999;
+$color-green: #5dbc7c;
+$color-red: #dd524d;
+/* 图片加载中颜色 */
+$image-bg-color: #eee;
+/* 行为相关颜色 */
+$uni-color-primary: #5dbc7c;
+$uni-color-success: #4cd964;
+$uni-color-warning: #f0ad4e;
+$uni-color-error: #dd524d;
+// 提交框阴影
+$box-shadow: 0rpx 0rpx 10rpx 10rpx #f3f3f3;
+// 圆角
+$border-radius-sm: 15rpx;
+// 渐变背景颜色
+$bg-green-gradual: linear-gradient(#5dbc7c, #71d094);
+/* 功能栏字体大小 */
+%font-title {
+	font-size: $font-lg + 2rpx;
+	color: $font-color-dark;
+	line-height: 1;
+	font-weight: bold;
+}
+// 功能栏字体包裹框
+%font-title-box {
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+}
+/*功能栏左侧小图标*/
+%f-left-icon {
+	height: $font-lg + 2rpx;
+	width: 8rpx;
+	background-image: $bg-green-gradual;
+	margin-right: 10rpx;
+	border-radius: 10rpx;
 }