Merge branch 'master' of http://192.168.0.105:10010/r/jfpt-Vue

Administrator

2021-04-02 cd905f8e9df785bf59a537bea40de1f54433a566

Merge branch 'master' of http://192.168.0.105:10010/r/jfpt-Vue

 package-lock.json

@@ -780,7 +780,6 @@
      "version": "7.12.5",
      "resolved": "https://registry.npm.taobao.org/@babel/runtime/download/@babel/runtime-7.12.5.tgz",
      "integrity": "sha1-QQ5+SHRB4bNgwpvnFdhw2bmFiC4=",
      "dev": true,
      "requires": {
        "regenerator-runtime": "^0.13.4"
      },
@@ -788,8 +787,7 @@
        "regenerator-runtime": {
          "version": "0.13.7",
          "resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.13.7.tgz?cache=0&sync_timestamp=1595456367497&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fregenerator-runtime%2Fdownload%2Fregenerator-runtime-0.13.7.tgz",
          "integrity": "sha1-ysLazIoepnX+qrrriugziYrkb1U=",
          "dev": true
          "integrity": "sha1-ysLazIoepnX+qrrriugziYrkb1U="
        }
      }
    },
@@ -933,6 +931,11 @@
      "integrity": "sha1-K1o6s/kYzKSKjHVMCBaOPwPrphs=",
      "dev": true
    },
    "@popperjs/core": {
      "version": "2.9.2",
      "resolved": "https://registry.npm.taobao.org/@popperjs/core/download/@popperjs/core-2.9.2.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40popperjs%2Fcore%2Fdownload%2F%40popperjs%2Fcore-2.9.2.tgz",
      "integrity": "sha1-rep7aVPLs0ZRdmsFSEaOdDxqI1M="
    },
    "@soda/friendly-errors-webpack-plugin": {
      "version": "1.8.0",
      "resolved": "https://registry.npm.taobao.org/@soda/friendly-errors-webpack-plugin/download/@soda/friendly-errors-webpack-plugin-1.8.0.tgz?cache=0&sync_timestamp=1607927398894&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40soda%2Ffriendly-errors-webpack-plugin%2Fdownload%2F%40soda%2Ffriendly-errors-webpack-plugin-1.8.0.tgz",
@@ -1037,11 +1040,23 @@
      "integrity": "sha1-FZJUFOCtLNdlv+9YhC9+JqesyyQ=",
      "dev": true
    },
    "@vant/icons": {
      "version": "1.5.2",
      "resolved": "https://registry.npm.taobao.org/@vant/icons/download/@vant/icons-1.5.2.tgz?cache=0&sync_timestamp=1613997305954&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vant%2Ficons%2Fdownload%2F%40vant%2Ficons-1.5.2.tgz",
      "integrity": "sha1-Pz6jU6DqzTjBE3V70xg2SJ+ssQs="
    },
    "@vant/popperjs": {
      "version": "1.0.4",
      "resolved": "https://registry.npm.taobao.org/@vant/popperjs/download/@vant/popperjs-1.0.4.tgz",
      "integrity": "sha1-ScIICaOCjnsDbiPVD7VhIemXYY8=",
      "requires": {
        "@popperjs/core": "^2.5.4"
      }
    },
    "@vue/babel-helper-vue-jsx-merge-props": {
      "version": "1.2.1",
      "resolved": "https://registry.npm.taobao.org/@vue/babel-helper-vue-jsx-merge-props/download/@vue/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
      "integrity": "sha1-MWJKelBfsU2h1YAjclpMXycOaoE=",
      "dev": true
      "integrity": "sha1-MWJKelBfsU2h1YAjclpMXycOaoE="
    },
    "@vue/babel-plugin-transform-vue-jsx": {
      "version": "1.2.1",
@@ -4241,6 +4256,22 @@
      "requires": {
        "jsbn": "~0.1.0",
        "safer-buffer": "^2.1.0"
      }
    },
    "echarts": {
      "version": "5.0.2",
      "resolved": "https://registry.npm.taobao.org/echarts/download/echarts-5.0.2.tgz",
      "integrity": "sha1-FybRelfPBdYs0FZ7QyXhIBpWuvY=",
      "requires": {
        "tslib": "2.0.3",
        "zrender": "5.0.4"
      },
      "dependencies": {
        "tslib": {
          "version": "2.0.3",
          "resolved": "https://registry.npm.taobao.org/tslib/download/tslib-2.0.3.tgz?cache=0&sync_timestamp=1609887446826&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftslib%2Fdownload%2Ftslib-2.0.3.tgz",
          "integrity": "sha1-jgdBrEX8DCJuWKF7/D5kubxsphw="
        }
      }
    },
    "ee-first": {
@@ -11669,6 +11700,18 @@
        "spdx-expression-parse": "^3.0.0"
      }
    },
    "vant": {
      "version": "2.12.11",
      "resolved": "https://registry.npm.taobao.org/vant/download/vant-2.12.11.tgz?cache=0&sync_timestamp=1617070186940&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvant%2Fdownload%2Fvant-2.12.11.tgz",
      "integrity": "sha1-q/I/a2JGyLT0lQLkCcrmT9me1bw=",
      "requires": {
        "@babel/runtime": "7.x",
        "@vant/icons": "1.5.2",
        "@vant/popperjs": "^1.0.0",
        "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
        "vue-lazyload": "1.2.3"
      }
    },
    "vary": {
      "version": "1.1.2",
      "resolved": "https://registry.npm.taobao.org/vary/download/vary-1.1.2.tgz",
@@ -11755,6 +11798,11 @@
      "version": "8.22.3",
      "resolved": "https://registry.npm.taobao.org/vue-i18n/download/vue-i18n-8.22.3.tgz",
      "integrity": "sha1-SsD9w+cdT+GIk4xAqf/KMs3mBzI="
    },
    "vue-lazyload": {
      "version": "1.2.3",
      "resolved": "https://registry.npm.taobao.org/vue-lazyload/download/vue-lazyload-1.2.3.tgz?cache=0&sync_timestamp=1613791646802&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-lazyload%2Fdownload%2Fvue-lazyload-1.2.3.tgz",
      "integrity": "sha1-kB+ewVx+bKeHgaK65KNDaGve2yw="
    },
    "vue-loader": {
      "version": "15.9.6",
@@ -12708,6 +12756,21 @@
          "dev": true
        }
      }
    },
    "zrender": {
      "version": "5.0.4",
      "resolved": "https://registry.npm.taobao.org/zrender/download/zrender-5.0.4.tgz?cache=0&sync_timestamp=1612184108108&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fzrender%2Fdownload%2Fzrender-5.0.4.tgz",
      "integrity": "sha1-icNVr5CLn2SjAbOPdRt5UfLIqVo=",
      "requires": {
        "tslib": "2.0.3"
      },
      "dependencies": {
        "tslib": {
          "version": "2.0.3",
          "resolved": "https://registry.npm.taobao.org/tslib/download/tslib-2.0.3.tgz?cache=0&sync_timestamp=1609887446826&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftslib%2Fdownload%2Ftslib-2.0.3.tgz",
          "integrity": "sha1-jgdBrEX8DCJuWKF7/D5kubxsphw="
        }
      }
    }
  }
}

 public/img/red-up.png

 src/api/supervisory/data.js

New file
@@ -0,0 +1,9 @@
import request from '@/router/axios';

export const getList = () => {
  return request({
    url: '/api/blade-jfpts/alarm/alarm/selectListSe',
    method: 'get',
    params: {}
  })
}

 src/main.js

@@ -5,9 +5,11 @@
import router from './router/router';
import './permission'; // 权限
import './error'; // 日志
import './cache';//页面缓存
import './cache'; //页面缓存
import store from './store';
import { loadStyle } from './util/util'
import {
  loadStyle
} from './util/util'
import * as urls from '@/config/env';
import Element from 'element-ui';
import {
@@ -22,6 +24,8 @@
import avueUeditor from 'avue-plugin-ueditor';
import website from '@/config/website';
import crudCommon from '@/mixins/crud';
import * as echarts from 'echarts';
Vue.prototype.$echarts = echarts;
// 注册全局crud驱动
window.$crudCommon = crudCommon;
// 加载Vue拓展
@@ -58,4 +62,4 @@
  store,
  i18n,
  render: h => h(App)
}).$mount('#app');
}).$mount('#app');

 src/router/views/index.js

@@ -1,280 +1,328 @@
import Layout from '@/page/index/'

export default [{
        path: '/wel',
        component: Layout,
        redirect: '/wel/index',
        children: [{
            path: 'index',
            name: '首页',
            meta: {
                i18n: 'dashboard'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/home/home')
        }, {
            path: 'dashboard',
            name: '控制台',
            meta: {
                i18n: 'dashboard',
                menu: false,
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/wel/dashboard')
        }]
    },
    {
        path: '/distribution',
        component: Layout,
        redirect: '/distribution/index',
        children: [{
            path: 'index',
            name: '警情分发处置',
            meta: {
                i18n: 'distribution'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/distribution/index')
        }]
    },
    {
        path: '/test',
        component: Layout,
        redirect: '/test/index',
        children: [{
            path: 'index',
            name: '测试页',
            meta: {
                i18n: 'test'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/util/test')
        }]
    }, {
        path: '/dict-horizontal',
        component: Layout,
        redirect: '/dict-horizontal/index',
        children: [{
            path: 'index',
            name: '字典管理',
            meta: {
                i18n: 'dict'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/util/demo/dict-horizontal')
        }]
    }, {
        path: '/dict-vertical',
        component: Layout,
        redirect: '/dict-vertical/index',
        children: [{
            path: 'index',
            name: '字典管理',
            meta: {
                i18n: 'dict'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/util/demo/dict-vertical')
        }]
    }, {
        path: '/info',
        component: Layout,
        redirect: '/info/index',
        children: [{
            path: 'index',
            name: '个人信息',
            meta: {
                i18n: 'info'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/system/userinfo')
        }]
    }, {
        path: '/real',
        component: Layout,
        redirect: '/real/video',
        children: [{
            path: 'video',
            name: '视频',
            meta: {
                i18n: 'real'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/Video/video')
        }, {
            path: 'history/:historyId',
            name: '设备历史',
            meta: {
                i18n: 'real'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/realTimePolice/realHistory')
        }]
    }, {
        path: '/work/process/leave',
        component: Layout,
        redirect: '/work/process/leave/form',
        children: [{
            path: 'form/:processDefinitionId',
            name: '请假流程',
            meta: {
                i18n: 'work'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/work/process/leave/form')
        }, {
            path: 'handle/:taskId/:processInstanceId/:businessId',
            name: '处理请假流程',
            meta: {
                i18n: 'work'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/work/process/leave/handle')
        }, {
            path: 'detail/:processInstanceId/:businessId',
            name: '请假流程详情',
            meta: {
                i18n: 'work'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/work/process/leave/detail')
        }]
    },
    {
        path: '/realTimePolice',
        component: Layout,
        redirect: '/realTimePolice/index',
        children: [{
            path: 'index',
            name: '实时报警',
            meta: {
                i18n: 'real'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/realTimePolice/real')
        }]
    },
    {
        path: '/attendance',
        component: Layout,
        redirect: '/attendance/attendance',
        children: [{
            path: 'index',
            name: '考勤管理',
            meta: {
                i18n: 'attendance'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/attendance/attendance')
        }]
    },
    {
        path: '/clientManagement',
        component: Layout,
        redirect: '/clientManagement/clientManagement',
        children: [{
    path: '/wel',
    component: Layout,
    redirect: '/wel/index',
    children: [{
      path: 'index',
      name: '首页',
      meta: {
        i18n: 'dashboard'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/supervisoryConsole/data')
    }]
  },

            path: 'index',
            name: '设备管理',
            meta: {
                i18n: 'clientManagement'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/clientManagement/clientManagement')
        }]
    },
    {
        path: '/suser',
        component: Layout,
        redirect: '/suser/suser',
        children: [{
            path: 'index',
            name: '客户管理',
            meta: {
                i18n: 'suser'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/suser/suser')
        }]
  // {
  //     path: '/wel',
  //     component: Layout,
  //     redirect: '/wel/index',
  //     children: [{
  //         path: 'index',
  //         name: '首页',
  //         meta: {
  //             i18n: 'dashboard'
  //         },
  //         component: () =>
  //             import ( /* webpackChunkName: "views" */ '@/views/home/home')
  //     }, {
  //         path: 'dashboard',
  //         name: '控制台',
  //         meta: {
  //             i18n: 'dashboard',
  //             menu: false,
  //         },
  //         component: () =>
  //             import ( /* webpackChunkName: "views" */ '@/views/wel/dashboard')
  //     }]
  // },
  {
    path: '/distribution',
    component: Layout,
    redirect: '/distribution/index',
    children: [{
      path: 'index',
      name: '警情分发处置',
      meta: {
        i18n: 'distribution'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/distribution/index')
    }]
  },
  {
    path: '/test',
    component: Layout,
    redirect: '/test/index',
    children: [{
      path: 'index',
      name: '测试页',
      meta: {
        i18n: 'test'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/util/test')
    }]
  }, {
    path: '/dict-horizontal',
    component: Layout,
    redirect: '/dict-horizontal/index',
    children: [{
      path: 'index',
      name: '字典管理',
      meta: {
        i18n: 'dict'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/util/demo/dict-horizontal')
    }]
  }, {
    path: '/dict-vertical',
    component: Layout,
    redirect: '/dict-vertical/index',
    children: [{
      path: 'index',
      name: '字典管理',
      meta: {
        i18n: 'dict'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/util/demo/dict-vertical')
    }]
  }, {
    path: '/info',
    component: Layout,
    redirect: '/info/index',
    children: [{
      path: 'index',
      name: '个人信息',
      meta: {
        i18n: 'info'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/system/userinfo')
    }]
  },
  {
    path: '/real',
    component: Layout,
    redirect: '/real/video',
    children: [{
      path: 'video',
      name: '视频',
      meta: {
        i18n: 'real'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/Video/video')
    }, {
        path: '/policeTracking',
        component: Layout,
        redirect: '/policeTracking/track',
        children: [{
            path: 'track',
            name: '警情追踪',
            meta: {
                i18n: 'track'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/policeTracking/policeTracking')
        }]
      path: 'history/:historyId',
      name: '设备历史',
      meta: {
        i18n: 'real'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/realTimePolice/realHistory')
    }]
  },
  {
    path: '/welcomeData',
    component: Layout,
    redirect: '/welcomeData/data',
    children: [{
      path: 'data',
      name: '数据模式',
      meta: {
        i18n: 'data'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/supervisoryConsole/data')
    }, {
        path: '/healthcode',
        component: Layout,
        redirect: '/healthcode/healthcodePage',
        children: [{
            path: 'healthcodePage',
            name: '健康码',
            meta: {
                i18n: 'healthcode'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/healthcode/healthcode')
        }]
      path: 'map',
      name: '地图模式',
      meta: {
        i18n: 'map'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/supervisoryConsole/map')
    }, {
        path: '/animalHeat',
        component: Layout,
        redirect: '/animalHeat/animalHeatPage',
        children: [{
            path: 'animalHeatPage',
            name: '体温检测',
            meta: {
                i18n: 'animalHeat'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/animalHeat/animalHeat')
        }]
      path: 'card',
      name: '卡片模式',
      meta: {
        i18n: 'card'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/supervisoryConsole/card')
    }]
  },

  {
    path: '/work/process/leave',
    component: Layout,
    redirect: '/work/process/leave/form',
    children: [{
      path: 'form/:processDefinitionId',
      name: '请假流程',
      meta: {
        i18n: 'work'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/work/process/leave/form')
    }, {
        path: '/alarm',
        component: Layout,
        redirect: '/alarm/alarmPage',
        children: [{
            path: 'alarmPage',
            name: '实时警情',
            meta: {
                i18n: 'alarm'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/alarm/alarm')
        }]
      path: 'handle/:taskId/:processInstanceId/:businessId',
      name: '处理请假流程',
      meta: {
        i18n: 'work'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/work/process/leave/handle')
    }, {
        path: '/parcel',
        component: Layout,
        redirect: '/parcel/index',
        children: [{
            path: 'index',
            name: '安检包裹',
            meta: {
                i18n: 'parcel'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/parcel/parcel')
        }]
    }, {
        path: '/parcelKind',
        component: Layout,
        redirect: '/parcelKind/index',
        children: [{
            path: 'index',
            name: '违禁品',
            meta: {
                i18n: 'parcelKind'
            },
            component: () =>
                import ( /* webpackChunkName: "views" */ '@/views/parcel/parcelKind')
        }]
    }
      path: 'detail/:processInstanceId/:businessId',
      name: '请假流程详情',
      meta: {
        i18n: 'work'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/work/process/leave/detail')
    }]
  },
  {
    path: '/realTimePolice',
    component: Layout,
    redirect: '/realTimePolice/index',
    children: [{
      path: 'index',
      name: '实时报警',
      meta: {
        i18n: 'real'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/realTimePolice/real')
    }]
  },
  {
    path: '/attendance',
    component: Layout,
    redirect: '/attendance/attendance',
    children: [{
      path: 'index',
      name: '考勤管理',
      meta: {
        i18n: 'attendance'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/attendance/attendance')
    }]
  },
  {
    path: '/clientManagement',
    component: Layout,
    redirect: '/clientManagement/clientManagement',
    children: [{

      path: 'index',
      name: '设备管理',
      meta: {
        i18n: 'clientManagement'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/clientManagement/clientManagement')
    }]
  },
  {
    path: '/suser',
    component: Layout,
    redirect: '/suser/suser',
    children: [{
      path: 'index',
      name: '客户管理',
      meta: {
        i18n: 'suser'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/suser/suser')
    }]
  }, {
    path: '/policeTracking',
    component: Layout,
    redirect: '/policeTracking/track',
    children: [{
      path: 'track',
      name: '警情追踪',
      meta: {
        i18n: 'track'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/policeTracking/policeTracking')
    }]
  }, {
    path: '/healthcode',
    component: Layout,
    redirect: '/healthcode/healthcodePage',
    children: [{
      path: 'healthcodePage',
      name: '健康码',
      meta: {
        i18n: 'healthcode'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/healthcode/healthcode')
    }]
  }, {
    path: '/animalHeat',
    component: Layout,
    redirect: '/animalHeat/animalHeatPage',
    children: [{
      path: 'animalHeatPage',
      name: '体温检测',
      meta: {
        i18n: 'animalHeat'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/animalHeat/animalHeat')
    }]
  }, {
    path: '/alarm',
    component: Layout,
    redirect: '/alarm/alarmPage',
    children: [{
      path: 'alarmPage',
      name: '实时警情',
      meta: {
        i18n: 'alarm'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/alarm/alarm')
    }]
  }, {
    path: '/parcel',
    component: Layout,
    redirect: '/parcel/index',
    children: [{
      path: 'index',
      name: '安检包裹',
      meta: {
        i18n: 'parcel'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/parcel/parcel')
    }]
  }, {
    path: '/parcelKind',
    component: Layout,
    redirect: '/parcelKind/index',
    children: [{
      path: 'index',
      name: '违禁品',
      meta: {
        i18n: 'parcelKind'
      },
      component: () =>
        import( /* webpackChunkName: "views" */ '@/views/parcel/parcelKind')
    }]
  }


]
]

 src/views/clientManagement/clientManagement.vue

@@ -18,6 +18,8 @@
                   @row-update="rowUpdate"
                   @row-save="rowSave"
                   :row-style="rowStyle"
                   @contextmenu.prevent.native=""
                   @row-contextmenu="rightClick"
                   row-class-name="tabFontSize"
                   :before-open="beforeOpen"
                   @search-change="searchChange"
@@ -44,22 +46,22 @@
              }}
            </el-tag>
          </template>
          <template slot-scope="{ type, size, row }" slot="menu">
            <el-button
              icon="el-icon-video-camera-solid"
              :size="size"
              :type="type"
              @click.stop="handleStart(row)"
            >视频
            </el-button>
            <el-button
              icon="el-icon-location-outline"
              :size="size"
              :type="type"
              @click.stop="handleMap(row)"
            >定位
            </el-button>
          </template>
<!--          <template slot-scope="{ type, size, row }" slot="menu">-->
<!--            <el-button-->
<!--              icon="el-icon-video-camera-solid"-->
<!--              :size="size"-->
<!--              :type="type"-->
<!--              @click.stop="handleStart(row)"-->
<!--            >视频-->
<!--            </el-button>-->
<!--            <el-button-->
<!--              icon="el-icon-location-outline"-->
<!--              :size="size"-->
<!--              :type="type"-->
<!--              @click.stop="handleMap(row)"-->
<!--            >定位-->
<!--            </el-button>-->
<!--          </template>-->

          <template slot-scope="{ row }" slot="dxzt">
            <el-tag>{{
@@ -75,6 +77,12 @@

        </avue-crud>

        <div v-show="menuVisible">
          <ul id="menu" class="menu">
            <li class="menu_item" @click.stop="handleStart">视频</li>
            <li class="menu_item" @click.stop="handleMap">定位</li>
          </ul>
        </div>

        <el-drawer
          title="电子地图"
@@ -195,8 +203,10 @@
        form: {},
        query: {},
        showMap: false,
        selectRow:null,
        initFlag: true,
        loading: true,
        menuVisible:false,
        page: {
          pageSize: 10,
          currentPage: 1,
@@ -238,14 +248,15 @@
          calcHeight: 80,
          labelWidth: '100',
          dialogWidth: 950,
          menuWidth: 250,
          menuWidth: 150,
          align:"center",
          size: "mini",
          tip: false,
          searchShow: true,
          searchMenuSpan: 4,
          searchSpan: 4,
          border: true,
          border: false,
          stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
@@ -330,12 +341,10 @@
              label: "缴费状态",
              prop: "jfzt",
              slot: true,
              align: "center",
              addDisplay: false,
              editDisplay: false,
            }, {
              label: "布撤防状态",
              align: "center",
              prop: "devicestate",
              type: "select",
              slot: true,
@@ -358,7 +367,6 @@
            },
            {
              label: "设备状态",
              align: "center",
              prop: "dxzt",
              slot: true,
              addDisplay: false,
@@ -390,6 +398,10 @@
                value: "dictValue"
              },
              dicUrl: "/api/blade-system/dict-biz/child-list?parentId=1357568691367661569",
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            },
            {
              label: "省份",
@@ -406,7 +418,11 @@
              cascaderItem: ["city", "district"],
              dicUrl: "/api/blade-system/region/select",
              span: 6,
              className: "cityClass1"
              className: "cityClass1",
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            },
            {
              label: "地市",
@@ -424,7 +440,11 @@
              dicUrl: "/api/blade-system/region/select?code={{key}}",
              span: 3,
              labelWidth: "0",
              className: "cityClass2"
              className: "cityClass2",
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            },
            {
              label: "区县",
@@ -442,45 +462,77 @@
              dicUrl: "/api/blade-system/region/select?code={{key}}",
              span: 3,
              labelWidth: "0",
              className: "cityClass3"
              className: "cityClass3",
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            }, {
              label: "街道",
              prop: "street",
              width: 200
              width: 200,
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            },
            {
              label: "负责人",
              prop: "oneContacts",
              width: 72
              width: 72,
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            },
            {
              label: "负责人电话",
              prop: "onePhone",
              width: 110
              width: 110,
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            }, {
              label: "到期时间",
              prop: "expireTime",
              type: "datetime",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
              width: 130
              width: 130,
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            }, {
              label: "缴费信息",
              prop: "pay",
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            }, {
              label: "安装时间",
              prop: "stime",
              type: "datetime",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
              width: 130
              width: 130,
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            }, {
              label: "心跳时间",
              prop: "heartbeat",
              type: "datetime",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
              width: 130
              width: 130,
              hide: true,
              addDisplay: true,
              editDisplay: true,
              viewDisplay: true,
            },

          ]
@@ -726,6 +778,7 @@
        });

      }, handleStart(row) {
        row = this.selectRow;
        var arr = [];
        this.$store.state.tags.tagList.forEach(item => {
          if (item.label != "视频") {
@@ -737,18 +790,42 @@
          path: `/real/video/`, query: row
        });
      }, handleMap(row) {
        row = this.selectRow;
        this.showMap = true;
        this.$nextTick(() => {
          this.$refs.mapDiv.onload = () => {
            window.frames[0].init("equipment", {x: row.jd, y: row.wd});
          };
        })
      },rightClick(row, event) {
        this.selectRow = row;
        this.menuVisible = false; // 先把模态框关死，目的是 第二次或者第n次右键鼠标的时候 它默认的是true
        this.menuVisible = true; // 显示模态窗口，跳出自定义菜单栏
        var menu = document.querySelector('#menu');
        this.styleMenu(menu);
      },
      foo() {
        // 取消鼠标监听事件 菜单栏
        this.menuVisible = false;
        document.removeEventListener('click', this.foo); // 要及时关掉监听，不关掉的是一个坑，不信你试试，虽然前台显示的时候没有啥毛病，加一个alert你就知道了
      },
      styleMenu(menu) {
        let cha = document.body.clientHeight - event.clientY
        //console.log(document.body.clientHeight,event.clientY,cha)
        // 防止菜单太靠底，根据可视高度调整菜单出现位置
        if (cha < 150) {
          menu.style.top = event.clientY -120 - (120) + 'px'
        } else {
          menu.style.top = event.clientY -10 - (120) + 'px'
        }
        menu.style.left = event.clientX + 10 - (240) + 'px'
        document.addEventListener('click', this.foo); // 给整个document新增监听鼠标事件，点击任何位置执行foo方法
      }
    }
  };
</script>

<style>
<style scoped>
  .payWin {
    overflow-y: auto;
    height: 350px;
@@ -799,4 +876,41 @@
    font-size: 15px;
  }

  .menu_item {
    cursor:pointer;
    line-height: 20px;
    text-align: center;
    margin-top: 0px;
  }

  .menu {
    height: auto;
    width: 120px;
    color: #606266;
    position: absolute;
    padding: 0px;
    box-sizing: border-box;
    /*border: 1px solid #999999;*/
    text-align: center;
    background-color: #fff;
    border-radius: .25rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
  }
  li:hover {
    background-color: rgba(232,237,250,.6);
    color: darkslategrey;
  }
  li{
    position: relative;
    display: flex;
    font-size: 14px;
    align-items: center;
    height: 34px;
    line-height: 34px;
    outline: none;
    margin-top: 0px;
    padding-left: 20px;
    padding-right: 5px;
  }

</style>

 src/views/supervisoryConsole/card.vue

New file
@@ -0,0 +1,13 @@
<template>
  
</template>

<script>
export default {

}
</script>

<style>

</style>

 src/views/supervisoryConsole/data.vue

New file
@@ -0,0 +1,554 @@
<template>
  <el-row>
    <el-col class="super-data-box" :span="16">
      <div class="container-box">
        <div class="info-head">
          <div class="head-left">
            <div class="ng-binding">基本信息</div>
          </div>
          <div class="head-right">
            <div class="head-list ng-binding">预警</div>
            <div class="head-list ng-binding">正常</div>
            <div class="head-list ng-binding">故障</div>
            <div class="head-list ng-binding">掉线</div>
          </div>
        </div>
        <div class="info-content">
          <div
            class="pie-total-container"
            id="base_information_pie_echarts"
          ></div>
          <div class="info-active">
            <div class="info-active-top">
              <div class="active-list">
                <div>
                  <span
                    ng-click="menuToDetail(0)"
                    class="dashboard_alarm ng-binding"
                    >预警</span
                  >
                </div>
                <div><span class="ng-binding">3</span></div>
                <div class="ng-binding">占比&nbsp;1.8%</div>
              </div>
              <div class="active-list">
                <div>
                  <span
                    ng-click="menuToDetail(4)"
                    class="dashboard_malfunction ng-binding"
                    >故障</span
                  >
                </div>
                <div><span class="ng-binding">25</span></div>
                <div class="ng-binding">占比&nbsp;15%</div>
              </div>
            </div>
            <div class="info-active-bottom">
              <div class="active-list">
                <div>
                  <span
                    ng-click="menuToDetail(1)"
                    class="dashboard_normal ng-binding"
                    >正常</span
                  >
                </div>
                <div><span class="ng-binding">125</span></div>
                <div class="ng-binding">占比&nbsp;75%</div>
              </div>
              <div class="active-list">
                <div>
                  <span
                    ng-click="menuToDetail(3)"
                    class="dashboard_inactive ng-binding"
                    >掉线</span
                  >
                </div>
                <div><span class="ng-binding">15</span></div>
                <div class="ng-binding">占比&nbsp;10%</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="container-box">
        <div class="info-head">
          <div class="head-left">
            <div class="ng-binding">
              最近预警事件<span class="ng-binding">最近7天预警事件</span>
            </div>
          </div>
          <div class="head-right offset-right">
            <a href="/#/realTimePolice/index">预警记录</a>
          </div>
        </div>
        <div class="info-content">
          <el-table
            class="info-content-table"
            :data="tableData"
            stripe
            style="width: 100%; margin: 10px"
            max-height="352px"
            :resizable="false"
          >
            <el-table-column prop="waringType" label="警情类型" width="100">
            </el-table-column>
            <el-table-column prop="alarmTime" label="报警时间" width="180">
            </el-table-column>
            <el-table-column prop="oneContacts" label="主要负责人" width="160">
            </el-table-column>
            <el-table-column prop="onePhone" label="负责人电话" width="180">
            </el-table-column>
            <el-table-column prop="galarmPeople" label="报警人" width="160">
            </el-table-column>
            <el-table-column prop="alarmPeople" label="接警人" width="160">
            </el-table-column>
            <el-table-column prop="jtype" label="警情状态" width="">
            </el-table-column>
          </el-table>
        </div>
      </div>
    </el-col>
    <el-col class="super-data-box" :span="8">
      <div class="container-box week-alarm">
        <div class="info-head alarm-title">
          <div class="head-left">
            <div class="ng-binding">近7天预警趋势</div>
          </div>
          <div class="head-right">
            <div class="head-right offset-right">
              <a href="/#/realTimePolice/index">预警分析</a>
            </div>
          </div>
        </div>
        <div class="alarm-content">
          <div class="alarm-bar">
            <div class="alarm-bar-title">
              <div class="title-left ng-binding">日累计预警事件数</div>
              <div class="title-right week ng-scope" ng-if="$ctrl.barRate >= 1">
                <span class="ng-binding">0</span
                ><span class="ng-binding">1.00</span>
              </div>
            </div>
            <div
              class="week-alarm-bar ng-isolate-scope"
              data="$ctrl.weekAlarm"
              alarm-bar="alarmBarEvent(chart)"
            ></div>
          </div>
          <div class="border-line"></div>
          <div class="alarm-line">
            <div class="alarm-bar-title">
              <div class="title-left change-flex-alarm ng-binding">
                日累计预警设备数
              </div>
              <!-- ngIf: $ctrl.deviceRate >= 1 -->
              <div
                class="title-right week ng-scope"
                ng-if="$ctrl.deviceRate >= 1"
              >
                <span class="ng-binding">0</span
                ><span class="ng-binding">1.00</span>
              </div>
              <!-- end ngIf: $ctrl.deviceRate >= 1 -->
              <!-- ngIf: $ctrl.deviceRate < 1 -->
            </div>
            <div
              class="week-device-line ng-isolate-scope"
              data="$ctrl.weekDevice"
              device-line="deviceLineEvent(chart)"
            ></div>
          </div>
        </div>
      </div>
    </el-col>
  </el-row>
</template>

<script>
import { getList } from "@/api/supervisory/data";

export default {
  data() {
    return {
      tableData: [],
    };
  },
  created() {
    var that = this;
    getList().then((res) => {
      res.data.data.forEach((item) => {
        that.tableData.push({
          waringType:
            item.waringType == "紧急求救" ? "一键求助" : item.waringType,
          alarmTime: item.alarmTime,
          oneContacts: item.oneContacts,
          onePhone: item.onePhone,
          galarmPeople: item.galarmPeople,
          jtype:
            item.jtype == 0 ? "未处理" : item.jtype == 1 ? "处理中" : "已处理",
          alarmPeople: item.alarmPeople,
        });
      });
    });
  },
  mounted() {
    this.drawPie();
  },
  methods: {
    drawPie() {
      var myChart = this.$echarts.init(
        document.getElementById("base_information_pie_echarts")
      );

      var m2R2Data = [
        {
          value: 125,
          legendname: "正常",
          name: "正常",
          itemStyle: { color: "#29c194" },
        },
        {
          value: 25,
          legendname: "故障",
          name: "故障",
          itemStyle: { color: "#b6b6b6" },
        },
        {
          value: 15,
          legendname: "掉线",
          name: "掉线",
          itemStyle: { color: "#6d5eac" },
        },
      ];

      var sum = 0;

      m2R2Data.forEach((item) => {
        sum += item.value;
      });

      var option = {
        title: [
          {
            text: sum,
            subtext: "监测点总数",
            textStyle: {
              fontSize: 36,
              fontWeight: "normal",
              color: "#393939",
            },
            subtextStyle: {
              fontSize: 16,
              color: "#434343",
            },
            textAlign: "center",
            x: "49%",
            y: "39%",
          },
        ],
        tooltip: {
          trigger: "item",
          formatter: function (parms) {
            var str =
              parms.seriesName +
              "</br>" +
              parms.marker +
              "" +
              parms.data.legendname +
              "</br>" +
              "数量：" +
              parms.data.value +
              "</br>" +
              "占比：" +
              parms.percent +
              "%";
            return str;
          },
        },
        series: [
          {
            name: "标题",
            type: "pie",
            center: ["50%", "50%"],
            radius: ["66%", "86%"],
            clockwise: false, //饼图的扇区是否是顺时针排布
            avoidLabelOverlap: false,
            label: {
              normal: {
                show: false,
              },
            },
            labelLine: {
              normal: {
                show: false,
              },
            },
            data: m2R2Data,
          },
        ],
      };
      myChart.setOption(option);
    },
  },
};
</script>

<style lang="scss">
.super-data-box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 0px !important;
  height: 96% !important;
  font-size: 14px;
  &:nth-child(2) {
    padding-left: 10px;
    box-sizing: border-box;
  }
  .container-box {
    flex: 1;
    background: #fff;
    .info-head {
      display: flex;
      padding-left: 20px;
      height: 50px;
      line-height: 50px;
      box-sizing: border-box;
      border-bottom: 1px solid #dfdfdf;
      .head-left {
        flex: 1;
        .ng-binding {
          color: #252525;
          font-size: 1pc;
          span {
            display: inline-block;
            margin-left: 10px;
            color: #d1d1d1;
            font-size: 9pt;
          }
        }
      }
      .head-right {
        display: flex;
        flex: 1 1 auto;
        .head-list {
          position: relative;
          padding-right: 20px;
          padding-left: 18px;
          flex: 1;
          &::before {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            display: block;
            margin: auto;
            width: 10px;
            height: 10px;
            border-radius: 2px;
            content: "";
          }
          &:nth-child(1)::before {
            background-color: #f34a4a;
          }
          &:nth-child(2)::before {
            background-color: #29c093;
          }
          &:nth-child(3)::before {
            background-color: #6d5eac;
          }
          &:nth-child(4)::before {
            background-color: #dfdfdf;
          }
        }
        a {
          margin-right: 20px;
          color: #29c093;
        }
      }
      .head-right.offset-right {
        justify-content: flex-end;
      }
    }
    .info-content {
      display: flex;
      height: calc(100% - 50px);
      div {
        flex: 1;
      }
      .pie-total-container {
        display: flex;
        padding: 20px 0;
      }
      .info-active {
        display: flex;
        flex-direction: column;
        .info-active-top {
          display: flex;
          margin-right: 30px;
          border-bottom: 1px solid #e4e4e6;
          .active-list:nth-child(1) > div:nth-child(1) span {
            border: 1px solid #f2494a;
            color: #f2494a;
          }
          .active-list:nth-child(2) > div:nth-child(1) span {
            border: 1px solid #b6b6b6;
            color: #b6b6b6;
          }
          .active-list:nth-child(1) > div:nth-child(1) span:hover {
            background: rgba(243, 74, 74, 0.15);
          }
          .active-list:nth-child(2) > div:nth-child(1) span:hover {
            background: rgba(181, 181, 181, 0.15);
          }
          .active-list:nth-child(1) > div:nth-child(2) span {
            color: #f2494a;
          }
          .active-list:nth-child(2) > div:nth-child(2) span {
            color: #b6b6b6;
          }
        }
        .info-active-bottom {
          display: flex;
          margin-right: 30px;
          .active-list:nth-child(1) > div:nth-child(1) span {
            border: 1px solid #29c194;
            color: #29c194;
          }
          .active-list:nth-child(2) > div:nth-child(1) span {
            border: 1px solid #6d5eac;
            color: #6d5eac;
          }
          .active-list:nth-child(1) > div:nth-child(1) span:hover {
            background: rgba(41, 192, 147, 0.15);
          }
          .active-list:nth-child(2) > div:nth-child(1) span:hover {
            background: #e9e7f3;
          }
          .active-list:nth-child(1) > div:nth-child(2) span {
            color: #29c194;
          }
          .active-list:nth-child(2) > div:nth-child(2) span {
            color: #6d5eac;
          }
        }
        .info-active-top,
        .info-active-bottom {
          .active-list {
            display: flex;
            padding: 40px 0 20px;
            flex: 1;
            flex-direction: column;
            & > div:nth-child(1) {
              flex: 1;
              span {
                display: inline-block;
                padding: 2px 8px;
                border-radius: 4px;
                cursor: pointer;
              }
            }
            & > div:nth-child(2) {
              display: flex;
              flex: 1;
              align-items: flex-end;
              span {
                font-weight: 300;
                font-size: 28px;
              }
            }
            & > div:nth-child(3) {
              display: flex;
              padding-top: 8px;
              flex: 1;
              align-items: flex-start;
            }
          }
        }
      }
    }
    &:nth-child(2) {
      margin-top: 10px;
    }
  }
}
.week-alarm {
  .alarm-content {
    display: flex;
    height: calc(100% - 50px);
    flex-direction: column;
    box-sizing: border-box;
    .alarm-bar,
    .alarm-line {
      position: relative;
      box-sizing: border-box;
      flex: 1;
      .alarm-bar-title {
        position: absolute;
        top: 10px;
        display: flex;
        padding: 0 30px 0 20px;
        width: 100%;
        line-height: 24px;
        box-sizing: border-box;
        .title-left {
          flex: 1;
        }
        .title-right {
          position: relative;
          display: flex;
          flex: 1;
          justify-content: flex-end;
          &.week:after {
            margin-top: 8px;
            width: 11px;
            height: 7px;
            background: url(/img/red-up.png) no-repeat;
            background-size: 11px 7px;
            content: "";
          }
          span:first-child {
            display: inline-block;
            margin-right: 15px;
            vertical-align: middle;
            font-size: 1pc;
          }
          span:last-child {
            display: inline-block;
            margin-right: 3px;
            height: 22px;
            vertical-align: middle;
            line-height: 22px;
          }
        }
      }
      .week-alarm-bar {
        display: flex;
        margin-top: 44px;
        height: calc(100% - 54px);
        // background: pink;
      }
      .week-device-line {
        display: flex;
        margin-top: 44px;
        height: calc(100% - 54px);
        // background: orange;
      }
    }
    .border-line {
      margin: 0 20px;
      height: 1px;
      background-color: #e4e4e6;
    }
  }
}
.info-content-table {
  &::before {
    height: 0px;
  }
  th,
  td {
    border-bottom: 0px !important;
  }
}
</style>

 src/views/supervisoryConsole/map.vue

New file
@@ -0,0 +1,13 @@
<template>
  <iframe src="" frameborder="0"></iframe>
</template>

<script>
export default {

}
</script>

<style>

</style>