diff --git a/src/assets/styles/ruoyi.scss b/src/assets/styles/ruoyi.scss
index 67826dd..0d549ad 100644
--- a/src/assets/styles/ruoyi.scss
+++ b/src/assets/styles/ruoyi.scss
@@ -267,4 +267,14 @@
 
 .scrollbar-wrapper {
 	overflow-x: hidden !important;
-}
\ No newline at end of file
+}
+
+.column {
+    display: flex;
+    flex-direction: column;
+	.flex {
+		flex: 1;
+		display: flex;
+	}
+}
+
diff --git a/src/views/chart/boxBoardBody.vue b/src/views/chart/boxBoardBody.vue
new file mode 100644
index 0000000..1be85d9
--- /dev/null
+++ b/src/views/chart/boxBoardBody.vue
@@ -0,0 +1,53 @@
+<template>
+  <section>
+    <div class="BoxBoardBody">
+      <div class="BoxBoardTit"><slot name="tit"></slot></div>
+      <div class="body">
+        <slot></slot>
+      </div>
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  name: 'BoxBoardBody',
+  props: {
+    tit: {
+      type: String,
+      default: "",
+    },
+  }
+}
+</script>
+
+<style scoped>
+.BoxBoardBody {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 0 0 20px 0;
+}
+.body {
+  position: relative;
+  width: 99%;
+  height: 100%;
+  text-align: center;
+  vertical-align: middle;
+  line-height: 100%;
+  background-color: rgba(0, 0, 0, 0.2);
+  border: 0px solid rgba(70, 233, 255, 1);
+  border-radius: 3px 3px 3px 3px;
+  -webkit-box-shadow: #666 0px 0px 10px;
+  -moz-box-shadow: #666 0px 0px 10px;
+  /* box-shadow: #666 0px 0px 10px; */
+  pointer-events: auto;
+  z-index: 10100;
+  overflow: hidden;
+}
+.BoxBoardTit {
+  position: absolute;
+  left: 50px;
+  top: -10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/chart/boxBoardTit.vue b/src/views/chart/boxBoardTit.vue
new file mode 100644
index 0000000..4a65aef
--- /dev/null
+++ b/src/views/chart/boxBoardTit.vue
@@ -0,0 +1,37 @@
+<template>
+  <section>
+    <div class="boxBoardTit">{{tit}}</div>
+  </section>
+</template>
+
+<script>
+export default {
+  name: 'BoxBoardTit',
+  props: {
+    tit: {
+      type: String,
+      default: "",
+    },
+  }
+}
+</script>
+
+<style scoped>
+.boxBoardTit {
+  font-size: 12px;
+  width: 70px;
+  height: 20px;
+  line-height: 20px;
+  background-color: transparent;
+  color: rgba(70, 233, 255, 1);
+  font-weight: bold;
+  border: 0.5px solid rgba(70, 233, 255, 1);
+  border-radius: 10px 1px 10px 1px;
+  text-align: center;
+  vertical-align: middle;
+  z-index: 10100;
+  -webkit-box-shadow: #666 0px 0px 10px;
+  -moz-box-shadow: #666 0px 0px 10px;
+  box-shadow: #666 0px 0px 10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/chart/index.vue b/src/views/chart/index.vue
new file mode 100644
index 0000000..4082b0a
--- /dev/null
+++ b/src/views/chart/index.vue
@@ -0,0 +1,699 @@
+<template>
+  <div style="width: 100%;height:100%;position: relative;">
+    <div ref="bmap" id="main" style="width: 100%;height:100%;"></div>
+    <div id="chart">
+      <div class="center tc">
+        <div class="tit">{{time}}</div>
+        <div class="des">锐能在线设备：{{devCount}}</div>
+      </div>
+      <div class="left column">
+        <boxBoardBody class="flex">
+          <boxBoardTit slot="tit" tit="工单总览"></boxBoardTit>
+          <div ref="ticketAll" style="width: 100%;height:100%;"></div>
+        </boxBoardBody>
+        <div style="height:20px"></div>
+        <boxBoardBody class="flex">
+          <boxBoardTit slot="tit" tit="告警总览"></boxBoardTit>
+          <div ref="alarmAll" style="width: 100%;height:100%;"></div>
+        </boxBoardBody>
+
+      </div>
+      <div class="right column">
+        <div class="flex"></div>
+        <div style="height:20px"></div>
+        <boxBoardBody class="flex">
+          <boxBoardTit slot="tit" tit="告警趋势"></boxBoardTit>
+          <div ref="alarmTrend" style="width: 100%;height:100%;"></div>
+        </boxBoardBody>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import request from '@/utils/request';
+import echarts from 'echarts';
+import loadBMap from './loadBMap';
+require('echarts/extension/bmap/bmap');
+require('echarts/extension/bmap/bmap');
+import resize from '../dashboard/mixins/resize';
+
+import boxBoardTit from './boxBoardTit';
+import boxBoardBody from './boxBoardBody';
+import { parseTime } from "@/utils/ruoyi";
+
+export default {
+  name: 'Chart',
+  mixins: [resize],
+  components: { boxBoardTit, boxBoardBody },
+  data () {
+    return {
+      bmapChart: null,
+      ticketAllChart: null,
+      alarmAllChart: null,
+      alarmTrendChart: null,
+      alarmTrendDay: [],
+      alarmTrendMonth: [],
+      devCount: 5,
+      spotList: [],
+      zoom: 1,
+      date: new Date(),
+      workStatusList: {
+        '1': '待接单',
+        '2': '待回单',
+        '3': '已回单',
+      },
+      myStyleJson: [
+        {
+          "featureType": "water",
+          "elementType": "all",
+          "stylers": {
+            "color": "#021019"
+          }
+        },
+        {
+          "featureType": "highway",
+          "elementType": "geometry.fill",
+          "stylers": {
+            "color": "#000000"
+          }
+        },
+        {
+          "featureType": "highway",
+          "elementType": "geometry.stroke",
+          "stylers": {
+            "color": "#147a92"
+          }
+        },
+        {
+          "featureType": "arterial",
+          "elementType": "geometry.fill",
+          "stylers": {
+            "color": "#000000"
+          }
+        },
+        {
+          "featureType": "arterial",
+          "elementType": "geometry.stroke",
+          "stylers": {
+            "color": "#0b3d51"
+          }
+        },
+        {
+          "featureType": "local",
+          "elementType": "geometry",
+          "stylers": {
+            "color": "#000000"
+          }
+        },
+        {
+          "featureType": "land",
+          "elementType": "all",
+          "stylers": {
+            "color": "#08304b"
+          }
+        },
+        {
+          "featureType": "railway",
+          "elementType": "geometry.fill",
+          "stylers": {
+            "color": "#000000"
+          }
+        },
+        {
+          "featureType": "railway",
+          "elementType": "geometry.stroke",
+          "stylers": {
+            "color": "#08304b"
+          }
+        },
+        {
+          "featureType": "subway",
+          "elementType": "geometry",
+          "stylers": {
+            "lightness": -70
+          }
+        },
+        {
+          "featureType": "building",
+          "elementType": "geometry.fill",
+          "stylers": {
+            "color": "#000000"
+          }
+        },
+        {
+          "featureType": "all",
+          "elementType": "labels.text.fill",
+          "stylers": {
+            "color": "#857f7f"
+          }
+        },
+        {
+          "featureType": "all",
+          "elementType": "labels.text.stroke",
+          "stylers": {
+            "color": "#000000"
+          }
+        },
+        {
+          "featureType": "building",
+          "elementType": "geometry",
+          "stylers": {
+            "color": "#022338"
+          }
+        },
+        {
+          "featureType": "green",
+          "elementType": "geometry",
+          "stylers": {
+            "color": "#062032"
+          }
+        },
+        {
+          "featureType": "boundary",
+          "elementType": "all",
+          "stylers": {
+            "color": "#1e1c1c"
+          }
+        },
+        {
+          "featureType": "manmade",
+          "elementType": "geometry",
+          "stylers": {
+            "color": "#022338"
+          }
+        },
+        {
+          "featureType": "poi",
+          "elementType": "all",
+          "stylers": {
+            "visibility": "off"
+          }
+        },
+        {
+          "featureType": "all",
+          "elementType": "labels.icon",
+          "stylers": {
+            "visibility": "off"
+          }
+        },
+        {
+          "featureType": "all",
+          "elementType": "labels.text.fill",
+          "stylers": {
+            "color": "#2da0c6",
+            "visibility": "on"
+          }
+        }
+      ]
+    }
+  },
+
+  computed: {
+    time() {
+      return parseTime(this.date,'{h} : {i} : {s}')
+    }
+  },
+  mounted () {
+    let timer = setInterval(() => {
+      this.date = new Date()
+    }, 1000);
+    this.$once('hook:beforeDestroy', () => {
+      clearInterval(timer);
+      timer = null;
+    })
+
+    this.getData().then(({ code, msg, list, work, activity, devCount }) => {
+      if (200 == code) {
+        let spotList = [];
+        list.map(v => {
+          spotList.push({
+            id: v.id,
+            deviceId: v.deviceId,
+            deviceName: v.deviceName,
+            value: [parseFloat(v.longitude), parseFloat(v.latitude),]
+          })
+        })
+
+        this.spotList = spotList;
+        this.devCount = devCount;
+
+
+        this.$nextTick(() => {
+          this.initBmpChart()
+          this.initTicketAllChart(work)
+          this.initAlarmAllChart(activity)
+        });
+      }
+    })
+
+    this.initAlarmTrendChart()
+    this.getTicketData().then(({ code, msg, day, month }) => {
+      if (200 == code) {
+        this.alarmTrendDay = day;
+        this.alarmTrendMonth = month;
+        this.$nextTick(() => {
+          this.alarmTrendChartSetDay()
+        });
+      }
+    })
+
+  },
+  methods: {
+    getData () {
+      return request({
+        url: '/system/device/deviceSignal',
+        method: 'get',
+      })
+    },
+    getTicketData () {
+      return request({
+        url: '/system/warning/warningList',
+        method: 'get',
+      })
+    },
+    initTicketAllChart (ticketAll) {
+      if (!this.ticketAllChart) {
+        this.ticketAllChart = echarts.init(this.$refs.ticketAll)
+      }
+
+      let legends = Object.values(this.workStatusList);
+
+      let data = ticketAll.map(v => {
+        return {
+          name: this.workStatusList[v.workStatus],
+          value: v.workCount
+        }
+      })
+      console.log(data, ticketAll)
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b}: {c} ({d}%)'
+        },
+        legend: {
+          orient: 'vertical',
+          x: 10,
+          y: 'center',
+          textStyle: {
+            color: '#ffffff'
+          },
+          data: legends
+        },
+        color: ['#ee504f', '#edb14f', '#42cabe', '#407ebb'],
+        series: [
+          {
+            name: '工单总览',
+            type: 'pie',
+            radius: ['50%', '70%'],
+            center: ['70%', '50%'],
+            avoidLabelOverlap: false,
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: '20',
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data: data
+          }
+        ]
+      };
+      this.ticketAllChart.setOption(option);
+    },
+    initAlarmTrendChart () {
+      if (!this.alarmTrendChart) {
+        this.alarmTrendChart = echarts.init(this.$refs.alarmTrend)
+      }
+      this.alarmTrendChart.setOption({
+        visualMap: [{
+          show: false,
+          type: 'continuous',
+          seriesIndex: 0
+        }],
+        toolbox: {
+          show: true,
+          feature: {
+            // myHour: {
+            //   show: true,
+            //   title: '每小时',
+            //   name: '时',
+            //   icon: 'path://M113.48438,148.58984H248.25v318.35938h-30.85938v-32.42188h-73.04688v37.10938h-30.85938V148.58984zM217.39062,177.49609h-73.04688v98.82812h73.04688V177.49609zM144.34375,405.62109h73.04688V304.44922h-73.04688V405.62109zM261.14062,197.80859H399.8125v-86.32812h31.25v86.32812h55.46875v28.90625H431.0625v210.15625c0,34.89355-16.66895,52.34375-50,52.34375c-15.10645,0-37.24023-0.39062-66.40625-1.17188c-1.30273-9.375-3.3877-20.3125-6.25-32.8125c27.34375,2.08105,48.69727,3.125,64.0625,3.125c18.22852,0,27.34375-9.24707,27.34375-27.73438V226.71484H261.14062V197.80859zM304.89062,264.21484c20.83105,38.02197,36.58789,68.35938,47.26562,91.01562c-6.77148,3.125-17.1875,8.33398-31.25,15.625c-10.15625-24.7373-24.74023-55.59668-43.75-92.57812L304.89062,264.21484z',
+            //   onclick: function () {
+            //     console.log('每小时')
+            //   }
+            // },
+            myDay: {
+              show: true,
+              title: '每天',
+              name: '天',
+              icon: 'path://M105.46875,450.16797c97.5249-41.53418,154.29688-99.34668,170.3125-173.4375H110.54688v-29.6875h169.33594c1.17188-18.4873,1.75781-50.39062,1.75781-95.70312H132.03125v-29.6875h337.5v29.6875H316.01562c-0.2627,27.21582-0.78125,59.11572-1.5625,95.70312h175v29.6875H319.72656c24.86914,82.55273,83.26758,137.7627,175.19531,165.625c-10.67773,12.75977-19.66211,23.56543-26.95312,32.42188c-84.89648-34.24707-140.75586-90.82031-167.57812-169.72656c-20.5752,73.4375-77.4751,131.70508-170.70312,174.80469C124.21875,472.82422,116.14355,462.92773,105.46875,450.16797z',
+              onclick: () => {
+                this.alarmTrendChartSetDay()
+              }
+            },
+            myMonth: {
+              show: true,
+              title: '每月',
+              name: '月',
+              icon: 'path://M225.19531,349.82422c-5.85938,50.2627-25.45801,95.70312-58.78906,136.32812c-8.33447-8.0752-17.31885-15.8877-26.95312-23.4375c25.25928-27.34375,42.1875-59.89355,50.78125-97.65625c5.9873-27.8623,8.98438-66.40625,8.98438-115.625V114.27734h260.9375v304.6875c0,38.54102-18.35938,57.8125-55.07812,57.8125c-15.36523,0-35.15625-0.2627-59.375-0.78125c-1.30273-9.375-3.25586-20.3125-5.85938-32.8125c23.95605,1.5625,42.83789,2.34375,56.64062,2.34375c21.09375,0,31.64062-10.28711,31.64062-30.85938v-64.84375H225.19531zM228.32031,321.30859H428.125v-75H231.25C231.25,272.35254,230.27344,297.35254,228.32031,321.30859z M231.25,143.57422v74.21875h196.875v-74.21875H231.25z',
+              onclick: () => {
+                this.alarmTrendChartSetMonth()
+              }
+            },
+          }
+        },
+        title: [{
+          left: 'center',
+          text: ''
+        }],
+        tooltip: {
+          trigger: 'axis',
+          formatter: '{b0}<br />告警数: {c0}'
+        },
+        textStyle: {
+          color: '#ffffff'
+        },
+        xAxis: [{
+          data: [],
+          axisLabel: { show: false }
+        }],
+        yAxis: [{
+          splitLine: { show: false }
+        }],
+        grid: [{
+          containLabel: true,
+          left: '5',
+          right: '5',
+          top: '20%',
+          height: '70%'
+        }],
+        series: [{
+          type: 'line',
+          showSymbol: false,
+          data: []
+        }]
+      });
+      this.alarmTrendChart.showLoading();
+    },
+    alarmTrendChartSetDay () {
+      let dateX = [];
+      let dateY = [];
+      this.alarmTrendDay.forEach(v => {
+        dateX.push(v.datas)
+        dateY.push(v.count)
+      });
+      this.alarmTrendChartSetData(dateX, dateY)
+      this.alarmTrendChart.hideLoading();
+    },
+    alarmTrendChartSetMonth () {
+      let dateX = [];
+      let dateY = [];
+      this.alarmTrendMonth.forEach(v => {
+        dateX.push(v.datas)
+        dateY.push(v.count)
+      });
+      this.alarmTrendChartSetData(dateX, dateY)
+      this.alarmTrendChart.hideLoading();
+    },
+    alarmTrendChartSetData (dateX, dateY) {
+      this.alarmTrendChart.setOption({
+        visualMap: [{
+          show: false,
+          type: 'continuous',
+          seriesIndex: 0,
+          min: Math.min.apply(null, dateY),
+          max: Math.max.apply(null, dateY)
+        }],
+        xAxis: [{
+          data: dateX
+        }],
+        series: [{
+          type: 'line',
+          showSymbol: false,
+          data: dateY
+        }]
+      })
+    },
+
+    initAlarmAllChart (alarmAll) {
+      if (!this.alarmAllChart) {
+        this.alarmAllChart = echarts.init(this.$refs.alarmAll)
+      }
+      let snapAlarmAll = []
+      for (let index = 0; index < 4; index++) {
+        let snap = alarmAll.find(v => v.signalLevel == index + 1)
+        if (snap) {
+          snapAlarmAll.push(snap.warningCount)
+        } else {
+          snapAlarmAll.push(0)
+        }
+      }
+      let level4 = '四级告警 ' + snapAlarmAll[3]
+      let level3 = '三级告警 ' + snapAlarmAll[2]
+      let level2 = '二级告警 ' + snapAlarmAll[1]
+      let level1 = '一级告警 ' + snapAlarmAll[0]
+      let levels = [level1, level2, level3, level4];
+      let levelsColors = ['#ee504f', '#edb14f', '#42cabe', '#407ebb']
+      let freeStyle = {
+        normal: {
+          color: 'rgba(192,192,192,0.2)',
+          label: { show: false },
+          labelLine: { show: false }
+        },
+        emphasis: {
+          color: 'rgba(192,192,192,0.2)'
+        }
+      };
+      let dataStyle = {
+        normal: {
+          label: { show: false },
+          labelLine: { show: false },
+          barBorderRadius: 0
+        },
+        emphasis: {
+          show: false,
+          barBorderRadius: 0
+        }
+      };
+      let placeHolderStyle = {
+        normal: {
+          color: 'rgba(0,0,0,0)',
+          label: { show: false },
+          labelLine: { show: false }
+        },
+        emphasis: {
+          color: 'rgba(0,0,0,0)'
+        }
+      };
+      let maxRadius = this.$refs.alarmAll.offsetHeight / 3;
+      let sum = eval(snapAlarmAll.join("+"));
+
+      let series = [];
+      for (let index = 0; index < snapAlarmAll.length; index++) {
+        let snap = {
+          type: 'pie',
+          clockWise: false,
+          hoverAnimation: false,
+          center: ['70%', '50%'],
+          radius: [maxRadius * (0.85 - index * 0.2), maxRadius * (1 - index * 0.2)],
+          itemStyle: dataStyle,
+          data: [
+            {
+              value: snapAlarmAll[index],
+              name: levels[index],
+              itemStyle: {
+                normal: {
+                  color: levelsColors[index],
+                  label: { show: false },
+                  labelLine: { show: false }
+                },
+                emphasis: {
+                  color: levelsColors[index]
+                }
+              }
+            },
+            {
+              value: sum == 0 ? 1 : (sum - snapAlarmAll[index]),
+              name: 'invisible',
+              itemStyle: freeStyle
+            }
+          ]
+        }
+        series.push(snap)
+      }
+      this.alarmAllChart.setOption({ //加载数据图表
+        legend: {
+          show: true,
+          orient: 'vertical',
+          x: maxRadius * 0.1,
+          y: 'center',
+          itemWidth: 20,
+          itemHeight: maxRadius * 0.15,
+          itemGap: maxRadius * 0.2,
+          data: levels,
+          textStyle: {
+            color: '#ffffff'
+          }
+        },
+        series: series
+      });
+    },
+    initBmpChart () {
+      if (!this.bmapChart) {
+        this.bmapChart = echarts.init(this.$refs.bmap)
+      }
+      this.setOptions()
+    },
+    setOptions () {
+      let option = {
+        title: {　　//标题
+          textStyle: {
+            color: '#fff'
+          },
+          left: 'center'　　//标题位置，居中
+        },
+        tooltip: {
+          formatter: function (params) {
+            return (
+              "设备名: " + params.data.deviceName + "<br>设备sn: " + params.data.deviceId
+            );
+          }
+        },
+        bmap: {　　//百度地图的设置
+          center: [104.114129, 37.550339],
+          zoom: 5,
+          roam: true,
+          mapStyle: {
+            styleJson: this.myStyleJson
+          }
+        },
+        series: [
+          {
+            name: '设备分布',
+            type: 'effectScatter',
+            coordinateSystem: 'bmap',
+            data: this.spotList,
+            symbolSize: function (val, params) {
+              // console.log(val, params)
+              return 6;
+            },
+            label: {
+              show: false,
+              position: 'inside',
+              formatter: '{c}',
+              color: '#fff'
+            },
+            rippleEffect: { brushType: 'stroke' },
+            hoverAnimation: true,
+            animation: false,
+            itemStyle: { normal: { color: 'red', shadowBlur: 10, shadowColor: 'red' } },
+            zlevel: 1
+          },
+        ]
+      };
+      loadBMap("mKEqGSlYu4puhYjqtRZlsyVOtstkQ9A6")
+        .then(() => {
+          // 配置option
+          this.bmapChart.setOption(option)
+          let bmap = this.bmapChart.getModel().getComponent('bmap').getBMap();
+          bmap.enableContinuousZoom(); //启用地图惯性拖拽，默认禁用
+          bmap.addControl(new BMap.OverviewMapControl()); //添加缩略地图控件
+          bmap.enableScrollWheelZoom();//启用滚轮放大缩小
+          // bmap.addControl(new BMap.MapTypeControl());//添加地图类型控件
+          bmap.disable3DBuilding();
+          let zoomdrag = (() => {
+            let bounds = bmap.getBounds()
+            let sw = bounds.getSouthWest()//获取西南角的经纬度(左下端点)
+            let ne = bounds.getNorthEast();//获取东北角的经纬度(右上端点)
+            let wn = new BMap.Point(sw.lng, ne.lat);//获取西北角的经纬度(左上端点)
+            let es = new BMap.Point(ne.lng, sw.lat);//获取东南角的经纬度(右下端点)
+            // this.lng = bmap.getCenter().lng//经度
+            // this.lat = bmap.getCenter().lat//纬度
+            // this.lngLatZoom = [Number(this.lng.toFixed(2)), Number(this.lat.toFixed(2)), this.zoom]//经度 纬度 放大级别 用于watch监听
+            this.zoom = bmap.getZoom()//获取缩放级别
+            console.log('zoom', bmap.getZoom())
+          })
+          bmap.addEventListener("zoomend", zoomdrag) //监听地图缩放
+          bmap.addEventListener("dragend", zoomdrag) //监听地图拖拽平移
+
+          this.bmapChart.on('click', function (params) {
+            if (params.componentType == "series") {
+              let { id } = params.data;
+              window.open(`/hardware/device/detail?id=${id}`);
+            }
+          })
+        })
+    },
+  }
+}
+</script>
+
+
+<style>
+.ec-extension-bmap {
+  background: #23375f !important;
+}
+.BMap_cpyCtrl,
+.anchorBL {
+  display: none;
+}
+.BMap_omBtn.BMap_omBtnClosed,
+.anchorBR .BMap_omOutFrame,
+.BMap_omCtrl {
+  display: none;
+}
+</style>
+
+<style lang="scss" scoped>
+#chart {
+  background-color: rgba(0, 0, 0, 0);
+  padding: 0px;
+  z-index: 10100;
+  border: 0px;
+  color: white;
+  text-align: center;
+  vertical-align: middle;
+  overflow: hidden;
+  pointer-events: none;
+}
+.center,
+.left,
+.right {
+  position: absolute;
+  top: 0;
+  width: 28vw;
+  height: 100vh;
+  box-sizing: border-box;
+  display: flex;
+}
+.center {
+  width: 30vw;
+  right: 35vw;
+  display: block;
+  color: white;
+  .tit {
+    padding-top: 20px;
+    font-size: 40px;
+    text-align: center;
+    vertical-align: middle;
+  }
+  .des {
+    padding-top: 10px;
+  }
+}
+.left {
+  left: 0;
+  padding: 35px 0 35px 35px;
+}
+.right {
+  right: 0;
+  padding: 35px 35px 35px 0;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/chart/loadBMap.js b/src/views/chart/loadBMap.js
new file mode 100644
index 0000000..72c2e5a
--- /dev/null
+++ b/src/views/chart/loadBMap.js
@@ -0,0 +1,17 @@
+export default function loadBMap(ak) {
+    return new Promise(function(resolve, reject) {
+        if (typeof BMap !== 'undefined') {
+            resolve(BMap)
+            return true
+        }
+        window.onBMapCallback = function() {
+            resolve(BMap)
+        }
+        let script = document.createElement('script')
+        script.type = 'text/javascript'
+        script.src =
+            'http://api.map.baidu.com/api?v=2.0&ak=' + ak + '&callback=onBMapCallback'
+        script.onerror = reject
+        document.head.appendChild(script)
+    })
+}
\ No newline at end of file
diff --git a/src/views/index.vue b/src/views/index.vue
index d2d2ec6..16a6c93 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -7,6 +7,9 @@
       <line-chart :chart-data="lineChartData" />
     </el-row>
 
+    <el-row v-hasPermi="['/system/device/deviceSignal']"><router-link target="_blank" :to="{path:'/chart'}">查看数据</router-link>
+</el-row>
+
     <el-row :gutter="32">
       <el-col :xs="24" :sm="24" :lg="8">
         <div class="chart-wrapper">