feat(other): 事件列表管理删除业务

src/service/api/event.adapter.ts

@@ -2,13 +2,13 @@ export function adapterOfFetchFieldList(data: ApiBackground.Field[] | null): Bac
   if (!data) return [];
 
   return data.map(item => {
-    const user: BackgroundField.Field = {
+    const field: BackgroundField.Field = {
       index: item.id,
       key: item.id,
       ...item
     };
 
-    return user;
+    return field;
   });
 }
 
@@ -16,12 +16,12 @@ export function adapterOfFetchEventList(data: ApiBackground.Event[] | null): Bac
   if (!data) return [];
 
   return data.map((item, index) => {
-    const user: BackgroundEvent.Event = {
+    const event: BackgroundEvent.Event = {
       index: index + 1,
       key: item.id,
       ...item
     };
 
-    return user;
+    return event;
   });
 }

src/service/api/event.ts

@@ -4,12 +4,11 @@ import { backgroundRequest } from '../request';
 
 /** 获取用户列表 */
 export const fetchFieldList = async (page: number, page_size: number, name: string) => {
-  const param = {
+  const data = await backgroundRequest.post<ApiBackground.Field[] | null>('/kpt/field/search', {
     page,
     page_size,
     name
-  };
-  const data = await backgroundRequest.post<ApiBackground.Field[] | null>('/kpt/field/search', param);
+  });
   return adapter(adapterOfFetchFieldList, data);
 };
 
@@ -24,7 +23,15 @@ export const fetchFieldEdit = (param: ApiBackground.Field) => {
 export const fetchFieldDelete = (fieldId: number) => {
   return backgroundRequest.post<ApiBoolean.OK | null>('/kpt/field/delete', { id: fieldId });
 };
-export const fetchEventList = async () => {
-  const data = await backgroundRequest.post<ApiBackground.Event[] | null>('/kpt/event/search');
+export const fetchEventList = async (page: number, page_size: number, name: string) => {
+  const data = await backgroundRequest.post<ApiBackground.Event[] | null>('/kpt/event/search', {
+    page,
+    page_size,
+    name
+  });
   return adapter(adapterOfFetchEventList, data);
 };
+
+export const fetchEventDelete = (eventId: number) => {
+  return backgroundRequest.post<ApiBoolean.OK | null>('/kpt/event/delete', { id: eventId });
+};

src/typings/business.d.ts

@@ -92,5 +92,5 @@ declare namespace BackgroundEvent {
    * 1:是
    * 2: 否
    */
-  type IsShow = NonNullable<Event['isShow']>;
+  type IsShow = NonNullable<Event['is_show']>;
 }

src/typings/event.d.ts

@@ -11,7 +11,7 @@ declare namespace ApiBackground {
      * 1:是
      * 2: 否
      */
-    isShow: boolean;
+    is_show: 1 | 2 | null;
     /**
      * 是否删除
      * 1 是

src/views/background/event/components/table-action-modal.vue

@@ -5,8 +5,11 @@
         <n-form-item-grid-item :span="25" label="事件名称" path="name">
           <n-input v-model:value="formModel.name" />
         </n-form-item-grid-item>
-        <n-form-item-grid-item :span="25" label="是否启用" path="isShow">
-          <n-switch v-model:value="formModel.isShow" />
+        <!--        <n-form-item-grid-item :span="25" label="是否启用" path="isShow">
+          <n-switch v-model:value="formModel.is_show" />
+        </n-form-item-grid-item>-->
+        <n-form-item-grid-item :span="25" label="事件描述" path="remarks">
+          <n-input v-model:value="formModel.remarks" />
         </n-form-item-grid-item>
       </n-grid>
       <n-space class="w-full pt-16px" :size="24" justify="end">
@@ -72,21 +75,21 @@ const title = computed(() => {
 
 const formRef = ref<HTMLElement & FormInst>();
 
-type FormModel = Pick<BackgroundEvent.Event, 'name' | 'isShow' | 'remarks' | 'conditions'>;
+type FormModel = Pick<BackgroundEvent.Event, 'name' | 'is_show' | 'remarks' | 'conditions'>;
 
 const formModel = reactive<FormModel>(createDefaultFormModel());
 
 const rules: Record<keyof FormModel, FormItemRule | FormItemRule[]> = {
   name: createRequiredFormRule('请输入事件名称'),
-  isShow: createRequiredFormRule('是否启用'),
-  remarks: createRequiredFormRule('请输入事件，描述'),
+  is_show: createRequiredFormRule('是否启用'),
+  remarks: createRequiredFormRule('请输入事件描述'),
   conditions: createRequiredFormRule('请输入事件执行条件')
 };
 
 function createDefaultFormModel(): FormModel {
   return {
     name: '',
-    isShow: true,
+    is_show: 1,
     remarks: '',
     conditions: ''
   };

src/views/background/event/index.vue

@@ -35,7 +35,7 @@ import type { Ref } from 'vue';
 import { NButton, NPopconfirm, NSpace } from 'naive-ui';
 import type { DataTableColumns, PaginationProps } from 'naive-ui';
 import { useBoolean, useLoading } from '@/hooks';
-import { fetchEventList } from '@/service/api/event';
+import { fetchEventDelete, fetchEventList } from '@/service/api/event';
 import TableActionModal from './components/table-action-modal.vue';
 import type { ModalType } from './components/table-action-modal.vue';
 
@@ -49,7 +49,7 @@ function setTableData(data: BackgroundEvent.Event[]) {
 
 async function getTableData() {
   startLoading();
-  const { data } = await fetchEventList();
+  const { data } = await fetchEventList(1, 100, eventName.value);
   if (data) {
     setTimeout(() => {
       setTableData(data);
@@ -74,12 +74,12 @@ const columns: Ref<DataTableColumns<BackgroundEvent.Event>> = ref([
     align: 'center'
   },
   {
-    key: 'isShow',
+    key: 'is_show',
     title: '是否启用',
     align: 'center'
   },
   {
-    key: 'conditions',
+    key: 'remarks',
     title: '事件描述',
     align: 'center'
   },
@@ -90,7 +90,7 @@ const columns: Ref<DataTableColumns<BackgroundEvent.Event>> = ref([
     render: row => {
       return (
         <NSpace justify={'center'}>
-          <NButton size={'small'} onClick={() => handleEditTable(row.id)}>
+          <NButton type="info" size={'small'} onClick={() => handleEditTable(row.id)}>
             设置
           </NButton>
         </NSpace>
@@ -104,16 +104,20 @@ const columns: Ref<DataTableColumns<BackgroundEvent.Event>> = ref([
     render: row => {
       return (
         <NSpace justify={'center'}>
-          <NButton size={'small'} onClick={() => handleEditTable(row.id)}>
+          <NButton type="info" size={'small'} onClick={() => handleEditTable(row.id)}>
             编辑
           </NButton>
-          <NButton size={'small'} onClick={() => handleEditTable(row.id)}>
+          <NButton type="warning" size={'small'} onClick={() => handleEditTable(row.id)}>
             影响设置
           </NButton>
           <NPopconfirm onPositiveClick={() => handleDeleteTable(row.id)}>
             {{
               default: () => '确认删除',
-              trigger: () => <NButton size={'small'}>删除</NButton>
+              trigger: () => (
+                <NButton type="error" size={'small'}>
+                  删除
+                </NButton>
+              )
             }}
           </NPopconfirm>
         </NSpace>
@@ -149,7 +153,13 @@ function handleEditTable(rowId: number) {
 }
 
 function handleDeleteTable(rowId: number) {
-  window.$message?.info(`点击了删除，rowId为${rowId}`);
+  const data = fetchEventDelete(rowId);
+  data.then(res => {
+    if (res.data) {
+      window.$message?.success('删除成功！');
+    }
+  });
+  init();
 }
 
 const pagination: PaginationProps = reactive({

src/views/background/field/index.vue

@@ -115,13 +115,17 @@ const columns: Ref<DataTableColumns<BackgroundField.Field>> = ref([
     render: row => {
       return (
         <NSpace justify={'center'}>
-          <NButton size={'small'} onClick={() => handleEditTable(row.id)}>
+          <NButton type="info" size={'small'} onClick={() => handleEditTable(row.id)}>
             编辑
           </NButton>
           <NPopconfirm onPositiveClick={() => handleDeleteTable(row.id)}>
             {{
               default: () => '确认删除',
-              trigger: () => <NButton size={'small'}>删除</NButton>
+              trigger: () => (
+                <NButton type="error" size={'small'}>
+                  删除
+                </NButton>
+              )
             }}
           </NPopconfirm>
         </NSpace>