cms 文章管理 功能添加

jeecgboot-vue3-master/src/views/cms/admin/articel/CmsArticle.api.ts

@@ -11,6 +11,7 @@ enum Api {
   deleteBatch = '/cms/cmsArticle/deleteBatch',
   importExcel = '/cms/cmsArticle/importExcel',
   exportXls = '/cms/cmsArticle/exportXls',
+  operationStatus = '/cms/cmsArticle/operationStatus',
 }
 /**
  * 导出api
@@ -21,6 +22,11 @@ export const getExportUrl = Api.exportXls;
  * 导入api
  */
 export const getImportUrl = Api.importExcel;
+
+
+export const updateStatus = (params) => defHttp.post({url: Api.operationStatus, params});
+
+
 /**
  * 列表接口
  * @param params

jeecgboot-vue3-master/src/views/cms/admin/articel/CmsArticleList.vue

@@ -4,55 +4,15 @@
     <BasicTable @register="registerTable" :rowSelection="rowSelection">
       <!--插槽:table标题-->
       <template #tableTitle>
-          <a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
+        <a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增
-          <a-button  type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        </a-button>
-        <!--  <j-upload-button  type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出
-          <a-dropdown v-if="selectedRowKeys.length > 0">
-              <template #overlay>
-                <a-menu>
-                  <a-menu-item key="1" @click="batchHandleDelete">
-                    <Icon icon="ant-design:delete-outlined"></Icon>
-                    删除
-                  </a-menu-item>
-                </a-menu>
-              </template>
-              <a-button>批量操作
-                <Icon icon="mdi:chevron-down"></Icon>
         </a-button>
-          </a-dropdown>-->
       </template>
       <!--操作栏-->
       <template #action="{ record }">
-<!--        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>-->
+        <!--        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>-->
-        <TableAction :actions="getTableAction(record)" />
+        <TableAction :actions="getTableAction(record)"/>
-        <!--<TableAction
-          :stopButtonPropagation="true"
-          :actions="[
-                {
-                  label: '1',
-                  // type: 'link',
-                  size: 'small',
-                  icon: 'ant-design:plus-circle-outlined',
-                  onClick: add.bind(null, record),
-                },
-                {
-                  label: '2',
-                  // type: 'link',
-                  size: 'small',
-                  icon: 'fa6-regular:pen-to-square',
-                  onClick: editor.bind(null, record),
-                },
-                {
-                  label: '3',
-                  // color: 'error',
-                  icon: 'ic:outline-delete-outline',
-                  popConfirm: {
-                    title: '确定删除该数据吗？',
-                    confirm: del.bind(null, record),
-                  },
-                },
-              ]"
-        />-->
       </template>
       <!--字段回显插槽-->
       <template #htmlSlot="{text}">
@@ -64,7 +24,9 @@
       </template>
       <template #fileSlot="{text}">
         <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
-         <a-button v-else :ghost="true" type="primary" preIcon="ant-design:download-outlined" size="small" @click="downloadFile(text)">下载</a-button>
+        <a-button v-else :ghost="true" type="primary" preIcon="ant-design:download-outlined"
+                  size="small" @click="downloadFile(text)">下载
+        </a-button>
       </template>
     </BasicTable>
     <!-- 表单区域 -->
@@ -73,41 +35,44 @@
 </template>
 
 <script lang="ts" name="cms-cmsArticle" setup>
-  import {ref, computed, unref} from 'vue';
+  import {ref} from 'vue';
-  import {BasicTable, useTable, TableAction} from '/@/components/Table';
   import {useModal} from '/@/components/Modal';
-  import { useListPage } from '/@/hooks/system/useListPage'
+  import {useListPage} from '/@/hooks/system/useListPage'
-  import CmsArticleModal from './components/CmsArticleModal.vue'
   import {columns, searchFormSchema} from './CmsArticle.data';
-  import {list, deleteOne, batchDelete, getImportUrl,getExportUrl} from './CmsArticle.api';
+  import {
+    batchDelete,
+    deleteOne,
+    getExportUrl,
+    getImportUrl,
+    list,
+    updateStatus
+  } from './CmsArticle.api';
   // import { downloadFile } from '/@/utils/common/renderUtils';
   const checkedKeys = ref<Array<string | number>>([]);
   //注册model
   const [registerModal, {openModal}] = useModal();
   //注册table数据
-  const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
+  const {prefixCls, tableContext, onExportXls, onImportXls} = useListPage({
-      tableProps:{
+    tableProps: {
       title: '文章',
       api: list,
       columns,
-           canResize:false,
+      canResize: false,
       formConfig: {
         //labelWidth: 120,
         schemas: searchFormSchema,
-              autoSubmitOnEnter:true,
+        autoSubmitOnEnter: true,
-              showAdvancedButton:true,
+        showAdvancedButton: true,
-              fieldMapToNumber: [
+        fieldMapToNumber: [],
-              ],
+        fieldMapToTime: [],
-              fieldMapToTime: [
-              ],
       },
       actionColumn: {
         width: 120,
-               fixed:'right'
+        fixed: 'right'
       },
     },
     exportConfig: {
-            name:"文章",
+      name: "文章",
       url: getExportUrl,
     },
     importConfig: {
@@ -116,7 +81,7 @@
     },
   })
 
-  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
+  const [registerTable, {reload}, {rowSelection, selectedRowKeys}] = tableContext
 
   /**
    * 新增事件
@@ -127,6 +92,7 @@
       showFooter: true,
     });
   }
+
   /**
    * 编辑事件
    */
@@ -137,6 +103,7 @@
       showFooter: true,
     });
   }
+
   /**
    * 详情
    */
@@ -147,37 +114,43 @@
       showFooter: false,
     });
   }
+
+  function operationStatus(record: Recordable, isopen) {
+    record.isopen = isopen;
+    updateStatus(record)
+    reload()
+  }
+
   /**
    * 删除事件
    */
   async function handleDelete(record) {
     await deleteOne({id: record.id}, handleSuccess);
   }
+
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
     await batchDelete({ids: selectedRowKeys.value}, handleSuccess);
   }
+
   /**
    * 成功回调
    */
   function handleSuccess() {
     (selectedRowKeys.value = []) && reload();
   }
+
   /**
    * 操作栏
    */
-  function getTableAction(record){
+  function getTableAction(record) {
-       return [
+    const actions = [
       {
         label: '编辑',
         onClick: handleEdit.bind(null, record),
       },
-         {
-           label: '取消发布',
-           onClick: handleEdit.bind(null, record),
-         },
       {
         label: '删除',
         popConfirm: {
@@ -185,12 +158,26 @@
           confirm: handleDelete.bind(null, record),
         }
       }
-       ]
+    ];
+    if (record.status == "0") {
+      actions.unshift({
+        label: '发布',
+        onClick: operationStatus.bind(null, record, "1"),
+      });
     }
+    if (record.status == "1") {
+      actions.unshift({
+        label: '取消发布',
+        onClick: operationStatus.bind(null, record, "0"),
+      });
+    }
+    return actions;
+  }
+
   /**
    * 下拉操作栏
    */
-  function getDropDownAction(record){
+  function getDropDownAction(record) {
     return [
       {
         label: '详情',