Преглед на файлове

fix:大屏跳转其他系统

wenhongquan преди 3 години
родител
ревизия
ce4202c8c7

+ 4 - 4
index.html

@@ -12,7 +12,7 @@
     <!--    <script src="../webClient/webClient_initWnd.js"></script>-->
 
     <!-- <script src="https://gw.alipayobjects.com/os/antv/pkg/_antv.g6-3.1.1/build/g6.js"></script> -->
-    <!-- <link rel="stylesheet" href="http://61.147.254.211:21009/minemapapi/v2.1.0/minemap.css">
+    <link rel="stylesheet" href="http://61.147.254.211:21009/minemapapi/v2.1.0/minemap.css">
     <script src="http://61.147.254.211:21009/minemapapi/v2.1.0/minemap.js"></script>
     <script>
         minemap.domainUrl = 'http://61.147.254.211:21009';
@@ -26,10 +26,10 @@
          */
         minemap.key = "d054b0f4433b42f1a28c1a97fbf8317d";
         minemap.solution = 12886;
-    </script> -->
+    </script>
 
 
-    <link rel="stylesheet" href="https://minedata.cn/minemapapi/v2.1.0/minemap.css" />
+    <!-- <link rel="stylesheet" href="https://minedata.cn/minemapapi/v2.1.0/minemap.css" />
     <script src="https://minedata.cn/minemapapi/v2.1.0/minemap.js"></script>
 
     <script>
@@ -41,7 +41,7 @@
 
         minemap.key = '77ef70465c2d4888b3a5132523494b94';
         minemap.solution = 16857;
-    </script>
+    </script> -->
     <script>
         (function(win, lib) {
             var doc = win.document;

BIN
src/assets/header@2x.png


BIN
src/assets/icons/detail/direct1@2x.png


BIN
src/assets/icons/syslink/card-bg60.png


BIN
src/assets/icons/syslink/down.png


BIN
src/assets/icons/syslink/jtyjzh.png


BIN
src/assets/icons/syslink/sjyxjc.png


BIN
src/assets/icons/syslink/up.png


BIN
src/assets/icons/syslink/zfyxjc.png


BIN
src/assets/icons/syslink/zfzhdd.png


+ 56 - 2
src/components/MapView/index.tsx

@@ -1,4 +1,14 @@
-import { defineComponent, onMounted, ref } from 'vue';
+import { defineComponent, onMounted, ref, reactive } from 'vue';
+
+/** @ts-ignore */
+import icon_sys_zfzhdd from '@/assets/icons/syslink/zfzhdd.png';
+/** @ts-ignore */
+import icon_sys_zfyxjc from '@/assets/icons/syslink/zfyxjc.png';
+/** @ts-ignore */
+import icon_sys_sjyxjc from '@/assets/icons/syslink/sjyxjc.png';
+/** @ts-ignore */
+import icon_sys_jtyjzh from '@/assets/icons/syslink/jtyjzh.png';
+
 
 let ispro = process.env.NODE_ENV === 'production';
 export default defineComponent({
@@ -10,6 +20,29 @@ export default defineComponent({
 
     let tipcontentRef = ref<Element>();
 
+    const linksysdata = reactive([
+      {
+        name: '市局运行监测',
+        image: icon_sys_sjyxjc,
+        url: 'http://61.147.254.211:9999/screen/',
+      },
+      {
+        name: '执法运行监测',
+        image: icon_sys_zfyxjc,
+        url: 'http://10.11.208.13:30080/tles-hcdp-web/#/OperationMonitoring',
+      },
+      {
+        name: '执法指挥调度',
+        image: icon_sys_zfzhdd,
+        url: 'http://10.11.208.13:30080/tles-hcdp-web/#/HCdpView',
+      },
+      {
+        name: '交通应急指挥',
+        image: icon_sys_jtyjzh,
+        url: 'http://sqpchd.xt.wenhq.top:8083/#/home',
+      },
+    ]);
+
 
     onMounted(() => {
       const map = new window.minemap.Map({
@@ -27,6 +60,27 @@ export default defineComponent({
       ctx.emit('update:map', map);
     });
     
-    return () =>  (<><div id="map" style={{ height: '100%' }} ref={mapRef} /> <div class="maptip" ref={ tipcontentRef }> </div></>);
+    return () => (
+      <>
+        <div id="map" style={{ height: '100%' }} ref={mapRef} />{' '}
+        <div class="othersystem">
+          
+            {linksysdata.map((i, index) => (
+              <div class="sys-item" datatype={`${index+1 == linksysdata.length?"1":'0'}`}>
+                <a href={i.url}>
+                  <div class="sys-item-img">
+                    <img src={i.image} />
+                  </div>
+                  <div class="sys-item-title">{i.name}</div>
+                </a>
+              </div>
+            ))}
+          </div>{' '}
+          <div class="maptip" ref={tipcontentRef}>
+            {' '}
+          </div>
+        
+      </>
+    );
   },
 });

+ 46 - 0
src/components/MarkerMap/index.scss

@@ -67,6 +67,52 @@
             }
         }
     }
+    .othersystem {
+        position: absolute;
+        bottom: 4%;
+        left: 35%;
+        width: 30%;
+        height: 15%;
+        text-align: center;
+        flex-direction: row;
+        display: flex;
+        justify-content: space-around;
+        .othersystem1 {
+            // background: #060761;
+            // max-width: 80%;
+            padding: px2rem(5px * 2) px2rem(10px * 2);
+            border-radius: 9px;
+            margin: auto;
+            text-align: center;
+            border-radius: px2rem(10px * 2);
+            display: flex;
+        }
+        a {
+            color: #fff;
+            // background: #00a3ff;
+            text-underline-offset: none;
+        }
+        a:hover {
+            cursor: pointer;
+        }
+        .sys-item {
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+            // margin-right: px2rem(20px * 2);
+            color: white;
+            font-size: 300%;
+            font-weight: bold;
+            .sys-item-img>img {
+                width: px2rem(75px * 2);
+                height: px2rem(75px * 2);
+            }
+            &[datatype='1'] {
+                margin-right: px2rem(0px * 2);
+            }
+        }
+    }
     .minemap-map {
         .minemap-popup-tip {
             display: none;

+ 11 - 6
src/views/IncidentDetail/IncidentPlanCard/index.tsx

@@ -1,6 +1,8 @@
 import Card from '@/components/Card';
 import { useIncidentStore } from '@/store';
 import { defineComponent, ref } from 'vue-demi';
+// @ts-ignore
+import IconStyle from '@/assets/icons/detail/direct1@2x.png';
 
 const lists = [
   '生成处置方法',
@@ -25,7 +27,10 @@ export default defineComponent({
           {/* <el-checkbox-group v-model={types.value}> */}
           {store?.incidentDetail?.task?.map((t) => (
             <div class="plan-content">
-              <div class="plan-title">{t.taskName}</div>
+              <div class="plan-title">
+                <img src={IconStyle} />
+                {t.taskName}
+              </div>
               <div class="plan-c">
                 <div class="plan-comm">
                   <div class="pt">指挥:</div>
@@ -37,12 +42,12 @@ export default defineComponent({
                 </div>
                 <div class="plan-cmd">
                   <div class="pt">指令:</div>
-                   <div class="pc">
-                  {t.taskCommandVos?.map((i) => (
-                    <div>{i.command}</div>
-                  ))}
-                  </div>
+                  <div class="pc">
+                    {t.taskCommandVos?.map((i) => (
+                      <div>{i.command}</div>
+                    ))}
                   </div>
+                </div>
               </div>
             </div>
             // <el-checkbox disabled class="plan-item" label={t.taskName} />

+ 13 - 1
src/views/IncidentDetail/index.scss

@@ -408,9 +408,18 @@
                         font-weight: 400;
                         text-align: left;
                         color: #ffffff;
+                        // margin-left: px2rem(3px * 2);
                         margin-bottom: px2rem(20px * 2);
+                        .plan-title {
+                            >img {
+                                width: px2rem(35px * 2);
+                                height: px2rem(35px * 2);
+                                vertical-align: middle;
+                                margin-right: px2rem(14px * 2);
+                            }
+                        }
                         .plan-c {
-                            margin-left: px2rem(13px * 2);
+                            margin-left: px2rem(49px * 2);
                             margin-top: px2rem(17px * 2);
                             opacity: 0.66;
                             font-size: px2rem(16px * 2);
@@ -421,6 +430,9 @@
                             .plan-comm,
                             .plan-cmd {
                                 margin-top: px2rem(10px * 2);
+                                .pc {
+                                    max-width: 80%;
+                                }
                             }
                             .plan-comm {
                                 .pc {