From dc8409a3e81c06a7ba56d33ad5eb825db65b514f Mon Sep 17 00:00:00 2001
From: wally <18603454788@163.com>
Date: Thu, 5 Mar 2020 16:56:48 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=88=91=E7=9A=84=E6=A0=A1=E5=9B=AD?=
 =?UTF-8?q?=E6=89=93=E5=8D=A1UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/timeline/timeline.vue              |  32 +++++
 .../uni-segmented-control.vue                 | 124 ++++++++++++++++++
 pages.json                                    |  13 +-
 pages/my-signs/my-signs.vue                   |  63 +++++++++
 4 files changed, 227 insertions(+), 5 deletions(-)
 create mode 100644 components/timeline/timeline.vue
 create mode 100644 components/uni-segmented-control/uni-segmented-control.vue
 create mode 100644 pages/my-signs/my-signs.vue

diff --git a/components/timeline/timeline.vue b/components/timeline/timeline.vue
new file mode 100644
index 0000000..0cfa809
--- /dev/null
+++ b/components/timeline/timeline.vue
@@ -0,0 +1,32 @@
+<template>
+  <view>
+    <view class="cu-timeline">
+      <view class="cu-time">昨天</view>
+      <view class="cu-item cur cuIcon-noticefill">
+        <view class="content bg-green shadow-blur">
+          <text>22:22</text>【广州市】快件已到达地球
+        </view>
+      </view>
+      <view class="cu-item text-red cuIcon-attentionforbidfill">
+        <view class="content bg-red shadow-blur">这是第一次，我家的铲屎官走了这么久。久到足足有三天！！</view>
+      </view>
+    </view>
+
+    <view class="cu-timeline">
+      <view class="cu-time">06-17</view>
+      <view class="cu-item">
+        <view class="content">
+          <text>01:30</text>【喵星】 MX-12138 已揽收，准备发往银河系
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+};
+</script>
diff --git a/components/uni-segmented-control/uni-segmented-control.vue b/components/uni-segmented-control/uni-segmented-control.vue
new file mode 100644
index 0000000..2074131
--- /dev/null
+++ b/components/uni-segmented-control/uni-segmented-control.vue
@@ -0,0 +1,124 @@
+<template>
+	<view :class="[styleType === 'text'?'segmented-control--text' : 'segmented-control--button' ]" :style="{ borderColor: styleType === 'text' ? '' : activeColor }"
+	 class="segmented-control">
+		<view v-for="(item, index) in values" :class="[ styleType === 'text'?'segmented-control__item--text': 'segmented-control__item--button' , index === currentIndex&&styleType === 'button'?'segmented-control__item--button--active': '' , index === 0&&styleType === 'button'?'segmented-control__item--button--first': '',index === values.length - 1&&styleType === 'button'?'segmented-control__item--button--last': '' ]"
+		 :key="index" :style="{
+        backgroundColor: index === currentIndex && styleType === 'button' ? activeColor : '',borderColor: index === currentIndex&&styleType === 'text'||styleType === 'button'?activeColor:'transparent'
+      }"
+		 class="segmented-control__item" @click="_onClick(index)">
+			<text :style="{color:
+          index === currentIndex
+            ? styleType === 'text'
+              ? activeColor
+              : '#fff'
+            : styleType === 'text'
+              ? '#000'
+              : activeColor}"
+			 class="segmented-control__text">{{ item }}</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'UniSegmentedControl',
+		props: {
+			current: {
+				type: Number,
+				default: 0
+			},
+			values: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			activeColor: {
+				type: String,
+				default: '#007aff'
+			},
+			styleType: {
+				type: String,
+				default: 'button'
+			}
+		},
+		data() {
+			return {
+				currentIndex: 0
+			}
+		},
+		watch: {
+			current(val) {
+				if (val !== this.currentIndex) {
+					this.currentIndex = val
+				}
+			}
+		},
+		created() {
+			this.currentIndex = this.current
+		},
+		methods: {
+			_onClick(index) {
+				if (this.currentIndex !== index) {
+					this.currentIndex = index
+					this.$emit('clickItem', {currentIndex:index})
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import '@/uni.scss';
+
+	.segmented-control {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		box-sizing: border-box;
+		/* #endif */
+		flex-direction: row;
+		height: 36px;
+		overflow: hidden;
+	}
+
+	.segmented-control__item {
+		/* #ifndef APP-NVUE */
+		display: inline-flex;
+		box-sizing: border-box;
+		/* #endif */
+		position: relative;
+		flex: 1;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.segmented-control__item--button {
+		border-style: solid;
+		border-top-width: 1px;
+		border-bottom-width: 1px;
+		border-right-width: 1px;
+		border-left-width: 0;
+	}
+
+	.segmented-control__item--button--first {
+		border-left-width: 1px;
+		border-top-left-radius: 5px;
+		border-bottom-left-radius: 5px;
+	}
+
+	.segmented-control__item--button--last {
+		border-top-right-radius: 5px;
+		border-bottom-right-radius: 5px;
+	}
+
+	.segmented-control__item--text {
+		border-bottom-style: solid;
+		border-bottom-width: 3px;
+	}
+
+	.segmented-control__text {
+		font-size: 16px;
+		line-height: 20px;
+		text-align: center;
+	}
+</style>
diff --git a/pages.json b/pages.json
index 3eca2cd..446c324 100644
--- a/pages.json
+++ b/pages.json
@@ -1,15 +1,19 @@
 {
   "pages": [
     {
-      "path": "pages/sign/sign",
+      "path": "pages/index/index",
       "style": {
-        "navigationBarTitleText": "打卡"
+        "navigationBarTitleText": "山大健康码"
       }
     },
     {
-      "path": "pages/index/index",
+      "path": "pages/my-signs/my-signs",
+      "style": { "navigationBarTitleText": "我的校园打卡" }
+    },
+    {
+      "path": "pages/sign/sign",
       "style": {
-        "navigationBarTitleText": "山大健康码"
+        "navigationBarTitleText": "打卡"
       }
     },
     {
@@ -22,7 +26,6 @@
         "navigationBarTitleText": "领取健康码"
       }
     }
-
   ],
   "globalStyle": {
     "navigationBarTextStyle": "black",
diff --git a/pages/my-signs/my-signs.vue b/pages/my-signs/my-signs.vue
new file mode 100644
index 0000000..61f20b4
--- /dev/null
+++ b/pages/my-signs/my-signs.vue
@@ -0,0 +1,63 @@
+<template>
+  <view class="wrap">
+    <!-- 头部菜单 -->
+    <view class="nav-wrap slide-bottom">
+      <uni-segmented-control
+        :active-color="activeColor"
+        :current="current"
+        :values="values"
+        @clickItem="handleClickNav"
+        class="nav"
+      />
+    </view>
+    <!-- 内容区 -->
+    <view class="content">
+      <!-- 今日打卡地图显示 -->
+      <history-map v-if="current === 0" />
+      <!-- 打卡记录 时间轴显示 -->
+      <timeline v-else />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      current: 0,
+      values: ['今日打卡', '打卡记录'],
+      activeColor: '#0897C7',
+    };
+  },
+  methods: {
+    handleClickNav({ currentIndex }) {
+      this.current = currentIndex;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.wrap {
+  padding-top: 88rpx;
+  min-height: 100vh;
+  background-color: $white;
+
+  .nav-wrap {
+    z-index: 999;
+    position: fixed;
+    left: 0;
+    right: 0;
+    top: 0;
+
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 88rpx;
+    background-color: $white;
+    .nav {
+      width: 540rpx;
+    }
+  }
+}
+</style>

From ad592102358d8ce39760bf4f5b8df12201006c54 Mon Sep 17 00:00:00 2001
From: wally <18603454788@163.com>
Date: Thu, 5 Mar 2020 17:02:03 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E5=8A=A0=E9=93=BE=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index/components/mine.vue | 100 ++++++++++++++++----------------
 1 file changed, 51 insertions(+), 49 deletions(-)

diff --git a/pages/index/components/mine.vue b/pages/index/components/mine.vue
index 4deaeea..04c6237 100644
--- a/pages/index/components/mine.vue
+++ b/pages/index/components/mine.vue
@@ -1,41 +1,43 @@
 <template>
-	<view>
-		<!-- 头部 -->
-		<view class="cu-card flex bg-white">
-			<view class="flex flex-sub align-center padding-xl">
-				<view class="round xl cu-avatar portrait">
-					<image class="xl cu-avatar" :src="userInfo.avatarUrl"></image>
-				</view>
-				<view class="flex-sub padding-left">
-					<view class="text-xl">{{ userInfo.nickName }}</view>
-					<view class="text-df padding-top-xs description">{{ userInfo.classes }}</view>
-				</view>
-				<view :style="{'color':userInfo.healthyCodeColor}" class="iconfont icon-qrcode healthy-coad"></view>
-			</view>
-		</view>
-		<!-- 列表 -->
-		<view class="bg-white margin-top">
-			<view class="cu-list menu margin-lr">
-			  <view class="cu-item">
-				<view class="text-lg">个人信息</view>
-				<view class="iconfont icon-right more"></view>
-			  </view>
-			  <view class="cu-item">
-				<view class="text-lg">我的健康打卡</view>
-				<view class="iconfont icon-right more"></view>
-			  </view>
-			  <view class="cu-item">
-				<view class="text-lg">我的行程</view>
-				<view class="iconfont icon-right more"></view>
-			  </view>
-			  <view class="cu-item">
-				<view class="text-lg">我的校园打卡</view>
-				<view class="iconfont icon-right more"></view>
-			  </view>
-			</view>
-		</view>
-	</view>
-  
+  <view>
+    <!-- 头部 -->
+    <view class="cu-card flex bg-white">
+      <view class="flex flex-sub align-center padding-xl">
+        <view class="round xl cu-avatar portrait">
+          <image class="xl cu-avatar" :src="userInfo.avatarUrl"></image>
+        </view>
+        <view class="flex-sub padding-left">
+          <view class="text-xl">{{ userInfo.nickName }}</view>
+          <view class="text-df padding-top-xs description">{{ userInfo.classes }}</view>
+        </view>
+        <view
+          :style="{ color: userInfo.healthyCodeColor }"
+          class="iconfont icon-qrcode healthy-coad"
+        ></view>
+      </view>
+    </view>
+    <!-- 列表 -->
+    <view class="bg-white margin-top">
+      <view class="cu-list menu margin-lr">
+        <view class="cu-item">
+          <view class="text-lg">个人信息</view>
+          <view class="iconfont icon-right more"></view>
+        </view>
+        <view class="cu-item">
+          <view class="text-lg">我的健康打卡</view>
+          <view class="iconfont icon-right more"></view>
+        </view>
+        <view class="cu-item">
+          <view class="text-lg">我的行程</view>
+          <view class="iconfont icon-right more"></view>
+        </view>
+        <view class="cu-item" @tap="openPage('/pages/my-signs/my-signs')">
+          <view class="text-lg">我的校园打卡</view>
+          <view class="iconfont icon-right more"></view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
@@ -47,7 +49,7 @@ export default {
         avatarUrl: '../../../static/head-portrait.jpg',
         nickName: '丁菲菲',
         classes: '计算机19级软工二班',
-		healthyCodeColor: '#11A20D'
+        healthyCodeColor: '#11A20D',
       },
     };
   },
@@ -55,14 +57,14 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-	.portrait{
-		overflow: hidden;
-	}
-	.healthy-coad{
-		font-size: 40px;
-	}
-	.more{
-		font-size: 18px;
-		color: $grey;
-	}
-</style>
\ No newline at end of file
+.portrait {
+  overflow: hidden;
+}
+.healthy-coad {
+  font-size: 40px;
+}
+.more {
+  font-size: 18px;
+  color: $grey;
+}
+</style>