src/api/bulletin-mgmt.ts

@@ -1,105 +0,0 @@
-import axios from 'axios';
-
-export interface BulletinCreateRecord {
-  title: string;
-  top: boolean;
-  content: string;
-  remark: string;
-  attachmentIds?: string[];
-}
-
-
-export interface BulletinRecord extends BulletinCreateRecord {
-  id: number;
-  state: string;
-  publishTime: string;
-  createTime: string;
-
-}
-
-export interface BulletinsRecord {
-  title?: string;
-  state?: string[];
-  publishTimeBegin?: string[];
-  publishTimeEnd?: string[];
-  total?: number;
-  current: number;
-  pages: number;
-}
-
-export interface AttachmentRecord {
-  type: string;
-  file: any;
-}
-
-
-// 查看详情
-export function queryBulletinListAll(id: number) {
-  return axios.get(`/api/rest/bulletin/${id}`);
-}
-
-// 分页查询
-export function queryBulletinList(data: BulletinsRecord) {
-  return axios({
-    url: '/api/rest/bulletin',
-    method: 'get',
-    params: data,
-  });
-}
-
-// 添加公告
-export function create(data: BulletinCreateRecord) {
-  return axios.post(`/api/rest/bulletin`, data);
-}
-
-// 更新公告
-export function update(data: BulletinRecord) {
-  return axios.patch(`/api/rest/bulletin/${data.id}`, data);
-}
-
-// 置顶状态
-export function toggle(id: number) {
-  return axios.patch(`/api/rest/bulletin/${id}/toggle-top`);
-}
-
-// 发布编辑
-export function publish(data: number[]) {
-  return axios.patch(`/api/rest/bulletin/publish`, data);
-}
-
-// 关闭公告
-export function close(id: number) {
-  return axios.patch(`/api/rest/bulletin/${id}/toggleClose`);
-}
-
-// 删除公告
-export function remove(id: number) {
-  return axios.delete(`/api/rest/bulletin/${id}`);
-}
-
-// 添加附件
-export function addAttachments(data: any) {
-  return axios({
-    method: 'post',
-    url: '/api/rest/attachment',
-    headers: {
-      'Content-Type': 'multipart/form-data',
-    },
-    data,
-  })
-}
-
-// 获取附件信息
-export function addAttachment(id: string) {
-  return axios.get(`/api/rest/attachment/find/${id}`);
-}
-
-// 删除附件
-export function deleteAttachment(id: string) {
-  return axios.delete(`/api/rest/attachment/delete/${id}`);
-}
-
-// 获取部门树
-export function queryDeptTreeList() {
-  return axios.get(`/api/deptTree`);
-}

src/api/bulletins.ts

@@ -1,26 +0,0 @@
-import axios from 'axios';
-
-export interface BulletinsRecord {
-  title?: string;
-  state?: number[];
-  top?: boolean;
-  publishTimeBegin?: string[];
-  publishTimeEnd?: string[];
-  total?: number;
-  size: number;
-  isRead?: boolean;
-  current: number;
-}
-
-// 查看详情
-export function queryBulletinsListAll(id: number) {
-  return axios.get(`/api/rest/bulletin/self/${id}`);
-}
-// 分页查询
-export function queryBulletinsList(data: BulletinsRecord) {
-  return axios({
-    url: '/api/rest/bulletin/self',
-    method: 'get',
-    params: data,
-  });
-}

src/store/modules/bulle-mgmt/index.ts

@@ -1,88 +0,0 @@
-import { defineStore } from 'pinia';
-import {
-  BulletinCreateRecord,
-  BulletinRecord,
-  BulletinsRecord,
-  create,
-  update,
-  toggle,
-  publish,
-  close,
-  remove,
-  queryBulletinListAll,
-  queryBulletinList,
-  addAttachments,
-  queryDeptTreeList,
-  addAttachment,
-  deleteAttachment
-} from '@/api/bulletin-mgmt';
-import { bulletinsStore } from '@/store/modules/bulle-mgmt/type';
-
-const useBulletinStore = defineStore('dept', {
-  state: ():bulletinsStore  => ({
-    remark: undefined,
-    title: undefined,
-    top: undefined,
-    content: undefined,
-    attachmentIds: undefined,
-  }),
-
-  getters: {
-    DeptInfo(state: bulletinsStore): bulletinsStore {
-      return { ...state };
-    },
-  },
-  actions: {
-    async queryBulletinListAll(id: number) {
-      return queryBulletinListAll(id);
-    },
-
-    async queryBulletinList(params: BulletinsRecord) {
-      return queryBulletinList(params);
-    },
-
-    async removeBulletin(id: number) {
-      return remove(id);
-    },
-
-    async createBulletin(params: BulletinCreateRecord) {
-      return create(params);
-    },
-
-    async updateBulletin(params: BulletinRecord) {
-      return update(params);
-    },
-
-    async toggleBulletin(id: number) {
-      return toggle(id);
-    },
-
-    async publishBulletin(data: number[]) {
-      return publish(data);
-    },
-
-    async closeBulletin(id: number) {
-      return close(id);
-    },
-
-    async addAttachments(data: any) {
-      return addAttachments(data);
-    },
-
-    // 获取部门树
-    async queryDeptTreeList() {
-      return queryDeptTreeList();
-    },
-
-    // 获取附件信息
-    async queryAttachmentInfo(id: string) {
-      return addAttachment(id);
-    },
-
-    // 删除附件
-    async deleteAttachment(id: string) {
-      return deleteAttachment(id);
-    }
-  },
-});
-export default useBulletinStore;

src/store/modules/bulle-mgmt/type.ts

@@ -1,8 +0,0 @@
-// export type bulletinsType = '' | '*' | 'admin' | 'user' | string[];
-export interface bulletinsStore {
-  title?: string;
-  top?: string[];
-  content?: string;
-  remark?: string;
-  attachmentIds?: string[];
-}

src/store/modules/bulletins/index.ts

@@ -1,33 +0,0 @@
-import { defineStore } from 'pinia';
-import {
-  queryBulletinsListAll,
-  queryBulletinsList,
-  BulletinsRecord
-} from '@/api/bulletins';
-import { bulletinsStore } from './type';
-
-const useBulletinsStore = defineStore('auth', {
-  state: (): bulletinsStore => ({
-    title: undefined,
-    state: undefined,
-    publishTimeBegin: undefined,
-    publishTimeEnd: undefined,
-  }),
-
-  getters: {
-    AuthInfo(state: bulletinsStore): bulletinsStore {
-      return { ...state };
-    },
-  },
-  actions: {
-    async getBulletinsList(data: BulletinsRecord) {
-      return queryBulletinsList(data);
-    },
-
-    async getBulletinsListAll(data: number) {
-      return queryBulletinsListAll(data);
-    },
-  }
-  });
-
-export default useBulletinsStore;

src/store/modules/bulletins/type.ts

@@ -1,7 +0,0 @@
-// export type bulletinsType = '' | '*' | 'admin' | 'user' | string[];
-export interface bulletinsStore {
-  title?: string;
-  state?: string[];
-  publishTimeBegin?: string;
-  publishTimeEnd?: string;
-}

src/views/notification/notice/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <Breadcrumb :items="['个人中心', '公告通知']" />
+    <Breadcrumb :items="['通知管理', '公告通知']" />
     <a-card class="general-card" title=" ">
       <a-row>
         <a-col :flex="1">
@@ -14,37 +14,55 @@
               <a-col :span="9">
                 <a-form-item
                   field="title"
-                  label='标题'
+                  :label="$t('标题')"
                 >
                   <a-input
                     v-model="formModel.title"
                     style="width: 360px"
-                    placeholder='请输入标题'
+                    :placeholder="$t('请输入标题')"
-                  />
-                </a-form-item>
-              </a-col>
-              <a-col :span="10">
-                <a-form-item field="Time" label='时间'>
-                  <a-range-picker
-                    show-time
-                    format="YYYY-MM-DD HH:mm"
-                    @ok="timeRangs"
                   />
                 </a-form-item>
               </a-col>
               <a-col :span="9">
                 <a-form-item
-                  field="isRead"
+                  field="enable"
-                  label='状态'
+                  :label="$t('状态')"
                 >
                   <a-select
-                    v-model="formModel.isRead"
+                    v-model="formModel.states"
                     style="width: 360px"
-                    placeholder='请选择状态'
+                    :placeholder="$t('请选择状态')"
                     :options="statusOptions"
                   />
                 </a-form-item>
               </a-col>
+
+              <a-col :span="9">
+                <a-form-item field="publishTimeBegin" :label="$t('开始时间')">
+                  <a-date-picker
+                    v-model="formModel.publishTimeBegin"
+                    style="width: 360px"
+                    show-time
+                    :time-picker-props="{ defaultValue: '09:09:06' }"
+                    format="YYYY-MM-DD HH:mm"
+                    :allow-clear="false"
+                    @select="onSelect"
+                  />
+                </a-form-item>
+              </a-col>
+              <a-col :span="9">
+                <a-form-item field="publishTimeEnd" :label="$t('结束时间')">
+                  <a-date-picker
+                    v-model="formModel.publishTimeEnd"
+                    style="width: 360px"
+                    show-time
+                    :time-picker-props="{ defaultValue: '09:09:06' }"
+                    format="YYYY-MM-DD HH:mm"
+                    :allow-clear="false"
+                    @select="onSelect"
+                  />
+                </a-form-item>
+              </a-col>
             </a-row>
           </a-form>
         </a-col>
@@ -75,26 +93,30 @@
         :columns="(cloneColumns as TableColumnData[])"
         :data="renderData"
         :bordered="false"
-        :size="sizeof"
+        :size="size"
-        :style="highlightRow"
         style="margin-bottom: 40px"
         :filter-icon-align-left="alignLeft"
         @change="handleSortChange"
         @page-change="onPageChange"
       >
-        <template #publishTime="{ record }">
+        <template #index="{ rowIndex }">
-          {{ dayjs(record.publishTime).format('YYYY-MM-DD HH:mm') }}
+          {{ rowIndex + 1 + (pagination.current - 1) * pagination.size }}
         </template>
-        <template #isRead="{ record }">
+        <template #enabled="{ record }">
-          {{ record.isRead == true? '已读' : '未读' }}
+          <a-switch
+            :model-value="record.enabled"
+            :checked-value="true"
+            :unchecked-value="false"
+            @change="enabledStatus(record)"
+          />
         </template>
         <template #operations="{ record }">
           <a-button
             type="outline"
             size="small"
             status="success"
-            style="padding: 7px; margin-right: 10px"
+            :prem="record"
-            @click="handleRead(record)"
+            style="padding: 7px;margin-right: 10px"
           >
             <template #icon><icon-list /></template>
             详情
@@ -105,7 +127,7 @@
       <a-pagination
         style="float: right; position: relative; right: 1px; bottom: 25px"
         :total="pagination.total"
-        :size="sizeof"
+        :size="size"
         show-total
         show-jumper
         show-page-size
@@ -120,27 +142,29 @@
 
 <script lang="ts" setup>
   import { computed, ref, watch } from 'vue';
+  import { useI18n } from 'vue-i18n';
   import useLoading from '@/hooks/loading';
-  import dayjs from 'dayjs';
+  import { UserRecord, UserParams } from '@/api/user';
   import { Pagination } from '@/types/global';
   import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
   import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
-  import { useBulletinsStore } from '@/store';
+  import { useUserStore } from '@/store';
-  import router from '@/router';
+  import { Message } from '@arco-design/web-vue';
   import useTableOption from '@/hooks/table-option';
-  import { BulletinsRecord } from '@/api/bulletins';
+  import NoticeEdit from '@/views/notification/noticeSet/components/notice-edit.vue';
 
   const generateFormModel = () => {
     return {
       title: '',
-      state: '',
+      states: '',
       publishTimeBegin: '',
       publishTimeEnd: '',
     };
   };
 
   const { loading, setLoading } = useLoading(true);
-  const renderData = ref<BulletinsRecord[]>([]);
+  const { t } = useI18n();
+  const renderData = ref<UserRecord[]>([]);
   const formModel = ref(generateFormModel());
 
   const {
@@ -154,30 +178,42 @@
   } = useTableOption();
   const sizeof=useTableOption().size;
 
-  const bulletinsStore = useBulletinsStore();
+  const userStore = useUserStore();
 
-  const pagination: any = {
+  const pagination: Pagination = {
+    page: 1,
     size: 10,
-    current: 1
+    current: 1,
+    total: null,
   };
 
   const columns = computed<TableColumnData[]>(() => [
     {
-      title: '标题',
+      title: '序号',
-      dataIndex: 'title',
+      dataIndex: 'index',
+      slotName: 'index',
+      width: 60,
     },
     {
-      title: '时间',
+      title: '标题',
-      dataIndex: 'publishTime',
+      dataIndex: 'title',
-      slotName: 'publishTime',
       sortable: {
         sortDirections: ['ascend', 'descend'],
       },
     },
     {
-      title: '状态',
+      title: t('时间'),
-      dataIndex: 'isRead',
+      dataIndex: 'publishTimeBegin',
-      slotName: 'isRead',
+      sortable: {
+        sortDirections: ['ascend', 'descend'],
+      },
+    },
+    {
+      title: t('状态'),
+      dataIndex: 'states',
+      sortable: {
+        sortDirections: ['ascend', 'descend'],
+      },
     },
     {
       title: '操作',
@@ -187,26 +223,27 @@
   ]);
   const statusOptions = computed<SelectOptionData[]>(() => [
     {
-      label: '已读',
+      label: t('已发布'),
       value: 'true',
     },
     {
-      label: '未读',
+      label: t('未发布'),
       value: 'false',
     },
   ]);
 
   // 获取公告列表
   const fetchData = async (
-    params: BulletinsRecord = { size: 10, current: 1 }
+    params: UserParams = { page: 1, size: 10, current: 1 }
   ) => {
     setLoading(true);
     try {
-      const res = await bulletinsStore.getBulletinsList(params);
+      const res = await userStore.getUserList(params);
       renderData.value = res.data.records;
       pagination.page = res.data.page;
       pagination.current = res.data.current;
       pagination.total = res.data.total;
+      pagination.size = res.data.size;
     } catch (err) {
       // you can report use errorHandler or other
     } finally {
@@ -214,35 +251,12 @@
     }
   };
 
-  // 高亮行
-  const highlightRow = (record: BulletinsRecord) => {
-    if (record.top === true) {
-      console.log('record', record);
-      return 'background-color: yellow;';
-    }
-    return '';
-  };
-
-  // 时间范围
-  const timeRangs = (dateString: string[]) => {
-    // eslint-disable-next-line prefer-destructuring
-    formModel.value.publishTimeBegin = dateString[0];
-    // eslint-disable-next-line prefer-destructuring
-    formModel.value.publishTimeEnd = dateString[1];
-  };
-
-  // 详情
-  const handleRead = async (record: BulletinsRecord) => {
-      // await bulletinsStore.readBulletins({ id: record.id });
-      await router.push({ name: 'Details', params: { id: record.id } });
-  };
-
   // 查询
   const search = () => {
     fetchData({
       ...pagination,
       ...formModel.value,
-    } as unknown as BulletinsRecord);
+    } as unknown as UserParams);
   };
 
   // 分页发生改变
@@ -253,8 +267,8 @@
   };
 
   // 数据条数改变
-  const onSizeChange = (total: number) => {
+  const onSizeChange = (size: number) => {
-    pagination.total = total;
+    pagination.size = size;
     search();
   };
 
@@ -269,8 +283,36 @@
   const alignLeft = ref(false);
   const handleSortChange = (data: any, extra: any, currentDataSource: any) => {};
 
-    watch(() => columns.value, deepClone, { deep: true, immediate: true });
+  // 是否启用
+  const enabledStatus = async (record: string) => {
+    record.enabled = !record.enabled;
+    const res = await userStore.enabledUser(record.id);
+    if (res.status === 200) {
+      Message.success({
+        content: t('modify.status.sucess'),
+        duration: 3 * 1000,
+      });
+    } else {
+      Message.error({
+        content: t('modify.status.fail'),
+        duration: 3 * 1000,
+      });
+    }
+  };
 
+  // 删除
+  // const handleDelete = async (record: UserRecord) => {
+  //   const res = await userStore.removeUser(record.id);
+  //   if (res.status === 200) {
+  //     Message.success({
+  //       content: '删除成功',
+  //       duration: 5 * 1000,
+  //     });
+  //     search();
+  //   }
+  // };
+
+  watch(() => columns.value, deepClone, { deep: true, immediate: true });
 </script>
 
 <style scoped>
@@ -278,8 +320,40 @@
     padding: 0 20px 20px 20px;
   }
 
-  .highlight-class {
+  .content-col {
-    background-color: yellow; /* 这里可以修改为你想要的高亮颜色 */
+    flex: 1;
-    font-weight: bold; /* 可以添加其他样式，如加粗等 */
+    padding-left: 24px; /* 左侧内边距 */
+  }
+
+  .message-item {
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
+    margin-bottom: 16px; /* 卡片之间的间距 */
+    display: flex;
+    align-items: center;
+  }
+
+  .message-content {
+    flex: 1;
+    padding: 16px;
+  }
+
+  .scroll-wrapper {
+    height: calc(62vh); /* 调整高度以适应页面布局 */
+    overflow-y: auto; /* 当内容超出时显示滚动条 */
+    border: 1px solid #d9d9d9; /* 边框颜色调淡 */
+    border-radius: 8px;
+    padding: 16px;
+  }
+
+  .load-trigger {
+    height: 1px; /* 设置高度为1px，使其不占据太多空间 */
+    opacity: 0; /* 使其不可见 */
+  }
+
+  .loading, .no-more {
+    text-align: center;
+    padding: 10px;
+    color: #999;
   }
 </style>

src/views/notification/noticeSet/index.vue

@@ -14,40 +14,55 @@
               <a-col :span="9">
                 <a-form-item
                   field="title"
-                  label='标题'
+                  :label="$t('标题')"
                 >
                   <a-input
                     v-model="formModel.title"
                     style="width: 360px"
-                    placeholder='请输入标题'
+                    :placeholder="$t('请输入标题')"
-                  />
-                </a-form-item>
-              </a-col>
-              <a-col :span="10">
-                <a-form-item field="Time" label='时间'>
-                  <a-range-picker
-                    show-time
-                    format="YYYY-MM-DD HH:mm"
-                    @ok="timeRangs"
                   />
                 </a-form-item>
               </a-col>
               <a-col :span="9">
                 <a-form-item
                   field="enable"
-                  label='状态'
+                  :label="$t('状态')"
                 >
                   <a-select
-                    v-model="formModel.state"
+                    v-model="formModel.states"
                     style="width: 360px"
-                    placeholder='请选择状态'
+                    :placeholder="$t('请选择状态')"
                     :options="statusOptions"
                   />
                 </a-form-item>
               </a-col>
 
-
+              <a-col :span="9">
-
+                <a-form-item field="publishTimeBegin" :label="$t('开始时间')">
+                  <a-date-picker
+                    v-model="formModel.publishTimeBegin"
+                    style="width: 360px"
+                    show-time
+                    :time-picker-props="{ defaultValue: '09:09:06' }"
+                    format="YYYY-MM-DD HH:mm"
+                    :allow-clear="false"
+                    @select="onSelect"
+                  />
+                </a-form-item>
+              </a-col>
+              <a-col :span="9">
+                <a-form-item field="publishTimeEnd" :label="$t('结束时间')">
+                  <a-date-picker
+                    v-model="formModel.publishTimeEnd"
+                    style="width: 360px"
+                    show-time
+                    :time-picker-props="{ defaultValue: '09:09:06' }"
+                    format="YYYY-MM-DD HH:mm"
+                    :allow-clear="false"
+                    @select="onSelect"
+                  />
+                </a-form-item>
+              </a-col>
             </a-row>
           </a-form>
         </a-col>
@@ -74,12 +89,14 @@
       <a-row>
         <a-col :span="12">
           <a-space>
-            <BulletinEdit ref="createUserRef" :is-create="true" @refresh="search" />
+            <NoticeEdit ref="createUserRef" :is-create="true" @refresh="search" />
-            <a-button type="primary" @click="publishBulletin(selectedIds)">
-              <template #icon><icon-public /></template>
-              发布
-            </a-button>
           </a-space>
+          <a-button style="margin-left: 20px" @click="generateExcel">
+            <template #icon>
+              <icon-download size="18" />
+            </template>
+            导出
+          </a-button>
         </a-col>
         <a-col
           :span="12"
@@ -90,14 +107,14 @@
             padding-bottom: 20px;
           "
         >
-          <a-tooltip content='刷新'>
+          <a-tooltip :content="$t('刷新')">
             <div class="action-icon" @click="search">
               <icon-refresh size="18" />
             </div>
           </a-tooltip>
 
           <a-dropdown @select="handleSelectDensity">
-            <a-tooltip content='密度'>
+            <a-tooltip :content="$t('密度')">
               <div class="action-icon"><icon-line-height size="18" /></div>
             </a-tooltip>
             <template #content>
@@ -105,14 +122,14 @@
                 v-for="item in densityList"
                 :key="item.value"
                 :value="item.value"
-                :class="{ active: item.value === size }"
+                :class="{ active: item.value === sizeof }"
               >
                 <span>{{ item.name }}</span>
               </a-doption>
             </template>
           </a-dropdown>
 
-          <a-tooltip content='列设置'>
+          <a-tooltip :content="$t('列设置')">
             <a-popover
               trigger="click"
               position="bl"
@@ -158,80 +175,48 @@
         :bordered="false"
         :size="size"
         style="margin-bottom: 40px"
+        :filter-icon-align-left="alignLeft"
+        @change="handleSortChange"
         @page-change="onPageChange"
       >
-        <template #id="{ record }">
+        <template #index="{ rowIndex }">
-          <a-checkbox v-model="selectedIds" :value="record.id" style="margin-left: -5px"> </a-checkbox>
+          {{ rowIndex + 1 + (pagination.current - 1) * pagination.size }}
         </template>
-        <template #publishTime="{ record }">
+        <template #enabled="{ record }">
-          {{ dayjs(record.publishTime).format('YYYY-MM-DD HH:mm') }}
-        </template>
-        <template #state="{ record }">
-          <span v-if="record.state === 'publish'">已发布</span>
-          <span v-else-if="record.state === 'edit'">编辑中</span>
-          <span v-else-if="record.state === 'close'">已关闭</span>
-<!--          <a-switch-->
-<!--            :model-value="record.state"-->
-<!--            :checked-value="record.state ? 'publish' || 'edit' : 'close' "-->
-<!--            :unchecked-value="record.state ? 'close' : 'publish' || 'edit' "-->
-<!--            @change="handleClose(record.id)"-->
-<!--          />-->
-        </template>
-        <template #top="{ record }">
           <a-switch
-            :model-value="record.top"
+            :model-value="record.enabled"
             :checked-value="true"
             :unchecked-value="false"
-            @change="handleSwitchChange(record)"
+            @change="enabledStatus(record)"
           />
         </template>
         <template #operations="{ record }">
           <a-button
-          type="outline"
+            type="outline"
-          size="small"
+            size="small"
-          status="success"
+            status="success"
-          style="padding: 7px; margin-right: 10px"
+            style="padding: 7px;margin-right: 10px"
-          @click="openDetail(record.id)"
+          >
-        >
+            <template #icon><icon-list /></template>
-          <template #icon><icon-list /></template>
+            详情
-          详情
+          </a-button>
-        </a-button>
+
-          <BulletinEdit
+          <NoticeEdit
             ref="editUserRef"
             :prem="record"
             :is-create="false"
             @refresh="fetchData"
           />
-          <a-popconfirm
+          <a-button
-            content='确认删除此公告？'
-            type="error"
-            @ok="handleDelete(record.id)"
-          >
-            <a-button
             type="outline"
             size="small"
             status="danger"
-            style="padding: 7px;margin-right: 10px"
+            style="padding: 7px"
-            >
-              <template #icon><icon-delete /></template>
-              删除
-            </a-button>
-          </a-popconfirm>
-          <a-popconfirm
-            :content="record.state === 'publish'? '确认关闭此公告？' : '确认编辑此公告?'"
-            type="error"
-            @ok="handleClose(record.id)"
           >
-            <a-button
+            <template #icon><icon-delete /></template>
-              type="outline"
+            删除
-              size="small"
+          </a-button>
-              status="warning"
+
-              style="padding: 7px;margin-right: 10px"
-            >
-              <template #icon><icon-poweroff /></template>
-              切换状态
-            </a-button>
-          </a-popconfirm>
         </template>
       </a-table>
       <a-pagination
@@ -249,84 +234,76 @@
 </template>
 
 <script lang="ts" setup>
-  import { computed, onMounted, ref, watch } from 'vue';
+  import { computed, ref, watch } from 'vue';
+  import { useI18n } from 'vue-i18n';
   import useLoading from '@/hooks/loading';
+  import { UserRecord, UserParams } from '@/api/user';
   import { Pagination } from '@/types/global';
   import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
   import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
-  import { useBulletinStore } from '@/store';
+  import { useUserStore } from '@/store';
-  import useTableOption from '@/hooks/table-option';
-  import dayjs from 'dayjs';
-  import { BulletinRecord, BulletinsRecord } from '@/api/bulletin-mgmt';
   import { Message } from '@arco-design/web-vue';
-  import { useRouter } from 'vue-router';
+  import useTableOption from '@/hooks/table-option';
-  import BulletinEdit from './components/bulletin-edit.vue';
+  import NoticeEdit from './components/notice-edit.vue';
 
   const generateFormModel = () => {
     return {
       title: '',
-      state: '',
+      states: '',
       publishTimeBegin: '',
       publishTimeEnd: '',
     };
   };
 
   const { loading, setLoading } = useLoading(true);
-  const renderData = ref<BulletinRecord[]>([]);
+  const { t } = useI18n();
+  const renderData = ref<UserRecord[]>([]);
   const formModel = ref(generateFormModel());
-  const router = useRouter();
+
-  const selectedIds= ref<number[]>([]);
   const {
     cloneColumns,
     showColumns,
     densityList,
-    size,
     handleSelectDensity,
     handleChange,
     popupVisibleChange,
     deepClone,
   } = useTableOption();
+  const sizeof=useTableOption().size;
 
-  const bulletinStore = useBulletinStore();
+  const userStore = useUserStore();
 
   const pagination: Pagination = {
     page: 1,
     size: 10,
     current: 1,
-    total: 0,
+    total: null,
   };
 
   const columns = computed<TableColumnData[]>(() => [
     {
-      title: '#',
+      title: '序号',
-      dataIndex: 'id',
+      dataIndex: 'index',
-      slotName: 'id',
+      slotName: 'index',
       width: 60,
     },
     {
       title: '标题',
       dataIndex: 'title',
+      sortable: {
+        sortDirections: ['ascend', 'descend'],
+      },
     },
     {
-      title: '时间',
+      title: t('时间'),
       dataIndex: 'publishTimeBegin',
-      slotName: 'publishTime',
       sortable: {
         sortDirections: ['ascend', 'descend'],
       },
     },
     {
-      title: '状态',
+      title: t('状态'),
-      dataIndex: 'state',
+      dataIndex: 'states',
-      slotName: 'state',
-      sortable: {
-        sortDirections: ['ascend', 'descend'],
-      },
-    },
-    {
-      title: '置顶',
-      dataIndex: 'top',
-      slotName:'top',
       sortable: {
         sortDirections: ['ascend', 'descend'],
       },
@@ -339,26 +316,22 @@
   ]);
   const statusOptions = computed<SelectOptionData[]>(() => [
     {
-      label: '已发布',
+      label: t('已发布'),
-      value: 'publish',
+      value: 'true',
     },
     {
-      label: '编辑中',
+      label: t('未发布'),
-      value: 'edit',
+      value: 'false',
-    },
-    {
-      label: '已关闭',
-      value: 'close',
     },
   ]);
 
   // 获取公告列表
   const fetchData = async (
-    params = { size: 10, current: 1 }
+    params: UserParams = { page: 1, size: 10, current: 1 }
   ) => {
     setLoading(true);
     try {
-      const res: any = await bulletinStore.queryBulletinList(params);
+      const res = await userStore.getUserList(params);
       renderData.value = res.data.records;
       pagination.page = res.data.page;
       pagination.current = res.data.current;
@@ -376,8 +349,7 @@
     fetchData({
       ...pagination,
       ...formModel.value,
-    } as unknown as BulletinsRecord);
+    } as unknown as UserParams);
-    selectedIds.value = [];
   };
 
   // 分页发生改变
@@ -386,90 +358,53 @@
     pagination.current = current;
     search();
   };
-  // 时间范围
-  const timeRangs = (dateString: string[]) => {
-    // eslint-disable-next-line prefer-destructuring
-    formModel.value.publishTimeBegin = dateString[0];
-    // eslint-disable-next-line prefer-destructuring
-    formModel.value.publishTimeEnd = dateString[1];
-  };
 
   // 数据条数改变
-  const onSizeChange = (Size: number) => {
+  const onSizeChange = (size: number) => {
-    pagination.size = Size;
+    pagination.size = size;
     search();
   };
 
+  search();
 
   // 重置
   const reset = () => {
     formModel.value = generateFormModel();
   };
 
-  // 是否置顶
+  // 表格内部排序
-  const handleSwitchChange = async (record: any) => {
+  const alignLeft = ref(false);
-    record.top = !record.top;
+  const handleSortChange = (data: any, extra: any, currentDataSource: any) => {};
-    const res = await bulletinStore.toggleBulletin(record.id);
+
+  // 是否启用
+  const enabledStatus = async (record: string) => {
+    record.enabled = !record.enabled;
+    const res = await userStore.enabledUser(record.id);
     if (res.status === 200) {
       Message.success({
-        content: '修改置顶成功',
+        content: t('modify.status.sucess'),
         duration: 3 * 1000,
       });
     } else {
       Message.error({
-        content: '修改置顶失败',
+        content: t('modify.status.fail'),
         duration: 3 * 1000,
       });
     }
   };
 
-  // 打开详情
-  function openDetail(id:number): void{
-    const url = router.resolve({
-      name: 'Detail',
-      params: {id}
-    }).href;
-    router.push(url);
-  };
-
-  // 发布公告
-  const publishBulletin = async (data:number[]) => {
-    const res = await bulletinStore.publishBulletin(data);
-    if (res.status === 200) {
-      Message.success({
-        content: '发布成功',
-        duration: 5 * 1000,
-      });
-    }
-    search();
-  };
-
-  // 关闭公告
-  const handleClose = async (id: number) => {
-    const res = await bulletinStore.closeBulletin(id);
-    if (res.status === 200) {
-      Message.success({
-        content: '切换成功',
-        duration: 5 * 1000,
-      });
-    }
-    search();
-  };
-
   // 删除
-  const handleDelete = async (id: number) => {
+  // const handleDelete = async (record: UserRecord) => {
-    const res = await bulletinStore.removeBulletin(id);
+  //   const res = await userStore.removeUser(record.id);
-    if (res.status === 200) {
+  //   if (res.status === 200) {
-      Message.success({
+  //     Message.success({
-        content: '删除成功',
+  //       content: '删除成功',
-        duration: 5 * 1000,
+  //       duration: 5 * 1000,
-      });
+  //     });
-      search();
+  //     search();
-    }
+  //   }
-  };
+  // };
-  onMounted(() => {
+
-    search();
-  });
   watch(() => columns.value, deepClone, { deep: true, immediate: true });
 </script>
 

src/views/system/bulletin/components/bulletin-edit.vue

@@ -1,254 +0,0 @@
-<template>
-  <a-button v-if="props.isCreate" type="primary" @click="handleClick">
-    <template #icon><icon-plus /></template>
-    新建
-  </a-button>
-  <a-button
-    v-if="!props.isCreate"
-    type="outline"
-    size="small"
-    :style="{ marginRight: '10px', padding: '7px' }"
-    @click="handleClick"
-  >
-    <template #icon><icon-edit /></template>
-    修改
-  </a-button>
-
-  <a-modal
-    width="900px"
-    :visible="visible"
-    @cancel="handleCancel"
-  >
-    <template #title>{{ modalTitle }}</template>
-    <a-form ref="CreateRef" :model="formData" :style="{ width: '650px' }">
-      <a-form-item
-        field="title"
-        label='标题'
-        :validate-trigger="['change', 'input']"
-        :rules="[
-          { required: true, message: '请输入标题' },
-        ]"
-      >
-        <a-input
-          v-model="formData.title"
-          placeholder='请输入公告标题'
-        />
-      </a-form-item>
-      <a-form-item
-        field="top"
-        label='置顶'
-        :validate-trigger="['change', 'input']"
-      >
-        <a-switch
-          v-model="formData.top"
-          :checked-value="true"
-          :unchecked-value="false"
-        />
-      </a-form-item>
-      <a-form-item
-        field="remark"
-        label='备注'
-        :validate-trigger="['change', 'input']"
-      >
-        <!--        v-if="isCreate"-->
-        <a-input
-          v-model="formData.remark"
-          placeholder='请输入备注'
-
-        />
-      </a-form-item>
-      <a-form-item
-        label='附件'
-      >
-        <!--        v-if="isCreate"-->
-        <a-upload
-          v-model="formData.attachmentIds"
-          show-file-list
-          :custom-request="customRequest"
-          @before-remove="beforeRemove"
-        >
-          <template #upload-item="{ file }">
-            <div style="display: flex; align-items: center;">
-              <img :src="file.url" alt="上传文件" style="width: 50px; height: 50px; margin-right: 10px;" />
-              <span>{{ file.name }}</span>
-            </div>
-          </template>
-        </a-upload>
-      </a-form-item>
-      <a-form-item field="content" label='内容' :rules="[{ required: true}]">
-        <div style="border: 1px solid #ccc;min-width: 700px">
-          <Toolbar
-            style="border-bottom: 1px solid #ccc"
-            :editor="editorRef"
-            :default-config="toolbarConfig"
-            :mode="mode"
-            :class="{'fullscreen-toolbar': isFullScreen}"
-          />
-          <Editor
-            v-model="formData.content"
-            style="overflow-y: hidden;height: 200px;"
-            :default-config="editorConfig"
-            :mode="mode"
-            @on-created="handleCreated"
-            :class="{'fullscreen-editor': isFullScreen}"
-          />
-        </div>
-        <!--        <a-textarea v-model="formData.content" placeholder="请输入公告内容" style="height: 100px" />-->
-      </a-form-item>
-    </a-form>
-    <template #footer>
-      <a-button @click="handleCancel" style="position: static">取消</a-button>
-      <a-button @click="handleSubmit" style="position: static" type="primary">确定</a-button>
-    </template>
-  </a-modal>
-
-</template>
-
-<script lang="ts" setup>
-import useVisible from '@/hooks/visible';
-import { computed, defineEmits, PropType, ref, shallowRef,onBeforeUnmount } from 'vue';
-import { BulletinCreateRecord } from '@/api/bulletin-mgmt';
-import { FormInstance } from '@arco-design/web-vue/es/form';
-import { Message } from '@arco-design/web-vue';
-import { useBulletinStore } from '@/store';
-import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
-import { IEditorConfig } from '@wangeditor/editor'
-import '@wangeditor/editor/dist/css/style.css'
-
-const props = defineProps({
-  prem: {
-    type: Object as PropType<BulletinCreateRecord>,
-  },
-  isCreate: Boolean,
-});
-const emit = defineEmits(['refresh']);
-const modalTitle = computed(() => {
-  return props.isCreate ? '新增公告' : '编辑公告';
-});
-const { visible, setVisible } = useVisible(false);
-const checkKeys = ref<number[]>([]);
-
-const CreateRef = ref<FormInstance>();
-const formData = ref<any>({
-  ...props.prem,
-  attachmentIds: [],
-});
-const bulletinStore = useBulletinStore();
-const editorRef = shallowRef()
-const isFullScreen = ref(false);
-const mode = 'default';
-const toolbarConfig = { excludeKeys: ['uploadVideo', 'insertImage','insertVideo']}
-const handleCreated = (editor: any) => {
-  editorRef.value = editor; // 记录 editor 实例，重要！
-  // 监听全屏事件
-  editor.on('fullScreen', () => {
-  })
-}
-
-
-
-// 组件被点击
-const handleClick = () => {
-  setVisible(true);
-};
-
-const editorConfig: Partial<IEditorConfig> = { placeholder: '请输入内容...',MENU_CONF:{
-  // 隐藏菜单
-  hide: ['code', 'table', 'emoticon', 'uploadImage', 'video', 'todo', 'specialChar'],
-    // 配置上传图片
-    uploadImage: {
-      base64LimitSize: 1024 * 1024,
-      // server: '/api/rest/bulletin/1/add',
-    }
-  }
-}
-// 提交
-const handleSubmit = async () => {
-  const valid = await CreateRef.value?.validate();
-  if (!valid) {
-    formData.value.permissionIds = checkKeys.value;
-    // 新增
-    if (props.isCreate) {
-      // formData.value.username = formData.value.email;
-      const res = await bulletinStore.createBulletin(formData.value);
-      if (res.status === 200) {
-        Message.success({
-          content: '新建成功',
-          duration: 5 * 1000,
-        });
-        emit('refresh');
-        setVisible(false);
-      }
-      CreateRef.value?.resetFields();
-    } else {
-      // 编辑
-        const res = await bulletinStore.updateBulletin(formData.value);
-        if (res.status === 200) {
-          Message.success({
-            content: '修改成功',
-            duration: 5 * 1000,
-          });
-          emit('refresh');
-          setVisible(false);
-        }
-      }
-    }
-};
-
-// 自定义文件上传
-const customRequest = async (option: any) => {
-  const { fileItem,onSuccess,onError } = option
-  const formDataFile = new FormData();
-  formDataFile.append('file', fileItem.file);
-  formDataFile.append('type', '其他');
-  const res = await bulletinStore.addAttachments(formDataFile);
-  if (res.status === 200) {
-    onSuccess(res.data);
-    console.log(formData.value);
-    formData.value.attachmentIds.push(res.data.id);
-    console.log(formData.value);
-  } else {
-    onError(res.data);
-  }
-}
-
-// 删除附件
-const beforeRemove = async (file: any) => {
-  const res = await bulletinStore.deleteAttachment(file.response.id);
-  return res.status === 200;
-}
-
-// 组件销毁时，也及时销毁编辑器
-onBeforeUnmount(() => {
-  const editor = editorRef.value
-  if (editor == null) return
-  editor.destroy()
-})
-
-// 关闭
-const handleCancel = async () => {
-  checkKeys.value = [];
-  setVisible(false);
-}
-</script>
-
-<style scoped>
-  .fullscreen-toolbar {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 50px; /* 根据需要调整高度 */
-    z-index: 999;
-    background-color: white;
-  }
-  .fullscreen-editor {
-    position: fixed;
-    top: 50px; /* 根据 toolbar 的高度调整 */
-    left: 0;
-    width: 100%;
-    height: calc(100% - 50px); /* 减去 toolbar 的高度 */
-    z-index: 999;
-    background-color: white;
-  }
-</style>

src/views/system/bulletin/components/detail.vue

@@ -1,148 +0,0 @@
-<template>
-  <div class="container">
-    <Breadcrumb :items="['系统管理', '公告设置','公告详情']" />
-    <a-card class="general-card" title=" ">
-      <div class="announcement-detail">
-        <div class="header">
-          <h1>{{ renderData.title }}</h1>
-          <div class="meta">
-            <span>作者: {{ renderData.createBy }}</span>
-            <span
-            >时间: {{ dayjs(renderData.publishTime).format('YYYY-MM-DD') }}</span
-            >
-          </div>
-        </div>
-        <a-divider style="margin-top: 0" />
-        <div v-html="renderData.content" class="content"></div>
-        <div>
-          <ul class="attachments">
-            <li v-for="(item, index) in renderData.attachments" :key="index">
-              <a
-                :href="item.url"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <icon-download />
-                {{ item.fileName }}
-              </a>
-            </li>
-          </ul>
-        </div>
-      </div>
-    </a-card>
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import dayjs from 'dayjs';
-  import { useBulletinStore } from '@/store';
-  import { useRoute } from 'vue-router';
-  import { onMounted, ref } from 'vue';
-
-  const bulletinStore = useBulletinStore();
-  const route = useRoute();
-  const id = Number(route.params.id);
-  const renderData = ref<any>([]);
-  // const attachmentList = ref<any>([]);
-  const fetchData = async (Id: number) => {
-    const res = await bulletinStore.queryBulletinListAll(Id);
-    // attachmentList.value = await bulletinStore.queryAttachmentInfo(
-    //   '28452d83420650425d45110c6417bf693b966b29'
-    // );
-    // eslint-disable-next-line prefer-destructuring
-    renderData.value = res.data;
-  };
-  onMounted(() => {
-    fetchData(id);
-  });
-</script>
-
-
-<style scoped>
-  .container {
-    padding: 0 20px 20px 20px;
-  }
-
-  .announcement-detail {
-    min-width: 800px;
-    max-width: 800px;
-    margin: auto;
-    padding: 20px;
-    border: 1px solid #ddd;
-    background-color: #fff; /* 白色背景，与淡蓝色背景区分开来 */
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-  }
-
-  .header {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-bottom: 20px;
-  }
-  h1 {
-    font-size: 24px;
-    margin-bottom: 10px;
-  }
-
-  .meta {
-    margin-bottom: 20px;
-    color: #777;
-  }
-
-  .meta span {
-    margin-right: 20px;
-  }
-
-  .content {
-    line-height: 1.6;
-  }
-  .attachments li {
-    margin-bottom: 10px;
-  }
-
-  .attachments a {
-    display: flex;
-    align-items: center;
-    font-size: 14px;
-    color: #1890ff;
-    text-decoration: none;
-  }
-
-  .attachments a:hover {
-    text-decoration: underline;
-  }
-
-  .attachments .arco-icon {
-    margin-right: 8px;
-    color: #1890ff;
-  }
-  .layout-demo :deep(.arco-layout-header),
-  .layout-demo :deep(.arco-layout-footer),
-  .layout-demo :deep(.arco-layout-sider-children),
-  .layout-demo :deep(.arco-layout-content) {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    color: var(--color-white);
-    font-size: 16px;
-    font-stretch: condensed;
-    text-align: center;
-  }
-
-  .layout-demo :deep(.arco-layout-header),
-  .layout-demo :deep(.arco-layout-footer) {
-    height: 64px;
-    background-color: var(--color-primary-light-4);
-  }
-
-  .layout-demo :deep(.arco-layout-sider) {
-    width: 206px;
-    background-color: var(--color-primary-light-3);
-  }
-
-  .layout-demo :deep(.arco-layout-content) {
-    background-color: rgb(var(--arcoblue-6));
-  }
-</style>
-
-

src/views/user/bulletins/components/detail.vue

@@ -1,148 +0,0 @@
-<template>
-  <div class="container">
-    <Breadcrumb :items="['个人中心', '公告通知','公告详情']" />
-    <a-card class="general-card" title=" ">
-      <div class="announcement-detail">
-        <div class="header">
-          <h1>{{ renderData.title }}</h1>
-          <div class="meta">
-            <span>作者: {{ renderData.createBy }}</span>
-            <span
-            >时间: {{ dayjs(renderData.publishTime).format('YYYY-MM-DD') }}</span
-            >
-          </div>
-        </div>
-        <a-divider style="margin-top: 0" />
-        <div v-html="renderData.content" class="content"></div>
-        <div>
-          <ul class="attachments">
-            <li v-for="(item, index) in renderData.attachments" :key="index">
-              <a
-                :href="item.url"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <icon-download />
-                {{ item.fileName }}
-              </a>
-            </li>
-          </ul>
-        </div>
-      </div>
-    </a-card>
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import dayjs from 'dayjs';
-  import { useBulletinStore } from '@/store';
-  import { useRoute } from 'vue-router';
-  import { onMounted, ref } from 'vue';
-
-  const bulletinStore = useBulletinStore();
-  const route = useRoute();
-  const id = Number(route.params.id);
-  const renderData = ref<any>([]);
-  // const attachmentList = ref<any>([]);
-  const fetchData = async (Id: number) => {
-    const res = await bulletinStore.queryBulletinListAll(Id);
-    // attachmentList.value = await bulletinStore.queryAttachmentInfo(
-    //   '28452d83420650425d45110c6417bf693b966b29'
-    // );
-    // eslint-disable-next-line prefer-destructuring
-    renderData.value = res.data;
-  };
-  onMounted(() => {
-    fetchData(id);
-  });
-</script>
-
-
-<style scoped>
-  .container {
-    padding: 0 20px 20px 20px;
-  }
-
-  .announcement-detail {
-    min-width: 800px;
-    max-width: 800px;
-    margin: auto;
-    padding: 20px;
-    border: 1px solid #ddd;
-    background-color: #fff; /* 白色背景，与淡蓝色背景区分开来 */
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-  }
-
-  .header {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-bottom: 20px;
-  }
-  h1 {
-    font-size: 24px;
-    margin-bottom: 10px;
-  }
-
-  .meta {
-    margin-bottom: 20px;
-    color: #777;
-  }
-
-  .meta span {
-    margin-right: 20px;
-  }
-
-  .content {
-    line-height: 1.6;
-  }
-  .attachments li {
-    margin-bottom: 10px;
-  }
-
-  .attachments a {
-    display: flex;
-    align-items: center;
-    font-size: 14px;
-    color: #1890ff;
-    text-decoration: none;
-  }
-
-  .attachments a:hover {
-    text-decoration: underline;
-  }
-
-  .attachments .arco-icon {
-    margin-right: 8px;
-    color: #1890ff;
-  }
-  .layout-demo :deep(.arco-layout-header),
-  .layout-demo :deep(.arco-layout-footer),
-  .layout-demo :deep(.arco-layout-sider-children),
-  .layout-demo :deep(.arco-layout-content) {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    color: var(--color-white);
-    font-size: 16px;
-    font-stretch: condensed;
-    text-align: center;
-  }
-
-  .layout-demo :deep(.arco-layout-header),
-  .layout-demo :deep(.arco-layout-footer) {
-    height: 64px;
-    background-color: var(--color-primary-light-4);
-  }
-
-  .layout-demo :deep(.arco-layout-sider) {
-    width: 206px;
-    background-color: var(--color-primary-light-3);
-  }
-
-  .layout-demo :deep(.arco-layout-content) {
-    background-color: rgb(var(--arcoblue-6));
-  }
-</style>
-
-