瀏覽代碼

1. 添加Tbabar

Cee Yang 3 年之前
父節點
當前提交
c1f6a39e4a
共有 14 個文件被更改,包括 113 次插入71 次删除
  1. 6 2
      i18n/en.js
  2. 6 2
      i18n/zh.js
  3. 1 1
      pages.json
  4. 43 51
      pages/index/index.vue
  5. 31 15
      pages/login/index.vue
  6. 26 0
      pages/mine/index.vue
  7. 二進制
      static/tabbar/calendar.png
  8. 二進制
      static/tabbar/calendar_active.png
  9. 二進制
      static/tabbar/count.png
  10. 二進制
      static/tabbar/count_active.png
  11. 二進制
      static/tabbar/me.png
  12. 二進制
      static/tabbar/me_active.png
  13. 二進制
      static/tabbar/message.png
  14. 二進制
      static/tabbar/message_active.png

+ 6 - 2
i18n/en.js

@@ -1,6 +1,7 @@
 const en = {
   "appTitle": "i2School",
-  "appVersion": "Version",
+  "appVersion": "Version:{version}",
+	"version": "Version",
 
   "update_tips": "Update Tips",
   "update_now": "Update Now",
@@ -91,6 +92,7 @@ const en = {
   "clickPreview": "Click Preview",
 
   "login": "Login",
+	"userLogin": "User Login",
   "FT":"Foreign Teacher",
   "TA": "TA Teaching Advisor",
   "userName": "User Name",
@@ -265,6 +267,8 @@ const en = {
   "hintMsgByPageExit": "Are you sure you want to exit?",
   "saveAndExit": "Save and exit",
   "exit": "Exit",
-  "expand": "Expand"
+  "expand": "Expand",
+	
+	"pleaseReadAndAggreeThePrivacyPolicy": "Please read and aggree the privacy policy!"
 }
 export default en;

+ 6 - 2
i18n/zh.js

@@ -1,6 +1,7 @@
 const cn = {
   "appTitle": "i2School",
-  "appVersion": "版本号",
+  "appVersion": "版本号:{version}",
+  "version": "版本号",
 
   "update_tips": "发现新版本",
   "update_now": "立即更新",
@@ -73,6 +74,7 @@ const cn = {
   "pleaseEnter": "请填写",
 
   "login": "登录",
+	"userLogin": "用户登录",
   "FT":"Foreign Teacher",
   "TA": "TA 教学督导",
   "userName": "用户名",
@@ -263,6 +265,8 @@ const cn = {
   "hintMsgByPageExit": "确定要退出吗?",
   "saveAndExit": "保存后退出",
   "exit": "直接退出",
-  "expand": "展开"
+  "expand": "展开",
+	
+	"pleaseReadAndAggreeThePrivacyPolicy": "请阅读并同意隐私政策!"
 }
 export default cn;

+ 1 - 1
pages.json

@@ -9,7 +9,7 @@
 		{
 			"path": "pages/index/index",
 			"style": {
-				"navigationBarTitleText": "uni-app"
+				"navigationStyle":"custom"
 			}
 		}
 	],

+ 43 - 51
pages/index/index.vue

@@ -1,52 +1,44 @@
-<template>
-	<view class="content">
-		<image class="logo" src="/static/logo.png"></image>
-		<view class="text-area">
-			<text class="title">{{title}}</text>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				title: 'Hello'
-			}
-		},
-		onLoad() {
-
-		},
-		methods: {
-
-		}
-	}
-</script>
-
-<style>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin-top: 200rpx;
-		margin-left: auto;
-		margin-right: auto;
-		margin-bottom: 50rpx;
-	}
-
-	.text-area {
-		display: flex;
-		justify-content: center;
-	}
-
-	.title {
-		font-size: 36rpx;
-		color: #8f8f94;
-	}
+<template>
+	<view>
+		<view v-if="selectedIndex==0"></view>
+		<view v-if="selectedIndex==1"></view>
+		<tabbar-mine v-if="selectedIndex==2"></tabbar-mine>
+		<view class="cu-bar tabbar bg-white shadow foot">
+			<view v-for="item in tabItems" :index='item.index' class="action" @click="tabBarDidChange" :data-index="item.index">
+				<view class="cuIcon-cu-image">
+					<image :src="selectedIndex==item.index?item.image_selected:item.image" />
+				</view>
+				<view :class="selectedIndex==item.index?'text-red':'text-gray'"> {{ item.name }} </view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import TabbarMine from '../mine/index.vue'
+	export default {
+		components: {
+			TabbarMine,
+		},
+		data() {
+			return {
+				PageCur: 'calendar',
+				selectedIndex: 0,
+				tabItems: [
+					{ 'index': 0, 'name': this.$i18n.t('calendar'), 'image': '/static/tabbar/calendar.png', 'image_selected': '/static/tabbar/calendar_active.png'},
+					{ 'index': 1, 'name': this.$i18n.t('message'), 'image': '/static/tabbar/message.png', 'image_selected': '/static/tabbar/message_active.png'},
+					{ 'index': 2, 'name': this.$i18n.t('me'), 'image': '/static/tabbar/me.png', 'image_selected': '/static/tabbar/me_active.png'},
+				],
+			}
+		},
+		methods: {
+			tabBarDidChange(e) {
+				this.selectedIndex = e.currentTarget.dataset.index
+			}
+		}
+	}
+</script>
+
+<style>
+
 </style>

+ 31 - 15
pages/login/index.vue

@@ -3,28 +3,28 @@
 		<view class="login-top">
 			<image class="login-bg" src="/static/login/login_top_backgroud.png"></image>
 			<view class="login-top-content">
-				<image class="login-icon" src="/static/i2_icon.png"></image>
-				<text class="login-title"> {{ loginStr }} </text>
+				<image class="login-icon" src="/static/logo.png"></image>
+				<text class="login-title"> {{ $t('login') }} </text>
 			</view>
 		</view>
 		
 		<!-- 登录框 -->
 		<view class="login-card cu-card padding radius shadow bg-white">
 			<view class="flex padding-tb justify-between">
-				<view class="u-border-bottom text-xl text-red"> {{ $t('login') }} </view>
+				<view class="u-border-bottom text-xl text-red"> {{ $t('userLogin') }} </view>
 				<view class="text-xl" @click="changeToEnglish"> {{ $t('switchLanguage') }} </view>
 			</view>
 			
 			<!-- 输入框 -->
 			<u-gap height="20"/>
-			<u--input v-model="user.account" placeholder="用户名" clearable prefixIcon="account" border="bottom" prefixIconStyle="font-size: 22px;color: #909399" @clear="clearInput"/>
+			<u--input v-model="user.account" :placeholder="$t('userName')" clearable prefixIcon="account" border="bottom" prefixIconStyle="font-size: 22px;color: #909399" @clear="clearInput(true)"/>
 			<u-gap height="10"/>
-			<u--input v-model="user.password" placeholder="密码" clearable password prefixIcon="lock" border="bottom" prefixIconStyle="font-size: 22px;color: #909399" @clear="clearInput"/>
+			<u--input v-model="user.password" :placeholder="$t('password')" clearable password prefixIcon="lock" border="bottom" prefixIconStyle="font-size: 22px;color: #909399" @clear="clearInput(false)"/>
 			
 			<!-- 登录按钮 -->
 			<u-gap height="40"/>
 			<button class="cu-btn block bg-red margin-tb-sm lg radio" @click="startLogin">
-				<text v-show="loading" class="cuIcon-loading2 cuIconfont-spin"></text>
+				<text v-if="loading" class="cuIcon-loading2 cuIconfont-spin"></text>
 				<text> {{ $t('logIn') }} </text>
 			</button>
 			
@@ -41,7 +41,7 @@
 			</view>
 		</view>
 	
-		<text class="version-text self-center">版本号:1.1.1</text>
+		<text class="version-text self-center"> {{ $t('appVersion', {version: '1.0.0'}) }} </text>
 	</view>
 </template>
 
@@ -52,8 +52,8 @@
 				loading: false,
 				loginStr: '登录',
 				user: {
-					account: '2333333',
-					password: '123456',
+					account: '',
+					password: '',
 				},
 				animation: '',
 				aggred: false,
@@ -61,6 +61,22 @@
 		},
 		methods: {
 			startLogin() {
+				
+				if (this.user.account == '') return uni.showToast({
+					icon:'none',
+					title: this.$i18n.t('pleaseInput') + this.$i18n.t('userName')
+				})
+				
+				if (this.user.password == '') return uni.showToast({
+					icon:'none',
+					title: this.$i18n.t('pleaseInput') + this.$i18n.t('password')
+				})
+				
+				if (!this.aggred) return uni.showToast({
+					icon:'none',
+					title: this.$i18n.t('pleaseReadAndAggreeThePrivacyPolicy')
+				})
+				
 				this.loading = true
 				setTimeout(() => {
 					this.loading = false
@@ -70,16 +86,16 @@
 				}, 2.0*1000);
 			},
 			changeToEnglish() {
-				console.log('changeToEnglish')
+				let locale = this.$i18n.locale
+				locale === 'zh' ? this.$i18n.locale = 'en' : this.$i18n.locale = 'zh'
 			},
 			/// 清除输入框
-			clearInput() {
-				console.log('fuck')
-				// if (isUserAccount) {
+			clearInput(isUserAccount) {
+				if (isUserAccount) {
 					this.user.account = ''
-				// } else {
+				} else {
 					this.user.password = ''
-				// }
+				}
 			},
 			aggreeBtnClick() {
 				this.aggred = !this.aggred

+ 26 - 0
pages/mine/index.vue

@@ -0,0 +1,26 @@
+<template>
+	<text> {{ $t('me') }} </text>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			};
+		},
+		name: 'tabbar-mine',
+		computed: {
+			
+		},
+		props: {
+			
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+</style>

二進制
static/tabbar/calendar.png


二進制
static/tabbar/calendar_active.png


二進制
static/tabbar/count.png


二進制
static/tabbar/count_active.png


二進制
static/tabbar/me.png


二進制
static/tabbar/me_active.png


二進制
static/tabbar/message.png


二進制
static/tabbar/message_active.png