yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

perf: code style

pull/120/head^2
xingyu4j 2025-05-29 01:51:38 +08:00
parent f6a5ca97a4
commit 5f6581b1c6
5 changed files with 75 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
apps/web-antd/src/views/crm/clue/data.ts
View File

@ -1,19 +1,15 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { CrmClueApi } from '#/api/crm/clue';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { DescriptionItemSchema } from '#/components/description';
import { h } from 'vue';
import { useAccess } from '@vben/access';
import { formatDateTime } from '@vben/utils';
import { getAreaTree } from '#/api/system/area';
import { DictTag } from '#/components/dict-tag';
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
const { hasAccessByCodes } = useAccess();
/** 新增/修改的表单 */
export function useFormSchema(): VbenFormSchema[] {
return [
@ -164,14 +160,11 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = CrmClueApi.Clue>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{
field: 'name',
title: '线索名称',
minWidth: 160,
fixed: 'left',
slots: {
default: 'name',
@ -180,7 +173,6 @@ export function useGridColumns<T = CrmClueApi.Clue>(
{
field: 'source',
title: '线索来源',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.CRM_CUSTOMER_SOURCE },
@ -189,27 +181,22 @@ export function useGridColumns<T = CrmClueApi.Clue>(
{
field: 'mobile',
title: '手机',
minWidth: 120,
},
{
field: 'telephone',
title: '电话',
minWidth: 130,
},
{
field: 'email',
title: '邮箱',
minWidth: 180,
},
{
field: 'detailAddress',
title: '地址',
minWidth: 180,
},
{
field: 'industryId',
title: '客户行业',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.CRM_CUSTOMER_INDUSTRY },
@ -218,7 +205,6 @@ export function useGridColumns<T = CrmClueApi.Clue>(
{
field: 'level',
title: '客户级别',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.CRM_CUSTOMER_LEVEL },
@ -227,66 +213,40 @@ export function useGridColumns<T = CrmClueApi.Clue>(
{
field: 'ownerUserName',
title: '负责人',
minWidth: 100,
},
{
field: 'ownerUserDeptName',
title: '所属部门',
minWidth: 100,
},
{
field: 'contactNextTime',
title: '下次联系时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'contactLastTime',
title: '最后跟进时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'updateTime',
title: '更新时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'creatorName',
title: '创建人',
minWidth: 100,
},
{
field: 'operation',
title: '操作',
width: 130,
width: 140,
fixed: 'right',
align: 'center',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '线索',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
{
code: 'edit',
show: hasAccessByCodes(['crm:clue:update']),
},
{
code: 'delete',
show: hasAccessByCodes(['crm:clue:delete']),
},
],
},
slots: { default: 'actions' },
},
];
}

113
apps/web-antd/src/views/crm/clue/index.vue
View File

@ -1,19 +1,15 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { CrmClueApi } from '#/api/crm/clue';
import { useRouter } from 'vue-router';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download, Plus } from '@vben/icons';
import { downloadFileFromBlobPart } from '@vben/utils';
import { Button, message } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { deleteClue, exportClue, getCluePage } from '#/api/crm/clue';
import { DocAlert } from '#/components/doc-alert';
import { $t } from '#/locales';
@ -33,55 +29,43 @@ function onRefresh() {
gridApi.query();
}
/** 导出表格 */
async function onExport() {
const data = await exportClue(await gridApi.formApi.getValues());
downloadFileFromBlobPart({ fileName: '线索.xls', source: data });
}
/** 创建线索 */
function onCreate() {
function handleCreate() {
formModalApi.setData(null).open();
}
/** 编辑线索 */
function onEdit(row: CrmClueApi.Clue) {
function handleEdit(row: CrmClueApi.Clue) {
formModalApi.setData(row).open();
}
/** 删除线索 */
async function onDelete(row: CrmClueApi.Clue) {
async function handleDelete(row: CrmClueApi.Clue) {
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', [row.name]),
duration: 0,
key: 'action_process_msg',
key: 'action_key_msg',
});
try {
await deleteClue(row.id as number);
message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
message.success({
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
key: 'action_key_msg',
});
onRefresh();
} catch {
hideLoading();
}
}
/** 查看线索详情 */
function onDetail(row: CrmClueApi.Clue) {
push({ name: 'CrmClueDetail', params: { id: row.id } });
/** 导出表格 */
async function handleExport() {
const data = await exportClue(await gridApi.formApi.getValues());
downloadFileFromBlobPart({ fileName: '线索.xls', source: data });
}
/** 表格操作按钮的回调函数 */
function onActionClick({ code, row }: OnActionClickParams<CrmClueApi.Clue>) {
switch (code) {
case 'delete': {
onDelete(row);
break;
}
case 'edit': {
onEdit(row);
break;
}
}
/** 查看线索详情 */
function handleDetail(row: CrmClueApi.Clue) {
push({ name: 'CrmClueDetail', params: { id: row.id } });
}
const [Grid, gridApi] = useVbenVxeGrid({
@ -89,7 +73,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
schema: useGridFormSchema(),
},
gridOptions: {
columns: useGridColumns(onActionClick),
columns: useGridColumns(),
height: 'auto',
keepSource: true,
proxyConfig: {
@ -130,29 +114,54 @@ const [Grid, gridApi] = useVbenVxeGrid({
<FormModal @success="onRefresh" />
<Grid table-title="线索列表">
<template #toolbar-tools>
<Button
type="primary"
@click="onCreate"
v-access:code="['crm:clue:create']"
>
<Plus class="size-5" />
{{ $t('ui.actionTitle.create', ['线索']) }}
</Button>
<Button
type="primary"
class="ml-2"
@click="onExport"
v-access:code="['crm:clue:export']"
>
<Download class="size-5" />
{{ $t('ui.actionTitle.export') }}
</Button>
<TableAction
:actions="[
{
label: $t('ui.actionTitle.create', ['线索']),
type: 'primary',
icon: ACTION_ICON.ADD,
auth: ['crm:clue:create'],
onClick: handleCreate,
},
{
label: $t('ui.actionTitle.export'),
type: 'primary',
icon: ACTION_ICON.DOWNLOAD,
auth: ['crm:clue:export'],
onClick: handleExport,
},
]"
/>
</template>
<template #name="{ row }">
<Button type="link" @click="onDetail(row)">
<Button type="link" @click="handleDetail(row)">
{{ row.name }}
</Button>
</template>
<template #actions="{ row }">
<TableAction
:actions="[
{
label: $t('common.edit'),
type: 'link',
icon: ACTION_ICON.EDIT,
auth: ['crm:clue:update'],
onClick: handleEdit.bind(null, row),
},
{
label: $t('common.delete'),
type: 'link',
danger: true,
icon: ACTION_ICON.DELETE,
auth: ['crm:clue:delete'],
popConfirm: {
title: $t('ui.actionMessage.deleteConfirm', [row.name]),
confirm: handleDelete.bind(null, row),
},
},
]"
/>
</template>
</Grid>
</Page>
</template>

9
apps/web-antd/src/views/crm/customer/data.ts
View File

@ -9,6 +9,7 @@ import { useAccess } from '@vben/access';
import { formatDateTime } from '@vben/utils';
import { getAreaTree } from '#/api/system/area';
import { getSimpleUserList } from '#/api/system/user';
import { DictTag } from '#/components/dict-tag';
import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
@ -48,9 +49,13 @@ export function useFormSchema(): VbenFormSchema[] {
{
fieldName: 'ownerUserId',
label: '负责人',
component: 'Select',
component: 'ApiSelect',
componentProps: {
api: 'getSimpleUserList',
api: () => getSimpleUserList(),
fieldNames: {
label: 'nickname',
value: 'id',
},
},
rules: 'required',
},

2
apps/web-antd/src/views/crm/customer/index.vue
View File

@ -147,7 +147,7 @@ function onChangeSceneType(key: number | string) {
<FormModal @success="onRefresh" />
<Grid>
<template #toolbar-actions>
<template #top>
<Tabs class="border-none" @change="onChangeSceneType">
<Tabs.TabPane tab="我负责的" key="1" />
<Tabs.TabPane tab="我参与的" key="2" />

4
apps/web-antd/src/views/crm/customer/modules/form.vue
View File

@ -29,9 +29,9 @@ const [Form, formApi] = useVbenForm({
componentProps: {
class: 'w-full',
},
formItemClass: 'col-span-2',
labelWidth: 120,
},
// 一共2列
wrapperClass: 'grid-cols-2',
layout: 'horizontal',
schema: useFormSchema(),
showDefaultActions: false,