Browse Source

Merge branch 'master' of http://150.158.33.144:3000/lalalashen/MoeNovaClient

ck@123911.net 4 months ago
parent
commit
e236fdc47a
3 changed files with 226 additions and 0 deletions
  1. 6 0
      pages.json
  2. 113 0
      pages/message/mailMessage.scss
  3. 107 0
      pages/message/mailMessage.vue

+ 6 - 0
pages.json

@@ -136,6 +136,12 @@
 				"navigationBarTitleText": "隐私政策",
 				"navigationBarBackgroundColor": "#161616"
 			}
+		}, {
+			"path": "pages/message/mailMessage",
+			"style": {
+				"navigationBarTitleText": "您的消息",
+				"navigationBarBackgroundColor": "#161616"
+			}
 		}
 
 	],

+ 113 - 0
pages/message/mailMessage.scss

@@ -0,0 +1,113 @@
+
+page {
+	background-color: #161616;
+}
+.page {
+	background-color: #161616;
+}
+.topbg {
+}
+.topBody {
+	width:750rpx;
+}
+.mainBody {
+	width:750rpx;padding:1rpx 20rpx;display: flex;flex-direction: column;
+	border-bottom: solid 2rpx #393939;
+	.menu {
+		display: flex;flex-direction: row;justify-content: space-between;padding:20rpx 0rpx 0rpx;
+		.item {
+			width:360rpx;border-radius: 18rpx;height:80rpx;display: flex;flex-direction:column;justify-content: center;align-items: center;
+			margin:0 20rpx;color:#999999;
+			.line {
+				width: 36rpx;height: 8rpx;margin-top: 20rpx;
+				background: #161616;
+				border-radius: 4rpx 4rpx 4rpx 4rpx;
+			}
+		}
+		.active {
+			color:#fff;
+			.line {
+				width: 36rpx;height: 8rpx;margin-top: 20rpx;
+				background: linear-gradient( 90deg, #FF5869 0%, #F83881 100%);
+				border-radius: 4rpx 4rpx 4rpx 4rpx;
+			}
+		}
+	}
+	.scroll-view_H {
+		white-space: nowrap;
+		width: 750rpx;color:#fff;
+		.item {
+			width:120rpx;border-radius: 18rpx;height:80rpx;
+			display: inline-flex;flex-direction:column;justify-content: center;align-items: center;
+			margin:0 20rpx;color:#999999;
+			.line {
+				width: 36rpx;height: 8rpx;margin-top: 20rpx;
+				background: #161616;
+				border-radius: 4rpx 4rpx 4rpx 4rpx;
+			}
+		}
+		.active {
+			color:#fff;
+			.line {
+				width: 36rpx;height: 8rpx;margin-top: 20rpx;
+				background: linear-gradient( 90deg, #FF5869 0%, #F83881 100%);
+				border-radius: 4rpx 4rpx 4rpx 4rpx;
+			}
+		}
+	}
+	.scroll-view-item_H {
+		display: inline-block;
+		width: 200rpx;
+		text-align: center;
+		font-size: 36rpx;
+	}
+}
+.list_info {
+	display: flex;flex-direction: column;justify-content: flex-start;align-items: center;color:#fff;
+	width:750rpx;
+	
+	.item {
+		margin-top: 20rpx;color:#fff;font-size: 28rpx;
+		display: flex;flex-direction: column;justify-content: center;align-items: center;
+		width: 690rpx;
+		height: 770rpx;
+		background: #28292D;
+		border-radius: 28rpx 28rpx 28rpx 28rpx;
+		.avator {
+			width:258rpx;height:258rpx;
+			.icon {
+				width:258rpx;height:258rpx;border-radius: 129rpx;
+			}
+		}
+		.tit {
+			width:690rpx;display: flex;flex-direction: column;justify-content: center;align-items: center;
+			margin-top:50rpx;
+			.name {
+				font-size: 32rpx;
+			}
+			.desc {
+				color:#999;font-size: 28rpx;margin-top:12rpx;
+			}
+		}
+		.list_mem {
+			width:100%;margin-top:30rpx;
+			display: flex;flex-direction: row;justify-content: center;align-items: center;
+			image {
+				width:72rpx;height:72rpx;margin:0rpx 8rpx;border-radius: 36rpx;
+			}
+		}
+		.btn_submit {
+			width: 390rpx;height: 96rpx;margin-top:30rpx;
+			background: linear-gradient( 142deg, #FF5967 0%, #FF2A95 100%);
+			border-radius: 28rpx 28rpx 28rpx 28rpx;
+			display: flex;flex-direction: column;justify-content: center;align-items: center;
+		}
+		.gray {
+			background: linear-gradient( 142deg, #FF5967 50%, #FF2A95 10%);
+			
+		}
+	}
+}
+.blankHeight {
+	height:300rpx;
+}

+ 107 - 0
pages/message/mailMessage.vue

@@ -0,0 +1,107 @@
+<template>
+	<view class="page">
+		<view class="mainBody">
+			<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="0">
+				<view class="item" :class="{'active':tab===0}" @click="checkTab(0)">
+					<text class="left">全部</text>
+					<view class="line"></view>
+				</view>
+				<view class="item" :class="{'active':tab===item.id}" @click="checkTab(item.id)"
+					v-for="(item,index) in cate" :key="index">
+					<text class="left">{{item.name}}</text>
+					<view class="line"></view>
+				</view>
+			</scroll-view>
+
+		</view>
+		<view class="list_info">
+			<block v-for="(item,index) in list" :key="index">
+				<view class="item" @click="goDetail(item)">
+					<view class="avator">
+						<image class="icon" :src="item.image" mode="aspectFill">
+						</image>
+					</view>
+					<view class="tit">
+						<view class="name">{{item.name}}</view>
+						<view class="desc">市场价:¥{{item.price}}</view>
+					</view>
+					<view class="list_mem">
+						<image class="icon" v-for="(item2,index2) in item.mem_list" :src="item2.avator"
+							mode="aspectFill" />
+					</view>
+
+				</view>
+			</block>
+
+			<view class="blankHeight"></view>
+		</view>
+
+		<DialogBox ref="DialogBox"></DialogBox>
+		<ToastW3 ref="ToastW3"></ToastW3>
+	</view>
+</template>
+
+<script>
+	export default {
+		components: {},
+		data() {
+			return {
+				tab: 0,
+				scrollTop: 0,
+				old: {
+					scrollTop: 0
+				},
+				list: [],
+				cate: ["消息","评论和赞"],
+			}
+		},
+		onLoad() {},
+		onShow() {
+			this.loadData();
+		},
+		onNavigationBarButtonTap(e) {
+			if (e.index === 0) {
+				// uni.navigateTo({
+				// 	url: '/pages/my/wishList'
+				// });
+			}
+		},
+		methods: {
+			onBack() {},
+			checkTab(tab) {
+				this.tab = tab;
+				this.loadData();
+			},
+			scroll: function(e) {
+				console.log(e)
+				this.old.scrollTop = e.detail.scrollTop
+			},
+			goDetail(item) {
+				// uni.navigateTo({
+				// 	url: '/pages/my/wishDetail?id=' + item.id,
+				// })
+			},
+			loadData() {
+				// uni.request({
+				// 	url: this.$apiHost + '/Wish/getList',
+				// 	data: {
+				// 		uuid: getApp().globalData.uuid,
+				// 		cid: this.tab,
+				// 	},
+				// 	header: {
+				// 		'content-type': 'application/json'
+				// 	},
+				// 	success: (res) => {
+				// 		console.log("res", res.data)
+				// 		this.list = res.data.list;
+				// 		this.cate = res.data.cate;
+				// 	}
+				// });
+			},
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	@import 'mailMessage.scss';
+</style>