fix: customer detail button

apps/web-antd/src/views/crm/customer/modules/detail.vue

@@ -8,7 +8,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { confirm, Page, useVbenModal } from '@vben/common-ui';
 import { useTabs } from '@vben/hooks';
 
-import { Button, Card, message, Tabs } from 'ant-design-vue';
+import { Card, message, Tabs } from 'ant-design-vue';
 
 import {
   getCustomer,
@@ -21,6 +21,7 @@ import { getOperateLogPage } from '#/api/crm/operateLog';
 import { BizTypeEnum } from '#/api/crm/permission';
 import { useDescription } from '#/components/description';
 import { AsyncOperateLog } from '#/components/operate-log';
+import { ACTION_ICON, TableAction } from '#/components/table-action';
 import { BusinessDetailsList } from '#/views/crm/business';
 import { ContactDetailsList } from '#/views/crm/contact';
 import { ContractDetailsList } from '#/views/crm/contract';
@@ -210,61 +211,62 @@ onMounted(() => {
     <TransferModal @success="loadCustomerDetail" />
     <DistributeModal @success="loadCustomerDetail" />
     <template #extra>
-      <div class="flex items-center gap-2">
-        <Button
-          v-if="permissionListRef?.validateWrite"
-          type="primary"
-          @click="handleEdit"
-          v-access:code="['crm:customer:update']"
-        >
-          {{ $t('ui.actionTitle.edit') }}
-        </Button>
-        <Button
-          v-if="permissionListRef?.validateOwnerUser"
-          type="primary"
-          @click="handleTransfer"
-        >
-          转移
-        </Button>
-        <Button
-          v-if="permissionListRef?.validateWrite"
-          @click="handleUpdateDealStatus"
-        >
-          更改成交状态
-        </Button>
-        <Button
-          v-if="customer.lockStatus && permissionListRef?.validateOwnerUser"
-          @click="handleLock(false)"
-        >
-          解锁
-        </Button>
-        <Button
-          v-if="!customer.lockStatus && permissionListRef?.validateOwnerUser"
-          @click="handleLock(true)"
-        >
-          锁定
-        </Button>
-        <Button
-          v-if="!customer.ownerUserId"
-          type="primary"
-          @click="handleReceive"
-        >
-          领取
-        </Button>
-        <Button
-          v-if="!customer.ownerUserId"
-          type="primary"
-          @click="handleDistributeForm"
-        >
-          分配
-        </Button>
-        <Button
-          v-if="customer.ownerUserId && permissionListRef?.validateOwnerUser"
-          @click="handlePutPool"
-        >
-          放入公海
-        </Button>
-      </div>
+      <TableAction
+        :actions="[
+          {
+            label: $t('ui.actionTitle.edit'),
+            type: 'primary',
+            icon: ACTION_ICON.EDIT,
+            auth: ['crm:customer:update'],
+            ifShow: permissionListRef?.validateWrite,
+            onClick: handleEdit,
+          },
+          {
+            label: '转移',
+            type: 'primary',
+            ifShow: permissionListRef?.validateOwnerUser,
+            onClick: handleTransfer,
+          },
+          {
+            label: '更改成交状态',
+            type: 'default',
+            ifShow: permissionListRef?.validateWrite,
+            onClick: handleUpdateDealStatus,
+          },
+          {
+            label: '锁定',
+            type: 'default',
+            ifShow:
+              !customer.lockStatus && permissionListRef?.validateOwnerUser,
+            onClick: handleLock.bind(null, true),
+          },
+          {
+            label: '解锁',
+            type: 'default',
+            ifShow: customer.lockStatus && permissionListRef?.validateOwnerUser,
+            onClick: handleLock.bind(null, false),
+          },
+          {
+            label: '领取',
+            type: 'primary',
+            ifShow: !customer.ownerUserId,
+            onClick: handleReceive,
+          },
+          {
+            label: '分配',
+            type: 'default',
+            ifShow: !customer.ownerUserId,
+            onClick: handleDistributeForm,
+          },
+          {
+            label: '放入公海',
+            type: 'default',
+            ifShow:
+              !!customer.ownerUserId && permissionListRef?.validateOwnerUser,
+            onClick: handlePutPool,
+          },
+        ]"
+      />
     </template>
     <Card class="min-h-[10%]">
       <Description :data="customer" />