新增我的消息 菜单

src/api/bpm/task.js

@@ -52,6 +52,7 @@ export function rejectTask(data) {
     data: data
   });
 }
+
 export function backTask(data) {
   return request({
     url: '/bpm/task/back',
@@ -104,6 +105,7 @@ export function delegateTask(data) {
     data: data
   });
 }
+
 export function approveTaskWithVariables(data) {
   return request({
     url: '/bpm/task/approveTaskWithVariables',
@@ -135,3 +137,32 @@ export function outinApproveNotPass(data) {
     data: data
   });
 }
+
+
+// 我的消息分页
+export async function notifyMessagePageAPI(data) {
+  const res = await request({
+    url: `/sys/notifymessage/page`,
+    method: 'get',
+    params: data
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+/**
+ * 更新已读-指定消息ID
+ */
+export async function updateNotifyMessageReadByIdAPI(data) {
+  const res = await request({
+    url: `/sys/notifymessage/updateNotifyMessageRead`,
+    method: 'post',
+    data: data
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/views/bpm/message/index.vue

@@ -0,0 +1,140 @@
+<template>
+  <div class="ele-body">
+    <el-card shadow="never">
+      <ele-pro-table ref="table" :columns="columns" :datasource="datasource">
+        <!-- 操作列 -->
+        <template v-slot:action="{ row }">
+
+          <el-link
+            type="primary"
+            :underline="false"
+            icon="el-icon-view"
+            v-if="!row.readStatus"
+            @click="handleAddOrEdit(row)"
+          >
+            确认
+          </el-link>
+        </template>
+      </ele-pro-table>
+    </el-card>
+  </div>
+</template>
+<script>
+
+import {notifyMessagePageAPI, updateNotifyMessageReadByIdAPI} from "@/api/bpm/task";
+import {mapGetters} from "vuex";
+
+
+export default {
+  data() {
+    return {
+      addOrEditDialogFlag: false,
+      columns: [
+        {
+          columnKey: 'index',
+          label: '序号',
+          type: 'index',
+          width: 55,
+          align: 'center',
+          showOverflowTooltip: true,
+          fixed: 'left'
+        },
+        {
+          prop: 'templateNickname',
+          label: '发送人',
+          minWidth: '60',
+          align: "center",
+        },
+        {
+          prop: 'templateContent',
+          label: '内容',
+          minWidth: '150',
+          align: "center",
+        },
+        {
+          prop: 'readStatus',
+          label: '是否已读',
+          minWidth: '60',
+          align: "center",
+          formatter: (_row, _column, cellValue) => {
+            return _row.readStatus ? '已读' : '未读';
+          }
+        },
+        {
+          prop: 'readTime',
+          label: '阅读时间',
+          minWidth: '120',
+          align: "center",
+          showOverflowTooltip: true,
+        },
+        {
+          prop: 'createTime',
+          label: '发送时间',
+          minWidth: '120',
+          align: "center",
+          showOverflowTooltip: true,
+        },
+        {
+          columnKey: 'action',
+          label: '操作',
+          width: 100,
+          align: 'center',
+          slot: 'action',
+          fixed: 'right'
+        }
+      ],
+      searchForm: {},
+      tableData: [],
+      size: 10,
+      page: 1,
+      total: 0
+    };
+  },
+  computed: {
+    ...mapGetters(['user'])
+  },
+  methods: {
+    //新增或修改模板
+   async handleAddOrEdit(row) {
+      await updateNotifyMessageReadByIdAPI([row.id]);
+      this.$refs.table.reload()
+    },
+    reload(params) {
+      params.userId = this.user.info.userId
+      this.$refs.table.reload({pageNum: 1, where: params});
+    },
+    datasource({page, where, limit, ...row}) {
+      return notifyMessagePageAPI({
+        ...where,
+        pageNum: page,
+        size: limit,
+        userId: this.user.info.userId
+      });
+    },
+    reset() {
+    },
+  }
+};
+</script>
+<style lang="scss" scoped>
+.app-container {
+  background: #f0f3f3;
+  min-height: calc(100vh - 84px);
+}
+
+.zw-page-table {
+  background: #ffffff;
+  padding-top: 20px;
+}
+
+.pagination-wrap {
+  display: flex;
+  justify-content: flex-end;
+  padding: 10px 0;
+}
+
+.table {
+  width: 100%;
+  margin-top: 10px;
+}
+</style>