【说明】阶段备份

src/components/dev_mgr/DevMgr.vue

@@ -8,7 +8,8 @@
 						:show-file-list="false">
 						<el-button type="primary" size="small">表格导入</el-button>
 					</el-upload>
-					<el-link type="primary" href="https://jtishfw.ncjti.edu.cn/jxch-smartmp/jxch-smartmp-api/HotWaters/download/模板.xls">
+					<el-link type="primary"
+						href="https://jtishfw.ncjti.edu.cn/jxch-smartmp/jxch-smartmp-api/HotWaters/download/模板.xls">
 						模板下载</el-link>
 				</span>
 			</el-col>
@@ -76,20 +77,20 @@
 					:close-on-click-modal="false" :close-on-press-escape="false">
 					<hr
 						style="width: 100%; position: absolute; top: 60px; left: 0px;background-color: #CCCCCC;height: 1px;border: 0;">
-					<el-form :model="addform">
-						<el-form-item label="水表ID：" :label-width="formLabelWidth">
+					<el-form :model="addform" :rules="addformRules" ref="addform">
+						<el-form-item label="水表ID：" :label-width="formLabelWidth" prop="user_id">
 							<el-input v-model="addform.user_id" autocomplete="off" maxlength="13"></el-input>
 						</el-form-item>
-						<el-form-item label="楼栋号：" :label-width="formLabelWidth">
+						<el-form-item label="楼栋号：" :label-width="formLabelWidth" prop="build">
 							<el-input v-model="addform.build" autocomplete="off" maxlength="4"></el-input>
 						</el-form-item>
-						<el-form-item label="宿舍号：" :label-width="formLabelWidth">
+						<el-form-item label="宿舍号：" :label-width="formLabelWidth" prop="dom">
 							<el-input v-model="addform.dom" autocomplete="off" maxlength="6"></el-input>
 						</el-form-item>
 					</el-form>
 					<div slot="footer" class="dialog-footer">
 						<el-button @click="adddialogFormVisible = false">取 消</el-button>
-						<el-button type="primary" @click="handleAddRow">确 定</el-button>
+						<el-button type="primary" @click="handleAddRow('addform')">确 定</el-button>
 					</div>
 				</el-dialog>
 				<!-- 编辑对话框 -->
@@ -97,20 +98,20 @@
 					:close-on-click-modal="false" :close-on-press-escape="false">
 					<hr
 						style="width: 100%; position: absolute; top: 60px; left: 0px;background-color: #CCCCCC;height: 1px;border: 0;">
-					<el-form :model="form">
-						<el-form-item label="水表ID：" :label-width="formLabelWidth">
-							<el-input v-model="form.user_id" autocomplete="off" maxlength="13"></el-input>
+					<el-form :model="modifyForm" :rules="modifyformRules" ref="modifyForm">
+						<el-form-item label="水表ID：" :label-width="formLabelWidth" prop="user_id">
+							<el-input v-model="modifyForm.user_id" autocomplete="off" maxlength="13"></el-input>
 						</el-form-item>
-						<el-form-item label="楼栋号：" :label-width="formLabelWidth">
-							<el-input v-model="form.build" autocomplete="off" maxlength="4"></el-input>
+						<el-form-item label="楼栋号：" :label-width="formLabelWidth" prop="build">
+							<el-input v-model="modifyForm.build" autocomplete="off" maxlength="4"></el-input>
 						</el-form-item>
-						<el-form-item label="宿舍号：" :label-width="formLabelWidth">
-							<el-input v-model="form.dom" autocomplete="off" maxlength="6"></el-input>
+						<el-form-item label="宿舍号：" :label-width="formLabelWidth" prop="dom">
+							<el-input v-model="modifyForm.dom" autocomplete="off" maxlength="6"></el-input>
 						</el-form-item>
 					</el-form>
 					<div slot="footer" class="dialog-footer">
 						<el-button @click="editdialogFormVisible = false">取 消</el-button>
-						<el-button type="primary" @click="handleEditRow">确 定</el-button>
+						<el-button type="primary" @click="handleEditRow('modifyForm')">确 定</el-button>
 					</div>
 				</el-dialog>
 				<!-- 删除对话框 -->
@@ -138,17 +139,94 @@
 				editdialogFormVisible: false, // 控制编辑框的显示隐藏
 				delDialogVisible: false, // 控制删除框的显示隐藏
 				delRowId: 0, // 删除行的id
-				form: { // 编辑框的数据绑定
+				modifyForm: { // 编辑框的数据绑定
 					user_id: '',
 					build: '',
 					dom: '',
 					id: 0
 				},
+				modifyformRules: {
+					user_id: [{
+							required: true,
+							message: '请输入水表ID',
+							trigger: 'blur'
+						},
+						{
+							min: 10,
+							max: 13,
+							message: '长度在 10 到 13 个字符',
+							trigger: 'blur'
+						}
+					],
+					build: [{
+							required: true,
+							message: '请输入楼栋号',
+							trigger: 'blur'
+						},
+						{
+							min: 2,
+							max: 4,
+							message: '长度在 2 到 4 个字符',
+							trigger: 'blur'
+						}
+					],
+					dom: [{
+							required: true,
+							message: '请输入宿舍号',
+							trigger: 'blur'
+						},
+						{
+							min: 4,
+							max: 6,
+							message: '长度在 4 到 6 个字符',
+							trigger: 'blur'
+						}
+					],
+					id: [{}]
+				},
 				addform: { // 添加框的数据绑定
 					user_id: '',
 					build: '',
 					dom: ''
 				},
+				addformRules: {
+					user_id: [{
+							required: true,
+							message: '请输入水表ID',
+							trigger: 'blur'
+						},
+						{
+							min: 10,
+							max: 13,
+							message: '长度在 10 到 13 个字符',
+							trigger: 'blur'
+						}
+					],
+					build: [{
+							required: true,
+							message: '请输入楼栋号',
+							trigger: 'blur'
+						},
+						{
+							min: 2,
+							max: 4,
+							message: '长度在 2 到 4 个字符',
+							trigger: 'blur'
+						}
+					],
+					dom: [{
+							required: true,
+							message: '请输入宿舍号',
+							trigger: 'blur'
+						},
+						{
+							min: 4,
+							max: 6,
+							message: '长度在 4 到 6 个字符',
+							trigger: 'blur'
+						}
+					]
+				},
 				formLabelWidth: '120px', //  表单的宽度
 				form_select: { // 下拉列表的数据绑定
 					builds: [{
@@ -398,110 +476,126 @@
 			 */
 			handleEdit(index, row) {
 				// console.log(index, row);
-				this.form.user_id = row.user_id
-				this.form.build = row.build
-				this.form.dom = row.dom
-				this.form.id = row.id
+				this.modifyForm.user_id = row.user_id
+				this.modifyForm.build = row.build
+				this.modifyForm.dom = row.dom
+				this.modifyForm.id = row.id
 				this.editdialogFormVisible = true
 			},
 			/**
 			 * 添加一条水表信息
 			 */
-			handleAddRow() {
-				// console.log(this.addform);
-				if (!String(this.addform.user_id).trim()) {
-					this.$message.error('请输入水表ID')
-					return
-				}
-				if (!String(this.addform.build).trim()) {
-					this.$message.error('请输入楼栋号')
-					return
-				}
-				if (!String(this.addform.dom).trim()) {
-					this.$message.error('请输入宿舍号')
-					return
-				}
+			handleAddRow(formName) {
 				var _this = this
-				this.$axios.get('/jxch-smartmp-api/HotWaters/wateraddBuild.action', {
-						params: {
-							user_id: String(this.addform.user_id).trim(),
-							dom: String(this.addform.dom).trim(),
-							build: String(this.addform.build).trim()
+				_this.$refs[formName].validate((valid) => {
+					if (valid) {
+						if (!String(_this.addform.user_id).trim()) {
+							_this.$message.error('请输入水表ID')
+							return
 						}
-					})
-					.then(res => {
-						// console.log(res.data);
-						if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data.msg == '添加成功' && JSON
-							.stringify(res.data) != '{}') {
-							_this.$message.success('【数据添加】成功！');
+						if (!String(_this.addform.build).trim()) {
+							_this.$message.error('请输入楼栋号')
+							return
+						}
+						if (!String(_this.addform.dom).trim()) {
+							_this.$message.error('请输入宿舍号')
+							return
+						}
+						_this.$axios.get('/jxch-smartmp-api/HotWaters/wateraddBuild.action', {
+								params: {
+									user_id: String(_this.addform.user_id).trim(),
+									dom: String(_this.addform.dom).trim(),
+									build: String(_this.addform.build).trim()
+								}
+							})
+							.then(res => {
+								// console.log(res.data);
+								if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data
+									.msg == '添加成功' && JSON
+									.stringify(res.data) != '{}') {
+									_this.$message.success('【数据添加】成功！');
 
-							this.addform.user_id = ''
-							this.addform.dom = ''
-							this.addform.build = ''
+									_this.addform.user_id = ''
+									_this.addform.dom = ''
+									_this.addform.build = ''
 
-							let params = {
-								page: this.currentPage,
-								rows: this.pageRows
-							}
-							this.updateTable('/jxch-smartmp-api/HotWaters/waterlist.action', params)
-							// 取得楼栋号，填充下拉列表
-							this.getBuildsFillSelect()
-						} else {
-							_this.$message.error('【数据添加】失败！');
-						}
-						this.adddialogFormVisible = false
-					})
-					.catch(err => {
-						// console.log(err);
-						_this.$message.error('【数据添加】请求异常: ' + err);
-					})
+									let params = {
+										page: _this.currentPage,
+										rows: _this.pageRows
+									}
+									_this.updateTable('/jxch-smartmp-api/HotWaters/waterlist.action', params)
+									// 取得楼栋号，填充下拉列表
+									_this.getBuildsFillSelect()
+								} else {
+									_this.$message.error('【数据添加】失败！');
+								}
+								_this.adddialogFormVisible = false
+							})
+							.catch(err => {
+								// console.log(err);
+								_this.$message.error('【数据添加】请求异常: ' + err);
+							})
+					} else {
+						// _this.$message.error('表单验证失败！')
+						return false;
+					}
+				});
 			},
 			/**
 			 * 更新指定的id所在的行
 			 */
-			handleEditRow() {
-				if (!String(this.form.user_id).trim()) {
-					this.$message.error('请输入水表ID')
-					return
-				}
-				if (!String(this.form.build).trim()) {
-					this.$message.error('请输入楼栋号')
-					return
-				}
-				if (!String(this.form.dom).trim()) {
-					this.$message.error('请输入宿舍号')
-					return
-				}
+			handleEditRow(formName) {
 				var _this = this
-				this.$axios.get('/jxch-smartmp-api/HotWaters/waterupdateBuild.action', {
-						params: {
-							id: this.form.id,
-							user_id: String(this.form.user_id).trim(),
-							dom: String(this.form.dom).trim(),
-							build: String(this.form.build).trim()
+				_this.$refs[formName].validate((valid) => {
+					if (valid) {
+						if (!String(_this.modifyForm.user_id).trim()) {
+							_this.$message.error('请输入水表ID')
+							return
 						}
-					})
-					.then(res => {
-						// console.log(res.data);
-						if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data.msg == '修改成功' && JSON
-							.stringify(res.data) != '{}') {
-							_this.$message.success('【数据修改】成功！');
-							let params = {
-								page: this.currentPage,
-								rows: this.pageRows
-							}
-							this.updateTable('/jxch-smartmp-api/HotWaters/waterlist.action', params)
-							// 取得楼栋号，填充下拉列表
-							this.getBuildsFillSelect()
-						} else {
-							_this.$message.error('【数据修改】失败！');
+						if (!String(_this.modifyForm.build).trim()) {
+							_this.$message.error('请输入楼栋号')
+							return
 						}
-						this.editdialogFormVisible = false
-					})
-					.catch(err => {
-						// console.log(err);
-						_this.$message.error('【数据修改】请求异常: ' + err);
-					})
+						if (!String(_this.modifyForm.dom).trim()) {
+							_this.$message.error('请输入宿舍号')
+							return
+						}
+						
+						_this.$axios.get('/jxch-smartmp-api/HotWaters/waterupdateBuild.action', {
+								params: {
+									id: _this.modifyForm.id,
+									user_id: String(_this.modifyForm.user_id).trim(),
+									dom: String(_this.modifyForm.dom).trim(),
+									build: String(_this.modifyForm.build).trim()
+								}
+							})
+							.then(res => {
+								// console.log(res.data);
+								if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data
+									.msg == '修改成功' && JSON
+									.stringify(res.data) != '{}') {
+									_this.$message.success('【数据修改】成功！');
+									let params = {
+										page: _this.currentPage,
+										rows: _this.pageRows
+									}
+									_this.updateTable('/jxch-smartmp-api/HotWaters/waterlist.action', params)
+									// 取得楼栋号，填充下拉列表
+									_this.getBuildsFillSelect()
+								} else {
+									_this.$message.error('【数据修改】失败！');
+								}
+								_this.editdialogFormVisible = false
+							})
+							.catch(err => {
+								// console.log(err);
+								_this.$message.error('【数据修改】请求异常: ' + err);
+							})
+					} else {
+						// _this.$message.error('表单验证失败！')
+						return false;
+					}
+				});
 			},
 			/**
 			 * 更新输入框

src/components/feilvset/feilvset.vue

@@ -37,15 +37,17 @@
 					:close-on-click-modal="false" :close-on-press-escape="false">
 					<hr
 						style="width: 100%; position: absolute; top: 60px; left: 0px;background-color: #CCCCCC;height: 1px;border: 0;">
-					<el-form :inline="true" class="demo-form-inline">
-						<el-form-item label="费率：" class="shuibiaoId">
-							<el-input v-model="input_feilv" placeholder="请输入费率" maxlength="4"></el-input>
+					<el-form :inline="true" class="demo-form-inline" :model="modifyForm" :rules="modifyRules"
+						ref="modifyForm">
+						<el-form-item label="费率：" class="shuibiaoId" prop="inputFeilv">
+							<el-input ref="inputFeilv" v-model="modifyForm.inputFeilv" placeholder="请输入费率"
+								maxlength="4"></el-input>
 						</el-form-item>
 						<div class="yuan">元/吨</div>
 					</el-form>
 					<div slot="footer" class="dialog-footer">
 						<el-button @click="editdialogFormVisible = false">取 消</el-button>
-						<el-button type="primary" @click="handle_modify_feilv">确 定</el-button>
+						<el-button type="primary" @click="handle_modify_feilv('modifyForm')">确 定</el-button>
 					</div>
 				</el-dialog>
 			</el-col>
@@ -59,7 +61,23 @@
 			return {
 				current_feilv: 0.0.toFixed(2), // 当前费率
 				editdialogFormVisible: false, // 控制费率对话框显示、隐藏
-				input_feilv: '', // 修改费率
+				modifyForm: {
+					inputFeilv: '' // 修改费率
+				},
+				modifyRules: {
+					inputFeilv: [{
+							required: true,
+							message: '请输入费率',
+							trigger: 'blur'
+						},
+						{
+							min: 1,
+							max: 4,
+							message: '长度在 1 到 4 个位',
+							trigger: 'blur'
+						}
+					]
+				},
 				tableData: [], // 表格数据
 				total_rows: 0, // 表格记录总数
 				current_page: 1, // 当前所在页码
@@ -151,42 +169,54 @@
 			 * 打开修改费率对话框
 			 */
 			modify_feilv() {
+				this.modifyForm.inputFeilv = ''
 				this.editdialogFormVisible = true
+
+				setTimeout(() => {
+					this.$refs['inputFeilv'].focus()
+				}, 100)
 			},
 			/**
 			 * 修改费率
 			 */
-			handle_modify_feilv() {
+			handle_modify_feilv(formName) {
 				var _this = this
-				if (this.input_feilv) {
-					this.$axios.get('/jxch-smartmp-api/HotWaters/waterupdatePrice.action', {
-							params: {
-								rate: this.input_feilv
-							}
-						})
-						.then(res => {
-							// console.log(res.data);
-							if (typeof(res.data.msg) != 'undefined' && res.data.msg == '修改成功') {
-								this.$message.success('【修改费率】修改成功！')
-
-								this.editdialogFormVisible = false
-
-								// 获取当前费率
-								this.get_current_feilv()
-
-								// 获取历史费率
-								this.get_history_feilv()
-							} else {
-								_this.$message.error('【修改费率】失败！');
-							}
-						})
-						.catch(err => {
-							// console.log(err);
-							_this.$message.error('【修改费率】请求异常: ' + err);
-						})
-				} else {
-					this.$message.error('请输入费率！')
-				}
+				_this.$refs[formName].validate((valid) => {
+					if (valid) {
+						if (_this.modifyForm.inputFeilv) {
+							_this.$axios.get('/jxch-smartmp-api/HotWaters/waterupdatePrice.action', {
+									params: {
+										rate: _this.modifyForm.inputFeilv
+									}
+								})
+								.then(res => {
+									// console.log(res.data);
+									if (typeof(res.data.msg) != 'undefined' && res.data.msg == '修改成功') {
+										_this.$message.success('【修改费率】修改成功！')
+						
+										_this.editdialogFormVisible = false
+						
+										// 获取当前费率
+										_this.get_current_feilv()
+						
+										// 获取历史费率
+										_this.get_history_feilv()
+									} else {
+										_this.$message.error('【修改费率】失败！');
+									}
+								})
+								.catch(err => {
+									// console.log(err);
+									_this.$message.error('【修改费率】请求异常: ' + err);
+								})
+						} else {
+							_this.$message.error('请输入费率！')
+						}
+					} else {
+						// _this.$message.error('表单验证失败！')
+						return false;
+					}
+				});
 			}
 		}
 	}

src/components/index/Index.css

@@ -99,6 +99,20 @@
 	background-size: cover;
 }
 
+.el-menu-item .el-icon-ysyc {
+	width: 27px;
+	height: 27px;
+	background: url(../../../static/images/yongshuiyichang.png) center center no-repeat;
+	background-size: cover;
+}
+
+.el-menu-item .el-icon-zfyc {
+	width: 27px;
+	height: 27px;
+	background: url(../../../static/images/zhifuyichang.png) center center no-repeat;
+	background-size: cover;
+}
+
 .el-menu-item .el-icon-zhgl {
 	width: 27px;
 	height: 27px;

src/components/index/Index.vue

@@ -45,6 +45,18 @@
 								<span slot="title">费率设置</span>
 							</el-menu-item>
 						</router-link>
+						<router-link to="ysyc">
+							<el-menu-item index="/index/ysyc">
+								<i class="el-icon-ysyc"></i>
+								<span slot="title">用水异常</span>
+							</el-menu-item>
+						</router-link>
+						<router-link to="zfyc">
+							<el-menu-item index="/index/zfyc">
+								<i class="el-icon-zfyc"></i>
+								<span slot="title">支付异常</span>
+							</el-menu-item>
+						</router-link>
 						<router-link to="zhgl">
 							<el-menu-item index="/index/zhgl">
 								<i class="el-icon-zhgl"></i>
@@ -70,7 +82,7 @@
 			</el-row>
 			<el-row>
 				<el-col :span="24" class="right-main">
-					<router-view></router-view>
+					<router-view @sonFun='indexFun'></router-view>
 				</el-col>
 			</el-row>
 		</el-col>
@@ -97,6 +109,15 @@
 			}
 		},
 		methods: {
+			// 通过子组件更新昵称
+			indexFun(param) {
+				if (typeof(param) == 'undefined' || !param) {
+					this.unic = sessionStorage.getItem('unic')
+				} else {
+					this.unic = param
+				}
+			},
+			// 退出登陆
 			logout() {
 				var _this = this
 				this.$confirm('确认退出？')

src/components/login/Login.vue

@@ -31,7 +31,7 @@
 	export default {
 		data() {
 			var checkName = (rule, value, callback) => {
-				console.log(rule, value, callback);
+				// console.log(rule, value, callback);
 				if (!value) {
 					return callback(new Error('请输入账号'));
 				}
@@ -44,7 +44,7 @@
 				}, 30);
 			};
 			var validatePass = (rule, value, callback) => {
-				console.log(rule, value, callback);
+				// console.log(rule, value, callback);
 				if (value === '') {
 					callback(new Error('请输入密码'));
 				}
@@ -100,7 +100,7 @@
 							params: params
 						})
 						.then(res => {
-							console.log(res.data);
+							// console.log(res.data);
 							if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && JSON.stringify(res
 									.data) !=
 								'{}') {

src/components/zhuanghaoguanli/zhuanghaoguanli.vue

@@ -29,7 +29,7 @@
 						<template slot-scope="scope">{{ scope.row.name }}</template>
 					</el-table-column>
 					<el-table-column prop="number" label="账号" align="center"></el-table-column>
-					<el-table-column prop="password" label="密码" show-overflow-tooltip>******</el-table-column>
+					<el-table-column prop="password" label="密码" show-overflow-tooltip>*********</el-table-column>
 					<el-table-column label="操作" align="center" width="80">
 						<el-button type="text" class="del-btn" slot-scope="scope"
 							v-if="scope.row.number != login_account" @click="handleDelete(scope.$index, scope.row)">删除
@@ -56,25 +56,28 @@
 					:close-on-click-modal="false" :close-on-press-escape="false">
 					<hr
 						style="width: 100%; position: absolute; top: 60px; left: 0px;background-color: #CCCCCC;height: 1px;border: 0;">
-					<el-form :model="addform">
-						<el-form-item label="昵称：" :label-width="formLabelWidth">
-							<el-input v-model="addform.name" autocomplete="off" maxlength="16"></el-input>
+					<el-form :model="addform" :rules="addRules" ref="addform">
+						<el-form-item label="昵称：" prop="name" :label-width="formLabelWidth">
+							<el-input v-model="addform.name" autocomplete="off" minlength="5" maxlength="16"></el-input>
 						</el-form-item>
-						<el-form-item label="账号：" :label-width="formLabelWidth">
-							<el-input v-model="addform.number" autocomplete="off" maxlength="16"></el-input>
+						<el-form-item label="账号：" prop="number" :label-width="formLabelWidth">
+							<el-input v-model="addform.number" autocomplete="off" minlength="5" maxlength="16">
+							</el-input>
 						</el-form-item>
-						<el-form-item label="密码：" :label-width="formLabelWidth">
-							<el-input v-model="addform.password" type="password" autocomplete="off" maxlength="16">
+						<el-form-item label="密码：" prop="password" :label-width="formLabelWidth">
+							<el-input v-model="addform.password" type="password" minlength="5" autocomplete="off"
+								maxlength="16">
 							</el-input>
 						</el-form-item>
-						<el-form-item label="确认新密码：" :label-width="formLabelWidth">
-							<el-input v-model="addform.comfirmPass" type="password" autocomplete="off" maxlength="16">
+						<el-form-item label="确认密码：" prop="comfirmPass" :label-width="formLabelWidth">
+							<el-input v-model="addform.comfirmPass" type="password" minlength="5" autocomplete="off"
+								maxlength="16">
 							</el-input>
 						</el-form-item>
 					</el-form>
 					<div slot="footer" class="dialog-footer">
 						<el-button @click="adddialogFormVisible = false">取 消</el-button>
-						<el-button type="primary" @click="handleAddRow">确 定</el-button>
+						<el-button type="primary" @click="handleAddRow('addform')">确 定</el-button>
 					</div>
 				</el-dialog>
 				<!-- 编辑对话框 -->
@@ -82,29 +85,32 @@
 					:close-on-click-modal="false" :close-on-press-escape="false">
 					<hr
 						style="width: 100%; position: absolute; top: 60px; left: 0px;background-color: #CCCCCC;height: 1px;border: 0;">
-					<el-form>
-						<el-form-item label="昵称：" :label-width="formLabelWidth">
+					<el-form :model="form" :rules="formRules" ref="form">
+						<el-form-item label="昵称：" prop="name" :label-width="formLabelWidth">
 							<el-input ref="nicheng" v-model="form.name" autocomplete="off" maxlength="16"></el-input>
 						</el-form-item>
-						<el-form-item label="账号：" :label-width="formLabelWidth">
+						<el-form-item label="账号：" prop="number" :label-width="formLabelWidth">
 							<el-input ref="zhanghao" v-model="form.number" autocomplete="off" maxlength="16"></el-input>
 						</el-form-item>
-						<el-form-item label="原密码：" :label-width="formLabelWidth">
-							<el-input ref="yuanmima" v-model="form.oldPassword" type="password" autocomplete="off" maxlength="16">
+						<el-form-item label="原密码：" prop="oldPassword" :label-width="formLabelWidth">
+							<el-input ref="yuanmima" v-model="form.oldPassword" type="password" autocomplete="off"
+								maxlength="16">
 							</el-input>
 						</el-form-item>
-						<el-form-item label="新密码：" :label-width="formLabelWidth">
-							<el-input ref="xinmima" v-model="form.password" autocomplete="off" type="password" maxlength="16">
+						<el-form-item label="新密码：" prop="password" :label-width="formLabelWidth">
+							<el-input ref="xinmima" v-model="form.password" autocomplete="off" type="password"
+								maxlength="16">
 							</el-input>
 						</el-form-item>
-						<el-form-item label="确认新密码：" :label-width="formLabelWidth">
-							<el-input ref="querenmima" v-model="form.comfirmPass" autocomplete="off" type="password" maxlength="16">
+						<el-form-item label="确认新密码：" prop="comfirmPass" :label-width="formLabelWidth">
+							<el-input ref="querenmima" v-model="form.comfirmPass" autocomplete="off" type="password"
+								maxlength="16">
 							</el-input>
 						</el-form-item>
 					</el-form>
 					<div slot="footer" class="dialog-footer">
 						<el-button @click="editdialogFormVisible = false">取 消</el-button>
-						<el-button type="primary" @click="handleEditRow">确 定</el-button>
+						<el-button type="primary" @click="handleEditRow('form')">确 定</el-button>
 					</div>
 				</el-dialog>
 				<!-- 删除对话框 -->
@@ -117,6 +123,23 @@
 						<el-button type="primary" @click="handleDelRow">确 定</el-button>
 					</span>
 				</el-dialog>
+				<!-- 删除账号密码验证对话框 -->
+				<el-dialog title="验证密码" :visible.sync="delDialogEnterPwdVisible" width="500px" top="0vh"
+					class="my-dialog" :close-on-click-modal="false" :close-on-press-escape="false">
+					<hr
+						style="width: 100%; position: absolute; top: 60px; left: 0px;background-color: #CCCCCC;height: 1px;border: 0;">
+					<el-form :model="delConfirmPwdform" :rules="delConfirmPwdRules" ref="delConfirmPwdform">
+						<el-form-item label="请输入密码：" prop="delPwd" :label-width="formLabelWidth">
+							<el-input ref="delPwd" v-model="delConfirmPwdform.delPwd" type="password" autocomplete="off"
+								maxlength="16">
+							</el-input>
+						</el-form-item>
+					</el-form>
+					<div slot="footer" class="dialog-footer">
+						<el-button @click="delDialogEnterPwdVisible = false">取 消</el-button>
+						<el-button type="primary" @click="getDelPwd('delConfirmPwdform')">确 定</el-button>
+					</div>
+				</el-dialog>
 			</el-col>
 		</el-row>
 	</div>
@@ -126,30 +149,159 @@
 	export default {
 		data() {
 			return {
-				account: '', // 需要查找的账号
-				del_account: '', // 要删除的账号
-				del_id: 0, // 要删除的id
-				login_account: '',
-				adddialogFormVisible: false,
-				editdialogFormVisible: false, // 控制编辑对话框显示、隐藏
-				delDialogVisible: false, // 控制删除对话框显示、隐藏
-				form: { // 编辑框的数据绑定
-					id: 0,
+				addform: { // 添加框的数据绑定
 					name: '',
 					number: '',
-					oldPassword: '',
 					password: '',
 					comfirmPass: ''
 				},
-				addform: { // 添加框的数据绑定
+				addRules: {
+					name: [{
+							required: true,
+							message: '请输入昵称',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '昵称长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					number: [{
+							required: true,
+							message: '请输入账号',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '账号长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					password: [{
+							required: true,
+							message: '请输入密码',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '密码长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					comfirmPass: [{
+							required: true,
+							message: '请输入确认密码',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '确认密码长度不小于5位',
+							trigger: 'blur'
+						}
+					]
+				},
+				form: { // 编辑框的数据绑定
+					id: 0,
 					name: '',
 					number: '',
+					oldPassword: '',
 					password: '',
 					comfirmPass: ''
 				},
-				formLabelWidth: '132px',
-				// 表格数据
-				tableData: [],
+				formRules: {
+					name: [{
+							required: true,
+							message: '请输入昵称',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '昵称长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					number: [{
+							required: true,
+							message: '请输入账号',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '账号长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					oldPassword: [{
+							required: true,
+							message: '请输入原密码',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '原密码长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					password: [{
+							required: true,
+							message: '请输入新密码',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '新密码长度不小于5位',
+							trigger: 'blur'
+						}
+					],
+					comfirmPass: [{
+							required: true,
+							message: '请输入确认新密码',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '确认新密码长度不小于5位',
+							trigger: 'blur'
+						}
+					]
+				},
+				delConfirmPwdform: {
+					delPwd: '' // 被删除的账号的密码
+				},
+				delConfirmPwdRules: {
+					delPwd: [{
+							required: true,
+							message: '请输入密码进行验证',
+							trigger: 'blur'
+						},
+						{
+							min: 5,
+							max: 16,
+							message: '密码长度不小于5位',
+							trigger: 'blur'
+						}
+					]
+				},
+				del_id: 0, // 被删除的id
+				del_account: '', // 被删除的账号
+				account: '', // 需要查找的账号
+				login_account: '', // 登陆的账号
+				adddialogFormVisible: false, // 控制添加对话框显示、隐藏
+				editdialogFormVisible: false, // 控制编辑对话框显示、隐藏
+				delDialogEnterPwdVisible: false, // 控制删除账号时输入密码对话框
+				delDialogVisible: false, // 控制删除对话框显示、隐藏
+				formLabelWidth: '146px', // label宽度
+				tableData: [], // 表格数据
 				current_page: 1, // 当前所在页码
 				page_rows: 8, // 每页显示的记录数
 				total_rows: 0 // 总记录数
@@ -195,6 +347,14 @@
 							// _this.$message.success('数据加载成功！');
 							_this.tableData = res.data.rows
 							_this.total_rows = res.data.total
+
+							for (var i = 0; i < _this.tableData.length; i++) {
+								if (_this.tableData[i].number == _this.login_account) {
+									sessionStorage.setItem('unic', _this.tableData[i].name)
+									break
+								}
+							}
+							_this.$emit('sonFun', _this.tableData[i].name)
 						} else {
 							_this.$message.success('【获取账号数据】暂无数据！');
 						}
@@ -225,52 +385,59 @@
 			/**
 			 * 添加一条账号
 			 */
-			handleAddRow() {
-				// console.log(this.addform);
-				if (!String(this.addform.name).trim()) {
-					this.$message.error('请输入昵称')
-					return
-				}
-				if (!String(this.addform.number).trim()) {
-					this.$message.error('请输入账号')
-					return
-				}
-				if (!String(this.addform.password).trim()) {
-					this.$message.error('请输入密码')
-					return
-				}
-				if (String(this.addform.password).trim() != String(this.addform.comfirmPass).trim()) {
-					this.$message.error('密码与确认密码不一致！')
-					return
-				}
-				var _this = this
-				this.$axios.get('/jxch-smartmp-api/HotWaters/wateraddAdmin.action', {
-						params: {
-							name: String(this.addform.name).trim(),
-							number: String(this.addform.number).trim(),
-							password: String(this.addform.password).trim()
+			handleAddRow(formName) {
+				this.$refs[formName].validate((valid) => {
+					if (valid) {
+						if (!String(this.addform.name).trim()) {
+							this.$message.error('请输入昵称')
+							return
 						}
-					})
-					.then(res => {
-						// console.log(res.data);
-						if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data.msg == '添加成功' && JSON
-							.stringify(res.data) != '{}') {
-							_this.$message.success('【账号添加】成功！');
-							_this.addform.name = ''
-							_this.addform.number = ''
-							_this.addform.password = ''
-							_this.addform.comfirmPass = ''
-							// 更新列表
-							this.updateTable()
-						} else {
-							_this.$message.error('【账号添加】失败！' + res.data.msg);
+						if (!String(this.addform.number).trim()) {
+							this.$message.error('请输入账号')
+							return
 						}
-						this.adddialogFormVisible = false
-					})
-					.catch(err => {
-						// console.log(err);
-						_this.$message.error('【账号添加】请求异常: ' + err);
-					})
+						if (!String(this.addform.password).trim()) {
+							this.$message.error('请输入密码')
+							return
+						}
+						if (String(this.addform.password).trim() != String(this.addform.comfirmPass).trim()) {
+							this.$message.error('密码与确认密码不一致！')
+							return
+						}
+						var _this = this
+						this.$axios.get('/jxch-smartmp-api/HotWaters/wateraddAdmin.action', {
+								params: {
+									name: String(this.addform.name).trim(),
+									number: String(this.addform.number).trim(),
+									password: String(this.addform.password).trim()
+								}
+							})
+							.then(res => {
+								// console.log(res.data);
+								if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data
+									.msg == '添加成功' && JSON
+									.stringify(res.data) != '{}') {
+									_this.$message.success('【账号添加】成功！');
+									_this.addform.name = ''
+									_this.addform.number = ''
+									_this.addform.password = ''
+									_this.addform.comfirmPass = ''
+									// 更新列表
+									this.updateTable()
+								} else {
+									_this.$message.error('【账号添加】失败！' + res.data.msg);
+								}
+								this.adddialogFormVisible = false
+							})
+							.catch(err => {
+								// console.log(err);
+								_this.$message.error('【账号添加】请求异常: ' + err);
+							})
+					} else {
+						// this.$message.error('表单验证失败！')
+						return false;
+					}
+				});
 			},
 			/**
 			 * 编辑对话框
@@ -287,66 +454,77 @@
 				this.form.comfirmPass = ''
 			},
 			/**
-			 * 更新指定的id所在的行
+			 * 编辑更新指定的id所在的行
 			 */
-			handleEditRow() {
-				if (!String(this.form.name).trim()) {
-					this.$message.error('请输入昵称')
-					this.$refs['nicheng'].focus()
-					return
-				}
-				if (!String(this.form.number).trim()) {
-					this.$message.error('请输入账号')
-					this.$refs['zhanghao'].focus()
-					return
-				}
-				if (!String(this.form.oldPassword).trim()) {
-					this.$message.error('请输入原密码')
-					this.$refs['yuanmima'].focus()
-					return
-				}
-				if (!String(this.form.password).trim()) {
-					this.$message.error('请输入新密码')
-					this.$refs['xinmima'].focus()
-					return
-				}
-				if (String(this.form.password).trim() != String(this.form.comfirmPass).trim()) {
-					this.$message.error('新密码和确认新密码不一致！')
-					this.$refs['querenmima'].focus()
-					return
-				}
+			handleEditRow(formName) {
 				var _this = this
-				this.$axios.get('/jxch-smartmp-api/HotWaters/waterupdateAdmin.action', {
-						params: {
-							id: this.form.id,
-							name: String(this.form.name).trim(),
-							number: String(this.form.number).trim(),
-							password: String(this.form.password).trim()
+				_this.$refs[formName].validate((valid) => {
+					if (valid) {
+						if (!String(_this.form.name).trim()) {
+							_this.$message.error('请输入昵称')
+							_this.$refs['nicheng'].focus()
+							return
+						}
+						if (!String(_this.form.number).trim()) {
+							_this.$message.error('请输入账号')
+							_this.$refs['zhanghao'].focus()
+							return
+						}
+						if (!String(_this.form.oldPassword).trim()) {
+							_this.$message.error('请输入原密码')
+							_this.$refs['yuanmima'].focus()
+							return
+						}
+						if (!String(_this.form.password).trim()) {
+							_this.$message.error('请输入新密码')
+							_this.$refs['xinmima'].focus()
+							return
+						}
+						if (String(_this.form.password).trim() != String(_this.form.comfirmPass).trim()) {
+							_this.$message.error('新密码和确认新密码不一致！')
+							_this.$refs['querenmima'].focus()
+							return
 						}
-					})
-					.then(res => {
-						// console.log(res.data);
-						if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data.msg == '更新成功' && JSON
-							.stringify(res.data) != '{}') {
-							_this.$message.success('【账号更新】成功！');
 
-							// 更新表格
-							this.updateTable()
+						_this.$axios.get('/jxch-smartmp-api/HotWaters/waterupdateAdmin.action', {
+								params: {
+									id: _this.form.id,
+									name: String(_this.form.name).trim(),
+									number: String(_this.form.number).trim(),
+									oldpass: String(_this.form.oldPassword).trim(),
+									password: String(_this.form.password).trim()
+								}
+							})
+							.then(res => {
+								// console.log(res.data);
+								if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data
+									.msg == '更新成功' && JSON
+									.stringify(res.data) != '{}') {
+									_this.$message.success('【账号更新】成功！');
 
-							_this.form.id = ''
-							_this.form.name = ''
-							_this.form.number = ''
-							_this.form.password = ''
-							_this.form.comfirmPass = ''
-						} else {
-							_this.$message.error('【账号更新】失败！' + res.data.msg);
-						}
-						this.editdialogFormVisible = false
-					})
-					.catch(err => {
-						// console.log(err);
-						_this.$message.error('【账号更新】请求异常: ' + err);
-					})
+									// 更新表格
+									_this.updateTable()
+
+									_this.form.id = ''
+									_this.form.name = ''
+									_this.form.number = ''
+									_this.form.password = ''
+									_this.form.oldPassword = ''
+									_this.form.comfirmPass = ''
+								} else {
+									_this.$message.error('【账号更新】失败！' + res.data.msg);
+								}
+								_this.editdialogFormVisible = false
+							})
+							.catch(err => {
+								// console.log(err);
+								_this.$message.error('【账号更新】请求异常: ' + err);
+							})
+					} else {
+						// _this.$message.error('表单验证失败！')
+						return false;
+					}
+				});
 			},
 			/**
 			 * 删除对话框
@@ -359,6 +537,48 @@
 				this.del_id = row.id
 			},
 			/**
+			 * 被删除账号的密码
+			 */
+			getDelPwd(formName) {
+				var _this = this
+				_this.$refs[formName].validate((valid) => {
+					if (valid) {
+						if (_this.delConfirmPwdform.delPwd.trim()) {
+							_this.$axios.get('/jxch-smartmp-api/HotWaters/waterdelAdmin.action', {
+									params: {
+										id: _this.del_id,
+										password: _this.delPwd
+									}
+								})
+								.then(res => {
+									// console.log(res.data);
+									if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data
+										.msg == '删除成功' &&
+										JSON
+										.stringify(res.data) != '{}') {
+										_this.$message.success('账号【' + this.del_account + '】删除成功！');
+										_this.delDialogEnterPwdVisible = false
+										_this.delDialogVisible = false
+										_this.updateTable()
+									} else {
+										_this.$message.error('账号【' + this.del_account + '】删除失败！');
+									}
+								})
+								.catch(err => {
+									// console.log(err);
+									_this.$message.error('账号【' + this.del_account + '】删除请求异常: ' + err);
+								})
+						} else {
+							_this.$message.error('请输入账号【' + _this.del_account + '】的密码')
+							_this.$refs['delPwd'].focus()
+						}
+					} else {
+						// _this.$message.error('表单验证失败！')
+						return false;
+					}
+				});
+			},
+			/**
 			 * 删除指定的id所在的行
 			 */
 			handleDelRow() {
@@ -367,27 +587,14 @@
 					this.$message.error('不能删除当前登录账号！')
 					return
 				}
-				var _this = this
-				this.$axios.get('/jxch-smartmp-api/HotWaters/waterdelAdmin.action', {
-						params: {
-							id: this.del_id
-						}
-					})
-					.then(res => {
-						// console.log(res.data);
-						if (typeof(res.data.msg) != 'undefined' && res.data.msg != '' && res.data.msg == '删除成功' && JSON
-							.stringify(res.data) != '{}') {
-							_this.$message.success('【账号删除】成功！');
-							this.updateTable()
-						} else {
-							_this.$message.error('【账号删除】失败！');
-						}
-						this.delDialogVisible = false
-					})
-					.catch(err => {
-						// console.log(err);
-						_this.$message.error('【账号删除】请求异常: ' + err);
-					})
+
+				this.delConfirmPwdform.delPwd = ''
+
+				this.delDialogEnterPwdVisible = true
+
+				setTimeout(() => {
+					this.$refs['delPwd'].focus()
+				}, 200)
 			}
 		}
 	}

src/router/index.js

@@ -2,12 +2,14 @@ import Vue from 'vue'
 import Router from 'vue-router'
 import Login from '@/components/login/Login'
 import Index from '@/components/index/Index'
-import DevMgr from '@/components/dev_mgr/DevMgr'
-import Balance from '@/components/balance/Balance'
-import SJDZ from '@/components/shangjiaduizhang/shangjiaduizhang'
-import YSFX from '@/components/yongshuifenxi/yongshuifenxi'
-import FLSZ from '@/components/feilvset/feilvset'
-import ZHGL from '@/components/zhuanghaoguanli/zhuanghaoguanli'
+import DevMgr from '@/components/dev_mgr/DevMgr' // 设备管理
+import Balance from '@/components/balance/Balance'  // 余额管理
+import SJDZ from '@/components/shangjiaduizhang/shangjiaduizhang' // 商家对账
+import YSFX from '@/components/yongshuifenxi/yongshuifenxi'  // 用水分析
+import FLSZ from '@/components/feilvset/feilvset' // 费率设置
+import YSYC from '@/components/zhuanghaoguanli/zhuanghaoguanli' // 用水异常
+import ZFYC from '@/components/zhuanghaoguanli/zhuanghaoguanli' // 支付异常
+import ZHGL from '@/components/zhuanghaoguanli/zhuanghaoguanli' // 账户管理
 
 Vue.use(Router)
 
@@ -26,27 +28,35 @@ export default new Router({
 		children: [{
 			path: 'devmgr',
 			name: 'DevMgr',
-			component: DevMgr
+			component: DevMgr // 设备管理
 		}, {
 			path: 'balan',
 			name: 'Balance',
-			component: Balance
+			component: Balance // 余额管理
 		}, {
 			path: 'sjdz',
 			name: 'SJDZ',
-			component: SJDZ
+			component: SJDZ // 商家对账
 		}, {
 			path: 'ysfx',
 			name: 'YSFX',
-			component: YSFX
+			component: YSFX // 用水分析
 		}, {
 			path: 'flsz',
 			name: 'FLSZ',
-			component: FLSZ
+			component: FLSZ // 费率设置
+		}, {
+			path: 'ysyc',
+			name: 'YSYC',
+			component: YSYC // 用水异常
+		}, {
+			path: 'zfyc',
+			name: 'ZFYC',
+			component: ZFYC // 支付异常
 		}, {
 			path: 'zhgl',
 			name: 'ZHGL',
-			component: ZHGL
+			component: ZHGL // 账户管理
 		}]
 	}]
 })