添加内容管理页面

src/api/sys/content.ts

@@ -0,0 +1,141 @@
+import { defHttp } from '/@/utils/http/axios';
+import {
+  GetContentListModel,
+  DeleteBatchesParams,
+  ContentIdParams,
+  AddContentParams,
+  EditContentParams,
+  GetContentModel,
+  GetCategoryListModel,
+  CategoryIdParams,
+  AddCategoryParams,
+  EditCategoryParams,
+  GetCategoryModel,
+} from './model/contentModel';
+
+enum Api {
+  ContentUrl = '/content/',
+  CategoryUrl = '/content/category/',
+}
+
+/**
+ * @description: GetContentList
+ */
+export function getContentList(params) {
+  return defHttp.request<GetContentListModel>({
+    url: Api.ContentUrl,
+    method: 'GET',
+    params,
+  });
+}
+
+/**
+ * @description: addContent
+ */
+export function addContent(params: AddContentParams) {
+  return defHttp.request<GetContentListModel>({
+    url: Api.ContentUrl,
+    method: 'POST',
+    params,
+  });
+}
+/**
+ * @description: 批量删除内容
+ */
+export function deleteBatchesContent(params: DeleteBatchesParams) {
+  return defHttp.request<GetContentListModel>({
+    url: Api.ContentUrl,
+    method: 'DELETE',
+    params,
+  });
+}
+
+/**
+ * @description: 获取单个内容
+ */
+export function getContent(params: ContentIdParams) {
+  return defHttp.request<GetContentModel>({
+    url: Api.ContentUrl + params.id,
+    method: 'GET',
+  });
+}
+/**
+ * @description: 修改单个内容
+ */
+export function editContent(params: EditContentParams) {
+  return defHttp.request<GetContentListModel>({
+    url: Api.ContentUrl + params.id,
+    method: 'PUT',
+    params,
+  });
+}
+/**
+ * @description: 删除单个内容
+ */
+export function deleteContent(params: ContentIdParams) {
+  return defHttp.request<GetContentListModel>({
+    url: Api.ContentUrl + params.id,
+    method: 'DELETE',
+  });
+}
+// -------------------------------分类------------------------------------
+/**
+ * @description: 获取分类列表
+ */
+export function getCategoryList(params) {
+  return defHttp.request<GetCategoryListModel>({
+    url: Api.CategoryUrl,
+    method: 'GET',
+    params,
+  });
+}
+
+/**
+ * @description: addCategory
+ */
+export function addCategory(params: AddCategoryParams) {
+  return defHttp.request<GetCategoryListModel>({
+    url: Api.CategoryUrl,
+    method: 'POST',
+    params,
+  });
+}
+/**
+ * @description: 批量删除分类
+ */
+export function deleteBatchesCategory(params: DeleteBatchesParams) {
+  return defHttp.request<GetCategoryListModel>({
+    url: Api.CategoryUrl,
+    method: 'DELETE',
+    params,
+  });
+}
+
+/**
+ * @description: 获取单个分类
+ */
+export function getCategory(params: CategoryIdParams) {
+  return defHttp.request<GetCategoryModel>({
+    url: Api.CategoryUrl + params.id,
+    method: 'GET',
+  });
+}
+/**
+ * @description: 修改单个分类
+ */
+export function editCategory(params: EditCategoryParams) {
+  return defHttp.request<GetCategoryListModel>({
+    url: Api.CategoryUrl + params.id,
+    method: 'PUT',
+    params,
+  });
+}
+/**
+ * @description: 删除单个分类
+ */
+export function deleteCategory(params: CategoryIdParams) {
+  return defHttp.request<GetCategoryListModel>({
+    url: Api.CategoryUrl + params.id,
+    method: 'DELETE',
+  });
+}

src/api/sys/model/contentModel.ts

@@ -0,0 +1,115 @@
+/**
+ * @description: Get Content list
+ */
+export interface GetContentListModel {
+  count: number;
+  list: object[];
+}
+
+/**
+ * @description: id
+ */
+export interface ContentIdParams {
+  id: string | number;
+}
+/**
+ * @description: id
+ */
+export interface GetContentModel {
+  row: object[];
+}
+
+/**
+ * @description: add Content
+ */
+export interface AddContentParams {
+  id: number;
+}
+/**
+ * @description: edit Content
+ */
+export interface EditContentParams {
+  id: number;
+}
+
+/**
+ * @description: Get Notice list
+ */
+export interface GetNoticeListModel {
+  count: number;
+  list: object[];
+}
+
+/**
+ * @description: Get event information return value
+ */
+export interface DeleteBatchesParams {
+  ids: string | string[] | number[];
+}
+
+/**
+ * @description: id
+ */
+export interface NoticeIdParams {
+  id: string | number;
+}
+/**
+ * @description: id
+ */
+export interface GetNoticeModel {
+  row: object[];
+}
+
+/**
+ * @description: add Notice
+ */
+export interface AddNoticeParams {
+  id: number;
+}
+/**
+ * @description: edit Notice
+ */
+export interface EditNoticeParams {
+  id: number;
+}
+
+/**
+ * @description: Get Category list
+ */
+export interface GetCategoryListModel {
+  count: number;
+  list: object[];
+}
+
+/**
+ * @description: Get event information return value
+ */
+export interface DeleteBatchesParams {
+  ids: string | string[] | number[];
+}
+
+/**
+ * @description: id
+ */
+export interface CategoryIdParams {
+  id: string | number;
+}
+/**
+ * @description: id
+ */
+export interface GetCategoryModel {
+  row: object[];
+}
+
+/**
+ * @description: add Category
+ */
+export interface AddCategoryParams {
+  id: number;
+}
+/**
+ * @description: edit Category
+ */
+export interface EditCategoryParams {
+  id: number;
+}

src/api/sys/model/newsModel.ts

@@ -1,74 +0,0 @@
-/**
- * @description: Get News list
- */
-export interface GetNewsListModel {
-  count: number;
-  list: object[];
-}
-
-/**
- * @description: id
- */
-export interface NewsIdParams {
-  id: string | number;
-}
-/**
- * @description: id
- */
-export interface GetNewsModel {
-  row: object[];
-}
-
-/**
- * @description: add News
- */
-export interface AddNewsParams {
-  id: number;
-}
-/**
- * @description: edit News
- */
-export interface EditNewsParams {
-  id: number;
-}
-
-/**
- * @description: Get Notice list
- */
-export interface GetNoticeListModel {
-  count: number;
-  list: object[];
-}
-
-/**
- * @description: Get event information return value
- */
-export interface DeleteBatchesParams {
-  ids: string | string[] | number[];
-}
-
-/**
- * @description: id
- */
-export interface NoticeIdParams {
-  id: string | number;
-}
-/**
- * @description: id
- */
-export interface GetNoticeModel {
-  row: object[];
-}
-
-/**
- * @description: add Notice
- */
-export interface AddNoticeParams {
-  id: number;
-}
-/**
- * @description: edit Notice
- */
-export interface EditNoticeParams {
-  id: number;
-}

src/api/sys/news.ts

@@ -1,142 +0,0 @@
-import { defHttp } from '/@/utils/http/axios';
-import {
-  GetNewsListModel,
-  DeleteBatchesParams,
-  NewsIdParams,
-  AddNewsParams,
-  EditNewsParams,
-  GetNewsModel,
-  GetNoticeListModel,
-  NoticeIdParams,
-  AddNoticeParams,
-  EditNoticeParams,
-  GetNoticeModel,
-} from './model/newsModel';
-
-enum Api {
-  NewsUrl = '/news/',
-  NoticeUrl = '/news/notice/',
-}
-
-/**
- * @description: GetNewsList
- */
-export function getNewsList(params) {
-  return defHttp.request<GetNewsListModel>({
-    url: Api.NewsUrl,
-    method: 'GET',
-    params,
-  });
-}
-
-/**
- * @description: addNews
- */
-export function addNews(params: AddNewsParams) {
-  return defHttp.request<GetNewsListModel>({
-    url: Api.NewsUrl,
-    method: 'POST',
-    params,
-  });
-}
-/**
- * @description: 批量删除新闻
- */
-export function deleteBatchesNews(params: DeleteBatchesParams) {
-  return defHttp.request<GetNewsListModel>({
-    url: Api.NewsUrl,
-    method: 'DELETE',
-    params,
-  });
-}
-
-/**
- * @description: 获取单个新闻
- */
-export function getNews(params: NewsIdParams) {
-  return defHttp.request<GetNewsModel>({
-    url: Api.NewsUrl + params.id,
-    method: 'GET',
-  });
-}
-/**
- * @description: 修改单个新闻
- */
-export function editNews(params: EditNewsParams) {
-  return defHttp.request<GetNewsListModel>({
-    url: Api.NewsUrl + params.id,
-    method: 'PUT',
-    params,
-  });
-}
-/**
- * @description: 删除单个新闻
- */
-export function deleteNews(params: NewsIdParams) {
-  return defHttp.request<GetNewsListModel>({
-    url: Api.NewsUrl + params.id,
-    method: 'DELETE',
-  });
-}
-
-// -------------------------------公告------------------------------------
-/**
- * @description: 获取公告列表
- */
-export function getNoticeList(params) {
-  return defHttp.request<GetNoticeListModel>({
-    url: Api.NoticeUrl,
-    method: 'GET',
-    params,
-  });
-}
-
-/**
- * @description: addNotice
- */
-export function addNotice(params: AddNoticeParams) {
-  return defHttp.request<GetNoticeListModel>({
-    url: Api.NoticeUrl,
-    method: 'POST',
-    params,
-  });
-}
-/**
- * @description: 批量删除公告
- */
-export function deleteBatchesNotice(params: DeleteBatchesParams) {
-  return defHttp.request<GetNoticeListModel>({
-    url: Api.NoticeUrl,
-    method: 'DELETE',
-    params,
-  });
-}
-
-/**
- * @description: 获取单个公告
- */
-export function getNotice(params: NoticeIdParams) {
-  return defHttp.request<GetNoticeModel>({
-    url: Api.NoticeUrl + params.id,
-    method: 'GET',
-  });
-}
-/**
- * @description: 修改单个公告
- */
-export function editNotice(params: EditNoticeParams) {
-  return defHttp.request<GetNoticeListModel>({
-    url: Api.NoticeUrl + params.id,
-    method: 'PUT',
-    params,
-  });
-}
-/**
- * @description: 删除单个公告
- */
-export function deleteNotice(params: NoticeIdParams) {
-  return defHttp.request<GetNoticeListModel>({
-    url: Api.NoticeUrl + params.id,
-    method: 'DELETE',
-  });
-}

src/components/Form/src/components/ApiSelect.vue

@@ -108,7 +108,8 @@
 
         try {
           loading.value = true;
-          const res = await api(props.params);
+          const result: any = await api(props.params);
+          const res = result.list;
           if (Array.isArray(res)) {
             options.value = res;
             emitChange();

src/views/news/news/data.ts → src/views/content/category/data.ts

@@ -1,10 +1,8 @@
 import { FormProps, BasicColumn } from '/@/components/Table';
-import { h } from 'vue';
 // import { Tag } from 'ant-design-vue';
 import { formatToDate } from '/@/utils/dateUtil';
 import { FormSchema } from '/@/components/Form/index';
 import { adapt } from '/@/utils/adapt';
-import { Tinymce } from '/@/components/Tinymce/index';
 
 const adaptWidth = adapt();
 
@@ -22,14 +20,14 @@ export const columns: BasicColumn[] = [
     sorter: true,
   },
   {
-    title: '标题',
-    dataIndex: 'title',
+    title: '分类名称',
+    dataIndex: 'name',
     width: 130,
     sorter: true,
   },
   {
-    title: '分类',
-    dataIndex: 'type',
+    title: '分类描述',
+    dataIndex: 'description',
     width: 150,
     sorter: true,
   },
@@ -67,17 +65,8 @@ export function getFormConfig(): Partial<FormProps> {
         },
       },
       {
-        field: `title`,
-        label: `标题`,
-        component: 'Input',
-        colProps: {
-          xl: 12,
-          xxl: 8,
-        },
-      },
-      {
-        field: `type`,
-        label: `分类`,
+        field: `name`,
+        label: `分类名称`,
         component: 'Input',
         colProps: {
           xl: 12,
@@ -91,9 +80,9 @@ export function getFormConfig(): Partial<FormProps> {
 // =================popup================================
 export const schemas: FormSchema[] = [
   {
-    field: 'title',
+    field: 'name',
     component: 'Input',
-    label: '标题',
+    label: '分类名称',
     labelWidth: adaptWidth.adminLabelWidth,
     colProps: {
       span: adaptWidth.elContainer,
@@ -101,31 +90,12 @@ export const schemas: FormSchema[] = [
     required: true,
   },
   {
-    field: 'type',
-    component: 'Input',
-    label: '分类',
+    field: 'description',
+    component: 'InputTextArea',
+    label: '分类描述',
     labelWidth: adaptWidth.adminLabelWidth,
     colProps: {
       span: adaptWidth.elContainer,
     },
-    required: true,
-  },
-  {
-    field: 'content',
-    component: 'Input',
-    label: '内容',
-    labelWidth: adaptWidth.adminLabelWidth,
-    colProps: {
-      span: adaptWidth.elContainer,
-    },
-    render: ({ model, field }) => {
-      return h(Tinymce, {
-        value: model[field],
-        onChange: (value: string) => {
-          model[field] = value;
-        },
-      });
-    },
-    required: true,
   },
 ];

src/views/news/type/index.vue → src/views/content/category/index.vue

@@ -43,8 +43,14 @@
   import { Modal } from 'ant-design-vue';
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
   import { getFormConfig, columns } from './data';
-  import moment from 'moment';
-  import { getNewsList, addNews, editNews, deleteNews, deleteBatchesNews } from '/@/api/sys/news';
+  import {
+    getCategory,
+    getCategoryList,
+    addCategory,
+    editCategory,
+    deleteCategory,
+    deleteBatchesCategory,
+  } from '/@/api/sys/content';
   import {
     BasicTable,
     useTable,
@@ -62,11 +68,11 @@
   }
 
   export default defineComponent({
-    name: 'NewsType',
+    name: 'Category',
     components: { CollapseContainer, BasicTable, TableAction, Popup },
     setup() {
       const { createMessage } = useMessage();
-      const { success, error } = createMessage;
+      const { success } = createMessage;
       const tableRef = ref<Nullable<TableActionType>>(null);
       const currentEditKeyRef = ref('');
       const popupData = reactive<PopupData>({
@@ -80,8 +86,7 @@
           type: 'checkbox',
         },
         columns: columns,
-        // clickToRowSelect: false, // 点击行不勾选
-        api: getNewsList,
+        api: getCategoryList,
         useSearchForm: true,
         beforeFetch: beforeFetch,
         afterFetch: afterFetch,
@@ -133,6 +138,7 @@
         delete params.pageSize;
       }
 
+      // 接口列表
       function afterFetch(result) {
         console.log(`result`, result);
       }
@@ -145,19 +151,15 @@
       function handleEdit(record: EditRecordRow) {
         currentEditKeyRef.value = record.id; // record.key
         popupData.title = '编辑';
-        const data = getTableAction().getDataSource();
-        data.map((item) => {
-          if (item.id === record.id) {
-            record = item;
-          }
+        getCategory({ id: record.id }).then((res) => {
+          const data = res.row;
+          openPopup(true, data);
         });
-        openPopup(true, record);
       }
 
       async function handleDelete(record: Recordable) {
         console.log(record);
-        await deleteNews({ id: record.id }).then((res) => {
-          console.log(res);
+        await deleteCategory({ id: record.id }).then(() => {
           getTableAction().reload();
           success('删除成功!');
         });
@@ -196,7 +198,7 @@
           cancelText: '取消',
           maskClosable: true,
           async onOk() {
-            await deleteBatchesNews({ ids }).then((res) => {
+            await deleteBatchesCategory({ ids }).then((res) => {
               console.log(res);
               getTableAction().reload();
               success('删除成功!');
@@ -213,7 +215,7 @@
         const data = params.data;
         const closeModel = params.closeModal;
         if (!data.id) {
-          await addNews(data).then((res) => {
+          await addCategory(data).then((res) => {
             console.log(res);
             getTableAction().reload();
             closeModel();
@@ -221,7 +223,7 @@
           });
           console.log('----------add---');
         } else {
-          await editNews(data).then((res) => {
+          await editCategory(data).then((res) => {
             console.log(res);
             getTableAction().reload();
             closeModel();

src/views/news/type/data.ts → src/views/content/content/data.ts

@@ -1,10 +1,12 @@
 import { FormProps, BasicColumn } from '/@/components/Table';
 import { h } from 'vue';
 // import { Tag } from 'ant-design-vue';
+import UploadFile from '/@/views/general/config/customComponents/UploadFile.vue';
 import { formatToDate } from '/@/utils/dateUtil';
 import { FormSchema } from '/@/components/Form/index';
 import { adapt } from '/@/utils/adapt';
 import { Tinymce } from '/@/components/Tinymce/index';
+import { getCategoryList } from '/@/api/sys/content';
 
 const adaptWidth = adapt();
 
@@ -29,7 +31,7 @@ export const columns: BasicColumn[] = [
   },
   {
     title: '分类',
-    dataIndex: 'type',
+    dataIndex: 'category',
     width: 150,
     sorter: true,
   },
@@ -76,7 +78,7 @@ export function getFormConfig(): Partial<FormProps> {
         },
       },
       {
-        field: `type`,
+        field: `category`,
         label: `分类`,
         component: 'Input',
         colProps: {
@@ -101,13 +103,18 @@ export const schemas: FormSchema[] = [
     required: true,
   },
   {
-    field: 'type',
-    component: 'Input',
+    field: 'category',
+    component: 'ApiSelect',
     label: '分类',
     labelWidth: adaptWidth.adminLabelWidth,
     colProps: {
       span: adaptWidth.elContainer,
     },
+    componentProps: {
+      api: getCategoryList,
+      labelField: 'name',
+      valueField: 'id',
+    },
     required: true,
   },
   {
@@ -126,6 +133,26 @@ export const schemas: FormSchema[] = [
         },
       });
     },
+    defaultValue: '',
     required: true,
   },
+  {
+    field: 'attachment',
+    component: 'Select',
+    label: '附件',
+    labelWidth: adaptWidth.labelWidth,
+    colProps: {
+      span: adaptWidth.elContainer,
+    },
+    render: ({ model, field }) => {
+      return h(UploadFile, {
+        value: model.attachment,
+        type: 'files',
+        style: { width: '100%' },
+        onChange(value) {
+          model[field] = value;
+        },
+      });
+    },
+  },
 ];

src/views/news/news/index.vue → src/views/content/content/index.vue

@@ -5,6 +5,16 @@
     :canExpan="false"
     helpMessage="新闻管理"
   >
+    <a-button
+      v-for="tab in tabs"
+      :key="tab.id"
+      type="default"
+      class="mr-2"
+      :id="current_tab.id === tab.id ? 'current-btn' : ''"
+      @click="handleTab(tab)"
+    >
+      {{ tab.name }}
+    </a-button>
     <BasicTable
       ref="tableRef"
       @register="registerTable"
@@ -44,7 +54,15 @@
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
   import { getFormConfig, columns } from './data';
   // import moment from 'moment';
-  import { getNewsList, addNews, editNews, deleteNews, deleteBatchesNews } from '/@/api/sys/news';
+  import {
+    getCategoryList,
+    getContentList,
+    getContent,
+    addContent,
+    editContent,
+    deleteContent,
+    deleteBatchesContent,
+  } from '/@/api/sys/content';
   import {
     BasicTable,
     useTable,
@@ -57,12 +75,9 @@
   interface PopupData {
     title: string;
   }
-  interface Btn {
-    disable_btn: boolean;
-  }
 
   export default defineComponent({
-    name: 'News',
+    name: 'Content',
     components: { CollapseContainer, BasicTable, TableAction, Popup },
     setup() {
       const { createMessage } = useMessage();
@@ -72,7 +87,9 @@
       const popupData = reactive<PopupData>({
         title: '',
       });
-      const btn = reactive<Btn>({
+      const state = reactive({
+        tabs: [] as object[],
+        current_tab: { id: 0, name: '' },
         disable_btn: true,
       });
       const [registerTable] = useTable({
@@ -81,7 +98,7 @@
         },
         columns: columns,
         // clickToRowSelect: false, // 点击行不勾选
-        api: getNewsList,
+        api: getContentList,
         useSearchForm: true,
         beforeFetch: beforeFetch,
         afterFetch: afterFetch,
@@ -109,6 +126,7 @@
         }
         return tableAction;
       }
+      renderTab();
 
       // 请求之前处理
       function beforeFetch(params) {
@@ -125,7 +143,6 @@
             }
           }
         }
-        params.filter = JSON.stringify(params.filter);
         params.offset = params.page;
         params.limit = params.pageSize;
         delete params.page;
@@ -133,7 +150,21 @@
       }
 
       function afterFetch(result) {
-        console.log(`result`, result);
+        if (state.current_tab.id && state.current_tab.name) {
+          const list: any[] = [];
+          result.map((item) => {
+            if (item.category === state.current_tab.name) {
+              list.push(item);
+            }
+          });
+          return list;
+        }
+      }
+      function renderTab() {
+        getCategoryList({}).then((res) => {
+          state.tabs = res.list;
+          state.tabs.unshift({ id: 0, name: '全部' });
+        });
       }
 
       function addRole() {
@@ -144,19 +175,19 @@
       function handleEdit(record: EditRecordRow) {
         currentEditKeyRef.value = record.id; // record.key
         popupData.title = '编辑';
-        const data = getTableAction().getDataSource();
-        data.map((item) => {
-          if (item.id === record.id) {
-            record = item;
-          }
+        getContent({ id: record.id }).then((res) => {
+          const data = res.row;
+          openPopup(true, data);
         });
-        openPopup(true, record);
+      }
+
+      function handleTab(tab) {
+        state.current_tab = tab;
+        getTableAction().reload();
       }
 
       async function handleDelete(record: Recordable) {
-        console.log(record);
-        await deleteNews({ id: record.id }).then((res) => {
-          console.log(res);
+        await deleteContent({ id: record.id }).then(() => {
           getTableAction().reload();
           success('删除成功!');
         });
@@ -165,17 +196,17 @@
       function selectionChange() {
         const keys = getTableAction().getSelectRowKeys();
         if (keys.length) {
-          btn.disable_btn = false;
+          state.disable_btn = false;
         } else {
-          btn.disable_btn = true;
+          state.disable_btn = true;
         }
       }
       function rowClick() {
         const keys = getTableAction().getSelectRowKeys();
         if (keys.length) {
-          btn.disable_btn = false;
+          state.disable_btn = false;
         } else {
-          btn.disable_btn = true;
+          state.disable_btn = true;
         }
       }
 
@@ -195,8 +226,7 @@
           cancelText: '取消',
           maskClosable: true,
           async onOk() {
-            await deleteBatchesNews({ ids }).then((res) => {
-              console.log(res);
+            await deleteBatchesContent({ ids }).then(() => {
               getTableAction().reload();
               success('删除成功!');
               getTableAction().setSelectedRowKeys([]);
@@ -212,7 +242,7 @@
         const data = params.data;
         const closeModel = params.closeModal;
         if (!data.id) {
-          await addNews(data).then((res) => {
+          await addContent(data).then((res) => {
             console.log(res);
             getTableAction().reload();
             closeModel();
@@ -220,7 +250,7 @@
           });
           console.log('----------add---');
         } else {
-          await editNews(data).then((res) => {
+          await editContent(data).then((res) => {
             console.log(res);
             getTableAction().reload();
             closeModel();
@@ -252,6 +282,7 @@
       return {
         popupData,
         tableRef,
+        handleTab,
         registerTable,
         addRole,
         handleEdit,
@@ -262,7 +293,7 @@
         selectionChange,
         addRegister,
         saveData,
-        ...toRefs(btn),
+        ...toRefs(state),
       };
     },
   });
@@ -271,6 +302,10 @@
   .ant-calendar-picker {
     width: 100%;
   }
+  #current-btn {
+    color: #3785cc;
+    border: 1px solid #3785cc;
+  }
   @media (max-width: 639px) {
     .sys-container .vben-basic-table-header__toolbar > * {
       margin-right: 3px;

src/views/news/news/popup.vue → src/views/content/content/popup.vue

@@ -40,10 +40,9 @@
         id: 0,
       });
       const popupData = props.popupData as PopupData;
-      console.log(`popupData`, popupData);
       const modelRef = ref({});
 
-      const [registerForm, { updateSchema, setFieldsValue, resetFields, validate }] = useForm({
+      const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
         labelWidth: 120,
         schemas,
         showActionButtonGroup: false,
@@ -55,16 +54,10 @@
         resetFields();
         if (data) {
           role.id = data.id;
-          updateSchema({
-            field: 'password',
-            required: false,
-          });
         } else {
           role.id = 0;
-          updateSchema({
-            field: 'password',
-            required: true,
-          });
+          data.content = '';
+          data.attachment = '';
         }
         setFieldsValue(data);
       });

src/views/general/config/index.vue

@@ -10,7 +10,7 @@
       :key="index"
       type="default"
       class="mr-2"
-      :class="current_index === index ? 'current-btn' : ''"
+      :id="current_index === index ? 'current-btn' : 'static-btn'"
       @click="handleGroupBtn(group, index)"
     >
       {{ group }}
@@ -187,8 +187,6 @@
           data.map((item) => {
             if (item.type === 'array') {
               params[item.name] = JSON.stringify(item.value);
-              console.log(`item`, item);
-              console.log(`item.value`, item.value);
             } else {
               if (item.type === 'selects' || item.type === 'checkbox') {
                 params[item.name] = item.value.toString();
@@ -289,8 +287,8 @@
     bottom: 0 !important;
   }
 
-  /* .current-btn {
+  #current-btn {
     color: #3785cc;
     border: 1px solid #3785cc;
-  } */
+  }
 </style>

src/views/news/notice/data.ts

@@ -1,131 +0,0 @@
-import { FormProps, BasicColumn } from '/@/components/Table';
-import { h } from 'vue';
-// import { Tag } from 'ant-design-vue';
-import { formatToDate } from '/@/utils/dateUtil';
-import { FormSchema } from '/@/components/Form/index';
-import { adapt } from '/@/utils/adapt';
-import { Tinymce } from '/@/components/Tinymce/index';
-
-const adaptWidth = adapt();
-
-// const isDir = (type: string) => type === '0';
-// const isMenu = (type: string) => type === '1';
-// const isButton = (type: string) => type === '2';
-export const columns: BasicColumn[] = [
-  {
-    title: 'ID',
-    dataIndex: 'id',
-    editComponentProps: {
-      prefix: '$',
-    },
-    width: 100,
-    sorter: true,
-  },
-  {
-    title: '标题',
-    dataIndex: 'title',
-    width: 130,
-    sorter: true,
-  },
-  {
-    title: '分类',
-    dataIndex: 'type',
-    width: 150,
-    sorter: true,
-  },
-  {
-    title: '创建时间',
-    dataIndex: 'createtime',
-    width: 200,
-    customRender: ({ record }) => {
-      const createtime = record.createtime;
-      return formatToDate(createtime * 1000);
-    },
-  },
-  {
-    title: '更新时间',
-    dataIndex: 'updatetime',
-    width: 200,
-    customRender: ({ record }) => {
-      const updatetime = record.updatetime;
-      return formatToDate(updatetime * 1000);
-    },
-  },
-];
-
-export function getFormConfig(): Partial<FormProps> {
-  return {
-    labelWidth: 100,
-    schemas: [
-      {
-        field: `id`,
-        label: `ID`,
-        component: 'Input',
-        colProps: {
-          xl: 12,
-          xxl: 8,
-        },
-      },
-      {
-        field: `title`,
-        label: `标题`,
-        component: 'Input',
-        colProps: {
-          xl: 12,
-          xxl: 8,
-        },
-      },
-      {
-        field: `type`,
-        label: `分类`,
-        component: 'Input',
-        colProps: {
-          xl: 12,
-          xxl: 8,
-        },
-      },
-    ],
-  };
-}
-
-// =================popup================================
-export const schemas: FormSchema[] = [
-  {
-    field: 'title',
-    component: 'Input',
-    label: '标题',
-    labelWidth: adaptWidth.adminLabelWidth,
-    colProps: {
-      span: adaptWidth.elContainer,
-    },
-    required: true,
-  },
-  {
-    field: 'type',
-    component: 'Input',
-    label: '分类',
-    labelWidth: adaptWidth.adminLabelWidth,
-    colProps: {
-      span: adaptWidth.elContainer,
-    },
-    required: true,
-  },
-  {
-    field: 'content',
-    component: 'Input',
-    label: '内容',
-    labelWidth: adaptWidth.adminLabelWidth,
-    colProps: {
-      span: adaptWidth.elContainer,
-    },
-    render: ({ model, field }) => {
-      return h(Tinymce, {
-        value: model[field],
-        onChange: (value: string) => {
-          model[field] = value;
-        },
-      });
-    },
-    required: true,
-  },
-];

src/views/news/notice/index.vue

@@ -1,295 +0,0 @@
-<template>
-  <CollapseContainer
-    class="sys-container"
-    title="公告管理"
-    :canExpan="false"
-    helpMessage="公告管理"
-  >
-    <BasicTable
-      ref="tableRef"
-      @register="registerTable"
-      rowKey="id"
-      @selectionChange="selectionChange"
-      @rowClick="rowClick"
-      @rowDbClick="handleEdit"
-      showTableSetting
-      :canResize="true"
-      :pagination="{
-        pageSize: 10,
-        defaultPageSize: 10,
-        showSizeChanger: false,
-      }"
-    >
-      <template #toolbar>
-        <div class="tool-btn-wrap">
-          <a-button type="primary" @click="addRole">添加</a-button>
-          <a-button color="error" :disabled="disable_btn" @click="deleteBatches">删除</a-button>
-        </div>
-      </template>
-      <template #form-custom>custom-slot</template>
-      <template #action="{ record }">
-        <TableAction :actions="createActions(record)" stopButtonPropagation />
-      </template>
-    </BasicTable>
-    <Popup @register="addRegister" :popupData="popupData" @saveData="saveData" />
-  </CollapseContainer>
-</template>
-<script lang="ts">
-  import { defineComponent, reactive, ref, toRefs, unref, createVNode } from 'vue';
-  import { CollapseContainer } from '/@/components/Container/index';
-  import Popup from './popup.vue';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import { useModal } from '/@/components/Modal';
-  import { Modal } from 'ant-design-vue';
-  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
-  import { getFormConfig, columns } from './data';
-  import moment from 'moment';
-  import { getNoticeList, addNotice, editNotice, deleteNotice, deleteBatchesNotice } from '/@/api/sys/news';
-  import {
-    BasicTable,
-    useTable,
-    TableAction,
-    ActionItem,
-    EditRecordRow,
-    TableActionType,
-  } from '/@/components/Table';
-
-  interface PopupData {
-    title: string;
-  }
-  interface Btn {
-    disable_btn: boolean;
-  }
-
-  export default defineComponent({
-    name: 'Notice',
-    components: { CollapseContainer, BasicTable, TableAction, Popup },
-    setup() {
-      const { createMessage } = useMessage();
-      const { success, error } = createMessage;
-      const tableRef = ref<Nullable<TableActionType>>(null);
-      const currentEditKeyRef = ref('');
-      const popupData = reactive<PopupData>({
-        title: '添加',
-      });
-      const btn = reactive<Btn>({
-        disable_btn: true,
-      });
-      const [registerTable] = useTable({
-        rowSelection: {
-          type: 'checkbox',
-        },
-        columns: columns,
-        // clickToRowSelect: false, // 点击行不勾选
-        api: getNoticeList,
-        useSearchForm: true,
-        beforeFetch: beforeFetch,
-        afterFetch: afterFetch,
-        formConfig: getFormConfig(),
-        actionColumn: {
-          width: 160,
-          title: '操作',
-          dataIndex: 'action',
-          slots: { customRender: 'action' },
-          fixed: undefined,
-        },
-        tableSetting: {
-          // redo: false,
-          size: false,
-        },
-        showIndexColumn: false,
-        bordered: true,
-      });
-      const [register, { openModal }] = useModal();
-      const [addRegister, { openModal: openPopup }] = useModal();
-      function getTableAction() {
-        // 获取组件
-        const tableAction = unref(tableRef);
-        if (!tableAction) {
-          throw new Error('tableAction is null');
-        }
-        return tableAction;
-      }
-
-      // 请求之前处理
-      function beforeFetch(params) {
-        for (let k in params) {
-          if (k !== 'page' && k !== 'pageSize' && k !== 'field' && k !== 'order') {
-            if (params[k] === '') {
-              delete params[k];
-            } else {
-              if (!params.filter) {
-                params.filter = {};
-              }
-              params.filter[k] = params[k];
-              delete params[k];
-            }
-          }
-        }
-        params.filter = JSON.stringify(params.filter);
-        params.offset = params.page;
-        params.limit = params.pageSize;
-        delete params.page;
-        delete params.pageSize;
-      }
-
-      function afterFetch(result) {
-        console.log(`result`, result);
-      }
-
-      function addRole() {
-        popupData.title = '添加';
-        openPopup(true, {});
-      }
-
-      function handleEdit(record: EditRecordRow) {
-        currentEditKeyRef.value = record.id; // record.key
-        popupData.title = '编辑';
-        const data = getTableAction().getDataSource();
-        data.map((item) => {
-          if (item.id === record.id) {
-            record = item;
-          }
-        });
-        openPopup(true, record);
-      }
-
-      async function handleDelete(record: Recordable) {
-        console.log(record);
-        await deleteNotice({ id: record.id }).then((res) => {
-          console.log(res);
-          getTableAction().reload();
-          success('删除成功!');
-        });
-      }
-
-      function selectionChange() {
-        const keys = getTableAction().getSelectRowKeys();
-        if (keys.length) {
-          btn.disable_btn = false;
-        } else {
-          btn.disable_btn = true;
-        }
-      }
-      function rowClick() {
-        const keys = getTableAction().getSelectRowKeys();
-        if (keys.length) {
-          btn.disable_btn = false;
-        } else {
-          btn.disable_btn = true;
-        }
-      }
-
-      async function deleteBatches() {
-        const keys = await getTableAction().getSelectRowKeys();
-        const count = keys.length;
-        const ids = keys.toString();
-        if (!ids) {
-          return;
-        }
-        Modal.confirm({
-          title: '删除提示',
-          icon: createVNode(ExclamationCircleOutlined),
-          content: '确定删除选中的' + count + '项?',
-          okText: '确定',
-          okType: 'danger',
-          cancelText: '取消',
-          maskClosable: true,
-          async onOk() {
-            await deleteBatchesNotice({ ids }).then((res) => {
-              console.log(res);
-              getTableAction().reload();
-              success('删除成功!');
-              getTableAction().setSelectedRowKeys([]);
-            });
-          },
-          onCancel() {
-            console.log('Cancel');
-          },
-        });
-      }
-
-      async function saveData(params: any) {
-        const data = params.data;
-        const closeModel = params.closeModal;
-        if (!data.id) {
-          await addNotice(data).then((res) => {
-            console.log(res);
-            getTableAction().reload();
-            closeModel();
-            success('创建成功!');
-          });
-          console.log('----------add---');
-        } else {
-          await editNotice(data).then((res) => {
-            console.log(res);
-            getTableAction().reload();
-            closeModel();
-            success('修改成功!');
-          });
-          console.log('----------edit---');
-        }
-      }
-
-      function createActions(record: EditRecordRow): ActionItem[] {
-        return [
-          {
-            label: '编辑',
-            icon: 'ant-design:edit-outlined',
-            color: 'warning',
-            onClick: handleEdit.bind(null, record),
-          },
-          {
-            label: '删除',
-            color: 'error',
-            icon: 'ic:outline-delete-outline',
-            popConfirm: {
-              title: '是否确认删除',
-              confirm: handleDelete.bind(null, record),
-            },
-          },
-        ];
-      }
-      return {
-        popupData,
-        tableRef,
-        registerTable,
-        addRole,
-        handleEdit,
-        deleteBatches,
-        createActions,
-        getTableAction,
-        rowClick,
-        selectionChange,
-        addRegister,
-        saveData,
-        openModal,
-        register,
-        ...toRefs(btn),
-      };
-    },
-  });
-</script>
-<style scoped>
-  .ant-calendar-picker {
-    width: 100%;
-  }
-  @media (max-width: 639px) {
-    .sys-container .vben-basic-table-header__toolbar > * {
-      margin-right: 3px;
-    }
-
-    .sys-container .vben-basic-table .ant-table-wrapper {
-      padding: 3px;
-    }
-  }
-  .vben-basic-table-header__toolbar {
-    justify-content: space-between;
-  }
-  .tool-btn-wrap {
-    flex: 1;
-  }
-  .tool-btn-wrap button {
-    margin-right: 5px;
-  }
-</style>

src/views/news/notice/popup.vue

@@ -1,126 +0,0 @@
-<template>
-  <BasicModal
-    width="800px"
-    :minHeight="550"
-    v-bind="$attrs"
-    @register="register"
-    @ok="confirm"
-    :title="title"
-  >
-    <BasicForm @register="registerForm" :model="model" />
-    <!-- <MenuTree /> -->
-  </BasicModal>
-</template>
-<script lang="ts">
-  import { Tree } from 'ant-design-vue';
-  import { defineComponent, PropType, reactive, ref, toRefs } from 'vue';
-  import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import { BasicForm, useForm } from '/@/components/Form/index';
-  import { schemas } from './data';
-  interface PopupData {
-    title: string;
-  }
-  interface Role {
-    id: string | number;
-  }
-
-  export default defineComponent({
-    components: { BasicModal, BasicForm, [Tree.name]: Tree },
-    props: {
-      popupData: {
-        type: Object as PropType<PopupData>,
-        default: () => {},
-      },
-    },
-    emits: ['register', 'saveData'],
-    setup(props, { emit }) {
-      const { createMessage } = useMessage();
-      const { error } = createMessage;
-      const role = reactive<Role>({
-        id: 0,
-      });
-      const popupData = props.popupData as PopupData;
-      console.log(`popupData`, popupData);
-      const modelRef = ref({});
-
-      const [registerForm, { updateSchema, setFieldsValue, resetFields, validate }] = useForm({
-        labelWidth: 120,
-        schemas,
-        showActionButtonGroup: false,
-        actionColOptions: {
-          span: 24,
-        },
-      });
-      //   const [register, { closeModal }] = useModalInner((data) => {
-      //     modelRef.value = data;
-
-      //
-      //   });
-      const [register, { closeModal }] = useModalInner((data) => {
-        resetFields();
-        if (data) {
-          role.id = data.id;
-          updateSchema({
-            field: 'password',
-            required: false,
-          });
-        } else {
-          role.id = 0;
-          updateSchema({
-            field: 'password',
-            required: true,
-          });
-        }
-        setFieldsValue(data);
-      });
-
-      async function confirm() {
-        try {
-          const data = await validate();
-          if (role.id) {
-            data.id = role.id;
-          }
-          const popupData = { closeModal, data };
-          emit('saveData', popupData);
-        } catch (err: any) {
-          error(err.errorFields[0].errors[0]);
-        }
-      }
-      return {
-        register,
-        schemas,
-        registerForm,
-        model: modelRef,
-        confirm,
-        ...toRefs(popupData),
-      };
-    },
-  });
-</script>
-<style lang="less">
-  .ant-form-item-label {
-    text-align: center !important;
-  }
-
-  .tree-label {
-    width: 20.6%;
-    margin-top: 8px;
-    margin-bottom: 1em;
-    text-align: center;
-  }
-
-  @media (max-width: 639px) {
-    .ant-form-item-label {
-      line-height: 2.5715 !important;
-      text-align: center !important;
-    }
-
-    .tree-label {
-      width: 33%;
-      margin-top: 8px;
-      margin-bottom: 1em;
-      text-align: center;
-    }
-  }
-</style>