cmy 1 year ago
parent
commit
d1c917b4d0
3 changed files with 152 additions and 29 deletions
  1. 1 0
      pages.json
  2. 48 27
      pages/index/index.vue
  3. 103 2
      pages/user/ship.vue

+ 1 - 0
pages.json

@@ -156,6 +156,7 @@
 			{
 			{
 				"path": "ship",
 				"path": "ship",
 				"style": {
 				"style": {
+					"navigationBarBackgroundColor": "transparent",
 					"navigationBarTitleText": "飞船"
 					"navigationBarTitleText": "飞船"
 				}
 				}
 			}]
 			}]

+ 48 - 27
pages/index/index.vue

@@ -30,19 +30,24 @@
 				</view>
 				</view>
 				<view class="item-user-model flex">
 				<view class="item-user-model flex">
 					<view class="model">
 					<view class="model">
-						<image class="model-image model1" src="../../static/index/index/model1.png" mode="scaleToFill"></image>
+						<image class="model-image model1" src="../../static/index/index/model1.png" mode="scaleToFill">
+						</image>
 						<view class="model-name">
 						<view class="model-name">
 							能量
 							能量
 						</view>
 						</view>
 					</view>
 					</view>
-					<view class="model">
-						<image class="model-image model2" src="../../static/index/index/model2.png" mode="scaleToFill"></image>
-						<view class="model-name">
-							飞船
+					<navigator url="/pages/user/ship">
+						<view class="model">
+							<image class="model-image model2" src="../../static/index/index/model2.png"
+								mode="scaleToFill"></image>
+							<view class="model-name">
+								飞船
+							</view>
 						</view>
 						</view>
-					</view>
+					</navigator>
 					<view class="model">
 					<view class="model">
-						<image class="model-image model3" src="../../static/index/index/model3.png" mode="scaleToFill"></image>
+						<image class="model-image model3" src="../../static/index/index/model3.png" mode="scaleToFill">
+						</image>
 						<view class="model-name">
 						<view class="model-name">
 							好友
 							好友
 						</view>
 						</view>
@@ -92,90 +97,106 @@
 	}
 	}
 
 
 	.content-list {
 	.content-list {
-		padding: 20rpx 30rpx ;
+		padding: 20rpx 30rpx;
 		background-color: #FFF;
 		background-color: #FFF;
 		border-radius: 30rpx;
 		border-radius: 30rpx;
 		margin: 0 30rpx;
 		margin: 0 30rpx;
 		margin-top: 50rpx;
 		margin-top: 50rpx;
 		line-height: 1;
 		line-height: 1;
 		padding-bottom: 50rpx;
 		padding-bottom: 50rpx;
-		.item{
-			.item-left-user{
+
+		.item {
+			.item-left-user {
 				align-items: flex-start;
 				align-items: flex-start;
+
 				.user-name-box {
 				.user-name-box {
 					padding-left: 10rpx;
 					padding-left: 10rpx;
-					.user-money{
-						.money{
+
+					.user-money {
+						.money {
 							padding-left: 10rpx;
 							padding-left: 10rpx;
 							font-weight: bold;
 							font-weight: bold;
 							font-size: 26rpx;
 							font-size: 26rpx;
 							color: #222222;
 							color: #222222;
 						}
 						}
 					}
 					}
+
 					.vipTip {
 					.vipTip {
 						width: 36rpx;
 						width: 36rpx;
 						height: 29rpx;
 						height: 29rpx;
 					}
 					}
+
 					.user-name {
 					.user-name {
 						font-weight: 800;
 						font-weight: 800;
 						font-size: 27rpx;
 						font-size: 27rpx;
 						color: #222222;
 						color: #222222;
 						padding-bottom: 20rpx;
 						padding-bottom: 20rpx;
 					}
 					}
-				
-					
+
+
 				}
 				}
-				.user-pic{
+
+				.user-pic {
 					overflow: hidden;
 					overflow: hidden;
 					border-radius: 100rpx;
 					border-radius: 100rpx;
 					width: 60rpx;
 					width: 60rpx;
 					height: 60rpx;
 					height: 60rpx;
+
 					.user-img {
 					.user-img {
 						width: 100%;
 						width: 100%;
 						height: 100%;
 						height: 100%;
 					}
 					}
 				}
 				}
 			}
 			}
-			.item-rigt-user{
-				.item-right-vip{
+
+			.item-rigt-user {
+				.item-right-vip {
 					width: 210rpx;
 					width: 210rpx;
 					height: 95rpx;
 					height: 95rpx;
 				}
 				}
 			}
 			}
-			.item-user-model{
+
+			.item-user-model {
 				padding-top: 30rpx;
 				padding-top: 30rpx;
-				.model{
-					.model-name{
+
+				.model {
+					.model-name {
 						padding-top: 30rpx;
 						padding-top: 30rpx;
 						text-align: center;
 						text-align: center;
 						font-weight: 500;
 						font-weight: 500;
 						font-size: 23rpx;
 						font-size: 23rpx;
 						color: #222222;
 						color: #222222;
 					}
 					}
-					.model1{
+
+					.model1 {
 						width: 121rpx;
 						width: 121rpx;
 						height: 131rpx;
 						height: 131rpx;
 					}
 					}
-					.model2{
+
+					.model2 {
 						width: 121rpx;
 						width: 121rpx;
 						height: 116rpx;
 						height: 116rpx;
 					}
 					}
-					.model3{
+
+					.model3 {
 						width: 145rpx;
 						width: 145rpx;
 						height: 122rpx;
 						height: 122rpx;
 					}
 					}
 				}
 				}
 			}
 			}
-			.function-type{
+
+			.function-type {
 				align-items: flex-end;
 				align-items: flex-end;
 				margin-top: 30rpx;
 				margin-top: 30rpx;
-				.function-block{
-					.type1{
+
+				.function-block {
+					.type1 {
 						width: 325rpx;
 						width: 325rpx;
 						height: 130rpx;
 						height: 130rpx;
 						margin-left: -10rpx;
 						margin-left: -10rpx;
 					}
 					}
-					.type2{
+
+					.type2 {
 						width: 321rpx;
 						width: 321rpx;
 						height: 112rpx;
 						height: 112rpx;
 					}
 					}

+ 103 - 2
pages/user/ship.vue

@@ -1,8 +1,109 @@
 <template>
 <template>
+	<view class="page">
+		<view class="tabBanner flex">
+			<view class="tabItemBox flex">
+				<view class="tahItem position-relative" v-for="(item,index) in taber">
+					{{item.title}}
+					<view class="actionIcon" v-if="action==index"></view>
+				</view>
+			</view>
+
+			<view class="rightMoney flex">
+				<image class="rightTipImg" src="../../static/index/index/icon01.png" mode="scaleToFill"></image>
+				<text>123123123123.222s</text>
+			</view>
+		</view>
+		<view class="itemList">
+			<view class="item flex">
+				<view class="itemLeft">
+					<view class="name">
+
+					</view>
+					<view class="tip">
+
+					</view>
+					<view class="payMoney flex">
+						<image class="payMoneyTIp" src="../../static/index/index/icon01.png" mode="widthFix"></image>
+						<text>22</text>
+					</view>
+				</view>
+				<view class="itemRight">
+					<view class="tiptext">
+
+					</view>
+					<view class="moneyNum flex">
+						<image class="moneyTIp" src="../../static/index/index/icon01.png" mode="widthFix"></image>
+						<text>22</text>
+					</view>
+					<view class="buttom">
+						派遣飞船
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
 </template>
 
 
 <script>
 <script>
-</script>
+	export default {
+		data() {
+			return {
+				action:0,
+				taber: [{
+						title: '星级飞船',
+						page: 1,
+						limit: 10,
+						loding: 'more',
+						list: [],
+					},
 
 
-<style>
+					{
+						title: '我的飞船',
+						page: 1,
+						limit: 10,
+						loding: 'more',
+						list: [],
+					}
+
+				]
+			};
+		},
+		onLoad(options) {
+
+		},
+		onShow() {},
+		methods: {
+
+		}
+	};
+</script>
+<style lang="scss" scoped>
+	.page {
+		min-height: calc(100vh - var(--window-bottom));
+		line-height: 1;
+		padding: 30rpx;
+	}
+	.tabBanner{
+		position: sticky;
+		.tabItemBox{
+			.tahItem{
+				.actionIcon{
+					background: linear-gradient(268deg, rgba(244,177,228,0.99), #9D47C6, #5D289A);
+					border-radius: 3px;
+					width: 46rpx;
+					height: 6rpx;
+				}
+			}
+		}
+		.rightMoney{
+			.rightTipImg{
+				width: 36rpx;
+				height: 29rpx;
+			}
+		}
+		
+		
+	}
+	
+	
 </style>
 </style>