门禁系统

accessControlSystem/src/components/common/organTree.vue

@@ -144,10 +144,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import '@assets/css/public-style.scss';
 .organ-tree {
-    width: 260px;
+    width: rem(260);
     background: #ffffff;
-    padding: 20px;
+    padding: rem(20);
     box-sizing: border-box;
     float: left;
     height: 100%;
@@ -156,8 +157,8 @@ export default {
         clear: both;
     }
     .tree-style-box {
-        margin-top: 20px;
-        max-height: calc(100vh - 200px);
+        margin-top: rem(20);
+        max-height: calc(100vh - #{rem(200)});
         overflow: scroll;
     }
     /deep/ .el-tree-node {

accessControlSystem/src/views/deviceManagement/indoorUnit/index.vue

@@ -15,8 +15,8 @@
                 >
 
                 <div class="search-icon">
-                    <el-tooltip class="item" effect="light" placement="bottom" content="删除">
-                        <i class="zoniot_font zoniot-icon-shanchu2" @click="deleteCard()"></i>
+                    <el-tooltip class="item" effect="light" placement="bottom" content="解除绑定">
+                        <i class="zoniot_font zoniot-icon-shanchu2" @click="deleteList()"></i>
                     </el-tooltip>
                 </div>
             </div>
@@ -31,8 +31,8 @@
             >
                 <template slot-scope="scope" slot="opt">
                     <div class="opt">
-                        <el-tooltip class="item" effect="light" placement="bottom" content="临时密码">
-                            <i class="zoniot_font zoniot-icon-linshimima" @click="temporaryPasswordCard(scope.row)"></i>
+                        <el-tooltip class="item" effect="light" placement="bottom" content="解绑">
+                            <i class="zoniot_font zoniot-icon-shanchu1 redText" @click="deleteList(scope.row)"></i>
                         </el-tooltip>
                     </div>
                 </template>
@@ -106,11 +106,34 @@ export default {
 
                 .catch(function () {});
         },
-        addCard() {},
-        restartCard() {},
-        remoteDoorOpeningCard() {},
-        deleteCard() {},
-        lookAccessControl(row) {}
+        deleteList(row) {
+            //获取选中列表的ids
+            let ids = [];
+            if (!this.selectRow.length) {
+                this.$message.error('您尚未选择，请选择后再操作');
+                return;
+            }
+            this.selectRow.forEach((v) => {
+                ids.push(v.id);
+            });
+
+            return;
+            this.$msgBox(`删除确认`, '门禁设备删除后，人员将无法正常开启门禁')
+                .then(() => {
+                    this.$http.post('/sc-gate-web/gate/delete', { ids: ids }).then(({ status, data, msg }) => {
+                        if (0 === status) {
+                            this.$message({
+                                type: 'success',
+                                message: '删除成功!'
+                            });
+                            this.mixins_search();
+                        } else {
+                            this.$message.error(msg);
+                        }
+                    });
+                })
+                .catch(() => {});
+        }
     },
     watch: {
         currentId(newValue, oldValue) {

accessControlSystem/src/views/deviceManagement/propertyManagementMachine/index.vue

@@ -21,25 +21,26 @@
                 >
                 <div class="search-icon">
                     <el-tooltip class="item" effect="light" placement="bottom" content="添加">
-                        <i class="zoniot_font zoniot-icon-tianjia2" @click="addCard()"></i>
+                        <i class="zoniot_font zoniot-icon-tianjia2" @click="addList()"></i>
                     </el-tooltip>
                     <el-tooltip class="item" effect="light" placement="bottom" content="删除">
-                        <i class="zoniot_font zoniot-icon-shanchu2" @click="deleteCard()"></i>
+                        <i class="zoniot_font zoniot-icon-shanchu2" @click="deleteList()"></i>
                     </el-tooltip>
                 </div>
             </div>
             <zz-table
-                :settings="{ showIndex: true, stripe: true }"
+                :settings="{ showCheckbox: true, stripe: true }"
                 :cols="cols"
                 :loading="mixins_onQuery"
                 :data="mixins_list"
                 :pageset="mixins_pageset"
                 @page-change="pageChange"
+                @selection-change="selectionChange"
             >
                 <template slot-scope="scope" slot="opt">
                     <div class="opt">
                         <el-tooltip class="item" effect="light" placement="bottom" content="删除">
-                            <i class="zoniot_font zoniot-icon-shanchu1 redText" @click="lookPage(scope.row)"></i>
+                            <i class="zoniot_font zoniot-icon-shanchu1 redText" @click="deleteList(scope.row)"></i>
                         </el-tooltip>
                     </div>
                 </template>
@@ -92,6 +93,7 @@ export default {
                     width: 150
                 }
             ],
+            selectRow: [],
             mixins_post: 'get'
         };
     },
@@ -99,6 +101,9 @@ export default {
         currentOrganId(data) {
             this.currentId = data.id || '';
         },
+        selectionChange(val) {
+            this.selectRow = val;
+        },
         timeToggle(e) {
             let start = '00:00:00',
                 end = '23:59:59';
@@ -109,6 +114,49 @@ export default {
                 this.mixins_query.startTime = ``;
                 this.mixins_query.endTime = ``;
             }
+        },
+        addList() {
+            new Promise((resolve) => {
+                this.$store.dispatch('addPopup', {
+                    url: '/deviceManagement/propertyManagementMachine/popups/add.vue',
+                    width: '548px',
+                    height: '400px',
+                    props: {
+                        callback: resolve
+                    },
+                    hideStar: false,
+                    title: '添加物管机'
+                });
+            }).then(() => {
+                this.mixins_search();
+            });
+        },
+        deleteList() {
+            //获取选中列表的ids
+            let ids = [];
+            if (!this.selectRow.length) {
+                this.$message.error('您尚未选择，请选择后再操作');
+                return;
+            }
+            this.selectRow.forEach((v) => {
+                ids.push(v.id);
+            });
+
+            this.$msgBox(`删除确认`, '门禁设备删除后，人员将无法正常开启门禁')
+                .then(() => {
+                    this.$http.post('/sc-gate-web/gate/delete', { ids: ids }).then(({ status, data, msg }) => {
+                        if (0 === status) {
+                            this.$message({
+                                type: 'success',
+                                message: '删除成功!'
+                            });
+                            this.mixins_search();
+                        } else {
+                            this.$message.error(msg);
+                        }
+                    });
+                })
+                .catch(() => {});
         }
     },
 

accessControlSystem/src/views/deviceManagement/propertyManagementMachine/popups/add.vue

@@ -0,0 +1,106 @@
+<template >
+    <div class="addAccess">
+        <el-form ref="form" :model="formData" :rules="formRules" label-width="110px">
+            <el-form-item label="所属社区" prop="communityId">
+                <el-select v-model="formData.communityId" placeholder="选择社区" clearable @change="buildingNameList(formData.communityId)">
+                    <el-option v-for="(item, index) in communityArr" :key="index" :label="item.communityName" :value="item.id"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="设备类型" prop="deviceType">
+                <el-cascader
+                    v-model="formData.deviceType"
+                    :options="productOptions"
+                    :props="defaultProps"
+                    clearable
+                    placeholder="设备类型"
+                ></el-cascader>
+            </el-form-item>
+            <el-form-item label="设备编号" prop="deviceNo">
+                <el-input type="text" maxlength="100" placeholder="请输入设备编号" v-model="formData.deviceNo"></el-input>
+            </el-form-item>
+            <el-form-item label="设备名称" prop="deviceName">
+                <el-input type="text" maxlength="100" placeholder="请输入设备名称" v-model="formData.deviceName"></el-input>
+            </el-form-item>
+            <el-form-item label="设备地址" prop="address">
+                <el-input type="text" maxlength="100" placeholder="请输入设备地址" v-model="formData.address"></el-input>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+<script >
+export default {
+    props: ['params'],
+
+    data() {
+        return {
+            formData: {
+                communityId: '',
+                deviceType: '',
+                deviceNo: '',
+                deviceName: '',
+                address: ''
+            },
+            formRules: {
+                communityId: [this.$valid.selectRequired('所属社区')],
+                deviceType: [this.$valid.selectRequired('设备类型')],
+                deviceNo: [this.$valid.inputRequired('设备编号')],
+                deviceName: [this.$valid.inputRequired('设备名称')],
+                address: [this.$valid.inputRequired('设备地址')]
+            },
+            communityArr: [],
+            productOptions: [],
+            defaultProps: {
+                value: 'id', // 唯一标识
+                label: 'label', // 标签显示
+                children: 'children' // 子级
+            }
+        };
+    },
+    methods: {
+        getorgTree() {
+            this.$http
+                .get('/sc-community/assets/community/list')
+                .then((data) => {
+                    this.communityArr = data.data;
+                })
+                .catch(function () {});
+        },
+        getProductOptions() {
+            this.$http.postForm('/sc-community/devicetype/selectList', { name: '' }).then((data) => {
+                this.productOptions = data;
+            });
+        },
+        submit() {
+            this.$refs.form.validate((valid) => {
+                if (valid) {
+                    var loading = this.$loading();
+                    let installData = JSON.parse(JSON.stringify(this.formData));
+                    installData.deviceType = _.last(installData.deviceType);
+                    this.$http
+                        .post('/sc-gate-web/gate/add', installData)
+                        .then(({ status, msg }) => {
+                            if (status == 0) {
+                                this.$message.success(msg);
+                                this.params.callback();
+                                this.$emit('close');
+                            } else {
+                                this.$message.error(msg);
+                            }
+                            loading.close();
+                        })
+                        .catch(() => {
+                            loading.close();
+                        });
+                }
+            });
+        }
+    },
+    created() {
+        this.getorgTree();
+        this.getProductOptions();
+    }
+};
+</script>
+<style lang="scss" scoped>
+@import '@assets/css/public-style.scss';
+</style>

accessControlSystem/src/views/trafficRecord/accessRecord/index.vue

@@ -1,6 +1,12 @@
 <template>
     <div class="content main">
-        <organ-tree @organId="currentOrganId" :buildingType="2" :clearRoom="true"></organ-tree>
+        <div class="content-left">
+            <organ-tree @organId="currentOrganId" :buildingType="2" :clearRoom="true"></organ-tree>
+            <div class="leftBottom">
+                <div class="title">门禁机列表</div>
+                <list-organ></list-organ>
+            </div>
+        </div>
         <div class="content-right">
             <div class="search">
                 <el-input clearable placeholder="输入姓名/手机号/地址" class="search-input" v-model.trim="mixins_query.name"></el-input>
@@ -42,9 +48,12 @@
 
 <script>
 import list from '@utils/list.js';
-
+import listOrgan from './popups/listOrganTree.vue';
 export default {
     mixins: [list],
+    components: {
+        listOrgan
+    },
     data() {
         return {
             currentId: '',
@@ -154,3 +163,27 @@ export default {
     }
 };
 </script>
+<style lang="scss" scoped>
+@import '@assets/css/public-style.scss';
+.content {
+    height: 100%;
+    .content-left {
+        float: left;
+        height: 100%;
+        .organ-tree {
+            height: calc(50% - #{rem(30)});
+            float: none;
+        }
+        .leftBottom {
+            margin-top: rem(20);
+            height: calc(50% - #{rem(40)});
+            background: white;
+            .title {
+                padding: rem(15) rem(20);
+                color: $defaultColor;
+                border-bottom: 1px solid #e0e1e3;
+            }
+        }
+    }
+}
+</style>

accessControlSystem/src/views/trafficRecord/accessRecord/popups/listOrganTree.vue

@@ -0,0 +1,132 @@
+<template>
+    <div class="list-organ-tree">
+        <el-input v-model="filterText" placeholder="请输入关键字" suffix-icon="el-icon-search"></el-input>
+        <div class="tree-style-box no-scrollbar">
+            <el-tree
+                class="tree-style"
+                :data="organList"
+                ref="tree"
+                node-key="id"
+                :highlight-current="true"
+                :props="defaultProps"
+                :expand-on-click-node="false"
+                @node-click="treeClick"
+                default-expand-all
+                :filter-node-method="filterNode"
+            >
+            </el-tree>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    props: ['buildingType', 'clearRoom'],
+    data() {
+        return {
+            filterText: '',
+            organList: [],
+            defaultProps: {
+                children: 'children',
+                label: 'name'
+            }
+        };
+    },
+    watch: {
+        filterText(val) {
+            this.$refs.tree.filter(val);
+        }
+    },
+    methods: {
+        getOrgTreeList() {
+            this.$http
+                .get('/sc-community/assets/tree/community/find', { buildingType: this.buildingType })
+                .then(({ status, data, msg }) => {
+                    if (status === 0 && data) {
+                        this.dimension(data);
+                        this.organList = data;
+                        // 过滤房间
+                        if (this.clearRoom) {
+                            this.clearRoomToggle(data);
+                        }
+                        this.$nextTick().then(() => {
+                            const firstNode = document.querySelector('.el-tree-node');
+                            firstNode.click();
+                        });
+                    }
+                });
+        },
+        dimension(arr) {
+            arr.map((item, index) => {
+                if (!!item.children) {
+                    this.dimension(item.children);
+                    if (item.type == 'unit') {
+                        item.name = this.CheckChinese(item.name, '单元');
+                    } else if (item.type == 'building') {
+                        item.name = this.CheckChinese(item.name, '楼栋');
+                    }
+                }
+            });
+        },
+        clearRoomToggle(arr) {
+            arr.map((item, index) => {
+                if (item.type == 'unit') {
+                    item.children = null;
+                    return;
+                } else if (item.type !== 'room') {
+                    this.clearRoomToggle(item.children);
+                } else if (item.type == 'room') {
+                    arr.splice(index, 1);
+                }
+            });
+        },
+        filterNode(value, data) {
+            if (!value) return true;
+            return data.name.indexOf(value) !== -1;
+        },
+        treeClick(e) {
+            // debugger;
+
+            // this.$emit('organId', e);
+        },
+        CheckChinese(val, name) {
+            var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
+            let newVal = val;
+            if (!reg.test(val)) {
+                newVal = val + name;
+            }
+            return newVal;
+        }
+    },
+    created() {
+        this.getOrgTreeList();
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+@import '@assets/css/public-style.scss';
+.list-organ-tree {
+    background: #ffffff;
+    padding: rem(20) rem(20) 0 rem(20);
+    box-sizing: border-box;
+    height: 100%;
+    overflow: hidden;
+    &::before {
+        clear: both;
+    }
+    .tree-style-box {
+        margin-top: rem(20);
+        max-height: rem(200);
+        overflow: scroll;
+    }
+    /deep/ .el-tree-node {
+        .is-leaf + .el-checkbox .el-checkbox_inner {
+            display: inline-block;
+        }
+        .el-checkbox .el-checkbox_inner {
+            display: none;
+        }
+    }
+}
+</style>