👣 提供ant原生表格组件模板基本完成

kicc-ui/src/views/system/config/config.data.ts

@@ -39,5 +39,13 @@ export const columns: ColumnProps[] = [
   {
     title: '创建时间',
     dataIndex: 'createTime'
+  },
+  {
+    width: 220,
+    title: '操作',
+    align: 'center',
+    dataIndex: 'action',
+    slots: { customRender: 'action' },
+    fixed: false
   }
 ];

kicc-ui/src/views/system/config/index.vue

@@ -131,6 +131,24 @@
           </div>
         </div>
       </template>
+      <template #action="{ record }">
+        <div :class="[actionPrefixCls, 'center']">
+          <a-button v-auth="['config_edit']"
+                    type="link"
+                    size="small"
+                    @click="handleEdit(record)"
+          ><Icon icon="fa6-regular:pen-to-square" :size="14"/>修改
+          </a-button>
+          <ADivider type="vertical" class="action-divider"/>
+          <a-button v-auth="['config_del']"
+                    type="link"
+                    size="small"
+                    color="error"
+                    @click="handleDel(record)"
+          ><Icon icon="ant-design:delete-outlined" :size="14"/>删除
+          </a-button>
+        </div>
+      </template>
     </ATable>
   </div>
 </template>
@@ -151,6 +169,7 @@
   import { Table, Form, Row, Col, Divider, Tooltip, Dropdown, Menu, Select, DatePicker, Alert } from 'ant-design-vue';
   import { BasicColumn, BasicTableProps, PaginationProps, SizeType } from '/@/components/Table';
   import { listConfig, delConfig } from '/@/api/platform/system/controller/config';
+  import Icon from '/@/components/Icon/src/Icon.vue';
   import ConfigModal from './ConfigModal.vue';
   import { columns } from './config.data';
   import { basicProps } from "/@/components/Table/src/props";
@@ -206,6 +225,7 @@
   const { t } = useI18n();
   const { prefixCls } = useDesign('basic-table');
   const { prefixCls: headerPrefixCls } = useDesign('basic-table-header');
+  const { prefixCls: actionPrefixCls } = useDesign('basic-table-action');
   const { createConfirm } = useMessage();
   const { createMessage } = useMessage();
   const { toggle, isFullscreen } = useFullscreen(wrapRef);