fix: 基础表格修改demo

src/views/table-demo/index.vue

@@ -47,12 +47,14 @@
 
 <script setup lang="jsx">
   import BsTable, { useBsTable } from '/@/components/BsUi/Table/index.js';
-  import {h, onMounted, ref} from 'vue';
+  import { h, onMounted, ref } from 'vue';
   import AddOrEditDrawer from '/@/views/table-demo/components/AddOrEditDrawer.vue';
   import DemoTableSelectorModal from '/@/views/table-demo/components/DemoTableSelectorModal.vue';
   import DemoBaseModal from '/@/views/table-demo/components/DemoBaseModal.vue';
   import { message } from 'ant-design-vue';
-  import {SearchOutlined} from "@ant-design/icons-vue";
+  import {BorderOuterOutlined, SearchOutlined} from '@ant-design/icons-vue';
+  import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
+  import { isFunction } from 'lodash';
 
   const addOrEditDrawerRef = ref(null);
   const demoTableSelectorModal = ref(null);
@@ -109,7 +111,7 @@
               type: 'primary',
               danger: true,
               onClick(event) {
-                setValue("toolbarTopConfig.buttons.0.props.disabled", true)
+                setValue('toolbarTopConfig.buttons.0.props.disabled', true);
               },
             },
           },
@@ -120,7 +122,7 @@
               type: 'text',
               danger: true,
               onClick(event) {
-                setValue("toolbarTopConfig.buttons.0.props.disabled", false)
+                setValue('toolbarTopConfig.buttons.0.props.disabled', false);
               },
             },
           },
@@ -151,16 +153,6 @@
               name: 'CellDict',
             },
           },
-          {
-            field: 'name',
-            title: 'JSX插槽渲染',
-            visible: true,
-            slots: {
-              default({ row, column }) {
-                return <span style={{ color: 'red' }}>{row.name}</span>;
-              },
-            },
-          },
           {
             field: 'opt',
             title: '操作JSX写法',
@@ -170,16 +162,16 @@
             slots: {
               default({ row, column }) {
                 return (
-                  <a-button
-                    type='text'
-                    size='small'
-                    disabled={false}
-                    onClick={() => {
-                      handleEdit(row);
-                    }}
-                  >
-                    编辑
-                  </a-button>
+                    <a-button
+                        type='text'
+                        size='small'
+                        disabled={false}
+                        onClick={() => {
+                          handleEdit(row);
+                        }}
+                    >
+                      编辑
+                    </a-button>
                 );
               },
             },
@@ -193,6 +185,93 @@
               default: 'opt1_default',
             },
           },
+          {
+            field: 'name',
+            title: 'JSX插槽渲染',
+            visible: true,
+            slots: {
+              default({ row, column }) {
+                return <span style={{ color: 'red' }}>{row.name}</span>;
+              },
+            },
+          },
+          {
+            // fixed: 'right',
+            cellRender: {
+              name: 'CellOption',
+              extraProps: {
+                buttons: [
+                  {
+                    title: '新增',
+                    code: 'add',
+                    display: ({ row }) => {
+                      return row.name !== 'hanxiaohui0' ? DISPLAY_STATE.VISIBLE : DISPLAY_STATE.HIDDEN;
+                    },
+                    disabled({ row }) {
+                      return false;
+                    },
+                    onClick({ row }) {
+                      console.log("row", row);
+                      message.success( row.name)
+                    },
+                    extraProps: {},
+                  },
+                  {
+                    title: '禁用',
+                    code: 'disabled',
+                    display: ({ row }) => {
+                      return DISPLAY_STATE.VISIBLE;
+                    },
+                    disabled({ row }) {
+                      return true;
+                    },
+                    onClick({ row }) {},
+                    extraProps: {
+                      icon: h(BorderOuterOutlined)
+                    },
+                  },
+                  {
+                    title: '删除',
+                    code: 'delete',
+                    display: ({ row }) => {
+                      return DISPLAY_STATE.VISIBLE;
+                    },
+                    disabled({ row }) {
+                      return false;
+                    },
+                    onClick({ row }) {},
+                    extraProps: {
+                      danger: true,
+                    },
+                  },
+                  {
+                    title: '编辑',
+                    code: 'edit',
+                    display: ({ row }) => {
+                      return DISPLAY_STATE.VISIBLE;
+                    },
+                    disabled({ row }) {
+                      return false;
+                    },
+                    onClick({ row }) {},
+                    extraProps: {},
+                  },
+                  {
+                    title: '查看',
+                    code: 'view',
+                    display: ({ row }) => {
+                      return DISPLAY_STATE.VISIBLE;
+                    },
+                    disabled({ row }) {
+                      return false;
+                    },
+                    onClick({ row }) {},
+                    extraProps: {},
+                  },
+                ],
+              },
+            },
+          },
         ],
         data: [
           {