diff --git a/main.js b/main.js
index 8a8632e..0c7b708 100644
--- a/main.js
+++ b/main.js
@@ -1,15 +1,25 @@
-import Vue from 'vue';
+import Vue from 'vue';
 import { http } from 'plugins/request/index';
-import App from './App';
+import App from './App';
 // import store from './store';
 
-Vue.config.productionTip = false
+Vue.config.productionTip = false;
 Vue.prototype.$http = http;
 
-App.mpType = 'app'
+/**
+ * 打开某个页面
+ * @param {string} path 页面完成路径
+ * @param {string} query 参数字符串a=x&b=y
+ */
+Vue.prototype.openPage = function(path, query = '') {
+  let url = query ? `${path}?${query}` : path;
+  uni.navigateTo({ url });
+};
 
-const app = new Vue({
+App.mpType = 'app';
+
+const app = new Vue({
   // store,
-    ...App
-})
-app.$mount()
+  ...App,
+});
+app.$mount();
diff --git a/pages.json b/pages.json
index 26f426b..5fbf4b2 100644
--- a/pages.json
+++ b/pages.json
@@ -1,19 +1,29 @@
 {
-	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
-		{
-			"path": "pages/index/index",
-			"style": {
-				"navigationBarTitleText": "uni-app"
-			}
-		}
-	],
-	"globalStyle": {
-		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
-		"navigationBarBackgroundColor": "#F8F8F8",
-		"backgroundColor": "#F8F8F8"
-	},
-  "easycom": {
-    "autoscan": true
+  "pages": [
+    {
+      "path": "pages/index/index",
+      "style": {
+        "navigationBarTitleText": "山大健康码"
+      }
+    },
+    {
+      "path": "pages/statistics/statistics",
+      "style": { "navigationBarTitleText": "统计" }
+    },
+    {
+      "path": "pages/get-code/get-code",
+      "style": {
+        "navigationBarTitleText": "领取健康码"
+      }
+    }
+  ],
+  "globalStyle": {
+    "navigationBarTextStyle": "black",
+    "navigationBarTitleText": "山大健康码",
+    "navigationBarBackgroundColor": "#F8F8F8",
+    "backgroundColor": "#F8F8F8"
+  },
+  "easycom": {
+    "autoscan": true
   }
-}
+}
diff --git a/pages/get-code/get-code.vue b/pages/get-code/get-code.vue
new file mode 100644
index 0000000..5d70ecd
--- /dev/null
+++ b/pages/get-code/get-code.vue
@@ -0,0 +1,25 @@
+<template>
+  <view>
+    <button @tap="handleSelectLocation">选择位置</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+  methods: {
+    handleSelectLocation() {
+      uni.chooseLocation({
+        success: function(res) {
+          console.log('位置名称：' + res.name);
+          console.log('详细地址：' + res.address);
+          console.log('纬度：' + res.latitude);
+          console.log('经度：' + res.longitude);
+        },
+      });
+    },
+  },
+};
+</script>
diff --git a/pages/index/components/home.vue b/pages/index/components/home.vue
index 16c7a1c..ef49bdb 100644
--- a/pages/index/components/home.vue
+++ b/pages/index/components/home.vue
@@ -1,8 +1,9 @@
 <template>
 	<view class="content">
 		<image src="../../../static/bg.png" style="width: 100%;"></image>
+
 		<view class="box">
-			<view class="cu-card flex margin bg-white shadow card-radius">
+			<view class="cu-card flex margin bg-white shadow card-radius" hover-class="cc-active" @tap="openPage('/pages/get-code/get-code')">
 				<view class="flex align-center padding">
 					<view class="round lg cu-avatar icon1">
 						<view class="iconfont icon-erweima"></view>
@@ -13,7 +14,7 @@
 					</view>
 				</view>
 			</view>
-			<view class="cu-card flex margin bg-white shadow card-radius">
+			<view class="cu-card flex margin bg-white shadow card-radius" hover-class="cc-active">
 				<view class="flex align-center padding">
 					<view class="round lg cu-avatar icon2">
 						<view class="iconfont icon-daka"></view>
@@ -24,7 +25,7 @@
 					</view>
 				</view>
 			</view>
-			<view class="cu-card flex margin bg-white shadow card-radius">
+			<view class="cu-card flex margin bg-white shadow card-radius" hover-class="cc-active">
 				<view class="flex align-center padding">
 					<view class="round lg cu-avatar icon3">
 						<view class="iconfont icon-bushuline"></view>
@@ -35,7 +36,7 @@
 					</view>
 				</view>
 			</view>
-			<view class="cu-card flex margin bg-white shadow card-radius">
+			<view class="cu-card flex margin bg-white shadow card-radius" hover-class="cc-active" @tap="openPage('/pages/statistics/statistics')">
 				<view class="flex align-center padding">
 					<view class="round lg cu-avatar icon4">
 						<view class="iconfont icon-tongji"></view>
@@ -46,7 +47,7 @@
 					</view>
 				</view>
 			</view>
-		
+
 		</view>
 	</view>
 </template>
@@ -54,7 +55,7 @@
 <script>
 export default {
   name: 'Home',
-  
+
 };
 </script>
 
diff --git a/pages/index/components/mine.vue b/pages/index/components/mine.vue
index 856c49b..74ec854 100644
--- a/pages/index/components/mine.vue
+++ b/pages/index/components/mine.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>user</div>
+  <div>user1</div>
 </template>
 
 <script>
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 6380605..99e3a37 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -30,8 +30,16 @@ export default {
     },
 
     // 扫一扫
+    // 只允许通过相机扫码
+    // TODO: 扫码业务
     onScan() {
-      console.log('扫一扫');
+      uni.scanCode({
+        onlyFromCamera: true,
+        success: res => {
+          console.log('条码类型：' + res.scanType);
+          console.log('条码内容：' + res.result);
+        },
+      });
     },
   },
 };
@@ -47,6 +55,7 @@ export default {
 
   .content {
     flex: 1;
+    overflow-y: auto;
   }
   .nav-bottom {
     width: 100%;
diff --git a/pages/statistics/statistics.vue b/pages/statistics/statistics.vue
new file mode 100644
index 0000000..f2dce19
--- /dev/null
+++ b/pages/statistics/statistics.vue
@@ -0,0 +1,99 @@
+<template>
+  <view class="padding">
+    <!-- 日期组件 -->
+    <view></view>
+    <!-- 健康上报组件 -->
+    <view></view>
+    <!-- 校园轨迹组件 -->
+    <view class="card radius shadow-warp bg-white">
+      <view class="card-head solid-bottom">
+        <view class="card-head-avatar">
+          <view class></view>
+        </view>
+        <view class="card-head-title">校园打卡</view>
+        <view class="card-head-action">icon</view>
+      </view>
+
+      <view class="card-content">
+        <view class="map-wrap">
+          <map
+            :latitude="latitude"
+            :longitude="longitude"
+            :markers="covers"
+            style="width: 100%; height: 1000rpx;"
+          />
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 37.87059,
+      longitude: 112.55067,
+      covers: [
+        {
+          latitude: 37.87059,
+          longitude: 112.55067,
+          iconPath: '../../static/location.png',
+        },
+        {
+          latitude: 37.87,
+          longitude: 112.5506,
+          iconPath: '../../static/location.png',
+        },
+      ],
+    };
+  },
+
+  onLoad() {
+    this.getLocation();
+  },
+
+  methods: {
+    getLocation() {
+      uni.getLocation({
+        type: 'wgs84',
+        success: res => {
+          this.longitude = res.longitude;
+          this.latitude = res.latitude;
+          console.log('当前位置的经度：' + res.longitude);
+          console.log('当前位置的纬度：' + res.latitude);
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.card {
+  .card-head {
+    display: flex;
+    align-items: center;
+    height: 120rpx;
+    padding: 0 32rpx;
+
+    .card-head-avatar {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 56rpx;
+      height: 56rpx;
+      border-radius: 50%;
+      background-color: $blue;
+      color: $white;
+    }
+
+    .card-head-title {
+      flex: 1;
+      margin: 0 20rpx;
+      font-size: 16px;
+      color: $black;
+    }
+  }
+}
+</style>
diff --git a/static/location.png b/static/location.png
new file mode 100644
index 0000000..2ef7004
Binary files /dev/null and b/static/location.png differ