|
@@ -0,0 +1,589 @@
|
|
|
+<template>
|
|
|
+ <el-popover placement="bottom" width="350" trigger="click" ref="popover">
|
|
|
+ <el-tabs v-model="activeName" stretch>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="spellItLabel('全部', allList.length)"
|
|
|
+ name="first"
|
|
|
+ ></el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="spellItLabel('邮件', mailList.length)"
|
|
|
+ name="second"
|
|
|
+ ></el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="spellItLabel('待办', backlogList.length)"
|
|
|
+ name="third"
|
|
|
+ ></el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="spellItLabel('通知', noticeList.length)"
|
|
|
+ name="fourth"
|
|
|
+ ></el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="spellItLabel('历史消息', historyNoticeList.length)"
|
|
|
+ name="five"
|
|
|
+ ></el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ <el-scrollbar style="height: 300px; position: relative">
|
|
|
+ <div v-if="activeName === 'first'">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in allList"
|
|
|
+ :key="index"
|
|
|
+ class="notice"
|
|
|
+ @click="clickNotice(item)"
|
|
|
+ >
|
|
|
+ <div class="noticeImg" v-if="item.msgType === 1">
|
|
|
+ <img src="/img/mail.png" alt="" style="width: 38px; height: 38px" />
|
|
|
+ </div>
|
|
|
+ <div class="noticeImg" v-else-if="item.msgType === 2">
|
|
|
+ <img
|
|
|
+ src="/img/backlog.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 38px; height: 38px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="noticeImg" v-else>
|
|
|
+ <img
|
|
|
+ src="/img/notice.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 38px; height: 38px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="noticeContent">
|
|
|
+ <div class="contentTitle">
|
|
|
+ <span>{{ index + 1 }}、 {{ item.content }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="contentCreateTime">
|
|
|
+ <span>{{ item.createTime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="activeName === 'second'">
|
|
|
+ <div style="width: 100%; text-align: center">
|
|
|
+ <span
|
|
|
+ style="color: #cccccc; cursor: pointer"
|
|
|
+ size="mini"
|
|
|
+ @click="allRead"
|
|
|
+ >点击清空</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in mailList"
|
|
|
+ :key="index"
|
|
|
+ class="notice"
|
|
|
+ @click="clickNotice(item)"
|
|
|
+ >
|
|
|
+ <div class="noticeImg">
|
|
|
+ <img src="/img/mail.png" alt="" style="width: 38px; height: 38px" />
|
|
|
+ </div>
|
|
|
+ <div class="noticeContent">
|
|
|
+ <div class="contentTitle">
|
|
|
+ <span>{{ index + 1 }}、 {{ item.content }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="contentCreateTime">
|
|
|
+ <span>{{ item.createTime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="activeName === 'third'">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in backlogList"
|
|
|
+ :key="index"
|
|
|
+ class="notice"
|
|
|
+ @click="clickNotice(item)"
|
|
|
+ >
|
|
|
+ <div class="noticeImg">
|
|
|
+ <img
|
|
|
+ src="/img/backlog.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 38px; height: 38px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="noticeContent">
|
|
|
+ <div class="contentTitle">
|
|
|
+ <span>{{ index + 1 }}、 {{ item.content }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="contentCreateTime">
|
|
|
+ <span>{{ item.createTime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="activeName === 'fourth'">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in noticeList"
|
|
|
+ :key="index"
|
|
|
+ class="notice"
|
|
|
+ @click="clickNotice(item)"
|
|
|
+ >
|
|
|
+ <div class="noticeImg">
|
|
|
+ <img
|
|
|
+ src="/img/notice.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 38px; height: 38px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="noticeContent">
|
|
|
+ <div class="contentTitle">
|
|
|
+ <span>{{ index + 1 }}、 {{ item.content }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="contentCreateTime">
|
|
|
+ <span>{{ item.createTime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-scrollbar v-if="activeName === 'five'" style="height: 275px">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in historyNoticeList"
|
|
|
+ :key="index"
|
|
|
+ class="notice"
|
|
|
+ @click="clickNotice(item)"
|
|
|
+ >
|
|
|
+ <div class="noticeImg">
|
|
|
+ <img
|
|
|
+ src="/img/notice.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 38px; height: 38px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="noticeContent">
|
|
|
+ <div class="contentTitle">
|
|
|
+ <span>{{ index + 1 }}、 {{ item.content }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="contentCreateTime">
|
|
|
+ <span>{{ item.createTime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-scrollbar>
|
|
|
+ <div
|
|
|
+ style="width: 100%; text-align: center; position: absolute; bottom: 5px"
|
|
|
+ v-if="activeName === 'five'"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ style="color: #66b1ff; cursor: pointer"
|
|
|
+ size="mini"
|
|
|
+ @click="goToHistory"
|
|
|
+ >历史消息</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </el-scrollbar>
|
|
|
+ <div slot="reference">
|
|
|
+ <el-badge is-dot v-if="judgeStatus()">
|
|
|
+ <i class="el-icon-bell"></i>
|
|
|
+ </el-badge>
|
|
|
+ <el-badge v-else>
|
|
|
+ <i class="el-icon-bell"></i>
|
|
|
+ </el-badge>
|
|
|
+ </div>
|
|
|
+ </el-popover>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// import { mapGetters } from 'vuex'
|
|
|
+// import { messageList, deleteByIds, readAllMail, readNotice } from '@/api/socket'
|
|
|
+// import Utils from '@/util/transit'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "top-notice",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ activeName: "first",
|
|
|
+ historyNoticeList: [],
|
|
|
+ allList: [],
|
|
|
+ mailList: [],
|
|
|
+ backlogList: [],
|
|
|
+ noticeList: [],
|
|
|
+ ipUrl: "wss://www.findoma.com/handle-api",
|
|
|
+ ws: null, //建立的连接
|
|
|
+ lockReconnect: false, //是否真正建立连接
|
|
|
+ timeout: 28 * 1000, //30秒一次心跳
|
|
|
+ timeoutObj: null, //心跳心跳倒计时
|
|
|
+ serverTimeoutObj: null, //心跳倒计时
|
|
|
+ timeoutnum: null, //断开 重连倒计时
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getMessageList();
|
|
|
+ this.initWebpack();
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ Utils.$on("webSocketClose", () => {
|
|
|
+ this.ws.close();
|
|
|
+ //清除时间
|
|
|
+ clearTimeout(this.timeoutObj);
|
|
|
+ clearTimeout(this.serverTimeoutObj);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ computed: mapGetters(["dictData", "userInfo"]),
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ allRead() {
|
|
|
+ let readList = this.mailList.map((item) => item.id);
|
|
|
+ let readStr = readList.join();
|
|
|
+ readAllMail({
|
|
|
+ mailIds: readStr,
|
|
|
+ isRead: "1",
|
|
|
+ nowStatus: "4",
|
|
|
+ mailbox: "",
|
|
|
+ }).then(() => {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // this.$refs.popover.doClose()
|
|
|
+ // deleteByIds(readList).then(() => {
|
|
|
+ // this.getMessageList(true)
|
|
|
+ // })
|
|
|
+ // }, 1000)
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.popover.doClose();
|
|
|
+ readNotice(readList).then(() => {
|
|
|
+ this.getMessageList(true);
|
|
|
+ });
|
|
|
+ }, 1000);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ spellItLabel(text, index) {
|
|
|
+ if (index > 0) {
|
|
|
+ return text + " (" + index + ")";
|
|
|
+ } else {
|
|
|
+ return text;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ judgeStatus() {
|
|
|
+ if (
|
|
|
+ (this.mailList && this.mailList.length > 0) ||
|
|
|
+ (this.backlogList && this.backlogList.length > 0) ||
|
|
|
+ (this.noticeList && this.noticeList.length > 0)
|
|
|
+ ) {
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ clickNotice(item) {
|
|
|
+ if ([1, 11].includes(item.msgType)) {
|
|
|
+ if (item.busiId) {
|
|
|
+ this.$root.busiId = item.busiId;
|
|
|
+ }
|
|
|
+ if (this.$route.path === "/tenant/bussiness/mailbox/index") {
|
|
|
+ let $chars = "ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678";
|
|
|
+ let maxPos = $chars.length;
|
|
|
+ let random = "";
|
|
|
+ for (let i = 0; i < 32; i++) {
|
|
|
+ random += $chars.charAt(Math.floor(Math.random() * maxPos));
|
|
|
+ }
|
|
|
+ this.$root.mailRefresh = random;
|
|
|
+ } else {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/bussiness/mailbox/index",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else if ([3].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/trading/arrivalAmountClaim/index",
|
|
|
+ });
|
|
|
+ } else if ([4].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/procurement/receipt/index",
|
|
|
+ });
|
|
|
+ } else if ([5].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/trading/finishedProductManagement/index",
|
|
|
+ });
|
|
|
+ } else if ([6].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/trading/quotationManagement/index",
|
|
|
+ });
|
|
|
+ } else if ([7, 8, 9, 10].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/trading/salesContractManagement/index",
|
|
|
+ });
|
|
|
+ } else if ([13].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/customer/customerManagement/index",
|
|
|
+ });
|
|
|
+ } else if ([14].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/wms/purchase/index",
|
|
|
+ });
|
|
|
+ } else if ([17].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/oa/EmployeesDaily",
|
|
|
+ });
|
|
|
+ } else if ([18].includes(item.msgType)) {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/cashier/payment/index",
|
|
|
+ });
|
|
|
+ } else if ([19].includes(item.msgType)) {
|
|
|
+ if (item.busiId) {
|
|
|
+ this.$root.sendFailure = item.busiId;
|
|
|
+ } else {
|
|
|
+ this.$root.sendFailure = 111;
|
|
|
+ }
|
|
|
+ if (this.$route.path !== "/tenant/bussiness/mailbox/index") {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/bussiness/mailbox/index",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.userInfo.tenant_id === "GOLDSUN") {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/process/backlog/index",
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/activiti/task/index",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.popover.doClose();
|
|
|
+ // deleteByIds([item.id]).then(() => {
|
|
|
+ // this.getMessageList(true)
|
|
|
+ // })
|
|
|
+ readNotice([item.id]).then(() => {
|
|
|
+ this.getMessageList(true);
|
|
|
+ });
|
|
|
+ }, 1000);
|
|
|
+ },
|
|
|
+ goToHistory() {
|
|
|
+ this.$router.replace({
|
|
|
+ path: "/tenant/oa/historyMessage/index",
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getMessageList(status) {
|
|
|
+ messageList().then((res) => {
|
|
|
+ // console.log(res, 'sss')
|
|
|
+ //历史消息取的是已读的
|
|
|
+ this.historyNoticeList = res.data.data.list.filter(
|
|
|
+ (item) => item.isRead === 1
|
|
|
+ );
|
|
|
+
|
|
|
+ //全部的消息 取的是未读
|
|
|
+ this.allList = res.data.data.list.filter((item) => item.isRead !== 1);
|
|
|
+ this.mailList = this.allList.filter((item) => item.msgType === 1);
|
|
|
+ this.backlogList = this.allList.filter((item) => item.msgType === 2);
|
|
|
+ this.noticeList = this.allList.filter(
|
|
|
+ (item) => item.msgType !== 1 && item.msgType !== 2
|
|
|
+ );
|
|
|
+ if (this.allList && this.allList.length > 0 && !status) {
|
|
|
+ this.$refs.popover.doShow();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getMessage(data) {
|
|
|
+ if (
|
|
|
+ data.details &&
|
|
|
+ data.details.rows &&
|
|
|
+ data.details.rows.length > 0 &&
|
|
|
+ data.details.rows.indexOf("测试发送消息") === -1
|
|
|
+ ) {
|
|
|
+ for (let i = 0; i < data.details.rows.length; i++) {
|
|
|
+ if (window.Notification) {
|
|
|
+ var ua = navigator.userAgent.toLowerCase();
|
|
|
+ if (ua.indexOf("safari") !== -1) {
|
|
|
+ if (ua.indexOf("chrome") !== -1) {
|
|
|
+ Notification.requestPermission().then(function (permission) {
|
|
|
+ if (permission == "granted") {
|
|
|
+ var notification = new Notification("WINFASTER-消息通知", {
|
|
|
+ body: JSON.parse(data.details.rows[i]).notice.content,
|
|
|
+ icon: "some/icon/url",
|
|
|
+ });
|
|
|
+ notification.onclick = function () {
|
|
|
+ notification.close();
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ Notification.requestPermission();
|
|
|
+ console.log("没有权限,用户拒绝:Notification");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ // Safari
|
|
|
+ Notification.requestPermission(function (permission) {
|
|
|
+ if (permission == "granted") {
|
|
|
+ var notification = new Notification("WINFASTER-消息通知", {
|
|
|
+ body: JSON.parse(data.details.rows[i]).notice.content,
|
|
|
+ icon: "some/icon/url",
|
|
|
+ });
|
|
|
+ notification.onclick = function () {
|
|
|
+ notification.close();
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ Notification.requestPermission();
|
|
|
+ console.log("没有权限,用户拒绝:Notification");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.log("不支持Notification");
|
|
|
+ }
|
|
|
+ if (
|
|
|
+ JSON.parse(data.details.rows[i]).notice.msgType === 1 &&
|
|
|
+ this.$route.path === "/tenant/bussiness/mailbox/index"
|
|
|
+ ) {
|
|
|
+ Utils.$emit("MoveOrMark", "allUnread");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.getMessageList();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // connectWebSocket() {
|
|
|
+ // // 传入登入账户
|
|
|
+ // var ws = new WebSocket(
|
|
|
+ // process.env.VUE_APP_MESSAGE_URL + '/saas-socket/saas/socket/websocket/notice?userId=' + this.$store.state.user.userInfo.user_id
|
|
|
+ // )
|
|
|
+ // // 申请一个WebSocket对象,参数是服务端地址,同http协议使用http://开头一样,WebSocket协议的url使用ws://开头,另外安全的WebSocket协议使用wss://开头
|
|
|
+ // ws.onopen = function () {
|
|
|
+ // // 当WebSocket创建成功时,触发onopen事件
|
|
|
+ // console.log('创建连接成功')
|
|
|
+ // // 将消息发送到服务端
|
|
|
+ // ws.send('hello')
|
|
|
+ // }
|
|
|
+ // ws.onmessage = function (e) {
|
|
|
+ // // 当客户端收到服务端发来的消息时,触发onmessage事件,参数e.data包含server传递过来的数据
|
|
|
+ // var obj = JSON.parse(e.data)
|
|
|
+ // func1(obj)
|
|
|
+ // }
|
|
|
+ // let func2 = function func3(val) {
|
|
|
+ // // 在此处即可同时使用websocket的数据和data数据,method函数
|
|
|
+ // this.getMessage(val.data)
|
|
|
+ // }
|
|
|
+ // let func1 = func2.bind(this)
|
|
|
+ // ws.onclose = function () {
|
|
|
+ // // 当客户端收到服务端发送的关闭连接请求时,触发onclose事件
|
|
|
+ // console.log('close')
|
|
|
+ // }
|
|
|
+ // ws.onerror = function (error) {
|
|
|
+ // // 如果出现连接、处理、接收、发送数据失败的时候触发onerror事件
|
|
|
+ // console.log(error)
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ initWebpack() {
|
|
|
+ this.ws = new WebSocket(
|
|
|
+ process.env.VUE_APP_MESSAGE_URL +
|
|
|
+ "/saas-socket/saas/socket/websocket/notice?userId=" +
|
|
|
+ this.$store.state.user.userInfo.user_id
|
|
|
+ );
|
|
|
+ this.ws.onopen = this.onopen;
|
|
|
+ this.ws.onmessage = this.onmessage;
|
|
|
+ this.ws.onclose = this.onclose;
|
|
|
+ this.ws.onerror = this.onerror;
|
|
|
+ },
|
|
|
+ reconnect() {
|
|
|
+ //重新连接
|
|
|
+ let that = this;
|
|
|
+ if (that.lockReconnect) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ that.lockReconnect = true;
|
|
|
+ //没连接上会一直重连,设置延迟避免请求过多
|
|
|
+ that.timeoutnum && clearTimeout(that.timeoutnum);
|
|
|
+ that.timeoutnum = setTimeout(() => {
|
|
|
+ //新连接
|
|
|
+ that.initWebpack();
|
|
|
+ that.lockReconnect = false;
|
|
|
+ }, 5000);
|
|
|
+ },
|
|
|
+ reset() {
|
|
|
+ //重置心跳
|
|
|
+ let that = this;
|
|
|
+ //清除时间
|
|
|
+ clearTimeout(that.timeoutObj);
|
|
|
+ clearTimeout(that.serverTimeoutObj);
|
|
|
+ //重启心跳
|
|
|
+ that.start();
|
|
|
+ },
|
|
|
+ start() {
|
|
|
+ //开启心跳
|
|
|
+ var self = this;
|
|
|
+ self.timeoutObj && clearTimeout(self.timeoutObj);
|
|
|
+ self.serverTimeoutObj && clearTimeout(self.serverTimeoutObj);
|
|
|
+ self.timeoutObj = setTimeout(() => {
|
|
|
+ //这里发送一个心跳,后端收到后,返回一个心跳消息,
|
|
|
+ if (self.ws.readyState == 1) {
|
|
|
+ //如果连接正常
|
|
|
+ self.ws.send("heartCheck");
|
|
|
+ } else {
|
|
|
+ //否则重连
|
|
|
+ self.reconnect();
|
|
|
+ }
|
|
|
+ self.serverTimeoutObj = setTimeout(function () {
|
|
|
+ //超时关闭
|
|
|
+ console.log("超时");
|
|
|
+ self.ws.close();
|
|
|
+ setTimeout(() => {
|
|
|
+ self.reconnect();
|
|
|
+ }, 1000);
|
|
|
+ }, self.timeout);
|
|
|
+ }, self.timeout);
|
|
|
+ },
|
|
|
+ onopen() {
|
|
|
+ this.ws.send(1);
|
|
|
+ //开启心跳
|
|
|
+ this.start();
|
|
|
+ },
|
|
|
+ onmessage(e) {
|
|
|
+ let func2 = function func3(val) {
|
|
|
+ // 在此处即可同时使用websocket的数据和data数据,method函数
|
|
|
+ this.getMessage(val.data);
|
|
|
+ };
|
|
|
+ let func1 = func2.bind(this);
|
|
|
+ var obj = JSON.parse(e.data);
|
|
|
+ func1(obj);
|
|
|
+ // console.log(e, '心跳机制返回')
|
|
|
+ // 在此处进行返回的信息处理
|
|
|
+ // 收到服务器信息,心跳重置
|
|
|
+ this.reset();
|
|
|
+ },
|
|
|
+ onclose() {
|
|
|
+ // console.log('close')
|
|
|
+ //重连
|
|
|
+ // this.reconnect()
|
|
|
+ },
|
|
|
+ onerror() {
|
|
|
+ // console.log('error')
|
|
|
+ //重连
|
|
|
+ this.reconnect();
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.notice {
|
|
|
+ padding: 12px 24px;
|
|
|
+ border-bottom: 1px solid #e8eaec;
|
|
|
+ font-size: 12px;
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.noticeImg {
|
|
|
+ width: 38px;
|
|
|
+ height: 38px;
|
|
|
+ border-radius: 100%;
|
|
|
+ margin-top: 5px;
|
|
|
+ margin-right: 10px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.noticeContent {
|
|
|
+ -webkit-box-flex: 1;
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+.contentTitle {
|
|
|
+ width: 100%;
|
|
|
+ text-align: left;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #515a6e;
|
|
|
+ margin-bottom: 4px;
|
|
|
+}
|
|
|
+.contentCreateTime {
|
|
|
+ width: 100%;
|
|
|
+ text-align: left;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #808695;
|
|
|
+}
|
|
|
+</style>
|