|
|
@@ -1,12 +1,6 @@
|
|
|
<template>
|
|
|
<div class="commons-notice">
|
|
|
- <el-dialog
|
|
|
- title="系统公告"
|
|
|
- v-model="value"
|
|
|
- width="460px"
|
|
|
- :align-center="true"
|
|
|
- :before-close="handleClose"
|
|
|
- >
|
|
|
+ <el-dialog title="系统公告" v-model="value" width="460px" :align-center="true" :before-close="handleClose">
|
|
|
<div class="title">
|
|
|
<!-- {{ data.length == 0 ? '暂无数据' : data[indexCopy].title}} -->
|
|
|
</div>
|
|
|
@@ -16,70 +10,34 @@
|
|
|
</div>
|
|
|
<template #footer>
|
|
|
<span class="dialog-footer">
|
|
|
- <el-button
|
|
|
- size="small"
|
|
|
- @click="index--"
|
|
|
- :disabled="data.length < 2 || index == 0"
|
|
|
- >上一条</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- size="small"
|
|
|
- @click="index++"
|
|
|
- :disabled="data.length == index + 1"
|
|
|
- >下一条</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- :disabled="data.length == 0 || data[index].isRead"
|
|
|
- @click="confirm"
|
|
|
- >确认已读</el-button
|
|
|
- >
|
|
|
+ <el-button size="small" @click="index--" :disabled="data.length < 2 || index == 0">上一条</el-button>
|
|
|
+ <el-button size="small" @click="index++" :disabled="data.length == index + 1">下一条</el-button>
|
|
|
+ <el-button type="primary" size="small" :disabled="data.length == 0 || data[index].isRead" @click="confirm">确认已读</el-button>
|
|
|
<!-- <span class="more" @click="moreFn">查看更多 ></span> -->
|
|
|
</span>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
- <div
|
|
|
- class="notice-table-warp"
|
|
|
- :class="modelValue ? 'notice-table-warp-open' : ''"
|
|
|
- @click.stop="closeNoticeTableModal"
|
|
|
- >
|
|
|
+ <div class="notice-table-warp" :class="modelValue ? 'notice-table-warp-open' : ''" @click.stop="closeNoticeTableModal">
|
|
|
<div class="notice-table" @click.stop v-loading="loading">
|
|
|
<div class="tabs">
|
|
|
<ul>
|
|
|
- <li
|
|
|
- style="padding-left: 0; border: none"
|
|
|
- @click="
|
|
|
+ <li style="padding-left: 0; border: none" @click="
|
|
|
pushInfoReq.whetherFlow = '';
|
|
|
getPushInfoInit();
|
|
|
- "
|
|
|
- :class="pushInfoReq.whetherFlow === '' ? 'active' : ''"
|
|
|
- >
|
|
|
- 全部<span v-if="pushInfoReq.whetherFlow === ''"
|
|
|
- >（{{ pushInfoReq.total }}）</span
|
|
|
- >
|
|
|
+ " :class="pushInfoReq.whetherFlow === '' ? 'active' : ''">
|
|
|
+ 全部<span v-if="pushInfoReq.whetherFlow === ''">（{{ pushInfoReq.total }}）</span>
|
|
|
</li>
|
|
|
- <li
|
|
|
- @click="
|
|
|
+ <li @click="
|
|
|
pushInfoReq.whetherFlow = 1;
|
|
|
getPushInfoInit();
|
|
|
- "
|
|
|
- :class="pushInfoReq.whetherFlow === 1 ? 'active' : ''"
|
|
|
- >
|
|
|
- 流程<span v-if="pushInfoReq.whetherFlow === 1"
|
|
|
- >（{{ pushInfoReq.total }}）</span
|
|
|
- >
|
|
|
+ " :class="pushInfoReq.whetherFlow === 1 ? 'active' : ''">
|
|
|
+ 流程<span v-if="pushInfoReq.whetherFlow === 1">（{{ pushInfoReq.total }}）</span>
|
|
|
</li>
|
|
|
- <li
|
|
|
- @click="
|
|
|
+ <li @click="
|
|
|
pushInfoReq.whetherFlow = 0;
|
|
|
getPushInfoInit();
|
|
|
- "
|
|
|
- :class="pushInfoReq.whetherFlow === 0 ? 'active' : ''"
|
|
|
- >
|
|
|
- 业务<span v-if="pushInfoReq.whetherFlow === 0"
|
|
|
- >（{{ pushInfoReq.total }}）</span
|
|
|
- >
|
|
|
+ " :class="pushInfoReq.whetherFlow === 0 ? 'active' : ''">
|
|
|
+ 业务<span v-if="pushInfoReq.whetherFlow === 0">（{{ pushInfoReq.total }}）</span>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<div class="more" @click="toDealWith({ businessType: 'hisMsg' })">
|
|
|
@@ -89,12 +47,7 @@
|
|
|
<el-table :data="noticeData" style="width: 100%" @row-click="rowClick">
|
|
|
<el-table-column prop="title" label="标题内容" width="250">
|
|
|
<template #default="scope">
|
|
|
- <el-tooltip
|
|
|
- class="box-item"
|
|
|
- effect="dark"
|
|
|
- :content="scope.row.title"
|
|
|
- placement="top"
|
|
|
- >
|
|
|
+ <el-tooltip class="box-item" effect="dark" :content="scope.row.title" placement="top">
|
|
|
<div class="noticeData-title">{{ scope.row.title }}</div>
|
|
|
</el-tooltip>
|
|
|
</template>
|
|
|
@@ -106,32 +59,17 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="address" label="操作">
|
|
|
<template #default="scope">
|
|
|
- <span
|
|
|
- style="cursor: pointer; color: #0084ff"
|
|
|
- @click.stop="readFn(scope)"
|
|
|
- >已读</span
|
|
|
- >
|
|
|
+ <span style="cursor: pointer; color: #0084ff" @click.stop="readFn(scope)">已读</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div>
|
|
|
- <el-pagination
|
|
|
- style="text-align: center"
|
|
|
- :page-size="5"
|
|
|
- layout="prev, pager, next"
|
|
|
- :current-page="pushInfoReq.pageNum"
|
|
|
- :total="pushInfoReq.total"
|
|
|
- @current-change="handlePageChange"
|
|
|
- />
|
|
|
+ <el-pagination style="text-align: center" :page-size="5" layout="prev, pager, next" :current-page="pushInfoReq.pageNum"
|
|
|
+ :total="pushInfoReq.total" @current-change="handlePageChange" />
|
|
|
</div>
|
|
|
<div class="notice-btn-box" style="margin-top: 20px">
|
|
|
<!-- <el-button plain disabled>点击清空</el-button> -->
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- @click="allReadFn"
|
|
|
- v-if="noticeData.length != 0"
|
|
|
- >全部已读</el-button
|
|
|
- >
|
|
|
+ <el-button type="primary" @click="allReadFn" v-if="noticeData.length != 0">全部已读</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -228,15 +166,72 @@ const confirm = () => {
|
|
|
// }).then(res=>{
|
|
|
// data.value = res.rows
|
|
|
// })
|
|
|
+const createNotification = (body, title = "通知") => {
|
|
|
+ console.log(window.location, "ss");
|
|
|
+ let notification = null;
|
|
|
+ if (!("Notification" in window)) {
|
|
|
+ // 检查浏览器是否支持通知
|
|
|
+ alert("当前浏览器不支持桌面通知");
|
|
|
+ } else if (Notification.permission === "granted") {
|
|
|
+ // 检查是否已授予通知权限；如果是的话，创建一个通知
|
|
|
+ notification = new Notification(title, {
|
|
|
+ data: {
|
|
|
+ originUrl: window.location.origin + "/index",
|
|
|
+ },
|
|
|
+ body: body, //一个表示通知正文的字符串，显示在标题下方。
|
|
|
+ // tag: "aa", 一个表示通知的识别标签的字符串，默认值是一个空字符串。
|
|
|
+ // image: chart, 一个包含要在通知中显示的图像的 URL 的字符串。
|
|
|
+ // icon: chart, 一个包含要在通知中显示的图标的 URL 的字符串。
|
|
|
+ });
|
|
|
+ notification.onclick = function (event) {
|
|
|
+ event.preventDefault();
|
|
|
+ // 打开新的穿口
|
|
|
+ // window.open("http://localhost/ehsd/dataBoard/ehsd_productAnalysis");
|
|
|
+ // 打开页面
|
|
|
+ window.location.href = event.currentTarget.data.originUrl;
|
|
|
+ notification.close();
|
|
|
+ };
|
|
|
+ // …
|
|
|
+ } else if (Notification.permission !== "denied") {
|
|
|
+ // 我们需要征求用户的许可
|
|
|
+ Notification.requestPermission().then((permission) => {
|
|
|
+ // 如果用户接受，我们就创建一个通知
|
|
|
+ if (permission === "granted") {
|
|
|
+ notification = new Notification(title, {
|
|
|
+ data: {
|
|
|
+ originUrl: window.location.origin + "/index",
|
|
|
+ },
|
|
|
+ body: body, //一个表示通知正文的字符串，显示在标题下方。
|
|
|
+ // tag: "aa", 一个表示通知的识别标签的字符串，默认值是一个空字符串。
|
|
|
+ // image: chart, 一个包含要在通知中显示的图像的 URL 的字符串。
|
|
|
+ // icon: chart, 一个包含要在通知中显示的图标的 URL 的字符串。
|
|
|
+ });
|
|
|
+ notification.onclick = function (event) {
|
|
|
+ event.preventDefault();
|
|
|
+ window.location.href = event.currentTarget.data.originUrl;
|
|
|
+ notification.close();
|
|
|
+ };
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+};
|
|
|
|
|
|
const socketInit = () => {
|
|
|
+ let prefix =
|
|
|
+ window.location.protocol.indexOf("https") >= 0 ? "wss://" : "ws://";
|
|
|
+ // window.ws = new WebSocket(
|
|
|
+ // "ws://" +
|
|
|
+ // import.meta.env.VITE_APP_IP +
|
|
|
+ // import.meta.env.VITE_APP_WS_API +
|
|
|
+ // "/webStock/" +
|
|
|
+ // getToken()
|
|
|
+ // );
|
|
|
window.ws = new WebSocket(
|
|
|
- "ws://" +
|
|
|
+ prefix +
|
|
|
import.meta.env.VITE_APP_IP +
|
|
|
import.meta.env.VITE_APP_WS_API +
|
|
|
"/webStock/" +
|
|
|
getToken()
|
|
|
- // 'ws://192.168.1.97:8300/webStock/' + window.localStorage.getItem('token')
|
|
|
);
|
|
|
//申请一个WebSocket对象，参数是服务端地址，同http协议使用http://开头一样，WebSocket协议的url使用ws://开头，另外安全的WebSocket协议使用wss://开头
|
|
|
window.ws.onopen = function () {
|
|
|
@@ -256,7 +251,8 @@ const socketInit = () => {
|
|
|
}
|
|
|
if (res.type == 2) {
|
|
|
emit("changeNum", res.count * 1);
|
|
|
- getPushInfo();
|
|
|
+ proxy.$emit("openNotice");
|
|
|
+ getPushInfo(true);
|
|
|
}
|
|
|
if (res.type == 3) {
|
|
|
ElNotification({
|
|
|
@@ -265,6 +261,8 @@ const socketInit = () => {
|
|
|
position: "bottom-right",
|
|
|
duration: 0,
|
|
|
});
|
|
|
+ // 桌面通知
|
|
|
+ createNotification(res.title);
|
|
|
}
|
|
|
};
|
|
|
window.ws.onclose = function (e) {
|
|
|
@@ -295,11 +293,15 @@ const getPushInfoInit = () => {
|
|
|
pushInfoReq.value.pageNum = 1;
|
|
|
getPushInfo();
|
|
|
};
|
|
|
-const getPushInfo = () => {
|
|
|
+const getPushInfo = (flag) => {
|
|
|
loading.value = true;
|
|
|
proxy.post("/pushInfo/page", pushInfoReq.value).then((res) => {
|
|
|
noticeData.value = res.rows;
|
|
|
pushInfoReq.value.total = res.total;
|
|
|
+ // 桌面通知
|
|
|
+ // if (flag && noticeData.value.length > 0) {
|
|
|
+ // createNotification(noticeData.value[0].title);
|
|
|
+ // }
|
|
|
setTimeout(() => {
|
|
|
loading.value = false;
|
|
|
proxy
|
cz