更新登录

App.vue

@@ -32,7 +32,7 @@ export default {
 
 //全局页面背景色
 page {
-	background-color: #f6f6f7;
+	background-color: white;
 }
 //底部安全距离
 .bottom-safety {

common/graceChecker.js

@@ -0,0 +1,181 @@
+/**
+数据验证（表单验证）
+来自 grace.hcoder.net 
+作者 hcoder 深海
+*/
+module.exports = {
+	error: '',
+	check: function(data, rule) {
+		for (var i = 0; i < rule.length; i++) {
+			if (!rule[i].checkType) {
+				return true;
+			}
+			if (!rule[i].name) {
+				return true;
+			}
+			if (!rule[i].errorMsg) {
+				return true;
+			}
+			switch (rule[i].checkType) {
+				case 'string':
+					var reg = new RegExp('^.{' + rule[i].checkRule + '}$');
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'int':
+					var reg = new RegExp('^(-[1-9]|[1-9])[0-9]{' + rule[i].checkRule + '}$');
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'between':
+					if (!this.isNumber(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					var minMax = rule[i].checkRule.split(',');
+					minMax[0] = Number(minMax[0]);
+					minMax[1] = Number(minMax[1]);
+					if (data[rule[i].name] > minMax[1] || data[rule[i].name] < minMax[0]) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'betweenD':
+					var reg = /^-?[1-9][0-9]?$/;
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					var minMax = rule[i].checkRule.split(',');
+					minMax[0] = Number(minMax[0]);
+					minMax[1] = Number(minMax[1]);
+					if (data[rule[i].name] > minMax[1] || data[rule[i].name] < minMax[0]) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'betweenF':
+					var reg = /^-?[0-9][0-9]?.+[0-9]+$/;
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					var minMax = rule[i].checkRule.split(',');
+					minMax[0] = Number(minMax[0]);
+					minMax[1] = Number(minMax[1]);
+					if (data[rule[i].name] > minMax[1] || data[rule[i].name] < minMax[0]) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'same':
+					if (data[rule[i].name] != rule[i].checkRule) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'notsame':
+					if (data[rule[i].name] == rule[i].checkRule) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'email':
+					var reg = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'phoneno':
+					var reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
+					if (data[rule[i].name]) {
+						if (!reg.test(data[rule[i].name])) {
+							this.error = rule[i].errorMsg;
+							return false;
+						}
+					}
+					break;
+				case 'telephone':
+					var reg = /^(?:(?:\d{3}-)?\d{8}|^(?:\d{4}-)?\d{7,8})(?:-\d+)?$/;
+					if (data[rule[i].name]) {
+						if (!reg.test(data[rule[i].name])) {
+							this.error = rule[i].errorMsg;
+							return false;
+						}
+					}
+					break;
+				case 'id':
+					var reg =
+						/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'zipcode':
+					var reg = /^[0-9]{6}$/;
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'reg':
+					var reg = new RegExp(rule[i].checkRule);
+					if (!reg.test(data[rule[i].name])) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'in':
+					if (rule[i].checkRule.indexOf(data[rule[i].name]) == -1) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'notnull':
+					if (data[rule[i].name] == null || data[rule[i].name].length < 1) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'editor':
+					if (data[rule[i].name] == null || data[rule[i].name] === '<p wx:nodeid=\"85\"><br></p>' ||
+						data[rule[i].name] ===
+						'<p><br></p>' || data[rule[i].name].length < 1 || data[rule[i].name].length ===
+						undefined) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'limit20':
+					if (data[rule[i].name].length > 20) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'limit10':
+					if (data[rule[i].name].length > 10) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+				case 'limit60':
+					if (data[rule[i].name].length > 60) {
+						this.error = rule[i].errorMsg;
+						return false;
+					}
+					break;
+			}
+		}
+		return true;
+	},
+	isNumber: function(checkVal) {
+		var reg = /^-?[1-9][0-9]?.?[0-9]*$/;
+		return reg.test(checkVal);
+	}
+}

main.js

@@ -2,6 +2,7 @@ import App from './App'
 import api from '@/apis/api.js'
 import common from '@/common/js/common.js'
 import uView from "uview-ui";
+import verify from './common/graceChecker.js' //数据校验证
 
 Vue.use(uView);
 // #ifndef VUE3
@@ -10,6 +11,7 @@ Vue.config.productionTip = false
 App.mpType = 'app'
 Vue.prototype.$api = api
 Vue.prototype.$common = common
+Vue.prototype.verify = verify;
 const app = new Vue({
     ...App
 })

pages/login/chooseRole.vue

@@ -1,93 +1,86 @@
 <template>
-	<view class="u-page">
-		<navigation-bar title="选择角色" background-color="#fff" front-color="#000000" />
-		<u-list :scrollable="false" height="500px">
-			<u-list-item v-for="(item, index) in roles" :key="index" >
-				<!-- <u-button class="custom-style" size="lager" type="primary" shape="circle" :text="`我是${item.roleName}`" @click="choose(item.id)"></u-button> -->
-				<u-button :class="item.id==current?'active-custom-style':'custom-style'" size="lager" type="primary" shape="circle" @click="choose(item)">
-					<text>我是{{item.roleName}}</text>
-				</u-button>
-			</u-list-item>
-		</u-list>
-		<!-- <u-button type="error" shape="circle" text="下一步" @click="next()"></u-button> -->
+	<view>
+		<view class="item">
+			<view class="title">我是货主</view>
+			<image src="../../static/images/role/jxs.png" mode="widthFix"></image>
+		</view>
 	</view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				roles: [],
-				current: 1,
+export default {
+	data() {
+		return {
+			roles: [],
+			current: 1
+		};
+	},
+	created() {
+		this.getList();
+	},
+	methods: {
+		choose(data) {
+			for (let i = 0; i < this.roles.length; i++) {
+				if (this.roles[i].roleName == data.roleName) {
+					this.current = data.id;
+				}
 			}
+			var that = this;
+			setTimeout(function () {
+				that.$common.to('/pages/login/register?type=' + that.current);
+			}, 500);
 		},
-		created() {
-			this.getList()
+		getList() {
+			this.$api.getIdentifyList().then(res => {
+				console.log(res);
+				this.roles = res.data;
+			});
 		},
-		methods: {
-			choose(data) {
-				for (let i = 0; i < this.roles.length; i++) {
-					if (this.roles[i].roleName == data.roleName) {
-						this.current = data.id;
-					}
-				}
-				var that = this
-				setTimeout(function() {
-					that.$common.to('/pages/login/register?type='+that.current);
-				}, 500)
-			},
-			getList(){
-				this.$api.getIdentifyList().then(res => {
-					console.log(res)
-					this.roles = res.data
-				})
-			},
-			next(){
-				// uni.navigateTo({
-				// 	url:"/pages/login/register?type="+this.current
-				// })
-				this.$common.to('/pages/login/register?type='+this.current);
-			}
+		next() {
+			// uni.navigateTo({
+			// 	url:"/pages/login/register?type="+this.current
+			// })
+			this.$common.to('/pages/login/register?type=' + this.current);
 		}
 	}
+};
 </script>
 
 <style lang="scss">
-	page {
-		padding: 30px;
-	}
+page {
+	padding: 30px;
+}
 
-	.custom-style {
-		margin-bottom: 20px;
-		width: 80%;
-		height: 70px;
-		font-size: 26px;
-		font-family: serif;
-		background-color: #87CEFA;
-		border: #87CEFA;
-	}
-	
-	.active-custom-style {
-		margin-bottom: 20px;
-		width: 80%;
-		height: 70px;
-		font-size: 28px;
-		background-color: #00BFFF;
-		border: #00BFFF;
-	}
-	
+.custom-style {
+	margin-bottom: 20px;
+	width: 80%;
+	height: 70px;
+	font-size: 26px;
+	font-family: serif;
+	background-color: #87cefa;
+	border: #87cefa;
+}
 
-	.r-role {
-		font-size: 34px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
+.active-custom-style {
+	margin-bottom: 20px;
+	width: 80%;
+	height: 70px;
+	font-size: 28px;
+	background-color: #00bfff;
+	border: #00bfff;
+}
 
-	.l-role {
-		// margin-left: 10px;
-		// position: absolute;
-		// right: 10px;
-		// bottom: 10px;
-	}
-</style>
+.r-role {
+	font-size: 34px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.l-role {
+	// margin-left: 10px;
+	// position: absolute;
+	// right: 10px;
+	// bottom: 10px;
+}
+</style>

pages/login/login.vue

@@ -36,64 +36,29 @@ export default {
 	data() {
 		return {
 			show: true,
-			form: {
-				phone: '',
-				password: ''
-			},
-			rules: {
-				phone: [
-					{
-						required: true,
-						message: '请输入手机号',
-						trigger: 'blur,change'
-					},
-					{
-						// 自定义验证函数，见上说明
-						validator: (rule, value, callback) => {
-							// 上面有说，返回true表示校验通过，返回false表示不通过
-							// uni.$u.test.mobile()就是返回true或者false的
-							// return uni.$u.test.mobile(value);
-						},
-						message: '手机号码不正确',
-						// 触发器可以同时用blur和change
-						trigger: ['change', 'blur']
-					}
-				],
-				password: [
-					{
-						required: true,
-						message: '请输入密码',
-						trigger: 'blur,change'
-					}
-				]
-			},
-			radioLabel: '',
-			value: ['1']
+			form: {}
 		};
 	},
 	methods: {
 		submit() {
-			this.$refs.uForm
-				.validate()
-				.then(res => {
-					let value = this.value;
-					if (value.length == 0) {
-						this.$common.toast('请先同意协议');
-						return;
-					}
-					this.$api.doLogin(this.form).then(resp => {
-						if (resp.code == 200) {
-							let data = resp.data;
-							uni.setStorageSync('token', data.tokenInfo.tokenValue);
-							uni.setStorageSync('info', data.appUser);
-							uni.setStorageSync('menu', data.per_list);
-							this.$common.toBar('/pages/index/index');
-						}
-					});
-				})
-				.catch(errors => {
-					uni.$u.toast('校验失败');
-				});
+			let rule = [
+				{ name: 'phone', checkType: 'phone', errorMsg: '请输入正确的手机号' },
+				{ name: 'password', checkType: 'notnull', errorMsg: '请输入密码' },
+				{ name: 'checked', checkType: 'notnull', errorMsg: '请同意并勾选协议' }
+			];
+			if (!this.verify.check(this.form, rule)) {
+				uni.showModal({ content: this.verify.error, showCancel: false });
+				return false;
+			}
+			this.$api.doLogin(this.form).then(resp => {
+				if (resp.code == 200) {
+					let data = resp.data;
+					uni.setStorageSync('token', data.tokenInfo.tokenValue);
+					uni.setStorageSync('info', data.appUser);
+					uni.setStorageSync('menu', data.per_list);
+					this.$common.toBar('/pages/index/index');
+				}
+			});
 		},
 		toRegister() {
 			this.$common.to('/pages/login/chooseRole');