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">
+      <TableAction
-        <Button
+        :actions="[
-          v-if="permissionListRef?.validateWrite"
+          {
-          type="primary"
+            label: $t('ui.actionTitle.edit'),
-          @click="handleEdit"
+            type: 'primary',
-          v-access:code="['crm:customer:update']"
+            icon: ACTION_ICON.EDIT,
-        >
+            auth: ['crm:customer:update'],
-          {{ $t('ui.actionTitle.edit') }}
+            ifShow: permissionListRef?.validateWrite,
-        </Button>
+            onClick: handleEdit,
-        <Button
+          },
-          v-if="permissionListRef?.validateOwnerUser"
+          {
-          type="primary"
+            label: '转移',
-          @click="handleTransfer"
+            type: 'primary',
-        >
+            ifShow: permissionListRef?.validateOwnerUser,
-          转移
+            onClick: handleTransfer,
-        </Button>
+          },
-        <Button
+          {
-          v-if="permissionListRef?.validateWrite"
+            label: '更改成交状态',
-          @click="handleUpdateDealStatus"
+            type: 'default',
-        >
+            ifShow: permissionListRef?.validateWrite,
-          更改成交状态
+            onClick: handleUpdateDealStatus,
-        </Button>
+          },
-        <Button
+          {
-          v-if="customer.lockStatus && permissionListRef?.validateOwnerUser"
+            label: '锁定',
-          @click="handleLock(false)"
+            type: 'default',
-        >
+            ifShow:
-          解锁
+              !customer.lockStatus && permissionListRef?.validateOwnerUser,
-        </Button>
+            onClick: handleLock.bind(null, true),
-        <Button
+          },
-          v-if="!customer.lockStatus && permissionListRef?.validateOwnerUser"
+          {
-          @click="handleLock(true)"
+            label: '解锁',
-        >
+            type: 'default',
-          锁定
+            ifShow: customer.lockStatus && permissionListRef?.validateOwnerUser,
-        </Button>
+            onClick: handleLock.bind(null, false),
-        <Button
+          },
-          v-if="!customer.ownerUserId"
+          {
-          type="primary"
+            label: '领取',
-          @click="handleReceive"
+            type: 'primary',
-        >
+            ifShow: !customer.ownerUserId,
-          领取
+            onClick: handleReceive,
-        </Button>
+          },
-        <Button
+          {
-          v-if="!customer.ownerUserId"
+            label: '分配',
-          type="primary"
+            type: 'default',
-          @click="handleDistributeForm"
+            ifShow: !customer.ownerUserId,
-        >
+            onClick: handleDistributeForm,
-          分配
+          },
-        </Button>
+          {
-        <Button
+            label: '放入公海',
-          v-if="customer.ownerUserId && permissionListRef?.validateOwnerUser"
+            type: 'default',
-          @click="handlePutPool"
+            ifShow:
-        >
+              !!customer.ownerUserId && permissionListRef?.validateOwnerUser,
-          放入公海
+            onClick: handlePutPool,
-        </Button>
+          },
-      </div>
+        ]"
+      />
     </template>
     <Card class="min-h-[10%]">
       <Description :data="customer" />