第二次提交

pages/equipMange/index/addusers.vue

@@ -5,41 +5,56 @@
 		</view>
 		<view class="addusers">
 			<u-form :model="form" ref="uForm" class="uForm">
-				<u-form-item label="姓名" left-icon="account" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom"
-				 prop="name" required>
-					<u-input v-model="form.name" :clearable="clearable" input-align="right" placeholder="请输入姓名" />
-				</u-form-item>
-				<u-form-item label="电话" left-icon="phone" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom"
-				 prop="intro" required>
-					<u-input v-model="form.intro" :clearable="clearable" input-align="right" placeholder="请输入电话" />
-				</u-form-item>
-				<u-form-item label="密码" left-icon="lock" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom"
-				 prop="passwold" required>
-					<u-input v-model="form.passwold" type="password" :clearable="clearable" input-align="right" placeholder="请输入密码" />
-				</u-form-item>
-				<u-form-item label="角色类型" left-icon="account-fill" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
-					<u-input v-model="form.typesofrole" type="select" :clearable="clearable" @click="typesofrole[0].show = true"
-					 input-align="right" placeholder="请选择角色类型" />
-				</u-form-item>
-				<u-form-item label="主题" left-icon="calendar" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
-					<u-input v-model="form.theme" type="select" :clearable="clearable" @click="theme_show = true" input-align="right"
-					 placeholder="请选择主题" />
-					<u-action-sheet :list="theme" v-model="theme_show" @click="themes" scroll-y="true"></u-action-sheet>
-				</u-form-item>
-				<u-form-item label="用户类型" left-icon="grid" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
-					<u-input v-model="form.usersofrole" type="select" :clearable="clearable" @click="usersofrole_show = true"
-					 input-align="right" :placeholder="usersofrole[0].text" />
-					<u-action-sheet :list="usersofrole" v-model="usersofrole_show" @click="usersofroles"></u-action-sheet>
-				</u-form-item>
-				<u-form-item label="测试用户" left-icon="eye" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
-					<u-input v-model="form.testuser" type="select" :clearable="clearable" @click="testuser_show = true" input-align="right"
-					 :placeholder="testuser[0].text" />
-					<u-action-sheet :list="testuser" v-model="testuser_show" @click="testusers"></u-action-sheet>
-				</u-form-item>
+				<view class="uFormbg">
+					<u-form-item label="姓名" left-icon="account" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom"
+					 prop="name" required>
+						<u-input v-model="form.name" :clearable="clearable" input-align="right" placeholder="请输入姓名" />
+					</u-form-item>
+				</view>
+				<view class="uFormbg">
+					<u-form-item label="电话" left-icon="phone" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom"
+					 prop="intro" required>
+						<u-input v-model="form.intro" :clearable="clearable" input-align="right" placeholder="请输入电话" />
+					</u-form-item>
+				</view>
+				<view class="uFormbg">
+					<u-form-item label="密码" left-icon="lock" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom"
+					 prop="passwold" required>
+						<u-input v-model="form.passwold" type="password" :clearable="clearable" input-align="right" placeholder="请输入密码" />
+					</u-form-item>
+				</view>
+				<view class="uFormbg">
+					<u-form-item label="角色类型" left-icon="account-fill" :left-icon-style="lefticonstyle" label-width="160rpx"
+					 :border-bottom="borderbottom">
+						<u-input v-model="form.typesofrole" type="select" :clearable="clearable" @click="typesofrole[0].show = true"
+						 input-align="right" placeholder="请选择角色类型" :select-open="typesofrole[0].show"/>
+					</u-form-item>
+				</view>
+				<view class="uFormbg">
+					<u-form-item label="主题" left-icon="calendar" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
+						<u-input v-model="form.theme" :clearable="clearable"  type="select" @click="theme_show = true" input-align="right" placeholder="请选择主题"
+						  :select-open="theme_show"/>
+						<u-action-sheet :list="theme" v-model="theme_show" @click="themes" scroll-y="true"></u-action-sheet>
+					</u-form-item>
+				</view>
+				<view class="uFormbg">
+					<u-form-item label="用户类型" left-icon="grid" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
+						<u-input v-model="form.usersofrole" type="select" :clearable="clearable" @click="usersofrole_show = true"
+						 input-align="right" :placeholder="usersofrole[0].text" :select-open="usersofrole_show"/>
+						<u-action-sheet :list="usersofrole" v-model="usersofrole_show" @click="usersofroles"></u-action-sheet>
+					</u-form-item>
+				</view>
+				<view class="uFormbg">
+					<u-form-item label="测试用户" left-icon="eye" :left-icon-style="lefticonstyle" label-width="160rpx" :border-bottom="borderbottom">
+						<u-input v-model="form.testuser" type="select" :clearable="clearable" @click="testuser_show = true" input-align="right"
+						 :placeholder="testuser[0].text" :select-open="testuser_show" />
+						<u-action-sheet :list="testuser" v-model="testuser_show" @click="testusers"></u-action-sheet>
+					</u-form-item>
+				</view>
 			</u-form>
 		</view>
 		<button class="submitbtn" @click="addusers">确 定</button>
-		<u-popup v-model="typesofrole[0].show" mode="bottom" length="40%" class="pop-up">
+		<u-popup v-model="typesofrole[0].show" mode="bottom" length="30%" class="pop-up">
 			<scroll-view scroll-y="true" class="sheet">
 				<view class="sheet-text" v-for="(item,index) in typesofrole[1]" :key="index">
 					<p @click="typesofroles(item.role_name,item.role_id)">{{item.role_name}}</p>
@@ -66,7 +81,7 @@
 					typesofrole_id: null,
 					theme: null,
 					usersofrole: null,
-					usersofrole_id:null,
+					usersofrole_id: null,
 					testuser: null,
 				},
 				rules: {
@@ -80,7 +95,7 @@
 							validator: (rule, value, callback) => {
 								// 上面有说，返回true表示校验通过，返回false表示不通过
 								// this.$u.test.mobile()就是返回true或者false的
-								return value.length<10 && value.length>1
+								return value.length < 10 && value.length > 1
 							},
 							message: '请输入2-10个字符',
 							// 触发器可以同时用blur和change
@@ -137,9 +152,9 @@
 			}
 		},
 		methods: {
-			typesofroles(value,id) {
+			typesofroles(value, id) {
 				this.form.typesofrole = value;
-				this.form.typesofrole_id=id
+				this.form.typesofrole_id = id
 				this.typesofrole[0].show = false
 			},
 			themes(index) {
@@ -147,7 +162,7 @@
 			},
 			usersofroles(index) {
 				this.form.usersofrole = this.usersofrole[index].text;
-				this.form.usersofrole_id=index+1
+				this.form.usersofrole_id = index + 1
 			},
 			testusers(index) {
 				this.form.testuser = this.testuser[index].text;
@@ -164,37 +179,37 @@
 					url: '/api/api_gateway?method=pest.warning_record.rolemanage_view'
 				})
 				console.log(res.data)
-				for (var i=0;i<res.data.length;i++) {
+				for (var i = 0; i < res.data.length; i++) {
 					let obj = {}
 					obj.text = res.data[i].role_describe
-					obj.role_id=res.data[i].id
+					obj.role_id = res.data[i].id
 					this.theme.push(obj)
 				}
 			},
 			async getaddusers() {
 				const res = await this.$myRequest({
 					url: '/api/api_gateway?method=user.login.regiest',
-					data:{
-						 username:this.form.name,
-						 mobile:this.form.intro,
-						 password:this.form.passwold,
-						 role_id:this.form.typesofrole_id?this.form.typesofrole_id:1,
-						 user_type:this.form.usersofrole_id?this.form.usersofrole_id:1,
-						 cs_user:this.form.testuser=="是"?1:0
+					data: {
+						username: this.form.name,
+						mobile: this.form.intro,
+						password: this.form.passwold,
+						role_id: this.form.typesofrole_id ? this.form.typesofrole_id : 1,
+						user_type: this.form.usersofrole_id ? this.form.usersofrole_id : 1,
+						cs_user: this.form.testuser == "是" ? 1 : 0
 					}
 				})
 			},
-			addusers(){
-				if(this.form.name&&this.form.intro&&this.form.passwold){
+			addusers() {
+				if (this.form.name && this.form.intro && this.form.passwold) {
 					this.getaddusers()
 					uni.navigateTo({
-					    url: './index'
+						url: './index'
 					});
 				}
 			},
-			clickLeft(){
+			clickLeft() {
 				uni.navigateTo({
-				    url: './index'
+					url: './index'
 				});
 			}
 		},
@@ -216,7 +231,19 @@
 
 		.uForm {
 			margin-top: 88rpx;
-			width: 85%;
+			width: 90%;
+
+			.uFormbg {
+				width: 100%;
+				padding: 0 20rpx;
+				margin: 20rpx 0;
+				background-color: #F7F8FA;
+
+				.u-form-item {
+					padding: 0 10rpx;
+				}
+			}
+
 		}
 	}
 

pages/equipMange/index/index.vue

@@ -6,9 +6,9 @@
 			</view>
 			<view class="uinput-box">
 				<view class="uinputs">
-					<u-input v-model="argument.username" :type="type" :border="border" placeholder="请输入用户名称" input-align="center" :clearable="border"
-					 :custom-style="uinputstyle" />
-					 <u-icon name="search" class="search" size="30" @click="search"></u-icon>
+					<u-input v-model="argument.username" :type="type" :border="border" placeholder="请输入用户名称" input-align="center"
+					 :clearable="border" :custom-style="uinputstyle" @input="searchinput" />
+					<u-icon name="search" class="search" size="30" @click="search"></u-icon>
 				</view>
 			</view>
 			<view class="userlists">
@@ -23,6 +23,10 @@
 </template>
 
 <script>
+	import {
+		Debounce,
+		Throttle
+	} from "../../../util/anitthro.js"
 	export default {
 		data() {
 			return {
@@ -35,10 +39,10 @@
 					"border-radius": "25px"
 				},
 				userlists: [],
-				argument:{
-					page:1,
-					page_size:10,
-					username:''
+				argument: {
+					page: 1,
+					page_size: 10,
+					username: ''
 				}
 			}
 		},
@@ -46,37 +50,49 @@
 			async getState(argument) {
 				const res = await this.$myRequest({
 					url: '/api/api_gateway?method=user.login.users_info',
-					data:{
-						page:argument.page,
-						page_size:argument.page_size,
-						username:argument.username
+					data: {
+						page: argument.page,
+						page_size: argument.page_size,
+						username: argument.username
 					}
 				})
-				this.userlists =this.userlists.concat(res.data)
+				this.userlists = this.userlists.concat(res.data)
 			},
-			clickRight() {//跳转增加用户页面
+			clickRight() { //跳转增加用户页面
 				uni.navigateTo({
 					url: './addusers',
 				})
 			},
-			userOperation(item) {//跳转用户信息页面
-				item=JSON.stringify(item)
+			userOperation(item) { //跳转用户信息页面
+				item = JSON.stringify(item)
 				uni.navigateTo({
-					url: './useroperation?item='+item,
+					url: './useroperation?item=' + item,
 				})
 			},
-			search(){//搜索用户
-			this.userlists=[]
+			search() { //搜索用户
+				this.userlists = []
 				this.getState(this.argument)
-				console.log(1)
+			},
+			searchinput() {
+				this.argument.page=1
+				Debounce(() => {
+					this.userlists = []
+					this.getState(this.argument)
+				}, 1000)()
 			}
-		},//user.login.users_info
+		}, //user.login.users_info
 		onLoad() {
 			this.getState(this.argument)
 		},
 		onReachBottom() {
 			this.argument.page++
 			this.getState(this.argument)
+		},
+		onPullDownRefresh() {
+			this.getState(this.argument)
+			setTimeout(function() {
+				uni.stopPullDownRefresh(); //停止下拉刷新动画
+			}, 1000);
 		}
 	}
 </script>
@@ -95,7 +111,8 @@
 		.uinputs {
 			width: 95%;
 			position: relative;
-			.search{
+
+			.search {
 				position: absolute;
 				top: 40rpx;
 				left: 200rpx;

util/anitthro.js

@@ -0,0 +1,47 @@
+let timer1 = null; //防抖，  
+let timer2 = null; //节流  
+function Debounce(fn, t) {//防抖
+	let delay = t || 500;
+	return function () {  
+	    let args = arguments;  
+	    // let timer1 = null  
+	    // console.log(timer1);  
+	    if(timer1){  
+	        clearTimeout(timer1);  
+	    }  
+	    timer1 = setTimeout(() => {  
+	        fn.apply(this, args);  
+	        timer1 = null;  
+	    }, delay);  
+	} 
+}
+// 使用  
+/*import {Debounce} from '@/common/debounceThrottle.js'  
+Debounce(() => {  
+    //要执行的函数  
+}, 200)() */  
+function Throttle(fn, t) {//节流
+	let last;
+	let interval = t || 500;  
+	return function () {  
+	    let args = arguments;  
+	    let now = +new Date();  
+	    if (last && now - last < interval) {  
+	        clearTimeout(timer2);  
+	        timer2 = setTimeout(() => {  
+	            last = now;  
+	            fn.apply(this, args);  
+	        }, interval);  
+	    } else {  
+	        last = now;  
+	        fn.apply(this, args);  
+	    }  
+	}  
+}
+ 
+module.exports = {
+	Debounce: Debounce,
+	Throttle: Throttle
+}
+
+