更新退出

src/api/user-manage.js

@@ -599,7 +599,7 @@ export const selectUserDeptPage = (data = {}) => {
 ///unifiedLogin
 export const unifiedLogin = (data) => {
   return request({
-    url: api + `/unifiedLogin`,
+    url: api + `/ssoLogin`,
     method: "POST",
     data
   });

src/assets/css/homeScreen.scss

@@ -0,0 +1,492 @@
+.bigScrenn {
+  height: 100vh;
+  width: 100vw;
+  overflow: hidden;
+  background: #001022;
+  position: relative;
+  color: #fff;
+
+  .headBox {
+    position: absolute;
+    height: 90px;
+    width: 100%;
+    background: #001022;
+    top: 0;
+    z-index: 9;
+
+    .top {
+      display: flex;
+      justify-content: space-between;
+      width: 100%;
+      height: 100%;
+      padding: 0 4px;
+
+      .top-left {
+        display: flex;
+        margin-top: 30px;
+
+        .time {
+          margin-left: 38px;
+          font-style: italic;
+          font-weight: bolder;
+
+          .timer {
+            font-size: 24px;
+            letter-spacing: 3px;
+            color: #fff;
+          }
+
+          .week {
+            color: #00ADFF;
+            font-size: 14px;
+          }
+
+        }
+      }
+
+      .top-center {
+        width: 340px;
+        height: 90px;
+      }
+
+      .top-right {
+        display: flex;
+        margin-top: 30px;
+        align-items: center;
+
+        .info {
+          display: flex;
+          align-items: center;
+
+          .text {
+            color: #e6ffff;
+            font-size: 15px;
+            margin-left: 14px;
+            line-height: 23px;
+
+            .dept {
+              max-width: 200px;
+              overflow: hidden;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+            }
+          }
+        }
+
+        .meun {
+          margin-left: 30px;
+          margin-right: 4px;
+        }
+
+        .el-dropdown-tools {
+          display: inline-block;
+          width: 40px;
+          height: 40px;
+          border: 1px solid rgb(20, 135, 180);
+          border-radius: 50%;
+          text-align: center;
+
+          .el-dropdown-tools-n {
+            display: inline-block;
+            width: 34px;
+            height: 34px;
+            border: 1px solid #fff;
+            border-radius: 50%;
+            background: #9ec6fc;
+            text-align: center;
+            line-height: 32px;
+            margin-top: 2px;
+            padding-top: 2px;
+            box-sizing: border-box;
+          }
+        }
+      }
+    }
+  }
+
+  .asideBox {
+    position: absolute;
+    top: 70px;
+    height: calc(100vh - 72px);
+    width: 442px;
+    background: #263445;
+    z-index: 2;
+
+    .boder-small {
+      height: 32.5%;
+      background-size: 100% 100%;
+      margin-bottom: 10px;
+    }
+
+    .boder-middle {
+      height: 66%;
+      background-size: 100% 100%;
+      margin-bottom: 10px;
+    }
+
+    .boder-big {
+      height: 100%;
+      background-size: 100% 100%;
+    }
+
+    .boder-top {
+      height: 280px;
+      background-size: 100% 100%;
+    }
+
+    .boder-center {
+      height: calc(100% - 510px);
+      background-size: 100% 100%;
+    }
+
+    .boder-bottom {
+      height: 230px;
+      background-size: 100% 100%;
+    }
+
+    .boxContent {
+      height: 100%;
+      padding: 6px 20px 10px;
+      box-sizing: border-box;
+
+      .box-title {
+        padding: 0 10px 0 30px;
+        box-sizing: border-box;
+        font-size: 22px;
+        font-family: "YSBTH";
+        background: linear-gradient(0deg, #59a6f4 0%, #ffffff 100%);
+        -webkit-background-clip: text;
+      }
+
+      .boxInfo {
+        height: calc(100% - 70px);
+        margin-top: 8px;
+      }
+
+      .cntBoxInfo {
+        height: calc(100% - 46px);
+        overflow: hidden;
+        overflow-y: auto;
+      }
+    }
+  }
+
+  .addBox {
+    position: absolute;
+    bottom: 70px;
+    pointer-events: auto;
+    cursor: pointer;
+
+    .imgBox {
+      width: 111px;
+      height: 112px;
+      text-align: center;
+
+      span {
+        display: inline-block;
+        width: 30px;
+        margin-top: 36px;
+        font-size: 14px;
+      }
+    }
+  }
+
+  @mixin sircle {
+    position: absolute;
+    width: 73px;
+    height: calc(100vh - 72px);
+    top: 90px;
+  }
+
+  .leftSiecle {
+    @include sircle;
+    background-size: 100% 100%;
+    z-index: 1;
+  }
+
+  .rightSiecle {
+    @include sircle;
+    right: 370px;
+    background-size: 100% 100%;
+    z-index: 1;
+  }
+
+  // 尾部
+  .footBox {
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 800px;
+    z-index: 10;
+
+    .btnsBox {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      width: 85%;
+
+      .btnsItem {
+        position: relative;
+        cursor: pointer;
+
+        .resourceBox {
+          display: none;
+          position: absolute;
+          bottom: 37px;
+          left: 50%;
+          transform: translateX(-50%);
+          padding: 10px 10px 24px 10px;
+          box-sizing: border-box;
+
+          .contant {
+            position: relative;
+            padding: 20px 10px;
+            box-sizing: border-box;
+            background-size: 100% 100%;
+
+            .name {
+              color: #00BFFF;
+            }
+
+            .footerCheck {
+              display: flex;
+              justify-content: center;
+
+              .el-checkbox-group {
+                text-align: center;
+              }
+            }
+          }
+
+        
+        }
+
+        .resourceBoxOther {
+          display: block;
+        }
+      }
+
+      .btnsItem:hover .resourceBox {
+        display: block;
+      }
+    }
+  }
+
+  .popover {
+    position: absolute;
+    background: #08226a;
+    left: 264px;
+    top: 32px;
+    width: 220px;
+    padding: 6px;
+    box-sizing: border-box;
+    border-radius: 4px;
+
+    .el-tag {
+      margin: 4px 2px;
+    }
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 46px;
+      left: -15px;
+      display: inline-block;
+      width: 0;
+      height: 0;
+      border: 8px solid transparent;
+      border-right-color: #08226a;
+      z-index: 989;
+    }
+  }
+
+  .popoverKfd {
+    position: absolute;
+    background: #08226a;
+    left: -199px;
+    top: 100px;
+    width: 270px;
+    padding: 6px;
+    box-sizing: border-box;
+    border-radius: 4px;
+
+    .el-tag {
+      margin: 4px 2px;
+    }
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 13px;
+      left: 270px;
+      display: inline-block;
+      width: 0;
+      height: 0;
+      border: 8px solid transparent;
+      border-left-color: #08226a;
+      z-index: 989;
+    }
+  }
+}
+
+.dialogBox {
+  padding: 0 0 10px 0;
+  box-sizing: border-box;
+  background: url('~@/assets/images/dialog-bg.png') no-repeat center center;
+  background-size: 100% 100%;
+  z-index: 999;
+  border-radius: 4px;
+
+  >.title {
+    height: 38px;
+    line-height: 38px;
+    margin: 0 4px;
+    display: flex;
+    border-bottom: 1px solid #275288;
+    margin-bottom: 6px;
+    justify-content: space-between;
+    align-items: center;
+    background-image: linear-gradient(to right, rgba(1, 127, 216, 1), rgba(4, 56, 131, .5), rgba(1, 130, 218, .0));
+
+    .close {
+      font-size: 20px;
+      font-weight: 200;
+      cursor: pointer;
+      margin-right: 10px;
+    }
+
+    .mc {
+      margin-left: 10px;
+    }
+  }
+
+  .infoBox {
+    border: none;
+    position: relative;
+    // border: 1px solid #275288;
+    padding: 10px 0 4px;
+    box-sizing: border-box;
+  }
+
+  .addressBox {
+    border-top: 1px solid #162f55;
+    margin: 0 10px;
+    // height: 30px;
+    line-height: 24px;
+    display: flex;
+    justify-content: space-between;
+
+    img,
+    span {
+      vertical-align: middle;
+    }
+
+    img {
+      margin-right: 4px;
+    }
+  }
+
+  >.btnBox {
+    text-align: center;
+    padding-top: 8px;
+    padding-bottom: 12px;
+    margin-bottom: 10px;
+
+    button {
+      margin: 0 2px;
+    }
+  }
+}
+
+button.dp-default {
+  border: 1px solid #3180ea;
+  box-shadow: inset 0 0 18px #2b8ce6;
+  background: #001022;
+  color: #fff;
+  height: 30px;
+  padding: 0 15px;
+  border-radius: 3px;
+  cursor: pointer;
+
+  &.small {
+    height: 22px;
+    line-height: 20px;
+    vertical-align: middle;
+    padding: 0 6px;
+    box-shadow: inset 0 0 10px #2b8ce6;
+    font-size: 12px;
+
+    span,
+    svg {
+      vertical-align: middle;
+    }
+  }
+}
+
+.tag {
+  display: inline-block;
+  background-color: #999;
+  font-size: 11px;
+  border-radius: 2px;
+  margin-left: 3px;
+  color: #fff;
+  width: 40px;
+  text-align: center;
+  height: 20px;
+  line-height: 20px;
+  vertical-align: middle;
+
+  &.blue {
+    background-color: #0b9ff4;
+  }
+
+  &.orange {
+    background-color: #e15923;
+  }
+
+  &.red {
+    background-color: #e21c1c;
+  }
+
+  &.yellow {
+    background-color: #d6d301;
+  }
+
+  &.green {
+    background-color: #56db2d;
+  }
+
+  &.mj {
+    background-color: #4995fd;
+  }
+
+  &.fj {
+    background-color: #3ad2d4;
+  }
+}
+
+.xlStatus {
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 56px;
+  text-align: center;
+  height: 24px;
+  line-height: 24px;
+  border-bottom-left-radius: 10px;
+  cursor: pointer;
+  color: #000;
+}
+
+.line {
+  background: #00bc65;
+}
+
+.lineing {
+  background: #AB0F0B;
+}
+
+.unline {
+  background: #808080;
+}

src/components/GdMap/index.vue

@@ -1,8 +1,7 @@
 <template>
   <div :id="mapid" class="map"></div>
   <div class="changeMap_box" v-if="props.isShow">
-    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
+    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
-      style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
     <!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3"  @change="onMapImageChange">
       <el-carousel-item>
         <div class="mapImageItem">
@@ -75,7 +74,7 @@ const props = defineProps({
 });
 try {
   const userInfo = getItem("deptId")[0].deptCode;
-} catch (error) { }
+} catch (error) {}
 let map;
 let mapLayer;
 let mapLayer1;
@@ -89,33 +88,27 @@ onMounted(() => {
 
   map = new EliMap({
     id: props.mapid,
-    crs: "EPSG:4490",
+    crs: "EPSG:3857",
     style: {
       glyphs: "./fonts/{fontstack}/{range}.pbf",
-      center: [94.36057012, 29.64276831],
+      center: [94.36,29.65],
-      zoom: 15
+      zoom: 10
     },
-    minZoom: 7,
+    transformRequest: (url) => {
-    maxZoom: 18,
+      if (url.indexOf("TileMatrix=") != -1) {
+        const arr = url.split("TileMatrix=");
+        const arr1 = arr[1].split("&");
+        const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
+
+      }
+    }
   });
+
   window.map = map;
   map.mapboxGLMap.on("load", () => {
-    map.addWMTSLayer(
+     map.addGaudLayer({
-      "http://89.0.23.24/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
+      url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
-      ,
+    })
-      {
-        Service: "getImage",
-        Type: "RGB",
-        ZoomOffset: "0",
-        V: "0.3",
-        Zoom: "{z}",
-        Row: "{y}",
-        Col: "{x}"
-      },
-      {
-        tileSize: 300
-      }
-    );
     zoomTarget.value = map.mapboxGLMap.getZoom();
   });
   mapUtil.value = new MapUtil(map);
@@ -173,7 +166,7 @@ onMounted(() => {
   });
   // 回显线
   emitter.on("echoLine", (res) => {
-    mapUtil.value.createLine(res, res.flag);
+    mapUtil.value.createLine(res);
   });
   //创建边界面（geojson）
   emitter.on("setBoundarys", (res) => {
@@ -204,6 +197,11 @@ onMounted(() => {
     mapUtil.value.diffusionCircle(res);
   });
 
+  // 清除全部覆盖物
+  emitter.on("removeElementAll", () => {
+    mapUtil.value.removeElementAll();
+  });
+
   // 展示盘曲
   emitter.on("showGapText", (obj) => {
     mapUtil.value.gapText(obj);
@@ -302,6 +300,7 @@ onUnmounted(() => {
   emitter.off("diffusionCircle");
   emitter.off("SsCircle");
   emitter.off("ClearssCircle");
+  emitter.off("removeElementAll");
 });
 </script>
 
@@ -324,35 +323,29 @@ onUnmounted(() => {
   right: 398px;
   bottom: 4px;
   z-index: 9;
-
   .mapImageItem {
     border: 1px solid #08aae8;
     background: rgb(9, 26, 70);
-
+    & > img {
-    &>img {
       width: 100%;
       height: 50px;
     }
-
+    & > div {
-    &>div {
       text-align: center;
       position: relative;
       top: -3px;
     }
   }
-
   .zoomTargetBox {
     margin-top: 10px;
     margin-left: 23px;
   }
-
   ::v-deep .el-input-number__decrease,
   ::v-deep .el-input-number__increase {
     background: #133362;
     color: #fff;
     border: none;
   }
-
   ::v-deep .el-input__inner {
     background: #0c1641;
   }

src/components/GdMap/indexnw.vue

@@ -1,7 +1,8 @@
 <template>
   <div :id="mapid" class="map"></div>
   <div class="changeMap_box" v-if="props.isShow">
-    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" />
+    <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
+      style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
     <!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3"  @change="onMapImageChange">
       <el-carousel-item>
         <div class="mapImageItem">
@@ -74,7 +75,7 @@ const props = defineProps({
 });
 try {
   const userInfo = getItem("deptId")[0].deptCode;
-} catch (error) {}
+} catch (error) { }
 let map;
 let mapLayer;
 let mapLayer1;
@@ -88,27 +89,32 @@ onMounted(() => {
 
   map = new EliMap({
     id: props.mapid,
-    crs: "EPSG:3857",
+    crs: "EPSG:4490",
     style: {
       glyphs: "./fonts/{fontstack}/{range}.pbf",
-      center: [94.36,29.65],
+      center: [94.36057012, 29.64276831],
-      zoom: 10
+      zoom: 15
     },
-    transformRequest: (url) => {
+    minZoom: 7,
-      if (url.indexOf("TileMatrix=") != -1) {
+    maxZoom: 18,
-        const arr = url.split("TileMatrix=");
-        const arr1 = arr[1].split("&");
-        const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
-
-      }
-    }
   });
-
   window.map = map;
   map.mapboxGLMap.on("load", () => {
-     map.addGaudLayer({
+    map.addWMTSLayer(
-      url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
+      "/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap",
-    })
+      {
+        Service: "getImage",
+        Type: "RGB",
+        ZoomOffset: "0",
+        V: "0.3",
+        Zoom: "{z}",
+        Row: "{y}",
+        Col: "{x}"
+      },
+      {
+        tileSize: 300
+      }
+    );
     zoomTarget.value = map.mapboxGLMap.getZoom();
   });
   mapUtil.value = new MapUtil(map);
@@ -166,7 +172,7 @@ onMounted(() => {
   });
   // 回显线
   emitter.on("echoLine", (res) => {
-    mapUtil.value.createLine(res);
+    mapUtil.value.createLine(res, res.flag);
   });
   //创建边界面（geojson）
   emitter.on("setBoundarys", (res) => {
@@ -197,11 +203,6 @@ onMounted(() => {
     mapUtil.value.diffusionCircle(res);
   });
 
-  // 清除全部覆盖物
-  emitter.on("removeElementAll", () => {
-    mapUtil.value.removeElementAll();
-  });
-
   // 展示盘曲
   emitter.on("showGapText", (obj) => {
     mapUtil.value.gapText(obj);
@@ -300,7 +301,6 @@ onUnmounted(() => {
   emitter.off("diffusionCircle");
   emitter.off("SsCircle");
   emitter.off("ClearssCircle");
-  emitter.off("removeElementAll");
 });
 </script>
 
@@ -323,29 +323,35 @@ onUnmounted(() => {
   right: 398px;
   bottom: 4px;
   z-index: 9;
+
   .mapImageItem {
     border: 1px solid #08aae8;
     background: rgb(9, 26, 70);
-    & > img {
+
+    &>img {
       width: 100%;
       height: 50px;
     }
-    & > div {
+
+    &>div {
       text-align: center;
       position: relative;
       top: -3px;
     }
   }
+
   .zoomTargetBox {
     margin-top: 10px;
     margin-left: 23px;
   }
+
   ::v-deep .el-input-number__decrease,
   ::v-deep .el-input-number__increase {
     background: #133362;
     color: #fff;
     border: none;
   }
+
   ::v-deep .el-input__inner {
     background: #0c1641;
   }

src/layout/components/Header.vue

@@ -63,7 +63,9 @@ onMounted(() => {
   active.value = "LZ";
 });
 const logout = () => {
-  store.dispatch("user/logout");
+  window.opener = null;
+  window.open('', '_self');
+  window.close();
   store.commit("app/clearTag", null, { immediate: true });
   store.commit("permission/deleteRouter", { immediate: true });
   store.commit("user/deleteKeepLiiveRoute", "home");

src/layout/components/NavBar.vue

@@ -28,13 +28,12 @@ const updatePwd = () => {
 const store = useStore();
 
 const logout = () => {
-  store.dispatch("user/logout");
+  window.opener = null;
-  store.commit("app/clearTag", null, {
+  window.open('', '_self');
-    immediate: true
+  window.close();
-  });
+  store.commit("app/clearTag", null, { immediate: true });
-  store.commit("permission/deleteRouter", {
+  store.commit("permission/deleteRouter", { immediate: true });
-    immediate: true
+  store.commit("user/deleteKeepLiiveRoute", "home");
-  });
 };
 </script>
 

src/router/index.js

@@ -21,6 +21,11 @@ export const privateRoutes = [];
  * 公开路由表
  */
 export const publicRoutes = [
+    {
+    path: "/oatuh_login",
+    name: "oatuh_login",
+    component: () => import("@/views/login/oatuh_login")
+  },
   {
     path: "/login",
     name: "login",

src/views/home/components/warning.vue

@@ -2,7 +2,7 @@
   <div class="warning-container">
     <div class="warning-list noScollLine" v-infinite-scroll="scroll">
       <div
-        @click="roadmap(item.zb)"
+        @click="handelClick(item)"
         class="warning-card"
         v-for="(item, index) in warningList.listData"
         :key="index"
@@ -73,6 +73,12 @@ const scroll = () => {
   }
 };
 gettbGjclselectPage();
+//查看警组信息
+function handelClick(item) {
+  emitter.emit("showJzInfo", item);
+}
+
+
 //画线
 const roadmap = (row) => {
   if (row && row.length > 0) {

src/views/home/index.vue

@@ -30,6 +30,9 @@
         </div>
       </div>
     </div>
+
+        <!-- 警组弹框弹框 -->
+    <PoliceGroupInfo v-if="show.jzgroup" :data="jzxqList" />
   </div>
 </template>
 
@@ -40,7 +43,32 @@ import Collection from "./components/collection.vue";
 import Warning from "./components/warning.vue";
 import BeOnDuty from "./components/beonDuty.vue";
 import Introduction from "./components/Introduction.vue";
-import { ref } from "vue";
+import PoliceGroupInfo from "./layout/streetInfo.vue";
+import emitter from "@/utils/eventBus.js";
+import {
+  ref,
+  reactive,
+  onMounted
+} from "vue";
+const jzxqList = ref({}); //警组列表详情
+const show = reactive({
+  jzgroup: false //展示警组弹窗
+});
+onMounted(() => {
+
+ // 展示警组
+  emitter.on("showJzInfo", (res) => {
+    show.jzgroup = res ? true : false;
+    if (res) {
+      jzxqList.value = res;
+    }
+  });
+ 
+
+})
+
+
+
 </script>
 
 <style lang="scss" scoped>

src/views/home/layout/streetInfo.vue

@@ -0,0 +1,354 @@
+<template>
+  <div class="dialogBox" :style="`left:${elLeft}px;top:${elTop}px`" draggable="true" ref="dialogBoxYpfx"
+    @dragstart="dragstart($event)" @dragend="dragend($event)">
+    <div class="title">
+      <span class="mc">{{ props.data.cph }}</span>
+      <span @click="close" class="close">
+        <el-icon>
+          <Close />
+        </el-icon>
+      </span>
+    </div>
+    <div class="info-Big-Box noScollLine">
+      <div class="card">
+
+        <div class="card-cnt">
+          <div class="leftImg">
+            <el-image style="width: 100%" :src="props.data.image" :hide-on-click-modal="true" close-on-press-escape
+              fit="cover" lazy>
+            </el-image>
+          </div>
+          <div class="rightInfo">
+            <div>
+              <span class="zjhm">驾驶员：</span>{{ props.data.cljsy }}
+            </div>
+            <div>
+              <span class="zjhm">车牌号：</span>{{ props.data.cph }}
+            </div>
+            <div>
+              <span class="zjhm">行驶路线：</span>{{ props.data.xlmc }}
+            </div>
+            <div>
+              <span class="zjhm">乘车人数：</span>{{ props.data.ccrs ? props.data.ccrs : 0 }}
+            </div>
+            <div>
+              <span class="zjhm">重点人员：</span>{{ props.data.zdrs ? props.data.zdrs : 0 }}
+            </div>
+            <div>
+              <span class="zjhm">途中乘车人数：</span>{{ props.data.ztscrs ? props.data.ztscrs : 0 }}
+            </div>
+          </div>
+        </div>
+        <div class="address">
+          <img class="addImg" src="@/assets/images/dingwei.png" />
+          <span>{{ props.data.xlmc }}</span>
+        </div>
+      </div>
+
+
+    </div>
+
+    <!-- 视频播放区域 -->
+    <div v-if="showVideo" class="video-container">
+      <video ref="videoPlayer" class="video-player" controls autoplay muted :src="videoSrc">
+        您的浏览器不支持视频播放
+      </video>
+    </div>
+
+    <el-popover placement="bottom" :visible="visible" :width="476" :append-to-body="false">
+      <template #reference>
+        <div class="btnBox">
+          <button class="dp-default small" @click="onClickclgj">车辆轨迹</button>
+          <button class="dp-default small" @click="onClickSpsd">{{showVideo.value?"关闭视频":"视频播放"}}</button>
+        </div>
+      </template>
+    </el-popover>
+  </div>
+</template>
+
+<script setup>
+import Axios from "axios";
+import { qcckPost, qcckGet } from "@/api/qcckApi.js";
+import { ref, onMounted, onUnmounted, defineProps, getCurrentInstance, watch } from "vue";
+import { timeValidate } from "@/utils/time.js";
+import emitter from "@/utils/eventBus.js";
+import { ElMessage } from "element-plus";
+import { useRouter } from "vue-router";
+import { all } from "ol/events/condition";
+const { proxy } = getCurrentInstance();
+const props = defineProps({
+  data: {
+    type: Object,
+    default: {}
+  }
+});
+const visible = ref(false);
+const dialogBoxYpfx = ref();
+const videoPlayer = ref();
+const showVideo = ref(false);
+const videoSrc = ref('');
+const initWidth = ref(0); //父元素宽度
+const initHeight = ref(0); //父元素高度
+const startClientX = ref(0); //元素拖拽前距离浏览器X轴位置
+const startClientY = ref(0); //元素拖拽前距离浏览器Y轴位置
+const elLeft = ref(400); //元素左偏移量
+const elTop = ref(120); //元素右偏移量
+watch(
+  () => props.data,
+  (val) => {
+    console.log(val, 'val');
+    visible.value = false;
+  }, {
+  immediate: true,
+  deep: true
+}
+);
+onMounted(() => {
+  initBodySize();
+});
+const onClickSpsd = () => {
+  if (showVideo.value) {
+    videoPlayer.value.pause();
+    videoPlayer.value.currentTime = 0;
+  } else {
+    videoSrc.value = props.data.videoUrl || '/static/sample.mp4';
+  }
+  showVideo.value = !showVideo.value
+};
+
+
+const onClickclgj = () => {
+  let row = props.data.zb
+  if (row && row.length > 0) {
+    emitter.emit("setMapCenter", {
+      location: [row[0][0], row[0][1]],
+      zoomLevel: 12
+    });
+    emitter.emit("drawLineAnimation", {
+      type: "solid",
+      coords: row,
+      isclear: true,
+      flag: "lx"
+    });
+  }
+}
+//初始化
+const initBodySize = () => {
+  initWidth.value = dialogBoxYpfx.value.clientWidth;
+  initHeight.value = dialogBoxYpfx.value.clientHeight;
+};
+//拖拽开始
+const dragstart = (e) => {
+  startClientX.value = e.clientX;
+  startClientY.value = e.clientY;
+};
+//拖拽结束
+const dragend = (e) => {
+  let x = e.clientX - startClientX.value;
+  let y = e.clientY - startClientY.value;
+  elLeft.value += x;
+  elTop.value += y;
+};
+
+//关闭弹窗
+function close() {
+  visible.value = false;
+  emitter.emit("showJzInfo", false);
+  emitter.emit("deletePointArea", "lx");
+}
+
+
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+
+.dialogBox {
+  position: absolute;
+  padding: 0;
+  width: 484px !important;
+
+  .video-container {
+    margin: 10px auto;
+    border-radius: 4px;
+    overflow: hidden;
+    text-align: center; // 容器居中对齐
+    .video-player {
+      width: 100%;
+      max-width: 400px; // 设置最大宽度
+      height: 200px;
+      display: block;
+      margin: 0 auto; // 水平居中
+    }
+  }
+
+  .title {
+    border-bottom: 1px solid #275288;
+    margin-bottom: 6px;
+
+    .mc {
+      margin-left: 10px;
+    }
+  }
+
+  .info-Big-Box {
+    max-height: 70vh;
+    overflow: hidden;
+    overflow: auto;
+    padding: 4px 10px;
+    box-sizing: border-box;
+  }
+
+  .card {
+    padding: 10px 10px 4px 10px;
+    box-sizing: border-box;
+    border-top: 2px solid #00bfff;
+    line-height: 20px;
+    font-size: 14px;
+    background: #052955;
+
+    .card-cnt {
+      display: flex;
+      background: rgba(255, 255, 255, 0.05);
+      margin-bottom: 4px;
+
+      .leftImg {
+        width: 180px;
+        margin-right: 10px;
+      }
+
+      .rightInfo {
+        flex: 1;
+
+        .title {
+          width: 100%;
+          color: #0095FF;
+          line-height: 28px;
+          margin-right: 20px;
+        }
+
+        .status {
+          padding: 1px 6px;
+          border-radius: 4px;
+          background: #FF3A3A;
+          color: #fff;
+        }
+
+        .zjhm {
+          line-height: 27px;
+          color: #7CBFFF;
+          margin-right: 10px;
+          font-size: 16px;
+        }
+
+        .textflex {
+          display: flex;
+          justify-content: space-between;
+        }
+
+        .text {
+          font-size: 12px;
+          color: #6585af;
+
+          .info {
+            color: #fff;
+          }
+        }
+
+        .newinfo {
+          color: yellow;
+        }
+      }
+    }
+
+    .address {
+      justify-content: space-between;
+      margin-top: 4px;
+      padding-top: 6px;
+      box-sizing: border-box;
+      border-top: 1px solid #3b3737;
+      color: #fff;
+
+      .addImg {
+        margin-right: 4px;
+        vertical-align: text-top;
+      }
+    }
+
+    .phtos {
+      height: 110px;
+      padding-top: 10px;
+      box-sizing: border-box;
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      justify-content: center;
+      width: 100%;
+      border-top: 1px dashed #3d3d3d;
+      margin-top: 6px;
+      box-sizing: border-box;
+
+      ::v-deep .el-carousel {
+        width: 100%;
+        height: 100%;
+
+        .el-carousel__container {
+          height: 72%;
+        }
+
+        .el-carousel__item {
+          height: 100%;
+          display: flex;
+          justify-content: space-between;
+        }
+      }
+
+      img {
+        width: 60px;
+        height: 70px;
+      }
+    }
+  }
+}
+
+.all-dialog .dialogBox>.btnBox {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.timeBox {
+  width: 100%;
+  display: flex;
+  align-items: center;
+
+  .time1 {
+    margin: 0 10px;
+    text-align: center;
+    color: #fff;
+  }
+}
+
+::v-deep .el-collapse {
+  width: 100%;
+  --el-collapse-header-height: auto;
+  --el-collapse-header-bg-color: transparent;
+  --el-collapse-border-color: transparent;
+}
+
+::v-deep .el-collapse-item__header {
+  color: #00bfff;
+}
+
+::v-deep .el-collapse-item__wrap {
+  background-color: transparent;
+}
+
+::v-deep .el-collapse-item__content {
+  color: #fff;
+  padding-bottom: 0;
+}
+
+.null {
+  text-align: center;
+}
+</style>

src/views/login/oatuh_login.vue

@@ -0,0 +1,43 @@
+<template></template>
+
+<script setup>
+import { ref, onMounted } from "vue";
+import { useStore } from "vuex";
+import { useRouter } from "vue-router";
+import {
+  setItem
+} from "@/utils/storage";
+const loginDialog = ref(false);
+const deptList = ref([]);
+const store = useStore();
+function redirectAuth() {
+
+  let token = location.hash.slice(20) || null;
+  if (token != null) {
+    debugger
+    token = token.replace(/\ +/g, "");
+    setItem("SSOTOKEN", token)
+    handleLogin({ token: token});
+  } else {
+    window.location.href = `http://155.240.22.188:9020`;
+  }
+}
+
+const handleLogin = (e) => {
+  store.dispatch("user/oatuhLogin", e).then((res) => {
+    // 登录后操作
+    if (res.deptList.length === 1) {
+      window.location.hash = "/";
+    } else {
+      deptList.value = [...res.deptList];
+      loginDialog.value = true;
+      authorization.value = res.jwtToken;
+    }
+  });
+};
+onMounted(() => {
+  redirectAuth();
+});
+</script>
+
+<style></style>

vue.config.js

@@ -7,7 +7,7 @@ const serverHost = "http://192.168.1.32:8066";
 // const serverHost = "http://127.0.0.1:8006"
 module.exports = {
   publicPath: "./",
-  outputDir: "ylth",
+  outputDir: "gj",
   assetsDir: "static",
   lintOnSave: false, //process.env.NODE_ENV === 'development',
   productionSourceMap: false,