[功能增加][老药师]:页面增加添加客户功能和显示修改

api/dept/dept.js

@@ -0,0 +1,17 @@
+import request from '@/utils/request'
+
+//新增客户并为客户创建一个管理员
+export function addDeptAndUser(deptUser){
+    return request({
+        url:'/system/dept/user',
+        data:deptUser,
+        method: 'post'
+    })
+}
+//删除客户
+export function delDept(deptId){
+    return request({
+        url:'/system/dept/'+deptId,
+        method: 'delete'
+    })
+}

api/device/device.js

@@ -220,3 +220,12 @@ export function delDevicePlan(deviceId) {
         method: 'delete'
     })
 }
+
+
+// 解除设备绑定
+export function unbind(userId) {
+    return request({
+        url: '/iot/device/unbind/' + userId,
+        method: 'delete'
+    })
+}

manifest.json

@@ -41,7 +41,7 @@
     },
     "quickapp" : {},
     "mp-weixin" : {
-        "appid" : "wx0ef8e17314eb2764",
+        "appid" : "wxc4471e86d14666b8",
         "plugins" : {},
         "setting" : {
             "urlCheck" : false,

pages/device/alert.vue

@@ -4,6 +4,8 @@
       <uni-card v-for="item in alertList" :title="item.deviceName" :extra="item.createTime">
 
         <view style="position: relative">
+			<view>客户:{{item.deptName!==null?item.deptName:''}}</view>
+			<view>手机号:{{item.phone!==null?item.phone:''}}</view>
           <view>报警名称:{{item.alertName}}</view>
           <view>报警级别:{{alertLevel[item.alertLevel-1]}}</view>
           <view v-if="item.status == 3">状态:已处理</view>
@@ -91,7 +93,8 @@ export default {
     getAlertList(){
       this.loadStatus = "loading"
       getAlertList(this.pageNum,this.pageSize).then(res=>{
-        if(res.total == this.alertList.length){
+		  console.log("res>>>"+JSON.stringify(res))
+        if(res.total == this.alertList.length && res.total<this.pageSize){
           uni.showToast({
             icon:"none",
             title:"没有更多了"
@@ -101,6 +104,7 @@ export default {
         }
         this.loadStatus = "more"
         this.alertList = this.alertList.concat(res.rows);
+		console.log('first:::>>>'+JSON.stringify(this.alertList[0]))
       });
     }
   }

pages/device/rank.vue

@@ -7,14 +7,16 @@
           <uni-th align="center" width="50">排名</uni-th>
           <uni-th align="center" width="100">运行时长</uni-th>
           <uni-th align="center" width="100">设备编号</uni-th>
-          <uni-th align="center" width="100">设备名称</uni-th>
+		  <uni-th align="center" width="100">客户名称</uni-th>
+          <!-- <uni-th align="center" width="100">设备名称</uni-th> -->
         </uni-tr>
         <!-- 表格数据行 -->
         <uni-tr v-for="(item,index) in rankList">
           <uni-td align="center">{{index+1 }}</uni-td>
           <uni-td align="center">{{ item.logValue }}</uni-td>
           <uni-td align="center">{{ item.serialNumber }}</uni-td>
-          <uni-td align="center">{{item.deviceName}}</uni-td>
+		  <uni-td align="center">{{item.deptName!==null?item.deptName:''}}</uni-td>
+          <!-- <uni-td align="center">{{item.deviceName}}</uni-td> -->
         </uni-tr>
 
 

pages/user/index.vue

@@ -1,143 +1,285 @@
 <template>
-  <view class="work-container">
-    <view class="header">
-      <u-search placeholder="请输入客户名称" :clearabled="true" @clear="searchDept" @custom="searchDept" v-model="search.deptName" @search="searchDept"></u-search>
-    </view>
-    <view style="margin-top: 10px">
-        <uni-card v-if="item.parentId !==0" v-for="item in deptList" :title="item.deptName" :extra="item.createTime">
-
-          <view style="position: relative">
-            <view>联系人:{{item.leader}}</view>
-            <view>联系电话:{{item.phone}}</view>
-            <view style="width: 50px;position: absolute;right:-10px;bottom:0px"><u-button @click="toUser(item)" type="primary" :plain="true" size="mini" text="查看人员"></u-button>
-            </view>
-
-            <view style="width: 50px;position: absolute;right:100rpx;bottom:0rpx"><u-button type="success" @click="toDeviceList(item)" :plain="true" size="mini" text="查看设备"></u-button>
-            </view>
-
-          </view>
-
-        </uni-card>
-    </view>
-  </view>
+	<view class="work-container">
+		<view class="header">
+			<u-search placeholder="请输入客户名称" :clearabled="true" @clear="searchDept" @custom="searchDept"
+				v-model="search.deptName" @search="searchDept"></u-search>
+		</view>
+		<view style="margin-top: 10px">
+			<uni-card v-if="item.parentId !==0" v-for="item in deptList" :title="item.deptName"
+				:extra="item.createTime">
+
+				<view style="position: relative">
+					<view>联系人:{{item.leader}}</view>
+					<view>联系电话:{{item.phone}}</view>
+					<view style="width: 50px;position: absolute;right:-10px;bottom:0px"><u-button @click="toUser(item)"
+							type="primary" :plain="true" size="mini" text="查看人员"></u-button>
+					</view>
+					
+					<view style="width: 50px;position: absolute;right:90rpx;bottom:0rpx"><u-button type="success"
+							@click="toDeviceList(item)" :plain="true" size="mini" text="查看设备"></u-button>
+					</view>
+					<view style="width: 50px;position: absolute;right:200rpx;bottom:0rpx"><u-button type="warning "
+							@click="toDel(item)" :plain="true" size="mini" text="删除客户"></u-button>
+					</view>
+				</view>
+
+			</uni-card>
+		</view>
+		<view style="position: fixed;bottom: 0px;text-align: center;width: 100%">
+			<u-button type="primary" text="新增客户" @click="newUser"></u-button>
+		</view>
+		<u-modal :show="showAdd " title="客户信息" @cancel="closeDlg" :showCancelButton="true" @confirm="doAddUser">
+			<view class="slot-content">
+				<u--form labelPosition="left" :model="model1" ref="s">
+					<u-form-item label="客户名称：" prop="chooseUser.deptName" borderBottom ref="item1" labelWidth="auto">
+						<u--input v-model="chooseUser.deptName" border="none"></u--input>
+					</u-form-item>
+					<u-form-item label="联系人：" prop="chooseUser.nickName" borderBottom ref="item1" labelWidth="auto">
+						<u--input v-model="chooseUser.nickName" border="none"></u--input>
+					</u-form-item>
+
+					<u-form-item label="手机号：" prop="chooseUser.phonenumber" borderBottom ref="item1" labelWidth="auto">
+						<u--input v-model="chooseUser.phonenumber" border="none"></u--input>
+					</u-form-item>
+
+					<u-form-item label="密码：" prop="chooseUser.password" borderBottom ref="item1" labelWidth="auto">
+						<u--input v-if="showAdd" v-model="chooseUser.password" border="none"></u--input>
+					</u-form-item>
+					<u-form-item label="登录账号：" borderBottom ref="item1" labelWidth="auto">
+						<u--input v-model="chooseUser.phonenumber" border="none" disabled></u--input>
+					</u-form-item>
+					<u-form-item label="状态：" prop="chooseUser.password" borderBottom ref="item1" labelWidth="auto">
+						<u-radio-group v-model="statusValue" placement="row">
+							<u-radio v-for="(item, index) in statusList" :key="index" :label="item.name"
+								:name="item.name" @change="statusChange">
+							</u-radio>
+						</u-radio-group>
+					</u-form-item>
+					<u-form-item label="显示排序：" prop="chooseUser.orderNum" borderBottom ref="item1" labelWidth="auto">
+						<uni-number-box v-model="chooseUser.orderNum" />
+					</u-form-item>
+				</u--form>
+
+			</view>
+		</u-modal>
+	</view>
 </template>
 
 <script>
-import authObj from '@/plugins/auth.js';
-import {getDeptList,getUserListByDept} from '@/api/user/user';
-import UText from "../../uni_modules/uview-ui/components/u-text/u-text";
-export default {
-  components: {UText},
-  data() {
-      return {
-        deptList:[],
-        search:{
-          deptName:""
-        }
-      }
-    },
-  onLoad(){
-    this.getDeptList();
-  },
-    methods: {
-      searchDept(){
-        this.getDeptList();
-      },
-      toUser(item){
-        uni.navigateTo({
-          url: '/pages/user/list?deptId='+item.deptId
-        });
-      },
-      toDeviceList(item){
-        uni.navigateTo({
-          url: '/pages/device/index?deptId='+item.deptId
-        });
-      },
-      getDeptList(){
-        getDeptList(this.search.deptName).then(res=>{
-          this.deptList = res.data;
-        });
-      }
-    }
-  }
+	import authObj from '@/plugins/auth.js';
+	import {
+		getDeptList,
+		getUserListByDept
+	} from '@/api/user/user';
+	import {
+		addDeptAndUser,
+		delDept
+	} from '@/api/dept/dept'
+	import {
+		unbind
+	} from '@/api/device/device.js'
+	import UText from "../../uni_modules/uview-ui/components/u-text/u-text";
+	import {
+		checkStr
+	} from "@/utils/validate.js"
+	export default {
+		components: {
+			UText
+		},
+		data() {
+			return {
+				deptList: [],
+				search: {
+					deptName: ""
+				},
+				statusList: [{
+						name: '启用',
+						disabled: false
+					},
+					{
+						name: '禁用',
+						disabled: false
+					}
+				],
+				statusValue: '启用',
+				//showEdit: false,
+				showAdd: false,
+				chooseUser: {},
+			}
+		},
+		onLoad() {
+			this.getDeptList();
+		},
+		methods: {
+			newUser() {
+				this.showAdd = true;
+				this.chooseUser.orderNum = 1
+			},
+			closeDlg() {
+				console.log('closeDlg>>>>>>>')
+				this.showAdd = false;
+				this.chooseUser = {};
+			},
+			statusChange(e) {
+				console.log(e);
+			},
+			searchDept() {
+				this.getDeptList();
+			},
+			toUser(item) {
+				uni.navigateTo({
+					url: '/pages/user/list?deptId=' + item.deptId
+				});
+			},
+			toDeviceList(item) {
+				uni.navigateTo({
+					url: '/pages/device/index?deptId=' + item.deptId
+				});
+			},
+			//删除客户，并删除客户下的用户信息和解绑设备
+			toDel(item){
+				let self=this
+				uni.showModal({
+				  title: '提示',
+				  content: "删除客户信息并解绑设备？",
+				  confirmText:'取消',
+				  confirmColor:'#2979ff',
+				  cancelText:'确定',
+				  cancelColor:'#ed1c24',
+				  success: function (res) {
+				    if (res.confirm) {
+				     console.log('取消'+JSON.stringify(item));
+				    } else if (res.cancel) {
+				      console.log('用户点击确定'+JSON.stringify(item));
+					  unbind(item.deptId).then(res=>{
+						  uni.showToast({
+						  	title: '操作成功',
+						  	icon: 'none',
+						  	duration: 1500
+						  })
+						  location.reload()
+					  })
+				    }
+				  }
+				});
+			},
+			getDeptList() {
+				getDeptList(this.search.deptName).then(res => {
+					this.deptList = res.data;
+				});
+			},
+			doAddUser() {
+				let self = this;
+				this.chooseUser.postIds = [];
+				if (this.statusValue == '启用') {
+					this.chooseUser.status = 0;
+				} else {
+					this.chooseUser.status = 1;
+				}
+				if (!checkStr(this.chooseUser.phonenumber, 'mobile')) {
+					uni.showToast({
+						title: '手机号码格式有误',
+						icon: 'none',
+						duration: 1000
+					})
+				} else {
+					this.chooseUser.userName = this.chooseUser.phonenumber
+					if (this.showAdd) {
+						addDeptAndUser(this.chooseUser).then(res => {
+							uni.showToast({
+								title: '操作成功',
+								icon: 'none',
+								duration: 1500
+							})
+							self.closeDlg();
+							location.reload()
+						}).catch(res => {
+							console.log('close>>>>>>erro')
+						})
+					}
+				}
+			},
+		}
+	}
 </script>
 
 <style lang="scss">
-  /* #ifndef APP-NVUE */
-  .u-collapse-content{
-    display: flex;
-    flex-direction: column;
-  }
-  page {
-    display: flex;
-    flex-direction: column;
-    box-sizing: border-box;
-    background-color: #fff;
-    min-height: 100%;
-    height: auto;
-  }
-
-  view {
-    font-size: 14px;
-    line-height: inherit;
-  }
-
-  /* #endif */
-
-  .text {
-    text-align: center;
-    font-size: 26rpx;
-    margin-top: 10rpx;
-  }
-
-  .grid-item-box {
-    flex: 1;
-    /* #ifndef APP-NVUE */
-    display: flex;
-    /* #endif */
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    padding: 15px 0;
-  }
-
-  .uni-margin-wrap {
-    width: 690rpx;
-    width: 100%;
-    ;
-  }
-
-  .swiper {
-    height: 300rpx;
-  }
-
-  .swiper-box {
-    height: 150px;
-  }
-
-  .swiper-item {
-    /* #ifndef APP-NVUE */
-    display: flex;
-    /* #endif */
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    color: #fff;
-    height: 300rpx;
-    line-height: 300rpx;
-  }
-
-  @media screen and (min-width: 500px) {
-    .uni-swiper-dot-box {
-      width: 400px;
-      /* #ifndef APP-NVUE */
-      margin: 0 auto;
-      /* #endif */
-      margin-top: 8px;
-    }
-
-    .image {
-      width: 100%;
-    }
-  }
-</style>
+	/* #ifndef APP-NVUE */
+	.u-collapse-content {
+		display: flex;
+		flex-direction: column;
+	}
+
+	page {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		background-color: #fff;
+		min-height: 100%;
+		height: auto;
+	}
+
+	view {
+		font-size: 14px;
+		line-height: inherit;
+	}
+
+	/* #endif */
+
+	.text {
+		text-align: center;
+		font-size: 26rpx;
+		margin-top: 10rpx;
+	}
+
+	.grid-item-box {
+		flex: 1;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 15px 0;
+	}
+
+	.uni-margin-wrap {
+		width: 690rpx;
+		width: 100%;
+		;
+	}
+
+	.swiper {
+		height: 300rpx;
+	}
+
+	.swiper-box {
+		height: 150px;
+	}
+
+	.swiper-item {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		color: #fff;
+		height: 300rpx;
+		line-height: 300rpx;
+	}
+
+	@media screen and (min-width: 500px) {
+		.uni-swiper-dot-box {
+			width: 400px;
+			/* #ifndef APP-NVUE */
+			margin: 0 auto;
+			/* #endif */
+			margin-top: 8px;
+		}
+
+		.image {
+			width: 100%;
+		}
+	}
+</style>

utils/validate.js

@@ -0,0 +1,46 @@
+// 判断类型集合
+export const checkStr = (str, type) => {
+	switch (type) {
+		case 'mobile': //手机号码
+			return /^1[3|4|5|6|7|8|9][0-9]{9}$/.test(str);
+		case 'tel': //座机
+			return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);
+		case 'card': //身份证
+			return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(str);
+		case 'mobileCode': //6位数字验证码
+			return /^[0-9]{4}$/.test(str)
+		case 'pwd': //密码以字母开头，长度在6~18之间，只能包含字母、数字和下划线
+			return /^([a-zA-Z0-9_]){6,18}$/.test(str)
+		case 'payPwd': //支付密码 6位纯数字
+			return /^[0-9]{6}$/.test(str)
+		case 'postal': //邮政编码
+			return /[1-9]\d{5}(?!\d)/.test(str);
+		case 'QQ': //QQ号
+			return /^[1-9][0-9]{4,9}$/.test(str);
+		case 'email': //邮箱
+			return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);
+		case 'money': //金额(小数点2位)
+			return /^\d*(?:\.\d{0,2})?$/.test(str);
+		case 'URL': //网址
+			return /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.test(str)
+		case 'IP': //IP
+			return /((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))/.test(str);
+		case 'date': //日期时间
+			return /^(\d{4})\-(\d{2})\-(\d{2}) (\d{2})(?:\:\d{2}|:(\d{2}):(\d{2}))$/.test(str) || /^(\d{4})\-(\d{2})\-(\d{2})$/
+				.test(str)
+		case 'number': //数字
+			return /^[0-9]$/.test(str);
+		case 'english': //英文
+			return /^[a-zA-Z]+$/.test(str);
+		case 'chinese': //中文
+			return /^[\\u4E00-\\u9FA5]+$/.test(str);
+		case 'lower': //小写
+			return /^[a-z]+$/.test(str);
+		case 'upper': //大写
+			return /^[A-Z]+$/.test(str);
+		case 'HTML': //HTML标记
+			return /<("[^"]*"|'[^']*'|[^'">])*>/.test(str);
+		default:
+			return true;
+	}
+}