Merge branch 'master' into develop

database/migrations/2020_12_08_155345_create_user_roles_table.php

@@ -14,8 +14,9 @@ class CreateUserRolesTable extends Migration
     public function up()
     {
         Schema::create('user_roles', function (Blueprint $table) {
-            $table->id();
-            $table->string('name')->unique();
+            $table->increments('id')->comment('主键');
+            $table->string('name')->unique()->comment('角色名称');
+            $table->tinyInteger('state')->comment('状态：1：启用，2：停用');
             $table->timestamps();
         });
     }

resources/js/views/dashboard/index.vue

@@ -14,60 +14,51 @@
               <el-col :span="6"><el-card shadow="always">设备故障<span style="margin-left: 12px;color: #5d5f5f;">{{ synthesizecount.device_offline }}</span>个</el-card></el-col>
               <el-col :span="6"><el-card shadow="always">今天报警次数<span style="margin-left: 12px;color: #F56C6C;">{{ synthesizecount.timedevicepolice }}</span>个</el-card></el-col>
             </el-row>
-            <el-row>
+            <el-row :align="'middle'">
               <el-card class="box-card" style="margin-top:12px;height: 200px;">
-                <div style="display: inline-block;">
+                <el-col :span="4" style="text-align: center;">
                   <el-progress type="dashboard" :percentage="synthesizecount.percent_alarm" color="red"></el-progress>
                   <el-tooltip class="item" effect="red" :content="synthesizecount.percent_alarm + '%'" placement="top-start">
-                    <span style="position: relative;left: -115px;top: 12px;">当前报警率</span>
+                    <p>当前报警率</p>
                   </el-tooltip>
-                </div>
-                <div style="display: inline-block;">
+                </el-col>
+                <el-col :span="4" style="text-align: center;">
                   <el-progress type="dashboard" :percentage="synthesizecount.percent_online" color="green"></el-progress>
                   <el-tooltip class="item" effect="green" :content="synthesizecount.percent_online + '%'" placement="top-start">
-                    <span style="position: relative;left: -108px;top: 12px;">设备在线率</span>
+                    <p>设备在线率</p>
                   </el-tooltip>
-                </div>
-              </el-card>
-            </el-row>
-          </div>
-          <!-- 混合统计 -->
-          <el-card class="box-card" style="margin-top:12px;padding-bottom:24px">
-            <div class="chart-container" style="position: relative; top: 2px; height: 560px;">
-              <chart height="100%" width="100%" />
-            </div>
-          </el-card>
-          <!-- 统计 -->
-          <el-card class="box-card" style="margin-top:12px;height: 200px;">
-            <div style="display: inline-block;">
+                </el-col>
+                <el-col :span="4" style="text-align: center;">
                   <el-progress type="dashboard" :percentage="memory" :color="colors"></el-progress>
                   <el-tooltip class="item" effect="dark" :content="memory + 'MB'" placement="top-start">
-                <span style="position: relative;left: -115px;top: 12px;">项目运行速度</span>
+                    <p>项目运行速度</p>
                   </el-tooltip>
-            </div>
-            <div style="display: inline-block;">
+                </el-col>
+                <el-col :span="4" style="text-align: center;">
                   <el-progress type="dashboard" :percentage="base_path" :color="colors"></el-progress>
                   <el-tooltip class="item" effect="dark" :content="base_path * 10 + 'MB'" placement="top-start">
-                <span style="position: relative;left: -108px;top: 12px;">项目容量</span>
+                    <p>项目容量</p>
                   </el-tooltip>
-            </div>
-            <div style="display: inline-block;">
+                </el-col>
+                <el-col :span="4" style="text-align: center;">
                   <el-progress type="dashboard" :percentage="end_time" :color="colors"></el-progress>
                   <el-tooltip class="item" effect="dark" :content="end_time + 'S'" placement="top-start">
-                <span style="position: relative;left: -112px;top: 12px;">访问接口速度</span>
+                    <p>访问接口速度</p>
                   </el-tooltip>
-            </div>
-            <div style="display: inline-block; position: relative;left: -36px;">
+                </el-col>
+                <el-col :span="4" style="text-align: center;">
                   <el-progress type="dashboard" :percentage="databas" :color="colors"></el-progress>
                   <el-tooltip class="item" effect="dark" :content="databas + 'S'" placement="top-start">
-                <span style="position: relative;left: -122px;top: 12px;">访问数据库速度</span>
+                    <p>访问数据库速度</p>
                   </el-tooltip>
+                </el-col>
+              </el-card>
+            </el-row>
           </div>
-            <div style="display: inline-block;position: relative;right: -808px;bottom: 127px;">
-              <el-progress type="dashboard" :percentage="rand" :color="colors"></el-progress>
-              <el-tooltip class="item" effect="dark" :content="rand + 'MB'" placement="top-start">
-                <span style="position: relative;left: -112px;top: 12px;">进程占用情况</span>
-              </el-tooltip>
+          <!-- 混合统计 -->
+          <el-card class="box-card" style="margin-top:12px;padding-bottom:24px">
+            <div class="chart-container" style="position: relative; top: 2px; height: 560px;">
+              <chart height="100%" width="100%" />
             </div>
           </el-card>
         </el-col>

resources/js/views/map/index.vue

@@ -33,6 +33,7 @@
         :stroke-color="'#ccc'"
         :stroke-opacity="0.9"
         :events="markerClickEvent(marker)"
+        :check="playAudio(marker.devicepolice)"
       ></el-amap-circle-marker>
       <!-- 右上角设备和用户切换按钮 -->
       <div class="toolbar">
@@ -184,6 +185,8 @@ export default {
   data(){
     const _this = this;
     return {
+      audio: new Audio('/audio/alarm.wav'),
+      audio_play: false,
       intervalId: null,
       map: {},
       amapManager: new AMapManager(),
@@ -413,6 +416,30 @@ export default {
       clearInterval(this.intervalId); // 清除计时器
       this.intervalId = null; // 设置为null
     },
+    // 播放报警声音
+    playAudio(state) {
+      if (this.audio_play === false && (state === 4 || state === 5 || state === 6 || state === 16)) {
+        const playPromise = this.audio.play();
+        const that = this;
+        if (playPromise) {
+          playPromise.then(() => {
+            // 音频加载成功
+            // 音频的播放需要耗时
+            that.tiemr = setInterval(() => {
+              that.second--;
+              if (that.second <= 0) {
+                this.audio.pause();
+                this.audio_play = true;
+                clearInterval(that.tiemr);
+              }
+            }, 1000);
+          }).catch((e) => {
+            // 音频加载失败
+            console.error(e);
+          });
+        }
+      }
+    },
   },
 };
 </script>