Changpeng Duan 5 лет назад
Родитель
Сommit
334d22c292

+ 7 - 0
package.json

@@ -7,15 +7,22 @@
     "build": "vue-cli-service build"
   },
   "dependencies": {
+    "64": "^0.2.0",
     "core-js": "^3.6.5",
     "echarts": "^4.8.0",
     "element-ui": "^2.13.2",
+    "js": "^0.1.0",
+    "js-base": "^0.0.1-beta",
+    "js-base64": "^2.6.3",
+    "js-md5": "^0.7.3",
     "mockjs": "^1.1.0",
     "nprogress": "^0.2.0",
+    "qrcodejs2": "^0.0.2",
     "qs": "^6.9.4",
     "v-charts": "^1.19.0",
     "vue": "^2.6.11",
     "vue-amap": "^0.5.10",
+    "vue-print-nb": "^1.5.0",
     "vue-router": "^3.2.0",
     "vuex": "^3.4.0"
   },

+ 35 - 0
src/api/getApiRes.js

@@ -115,5 +115,40 @@ export function RegionWifixyInfolist(postdata) {
 }
 
 
+// 0-6G折线图信息传入设备Id
+export function Detector06GInfolist(postdata) {
+    // 6G折线图信息传入设备Id
+    let url = headapi + 'v1/Detector/Detector06GInfolist';
+    return getApiBasic(url,postdata);
+}
+
+// 添加区域
+export function RegionAdd(postdata) {
+    // 添加区域 第一级区域填0
+    let url = headapi + 'v1/Company/RegionAdd';
+    return getApiBasic(url,postdata);
+}
+
+// 修改区域信息
+export function RegionEdit(postdata) {
+    // 修改区域 第一级区域填0
+    let url = headapi + 'v1/Company/RegionEdit';
+    return getApiBasic(url,postdata);
+}
+
+// 修改区域状态
+export function RegionStatusEdit(postdata) {
+    // 修改内部区域状态设置为9删除
+    let url = headapi + 'v1/Company/RegionStatusEdit';
+    return getApiBasic(url,postdata);
+}
+
+// 区域图片上传
+export function RegionPictureUpload(postdata) {
+    // 上传区域图片
+    let url = headapi + 'v1/Company/RegionPictureUpload';
+    return getApiBasic(url,postdata);
+}
+
 
 

+ 6 - 46
src/components/Scan.vue

@@ -23,7 +23,7 @@
                 days: 13,
                 loading: true,
                 chartData: {
-                    columns: ['页面', '访问量'],
+                    columns: ['X', 'Y'],
                     rows: [
                         // {'页面': '1.0M', '访问量': 123},
                     ]
@@ -68,59 +68,19 @@
                 }
             }
         },
-        mounted() {
-            let that = this;
-            this.timer = setInterval(() => {
-            that.getDate();
-            }, 1600);
-        },
-        methods: {
-            getDate() {
+        props: ['ScanRs'],
+        watch: {
+            ScanRs: function (val) {
                 let that = this;
-                let param = {
-                    token: localStorage.token
-                };
-                let postdata = qs.stringify(param);
-                // Scan(postdata).then(res => {
-                //     let json = res;
-                //     if (json.Code == 0) {
-                // test start
-
-                let item = [];
-                let t =0;
-                for (var i = 0; i < 9; i++) {
-                    let nums = Math.floor((Math.random()*365)+1);
-                    t = i+1;
-                    item.push({
-                        '页面': t + ".0M",
-                        '访问量': nums,
-                    })
-                }
-
-                let json = {
-                    Rs: item,
-                    Code: 0,
-                    Memo: '登陆成功'
-                };
-
-                // test end
-                        this.chartData.rows = json.Rs;
-                //     } else {
-                //         that.$message.error(json.Memo);
-                //     }
-                // })
+                console.log(val);
+               that.chartData.rows = val.Rs
             },
-            getRandomInt(min, max) {
-                return Math.floor(Math.random() * (max - min + 1)) + min;
-            }
         },
     }
 </script>
 
 <style scoped>
     .wifiSign {
-        /*width: 986px;*/
-        /*height: 212px;*/
         overflow: hidden;
         display: block;
         margin: 0 auto;

+ 2 - 1
src/main.js

@@ -6,13 +6,14 @@ import store from './store'
 import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
 import axios from 'axios'
+import Print from 'vue-print-nb'
 
 
 Vue.config.productionTip = false;
 import VCharts from 'v-charts'
 Vue.use(VCharts);
 Vue.use(ElementUI);
-
+Vue.use(Print);
 // 演示版本数据
 require('./Mock/index.js');
 //

+ 11 - 0
src/router/index.js

@@ -147,6 +147,13 @@ const routes = [
                 meta: {
                     title: "基本设置",
                 }
+            },{
+                path: '/createmeetingqrcode',
+                name: 'Createmeetingqrcode',
+                component: () => import('@/views/Createmeetingqrcode.vue'),
+                meta: {
+                    title: "二维码设置",
+                }
             },
         ]
     }, {
@@ -161,6 +168,10 @@ const routes = [
         path: '/equipInfo',
         name: 'equipInfo',
         component: () => import( '../components/EquipInfo.vue')
+    },{
+        path: '/poster',
+        name: 'Poster',
+        component: () => import( '../views/Poster.vue')
     }, {
         path: '*',
         name: '404',

+ 285 - 0
src/views/Createmeetingqrcode.vue

@@ -0,0 +1,285 @@
+<template>
+    <div>
+        <div class="adminPart" v-show="!posterPart">
+            <div class="box">
+                <div id="qrcode" ref=box></div>
+                <h5>{{shopname}}</h5>
+                <p>{{qrname}} 房间</p>
+                <span>检测房间安全请您扫描二维码</span>
+            </div>
+            <el-button v-print="'#printMer'"   id="coryCode" type="primary" @click="printQrcode">打印二维码</el-button>
+        </div>
+        <div id="printMer" class="posterPart " v-show="posterPart">
+            <div class="poster">
+                <img src="img/poster/tickdig%20logo@2x.png" alt="">
+                <h5>安全监控系统</h5>
+                <div id="qrcode2" ref=box2></div>
+                <p>检测房间安全请您扫描二维码</p>
+                <div class="btmInfo">
+                    <p>
+                        <span>{{shopname}}</span> &nbsp;●&nbsp; <s>{{qrname}}</s>
+                    </p>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</template>
+
+<script>
+    import QRCode from 'qrcodejs2'
+    import md5 from 'js-md5';
+    let Base64 = require('js-base64').Base64;
+    import Print from 'vue-print-nb'
+
+    export default {
+        data() {
+            return {
+                posterPart: false,
+                shopname: '',
+                qrname: '',
+                qrcodeId: '',
+                getVfcode: '',
+            }
+        },
+        mounted() {
+            this.getInfo();
+        },
+        methods: {
+            getInfo() {
+                this.shopname = this.$route.query.ComName;
+                this.qrname = this.$route.query.qrname;
+                this.qrcodeId = this.$route.query.qrcodeId;
+                this.getVfcode = this.$route.query.getVfcode;
+                let webSite = "http://sd.tickdig.com:85/#/";
+                let times = Base64.encode(new Date());
+                let url = "/poster?q=" +  Base64.encode(this.qrcodeId)+"&c="+Base64.encode(1) + '&t=' + times + '&v=' + Base64.encode(this.getVfcode);
+                this.writeQrcode(webSite+url);
+                let testSite = "http://192.168.0.162:8080" + url;
+                console.log(testSite);
+                console.log(webSite + url);
+            },
+            writeQrcode(url){
+                this.$refs.box.innerHTML="";
+                this.$refs.box2.innerHTML="";
+                let qrcode = new QRCode('qrcode', {
+                    width: 220,
+                    height: 220, // 高度
+                    text: url, // 二维码内容
+                    background: '#000000',
+                    foreground: '#ffffff'
+                });
+                let qrcode2 = new QRCode('qrcode2', {
+                    width: 180,
+                    height: 180, // 高度
+                    text: url, // 二维码内容
+                    background: '#000000',
+                    foreground: '#ffffff'
+                });
+            },
+            printQrcode(){
+                this.posterPart = true;
+            }
+        },
+
+    }
+</script>
+
+<style scoped>
+    #qrcode {
+        width: 220px;
+        height: 220px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        background: #0B628D;
+    }
+
+    body {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        background: #F9F9F9;
+    }
+
+    .box {
+        width: 92%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        box-shadow: 0 0 6px rgba(0, 0, 0, 0.09);
+        background: #FFFFFF;
+        border-radius: 11px;
+        margin-top: 26px;
+        padding: 48px 0px;
+    }
+
+    .box h5 {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        text-align: center;
+        font-size: 26px;
+        font-weight: normal;
+        margin-top: 18px;
+    }
+
+    .box p {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        text-align: center;
+        font-size: 22px;
+    }
+
+    .box span {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        text-align: center;
+        margin-top: 44px;
+        font-size: 14px;
+        color: #4C4C4C;
+    }
+
+    button {
+        width: 92%;
+        height: 59px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 40px;
+        background: #32C5FF;
+        border-radius: 5px;
+        color: #fff;
+        text-align: center;
+        font-size: 22px;
+        border: none;
+        outline: none;
+    }
+
+    .copyrights {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        color: #575757;
+        font-size: 12px;
+        text-align: center;
+        margin-top: 30px;
+        margin-bottom: 11px;
+    }
+
+    .posterPart {
+        width: 280px;
+        /*height: 1400px;*/
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        box-shadow: rgba(0, 0, 0, 0.3) 0 0 10px;
+        margin-top: 23px;
+        padding-top: 27px;
+        border-radius: 11px;
+        background: #fff;
+    }
+
+    .poster > img {
+        width: 107px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .posterPart h5 {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        text-align: center;
+        font-size: 24px;
+        font-weight: normal;
+        margin-top: 12px;
+        margin-bottom: 23px;
+    }
+
+    #qrcode2 {
+        width: 180px;
+        margin: 0 auto;
+    }
+
+    .poster p {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        text-align: center;
+        font-size: 14px;
+        margin-top: 12px;
+        margin-bottom: 28px;
+    }
+
+    .btmInfo {
+        width: 100%;
+        padding-top: 31px;
+        padding-bottom: 31px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        background: #08BF96;
+        color: #fff;
+    }
+
+    .btmInfo p {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .btmInfo span {
+        /*width: 100%;*/
+        overflow: hidden;
+        /*display: block;*/
+        /*margin: 0 auto;*/
+        text-align: center;
+        font-size: 24px;
+    }
+
+    .btmInfo s {
+        width: 100%;
+        overflow: hidden;
+        /*display: block;*/
+        /*margin: 0 auto;*/
+        text-align: center;
+        font-size: 24px;
+        text-decoration: none;
+    }
+
+    .big {
+        width: 360px;
+    }
+
+    .big h5 {
+        margin-top: 25px;
+        margin-bottom: 45px;
+    }
+
+    .big .poster > p {
+        margin-top: 30px;
+    }
+
+    .big .btmInfo {
+        padding-top: 55px;
+        padding-bottom: 55px;
+    }
+
+    .big #qrcode2 {
+        width: 180px;
+        margin: 0 auto;
+    }
+
+</style>

+ 66 - 16
src/views/Index.vue

@@ -13,8 +13,8 @@
                         <router-view></router-view>
                     </keep-alive>
                 </el-main>
-                <el-footer >
-                    <p>Copyright © 2020-2022 专用场所无线信号安全监控系统 版权所有</p>
+                <el-footer>
+                    <p class="footerP">Copyright © 2020-2022 专用场所无线信号安全监控系统 版权所有</p>
                 </el-footer>
             </el-container>
         </el-container>
@@ -55,7 +55,7 @@
                 let str = ""; //存放第一层遍历的值
                 let strArray = []; //存放第二层遍历的值
                 let item = {};
-                if(data == 99){
+                if (data == 99) {
                     // 退出直接后面不处理了
                     return false
                 }
@@ -107,33 +107,33 @@
         bottom: 0;
         width: 100%;
         height: 100%;
-        background-color:#01355B;
-        background: url("../assets/img/mainBg.png")top center no-repeat;
+        background-color: #01355B;
+        background: url("../assets/img/mainBg.png") top center no-repeat;
         background-size: 100% 100%;
-        overflow-y: scroll;
+        overflow-y: hidden;
     }
 
-    .container::-webkit-scrollbar {/*滚动条整体样式*/
+    .container::-webkit-scrollbar { /*滚动条整体样式*/
 
-        width: 10px;     /*高宽分别对应横竖滚动条的尺寸*/
+        width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
 
         height: 1px;
 
     }
 
-    .container::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
+    .container::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
 
         border-radius: 10px;
 
-        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
 
         background: #01355B;
 
     }
 
-    .container::-webkit-scrollbar-track {/*滚动条里面轨道*/
+    .container::-webkit-scrollbar-track { /*滚动条里面轨道*/
 
-        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
 
         border-radius: 10px;
 
@@ -143,24 +143,31 @@
 
 
     .el-header {
-        height: 60px!important;
+        height: 60px !important;
         padding: 0 !important;
     }
+
     .shortElaside {
-        width: 60px!important;
+        width: 60px !important;
         overflow: hidden;
         height: 100%;
         float: left;
     }
+
     .lognElaside {
-        width: 320px!important;
+        width: 320px !important;
         overflow: hidden;
         height: 100%;
         float: left;
     }
+
     /deep/ .nav {
         width: 60px;
     }
+    .el-main {
+        /*overflow: hidden;*/
+    }
+
     .indexContainer {
         /*width: 97%;*/
         position: absolute;
@@ -169,8 +176,51 @@
         left: 55px;
         top: 60px;
     }
-    .el-main {
+    .indexContainer  {
+        position: absolute;
+        top: 60px;
+        left: 45px;
+        /*right: 10px;*/
+        bottom: 3px;
+        /*width: 100%;*/
+        /*height: 100%;*/
         /*max-height: 850px;*/
         /*overflow-y: scroll;*/
     }
+
+    .el-main::-webkit-scrollbar { /*滚动条整体样式*/
+
+        width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
+
+        height: 1px;
+
+    }
+
+    .el-main::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
+
+        border-radius: 10px;
+
+        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+
+        background: #01355B;
+
+    }
+
+    .el-main::-webkit-scrollbar-track { /*滚动条里面轨道*/
+
+        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+
+        border-radius: 10px;
+
+        background: none;
+
+    }
+    .footerP {
+        margin: 5px 0;
+        padding: 0;
+    }
+    .el-footer {
+        height: 30px!important;
+        padding: 0 5px;
+    }
 </style>

+ 28 - 3
src/views/Main.vue

@@ -60,7 +60,7 @@
             <div class="cube">
                 <WifiSign :wifi-rs="WifiRs"></WifiSign>
             </div>
-            <Scan></Scan>
+            <Scan :scan-rs="ScanRs"></Scan>
         </div>
         <div class="mrt">
             <div class="cube" v-if="pageLevel == 0||pageLevel == 1||pageLevel == 4">
@@ -97,7 +97,8 @@
         RegionDetInfolist,
         SingleDetInfolist,
         DetectorWifixyInfolist,
-        RegionWifixyInfolist
+        RegionWifixyInfolist,
+        Detector06GInfolist
     } from '../api/getApiRes.js'
 
     let qs = require('qs');
@@ -115,6 +116,7 @@
                 DetctorPanel: false,//设备
                 totalRs: [],
                 WifiRs: [],
+                ScanRs: [],
                 // pageLevel: 1,//当前为楼层
                 // pageLevel: 2,//当前为楼层区域
                 // pageLevel: 3,//当前为房间
@@ -129,7 +131,15 @@
             // 定时查询
             that.timer = setInterval(() => {
                 that.getDate();
-            }, 5000);
+            }, 1115000);
+
+            let param = {
+                token: localStorage.token,
+                detectorId: 1,
+                regionId: this.regionId
+            };
+            let postdata = qs.stringify(param);
+            // that.getDetector06GInfolist(postdata);
         },
         destroyed() {
             //页面销毁时清除定时器
@@ -153,10 +163,12 @@
             // 根据层级和地区ID调用不同的Ajax接口
             getDate() {
                 let that = this;
+
                 // 非设备层级
                 if (that.pageLevel != 4) {
                     let param = {
                         token: localStorage.token,
+                        detectorId: 0,
                         regionId: this.regionId
                     };
                     let postdata = qs.stringify(param);
@@ -164,6 +176,7 @@
                     that.getRegionWifixyInfolist(postdata);
                     // 区域检测实时记录
                     that.getRegionDetInfolist(postdata);
+
                 } else {
                     // 单个设备层级
                     // todo
@@ -176,8 +189,20 @@
                     that.getDetectorWifixyInfolist(postdata);
                     // 单个设备检测实时记录
                     that.getSingleDetInfolist(postdata);
+                    // that.getDetector06GInfolist(postdata);
                 }
             },
+            getDetector06GInfolist(postdata) {
+                let that = this;
+                Detector06GInfolist(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        that.ScanRs = json;
+                    } else {
+                        that.$message.error(json.Memo);
+                    }
+                })
+            },
             getRegionDetInfolist(postdata) {
                 let that = this;
                 RegionDetInfolist(postdata).then(res => {

+ 15 - 0
src/views/Poster.vue

@@ -0,0 +1,15 @@
+<template>
+    <div>
+        this is poster
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "Poster"
+    }
+</script>
+
+<style scoped>
+
+</style>

+ 326 - 77
src/views/Qrcodemanage.vue

@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div class="content">
         <div class="tabs">
             <ul>
                 <li v-for="(tab,i) in tabs" @click="goTab(tab.url)" :class="{'active':tabIndex == i}">
@@ -11,17 +11,19 @@
             <div class="panel-body">
                 <div class=" panel_control">
                     <el-row :gutter="20">
-                        <el-col :span="4">
-                            <em>设备ID:</em>
-                            <el-input v-model="panel.keyword" placeholder="请输入设备ID"></el-input>
-                        </el-col>
-                        <el-col :span="4">
-                            <em>MAC:</em>
-                            <el-input v-model="panel.keyword" placeholder="请输入MAC地址"></el-input>
+                        <el-col :span="6">
+                            <em>登记时间:</em>
+                            <el-date-picker
+                                    v-model="panel.time1"
+                                    type="daterange"
+                                    range-separator="至"
+                                    start-placeholder="开始日期"
+                                    end-placeholder="结束日期">
+                            </el-date-picker>
                         </el-col>
                         <el-col :span="4">
-                            <em>所属区域:</em>
-                            <el-select v-model="panel.taskstatus">
+                            <em>时限类型:</em>
+                            <el-select v-model="panel.timeType">
                                 <el-option
                                         v-for="item in panel.options"
                                         :key="item.value"
@@ -30,15 +32,9 @@
                                 </el-option>
                             </el-select>
                         </el-col>
-                        <el-col :span="6">
-                            <em>登记时间:</em>
-                            <el-date-picker
-                                    v-model="panel.time1"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始日期"
-                                    end-placeholder="结束日期">
-                            </el-date-picker>
+                        <el-col :span="4">
+                            <em>关键词:</em>
+                            <el-input v-model="panel.keyword" placeholder="请输入关键词"></el-input>
                         </el-col>
                         <el-col :span="4">
                             <el-button size="small" type="primary" @click="query">查询</el-button>
@@ -63,42 +59,48 @@
                     width="55">
             </el-table-column>
             <el-table-column
-                    prop="name"
-                    label="设备ID"
+                    prop="QrId"
+                    label="二维码编号"
             >
             </el-table-column>
             <el-table-column
-                    prop="date"
-                    label="检测时间"
+                    prop="CreateTime"
+                    label="创建时间"
                     width="180">
+                <template slot-scope="scope">
+                    {{scope.row.CreateTime |fmtDate}}
+                </template>
             </el-table-column>
             <el-table-column
-                    prop="name"
-                    label="探测区域"
+                    prop="Frequency"
+                    label="有效时长(分钟)"
             >
             </el-table-column>
             <el-table-column
-                    prop="name"
-                    label="信道"
+                    prop="DetIdStr"
+                    label="探测器"
                     width="180">
+                <!--探测器详细信息 todo-->
             </el-table-column>
             <el-table-column
-                    prop="address"
-                    label="信号频段">
+                    prop="QrName"
+                    label="二维码名字">
             </el-table-column>
             <el-table-column
-                    prop="address"
-                    label="数据量">
+                    prop="Tel"
+                    label="联系电话">
             </el-table-column>
             <el-table-column
-                    prop="address"
-                    label="信号强度">
+                    prop="Memo"
+                    label="备注">
             </el-table-column>
             <el-table-column
-                    prop="address"
-                    label="操作记录">
+                    prop="QrId"
+                    label="操作">
                 <template slot-scope="scope">
-                    <span @click="goRecord(scope.row)">探测记录</span>
+                    <el-button class="control_btn" type="text" @click="goPoster(scope.row)">海报</el-button>
+                    <el-button class="control_btn" type="text" @click="goQrcode(scope.row)">二维码</el-button>
+                    <el-button class="control_btn red" type="text" @click="pauseQrcode(scope.row)">禁用</el-button>
                 </template>
             </el-table-column>
         </el-table>
@@ -121,40 +123,64 @@
                 <el-row :gutter="20">
                     <el-col :span="10">
                         <label>
-                            设备ID
+                            二维码名称 *
+                        </label>
+                        <el-input v-model="dialog.comname"></el-input>
+                    </el-col>
+                    <el-col :span="10">
+                        <label>
+                            电话 *
                         </label>
-                        <el-input v-model="dialog.name"></el-input>
+                        <el-input v-model="dialog.tel"></el-input>
                     </el-col>
                     <el-col :span="10">
                         <label>
-                            MAC地址
+                            房间号 *
                         </label>
-                        <el-input v-model="dialog.name"></el-input>
+                        <el-input v-model="dialog.qrname"></el-input>
                     </el-col>
                     <el-col :span="10">
                         <label>
-                            标签名
+                            备注
                         </label>
-                        <el-input v-model="dialog.name"></el-input>
+                        <el-input v-model="dialog.memo"></el-input>
                     </el-col>
                     <el-col :span="10">
                         <label>
-                            设备所属楼层
+                            房间所属探测器
                         </label>
-                        <el-select v-model="dialog.region" placeholder="请选择所属楼层">
+                        <!--改成list todo -->
+                        <el-checkbox-group v-model="dialog.checkList">
+                            <el-checkbox :label="det.Id" v-for="det in dialog.detOptions">{{det.Name}}</el-checkbox>
+                        </el-checkbox-group>
+                    </el-col>
+                    <el-col :span="10">
+                        <label>
+                            海报有效期 *
+                        </label>
+                        <el-radio v-model="dialog.timeType" label="1">无限期</el-radio>
+                        <el-radio v-model="dialog.timeType" label="2">有时限</el-radio>
+
+                    </el-col>
+                    <el-col :span="10" v-if="dialog.timeType == 2">
+                        <label>
+                            有效期时长
+                        </label>
+                        <el-input class="short" v-model="dialog.frequency"></el-input>
+                        <el-select class="short shortRight" v-model="dialog.region" placeholder="时间单位">
                             <el-option
-                                    v-for="item in panel.options"
+                                    v-for="item in dialog.timeOptions"
                                     :key="item.value"
                                     :label="item.label"
                                     :value="item.value">
                             </el-option>
                         </el-select>
                     </el-col>
-                    <el-col :span="20">
+                    <el-col :span="10">
                         <label>
-                            备注
+                            单位形象图 * todo
                         </label>
-                        <el-input type="textarea" v-model="dialog.memo"></el-input>
+                        <!--todo-->
                     </el-col>
                 </el-row>
             </div>
@@ -165,13 +191,15 @@
 <script>
     import Global from '../Global.js'
     import dialog_referrer_list from '../components/dialog_referrer_list'
+    import {GetRegionAndDectorSelect} from '../api/getApiRes.js'
 
+    let qs = require('qs');
     export default {
         data() {
             return {
                 // dialog
                 dialog_state: false,
-                dialog_title: '添加设备',
+                dialog_title: '添加二维码',
                 dialog_type: '',//类型,1是添加,2是修改
                 tabIndex: 0,
                 tabs: [
@@ -184,11 +212,11 @@
                     compname: '',
                     keyword: '',
                     USERCODE: '',
-                    taskstatus: 99,
+                    timeType: 99,
                     options: [
                         {value: 99, label: '全部'},
-                        {value: 1, label: '进行中'},
-                        {value: 2, label: '已完成'},
+                        {value: 1, label: '无期限'},
+                        {value: 2, label: '有时限'},
                     ],
                     time1: globalBt2(),
                 },
@@ -199,32 +227,47 @@
                     pageIndex: 1,
                 },
                 dialog: {
-                    name: 10,
-                    region: 10,
+                    comname: '',
+                    tel: '',
+                    qrname: '',
+                    detId: '',
+                    timeType: '1',
                     memo: '',
+                    detOptions: [],
+                    checkList: [],
+                    timeOptions: [
+                        {value: 1, label: '分钟'},
+                        {value: 2, label: '小时'},
+                        {value: 3, label: '天'},
+                        {value: 4, label: '月(30天)'},
+                        {value: 5, label: '年'},
+                    ],
                 },
                 multipleSelection: [],
-                tableData: [{
-                    date: '2016-05-02',
-                    name: '王小虎',
-                    address: '上海市普陀区金沙江路 1518 弄'
-                }, {
-                    date: '2016-05-04',
-                    name: '王小虎',
-                    address: '上海市普陀区金沙江路 1517 弄'
-                }, {
-                    date: '2016-05-01',
-                    name: '王小虎',
-                    address: '上海市普陀区金沙江路 1519 弄'
-                }, {
-                    date: '2016-05-03',
-                    name: '王小虎',
-                    address: '上海市普陀区金沙江路 1516 弄'
-                }]
+                tableData: [
+                    {
+                        "QrId": 3,
+                        "ComId": 7,
+                        "ComName": "一瓦科技",
+                        "Tel": "15253135699",
+                        "QrName": "会议室",
+                        "DetIdStr": "2,3",
+                        "PicPath": "8e51ac9d6bcad2c296e7b26f1f88949f",
+                        "Memo": "线上展示,请勿删改",
+                        "State": 1,
+                        "Frequency": 60000,
+                        "ExpTime": "2020-08-14T02:27:32.161505+08:00",
+                        "Vfcode": "d6caec11e8fb88b519614c6096622a50",
+                        "CreateTime": "2020-07-03T09:54:44.728978+08:00",
+                        "TagnameStr": "会议室1,会议室2,会议室3",
+                        "LocationStr": "------会议室,------会议室,------会议室"
+                    }
+                ]
             }
         },
         mounted() {
             this.getTableQuery();
+            this.getDetList();
         },
         methods: {
             // 跳转tab页面
@@ -240,6 +283,19 @@
                 this.multipleSelection = val;
                 console.log(val);
             },
+            // 获取探测器列表
+            getDetList() {
+                let param = {
+                    'token': localStorage.token,
+                };
+                let postdata = qs.stringify(param);
+                GetRegionAndDectorSelect(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.dialog.detOptions = json.DectectorRs;
+                    }
+                })
+            },
             // 页面数据查询
             getTableQuery() {
                 // let that = this;
@@ -315,21 +371,39 @@
             },
             addList() {
                 this.dialog_state = true;
-                this.dialog_title = '添加设备';
+                this.dialog_title = '添加二维码';
+                // clear
+                this.dialog.detId = '';
+                this.dialog.timeType = '1';
+                this.dialog.memo = '';
+                this.dialog.checkList = [];
             },
             delList() {
+                let that = this;
                 // checkNum
                 if (!this.multipleSelection.length) {
-                    this.$message({
+                    that.$message({
                         showClose: true,
                         message: '错了哦,需要先选中至少一条记录',
                         type: 'error'
                     });
                     return false
                 }
-                // todo delEquip
+                let qrcodeid = that.multipleSelection[0].QrId;
+                console.log(qrcodeid);
+                // ajax todo
+                // ok
+                that.dialog_state = false;
+                that.$message({
+                    message: '选中的二维码已删除',
+                    type: 'success'
+                });
+                // 重载列表
+                that.getTableQuery();
+
             },
             changeList() {
+                let that = this;
                 // checkNum
                 if (!this.multipleSelection.length) {
                     this.$message({
@@ -347,6 +421,23 @@
                     });
                     return false
                 }
+                this.dialog_state = true;
+                this.dialog_title = '修改二维码';
+                that.dialog_type = 2;
+                let row = this.multipleSelection[0];
+                this.dialog.comname = row.ComName;
+                this.dialog.tel = row.Tel;
+                this.dialog.qrname = row.QrName;
+                this.dialog.memo = row.Memo;
+                this.dialog.checkList = row.DetIdStr.split(',').map(Number);
+                // 为0时候表示无限期
+                // 获取时限类型
+                let timeType = parseInt(row.Frequency);
+                if (timeType == 0) {
+                    that.dialog.timeType = 1;
+                } else {
+                    that.dialog.timeType = 2;
+                }
             },
             // 探测记录
             goRecord(row) {
@@ -358,12 +449,118 @@
                 that.dialog_state = false;
             },
             dialog_ok() {
+                if (this.dialog_type == 1) {
+                    this.confirmAddQrcode();
+                } else {
+                    this.confirmEditQrcode();
+                }
+            },
+            // 确认添加新的二维码
+            confirmAddQrcode() {
+                // checkVal
                 let that = this;
-                let dialog_type = that.dialog_type;
-                let name = that.field_name;
-                let id = that.field_id;
+                // checkVal
+                if (!that.dialog.qrname) {
+                    this.$message.error('错了哦,区域名称不能空');
+                    return false
+                }
+                if (that.dialog.qrname.length > 20) {
+                    this.$message.error('错了哦,区域名称不能超过20个字符');
+                    return false
+                }
+                if (!that.dialog.name) {
+                    this.$message.error('错了哦,区域名称不能空');
+                    return false
+                }
+                if (that.dialog.name.length > 20) {
+                    this.$message.error('错了哦,区域名称不能超过20个字符');
+                    return false
+                }
+                // ajax todo
+                // ok
+                that.dialog_state = false;
+                that.$message({
+                    message: '主建筑已添加',
+                    type: 'success'
+                });
+
+            },
+            // 确认修改旧的二维码
+            confirmEditQrcode() {
+            },
+            // 禁用二维码
+            pauseQrcode(row) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    qrcodeid: row.QrId,
+                    status: 0//新状态0禁用1启用 9删除
+                };
+                let postdata = qs.stringify(param);
+                this.$confirm('是否禁用' + row.QrName + '的二维码?', '禁用操作', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                }).then(() => {
+                    // // ajax todo
+                    // RegionStatusEdit(postdata).then(res => {
+                    //     let json = res;
+                    //     if (json.Code == 0) {
+                    that.$message({
+                        type: 'success',
+                        message: `禁用成功`
+                    });
+                    that.getTableQuery();
+                    // } else {
+                    //     that.$message.error(json.Memo);
+                    // }
+                    // })
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: '已取消禁用'
+                    });
+                });
+            },
+            // 查看海报
+            goPoster(node){
+                this.$router.push({
+                    path:'/poster',
+                    query:{
+                        shopname:1,
+                        ComName :node.ComName,
+                        qrname :node.QrName,
+                        qrcodeId :node.QrId,
+                        vfcode :node.Vfcode,
+                    }
+                })
+            },
+            // 查看二维码
+            goQrcode(node){
+                this.$router.push({
+                    path:'/createmeetingqrcode',
+                    query:{
+                        shopname:1,
+                        ComName :node.ComName,
+                        qrname :node.QrName,
+                        qrcodeId :node.QrId,
+                        vfcode :node.Vfcode,
+                    }
+                })
             },
         },
+        filters: {
+            fmtDate: function (value) {
+                let res = '';
+                if (!value) {
+                    return '---';
+                } else {
+                    res = new Date(+new Date(value) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '');
+                    return res;
+                }
+            }
+        }
+        ,
         components: {
             dialog_referrer_list
         }
@@ -381,4 +578,56 @@
     table span {
         cursor: pointer;
     }
+
+    .control_btn {
+        float: left;
+        margin: 0 4px;
+    }
+
+    .content {
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .modal-content .el-select {
+        display: block;
+    }
+
+    /deep/ .modal-content .el-select .el-input .el-select__caret {
+        position: relative;
+        top: 10px;
+        line-height: 0px !important;
+    }
+
+    /deep/ .el-radio {
+        width: 45%;
+        height: 35px;
+        float: left;
+        padding-top: 10px;
+    }
+
+    /deep/ .el-radio__input {
+        float: left;
+    }
+
+    /deep/ .el-radio__inner {
+        float: left;
+    }
+
+    /deep/ .el-radio__label {
+        float: left;
+    }
+
+    .short {
+        width: 40%;
+        float: left;
+        margin-right: 10px;
+    }
+
+    .red {
+        color: red !important;
+    }
 </style>

+ 228 - 173
src/views/Region.vue

@@ -20,7 +20,8 @@
                 <el-tree
                         :data="tree"
                         show-checkbox
-                        node-key="id"
+                        :props="defaultProps"
+                        node-key="Id"
                         default-expand-all
                         :expand-on-click-node="false">
                      <span class="custom-tree-node" slot-scope="{ node, data }">
@@ -29,7 +30,7 @@
                       <img src="../assets/img/region/add.png" height="18" width="18" @click="addLoft(node)"/>
                       <img src="../assets/img/region/edit.png" height="18" width="18" @click="editLoft(node)"/>
                       <img src="../assets/img/region/del.png" height="18" width="18" @click="delLoft(node)"/>
-                      <img src="../assets/img/region/watch.png" height="18" width="18"@click="seeLoft(node)"/>
+                      <img src="../assets/img/region/watch.png" height="18" width="18" @click="seeLoft(node)"/>
                       </span>
                   </span>
                 </el-tree>
@@ -66,14 +67,18 @@
                         </label>
                         <el-input v-model="dialog.name"></el-input>
                     </el-col>
-                    <el-col :span="20" v-if="dialog_level != 1">
+                    <!--<el-col :span="20" v-if="dialog_level != 1">-->
+                    <el-col :span="20" v-if="true">
                         <label>
                             建筑平面图
                         </label>
                         <el-upload
-                                action="#"
+                                action="/api/v1/Company/RegionPictureUpload"
                                 list-type="picture-card"
-                                :auto-upload="false">
+                                :data="dialog"
+                                :on-success="handleImgSuccess"
+                                :before-upload="handleImgbefore"
+                                :auto-upload="true">
                             <i slot="default" class="el-icon-plus"></i>
                             <div slot="file" slot-scope="{file}">
                                 <img
@@ -117,7 +122,14 @@
 <script>
     import Global from '../Global.js'
     import dialog_referrer_list from '../components/dialog_referrer_list'
+    import {
+        GetRegionAndDectorSelect,
+        RegionStatusEdit,
+        RegionAdd
+    }
+        from '../api/getApiRes.js'
 
+    let qs = require('qs');
     export default {
         data() {
             return {
@@ -127,10 +139,14 @@
                 dialog_type: '',//类型,1是添加,2是修改
                 dialog_level: 1,//类型,1是楼(无图),2是楼层(有图),3是会议室(有图)
                 dialog: {
+                    shopID: 1,//One and always is one
+                    token: localStorage.token,
                     name: '',
                     region: '',
                     regionId: 0,
                     memo: '',
+                    key: '',
+                    image: '',
                 },
                 dialogImageUrl: '',
                 dialogVisible: false,
@@ -139,9 +155,9 @@
                 loftList: [
                     {}
                 ],
-                props: {
-                    label: 'name',
-                    children: 'zones'
+                defaultProps: {
+                    label: 'Name',
+                    children: 'ChildSelect'
                 },
                 count: 1,
                 tree: []
@@ -153,31 +169,18 @@
         methods: {
             // 获取建筑树列表
             getDate() {
-                this.tree = [{
-                    label: '1号楼',
-                    regionId: 1,
-                    children: [{
-                        label: '1号楼1楼',
-                        regionId: 6,
-                        children: [
-                            {
-                                label: '第一会议室',
-                                regionId: 10,
-                            },
-                            {
-                                label: '第二会议室',
-                                regionId: 11,
-                            },
-                            {
-                                label: '第三会议室',
-                                regionId: 12,
-                            }]
-                    }]
-                }, {
-                    label: '2号小平房',
-                    regionId: 2,
-                    children: []
-                }]
+                let param = {
+                    'token': localStorage.token,
+                };
+                let postdata = qs.stringify(param);
+                GetRegionAndDectorSelect(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.tree = json.FullChildlRs;//全部关系
+                    } else {
+                        that.$message.error(json.Memo);
+                    }
+                })
             },
             // 添加主建筑
             addMain() {
@@ -187,164 +190,216 @@
                 that.dialog_type = 1;
                 that.dialog_level = 1;
             },
-            // 修改弹窗
+            // 修改建筑 弹窗
             editLoft(node) {
                 let that = this;
                 that.dialog_state = true;
                 that.dialog_title = '修改';
                 that.dialog_type = 2;
                 that.dialog_level = node.level;
-                that.dialog.name = node.data.label;
-                that.dialog.regionId = node.data.regionId;
-                console.log(node);
-                // that.dialog_level = 1;
+                that.dialog.name = node.data.Name;
+                that.dialog.regionId = node.data.Id;
             },
             // 删除楼层
             delLoft(node) {
-                let regionId = node.data.regionId;
+                let that = this;
+                let regionId = node.data.Id;
                 let name = node.data.label;
-                this.$alert('是否删除'+name+'区域?', '删除操作', {
+                // 状态9删除
+                let param = {
+                    'token': localStorage.token,
+                    'regionid ': regionId,
+                    'newstatus  ': 9,
+                };
+                let postdata = qs.stringify(param);
+
+                this.$confirm('是否删除' + name + '区域?', '删除操作', {
                     confirmButtonText: '确定',
-                    callback: action => {
-                        // ajax todo
-                        this.$message({
-                            type: 'success',
-                            message: `删除成功`
-                        });
-                    }
-                })
-            },
-            // 提交主建筑
-            confirmAddMain() {
-                let that = this;
-                // checkVal
-                if (!that.dialog.name) {
-                    this.$message.error('错了哦,主建筑名称不能空');
-                    return false
-                }
-                if (that.dialog.name.length > 20) {
-                    this.$message.error('错了哦,主建筑名称不能超过20个字符');
-                    return false
-                }
-                // ajax todo
-                // ok
-                that.dialog_state = false;
-                that.$message({
-                    message: '主建筑已添加',
-                    type: 'success'
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                }).then(() => {
+                    RegionStatusEdit(postdata).then(res => {
+                        let json = res;
+                        if (json.Code == 0) {
+                            that.$message({
+                                type: 'success',
+                                message: `删除成功`
+                            });
+                        } else {
+                            that.$message.error(json.Memo);
+                        }
+                    });
+                    that.getDate();
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: '已取消禁用'
+                    });
                 });
-            },
-            confirmEdit() {
-                let that = this;
-                // checkVal
-                if (!that.dialog.name) {
-                    this.$message.error('错了哦,建筑名称不能空');
-                    return false
-                }
-                if (that.dialog.name.length > 20) {
-                    this.$message.error('错了哦,建筑名称不能超过20个字符');
-                    return false
-                }
-                // ajax todo
-                // ok
-                that.dialog_state = false;
-                that.$message({
-                    message: '建筑已修改',
-                    type: 'success'
-                });
-            },
-            // 添加次级建筑
-            addLoft(node) {
-                let that = this;
-                that.dialog_state = true;
-                that.dialog_title = '添加楼层或区域';
-                that.dialog_type = 1;
-                that.dialog_level = 2;
-                console.log(node);
-            },
-            handleCheckChange(data, checked, indeterminate) {
-                console.log(data, checked, indeterminate);
-            },
-            handleNodeClick(data) {
-                console.log(data);
-            },
-            loadNode(node, resolve) {
-                if (node.level === 0) {
-                    return resolve([{name: 'region1'}, {name: 'region2'}]);
+        },
+        // 提交主建筑
+        confirmAddMain() {
+            let that = this;
+            // checkVal
+            if (!that.dialog.name) {
+                this.$message.error('错了哦,主建筑名称不能空');
+                return false
+            }
+            if (that.dialog.name.length > 20) {
+                this.$message.error('错了哦,主建筑名称不能超过20个字符');
+                return false
+            }
+            let param = {
+                'token': localStorage.token,
+                'regionid ': regionId,
+                'comid   ': 1,
+                'superiorid    ': 0,
+                'longitude     ': 0,
+                'latitude      ': 0,
+                'width       ': 400,
+                'height        ': 300,
+                'picMemo        ': 300,
+                'picType         ': 1, //图片类型,1:主图 2:平面图
+                'key         ': dialog.key,
+            };
+            let postdata = qs.stringify(param);
+
+            RegionAdd(postdata).then(res => {
+                let json = res;
+                if (json.Code == 0) {
+                    that.dialog_state = false;
+                    that.$message({
+                        showClose: true,
+                        message: '主建筑已添加!',
+                        type: 'success'
+                    });
+                } else {
+                    that.$message.error(json.Memo);
                 }
-                if (node.level > 3) return resolve([]);
-
-                var hasChild;
-                if (node.data.name === 'region1') {
-                    hasChild = true;
-                } else if (node.data.name === 'region2') {
-                    hasChild = false;
+            })
+        },
+        // 提交修改
+        confirmEdit() {
+            let that = this;
+            // checkVal
+            if (!that.dialog.name) {
+                this.$message.error('错了哦,建筑名称不能空');
+                return false
+            }
+            if (that.dialog.name.length > 20) {
+                this.$message.error('错了哦,建筑名称不能超过20个字符');
+                return false
+            }
+
+            // ajax todo
+            // ok
+            that.dialog_state = false;
+            that.$message({
+                message: '建筑已修改',
+                type: 'success'
+            });
+        },
+        // 添加次级建筑
+        addLoft(node) {
+            let that = this;
+            that.dialog_state = true;
+            that.dialog_title = '添加楼层或区域';
+            that.dialog_type = 1;
+            that.dialog_level = 2;
+            console.log(node);
+        },
+        handleImgSuccess(res, file) {
+            console.log(res);
+        },
+        handleImgbefore(file) {
+            console.log(file);
+            this.dialog.image = file;
+        },
+        handleCheckChange(data, checked, indeterminate) {
+            console.log(data, checked, indeterminate);
+        },
+        handleNodeClick(data) {
+            console.log(data);
+        },
+        loadNode(node, resolve) {
+            if (node.level === 0) {
+                return resolve([{name: 'region1'}, {name: 'region2'}]);
+            }
+            if (node.level > 3) return resolve([]);
+
+            var hasChild;
+            if (node.data.name === 'region1') {
+                hasChild = true;
+            } else if (node.data.name === 'region2') {
+                hasChild = false;
+            } else {
+                hasChild = Math.random() > 0.5;
+            }
+
+            setTimeout(() => {
+                var data;
+                if (hasChild) {
+                    data = [{
+                        name: 'zone' + this.count++
+                    }, {
+                        name: 'zone' + this.count++
+                    }];
                 } else {
-                    hasChild = Math.random() > 0.5;
+                    data = [];
                 }
 
-                setTimeout(() => {
-                    var data;
-                    if (hasChild) {
-                        data = [{
-                            name: 'zone' + this.count++
-                        }, {
-                            name: 'zone' + this.count++
-                        }];
-                    } else {
-                        data = [];
-                    }
-
-                    resolve(data);
-                }, 500);
-            },
-            dialog_cancel() {
-                let that = this;
-                that.dialog_state = false;
-            },
-            dialog_ok() {
-                let that = this;
-                // 添加类
-                if (that.dialog_type == 1) {
-                    // 获取提交类型
-                    switch (parseInt(that.dialog_level)) {
-                        case 1:
-                            that.confirmAddMain();
-                            break;
-                        case 2:
-                            break;
-                        case 3:
-                            break;
-                    }
-                }
-                // 修改类
-                if (that.dialog_type == 2) {
-                    that.confirmEdit();
+                resolve(data);
+            }, 500);
+        },
+        dialog_cancel() {
+            let that = this;
+            that.dialog_state = false;
+        },
+        dialog_ok() {
+            let that = this;
+            // 添加类
+            if (that.dialog_type == 1) {
+                // 获取提交类型
+                switch (parseInt(that.dialog_level)) {
+                    case 1:
+                        that.confirmAddMain();
+                        break;
+                    case 2:
+                        break;
+                    case 3:
+                        break;
                 }
-
-                // let dialog_type = that.dialog_type;
-                // let name = that.field_name;
-                // let id = that.field_id;
-            },
-            handleRemove(file) {
-                console.log(file);
-            },
-            handlePictureCardPreview(file) {
-                this.dialogImageUrl = file.url;
-                this.dialogVisible = true;
-            },
-            handleDownload(file) {
-                console.log(file);
-            },
-            // 查看当前区域情况
-            seeLoft(node){
-                // todo
-            },
+            }
+            // 修改类
+            if (that.dialog_type == 2) {
+                that.confirmEdit();
+            }
+
+            // let dialog_type = that.dialog_type;
+            // let name = that.field_name;
+            // let id = that.field_id;
         },
-        components: {
-            dialog_referrer_list
-        }
-    };
+        handleRemove(file) {
+            console.log(file);
+        },
+        handlePictureCardPreview(file) {
+            this.dialogImageUrl = file.url;
+            this.dialogVisible = true;
+        },
+        handleDownload(file) {
+            console.log(file);
+        },
+        // 查看当前区域情况
+        seeLoft(node) {
+            // todo
+        },
+    }
+    ,
+    components: {
+        dialog_referrer_list
+    }
+    }
+    ;
 </script>
 
 <style scoped>