10-18-2

components/top-title/top-title.vue

@@ -1,40 +1,64 @@
-<template>
+<template>
 	<view class="top-title">
-		<view class="title-before">
+		<view class="" style="justify-self: flex-start;">
+			<view class="title-before"></view>
+			<view class="title">{{title}}</view>
 		</view>
-		<view class="title">{{title}}</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name:"top-title",
-		data() {
-			return {
-				
-			};
+		<view class="gd" @click="navTo" v-if="show_more">
+			更多 >
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "top-title",
+		data() {
+			return {
+
+			};
 		},
 		props: {
 			title: {
 				type: String,
 				default: ''
+			},
+			navurl: {
+				type: String,
+				default: ''
+			},
+			show_more: {
+				type: Boolean,
+				default: false
 			}
-		}
-	}
-</script>
-
-<style lang="scss">
-.top-title {
+		},
+		methods: {
+			navTo() {
+				console.log('dianji')
+				uni.navigateTo({
+					url: this.navurl
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.top-title {
+
+		width: 100%;
 		display: flex;
 		align-items: center;
+		justify-content: space-between;
 		.title-before {
 			display: inline-block;
-			background-color: $m-color;
+			background-color: #F0433C;
 			width: 10rpx;
 			height: 30rpx;
 			margin-right: 16rpx;
-			
+			border-radius: 4rpx;
 		}
+
 		.title {
 			display: inline-block;
 			font-size: 32rpx;
@@ -42,8 +66,10 @@
 			font-weight: bold;
 			color: #333333;
 		}
+
 		.title-after {
 			display: inline-block;
+
 			.a1 {
 				width: 8rpx;
 				height: 8rpx;
@@ -53,6 +79,7 @@
 				margin-top: 16rpx;
 				margin-left: 25rpx;
 			}
+
 			.a2 {
 				width: 28rpx;
 				height: 4rpx;
@@ -60,8 +87,9 @@
 				opacity: 0.1;
 				border-radius: 2rpx;
 				margin-bottom: 6rpx;
-				
+
 			}
+
 			.a3 {
 				width: 28rpx;
 				height: 4rpx;
@@ -71,5 +99,5 @@
 				margin-left: 11rpx;
 			}
 		}
-	}
+	}
 </style>