Merge remote-tracking branch 'origin/main'

# Conflicts:
#	src/views/home.vue

src/api/ruleConfigure.js

@@ -0,0 +1,27 @@
+import request from '@/utils/request'
+
+export function add(data) {
+  return request({
+    url: 'api/ruleConfigure',
+    method: 'post',
+    data
+  })
+}
+
+export function del(ids) {
+  return request({
+    url: 'api/ruleConfigure/',
+    method: 'delete',
+    data: ids
+  })
+}
+
+export function edit(data) {
+  return request({
+    url: 'api/ruleConfigure',
+    method: 'put',
+    data
+  })
+}
+
+export default { add, edit, del }

src/views/base-data/ruleConfigure/index.vue

@@ -0,0 +1,156 @@
+<template>
+  <div class="app-container">
+    <!--工具栏-->
+    <div class="head-container">
+      <div v-if="crud.props.searchToggle">
+        <!-- 搜索 -->
+        <label class="el-form-item-label">规则类型</label>
+        <el-input v-model="query.ruleType" clearable placeholder="规则类型" style="width: 185px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
+        <label class="el-form-item-label">SQL内容</label>
+        <el-input v-model="query.sqlContent" clearable placeholder="SQL内容" style="width: 185px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
+        <rrOperation :crud="crud" />
+      </div>
+      <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
+      <crudOperation :permission="permission" :tableKey="this.$options.name"/>
+      <!--表单组件-->
+      <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="550px">
+        <el-form ref="form" :model="form" :rules="rules" size="small" label-width="120px">
+          <el-form-item label="规则类型" prop="ruleType">
+            <el-select v-model="form.ruleType" filterable placeholder="请选择">
+              <el-option
+                v-for="item in dict.rule_type"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="SQL内容" prop="sqlContent">
+            <el-input v-model="form.sqlContent" :rows="3" type="textarea" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="是否发邮件" >
+            <el-checkbox v-model="form.beyj"/>
+          </el-form-item>
+          <el-form-item label="邮件备注">
+            <el-input v-model="form.yjDes" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="邮件收件人">
+            <el-input v-model="form.yjSjr" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="是否弹窗">
+            <el-checkbox v-model="form.betc"/>
+          </el-form-item>
+          <el-form-item label="弹窗消息">
+            <el-input v-model="form.tcMsg" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="颜色标记">
+            <el-checkbox v-model="form.beys"/>
+          </el-form-item>
+          <el-form-item label="标记颜色值">
+            <el-input v-model="form.ysFlg" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="标记颜色字段">
+            <el-input v-model="form.ysField" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="校验正则表达式">
+            <el-input v-model="form.gsContent" style="width: 370px;" />
+          </el-form-item>
+          <el-form-item label="描述">
+            <el-input v-model="form.description" style="width: 370px;" />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="text" @click="crud.cancelCU">取消</el-button>
+          <el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
+        </div>
+      </el-dialog>
+      <!--表格渲染-->
+      <el-table ref="table" v-loading="crud.loading" :data="crud.data" :height="crud.tableHeight" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
+        <el-table-column type="selection" width="55" />
+        <el-table-column prop="id" label="id" />
+        <el-table-column prop="ruleType" label="规则类型">
+          <template slot-scope="scope">
+            {{ dict.label.rule_type[scope.row.ruleType] }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="sqlContent" label="SQL内容" />
+        <el-table-column prop="description" label="描述" />
+        <el-table-column prop="yjDes" label="邮件备注" />
+        <el-table-column prop="yjSjr" label="邮件收件人" />
+        <el-table-column prop="tcMsg" label="弹窗消息" />
+        <el-table-column prop="beys" label="颜色标记" />
+        <el-table-column prop="ysFlg" label="标记颜色值" />
+        <el-table-column prop="ysField" label="标记颜色字段" />
+        <el-table-column prop="gsContent" label="格式校验正则表达式" />
+        <el-table-column prop="createTime" label="创建时间" />
+        <el-table-column prop="updateTime" label="更新时间" />
+        <el-table-column v-if="checkPer(['admin','ruleConfigure:edit','ruleConfigure:del'])" label="操作" width="150px" align="center">
+          <template slot-scope="scope">
+            <udOperation
+              :data="scope.row"
+              :permission="permission"
+            />
+          </template>
+        </el-table-column>
+      </el-table>
+      <!--分页组件-->
+      <pagination />
+    </div>
+  </div>
+</template>
+
+<script>
+import crudRuleConfigure from '@/api/ruleConfigure'
+import CRUD, { presenter, header, form, crud } from '@crud/crud'
+import rrOperation from '@crud/RR.operation'
+import crudOperation from '@crud/CRUD.operation'
+import udOperation from '@crud/UD.operation'
+import pagination from '@crud/Pagination'
+
+const defaultForm = { id: null, ruleType: null, sqlContent: null, description: null, beyj: null, yjDes: null, yjSjr: null, betc: null, tcMsg: null, beys: null, ysFlg: null, ysField: null, gsContent: null, bekz1: null, kz1Msg: null, kz1Content: null, bekz2: null, kz2Msg: null, kz2Content: null, bekz3: null, kz3Msg: null, kz3Content: null, bekz4: null, kz4Msg: null, kz4Content: null, bekz5: null, kz5Msg: null, kz5Content: null, createBy: null, updateBy: null, createTime: null, updateTime: null }
+export default {
+  name: 'RuleConfigure',
+  components: { pagination, crudOperation, rrOperation, udOperation },
+  mixins: [presenter(), header(), form(defaultForm), crud()],
+  dicts: ['rule_type'],
+  cruds() {
+    return CRUD({ title: '配置规则', url: 'api/ruleConfigure', idField: 'id', sort: 'id,desc', crudMethod: { ...crudRuleConfigure }})
+  },
+  data() {
+    return {
+      permission: {
+        add: ['admin', 'ruleConfigure:add'],
+        edit: ['admin', 'ruleConfigure:edit'],
+        del: ['admin', 'ruleConfigure:del']
+      },
+      rules: {
+        ruleType: [
+          { required: true, message: '规则类型不能为空', trigger: 'blur' }
+        ],
+        sqlContent: [
+          { required: true, message: 'SQL内容不能为空', trigger: 'blur' }
+        ],
+        beyj: [
+          { required: true, message: '是否发邮件不能为空', trigger: 'blur' }
+        ],
+        bekz5: [
+          { required: true, message: '扩展5标记不能为空', trigger: 'blur' }
+        ]
+      },
+      queryTypeOptions: [
+        { key: 'ruleType', display_name: '规则类型' },
+        { key: 'sqlContent', display_name: 'SQL内容' }
+      ]
+    }
+  },
+  methods: {
+    // 钩子：在获取表格数据之前执行，false 则代表不获取数据
+    [CRUD.HOOK.beforeRefresh]() {
+      return true
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/home.vue

@@ -36,13 +36,107 @@ export default {
   },
   data() {
     return {
+      notificationInstance: null,  // 用于存储当前的通知实例
+      showNotification: false,     // 控制是否显示通知
       lineChartData: lineChartData.newVisitis
     }
   },
+  mounted() {
+    this.initWebSocket();
+  },
   methods: {
     handleSetLineChartData(type) {
       this.lineChartData = lineChartData[type]
     },
+    async pollMsg() {
+      //3秒轮询一次
+      this.pollingTimer = setInterval(async () => {
+        const data = {msg: '友仓智慧物流,软件定义物流。', msgType: 'INFO'}
+        console.log(data)
+        //this.createOrUpdateNotification(data)
+      }, 3000);
+    },
+    initWebSocket() {
+      stockUrl.stockMsg();
+      const wsUri = (process.env.VUE_APP_WS_API === '/' ? '/' : (process.env.VUE_APP_WS_API + '/')) + 'webSocket/stock'
+      this.websock = new WebSocket(wsUri)
+      this.websock.onerror = this.webSocketOnError
+      this.websock.onmessage = this.webSocketOnMessage
+      this.pollMsg()
+    },
+    webSocketOnError(e) {
+      this.$notify({
+        title: 'WebSocket连接发生错误',
+        type: 'error',
+        duration: 0
+      })
+    }, webSocketOnMessage(e) {
+      const data = JSON.parse(e.data)
+      if (data.msgType === 'INFO') {
+        this.createOrUpdateNotification(data);
+      } else if (data.msgType === 'ERROR') {
+        this.$notify({
+          title: '',
+          message: data.msg,
+          dangerouslyUseHTMLString: true,
+          type: 'error',
+          duration: 0
+        })
+      }
+    },
+    webSocketSend(agentData) {
+      this.websock.send(agentData)
+    },
+    createOrUpdateNotification(data) {
+      // 更新或创建通知
+      if (this.showNotification && this.notificationInstance) {
+        this.updateNotification(data);
+      } else {
+        this.createNotification(data);
+      }
+      this.showNotification = true;
+    },
+
+    updateNotification(data) {
+      // 尝试更新通知内容
+      try {
+        this.notificationInstance.title = '点击关注公众号';
+        this.notificationInstance.message = data.msg;
+      } catch (error) {
+        // 如果更新失败，关闭当前通知并重新创建
+        this.createNotification(data);
+      }
+    },
+
+    createNotification(data) {
+      // 创建一个新的通知实例
+      this.notificationInstance = this.$notify({
+        title: '点击关注公众号',
+        message: data.msg,
+        type: 'success',
+        offset: 100,
+        duration: 0,
+        onClose: this.onNotificationClose // 关闭时调用的方
+      });
+    },
+    onNotificationClose() {
+      this.showNotification = false;
+      this.notificationInstance = null;
+    }
+  },
+  beforeDestroy() {
+    if (this.pollingTimer) {
+      clearInterval(this.pollingTimer);
+    }
+    if (this.websock && this.websock.readyState === WebSocket.OPEN) {
+      this.websock.close();
+    }
+    if (this.notificationInstance) {
+      console.log(111)
+      this.notificationInstance.close();  // 关闭通知
+      this.showNotification = false;
+      this.notificationInstance = null;
+    }
   }
 }
 </script>