变形监测部分接口对接

public/datav/detail/static/css/public-detail.css

+.mineInfo {
+    padding-left: 10px;
+}
+
+.mineInfo p {
+    margin-top: 6px;
+    margin-bottom: 6px;
+}
+
+.menuInfo {
+    overflow: hidden;
+    margin-top: 28px;
+    margin-left: 10px;
+}
+
+.menuInfo li {
+    float: left;
+    margin-right: 16px;
+    margin-bottom: 16px;
+    width: 100px;
+    height: 30px;
+    text-align: center;
+    line-height: 30px;
+    cursor: pointer;
+    background-image: url('../detail/menuBtnBg.png');
+    background-size: cover;
+}
+
+.menuInfo li:hover {
+    background-color: #084291;
+}
+
+.menuInfo li.active {
+    background-color: #084291;
+}
+
+/*elementui 样式重写*/
+.el-range-editor .el-range-input {
+    background: transparent;
+    color: #dbdbdb;
+}
+
+.el-date-editor.el-range-editor.el-input__inner.el-date-editor--datetimerange{
+    background: transparent;
+}
+
+.el-range-editor.el-input__inner {
+    border: 1px solid #7c7e7f !important;
+}
+
+.el-date-editor .el-range-separator{
+    color: #bababa;
+    margin-top: 6px;
+}
+
+.el-input--small .el-input__inner {
+    color: #bababa !important;
+    font-size: 16px !important;
+    border: 1px solid #efdada !important;
+    text-align: center;
+}
+
+.el-date-editor .el-range__icon {
+    margin-left: 5px;
+}
+
+section {
+    width: 440px;
+}
+
+section .header {
+    height: 40px;
+    background-color: #b8b1b266;
+    line-height: 40px;
+    border-bottom: 1px solid #9797ac;
+    cursor: pointer;
+}
+
+section .header .el-icon-caret-right:before,
+section .header .el-icon-caret-down:before {
+    content: "\e791";
+    color: #a5a4a4;
+    font-size: 22px;
+}
+
+section .list-wrapper {
+    max-height: 300px;
+    overflow-y: auto;
+}
+
+section .list-item {
+    height: 40px;
+    margin-left: 20px;
+    line-height: 40px;
+    border-bottom: 1px solid #735b5b;
+    cursor: pointer;
+}
+
+section .list-item span {
+    margin-left: 10px;
+}
+
+section .list-item .el-icon-caret-right:before {
+    content: "\e791";
+    color: #a5a4a4;
+    font-size: 18px;
+}
+/*列表list*/
+
+.tableList .bg-list-item{
+    background: transparent;
+}
\ No newline at end of file

public/datav/detail/static/js/public-detail.js

+let jessibucaPlayer = {};
+//const host = location.protocol + '//' + window.location.host;
+window.detail_token = Cookies.get('ELADMIN-TOEKN');
+console.log('axios',axios)
+window.detail_axios = axios.create({
+    headers: { 'Authorization': window.detail_token }
+});
+window.detail_axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
+
+console.log('window.detail_axios',window.detail_axios)
+window.detail_axios.interceptors.response.use(
+    response => {
+        return response
+    }, error => {
+        console.error(error)
+        let code = 0
+        try {
+            code = error.response.data.status
+        } catch (e) {
+            if (error.toString().indexOf('Error: timeout') !== -1) {
+                console.error('当前网络不佳')
+                return
+            }
+        }
+        if (!code) {
+            console.error('当前网络不佳')
+            return
+        }
+        if (code === 401) {
+            alert('登录信息失效，请重新登录')
+            window.open(host + '/#/login', '_self')
+            return
+        }
+        if (code === 400 && message === '不允许访问') {
+            alert('您没有权限使用此功能，请联系管理员开通')
+            return
+        }
+    }
+);
+
+const host = location.protocol + '//' + (location.hostname === '192.168.3.38' ? '192.168.3.37' : '192.168.13.200') + ':8013';
+
+const selfHost = location.hostname === '192.168.3.38' ? 'http://192.168.3.226:8057' : location.protocol + '//' + window.location.host;
+
+
+
+if (!window.detail_token) {
+    window.open(host + '/#/login', '_self')
+    return
+}
+
+// if (this.selectedMine.mineType != 2) {
+//     alert('您当前选择的不是露天矿山，请先选择露天矿山，再查看此大屏')
+//     window.history.go(-1)
+//     return
+// }
\ No newline at end of file

public/datav/detail/wind-monitor.html

@@ -10,124 +10,16 @@
     <link rel="stylesheet" href="../css/element-ui.css">
     <!-- 引入样式文件 -->
     <link rel="stylesheet" href="../css/vant@4.css" />
+    <!-- 引入大屏内页公共样式 -->
+    <link rel="stylesheet" href="./static/css/public-detail.css" />
+    
     <!-- 先引入 Vue -->
     <script src="../js/vue.min.js"></script>
     <!-- 引入 Vue 和 Vant 的 JS 文件 -->
     <script src="../js/vue@2.6.14"></script>
     <script src="../js/vant.min.js"></script>
     <style>
-        .el-autocomplete-suggestion {
-            width: 330px !important;
-        }
-
-        .mineInfo {
-            padding-left: 10px;
-        }
-
-        .mineInfo p {
-            margin-top: 6px;
-            margin-bottom: 6px;
-        }
-
-        .menuInfo {
-            overflow: hidden;
-            margin-top: 28px;
-            margin-left: 10px;
-        }
-
-        .menuInfo li {
-            float: left;
-            margin-right: 16px;
-            margin-bottom: 16px;
-            width: 100px;
-            height: 30px;
-            text-align: center;
-            line-height: 30px;
-            cursor: pointer;
-            background-image: url('./static/detail/menuBtnBg.png');
-            background-size: cover;
-        }
-
-        .menuInfo li:hover {
-            background-color: #084291;
-        }
-
-        .menuInfo li.active {
-            background-color: #084291;
-        }
-
-        /*elementui 样式重写*/
-        .el-range-editor .el-range-input {
-            background: transparent;
-            color: #dbdbdb;
-        }
-
-        .el-date-editor.el-range-editor.el-input__inner.el-date-editor--datetimerange{
-            background: transparent;
-        }
-
-        .el-range-editor.el-input__inner {
-            border: 1px solid #7c7e7f !important;
-        }
        
-        .el-date-editor .el-range-separator{
-            color: #bababa;
-            margin-top: 6px;
-        }
-
-        .el-input--small .el-input__inner {
-            color: #bababa !important;
-            font-size: 16px !important;
-            border: 1px solid #efdada !important;
-            text-align: center;
-        }
-
-        .el-date-editor .el-range__icon {
-            margin-left: 5px;
-        }
-
-        section {
-            width: 440px;
-        }
-
-        section .header {
-            height: 40px;
-            background-color: #b8b1b266;
-            line-height: 40px;
-            border-bottom: 1px solid #9797ac;
-            cursor: pointer;
-        }
-
-        section .header .el-icon-caret-right:before,
-        section .header .el-icon-caret-down:before {
-            content: "\e791";
-            color: #a5a4a4;
-            font-size: 22px;
-        }
-
-        section .list-wrapper {
-            max-height: 300px;
-            overflow-y: auto;
-        }
-
-        section .list-item {
-            height: 40px;
-            margin-left: 20px;
-            line-height: 40px;
-            border-bottom: 1px solid #fff;
-            cursor: pointer;
-        }
-
-        section .list-item .el-icon-caret-right:before {
-            content: "\e791";
-            color: #a5a4a4;
-            font-size: 18px;
-        }
-        /*列表list*/
-
-        .tableList .bg-list-item{
-            background: transparent;
-        }
     </style>
 </head>
 
@@ -158,7 +50,6 @@
 
         <div class="flex-text ml10 mr10 mt15">
             <div style="width: 490px;height: calc(100vh - 110px);">
-                <!-- 通知公告 -->
                 <div style="background: linear-gradient(to bottom, rgba(13,27,48,.7), rgba(13,27,48,0));">
                     <div class="mineInfo">
                         <p>矿山名称： 淄博红圈石料厂</p>
@@ -180,8 +71,6 @@
                     </div>
 
                 </div>
-
-                <!-- 视频监控列表 -->
                 <div class="relative mt20" style="width: 490px;height: calc(100vh - 170px);">
                     <section>
                         <div class="list-wrapper" v-show="showMenu4bianpo">
@@ -258,6 +147,8 @@
 <script src="../js/axios.min.js"></script>
 <!-- cookie -->
 <script src="../js/js.cookie.js"></script>
+<!-- 详情内页公用js -->
+<script src="./static/js/public-detail.js"></script>
 
 <script>
     let jessibucaPlayer = {};