我的消息

src/api/dashboard/message.ts

@@ -0,0 +1,50 @@
+import { http } from '@/utils/http/axios';
+
+/**
+ * @description: 消息列表
+ */
+export function getMessageProfile(params?) {
+  return http.request({
+    url: '/message/profile',
+    method: 'GET',
+    params,
+  });
+}
+/**
+ * @description: 设置消息已读
+ */
+export function setRead(data?) {
+  return http.request({
+    url: '/message/setRead',
+    method: 'POST',
+    data,
+  });
+}
+/**
+ * @description: 根据ID获取详情
+ */
+export function getMessageDetail(id) {
+  return http.request({
+    url: '/message/detail/'+id,
+    method: 'get',
+  });
+}
+/**
+ * @description: 删除消息
+ */
+export function messageDelete(id) {
+  return http.request({
+    url: '/message/delete/'+id,
+    method: 'DELETE',
+  });
+}
+/**
+ * @description: 批量删除消息
+ */
+export function messageBatchDelete(data:any) {
+  return http.request({
+    url: '/message/batchDelete',
+    method: 'DELETE',
+    data
+  });
+}

src/api/data/message.ts

@@ -0,0 +1,49 @@
+import { http } from '@/utils/http/axios';
+
+/**
+ * @description: 消息列表
+ */
+export function getMessageList(params?) {
+  return http.request({
+    url: '/message/page',
+    method: 'GET',
+    params,
+  });
+}
+/**
+ * @description: 已读消息
+ */
+export function messageRead(id) {
+  return http.request({
+    url: '/message/read/'+id,
+    method: 'get'
+  });
+}
+/**
+ * @description: 根据ID获取详情
+ */
+export function getMessageDetail(id) {
+  return http.request({
+    url: '/message/detail/'+id,
+    method: 'get',
+  });
+}
+/**
+ * @description: 删除消息
+ */
+export function messageDelete(id) {
+  return http.request({
+    url: '/message/delete/'+id,
+    method: 'DELETE',
+  });
+}
+/**
+ * @description: 批量删除消息
+ */
+export function messageBatchDelete(data:any) {
+  return http.request({
+    url: '/message/batchDelete',
+    method: 'DELETE',
+    data
+  });
+}

src/api/file/messageTemplate.ts

@@ -0,0 +1,60 @@
+import { http } from '@/utils/http/axios';
+
+/**
+ * @description: 列表
+ */
+export function getMessageTemplateList(params?) {
+  return http.request({
+    url: '/message/template/page',
+    method: 'GET',
+    params,
+  });
+}
+/**
+ * @description: 根据ID获取详情
+ */
+export function getMessageTemplateDetail(id) {
+  return http.request({
+    url: '/message/template/detail/'+id,
+    method: 'get',
+  });
+}
+/**
+ * @description: 添加
+ */
+export function messageTemplateAdd(data:any) {
+  return http.request({
+    url: '/message/template/add',
+    method: 'POST',
+    data,
+  });
+}
+/**
+ * @description: 更新
+ */
+export function messageTemplateUpdate(data:any) {
+  return http.request({
+    url: '/message/template/update',
+    method: 'PUT',
+    data
+  });
+}
+/**
+ * @description: 删除
+ */
+export function messageTemplateDelete(id) {
+  return http.request({
+    url: '/message/template/delete/'+id,
+    method: 'DELETE',
+  });
+}
+/**
+ * @description: 批量删除
+ */
+export function messageTemplateBatchDelete(data:any) {
+  return http.request({
+    url: '/message/template/batchDelete',
+    method: 'DELETE',
+    data
+  });
+}

src/views/dashboard/message/columns.ts

@@ -0,0 +1,27 @@
+import { h } from 'vue';
+import { ElTag } from 'element-plus';
+
+export const columns = [
+  {
+    type: 'selection',
+  },
+  {
+    label: '消息标题',
+    prop: 'title',
+  },
+  {
+    label: '消息状态',
+    prop: 'status',
+    render(record) {
+      return h('span', record.row.status === 1 ? '已读' : '未读')
+    },
+  },
+  {
+    label: '创建人',
+    prop: 'createUser',
+  },
+  {
+    label: '创建时间',
+    prop: 'createTime',
+  },
+];

src/views/dashboard/message/edit.vue

@@ -0,0 +1,89 @@
+<template>
+  <el-dialog
+      v-model="props.visible"
+      title="消息详情"
+
+      width="700"
+      :close-on-click-modal="false"
+      :before-close="dialogClose"
+  >
+  <el-descriptions  column="2">
+    <el-descriptions-item label="消息标题:">{{formData.title}}</el-descriptions-item>
+    <el-descriptions-item label="消息类型:">{{getTyepText(formData.type)}}</el-descriptions-item>
+    <el-descriptions-item label="业务类型:">{{formData.bizType==1?'订单':'其他'}}</el-descriptions-item>
+    <el-descriptions-item label="消息状态:">{{formData.status==1?'已读':'未读'}}</el-descriptions-item>
+    <el-descriptions-item label="消息内容:">{{formData.content}}</el-descriptions-item>
+</el-descriptions>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogClose">关闭</el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+<script lang="ts" setup>
+import {getMessageDetail} from "@/api/dashboard/message";
+import {onMounted, reactive} from "vue";
+
+const emit = defineEmits(["success", "update:visible"]);
+const formData = reactive({
+  id: "",
+  title: "",
+  type:'',
+  bizType:'',
+  status:'',
+  content:''
+});
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false
+  },
+  messageId: {
+    type: Number,
+    required: true,
+    default: 0
+  }
+});
+
+
+const dialogClose = () => {
+  emit("update:visible", false);
+};
+
+const setFormData = async () => {
+  const data = await getMessageDetail(props.messageId);
+  for (const key in formData) {
+    if (data[key] != null && data[key] != undefined) {
+      //@ts-ignore
+      formData[key] = data[key];
+    }
+  }
+};
+const getTyepText =(type)=>{
+  let typeText = ''
+    switch (type) {
+      case 1:
+          typeText='系统通知'
+          break;
+        case 2:
+          typeText='用户私信 '
+          break;
+        case 3:
+          typeText='代办事项'
+          break;
+        default:
+          break;
+    }
+    return typeText 
+}
+
+onMounted(() => {
+  if (props.messageId) {
+    setFormData();
+  }
+});
+
+</script>

src/views/dashboard/message/index.vue

@@ -0,0 +1,191 @@
+<template>
+  <PageWrapper>
+    <el-row :gutter="10" class="mt-3">
+      <el-col :xs="24" :sm="24" :md="3" :lg="3" :xl="3" class="mb-4">
+        <el-card shadow="hover" class="mb-4 border-0 proCard" :style="{ height: docHeight + 'px' }">
+          <div v-for="(item,index) in messageTypeList" :key="index" @click="handleClick(item,index)" class="type-item" :class="index==activeIndex?'active':''">
+            <el-badge :value="item.number?item.number:''" :max="99" class="item">
+             <span class="t1">{{item.name}}</span>
+            </el-badge>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :xs="24" :sm="24" :md="21" :lg="21" :xl="21" class="mb-4">
+        <el-card shadow="hover" class="mb-4 border-0 proCard">
+          <BasicTable
+            :columns="columns"
+            :request="loadDataTable"
+            :row-key="(row) => row.id"
+            ref="tableRef"
+            :actionColumn="actionColumn"
+            @selection-change="onSelectionChange"
+          >
+            <template #tableTitle>
+              <el-button type="primary" @click="handleSetRead()">
+                批量确认
+              </el-button>
+              <el-button type="danger" @click="handleDelete()" :disabled="!selectionData.length">
+                  <template #icon>
+                    <el-icon class="el-input__icon">
+                      <Delete />
+                    </el-icon>
+                  </template>
+                  删除
+                </el-button>
+            </template>
+          </BasicTable>
+        </el-card>
+      </el-col>
+    </el-row>
+    <editDialog
+        v-if="editVisible"
+        :messageId="messageId"
+        v-model:visible="editVisible"
+        @success="reloadTable('noRefresh')"
+    >
+    </editDialog>
+  </PageWrapper>
+</template>
+
+<script lang="ts" setup>
+  import { reactive, ref, h,nextTick,defineAsyncComponent,onMounted } from 'vue';
+  import { TableAction } from '@/components/Table';
+  import { getMessageProfile,messageDelete,messageBatchDelete,setRead } from '@/api/dashboard/message';
+  import { columns } from './columns';
+  import {message,confirm} from "@/utils/auth";
+  const editDialog = defineAsyncComponent(() =>
+    import('./edit.vue')
+)
+const messageId =ref(0)
+const docHeight = ref(500)
+const activeIndex = ref(0)
+const messageTypeList = ref([
+  {
+    name:'系统通知',
+    value:1
+  },
+  {
+    name:'用户私信',
+    value:2
+  },
+  {
+    name:'代办事项',
+    value:3
+  },
+])
+const editVisible=ref(false)
+  const selectionData = ref([])
+  const tableRef = ref();
+  const formParams = reactive({
+    title:'',
+    status:'',
+    type:1
+  });
+  const actionColumn = reactive({
+    width: 250,
+    label: '操作',
+    prop: 'action',
+    fixed: 'right',
+    render(record) {
+      return h(TableAction, {
+        style: 'button',
+        actions: [
+          {
+            label: '确认',
+            type: 'warning',
+            onClick: handleSetRead.bind(null, record),
+          },
+          {
+            label: '详情',
+            type: 'warning',
+            onClick: handleInfo.bind(null, record),
+          },
+          {
+            label: '删除',
+            type: 'danger',
+            onClick: handleDelete.bind(null, record),
+          },
+        ],
+      });
+    },
+  });
+
+  const loadDataTable = async (res: any) => {
+    const result = await getMessageProfile({ ...formParams, ...res });
+    let item = messageTypeList.value.find((item,index)=>index==activeIndex.value)
+    item.number = result.number
+    return result;
+  };
+
+  function reloadTable(noRefresh='') {
+    tableRef.value.reload(noRefresh?{}:{pageNo:1});
+  }
+const handleClick = (item,index)=>{
+  activeIndex.value =index
+  formParams.type = item.value
+  reloadTable()
+}
+
+const handleInfo = async (record: Recordable) => {
+  messageId.value=record.row.id
+  await nextTick();
+  editVisible.value=true
+};
+
+async function handleDelete(record: Recordable) {
+    let ids = []
+    if(!record){
+      ids = selectionData.value.map(({id}) => id);
+    }
+    await confirm('确定要删除？');
+    record? await messageDelete(record.row.id):await messageBatchDelete(ids);
+    message("删除成功");
+    reloadTable()
+}
+async function handleSetRead(record: Recordable) {
+    let ids = []
+    if(!record){
+      ids = selectionData.value.map(({id}) => id);
+    }
+    await confirm('确定标记为已读？');
+    record? await setRead({idList:[record.row.id]}):await setRead({idList:ids});
+    message("标记成功");
+    reloadTable()
+}
+function onSelectionChange(value){
+    selectionData.value = value
+  }
+  onMounted(() => {
+  docHeight.value =document.body.clientHeight - 165
+})
+</script>
+
+<style lang="scss">
+.type-item {
+  height: 40px;
+  line-height: 40px;
+  padding:0 6px;
+  cursor: pointer;
+  display: flex;
+  justify-content: space-between;
+  .t1 {
+    width:100px;
+    display: block;
+  }
+  &.active {
+    background-color: #e8f1ff;
+    border-radius: 3px;
+    .t1 {
+      color:#1677ff;
+      .t2 {
+        background-color: #ff4d4f;
+        color: #ffffff;
+      }
+    }
+  }
+  .el-badge__content.is-fixed{
+    top: 20px;
+    right: calc(-10px + var(--el-badge-size)/ 2);
+  }
+}
+</style>

src/views/file/smsTemplate/index.vue

@@ -85,6 +85,7 @@ const editVisible=ref(false)
           {
             label: '删除',
             type: 'danger',
+            onClick: handleDelete.bind(null, record),
             auth: ['sys:smsTemplate:delete'],
           },
         ],