From 7494f9f7908586599ef689d6eb429cd0be1b33f0 Mon Sep 17 00:00:00 2001
From: "tony.deng" <dengtongyu123@163.com>
Date: Tue, 18 Aug 2020 19:05:26 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore            | 21 +++++++++++++++
 pages.json            |  8 +++++-
 pages/index/index.vue | 16 ++++++++++--
 pages/room/avatar.vue | 60 +++++++++++++++++++++++++++++++++++++++++++
 pages/room/index.vue  | 35 +++++++++++++++++++++++++
 5 files changed, 137 insertions(+), 3 deletions(-)
 create mode 100644 .gitignore
 create mode 100644 pages/room/avatar.vue
 create mode 100644 pages/room/index.vue

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..12c06a5
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,21 @@
+.DS_Store
+node_modules
+/unpackage
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/pages.json b/pages.json
index 31e0288..21fecc0 100755
--- a/pages.json
+++ b/pages.json
@@ -9,7 +9,13 @@
 		"style": {
 			"navigationBarTitleText": "test项目"
 		}
-	}],
+	}, {
+		"path": "pages/room/index",
+		"style": {
+			"navigationBarTitleText": "room"
+		}
+	}
+    ],
 	"globalStyle": {
 		"navigationBarTextStyle": "white",
 		"navigationBarTitleText": "uni-app",
diff --git a/pages/index/index.vue b/pages/index/index.vue
index a2c688f..c1d506b 100755
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,7 +1,7 @@
 <template>
 	<view class="container">
 		<scroll-view scroll-y="true" class="list-scroll-box" :enable-flex="true">
-			<view class="list-item" v-for="(item,index) in roomList" :key="item.id">
+			<view class="list-item" v-for="(item,index) in roomList" :key="item.id" @click="toRoomAction(item)">
 				<image class="item-image" mode="aspectFill" :src="item.img" @error="imageError(index)"></image>
 				<text class="item-text">{{item.roomName}}</text>
 				<text class="item-text">{{item.roomHost}}</text>
@@ -80,6 +80,18 @@
 		methods: {
 			imageError(index) {
 				this.roomList[index].img = require('@/static/image/errImage.jpeg')
+			},
+			toRoomAction(item) {
+				console.log(item)
+				uni.navigateTo({
+				    url: '/pages/room/index?id=' + item.id,
+					success() {
+						console.log('success')
+					},
+					fail(err) {
+						console.log('fail',err)
+					}
+				});
 			}
 		}
 	}
@@ -99,7 +111,7 @@
 	}
 	.list-item {
 		width: 197px;
-		margin: 0 20px 30px 20px;
+		margin: 0 20px 35px 20px;
 	}
 
 	.item-image {
diff --git a/pages/room/avatar.vue b/pages/room/avatar.vue
new file mode 100644
index 0000000..c64ce65
--- /dev/null
+++ b/pages/room/avatar.vue
@@ -0,0 +1,60 @@
+<template>
+	<view>
+		<view class="avatar-icon"></view>
+		<view class="avatar-image">
+			<image class="image-style" mode="aspectFill" :src="showImage" @error="imageError"></image>
+		</view>
+		<text class="avatar-text">{{name}}</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			image: {
+				type: String,
+				default: ''
+			},
+			name: {
+				type: String,
+				default: ''
+			},
+		},
+		data() {
+			return {
+				defaultImage: require('@/static/image/errImage.jpeg'),
+				imageErrorStatus: false,
+			}
+		},
+		computed: {
+			showImage() {
+				if (this.imageErrorStatus) {
+					returnthis.defaultImage
+				} else {
+					return this.image || this.defaultImage
+				}
+			}
+		},
+		methods: {
+			imageError() {
+				this.imageErrorStatus = true;
+			}
+		}
+	}
+</script>
+
+<style>
+	.avatar-icon {}
+
+	.avatar-image {
+		width: 120px;
+		height: 120px;
+	}
+
+	.image-style {
+		width: 100%;
+		height: 100%;
+	}
+
+	.avatar-text {}
+</style>
diff --git a/pages/room/index.vue b/pages/room/index.vue
new file mode 100644
index 0000000..1e41658
--- /dev/null
+++ b/pages/room/index.vue
@@ -0,0 +1,35 @@
+<template>
+	<view>
+		<view class="top-block">
+			<view class="mike-site-block">
+				<view class="mike-site-top">
+					<avatar></avatar>
+				</view>
+				<view class="mike-site-main">
+					<avatar></avatar>
+				</view>
+			</view>
+		</view>
+		<view class="bottom-block">
+			
+		</view>
+	</view>
+</template>
+
+<script>
+	import avatar from './avatar.vue'
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>