1

src/config/index.json

@@ -2,9 +2,10 @@
     "version": "20230607160059",
     "target1": "http://127.0.0.1:8090",
     "target2": "http://39.108.216.210:8090",
-    "target3": "http://192.168.0.125:8090",
-    "target": "http://183.247.216.148:28090",
-    "socket": "wss://measure.hczcxx.cn/websocket",
+    "target": "http://192.168.0.125:8090",
+    "target4": "http://183.247.216.148:28090",
+    "socket1": "wss://measure.hczcxx.cn/websocket",
+    "socket": "ws://192.168.0.125:9527/websocket",
     "localModel": false,
     "smsPhone": "",
     "vite": {

src/layout/index.vue

@@ -47,12 +47,13 @@
 <script setup>
 import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-import { isNullES, useClick } from 'js-fast-way'
+import { getObjValue, isNullES, useClick } from 'js-fast-way'
 import { HcSocket } from '~src/plugins/HcSocket'
 import { useAppStore } from '~src/store'
 import { initButtons } from '~sto/app'
 import { useProject } from '~sto/useProject'
 import website from '~src/config'
+import { setNotification } from '~uti/tools'
 
 //初始组合式
 const router = useRouter()
@@ -167,8 +168,11 @@ const cascaderSend = async ({ projectId, contractId }) => {
     //链接webSocket
     if (!isNullES(socket)) socket.close()
     if (!website.localModel) {
-        socket = new HcSocket({ projectId, contractId, userId: userId.value }, ({ data }) => {
-            console.log(data)
+        socket = new HcSocket({ projectId, contractId, userId: userId.value }, (res) => {
+            const { type, data } = getObjValue(res?.data)
+            console.log(type, data)
+            //msgUpdateMsg 更新公告
+            //msgSystemMsg 普通公告
         })
     }
     //本地模式
@@ -177,6 +181,19 @@ const cascaderSend = async ({ projectId, contractId }) => {
             reloadRouter.value = true
         }, 500)
     }
+    //通知公告
+    setNotification({
+        type: 'update',
+        data: '测试一下，这是系统更新公告, 测试一下，这是系统更新公告, 测试一下，这是系统更新公告',
+        time: 'xxx年xx月xx日 xx:xx:xx',
+    })
+    //普通公告
+    setTimeout(() => {
+        setNotification({
+            type: 'system',
+            data: '测试一下，这是系统发布的普通公告,测试一下，这是系统发布的普通公告,测试一下，这是系统发布的普通公告',
+        })
+    }, 500)
 }
 
 // 项目切换

src/layout/modules/Notification.vue

@@ -0,0 +1,33 @@
+<template>
+    <div class="hc-system-notification hc-flex">
+        <div class="icon-box hc-flex-center mr-14px h-50px w-50px">
+            <div class="icon relative text-center text-40px">
+                <hc-icon name="megaphone" />
+            </div>
+        </div>
+        <div class="content-box relative h-full flex-1">
+            <div class="content relative">{{ data }}</div>
+            <div v-if="time" class="time relative mt-12px">
+                <span v-if="type === 'update'">更新时间：</span>
+                <span v-if="type === 'system'">发布时间：</span>
+                <span>{{ time }}</span>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+defineProps({
+    type: String,
+    data: [String, Number],
+    time: [String, Number],
+})
+</script>
+
+<style lang="scss" scoped>
+.hc-system-notification {
+    .content-box .time {
+        opacity: .8;
+    }
+}
+</style>

src/styles/app/element.scss

@@ -43,3 +43,28 @@
 .el-table .cell{
     white-space: pre-wrap;
 }
+
+//系统公告
+.el-notification.hc-system-notification-msg {
+    --el-notification-padding: 8px 14px;
+    .el-notification__group {
+        flex: 1;
+        margin: 0;
+        .el-notification__content {
+            color: inherit;
+            line-height: unset;
+        }
+    }
+    //更新公告
+    &.update {
+        --el-notification-border-color: #fde2e2;
+        background-color: #fef0f0;
+        color: #f56c6c;
+    }
+    //普通公告
+    &.system {
+        --el-notification-border-color: #faecd8;
+        background-color: #fdf6ec;
+        color: #e6a23c;
+    }
+}

src/utils/tools.js

@@ -1,5 +1,20 @@
+import { h } from 'vue'
+import { ElNotification } from 'element-plus'
 import { arrIndex, getArrValue } from 'js-fast-way'
 import { getDictionary, getDictionaryBiz } from '~api/other'
+import HcNotification from '~src/layout/modules/Notification.vue'
+
+//通知公告
+export const setNotification = (param = {}) => {
+    ElNotification({
+        title: '',
+        duration: 0,
+        showClose: false,
+        dangerouslyUseHTMLString: true,
+        customClass: `hc-system-notification-msg ${param.type}`,
+        message: h(HcNotification, { ...param }),
+    })
+}
 
 //获取字典数据
 export const getDictionaryData = async (code, biz = false) => {