微调

2025-10-22 09:05:35 +08:00
parent c7e6e93ace
commit 72074c65ba
6 changed files with 126 additions and 85 deletions
--- a/components.d.ts
+++ b/components.d.ts
@@ -22,7 +22,6 @@ declare module '@vue/runtime-core' {
    ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
    ElDialog: typeof import('element-plus/es')['ElDialog']
    ElDivider: typeof import('element-plus/es')['ElDivider']
-    ElDrawer: typeof import('element-plus/es')['ElDrawer']
    ElDropdown: typeof import('element-plus/es')['ElDropdown']
    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>电压暂降监测平台</title>
+    <title>无锡电能质量演示平台</title>
  </head>
  <body>
    <div id="app"></div>
--- a/src/views/SagTraceResult_WX/components/manage/index.vue
+++ b/src/views/SagTraceResult_WX/components/manage/index.vue
@@ -10,7 +10,8 @@
          maxlength="32"
          placeholder="请输入项目名称"
          show-word-limit
-          style="width: 300px; margin-left: 10px"
+          clearable
+          style="width: 240px; margin-left: 10px"
          size="small"
        />
      </div>
@@ -35,6 +36,8 @@
        margin-top: 10px;
        height: 660px;
      "
+      v-loading="loading"
+      :element-loading-background="'rgba(122, 122, 122, 0.8)'"
    >
      <el-row :gutter="12">
        <el-col
@@ -226,6 +229,7 @@ const projectData = ref([]);
 const dialogVisible = ref(false);

 const innerVisible = ref(false);
+const loading = ref(false);

 const projectName = ref("");

@@ -299,6 +303,7 @@ const sendToIframe = (type: string, data: any) => {
 };

 const fetachData = async () => {
+  loading.value = true;
  const res = await projectList({
    pageNum: params.pageNum,
    pageSize: params.pageSize,
@@ -307,7 +312,7 @@ const fetachData = async () => {
  // projectData.splice(0, projectData.length, ...res.records);
  projectData.value = res.data.records;
  params.total = res.data.total;
-
+  loading.value = false;
  if (res.data.records.length > 0) {
    firstForm.value.id = res.data.records[0].id;
    firstForm.value.name = res.data.records[0].name;
@@ -421,14 +426,14 @@ const onTableCurrentChange = (page: number) => {

 // 设计
 const Aclick = (e: any) => {
-  // window.open("http://192.168.1.179:4001" + `/zutai/?id=${e.id}&&name=decodeURI(${e.name})&&flag=false`)
+  // window.open( window.location.origin + `/zutai/?id=${e.id}&&name=decodeURI(${e.name})&&flag=false`)
  // window.open(
  //   window.location.origin  +
  //     `/zutai/?id=${e.id}&&name=${e.name}&&preview=false&&graphicDisplay=true`
  // );
  // 无锡项目进去不展示数据绑定图元
  window.open(
-    "http://192.168.1.179:4001" +
+    window.location.origin +
      `/zutai/?id=${e.id}&&name=${e.name}&&preview=false&&graphicDisplay=wx`
  );
 };
@@ -470,7 +475,7 @@ const imgData = (e: any) => {
  //     `/zutai/?id=${e.id}&&name=${e.name}&&preview=true#/preview`
  // );
  window.open(
-    "http://192.168.1.179:4001" +
+    window.location.origin +
      `/zutai/?id=${e.id}&&name=${e.name}&&preview=true&&graphicDisplay=wx#/preview`
  );
 };
--- a/src/views/SagTraceResult_WX/components/plan.vue
+++ b/src/views/SagTraceResult_WX/components/plan.vue
@@ -36,7 +36,7 @@ watch(
    if (newVal && newVal.id && newVal.name) {
      //   window.location.origin
      iframeSrc.value =
-        "http://192.168.1.179:4001" +
+        window.location.origin +
        `/zutai/?id=${newVal.id}&&name=${encodeURIComponent(
          newVal.name
        )}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;
@@ -55,7 +55,7 @@ onMounted(() => {
    if (res.code == "A0000") {
      //   window.location.origin
      iframeSrc.value =
-        "http://192.168.1.179:4001" +
+        window.location.origin +
        `/zutai/?id=${res.data.id}&&name=${encodeURIComponent(
          res.data.name
        )}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;
--- a/src/views/VoltageSag_BJ/components/bottomText.vue
+++ b/src/views/VoltageSag_BJ/components/bottomText.vue
@@ -5,48 +5,38 @@
      <div class="scroll-content" ref="animatedRef"></div>
    </div>
    <!-- 紧急告警 -->
-    <el-drawer
+    <!-- <el-drawer
      class="urgent"
      modal-class="drawer"
      v-model="drawer"
+      :draggable="true"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      title="紧急告警"
      :before-close="handleClose"
-    >
+    > -->
+    <el-dialog v-model="drawer" draggable :modal="false" :modal-penetrable="true" :close-on-click-modal="false"
+      :close-on-press-escape="false" title="紧急告警" :before-close="handleClose">
+
+      <template #header>
+        <div style="display: flex; ">
+          <span>紧急告警</span>
+          <Promotion style="width: 15px; margin-left: 10px;  " />
+        </div>
+      </template>
+
+
      <div :class="urgentList.length > 0 ? 'bg-red' : ''">
        <div class="drawer-but">
-          <el-button
-            size="small"
-            type="primary"
-            @click="totalProcessing(1)"
-            :icon="Check"
-            >确认</el-button
-          >
-          <el-button
-            size="small"
-            type="primary"
-            @click="totalProcessing(2)"
-            :icon="Check"
-            >一键确认</el-button
-          >
+          <el-button size="small" type="primary" @click="totalProcessing(1)" :icon="Check">确认</el-button>
+          <el-button size="small" type="primary" @click="totalProcessing(2)" :icon="Check">一键确认</el-button>
        </div>
        <div class="messageBox">
-          <div
-            class="mesModule"
-            v-for="(item, index) in urgentList"
-            :key="index"
-          >
+          <div class="mesModule" v-for="(item, index) in urgentList" :key="index">
            <el-checkbox v-model="item.checked" value="" size="large" />
-            <span
-              class="iconfont icon-gaojing"
-              :class="item.checked ? 'blue' : 'animate-flash-red'"
-            ></span>
-            <div
-              :style="{ color: item.checked ? '#0a73ff' : '#ff0000' }"
-              style="font-weight: 650"
-              @click="handleCurrentChange(item)"
-            >
+            <span class="iconfont icon-gaojing" :class="item.checked ? 'blue' : 'animate-flash-red'"></span>
+            <div :style="{ color: item.checked ? '#0a73ff' : '#ff0000' }" style="font-weight: 650"
+              @click="handleCurrentChange(item)">
              <div>{{ item.timeid }}.{{ item.ms }}</div>
              <p class="mt5">
                {{ item.bdname }} {{ item.pointname }}发生{{
@@ -56,31 +46,19 @@
                }}%,持续时间：{{ item.persisttime }}s;
              </p>
              <p class="mt5" style="display: flex; font-size: 14px">
-                <span
-                  style="width: 75px"
-                  :style="{ color: item.checked ? '#0a73ff' : '#ffc107' }"
-                >
-                  影响范围： </span
-                ><span
-                  style="flex: 1"
-                  :style="{ color: item.checked ? '#0a73ff' : '#ffc107' }"
-                  >{{ item.objName }}</span
-                >
+                <span style="width: 75px" :style="{ color: item.checked ? '#0a73ff' : '#ffc107' }">
+                  影响范围： </span><span style="flex: 1" :style="{ color: item.checked ? '#0a73ff' : '#ffc107' }">{{
+                    item.objName
+                  }}</span>
              </p>
            </div>
          </div>
        </div>
      </div>
-    </el-drawer>
+    </el-dialog>
+    <!-- </el-drawer> -->

-    <audio
-      ref="audioRef"
-      id="audioId"
-      :src="mp3Src"
-      loop
-      controls
-      hidden="true"
-    ></audio>
+    <audio ref="audioRef" id="audioId" :src="mp3Src" loop controls hidden="true"></audio>
  </div>
 </template>
 <script setup lang="ts">
@@ -90,7 +68,7 @@ import { speak } from "@/utils/index";
 import { noDealEventList, lookEvent } from "@/api/statistics/index";
 import { ElMessage, ElMessageBox } from "element-plus";
 import { useStore } from "vuex";
-import { color } from "echarts";
+import { Promotion } from "@element-plus/icons-vue";

 const store = useStore();
 const emit = defineEmits(["close", "handleCurrentChange"]);
@@ -107,10 +85,7 @@ const handleSelectionChange = (val: any) => {
 const mp3Src: any = new URL(`@/assets/mp3/9578.mp3`, import.meta.url);
 const audioRef: any = ref(null);
 const updateData = (row: any) => {
-  console.log(
-    `🚀 ~ updateData ~ !row.dept.split(",").includes(store.state.deptId:`,
-    !row.dept.split(",").includes(store.state.deptId)
-  );
+

  if (!row.dept.split(",").includes(store.state.deptId)) return;
  broadcast.value.push(row);
@@ -158,8 +133,7 @@ const speakBrowser = (item: any) => {
    // audioRef.value.pause()	//暂停
  } else if (store.state.voiceType == 1) {
    speak(
-      `　　　　　　${item.timeid}${item.bdname}${
-        item.pointname
+      `　　　　　　${item.timeid}${item.bdname}${item.pointname
      }发生${filteWavetype(item.wavetype)}事件,事件特征幅值${Math.floor(
        item.eventvalue * 100
      )}%,持续时间：${item.persisttime}秒`,
@@ -272,7 +246,6 @@ const handleClose = (done: (cancel?: boolean) => void) => {
  }
 };
 onMounted(() => {
-
  setTimeout(() => {
    init();
  }, 1000);
@@ -288,6 +261,7 @@ defineExpose({
 </script>
 <style lang="scss" scoped>
@use "@/assets/scss/index.scss";
+
 .react-right {
  width: 500px !important;
 }
@@ -304,53 +278,68 @@ defineExpose({
  color: #fff;
  margin-bottom: 10px;
 }
-:deep(.el-drawer__header) {
+
+:deep(.el-dialog__header) {
  margin-bottom: 0px;
  border-bottom: 1px solid #fff;
  padding: 10px;
  color: #fff;
+  background: #9f1700;
 }

-:deep(.el-drawer__body) {
+:deep(.el-dialog__body) {
  padding: 0;
 }
+
 :deep(.urgent) {
  width: 100% !important;
  height: 910px;
 }
-:deep(.drawer) {
+
+:deep(.el-dialog) {
  // border: 1px solid #ff0000;

  width: 25%;
  height: 920px;
-  top: 9%;
+  top: 0%;
  overflow: hidden;
-  left: auto !important;
-  .el-drawer {
+  left: 37% !important;
+
+  .el-dialog {
    border: 1px solid #ff0000;
    height: 910px !important;
  }
+
  .messageBox {
    margin-top: 10px;
    font-size: 12px;
-    height: 822px;
+    height: 832px;
    padding: 0 10px;
+
    div {
      font-size: 16px;
      cursor: pointer;
    }
+
    &::-webkit-scrollbar {
      width: 6px;
      height: 8px;
    }
+
    &::-webkit-scrollbar-thumb {
-      background: #888; /* 滑块背景颜色 */
-      border-radius: 5px; /* 滑块圆角 */
+      background: #888;
+      /* 滑块背景颜色 */
+      border-radius: 5px;
+      /* 滑块圆角 */
    }
+
    &::-webkit-scrollbar-thumb:hover {
-      background: #555; /* 悬停时滑块背景颜色 */
+      background: #555;
+      /* 悬停时滑块背景颜色 */
    }
+
    overflow-y: auto;
+
    .mesModule {
      margin-bottom: 10px;
      background-color: #00000085;
@@ -358,6 +347,7 @@ defineExpose({
      padding: 10px;
      display: flex;
      align-items: center;
+
      p {
        margin-left: 15px;
      }
@@ -370,6 +360,7 @@ defineExpose({
  color: #ff0000;
  margin-right: 5px;
 }
+
 .blue {
  color: #0a73ff;
 }
--- a/src/views/VoltageSag_BJ/components/reportForms.vue
+++ b/src/views/VoltageSag_BJ/components/reportForms.vue
@@ -9,8 +9,15 @@
              style="width: 250px; margin-right: 10px" unlink-panels :clearable="false" range-separator="至"
              start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD HH:mm:ss" />
          </el-form-item>
+
          <el-form-item label="部门集合">
-            <el-select v-model="form.deptList" placeholder="请选择部门集合" style="width: 250px" size="small" multiple>
+            <el-select v-model="form.deptList" placeholder="请选择部门集合" style="width: 250px" size="small" multiple
+              collapse-tags collapse-tags-tooltip>
+              <template #header>
+                <el-checkbox v-model="checkAll" :indeterminate="indeterminate" @change="handleCheckAll">
+                  全部
+                </el-checkbox>
+              </template>
              <el-option v-for="item in deptLists" :key="item.deptsIndex" :label="item.deptsname"
                :value="item.deptsIndex" />
            </el-select>
@@ -30,12 +37,12 @@
  </el-dialog>
 </template>
 <script lang="ts" setup>
-import { ref, reactive, inject, onMounted } from "vue";
+import { ref, watch, inject, onMounted } from "vue";
 import { ElMessage } from "element-plus";
 import { Check, Close } from "@element-plus/icons-vue";
 import { getDept, exportForms } from "@/api/statistics/index";
+import type { CheckboxValueType } from 'element-plus'
 import { useStore } from "vuex";
-import { log } from "console";
 const store = useStore();
 const machineVisible = ref(false);
 const title = ref("报表导出");
@@ -43,7 +50,8 @@ const timeValue = ref([]);
 const deptLists = ref();
 //form表单校验规则
 const emit = defineEmits(["flushed"]);
-
+const checkAll = ref(false)
+const indeterminate = ref(false)
 const form = ref({
  searchBeginTime: "",
  searchEndTime: "",
@@ -67,7 +75,41 @@ const init = () => {
    deptLists.value = res.data;
  });
 };
+// watch(form.value.deptList, (val) => {
+//   if (val.length == 0) {
+//     checkAll.value = false
+//     indeterminate.value = false
+//   } else if (val.length == deptLists.value.length) {
+//     checkAll.value = true
+//     indeterminate.value = false
+//   } else {

+//     indeterminate.value = true
+//   }
+// })
+watch(
+  () => form.value.deptList,  // 使用函数返回值的形式
+  (val) => {
+    if (val.length == 0) {
+      checkAll.value = false
+      indeterminate.value = false
+    } else if (val.length == deptLists.value.length) {
+      checkAll.value = true
+      indeterminate.value = false
+    } else {
+      indeterminate.value = true
+    }
+  },
+  { deep: true }  // 添加深度监听选项
+)
+const handleCheckAll = (val: CheckboxValueType) => {
+  indeterminate.value = false
+  if (val) {
+    form.value.deptList = deptLists.value.map((_) => _.deptsIndex)
+  } else {
+    form.value.deptList = []
+  }
+}
 const save = () => {
  if (!timeValue.value[0]) {
    ElMessage.warning("请选择时间！");
@@ -160,4 +202,8 @@ defineExpose({ open });
 :deep(.el-form-item__label, ) {
  color: #fff;
 }
+
+:deep(.el-checkbox__label) {
+  color: var(--el-text-color-regular);
+}
 </style>