From d987db45a4d9d63de3c14c3a4f8afc1e94742029 Mon Sep 17 00:00:00 2001
From: EasternDay <849919718@qq.com>
Date: Sun, 12 Jan 2020 14:54:11 +0800
Subject: [PATCH] Hello world.

---
 components/BookCard.vue | 64 +++++++++++++++++++++++++++++++++++------
 components/DivLine.vue  | 20 +++++++++++++
 pages.json              | 54 ++++++++++++++++++++++++++++++++++
 pages/index/index.vue   |  8 +++++-
 4 files changed, 137 insertions(+), 9 deletions(-)
 create mode 100644 components/DivLine.vue

diff --git a/components/BookCard.vue b/components/BookCard.vue
index d0b3d93..300bcad 100644
--- a/components/BookCard.vue
+++ b/components/BookCard.vue
@@ -1,20 +1,68 @@
 <template name="BookCard">
-	<view>
-		<text>这是一段测试文字</text>
+	<view class="CardContent">
+		<view class="BookName">{{BookName}}</view>
+		<DivLine></DivLine>
+		<view class="BookContent">
+			<image class="BookPic" mode="aspectFit" :src="BookPic"></image>
+			<view>{{BookContent}}</view>
+		</view>
 	</view>
 </template>
 
 <script>
+	import DivLine from "./DivLine.vue"
 	export default {
-		name:"BookCard",
-		data() {
-			return {
-				
-			};
+		name: "BookCard",
+		props: {
+			BookName: {
+				type: String,
+				default: "书名"
+			},
+			BookContent: {
+				type: String,
+				default: "这里是属于斗气的世界，没有花俏艳丽的魔法，有的，仅仅是繁衍到巅峰的斗气！新书等级制度：斗者，斗师，大斗师，斗灵，斗王，斗皇，斗宗，斗尊，斗圣，斗帝。"
+			},
+			BookPic: {
+				type: String,
+				default: "/static/logo.png"
+			}
+		},
+		components: {
+			DivLine
 		}
 	}
 </script>
 
-<style>
+<style scoped>
+	.CardContent {
+		/*背景颜色*/
+		background: #007AFF;
+		/*圆角设置*/
+		border-radius: 15upx;
+		/*边框宽度*/
+		/*padding: 5upx;*/
+		/*宽度设置*/
+		width: 95%;
+		/*背景颜色*/
+		display: flex;
+		flex-direction: column;
+	}
+
+	.BookName,
+	.BookContent,
+	.BookPic {
+		margin: 5upx 5upx 5upx 5upx;
+	}
 
+	.BookContent {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+	}
+
+	.BookPic {
+		min-width: 33%;
+		max-width: 40%;
+		max-height: 250upx;
+	}
 </style>
diff --git a/components/DivLine.vue b/components/DivLine.vue
new file mode 100644
index 0000000..aa46830
--- /dev/null
+++ b/components/DivLine.vue
@@ -0,0 +1,20 @@
+<template name="DivLine">
+	<view class="division">
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"DivLine"
+	}
+</script>
+
+<style scoped>
+	.division {
+		width: 100%;
+		height: 5upx;
+		margin-top: 10upx;
+		margin-bottom: 10upx;
+		background-color: #4CD964;
+	}
+</style>
diff --git a/pages.json b/pages.json
index b21d60a..c5b74ea 100644
--- a/pages.json
+++ b/pages.json
@@ -12,5 +12,59 @@
 		"navigationBarTitleText": "Reader",
 		"navigationBarBackgroundColor": "#5E00FF",
 		"backgroundColor": "#5E00FF"
+	},
+
+	"tabBar": {
+		"color": "#cdcdcd",
+		"selectedColor": "#39cffc",
+		"borderStyle": "black",
+		"backgroundColor": "#ffffff",
+		"list": [{
+				"pagePath": "pages/index/index",
+				"iconPath": "static/logo.png",
+				"selectedIconPath": "static/logo.png",
+				"text": "首页"
+			}, {
+				"pagePath": "pages/find/find",
+				"iconPath": "static/logo.png",
+				"selectedIconPath": "static/logo.png",
+				"text": "发现"
+			},
+			{
+				"pagePath": "pages/nav/nav",
+				"iconPath": "static/logo.png",
+				"selectedIconPath": "static/logo.png",
+				"text": "导航"
+			}, {
+				"pagePath": "pages/person/person",
+				"iconPath": "static/logo.png",
+				"selectedIconPath": "static/logo.png",
+				"text": "我的"
+			}
+		]
+	},
+	"condition": { //模式配置，仅开发期间生效
+		"current": 1, //当前激活的模式（list 的索引项）
+		"list": [{
+				"name": "首页", //模式名称
+				"path": "pages/index/index", //启动页面，必选
+				"query": "" //启动参数，在页面的onLoad函数里面得到。uid=100&t=1535987051
+			},
+			{
+				"name": "发现", //模式名称
+				"path": "pages/index/index", //启动页面，必选
+				"query": "" //启动参数，在页面的onLoad函数里面得到。
+			},
+			{
+				"name": "导航", //模式名称
+				"path": "pages/index/index", //启动页面，必选
+				"query": "" //启动参数，在页面的onLoad函数里面得到。uid=100&t=1535987051
+			},
+			{
+				"name": "我的", //模式名称
+				"path": "pages/index/index", //启动页面，必选
+				"query": "" //启动参数，在页面的onLoad函数里面得到。
+			}
+		]
 	}
 }
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 4588a7c..4f15dcf 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -4,7 +4,7 @@
 		<view class="text-area">
 			<text class="title">{{title}}</text>
 		</view>
-		<BookCard></BookCard>
+		<BookCard :BookName="BookName"></BookCard>
 	</view>
 </template>
 
@@ -16,6 +16,7 @@
 		},
 		data() {
 			return {
+				BookName: "这是一段测试书名",
 				title: 'Hello'
 			}
 		},
@@ -54,4 +55,9 @@
 		font-size: 36rpx;
 		color: #8f8f94;
 	}
+	
+		
+	BookCard{
+		width: 100%;
+	}
 </style>
-- 
GitLab