首页的模块

src/Global.js

@@ -6,7 +6,7 @@ companyInfo = {
 };
 
 headapi = process.env.NODE_ENV === 'development' ? './api/' : '../';
- // headapi =  '/api/';
+// headapi =  '/api/';
 
 // 左侧隐藏
 left_panel_state = function (state) {
@@ -61,7 +61,7 @@ globalfmtDate = function (datetime, length) {
 };
 
 // 去掉T格式化时间，截取制定长度
-globalfmtDate2 = function (datetime,start,length) {
+globalfmtDate2 = function (datetime, start, length) {
     if ((datetime == '') || (datetime == undefined))
         return '';
     if ((datetime == '1900-01-01') || (datetime == '1900-01-01 00:00:00.000'))
@@ -96,7 +96,7 @@ globalValid = function (data, mins, maxs, text, that) {
     let max = parseInt(maxs);
     let dispalyMin = min + 1;
     let title = '警告';
-    if (thisVal == '' ) {
+    if (thisVal == '') {
         that.$message({
             message: text + '不能为空！',
             type: 'warning'
@@ -139,18 +139,18 @@ globaltime2String = function (time) {
     return year + "-" + month + "-" + date;
 };
 
-nonTfmtDate = function (datetime,length) {
+nonTfmtDate = function (datetime, length) {
     if ((datetime == '') || (datetime == undefined))
         return '';
     if ((datetime == '1900-01-01') || (datetime == '1900-01-01 00:00:00.000'))
         return '';
-    length = !length ? 10: length;//缺省参数
-    datetime = new Date(+new Date(datetime)+8*3600*1000).toISOString().replace(/T/g,' ').replace(/\.[\d]{3}Z/,'');
+    length = !length ? 10 : length;//缺省参数
+    datetime = new Date(+new Date(datetime) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '');
     return datetime
 };
 
 // 校验MAC地址
-checkMac = function(val){
+checkMac = function (val) {
     var regex = "(([A-Fa-f0-9]{2}-){5}[A-Fa-f0-9]{2})|(([A-Fa-f0-9]{2}:){5}[A-Fa-f0-9]{2})"; // 含冒号
     var regexp = new RegExp(regex);
     if (!regexp.test(val)) {
@@ -184,3 +184,146 @@ pageOptions = function () {
     return option
 };
 
+// 协议选项
+WirelessType = function () {
+    let option = [
+        {
+            value: 1,
+            label: '移动GSM'
+        }, {
+            value: 2,
+            label: '联通GSM'
+        }, {
+            value: 3,
+            label: '电信CDMA'
+        }, {
+            value: 4,
+            label: '移动3G'
+        }, {
+            value: 5,
+            label: '联通3G'
+        }, {
+            value: 6,
+            label: '移动4G'
+        }, {
+            value: 7,
+            label: '联通4G'
+        }, {
+            value: 8,
+            label: '电信4G'
+        }, {
+            value: 9,
+            label: '433M/315M'
+        }, {
+            value: 10,
+            label: 'WIFI2.4G'
+        }, {
+            value: 11,
+            label: 'ISM2.4G'
+        }, {
+            value: 12,
+            label: '800M'
+        },
+    ];
+    return option
+};
+
+filterWirelessType = function (value) {
+    switch (parseInt(value)) {
+        case 0:
+            return "未知";
+            break;
+        case 1:
+            return "移动GSM";
+            break;
+        case 2:
+            return "联通GSM";
+            break;
+        case 3:
+            return "电信CDMA";
+            break;
+        case 4:
+            return "移动3G";
+            break;
+        case 5:
+            return "联通3G";
+            break;
+        case 6:
+            return "移动4G";
+            break;
+        case 7:
+            return "联通4G";
+            break;
+        case 8:
+            return "电信4G";
+            break;
+        case 9:
+            return "433M/315M";
+            break;
+        case 10:
+            return "WIFI2.4G";
+            break;
+        case 11:
+            return "ISM2.4G";
+            break;
+        case 12:
+            return "800M";
+            break;
+    }
+};
+
+WirelessRange = function () {
+    let option = [
+        {
+            value: 1,
+            label: '20cm'
+        }, {
+            value: 2,
+            label: '50cm'
+        }, {
+            value: 3,
+            label: '1M'
+        }, {
+            value: 4,
+            label: '3M'
+        }, {
+            value: 5,
+            label: '5M'
+        },
+    ];
+    return option
+};
+
+filterDetctorType = function (value) {
+    switch (parseInt(value)) {
+        case 0:
+            return "未知设备";
+            break;
+        case 1:
+            return "摄像头";
+            break;
+        case 2:
+            return "wifi热点";
+            break;
+        case 3:
+            return "手机";
+            break;
+        case 4:
+            return "其他设备";
+            break;
+    }
+};
+// 时间戳
+filterTimeToString = function (value) {
+    let date = new Date(value);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
+    let year = date.getFullYear(),
+        month = ("0" + (date.getMonth() + 1)).slice(-2),
+        sdate = ("0" + date.getDate()).slice(-2),
+        hour = ("0" + date.getHours()).slice(-2),
+        minute = ("0" + date.getMinutes()).slice(-2),
+        second = ("0" + date.getSeconds()).slice(-2);
+    // 拼接
+    let result = year + "-" + month + "-" + sdate + " " + hour + ":" + minute + ":" + second;
+    // 返回
+    return result;
+}

src/api/getApiRes.js

@@ -121,3 +121,28 @@ export function DetectorList(postdata) {
     let url = headapi + 'v1/Detector/List';
     return getApiBasic(url, postdata);
 }
+// 检测设备列表
+export function Region06G(postdata) {
+    let url = headapi + 'v1/Index/Region06G';
+    return getApiBasic(url, postdata);
+}
+// 区域wifi信道信息
+export function WifiChannel(postdata) {
+    let url = headapi + 'v1/Index/WifiChannel';
+    return getApiBasic(url, postdata);
+}
+// 区域监控平面
+export function MonitorArea(postdata) {
+    let url = headapi + 'v1/Index/MonitorArea';
+    return getApiBasic(url, postdata);
+}
+// 实时监控详情
+export function NetDevMonitor(postdata) {
+    let url = headapi + 'v1/Index/NetDevMonitor';
+    return getApiBasic(url, postdata);
+}
+// 探测设备工作监控
+export function WirelessMonitor(postdata) {
+    let url = headapi + 'v1/Index/WirelessMonitor';
+    return getApiBasic(url, postdata);
+}

src/assets/css/panel.css

@@ -23,7 +23,7 @@
     overflow: hidden;
     display: block;
     margin: 0 auto;
-    background: rgba(0,15,42,0.6);
+    background: rgba(27,86,200,0.14);
     padding: 0px;
     border: none;
 }
@@ -97,12 +97,12 @@
     margin-left: 39px;
 }
 .panel .panel_control {
-    width: 100%;
+    width: 98%;
     overflow: hidden;
     display: block;
     margin: 0 auto;
     background: rgba(27,86,200,0.14);
-    padding: 29px 39px;
+    padding: 29px 1%;
     color: #6DC1FF;
 }
 .el-card__body {
@@ -112,6 +112,8 @@
     width: 70px;
     float: left;
     text-align: right;
+    color: #fff;
+    font-size: 14px;
 }
 
 .table_container {
@@ -312,7 +314,7 @@
 .el-button--primary {
     background: none;
     border: 1px solid #005EA2;
-    color: #6DC1FF;
+    color: #fff;
 }
 .el-pagination.is-background .btn-next.disabled, .el-pagination.is-background .btn-next:disabled, .el-pagination.is-background .btn-prev.disabled, .el-pagination.is-background .btn-prev:disabled, .el-pagination.is-background .el-pager li.disabled {
     color: #6DC1FF;
@@ -342,35 +344,38 @@
     display: block;
     margin: 0 auto;
     margin-top: 10px;
-    margin-bottom: 10px;
+    margin-bottom: 0px;
+    list-style: none;
+    margin-left: 0;
+    padding-left: 0;
 }
 .tabs li {
     width: 164px;
     height: 36px;
     font-size: 16px;
     line-height: 36px;
-    color: #6DC1FF;
+    color: #00FEFF;
     float: left;
     text-align: center;
     cursor: pointer;
     list-style: none;
 }
 .tabs li.active {
-    background: url("../../assets/img/op_title.png")top center no-repeat;
-    background-size: 100%;
+    background: url("../../assets/img/comm/op_title.png")top center no-repeat;
+    background-size: 100% 100%;
 }
 .el-date-editor .el-range__icon {
     display: none;
 }
 .el-date-editor .el-range-input {
     background: none;
-    color: #6DC1FF;
+    color: #fff;
 }
 .el-date-editor .el-range-input::placeholder {
-    color: #5391c1;
+    color: #fff;
 }
 .panel /deep/ .el-date-editor .el-range-separator {
-    color:  #6DC1FF;
+    color:  #fff;
     line-height: 20px;
 }
 .el-date-editor .el-range__close-icon {
@@ -405,3 +410,17 @@
 /deep/ .el-table__empty-text {
     color: #015B9E;
 }
+.pline {
+    float: left;
+    margin-right: 10px;
+}
+.pline em {
+    float: left;
+    text-decoration: none;
+    font-style: normal;
+    line-height: 40px;
+    margin-right: 5px;
+}
+.pull-right {
+    float: right;
+}

src/components/BigRader.vue

@@ -20,14 +20,14 @@
             <div class="zoom8" v-if="RaderState == 0">
                 <img src="../assets/img/bigRadar2/safe.png" height="47" width="40"/><span class="status">环境安全</span>
             </div>
-            <div class="zoom9" v-if="RaderState == 1">
+            <div class="zoom9" v-if="RaderState >= 1">
                 <img src="../assets/img/main/waning.png" alt="">
                 <span class="warning">发现可疑信号</span>
             </div>
-            <div class="zoom10" v-if="RaderState == 2">
-                <img src="../assets/img/main/danger.png" alt="">
-                <span class="warning">发现高危信号</span>
-            </div>
+            <!--<div class="zoom10" v-if="RaderState == 2">-->
+                <!--<img src="../assets/img/main/danger.png" alt="">-->
+                <!--<span class="warning">发现高危信号</span>-->
+            <!--</div>-->
         </div>
     </div>
 </template>
@@ -42,7 +42,7 @@
                 dotLists: [],
             }
         },
-        props: ['totalRs', 'pageLevel'],
+        props: ['totalRs'],
         mounted() {
             let that = this;
         },
@@ -50,7 +50,12 @@
         watch: {
             totalRs: function (val) {
                 let that = this;
-                that.RaderState = val.DetRs[0].WarnNum;
+                console.log(val);
+                if (val.Rs.Data) {
+                    that.RaderState = val.Rs.Data.length;
+                } else {
+                    that.RaderState = 0
+                }
             },
         },
     }
@@ -293,6 +298,7 @@
         text-align: center;
         font-size: 14px;
     }
+
     .zoom9 img {
         margin: 0 auto;
         margin-top: 50px;
@@ -305,6 +311,7 @@
         font-size: 14px;
         text-align: center;
     }
+
     .zoom10 {
         position: relative;
         bottom: 175px;
@@ -321,6 +328,7 @@
         text-align: center;
         font-size: 14px;
     }
+
     .zoom10 img {
         margin: 0 auto;
         margin-top: 50px;

src/components/DetcotrRecord.vue

@@ -0,0 +1,320 @@
+<template>
+    <div class="historyRecord">
+        <div class="">
+            <div class="sum-title">
+                {{detctorRs.Title}}
+            </div>
+            <span class="link" @click="link(detctorRs.Url)">
+                more+
+            </span>
+            <el-table
+                    :data="tableData"
+                    stripe
+                    :default-sort="{prop: 'date', order: 'descending'}"
+                    style="width: 100%">
+                <el-table-column
+                        prop="DetectorName"
+                        label="探测器"
+                        align="center"
+                >
+                </el-table-column>
+                <el-table-column
+                        prop="WirelessType"
+                        label="类型"
+                        sortable
+                        :formatter="filterWirelessTypeName"
+                >
+                </el-table-column>
+                <el-table-column
+                        prop="UpdateAtMilleSec"
+                        label="时间"
+                        width="160"
+                        align="center"
+                        sortable
+                        :formatter="filterTime"
+                >
+                </el-table-column>
+
+            </el-table>
+            <br>
+            <div v-show="allTableData.length != 0">
+                <el-pagination
+                        background
+                        layout="prev, pager, next"
+                        :total="pageination.total"
+                        :page-size="pageination.pageItem"
+                        @current-change="pageChange"
+                ></el-pagination>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    import Global from '../Global.js'
+
+    export default {
+        data() {
+            return {
+                pageination: {
+                    pageItem: 8,
+                    pageoptions: pageOptions(),
+                    total: 30,
+                    pageIndex: 1,
+                },
+                draw: 1,
+                start: 0,
+                recordsTotal: 0,
+                tableData: [],
+                allTableData: [],
+                limit: '9',
+                multipleSort: false,
+                loading: true,
+                fileList: [],
+                multipleSelection: [],
+                detectedmac: '',
+            }
+        },
+        props: ['detctorRs'],
+        watch: {
+            detctorRs: {
+                handler(val, oldName) {
+                    this.loading = false;
+                    if (!val.Rs) {
+                        this.allTableData = [];
+                        this.recordsTotal = 0;
+                    } else {
+                        this.allTableData = val.Rs;
+                        console.log(this.allTableData);
+                        this.recordsTotal = val.Rs.length;
+                    }
+                    // 设置分页数据
+                    this.setPaginations();
+                },
+                deep: true,
+                immediate: true
+            },
+        },
+        methods: {
+            link(url) {
+                this.$router.push({path: url, query: {x: 0}});
+            },
+            // 设置分页数据
+            setPaginations() {
+                // 分页属性
+                let that = this;
+                that.pageination.total = that.recordsTotal;
+                // 默认分页
+                that.tableData = that.allTableData.filter((item, index) => {
+                    return index < that.pageination.pageItem;
+                });
+            },
+            // 每页显示数量
+            handleSizeChange() {
+                let that = this;
+                that.tableData = that.allTableData.filter((item, index) => {
+                    return index < that.pageination.pageItem;
+                });
+                that.draw = that.pageination.pageItem;
+            },
+            // 翻页
+            pageChange(pageIndex) {
+                let that = this;
+                // 获取当前页
+                let index = that.pageination.pageItem * (pageIndex - 1);
+                // 数据总数
+                let nums = that.pageination.pageItem * pageIndex;
+                // 容器
+                let tables = [];
+                for (var i = index; i < nums; i++) {
+                    if (that.allTableData[i]) {
+                        tables.push(that.allTableData[i])
+                    }
+                    this.tableData = tables;
+                }
+                that.start = index * that.draw;
+            },
+            // 自动排序
+            sortChange(params) {
+                console.log(params)
+            },
+            // 过滤设备类型
+            filterWirelessTypeName(value) {
+                return filterWirelessType(value.WirelessType);
+            },
+            filterTime(value) {
+                return filterTimeToString(value.UpdateAtMilleSec);
+            }
+        }
+        ,
+    }
+</script>
+
+<style scoped>
+    .historyRecord {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .sum-title {
+        width: 150px;
+        height: 36px;
+        font-size: 16px;
+        line-height: 36px;
+        color: #6DC1FF;
+        margin: 0 auto;
+        text-align: center;
+        background: url("../assets/img/main/tit.png") top center no-repeat;
+        background-size: 100%;
+    }
+
+    .link {
+        position: relative;
+        bottom: 20px;
+        float: right;
+        color: #6DC1FF;
+        margin-right: 10px;
+        cursor: pointer;
+    }
+
+    .el-table {
+        position: relative;
+        bottom: 20px;
+        width: 100%;
+        height: 110px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 0px;
+        font-size: 14px;
+        color: #6DC1FF;
+    }
+
+    .el-table, .el-table__expanded-cell {
+        background: none;
+    }
+
+    /deep/ .el-table th, /deep/ .el-table tr {
+        background: none;
+        color: #6DC1FF;
+        border: none;
+    }
+
+    /deep/ .el-table td, /deep/ .el-table th.is-leaf {
+        border: none;
+    }
+
+    /deep/ .el-button--primary.is-active, /deep/ .el-button--primary:active, /deep/ .el-button--primary {
+        background: none;
+        border: 1px solid #005EA2;
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-button--primary {
+        background: none;
+        border: 1px solid #005EA2;
+        color: #6DC1FF;
+    }
+
+    .el-table--border::after, .el-table--group::after, .el-table::before {
+        display: none;
+    }
+
+    .el-pagination.is-background .btn-next.disabled, /deep/ .el-pagination.is-background .btn-next:disabled, /deep/ .el-pagination.is-background .btn-prev.disabled, .el-pagination.is-background .btn-prev:disabled, /deep/ .el-pagination.is-background .el-pager li.disabled {
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-pagination.is-background .btn-next, /deep/ .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
+        background-color: #061B44;
+    }
+
+    /deep/ .el-pagination__jump {
+        display: none !important;
+    }
+
+    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+        color: #002540;
+        background-color: #6DC1FF;
+    }
+
+    /deep/ .el-pagination__total {
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td {
+        background: rgba(27, 86, 200, 0.77);
+    }
+
+    /deep/ .el-table--striped .el-table__body tr.el-table__row--striped:hover > td {
+        background: rgba(27, 86, 200, 0.77);
+    }
+
+    /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td {
+        background: rgba(27, 86, 200, 0.14);
+    }
+
+    /deep/ .has-gutter th {
+        /*background: rgba(0, 23, 67, 0.8) !important;*/
+        font-weight: normal;
+    }
+
+    /deep/ .el-table .cell {
+        padding: 3px;
+    }
+
+
+    /deep/ .el-table th {
+        padding: 3px 0;
+    }
+
+    /deep/ .el-table td {
+        padding: 6px 0;
+    }
+
+    /deep/ .number {
+        width: 25px;
+        height: 25px;
+        line-height: 25px;
+        min-width: 25px;
+    }
+
+    i.blue {
+        width: 10px;
+        height: 10px;
+        float: left;
+        background: #6DC1FF;
+        margin-top: 6px;
+        margin-right: 5px;
+        border-radius: 250px;
+    }
+
+    i.yellow {
+        width: 10px;
+        height: 10px;
+        float: left;
+        margin-top: 6px;
+        margin-right: 5px;
+        background: #FFDD00;
+        border-radius: 250px;
+    }
+
+    /deep/ .el-table .sort-caret {
+        color: #6DC1FF !important;
+    }
+
+    /deep/ .el-table__empty-text {
+        color: #015B9E;
+    }
+
+    /deep/ .el-pagination.is-background .btn-next,
+    /deep/ .el-pagination.is-background .btn-prev {
+        background: #002540;
+    }
+
+    /deep/ .el-pagination.is-background .el-pager li {
+        background: #002540;
+    }
+
+</style>

src/components/RunTimeRecord.vue

@@ -0,0 +1,334 @@
+<template>
+    <div class="historyRecord">
+        <div class="">
+            <div class="sum-title">
+                {{runtimeRs.Title}}
+            </div>
+            <span class="link" @click="link(runtimeRs.Url)">
+                more+
+            </span>
+            <el-table
+                    :data="tableData"
+                    stripe
+                    :default-sort="{prop: 'date', order: 'descending'}"
+                    style="width: 100%">
+                <el-table-column
+                        prop="ComName"
+                        label="品牌"
+                        width="140"
+                        align="center"
+                >
+                    <template slot-scope="scope">
+                        <el-tooltip class="item" effect="dark" :content="scope.row.ComName" placement="top-start">
+                            <span>
+                                    {{ scope.row.ComName.length > 6 ?  scope.row.ComName.substr(0,9)+'...' : scope.row.ComName }}
+                            </span>
+                            <span v-if="!scope.row.ComName">未知品牌</span>
+                        </el-tooltip>
+                    </template>
+                </el-table-column>
+                <el-table-column
+                        prop="DetectorName"
+                        label="探测器"
+                >
+                </el-table-column>
+                <el-table-column
+                        prop="Type"
+                        label="类型"
+                        sortable
+                        :formatter="filterType"
+                >
+                </el-table-column>
+                <el-table-column
+                        prop="UpdateAtMilleSec"
+                        label="时间"
+                        width="160"
+                        align="center"
+                        sortable
+                        :formatter="filterTime"
+                >
+                </el-table-column>
+
+            </el-table>
+            <br>
+            <div v-show="allTableData.length != 0">
+                <el-pagination
+                        background
+                        layout="prev, pager, next"
+                        :total="pageination.total"
+                        :page-size="pageination.pageItem"
+                        @current-change="pageChange"
+                ></el-pagination>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    import Global from '../Global.js'
+
+    export default {
+        data() {
+            return {
+                pageination: {
+                    pageItem: 8,
+                    pageoptions: pageOptions(),
+                    total: 30,
+                    pageIndex: 1,
+                },
+                draw: 1,
+                start: 0,
+                recordsTotal: 0,
+                tableData: [],
+                allTableData: [],
+                limit: '9',
+                multipleSort: false,
+                loading: true,
+                fileList: [],
+                multipleSelection: [],
+                detectedmac: '',
+            }
+        },
+        props: ['runtimeRs'],
+        watch: {
+            runtimeRs: {
+                handler(val, oldName) {
+                    this.loading = false;
+                    if (!val.Rs) {
+                        this.allTableData = [];
+                        this.recordsTotal = 0;
+                    } else {
+                        this.allTableData = val.Rs;
+                        console.log(this.allTableData);
+                        this.recordsTotal = val.Rs.length;
+                    }
+                    // 设置分页数据
+                    this.setPaginations();
+                },
+                deep: true,
+                immediate: true
+            },
+        },
+        methods: {
+            link(url) {
+                this.$router.push({path: url, query: {x: 0}});
+            },
+            // 设置分页数据
+            setPaginations() {
+                // 分页属性
+                let that = this;
+                that.pageination.total = that.recordsTotal;
+                // 默认分页
+                that.tableData = that.allTableData.filter((item, index) => {
+                    return index < that.pageination.pageItem;
+                });
+            },
+            // 每页显示数量
+            handleSizeChange() {
+                let that = this;
+                that.tableData = that.allTableData.filter((item, index) => {
+                    return index < that.pageination.pageItem;
+                });
+                that.draw = that.pageination.pageItem;
+            },
+            // 翻页
+            pageChange(pageIndex) {
+                let that = this;
+                // 获取当前页
+                let index = that.pageination.pageItem * (pageIndex - 1);
+                // 数据总数
+                let nums = that.pageination.pageItem * pageIndex;
+                // 容器
+                let tables = [];
+                for (var i = index; i < nums; i++) {
+                    if (that.allTableData[i]) {
+                        tables.push(that.allTableData[i])
+                    }
+                    this.tableData = tables;
+                }
+                that.start = index * that.draw;
+            },
+            // 自动排序
+            sortChange(params) {
+                console.log(params)
+            },
+            // 过滤设备类型
+            filterType(value) {
+                return filterDetctorType(value.Type);
+            },
+            filterTime(value) {
+                return filterTimeToString(value.UpdateAtMilleSec);
+            }
+        }
+        ,
+    }
+</script>
+
+<style scoped>
+    .historyRecord {
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .sum-title {
+        width: 150px;
+        height: 36px;
+        font-size: 16px;
+        line-height: 36px;
+        color: #6DC1FF;
+        margin: 0 auto;
+        text-align: center;
+        background: url("../assets/img/main/tit.png") top center no-repeat;
+        background-size: 100%;
+    }
+
+    .link {
+        position: relative;
+        bottom: 20px;
+        float: right;
+        color: #6DC1FF;
+        margin-right: 10px;
+        cursor: pointer;
+    }
+
+    .el-table {
+        position: relative;
+        bottom: 20px;
+        width: 100%;
+        height: 110px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        margin-top: 0px;
+        font-size: 14px;
+        color: #6DC1FF;
+    }
+
+    .el-table, .el-table__expanded-cell {
+        background: none;
+    }
+
+    /deep/ .el-table th, /deep/ .el-table tr {
+        background: none;
+        color: #6DC1FF;
+        border: none;
+    }
+
+    /deep/ .el-table td, /deep/ .el-table th.is-leaf {
+        border: none;
+    }
+
+    /deep/ .el-button--primary.is-active, /deep/ .el-button--primary:active, /deep/ .el-button--primary {
+        background: none;
+        border: 1px solid #005EA2;
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-button--primary {
+        background: none;
+        border: 1px solid #005EA2;
+        color: #6DC1FF;
+    }
+
+    .el-table--border::after, .el-table--group::after, .el-table::before {
+        display: none;
+    }
+
+    .el-pagination.is-background .btn-next.disabled, /deep/ .el-pagination.is-background .btn-next:disabled, /deep/ .el-pagination.is-background .btn-prev.disabled, .el-pagination.is-background .btn-prev:disabled, /deep/ .el-pagination.is-background .el-pager li.disabled {
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-pagination.is-background .btn-next, /deep/ .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
+        background-color: #061B44;
+    }
+
+    /deep/ .el-pagination__jump {
+        display: none !important;
+    }
+
+    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+        color: #002540;
+        background-color: #6DC1FF;
+    }
+
+    /deep/ .el-pagination__total {
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td {
+        background: rgba(27, 86, 200, 0.77);
+    }
+
+    /deep/ .el-table--striped .el-table__body tr.el-table__row--striped:hover > td {
+        background: rgba(27, 86, 200, 0.77);
+    }
+
+    /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td {
+        background: rgba(27, 86, 200, 0.14);
+    }
+
+    /deep/ .has-gutter th {
+        /*background: rgba(0, 23, 67, 0.8) !important;*/
+        font-weight: normal;
+    }
+
+    /deep/ .el-table .cell {
+        padding: 3px;
+    }
+
+
+    /deep/ .el-table th {
+        padding: 3px 0;
+    }
+
+    /deep/ .el-table td {
+        padding: 6px 0;
+    }
+
+    /deep/ .number {
+        width: 25px;
+        height: 25px;
+        line-height: 25px;
+        min-width: 25px;
+    }
+
+    i.blue {
+        width: 10px;
+        height: 10px;
+        float: left;
+        background: #6DC1FF;
+        margin-top: 6px;
+        margin-right: 5px;
+        border-radius: 250px;
+    }
+
+    i.yellow {
+        width: 10px;
+        height: 10px;
+        float: left;
+        margin-top: 6px;
+        margin-right: 5px;
+        background: #FFDD00;
+        border-radius: 250px;
+    }
+
+    /deep/ .el-table .sort-caret {
+        color: #6DC1FF !important;
+    }
+
+    /deep/ .el-table__empty-text {
+        color: #015B9E;
+    }
+
+    /deep/ .el-pagination.is-background .btn-next,
+    /deep/ .el-pagination.is-background .btn-prev {
+        background: #002540;
+    }
+
+    /deep/ .el-pagination.is-background .el-pager li {
+        background: #002540;
+    }
+
+</style>

src/components/Scan.vue

@@ -7,6 +7,9 @@
             <div class="line">
                 <ve-line :data="chartData" width="100%" height="230px" :loading="loading" :legend-visible="false"
                          :extend="chartExtend"></ve-line>
+                <div class="null_state" v-if="chartData.rows == ''">
+                    暂无
+                </div>
             </div>
         </div>
     </div>
@@ -21,7 +24,6 @@
             return {
                 days: 13,
                 loading: true,
-
                 chartData: {
                     columns: ['X', 'Y'],
                     rows: []
@@ -110,7 +112,14 @@
         watch: {
             ScanRs: function (val) {
                 let that = this;
-                that.chartData.rows = val.Rs
+                if (val.Rs[0].X == null) {
+                    that.chartData.rows = [];
+                } else {
+                    val.Rs.forEach(function (item) {
+                        item.X = parseFloat(item.X / 1000 / 1000 / 1000).toFixed(2).toString() + "G"
+                    });
+                    that.chartData.rows =  val.Rs;
+                }
             },
         },
     }
@@ -142,4 +151,19 @@
         position: relative;
         top: -40px;
     }
+
+    .null_state {
+        width: 60px;
+        height: 60px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        background: url("../assets/img/main/null_state.png") top center no-repeat;
+        background-size: 100%;
+        color: #fff;
+        font-size: 16px;
+        text-align: center;
+        line-height: 70px;
+        margin-top: 60px;
+    }
 </style>

src/components/Task.vue

@@ -27,7 +27,7 @@
                 <el-col :span="24">
                     <el-col :span="6"><em class="label">无线协议</em></el-col>
                     <el-col :span="18">
-                        <el-select v-model="scan.agreement" placeholder="请选择">
+                        <el-select v-model="scan.agreement"  multiple  placeholder="请选择">
                             <el-option
                                     v-for="item in agreement_options"
                                     :key="item.value"
@@ -52,7 +52,7 @@
                 <el-col :span="24">
                     <el-col :span="6"><em class="label">扫描距离</em></el-col>
                     <el-col :span="18">
-                        <el-select v-model="scan.distance" placeholder="请选择">
+                        <el-select v-model="scan.distance"  placeholder="请选择">
                             <el-option
                                     v-for="item in distance_options"
                                     :key="item.value"
@@ -103,10 +103,10 @@
                 checked: true,
                 scan: {
                     tactics: 0,
-                    agreement: 0,
+                    agreement: [],
                     begin: 0,
                     end: 0,
-                    distance: 0,
+                    distance: 1,
                     cycle: 0,
                 },
                 result: {
@@ -120,29 +120,8 @@
                         label: '自定义扫描'
                     }
                 ],
-                agreement_options: [
-                    {
-                        value: 0,
-                        label: '中国移动GSM'
-                    }
-                ], distance_options: [
-                    {
-                        value: 0,
-                        label: '全覆盖'
-                    }, {
-                        value: 5,
-                        label: '5cm'
-                    }, {
-                        value: 20,
-                        label: '20cm'
-                    }, {
-                        value: 50,
-                        label: '50cm'
-                    }, {
-                        value: 100,
-                        label: '1m'
-                    }
-                ],
+                agreement_options: WirelessType(),
+                distance_options: WirelessRange(),
                 value: ''
             }
         },

src/components/WifiSign.vue

@@ -7,6 +7,9 @@
             <div class="histogram">
                 <ve-histogram :data="chartData" width="100%" height="230px" :loading="loading" :legend-visible="false"
                               :extend="chartExtend"></ve-histogram>
+                <div class="null_state" v-if="chartData.rows == ''">
+                    暂无
+                </div>
             </div>
         </div>
     </div>
@@ -21,9 +24,7 @@
                 loading: false,
                 chartData: {
                     columns: ['X', 'Y'],
-                    rows: [
-
-                    ]
+                    rows: []
                 },
                 chartExtend: {
                     color: ['#72FF99'],
@@ -90,8 +91,16 @@
         watch: {
             WifiRs: function (val) {
                 let that = this;
-                that.chartData.rows =  val.Rs;
-                console.log(val.Rs);
+                if (val.Rs[0].X == null) {
+                    that.chartData.rows = [];
+                } else {
+                    val.Rs.forEach(function (item) {
+                        item.X = "频道" + item.X
+                        // item.X = parseInt(item.X / 1000 / 1000).toString() + "M"
+                    });
+                    that.chartData.rows = val.Rs;
+                }
+
             },
         },
     }
@@ -118,8 +127,24 @@
         background: url("../assets/img/main/tit.png") top center no-repeat;
         background-size: 100%;
     }
+
     .histogram {
         position: relative;
         top: -40px;
     }
+
+    .null_state {
+        width: 60px;
+        height: 60px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        background: url("../assets/img/main/null_state.png") top center no-repeat;
+        background-size: 100%;
+        color: #fff;
+        font-size: 16px;
+        text-align: center;
+        line-height: 70px;
+        margin-top: 60px;
+    }
 </style>

src/components/signMap.vue

@@ -18,7 +18,7 @@
             </div>
             <div class="signMapListBg">
                 <span v-for="s in scan"
-                      :style="{ left: s.x*0.8+'PX', top: s.y+'PX'}"
+                      :style="{ left: s.X*0.8+'PX', top: s.Y+'PX'}"
                 >
                       <el-popover
                               placement="top-start"
@@ -28,20 +28,49 @@
                               content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
                         <div slot="reference">
                              <em class="types">
-                                        <img src="../assets/img/main/cam.png" height="54" width="54" v-if="s.type == 1"/>
+                                 <img src="../assets/img/signMap/ydgsm.png" height="54" width="54"
+                                      v-if="s.WirelessType == 1"/>
+                                 <img src="../assets/img/signMap/ltgsm.png" height="54" width="54"
+                                      v-if="s.WirelessType == 2"/>
+                                 <img src="../assets/img/signMap/dxcdma.png" height="54" width="54"
+                                      v-if="s.WirelessType == 3"/>
+                                 <img src="../assets/img/signMap/yd3g.png" height="54" width="54"
+                                      v-if="s.WirelessType == 4"/>
+                                 <img src="../assets/img/signMap/lt3g.png" height="54" width="54"
+                                      v-if="s.WirelessType == 5"/>
+                                 <img src="../assets/img/signMap/yd4g.png" height="54" width="54"
+                                      v-if="s.WirelessType == 6"/>
+                                 <img src="../assets/img/signMap/lt4g.png" height="54" width="54"
+                                      v-if="s.WirelessType == 7"/>
+                                 <img src="../assets/img/signMap/dx4g.png" height="54" width="54"
+                                      v-if="s.WirelessType == 8"/>
+                                 <img src="../assets/img/signMap/433M.png" height="54" width="54"
+                                      v-if="s.WirelessType == 9"/>
+                                 <img src="../assets/img/signMap/wifi.png" height="54" width="54"
+                                      v-if="s.WirelessType == 10"/>
+                                 <img src="../assets/img/signMap/ism.png" height="54" width="54"
+                                      v-if="s.WirelessType == 11"/>
+                                 <img src="../assets/img/signMap/800M.png" height="54" width="54"
+                                      v-if="s.WirelessType == 12"/>
                                         </em>
-                                        <s>{{s.name}}  {{s.type | typeName}}</s>
+                                <s :class="[
+                                {'yd':s.WirelessType == 1 || s.WirelessType == 4 || s.WirelessType == 6},
+                                {'lt':s.WirelessType == 2 || s.WirelessType == 5 || s.WirelessType == 7},
+                                {'dx':s.WirelessType == 3 || s.WirelessType == 8 },
+                                {'qt':s.WirelessType == 9 || s.WirelessType == 10 || s.WirelessType == 11|| s.WirelessType == 12},
+                                ]"
+                                >{{s.WirelessType | typeName}}</s>
                         </div>
                      </el-popover>
                 </span>
             </div>
             <div class="right_rule">
                 <span>0</span>
-                <span v-for="i in 24" v-if="i % 2 == 0">{{i}}</span>
+                <span v-for="i in XMax" v-if="i % xLimit == 0">{{i}}</span>
             </div>
             <div class="bottom_rule">
                 <span>0</span>
-                <span v-for="i in 56" v-if="i % 2 == 0">{{i}}</span>
+                <span v-for="i in YMax" v-if="i % yLimit == 0">{{i}}</span>
             </div>
         </div>
     </div>
@@ -54,22 +83,25 @@
                 screen_full: false,
                 checked: true,
                 full_state: false,
-                scan: [
-                    {name: '小米', type: 1, x: 10, y: 120, level: 3},
-                    {name: '小米', type: 1, x: 23, y: 133, level: 3},
-                    {name: '小米', type: 1, x: 144, y: 12, level: 3},
-                    {name: '小米', type: 1, x: 31, y: 141, level: 3},
-                ],
-
+                scan: [],
+                XMax: 24,
+                YMax: 56,
+                xLimit: 2,
+                yLimit: 2,
             }
         },
-        watch: {},
-        mounted() {
-            this.init()
+        props: ['signList'],
+        watch: {
+            signList: function (val) {
+                // console.log(val);
+                this.scan = val.Rs.Data;
+                this.XMax = val.Rs.XMax;
+                this.YMax = val.Rs.YMax;
+                this.xLimit = parseInt(this.XMax / 12);
+                this.yLimit = parseInt(this.YMax / 28);
+            },
         },
         methods: {
-            init() {
-            },
             // 全屏
             full_screen() {
                 this.screen_full = true;
@@ -107,22 +139,9 @@
         },
         filters: {
             typeName: function (value) {
-                switch (parseInt(value)) {
-                    case 0:
-                        return "其他设备";
-                        break;
-                    case 1:
-                        return "摄像头";
-                        break;
-                    case 2:
-                        return "路由器";
-                        break;
-                    case 3:
-                        return "手机";
-                        break;
-                }
+                return filterWirelessType(value)
             },
-        }
+        },
     }
 </script>
 
@@ -261,10 +280,27 @@
         -webkit-animation-fill-mode: both;
         animation-fill-mode: both
     }
+
     .signMap s {
         color: #72FF99;
     }
 
+    s.yd {
+        color: #72FF99;
+    }
+
+    s.lt {
+        color: #FFB06B;
+    }
+
+    s.dx {
+        color: #00FEFF;
+    }
+
+    s.qt {
+        color: #FFE853;
+    }
+
     @-webkit-keyframes twinkling {
         0% {
             opacity: 0.5;

src/views/Equip.vue

@@ -10,34 +10,46 @@
         <div class="panel">
             <div class="panel-body">
                 <div class=" panel_control">
-                    <el-row :gutter="24">
-                        <el-col :span="5">
-                            <em>标签名:</em>
-                            <el-input v-model="panel.tagname" placeholder="请输入标签名"></el-input>
-                        </el-col>
-                        <el-col :span="5">
-                            <em>所属区域:</em>
-                            <el-select v-model="panel.regionid">
-                                <el-option
-                                        v-for="item in panel.regionidOptions"
-                                        :key="item.Id"
-                                        :label="item.DisplayName"
-                                        :value="item.Id">
-                                </el-option>
-                            </el-select>
-                        </el-col>
-                        <el-col :span="4">
-                            <el-button size="small" type="primary" @click="query">查询</el-button>
-                        </el-col>
-                    </el-row>
+                    <div class="pline">
+                        <em>设备ID:</em>
+                        <el-input v-model="panel.tagname" placeholder=""></el-input>
+                    </div>
+                    <div class="pline">
+                        <em>MAC地址:</em>
+                        <el-input v-model="panel.tagname" placeholder=""></el-input>
+                    </div>
+                    <div class="pline">
+                        <em>所属区域:</em>
+                        <el-select v-model="panel.regionid">
+                            <el-option
+                                    v-for="item in panel.regionidOptions"
+                                    :key="item.Id"
+                                    :label="item.DisplayName"
+                                    :value="item.Id">
+                            </el-option>
+                        </el-select>
+                    </div>
+                    <div class="pline">
+                        <em>登记时间:</em>
+                        <el-date-picker
+                                v-model="panel.time1"
+                                type="daterange"
+                                range-separator="至"
+                                start-placeholder="开始日期"
+                                end-placeholder="结束日期">
+                        </el-date-picker>
+                    </div>
+                    <div class="pline">
+                        <el-button size="medium" type="primary" @click="query">查询</el-button>
+                    </div>
+                    <div class="pline pull-right">
+                        <el-button size="medium" type="primary" @click="addList">添加</el-button>
+                        <el-button size="medium" type="primary" @click="editList">修改</el-button>
+                        <el-button size="medium" type="primary" @click="delList">删除</el-button>
+                    </div>
                 </div>
             </div>
         </div>
-        <div class="contorl">
-            <el-button size="small" type="primary" @click="addList">添加</el-button>
-            <el-button size="small" type="primary" @click="editList">修改</el-button>
-            <el-button size="small" type="primary" @click="delList">删除</el-button>
-        </div>
         <el-table
                 :data="tableData"
                 is-horizontal-resize
@@ -171,30 +183,6 @@
                         </label>
                         <el-input v-model="dialog.tagname"></el-input>
                     </el-col>
-                    <!--<el-col :span="12">-->
-                    <!--<label>-->
-                    <!--硬件版本-->
-                    <!--</label>-->
-                    <!--<el-input v-model="dialog.HardwareVersion"></el-input>-->
-                    <!--</el-col>-->
-                    <!--<el-col :span="12">-->
-                    <!--<label>-->
-                    <!--esp固件版本-->
-                    <!--</label>-->
-                    <!--<el-input v-model="dialog.FirmwareVersion"></el-input>-->
-                    <!--</el-col>-->
-                    <!--<el-col :span="12">-->
-                    <!--<label>-->
-                    <!--M4固件版本-->
-                    <!--</label>-->
-                    <!--<el-input v-model="dialog.FirmwareScanM4Version"></el-input>-->
-                    <!--</el-col>-->
-                    <!--<el-col :span="12">-->
-                    <!--<label>-->
-                    <!--M0固件版本-->
-                    <!--</label>-->
-                    <!--<el-input v-model="dialog.FirmwareScanM0Version"></el-input>-->
-                    <!--</el-col>-->
                     <el-col :span="12">
                         <label>
                             购买来源
@@ -292,7 +280,7 @@
                 },
                 tabIndex: 0,
                 tabs: [
-                    {name: '设备管理', url: 'equip'},
+                    {name: '探测设备管理', url: 'equip'},
                 ],
                 // panel 配置项目
                 panel: {
@@ -926,6 +914,7 @@
 
     .tabs ul {
         width: 168px;
+        float: left;
     }
 
     table span {

src/views/Equipbak.vue

@@ -0,0 +1,1018 @@
+<template>
+    <div class="content">
+        <div class="tabs">
+            <ul>
+                <li v-for="(tab,i) in tabs" @click="goTab(tab.url)" :class="{'active':tabIndex == i}">
+                    {{tab.name}}
+                </li>
+            </ul>
+        </div>
+        <div class="panel">
+            <div class="panel-body">
+                <div class=" panel_control">
+                    <el-row :gutter="24">
+                        <el-col :span="5">
+                            <em>标签名:</em>
+                            <el-input v-model="panel.tagname" placeholder="请输入标签名"></el-input>
+                        </el-col>
+                        <el-col :span="5">
+                            <em>所属区域:</em>
+                            <el-select v-model="panel.regionid">
+                                <el-option
+                                        v-for="item in panel.regionidOptions"
+                                        :key="item.Id"
+                                        :label="item.DisplayName"
+                                        :value="item.Id">
+                                </el-option>
+                            </el-select>
+                        </el-col>
+                        <el-col :span="4">
+                            <el-button size="small" type="primary" @click="query">查询</el-button>
+                        </el-col>
+                    </el-row>
+                </div>
+            </div>
+        </div>
+        <div class="contorl">
+            <el-button size="small" type="primary" @click="addList">添加</el-button>
+            <el-button size="small" type="primary" @click="editList">修改</el-button>
+            <el-button size="small" type="primary" @click="delList">删除</el-button>
+        </div>
+        <el-table
+                :data="tableData"
+                is-horizontal-resize
+                :default-sort="{prop: 'date', order: 'descending'}"
+                v-loading="loading"
+                element-loading-background="rgba(0, 0, 0, 0.8)"
+                class=""
+                @selection-change="handleSelectionChange"
+                stripe
+        >
+            <el-table-column
+                    type="selection"
+                    width="55">
+            </el-table-column>
+            <el-table-column
+                    type="index"
+                    label="序号"
+                    width="60"
+                    sortable
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="Mac"
+                    label="Mac"
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="TagName"
+                    label="标签名"
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="Location"
+                    label="位置"
+                    width="260"
+            >
+                <template slot-scope="scope">
+                    <el-tooltip class="item" effect="dark" :content="scope.row.Location" placement="top-start">
+                            <span>
+                                    {{ scope.row.Location.length > 22 ?  scope.row.Location.substr(0,22)+'...' : scope.row.Location }}
+                            </span>
+                    </el-tooltip>
+                </template>
+            </el-table-column>
+            <el-table-column
+                    prop="FirmwareVersion"
+                    label="软件版本"
+                    sortable
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="HardwareVersion"
+                    label="硬件版本"
+                    sortable
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="LastOnline"
+                    label="最近上线"
+                    sortable
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="Dayfind"
+                    label="当日报警"
+                    sortable
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="Memo"
+                    label="备注"
+            >
+            </el-table-column>
+            <el-table-column
+                    prop="Status"
+                    label="状态"
+                    sortable
+            >
+                <template slot-scope="scope">
+                    <span class="red" v-if="scope.row.Status == 0">已禁用</span>
+                    <span v-if="scope.row.Status == 1">已启用</span>
+                    <span class="red" v-if="scope.row.Status == 2">已离线</span>
+                    <span class="yellow" v-if="scope.row.Status == 3">已返厂</span>
+                    <span class="red" v-if="scope.row.Status == 4">已离线</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                    prop="address"
+                    label="操作记录"
+                    width="220"
+            >
+                <template slot-scope="scope">
+                    <el-button class="" type="text" @click="goPhoneRecord(scope.row)">手机信号记录</el-button>
+                    <el-button class="" type="text" @click="goWifiRecord(scope.row)">WiFi记录</el-button>
+                    <!--<el-button class="" type="text" @click="goPoster(scope.row)">时间轴</el-button> 这个需要先不做-->
+                    <el-button v-if="scope.row.Status == 1" class="yellow" type="text" @click="pauseRow(scope.row)">禁用
+                    </el-button>
+                    <el-button v-if="scope.row.Status == 0" class="green" type="text" @click="runRow(scope.row)">启用
+                    </el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <br>
+        <el-pagination
+                background
+                :total="pageination.total"
+                :page-size="pageination.pageItem"
+                @current-change="pageChange"
+        ></el-pagination>
+
+        <!--<el-button class="down_btn" type="primary" @click="goPoster(scope.row)">下载驱动器todo</el-button>-->
+        <dialog_referrer_list
+                :show="dialog_state"
+                :title="dialog_title"
+                :large="true"
+                @dialog_cancel="dialog_cancel"
+                @dialog_ok="dialog_ok"
+        >
+            <div class="dialogContent">
+                <el-row :gutter="24">
+                    <el-col :span="12">
+                        <label>
+                            MAC地址*
+                        </label>
+                        <el-input v-model="dialog.mac" @keyup.native="autoCompleteMac"
+                                  :disabled="dialog_type == 2"></el-input>
+                    </el-col>
+                    <el-col :span="12">
+                        <label>
+                            标签名*
+                        </label>
+                        <el-input v-model="dialog.tagname"></el-input>
+                    </el-col>
+                    <!--<el-col :span="12">-->
+                    <!--<label>-->
+                    <!--硬件版本-->
+                    <!--</label>-->
+                    <!--<el-input v-model="dialog.HardwareVersion"></el-input>-->
+                    <!--</el-col>-->
+                    <!--<el-col :span="12">-->
+                    <!--<label>-->
+                    <!--esp固件版本-->
+                    <!--</label>-->
+                    <!--<el-input v-model="dialog.FirmwareVersion"></el-input>-->
+                    <!--</el-col>-->
+                    <!--<el-col :span="12">-->
+                    <!--<label>-->
+                    <!--M4固件版本-->
+                    <!--</label>-->
+                    <!--<el-input v-model="dialog.FirmwareScanM4Version"></el-input>-->
+                    <!--</el-col>-->
+                    <!--<el-col :span="12">-->
+                    <!--<label>-->
+                    <!--M0固件版本-->
+                    <!--</label>-->
+                    <!--<el-input v-model="dialog.FirmwareScanM0Version"></el-input>-->
+                    <!--</el-col>-->
+                    <el-col :span="12">
+                        <label>
+                            购买来源
+                        </label>
+                        <el-input v-model="dialog.purchasesrc"></el-input>
+                    </el-col>
+                    <el-col :span="12">
+                        <label>
+                            设备所属区域
+                        </label>
+                        <el-select class="selectStyle" ref="regionlevelOne" v-model="dialog.regionId"
+                                   placeholder="请选择所属区域">
+                            <el-option
+                                    v-for="item in dialog.regionlevelOneIdOptions"
+                                    :key="item.Id"
+                                    :label="item.Name"
+                                    :value="item.Id"
+                            >
+                            </el-option>
+                        </el-select>
+                    </el-col>
+                    <el-col :span="12">
+                        <label>
+                            坐标说明
+                        </label>
+                        <el-input v-model="dialog.coords_memo "></el-input>
+                    </el-col>
+                    <el-col :span="12">
+                        <label>
+                            备注
+                        </label>
+                        <el-input v-model="dialog.memo"></el-input>
+                    </el-col>
+                    <el-col :span="24">
+                        <label>
+                            位置标注
+                        </label>
+                        <div class="imgContianer">
+                            <img :src="dialog.plateImgSrc" alt="">
+                            <div class="pointers" @click="addPoint">
+                                <i v-for="point in dialog.points"
+                                   :style="{left:point.x*1+'px',top:point.y * 1+'px'}"></i>
+                            </div>
+                        </div>
+                    </el-col>
+                </el-row>
+            </div>
+        </dialog_referrer_list>
+    </div>
+</template>
+
+<script>
+    import Global from '../Global.js'
+    import dialog_referrer_list from '../components/dialog_referrer_list'
+    import {
+        DetectorQuery,
+        GetChildRegionSelect,
+        DetectorEditStatus,
+        RegionPictureGetByRegionId,
+        DetectorAdd,
+        DetectorEdit,
+        GetDetectorCoords,
+        GeFullRegionSelect,
+    } from '../api/getApiRes.js'
+
+    let qs = require('qs');
+    export default {
+        data() {
+            return {
+                // dialog
+                dialog_state: false,
+                dialog_title: '',
+                dialog_type: '',//类型，1是添加，2是修改
+                dialog: {
+                    mac: '',
+                    comId: 1,
+                    regionlevelOneId: 0,
+                    regionId: 0,
+                    tagname: '',
+                    longitude: 0,
+                    latitude: 0,
+                    HardwareVersion: '',
+                    FirmwareVersion: '',
+                    FirmwareScanM4Version: '',
+                    FirmwareScanM0Version: '',
+                    purchasesrc: '',
+                    location: '',
+                    coords_memo: '',
+                    memo: '',
+                    plateImgSrc: '',
+                    regionlevelOneIdOptions: [],
+                    regionIdRoomOptions: [],
+                    points: [],
+                    CoordsId: 0,
+                },
+                tabIndex: 0,
+                tabs: [
+                    {name: '设备管理', url: 'equip'},
+                ],
+                // panel 配置项目
+                panel: {
+                    usercode: '',
+                    username: '',
+                    compname: '',
+                    keyword: '',
+                    USERCODE: '',
+                    taskstatus: 99,
+                    regionid: 0,
+                    regionid2: '',
+                    regionidOptions: [],
+                    regionidOptions2: [],
+                    options: [
+                        {value: 99, label: '全部'},
+                        {value: 1, label: '进行中'},
+                        {value: 2, label: '已完成'},
+                    ],
+                    time1: globalBt3(2),
+                },
+                pageination: {
+                    pageItem: 100,
+                    pageoptions: pageOptions(),
+                    total: 500,
+                    pageIndex: 1,
+                },
+                draw: 1,
+                start: 0,
+                recordsTotal: 0,
+                tableData: [],
+                allTableData: [],
+                limit: '10',
+                multipleSort: false,
+                loading: true,
+                fileList: [],
+                multipleSelection: [],
+                detectedmac: '',
+            }
+        },
+        mounted() {
+            if (this.$route.query.RegionId) {
+                this.panel.regionid = this.$route.query.RegionId;
+                this.panel.tagname = this.$route.query.TagName;
+            }
+
+            this.getTableQuery();
+        },
+        methods: {
+            // 页面数据查询
+            getTableQuery() {
+                let that = this;
+                // this.getGetChildRegionSelect(0, 1);
+                this.getGeFullRegionSelect();
+                that.loading = true;
+                // 查询检测设备。上级区域id，区域id必传。regionid传0，查询supregionid对应所有子区域的检测设备。 如果supregionid，regionid都传0，默认查询企业ID下所有检测设备
+                let param = {
+                    token: localStorage.token,
+                    supregionid: this.panel.regionid,//
+                    regionId: 0,//
+                    comid: 1,//
+                    tagname: that.panel.tagname,//标签名
+                    start: 1,//
+                    tableMax: 9999,//
+                };
+                let postdata = qs.stringify(param);
+                DetectorQuery(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        that.loading = false;
+                        if (json.Rs) {
+                            that.allTableData = json.Rs;
+                            that.recordsTotal = json.Rs.length;
+                        } else {
+                            that.allTableData = [];
+                            that.recordsTotal = 0;
+                        }
+                        // 设置分页数据
+                        that.setPaginations();
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // 获取下级列表
+            getGeFullRegionSelect() {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                };
+                let postdata = qs.stringify(param);
+                GeFullRegionSelect(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        if (!json.Rs) {
+                            that.$message.error('区域列表为空，请先添加有效区域');
+                            return false
+                        }
+                        that.panel.regionidOptions = json.Rs;
+                        that.panel.regionidOptions.unshift({Id: 0, Name: "全部", DisplayName: "全部"});
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // dialog获取下级列表
+            dialoggetGeFullRegionSelect() {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                };
+                let postdata = qs.stringify(param);
+                GeFullRegionSelect(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        that.dialog.regionlevelOneIdOptions = json.Rs;
+                        that.dialog.regionId = json.Rs[0].Id;
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // dialog获取区域下级菜单
+            dialogGetGetChildRegionSelect(regionId, level) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    regionId: regionId,
+                };
+                let postdata = qs.stringify(param);
+                GeFullRegionSelect(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        if (level == 1) {
+                            console.log(json.Rs);
+                            that.dialog.regionlevelOneIdOptions = json.Rs;
+                            that.dialog.regionlevelOneId = regionId;
+                        } else {
+                            if (json.Rs) {
+                                console.log(123);
+                                that.dialog.regionIdRoomOptions = json.Rs;
+                                that.dialog.regionId = regionId;
+                            } else {
+                                that.dialog.regionIdRoomOptions = [];
+                                that.dialog.regionId = '';
+                            }
+                        }
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // 跳转tab页面
+            goTab(url) {
+                this.$router.push({path: url});
+            },
+            // 查询按钮
+            query() {
+                this.getTableQuery();
+                this.$message.success('查询完毕');
+            },
+
+            handleSelectionChange(val) {
+                this.multipleSelection = val;
+            },
+            // 设置分页数据
+            setPaginations() {
+                // 分页属性
+                let that = this;
+                that.pageination.total = that.recordsTotal;
+                // 默认分页
+                that.tableData = that.allTableData.filter((item, index) => {
+                    return index < that.pageination.pageItem;
+                });
+            },
+            // 每页显示数量
+            handleSizeChange() {
+                let that = this;
+                that.tableData = that.allTableData.filter((item, index) => {
+                    return index < that.pageination.pageItem;
+                });
+                that.draw = that.pageination.pageItem;
+                // that.getTableQuery();
+            },
+            // 翻页
+            pageChange(pageIndex) {
+                let that = this;
+                // 获取当前页
+                let index = that.pageination.pageItem * (pageIndex - 1);
+                // 数据总数
+                let nums = that.pageination.pageItem * pageIndex;
+                // 容器
+                let tables = [];
+                for (var i = index; i < nums; i++) {
+                    if (that.allTableData[i]) {
+                        tables.push(that.allTableData[i])
+                    }
+                    this.tableData = tables;
+                }
+                that.start = index * that.draw;
+                // that.getTableQuery();
+            },
+            // 自动排序
+            sortChange(params) {
+                console.log(params)
+            },
+            // 过滤时间
+            filterFmtDate(value, row, column) {
+                return globalfmtDate(column, 11);
+            },
+            addList() {
+                this.dialog_state = true;
+                this.dialog_title = '添加设备';
+                this.dialog_type = 1;
+
+                // 重载地区列表
+                this.getGeFullRegionSelect();
+
+                // clear dialog
+                this.dialog.mac = '';
+                this.dialog.regionId = '';
+                this.dialog.tagname = '';
+                this.dialog.HardwareVersion = '';
+                this.dialog.FirmwareVersion = '';
+                this.dialog.FirmwareScanM4Version = '';
+                this.dialog.FirmwareScanM0Version = '';
+                this.dialog.location = '';
+                this.dialog.purchasesrc = '';
+                this.dialog.memo = '';
+                this.dialog.coords_memo = '';
+                this.dialog.points = [{}];
+
+                // 加载默认的平面图
+                // this.dialogGetGetChildRegionSelect(0, 1);
+                this.dialoggetGeFullRegionSelect()
+            },
+            delList() {
+                let that = this;
+                // checkNum
+                if (!this.multipleSelection.length) {
+                    that.$message({
+                        showClose: true,
+                        message: '错了哦，需要先选中至少一条记录',
+                        type: 'error'
+                    });
+                    return false
+                }
+                let detectorid = that.multipleSelection[0].Id;
+
+                let param = {
+                    token: localStorage.token,
+                    detectorid: detectorid,
+                    status: 9,//0禁用1启用9删除
+                };
+                let postdata = qs.stringify(param);
+
+                this.$confirm('此操作将永久删除该设备, 是否继续?', '提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                }).then(() => {
+                    DetectorEditStatus(postdata).then(res => {
+                        let json = res;
+                        if (json.Code == 0) {
+                            that.$message({
+                                showClose: true,
+                                message: '选中的设备已删除！',
+                                type: 'success'
+                            });
+                            // 重载列表
+                            that.getTableQuery();
+                            that.dialog_state = false;
+                        } else {
+                            that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                        }
+                    });
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: '已取消删除'
+                    });
+                });
+            },
+            editList() {
+                let that = this;
+                // checkNum
+                if (!this.multipleSelection.length) {
+                    this.$message({
+                        showClose: true,
+                        message: '错了哦，需要先选中一条记录',
+                        type: 'error'
+                    });
+                    return false
+                }
+                if (this.multipleSelection.length > 1) {
+                    this.$message({
+                        showClose: true,
+                        message: '错了哦，只能选中一条记录',
+                        type: 'error'
+                    });
+                    return false
+                }
+                this.dialog_state = true;
+                this.dialog_title = '修改设备信息';
+                this.dialog_type = 2;
+
+                // 读取本条记录
+                let row = this.multipleSelection[0];
+                this.dialog.eqId = row.Id;
+                this.dialog.mac = row.Mac;
+                this.dialog.regionId = row.RegionId;
+                this.dialog.tagname = row.TagName;
+                this.dialog.HardwareVersion = row.HardwareVersion;
+                this.dialog.FirmwareVersion = row.FirmwareVersion;
+                this.dialog.FirmwareScanM4Version = row.FirmwareScanM4Version;
+                this.dialog.FirmwareScanM0Version = row.FirmwareScanM0Version;
+                this.dialog.location = row.Location;
+                this.dialog.purchasesrc = row.PurchaseSrc;
+                this.dialog.memo = row.Memo;
+                this.dialogGetGetChildRegionSelect(row.RegionId, 1);
+                this.dialog.coords_memo = row.coords_memo;
+
+                // 重载地区列表
+                this.getGeFullRegionSelect();
+
+                let param = {
+                    token: localStorage.token,
+                    detectorId: row.Id,
+                };
+                let postdata = qs.stringify(param);
+                GetDetectorCoords(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        if (json.Rs.length != 0) {
+                            console.log(json.Rs[0]);
+                            that.dialog.points = [{x: json.Rs[0].Width, y: json.Rs[0].Height}];
+                            that.dialog.CoordsId = json.Rs[0].CoordsId;
+                            that.dialog.coords_memo = json.Rs[0].Memo;
+                        } else {
+                            that.dialog.points = [{x: 0, y: 0}];
+                            that.dialog.CoordsId = 0;
+                        }
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // 自动补全MAC
+            autoCompleteMac() {
+                let text = this.dialog.mac;
+                if (text.length == 2 || text.length == 5 || text.length == 8 || text.length == 11 || text.length == 14) {
+                    this.dialog.mac = this.dialog.mac.toUpperCase() + ":"
+                }
+                if (text.length > 14) {
+                    this.dialog.mac = this.dialog.mac.toUpperCase()
+                }
+            },
+            // 探测记录
+            goPhoneRecord(row) {
+                this.$router.push({
+                    path: '/phoneSign',
+                    query:
+                        {
+                            detectorid: row.Id,
+                            comId: 1,
+                            regionId: row.RegionId,
+                        }
+                });
+            },
+            // 探测记录
+            goWifiRecord(row) {
+                this.$router.push({
+                    path: '/wifiSign',
+                    query:
+                        {
+                            detectorid: row.Id,
+                            comId: 1,
+                            regionId: row.RegionId,
+                        }
+                });
+            },
+            dialog_cancel() {
+                let that = this;
+                that.dialog_state = false;
+            },
+            dialog_ok() {
+                if (this.dialog_type == 1) {
+                    this.confirmAddEquip();
+                } else {
+                    this.confirmEditEquip();
+                }
+            },
+            // 提交增加新设备
+            confirmAddEquip() {
+                let that = this;
+                // checkVal
+                if (!that.dialog.mac) {
+                    this.$message.error('错了哦，mac不能为空');
+                    return false
+                }
+                if (!checkMac(that.dialog.mac)) {
+                    this.$message.error('错了哦，mac格式不正确');
+                    return false
+                }
+                if (!that.dialog.regionId) {
+                    this.$message.error('错了哦，所属区域不能为空');
+                    return false
+                }
+                if (!that.dialog.tagname) {
+                    this.$message.error('错了哦，标签名不能为空');
+                    return false
+                }
+                if (that.dialog.tagname.length > 20) {
+                    this.$message.error('错了哦，标签名不能超过20个字符');
+                    return false
+                }
+                this.selectRegionLabel(that.dialog.regionId);
+                let param = {
+                    token: localStorage.token,
+                    mac: that.dialog.mac,
+                    comId: 1,
+                    regionId: that.dialog.regionId,
+                    tagname: that.dialog.tagname,
+                    HardwareVersion: that.dialog.HardwareVersion,
+                    FirmwareVersion: that.dialog.FirmwareVersion,
+                    FirmwareScanM4Version: that.dialog.FirmwareScanM4Version,
+                    FirmwareScanM0Version: that.dialog.FirmwareScanM0Version,
+                    location: that.dialog.location,
+                    purchasesrc: that.dialog.purchasesrc,
+                    x: that.dialog.points[0].x,
+                    y: that.dialog.points[0].y,
+                    coords_memo: that.dialog.coords_memo,
+                    memo: that.dialog.memo,
+                };
+                let postdata = qs.stringify(param);
+                DetectorAdd(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        that.$message({
+                            showClose: true,
+                            message: '设备添加成功！',
+                            type: 'success'
+                        });
+                        // 重载列表
+                        that.getTableQuery();
+                        that.dialog_state = false;
+
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                });
+            },
+            // 提交修改设备信息
+            confirmEditEquip() {
+                let that = this;
+                // checkVal
+                if (!that.dialog.mac) {
+                    this.$message.error('错了哦，mac不能为空');
+                    return false
+                }
+                if (!checkMac(that.dialog.mac)) {
+                    this.$message.error('错了哦，mac格式不正确');
+                    return false
+                }
+
+                if (!that.dialog.regionId) {
+                    this.$message.error('错了哦，所属区域不能为空');
+                    return false
+                }
+                if (!that.dialog.tagname) {
+                    this.$message.error('错了哦，标签名不能为空');
+                    return false
+                }
+                if (that.dialog.tagname.length > 20) {
+                    this.$message.error('错了哦，标签名不能超过20个字符');
+                    return false
+                }
+                this.selectRegionLabel(that.dialog.regionId);
+                let param = {
+                    token: localStorage.token,
+                    detectorid: that.dialog.eqId,
+                    mac: that.dialog.mac,
+                    comId: 1,
+                    regionId: that.dialog.regionId,
+                    tagname: that.dialog.tagname,
+                    HardwareVersion: that.dialog.HardwareVersion,
+                    FirmwareVersion: that.dialog.FirmwareVersion,
+                    FirmwareScanM4Version: that.dialog.FirmwareScanM4Version,
+                    FirmwareScanM0Version: that.dialog.FirmwareScanM0Version,
+                    location: that.dialog.location,
+                    purchasesrc: that.dialog.purchasesrc,
+                    x: that.dialog.points[0].x,
+                    y: that.dialog.points[0].y,
+                    coords_memo: that.dialog.coords_memo,
+                    memo: that.dialog.memo,
+                    coordsType: 1,//坐标状态 0：禁用， 1：启用， 9：删除，没有就传0
+                    coordsID: that.dialog.CoordsId,
+                };
+
+                let postdata = qs.stringify(param);
+                DetectorEdit(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        that.$message({
+                            showClose: true,
+                            message: '设备添加成功！',
+                            type: 'success'
+                        });
+                        // 重载列表
+                        that.getTableQuery();
+                        that.dialog_state = false;
+
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                });
+            },
+            // 修改设备状态
+            getDetectorEditStatus(detectorid, status, text) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    detectorid: detectorid,
+                    status: status,
+                };
+                let postdata = qs.stringify(param);
+                DetectorEditStatus(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        that.$message({
+                            showClose: true,
+                            message: text + '成功！',
+                            type: 'success'
+                        });
+                        // table 重载
+                        that.getTableQuery();
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // 禁用
+            pauseRow(row) {
+                let that = this;
+                this.$confirm('是否禁用' + row.TagName + '设备？', '禁用操作', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                }).then(() => {
+                    that.getDetectorEditStatus(row.Id, 0, '禁用');
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: '已取消禁用'
+                    });
+                });
+            },
+            // 获取区域位置的平面图
+            getRegionPictureGetByRegionId(regionID) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    regionID: regionID,
+                    regionId: regionID,
+                };
+                let postdata = qs.stringify(param);
+                RegionPictureGetByRegionId(postdata).then(res => {
+                    let json = res;
+                    that.dialog.plateImgSrc = '';
+                    if (json.Code == 0) {
+                        that.dialog.plateImgSrc = json.EncodeString;
+                    } else {
+                        that.$message.error(json.Memo + '，错误代码：' + json.Code);
+                    }
+                })
+            },
+            // 启用
+            runRow(row) {
+                console.log(row);
+                let that = this;
+                this.$confirm('是否启用' + row.TagName + '设备？', '启用操作', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                }).then(() => {
+                    that.getDetectorEditStatus(row.Id, 1, '启用');
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: '已取消启用'
+                    });
+                });
+            },
+            // 添加探测器位置的点坐标
+            addPoint(e) {
+                let x = e.offsetX;
+                let y = e.offsetY;
+                this.dialog.points = [{x: x, y: y}];
+            },
+            // 获取位置的文字内容
+            selectRegionLabel(id) {
+                let that = this;
+                let selectedWorkName = {};
+                // selectedWorkName = that.dialog.regionIdRoomOptions.filter(item => {
+                selectedWorkName = that.dialog.regionlevelOneIdOptions.filter(item => {
+                    if (item.Id === id) {
+                        console.log(item.Name);
+                        that.dialog.location = item.Name;
+                    }
+                });
+            }
+        },
+        watch: {
+            // 'dialog.regionlevelOneId': function (val) {
+            //     this.dialogGetGetChildRegionSelect(val, 2)
+            // },
+            'dialog.regionId': function (val) {
+                if (val) {
+                    this.getRegionPictureGetByRegionId(val);
+                }
+            },
+        },
+        components: {
+            dialog_referrer_list
+        }
+    }
+</script>
+
+<style scoped>
+    @import "../assets/css/panel.css";
+    @import "../assets/css/dialog.css";
+
+    .tabs ul {
+        width: 168px;
+    }
+
+    table span {
+        cursor: pointer;
+    }
+
+    .down_btn {
+        float: left;
+    }
+
+    .content {
+        width: 98%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+        padding-left: 20px;
+    }
+
+    .selectStyle {
+        width: 100%;
+        color: #005EA2;
+    }
+
+    .selectStyle ::placeholder {
+        color: #005EA2;
+    }
+
+    /deep/ .modal .el-select .el-input .el-select__caret {
+        position: relative;
+        top: 35px;
+    }
+
+    .imgContianer {
+        width: 100%;
+        height: 340px;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .imgContianer img {
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .pointers {
+        position: relative;
+        bottom: 340px;
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        display: block;
+        margin: 0 auto;
+    }
+
+    .imgContianer i {
+        position: relative;
+        width: 10px;
+        height: 10px;
+        float: left;
+        border-radius: 250px;
+        background: #FFDD00;
+    }
+
+    /deep/ .modal-dialog {
+        height: 680px;
+        margin-top: 20px;
+    }
+
+    /deep/ textarea {
+        color: #6DC1FF;
+    }
+
+    /deep/ .el-table__empty-text {
+        color: #015B9E;
+    }
+
+    /deep/ .el-input.is-disabled .el-input__inner {
+        background-color: #015B9E;
+    }
+    .red {
+        color: red;
+    }
+    .yellow {
+        color: #fd0;
+    }
+</style>

src/views/Main.vue

@@ -16,7 +16,7 @@
         </div>
         <div :class="[{'md':true},{'bigMd':!showLeft}]">
             <div class="cube">
-                <signMap></signMap>
+                <signMap :sign-list="signList"></signMap>
             </div>
             <div class="cube">
                 <WifiSign :wifi-rs="WifiRs"></WifiSign>
@@ -36,12 +36,12 @@
             </transition>
             <transition name="el-zoom-in-center">
                 <div class="cube">
-                    <HistoryRecord :history-rs="historyRs"></HistoryRecord>
+                    <RunTimeRecord :runtime-rs="runtimeRs"></RunTimeRecord>
                 </div>
             </transition>
             <transition name="el-zoom-in-center">
                 <div class="cube">
-                    <HistoryRecord :history-rs="historyRs"></HistoryRecord>
+                    <DetctorRecord :detctor-rs="detctorRs"></DetctorRecord>
                 </div>
             </transition>
         </div>
@@ -57,12 +57,18 @@
     import Scan from '@/components/Scan.vue'
     import HistoryRecord from '@/components/HistoryRecord.vue'
     import EquipInfo from '@/components/EquipInfo.vue'
-    import runTimeRecord from '@/components/runTimeRecord.vue'
+    import RunTimeRecord from '@/components/RunTimeRecord.vue'
+    import DetctorRecord from '@/components/DetcotrRecord.vue'
     import BigRader from '@/components/BigRader.vue'
     import {
         getLoftInfo,
         RegionList,
         DetectorList,
+        Region06G,
+        WifiChannel,
+        MonitorArea,
+        NetDevMonitor,
+        WirelessMonitor,
     } from '../api/getApiRes.js'
     import {mapGetters, mapActions, mapState} from "vuex";
     import Global from "../Global"
@@ -73,6 +79,7 @@
             return {
                 WifiRs: {},
                 ScanRs: {},
+                signList: {},
                 historyRs: [],
                 totalRs: [],
                 equipRs: [],
@@ -80,6 +87,16 @@
                 detectorList: [],
                 showLeft: true,
                 regionId: '',
+                runtimeRs: {
+                    Title: '实时监控详情',
+                    Url: 'runTime',
+                    Rs: [],
+                },
+                detctorRs: {
+                    Title: '探测设备工作监控',
+                    Url: 'record',
+                    Rs: [],
+                },
             }
         },
         mounted() {
@@ -104,45 +121,6 @@
         methods: {
             init() {
                 this.getDate();
-                this.test()
-            },
-            test() {
-                this.WifiRs = {
-                    Rs: [
-                        {'X': '信道1', 'Y': 12},
-                        {'X': '信道2', 'Y': 32},
-                        {'X': '信道3', 'Y': 41},
-                        {'X': '信道4', 'Y': 111},
-                        {'X': '信道5', 'Y': 411}, {'X': '信道1', 'Y': 12},
-                        {'X': '信道2', 'Y': 32},
-                        {'X': '信道3', 'Y': 41},
-                        {'X': '信道4', 'Y': 111},
-                        {'X': '信道5', 'Y': 411}, {'X': '信道1', 'Y': 12},
-                        {'X': '信道2', 'Y': 32},
-                        {'X': '信道3', 'Y': 41},
-                        {'X': '信道4', 'Y': 111},
-                        {'X': '信道5', 'Y': 411},
-                    ]
-                };
-                this.ScanRs = {
-                    Rs: [
-                        {'X': '1M', 'Y': 311},
-                        {'X': '2M', 'Y': 32},
-                        {'X': '3M', 'Y': 241},
-                        {'X': '4M', 'Y': 111},
-                        {'X': '5M', 'Y': 411},
-                        {'X': '6M', 'Y': 311},
-                        {'X': '7M', 'Y': 32},
-                        {'X': '8M', 'Y': 241},
-                        {'X': '9M', 'Y': 111},
-                        {'X': '10M', 'Y': 411},
-                        {'X': '11M', 'Y': 311},
-                        {'X': '12M', 'Y': 32},
-                        {'X': '13M', 'Y': 241},
-                        {'X': '14M', 'Y': 111},
-                        {'X': '15M', 'Y': 411},
-                    ]
-                }
             },
             getDate() {
                 let that = this;
@@ -158,6 +136,11 @@
                         // 默认加载第一个区域
                         if (json.Rs) {
                             this.getDetectorList(json.Rs[0].Id);
+                            this.getRegion06G(json.Rs[0].Id);
+                            this.getWifiChannel(json.Rs[0].Id);
+                            this.getMonitorArea(json.Rs[0].Id);
+                            this.getNetDevMonitor(json.Rs[0].Id);
+                            this.getWirelessMonitor(json.Rs[0].Id);
                         }
                     } else {
                         that.$message.error(json.Memo);
@@ -182,20 +165,101 @@
                 })
             },
             // Wifi柱状图信息传入探测器Id
-            getDetectorWifixyInfolist(postdata) {
+            getWifiChannel(Id) {
                 let that = this;
-                DetectorWifixyInfolist(postdata).then(res => {
+                let param = {
+                    token: localStorage.token,
+                    id: Id,
+                };
+                let postdata = qs.stringify(param);
+                WifiChannel(postdata).then(res => {
                     let json = res;
                     if (json.Code == 0) {
-                        // that.WifiRs = json;
+                        that.WifiRs = json;
                     } else {
                         that.$message.error(json.Memo + '，错误代码：' + json.Code);
                     }
                 })
             },
             ClickGetInfo(Id) {
-                this.regionId = Id;
+                // this.regionId = Id;
                 this.getDetectorList(Id);
+                this.getRegion06G(Id);
+                this.getWifiChannel(Id);
+                this.getMonitorArea(Id);
+                this.getNetDevMonitor(Id);
+                this.getWirelessMonitor(Id);
+            },
+            getRegion06G(id) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    id: id,
+                    xCount: 200,
+                };
+                let postdata = qs.stringify(param);
+                Region06G(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.ScanRs = json;
+                    } else {
+                        this.ScanRs = {};
+                        that.$message.error(json.Memo);
+                    }
+                })
+            },
+            getMonitorArea(id) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    id: id,
+                };
+                let postdata = qs.stringify(param);
+                MonitorArea(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.signList = json;
+                        this.totalRs = json;
+                    } else {
+                        this.signList = {};
+                        this.totalRs = {};
+                        that.$message.error(json.Memo);
+                    }
+                })
+            },
+            getNetDevMonitor(id) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    regionId: id,
+                };
+                let postdata = qs.stringify(param);
+                NetDevMonitor(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.runtimeRs.Rs = json.Rs;
+                    } else {
+                        this.runtimeRs.Rs = [];
+                        that.$message.error(json.Memo);
+                    }
+                })
+            },
+            getWirelessMonitor(id) {
+                let that = this;
+                let param = {
+                    token: localStorage.token,
+                    regionId: id,
+                };
+                let postdata = qs.stringify(param);
+                WirelessMonitor(postdata).then(res => {
+                    let json = res;
+                    if (json.Code == 0) {
+                        this.detctorRs.Rs = json.Rs;
+                    } else {
+                        this.detctorRs.Rs = [];
+                        that.$message.error(json.Memo);
+                    }
+                })
             }
         },
         components: {
@@ -206,9 +270,10 @@
             Scan,
             HistoryRecord,
             EquipInfo,
-            runTimeRecord,
+            RunTimeRecord,
             Task,
             BigRader,
+            DetctorRecord,
         }
     }
 </script>