增加备注,二维码功能

public/static/css/common.css

@@ -95,5 +95,9 @@ body {
 }
 
 .red {
-    color: #e54d42;
+    color: #F56C6C;
+}
+
+.warning {
+    color: #E6A23C;
 }

src/static/js/global.js

@@ -2,63 +2,69 @@ const server = "http://lq.ailishi.org:4032/bms/api/operate/";
 // const server = "http://localhost:8081/bms/api/operate/";
 
 const URL = {
-	//登录
-	login: server + "admin/login.do",
-	//注销
-	logout: server + "admin/logout.do",
-	//验证token
-	verify: server + "admin/verify.do",
+    //登录
+    login: server + "admin/login.do",
+    //注销
+    logout: server + "admin/logout.do",
+    //验证token
+    verify: server + "admin/verify.do",
 
-	//用户
-	users: {
-		//列表
-		listPage: server + "user/listPage.do",
-		//管理员权限
-		adminAccess: server + "user/adminAccess.do",
-		//获取某用户没有权限的设备组
-		getNoAccessGroups: server + "user/getNoAccessGroups.do",
-		//保存设备组权限
-		saveGroupAccess: server + "user/saveGroupAccess.do",
-	},
-	//路牌
-	lp: {
-		//分页列表
-		listPage: server + "device/lp/listPage.do",
-		//分布图-列表
-		listAll: server + "device/lp/listAll.do",
-		//设备详情
-		detail: server + "device/lp/detail.do",
-	},
-	//普适型
-	ubi: {
-		//分页列表
-		listPage: server + "device/ubi/listPage.do",
-		//设备详情
-		detail: server + "device/ubi/detail.do",
-	},
-	//mqtt日志
-	logs: {
-		//列表
-		listPage: server + "logs/listPage.do",
-		//全部指令
-		instructions: server + "logs/instruction.do",
-	},
-	//设备组管理
-	group: {
-		//列表
-		listPage: server + "group/listPage.do",
-		//增
-		save: server + "group/save.do",
-		//查询全部设备组
-		listAll: server + "group/listAll.do",
-		//更新
-		update: server + "group/update.do",
-	},
+    //用户
+    users: {
+        //列表
+        listPage: server + "user/listPage.do",
+        //管理员权限
+        adminAccess: server + "user/adminAccess.do",
+        //获取某用户没有权限的设备组
+        getNoAccessGroups: server + "user/getNoAccessGroups.do",
+        //保存设备组权限
+        saveGroupAccess: server + "user/saveGroupAccess.do",
+        //备注
+        updateRemark: server + "user/remark.do",
+    },
+    //设备基础信息
+    deviceBase: {
+        updateRemark: server + "device/base/remark.do",
+    },
+    //路牌
+    lp: {
+        //分页列表
+        listPage: server + "device/lp/listPage.do",
+        //分布图-列表
+        listAll: server + "device/lp/listAll.do",
+        //设备详情
+        detail: server + "device/lp/detail.do",
+    },
+    //普适型
+    ubi: {
+        //分页列表
+        listPage: server + "device/ubi/listPage.do",
+        //设备详情
+        detail: server + "device/ubi/detail.do",
+    },
+    //mqtt日志
+    logs: {
+        //列表
+        listPage: server + "logs/listPage.do",
+        //全部指令
+        instructions: server + "logs/instruction.do",
+    },
+    //设备组管理
+    group: {
+        //列表
+        listPage: server + "group/listPage.do",
+        //增
+        save: server + "group/save.do",
+        //查询全部设备组
+        listAll: server + "group/listAll.do",
+        //更新
+        update: server + "group/update.do",
+    },
 
-	//webSocket 地址
-	webSocket: "wss://www.mang406.top/webSocket/",
+    //webSocket 地址
+    webSocket: "wss://www.mang406.top/webSocket/",
 };
 
 export default {
-	URL
+    URL
 };

src/views/devices/ubi.vue

@@ -1,154 +1,217 @@
 <template>
-	<div class="zy-template">
-		<div class="zy-main-title">设备列表-普适型</div>
-		<div class="zy-module">
-			<el-form ref="form" :model="query" label-width="60px">
-				<el-form-item label="设备码:" class="zy-search-form-item">
-					<el-input v-model="query.openNum" size="mini" clearable></el-input>
-				</el-form-item>
-				<el-form-item label="设备组:" class="zy-search-form-item">
-					<el-select v-model="query.groupId" filterable clearable placeholder=" " size="mini">
-						<el-option v-for="item in groups" :key="item" :value="item" />
-					</el-select>
-				</el-form-item>
-				<el-button type="primary" size="mini" @click="submit">查询</el-button>
-			</el-form>
-		</div>
+    <div class="zy-template">
+        <div class="zy-main-title">设备列表-普适型</div>
+        <div class="zy-module">
+            <el-form ref="form" :model="query" label-width="60px">
+                <el-form-item label="设备码:" class="zy-search-form-item">
+                    <el-input v-model="query.openNum" size="mini" clearable></el-input>
+                </el-form-item>
+                <el-form-item label="设备组:" class="zy-search-form-item">
+                    <el-select v-model="query.groupId" filterable clearable placeholder=" " size="mini">
+                        <el-option v-for="item in groups" :key="item" :value="item"/>
+                    </el-select>
+                </el-form-item>
+                <el-button type="primary" size="mini" @click="submit">查询</el-button>
+            </el-form>
+        </div>
 
-		<div class="zy-module">
-			<el-table :data="page.records" header-cell-class-name="zy-table-header-cell" cell-class-name='zy-table-cell'
-				stripe>
-				<el-table-column prop="openNum" label="设备码" min-width="180">
-					<template #default="scope">IMEI{{scope.row.openNum}}</template>
-				</el-table-column>
-				<el-table-column prop="groupId" label="设备组" min-width="120" />
-				<el-table-column prop="createTime" label="创建时间" min-width="180" />
-				<el-table-column prop="freq" label="上传频率(秒)" min-width="120" />
-				<el-table-column prop="powerVolt" label="电池电压" min-width="100" />
-				<el-table-column prop="signal4g" label="4G信号" min-width="80" />
-				<el-table-column prop="oemType" label="板卡类型" min-width="100" />
-				<el-table-column prop="version" label="软件版本号" min-width="100" />
-				<el-table-column prop="lon" label="经度" min-width="120" />
-				<el-table-column prop="lat" label="纬度" min-width="120" />
-				<el-table-column prop="satNum" label="卫星颗数" min-width="80" />
-				<el-table-column label="状态" min-width="100">
-					<template #default="scope">
-						<el-tag type="success" v-if="scope.row.status===1" size="small">在线</el-tag>
-						<el-tag type="danger" v-if="scope.row.status===0" size="small">离线</el-tag>
-					</template>
-				</el-table-column>
-				<el-table-column prop="updateTime" label="最近通讯时间" min-width="180" />
-<!--				<el-table-column label="操作" min-width="80">-->
-<!--					<template #default="scope">-->
-<!--						<el-button @click="detailHandler(scope.row.openNum)" type="text" size="small">详情</el-button>-->
-<!--					</template>-->
-<!--				</el-table-column>-->
-			</el-table>
-			<el-pagination class="zy-table-pagination" background layout="prev, pager, next"
-				:current-page="page.current" :total="page.total" :page-size="page.size" @current-change="pagination" />
-		</div>
+        <div class="zy-module">
+            <el-table :data="page.records" header-cell-class-name="zy-table-header-cell" cell-class-name='zy-table-cell'
+                      stripe>
+                <el-table-column prop="openNum" label="设备码" min-width="180">
+                    <template #default="scope">IMEI{{scope.row.openNum}}</template>
+                </el-table-column>
+                <el-table-column prop="groupId" label="设备组" min-width="120"/>
+                <el-table-column label="状态" min-width="100">
+                    <template #default="scope">
+                        <el-tag type="success" v-if="scope.row.status===1" size="small">在线</el-tag>
+                        <el-tag type="danger" v-if="scope.row.status===0" size="small">离线</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="设备二维码" min-width="120">
+                    <el-popover placement="right" :width="200" trigger="click">
+                        <template #reference>
+                            <el-button type="text">点击查看</el-button>
+                        </template>
+                        <img src="http://lq.ailishi.org:4032/chenyi/static/bg.59f1ed01.png" alt="二维码" width="200"
+                             height="200">
+                    </el-popover>
+                </el-table-column>
+                <el-table-column label="电池电压" min-width="80">
+                    <template #default="scope">
+                        {{scope.row.powerVolt==null?'':scope.row.powerVolt.toFixed(2)}}
+                        <el-tooltip effect="dark" content="电压低于10V" placement="right-start"
+                                    v-if="scope.row.powerVolt!=null && scope.row.powerVolt.toFixed(2)<10">
+                            <i class="el-icon-warning warning"/>
+                        </el-tooltip>
+                    </template>
+                </el-table-column>
+                <el-table-column label="4G信号" min-width="80">
+                    <template #default="scope">
+                        {{scope.row.signal4g}}
+                        <el-tooltip effect="dark" content="信号值低于18" placement="right-start"
+                                    v-if="scope.row.signal4g != null && scope.row.signal4g!==''&& parseInt(scope.row.signal4g)<18">
+                            <i class="el-icon-warning warning"/>
+                        </el-tooltip>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="oemType" label="板卡类型" min-width="100"/>
+                <el-table-column prop="version" label="软件版本号" min-width="100"/>
+                <el-table-column prop="lon" label="经度" min-width="120"/>
+                <el-table-column prop="lat" label="纬度" min-width="120"/>
+                <el-table-column prop="satNum" label="卫星颗数" min-width="80"/>
+                <el-table-column prop="sim" label="卡号" min-width="120"/>
+                <el-table-column prop="freq" label="上传频率(秒)" min-width="120"/>
+                <el-table-column prop="updateTime" label="最近通讯时间" min-width="180"/>
+                <el-table-column prop="createTime" label="创建时间" min-width="180"/>
+                <el-table-column prop="remark" label="备注" min-width="240"/>
+                <el-table-column label="操作" min-width="80">
+                    <template #default="scope">
+                        <el-button @click="editRemark(scope.row)" type="text" size="small">备注</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <el-pagination class="zy-table-pagination" background layout="prev, pager, next"
+                           :current-page="page.current" :total="page.total" :page-size="page.size"
+                           @current-change="pagination"/>
+        </div>
 
-		<el-dialog title="设备详情" v-model="detailDialog" width="500px">
-			<el-descriptions :column="2" border>
-				<el-descriptions-item label="设备码:">{{detail.openNum}}</el-descriptions-item>
-				<el-descriptions-item label="定位模式:">{{detail.mode==1?'GPS':'基站'}}</el-descriptions-item>
-			</el-descriptions>
-		</el-dialog>
+        <el-dialog title="设备详情" v-model="detailDialog" width="500px">
+            <el-descriptions :column="2" border>
+                <el-descriptions-item label="设备码:">{{detail.openNum}}</el-descriptions-item>
+                <el-descriptions-item label="定位模式:">{{detail.mode==1?'GPS':'基站'}}</el-descriptions-item>
+            </el-descriptions>
+        </el-dialog>
 
-	</div>
+        <el-dialog title="编辑" v-model="updateDialog" width="500px">
+            <el-form ref="updateForm" :model="updateForm" label-width="100px" :rules="rules">
+                <el-form-item label="备注:">
+                    <el-input type="textarea" v-model="updateForm.remark" maxlength="100"></el-input>
+                </el-form-item>
+            </el-form>
+            <template #footer>
+				<span class="dialog-footer">
+					<el-button @click="updateDialog = false">取 消</el-button>
+					<el-button type="primary" @click="updateSubmit('updateForm')">提 交</el-button>
+				</span>
+            </template>
+        </el-dialog>
+
+    </div>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				query: {
-					openNum: "",
-					type: null,
-				},
-				page: {
-					current: 1,
-					size: 20,
-				},
-				groups: [], //设备组
-				detailDialog: false, //详情弹出框
-				detail: {}, //设备详情
-			};
-		},
-		mounted() {
-			this.getDevicesList();
-			this.getGroupList();
-		},
-		methods: {
-			/**
-			 * 提交查询条件
-			 */
-			submit: function() {
-				const param = {
-					current: 1,
-					size: this.page.size,
-					groupId: this.query.groupId,
-					openNum: this.query.openNum,
-				};
-				this.getDevicesList(param);
-			},
-			/**
-			 * 分页点击事件
-			 */
-			pagination: function(current) {
-				const param = {
-					current: current,
-					size: this.page.size,
-					groupId: this.query.groupId,
-					openNum: this.query.openNum,
-				};
-				this.getDevicesList(param);
-			},
+    export default {
+        data() {
+            return {
+                query: {
+                    openNum: "",
+                    type: null,
+                },
+                page: {
+                    current: 1,
+                    size: 20,
+                },
+                groups: [], //设备组
+                detailDialog: false, //详情弹出框
+                updateDialog: false, //更新表单
+                updateForm: {}, //更新表单
+                detail: {}, //设备详情
+            };
+        },
+        mounted() {
+            this.getListPage();
+            this.getGroupList();
+        },
+        methods: {
+            /**
+             * 提交查询条件
+             */
+            submit: function () {
+                const param = {
+                    current: 1,
+                    size: this.page.size,
+                    groupId: this.query.groupId,
+                    openNum: this.query.openNum,
+                };
+                this.getListPage(param);
+            },
+
+            /**
+             * 分页点击事件
+             */
+            pagination: function (current) {
+                const param = {
+                    current: current,
+                    size: this.page.size,
+                    groupId: this.query.groupId,
+                    openNum: this.query.openNum,
+                };
+                this.getListPage(param);
+            },
+
+            /**
+             * 编辑备注
+             */
+            editRemark: function (obj) {
+                this.updateForm = {
+                    openNum: obj.openNum,
+                    remark: obj.remark
+                };
+                this.updateDialog = true;
+            },
 
-			/**
-			 * 查看详情
-			 */
-			detailHandler: function(openNum) {
-				this.detailDialog = true;
-				this.getDeviceDetail(openNum);
-			},
+            /**
+             * 获取设备列表
+             */
+            getListPage: function (params) {
+                this.$http.Get(this.$global.ubi.listPage, params).then(res => {
+                    this.page = res.data;
+                })
+            },
 
-			/**
-			 * 获取设备列表
-			 */
-			getDevicesList: function(params) {
-				this.$http.Get(this.$global.ubi.listPage, params).then(res => {
-					this.page = res.data;
-				})
-			},
+            /**
+             * 提交更新表单
+             */
+            updateSubmit: function (formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (!valid) return false;
+                    //提交表单
+                    this.$http.Post(this.$global.deviceBase.updateRemark, this.updateForm).then(res => {
+                        this.$message.success("修改成功!");
+                        this.refresh();
+                    })
+                });
+            },
 
-			/**
-			 * 获取设备详情
-			 */
-			getDeviceDetail: function(openNum) {
-				const params = {
-					openNum: openNum
-				};
-				this.$http.Get(this.$global.ubi.detail, params).then(res => {
-					console.log(res.data);
-					this.detail = res.data;
-				})
-			},
+            /**
+             * 获取设备组
+             */
+            getGroupList() {
+                this.$http.Get(this.$global.group.listAll, {}).then(res => {
+                    const arr = [];
+                    this.groups = res.data.forEach(item => {
+                        if (item.type == 'gnss') {
+                            arr.push(item.code)
+                        }
+                    });
+                    this.groups = arr;
+                })
+            },
 
-			/**
-			 * 获取设备组
-			 */
-			getGroupList() {
-				this.$http.Get(this.$global.group.listAll, {}).then(res => {
-					const arr = [];
-					this.groups = res.data.forEach(item => {
-						if (item.type == 'gnss') {
-							arr.push(item.code)
-						}
-					});
-					this.groups = arr;
-				})
-			}
-		}
-	};
+            /**
+             * 刷新列表
+             */
+            refresh: function () {
+                this.updateDialog = false;
+                const params = {
+                    current: this.page.current,
+                    size: this.page.size,
+                    groupId: this.query.groupId,
+                    openNum: this.query.openNum,
+                };
+                this.getListPage(params);
+            }
+        }
+    };
 </script>

src/views/system/group.vue

@@ -130,7 +130,7 @@
 				}
 			};
 		},
-		mounted: function() {
+		mounted() {
 			this.getListPage(this.page);
 		},
 		methods: {

src/views/system/users.vue

@@ -1,197 +1,241 @@
 <template>
-	<div class="zy-template">
-		<div class="zy-main-title">用户管理</div>
-		<div class="zy-module">
-			<el-form ref="form" :model="query" label-width="60px">
-				<el-form-item label="关键字:" class="zy-search-form-item">
-					<el-input v-model="query.key" size="mini" placeholder="用户名/昵称/手机号/随机码"></el-input>
-				</el-form-item>
-				<el-button type="primary" size="mini" @click="submit">查询</el-button>
-			</el-form>
-		</div>
-
-		<div class="zy-module">
-			<el-table :data="page.records" stripe header-cell-class-name="zy-table-header-cell"
-				cell-class-name='zy-table-cell'>
-				<el-table-column prop="openId" label="微信open-id" width="300" />
-				<el-table-column prop="randomCode" label="随机码" width="180" />
-				<el-table-column label="管理员权限" width="120">
-					<template #default="scope">
-						<el-tag type="success" v-if="scope.row.admin===1">是</el-tag>
-						<el-tag v-if="scope.row.admin===0">否</el-tag>
-					</template>
-				</el-table-column>
-				<el-table-column prop="createTime" label="注册时间" min-width="10%" />
-				<el-table-column label="操作" width="200" min-width="10%">
-					<template #default="scope">
-						<el-button @click="setGroups(scope.row.id)" type="text" size="small">配置设备组</el-button>
-						<el-button @click="setAdmin(scope.row)" type="text" size="small"
-							:class="scope.row.admin===0?'':'red'">
-							{{scope.row.admin===0?'设为管理员':'取消管理员'}}
-						</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-
-			<el-pagination class="zy-table-pagination" background layout="prev, pager, next" :total="page.total"
-				:page-size="page.size" @current-change="pagination" :current-page="page.current" />
-		</div>
-
-		<el-dialog title="配置权限" v-model="groupDialog" width="500px">
-			<el-form label-width="100px">
-				<el-form-item label="配置组:">
-					<el-tree :data="groupList" show-checkbox node-key="code" ref="tree" highlight-current
-						:props="defaultProps" accordion>
-					</el-tree>
-				</el-form-item>
-			</el-form>
-			<template #footer>
+    <div class="zy-template">
+        <div class="zy-main-title">用户管理</div>
+        <div class="zy-module">
+            <el-form ref="form" :model="query" label-width="60px">
+                <el-form-item label="关键字:" class="zy-search-form-item">
+                    <el-input v-model="query.key" size="mini" placeholder="用户名/昵称/手机号/随机码"></el-input>
+                </el-form-item>
+                <el-button type="primary" size="mini" @click="submit">查询</el-button>
+            </el-form>
+        </div>
+
+        <div class="zy-module">
+            <el-table :data="page.records" stripe header-cell-class-name="zy-table-header-cell"
+                      cell-class-name='zy-table-cell'>
+                <!--<el-table-column prop="openId" label="微信open-id" width="300" />-->
+                <el-table-column prop="randomCode" label="随机码" min-width="120"/>
+                <el-table-column label="管理员权限" min-width="80">
+                    <template #default="scope">
+                        <el-tag type="success" v-if="scope.row.admin===1" size="small">是</el-tag>
+                        <el-tag v-if="scope.row.admin===0" size="small">否</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="createTime" label="注册时间" min-width="180"/>
+                <el-table-column prop="remark" label="备注" min-width="250"/>
+                <el-table-column label="操作" min-width="150">
+                    <template #default="scope">
+                        <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
+                        <el-button @click="setGroups(scope.row.id)" type="text" size="small">配置设备组</el-button>
+                        <el-button @click="setAdmin(scope.row)" type="text" size="small"
+                                   :class="scope.row.admin===0?'':'red'">
+                            {{scope.row.admin===0?'设为管理员':'取消管理员'}}
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+
+            <el-pagination class="zy-table-pagination" background layout="prev, pager, next" :total="page.total"
+                           :page-size="page.size" @current-change="pagination" :current-page="page.current"/>
+        </div>
+
+        <el-dialog title="配置权限" v-model="groupDialog" width="500px">
+            <el-form label-width="100px">
+                <el-form-item label="配置组:">
+                    <el-tree :data="groupList" show-checkbox node-key="code" ref="tree" highlight-current
+                             :props="defaultProps" accordion>
+                    </el-tree>
+                </el-form-item>
+            </el-form>
+            <template #footer>
 				<span class="dialog-footer">
 					<el-button @click="groupDialog = false" size="small">取 消</el-button>
 					<el-button type="success" @click="setGroupSubmit" size="small">提 交</el-button>
 				</span>
-			</template>
-		</el-dialog>
-	</div>
+            </template>
+        </el-dialog>
+
+        <el-dialog title="编辑" v-model="updateDialog" width="500px">
+            <el-form ref="updateForm" :model="updateForm" label-width="100px" :rules="rules">
+                <el-form-item label="备注:">
+                    <el-input type="textarea" v-model="updateForm.remark" maxlength="100"></el-input>
+                </el-form-item>
+            </el-form>
+            <template #footer>
+				<span class="dialog-footer">
+					<el-button @click="updateDialog = false">取 消</el-button>
+					<el-button type="primary" @click="updateSubmit('updateForm')">提 交</el-button>
+				</span>
+            </template>
+        </el-dialog>
+
+    </div>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				query: {
-					key: ''
-				},
-				page: {
-					current: 1,
-					size: 20,
-				},
-				defaultProps: {
-					children: 'children',
-					label: 'name'
-				},
-				groupDialog: false, //配置设备组权限弹出框
-				selUserId: null, //选中的用户的ID
-				groupList: null, //设备组权限列表
-			};
-		},
-		mounted() {
-			this.getUserList(this.page);
-		},
-		methods: {
-
-			/**
-			 * 提交查询条件
-			 */
-			submit: function() {
-				const param = {
-					key: this.query.key
-				};
-				this.getUserList(param);
-			},
-
-			/**
-			 * 分页点击事件
-			 */
-			pagination: function(current) {
-				const param = {
-					key: this.query.key,
-					current: current,
-					size: this.page.size,
-				};
-				this.getUserList(param);
-			},
-
-			/**
-			 * 获取用户列表
-			 */
-			getUserList: function(params) {
-				const that = this;
-				this.$http.Get(this.$global.users.listPage, params).then(res => {
-					that.page = res.data;
-				})
-			},
-
-			/**
-			 * 设置设备组权限
-			 */
-			setGroups: function(id) {
-				this.groupDialog = true;
-				this.selUserId = id;
-				this.getGroupList(id);
-			},
-
-			/**
-			 * 设置管理员权限
-			 */
-			setAdmin: function(obj) {
-				const param = {
-					userId: obj.id,
-					admin: obj.admin == 1 ? 0 : 1
-				}
-				this.$http.Post(this.$global.users.adminAccess, param).then(res => {
-					this.$message.success("设置成功!");
-					this.refresh();
-				})
-			},
-
-			/**
-			 * 获取权限列表
-			 */
-			getGroupList: function(userId) {
-				const param = {
-					userId: userId
-				}
-				this.$http.Get(this.$global.users.getNoAccessGroups, param).then(res => {
-					const arr = [];
-					for (let key in res.data) {
-						arr.push({
-							name: key,
-							children: res.data[key]
-						})
-					}
-					console.log(arr);
-					this.groupList = arr;
-				})
-			},
-
-			/**
-			 * 提交设备组权限配置
-			 */
-			setGroupSubmit: function() {
-				const arr = this.$refs.tree.getCheckedKeys(true);
-				console.log(arr)
-				if (arr == null || arr.length <= 0) {
-					this.$message.error("至少配置一个组!");
-					return;
-				}
-				let groups = "";
-				arr.forEach(item => {
-					groups += (item + ",")
-				})
-				groups = groups.substr(0, groups.length - 1)
-				const params = {
-					userId: this.selUserId,
-					groups: groups
-				}
-				this.$http.Post(this.$global.users.saveGroupAccess, params).then(res => {
-					this.$message.success("配置成功!");
-					this.groupDialog = false;
-				})
-			},
-
-			/**
-			 * 刷新列表
-			 */
-			refresh: function() {
-				const params = {
-					key: this.query.key,
-					current: this.page.current,
-					size: this.page.size,
-				}
-				this.getUserList(params);
-			},
-
-		}
-	};
+    export default {
+        data() {
+            return {
+                query: {
+                    key: ''
+                },
+                page: {
+                    current: 1,
+                    size: 20,
+                },
+                defaultProps: {
+                    children: 'children',
+                    label: 'name'
+                },
+                groupDialog: false, //配置设备组权限弹出框
+                updateDialog: false, //更新表单
+                updateForm: {}, //更新表单
+                selUserId: null, //选中的用户的ID
+                groupList: null, //设备组权限列表
+            };
+        },
+        mounted() {
+            this.getUserList(this.page);
+        },
+        methods: {
+
+            /**
+             * 提交查询条件
+             */
+            submit: function () {
+                const param = {
+                    key: this.query.key
+                };
+                this.getUserList(param);
+            },
+
+            /**
+             * 分页点击事件
+             */
+            pagination: function (current) {
+                const param = {
+                    key: this.query.key,
+                    current: current,
+                    size: this.page.size,
+                };
+                this.getUserList(param);
+            },
+
+            /**
+             * 获取用户列表
+             */
+            getUserList: function (params) {
+                const that = this;
+                this.$http.Get(this.$global.users.listPage, params).then(res => {
+                    that.page = res.data;
+                })
+            },
+
+            /**
+             * 设置设备组权限
+             */
+            setGroups: function (id) {
+                this.groupDialog = true;
+                this.selUserId = id;
+                this.getGroupList(id);
+            },
+
+            /**
+             * 设置管理员权限
+             */
+            setAdmin: function (obj) {
+                const param = {
+                    userId: obj.id,
+                    admin: obj.admin == 1 ? 0 : 1
+                };
+                this.$http.Post(this.$global.users.adminAccess, param).then(res => {
+                    this.$message.success("设置成功!");
+                    this.refresh();
+                })
+            },
+
+            /**
+             * 获取权限列表
+             */
+            getGroupList: function (userId) {
+                const param = {
+                    userId: userId
+                };
+                this.$http.Get(this.$global.users.getNoAccessGroups, param).then(res => {
+                    const arr = [];
+                    for (let key in res.data) {
+                        arr.push({
+                            name: key,
+                            children: res.data[key]
+                        })
+                    }
+                    console.log(arr);
+                    this.groupList = arr;
+                })
+            },
+
+            /**
+             * 提交设备组权限配置
+             */
+            setGroupSubmit: function () {
+                const arr = this.$refs.tree.getCheckedKeys(true);
+                if (arr == null || arr.length <= 0) {
+                    this.$message.error("至少配置一个组!");
+                    return;
+                }
+                let groups = "";
+                arr.forEach(item => {
+                    groups += (item + ",")
+                });
+                groups = groups.substr(0, groups.length - 1);
+                const params = {
+                    userId: this.selUserId,
+                    groups: groups
+                };
+                this.$http.Post(this.$global.users.saveGroupAccess, params).then(res => {
+                    this.$message.success("配置成功!");
+                    this.groupDialog = false;
+                })
+            },
+
+            /**
+             * 编辑
+             */
+            edit: function (obj) {
+                this.updateForm = {
+                    id: obj.id,
+                    remark: obj.remark
+                };
+                this.updateDialog = true;
+            },
+
+            /**
+             * 提交更新表单
+             */
+            updateSubmit: function (formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (!valid) return false;
+                    //提交表单
+                    this.$http.Post(this.$global.users.updateRemark, this.updateForm).then(res => {
+                        this.$message.success("修改成功!");
+                        this.refresh();
+                    })
+                });
+            },
+
+            /**
+             * 刷新列表
+             */
+            refresh: function () {
+                this.updateDialog = false;
+                const params = {
+                    key: this.query.key,
+                    current: this.page.current,
+                    size: this.page.size,
+                };
+                this.getUserList(params);
+            },
+
+        }
+    };
 </script>