feat：【ele】【crm】backlog 迁移初始化
This commit is contained in:
YunaiV
102
apps/web-ele/src/views/crm/backlog/data.ts
Normal file
102
apps/web-ele/src/views/crm/backlog/data.ts
Normal file
@@ -0,0 +1,102 @@
|
|||||||
|
import type { Ref } from 'vue';
|
||||||
|
|
||||||
|
export interface LeftSideItem {
|
||||||
|
name: string;
|
||||||
|
menu: string;
|
||||||
|
count: Ref<number>;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 跟进状态 */
|
||||||
|
export const FOLLOWUP_STATUS = [
|
||||||
|
{ label: '待跟进', value: false },
|
||||||
|
{ label: '已跟进', value: true },
|
||||||
|
];
|
||||||
|
|
||||||
|
/** 归属范围 */
|
||||||
|
export const SCENE_TYPES = [
|
||||||
|
{ label: '我负责的', value: 1 },
|
||||||
|
{ label: '我参与的', value: 2 },
|
||||||
|
{ label: '下属负责的', value: 3 },
|
||||||
|
];
|
||||||
|
|
||||||
|
/** 联系状态 */
|
||||||
|
export const CONTACT_STATUS = [
|
||||||
|
{ label: '今日需联系', value: 1 },
|
||||||
|
{ label: '已逾期', value: 2 },
|
||||||
|
{ label: '已联系', value: 3 },
|
||||||
|
];
|
||||||
|
|
||||||
|
/** 审批状态 */
|
||||||
|
export const AUDIT_STATUS = [
|
||||||
|
{ label: '待审批', value: 10 },
|
||||||
|
{ label: '审核通过', value: 20 },
|
||||||
|
{ label: '审核不通过', value: 30 },
|
||||||
|
];
|
||||||
|
|
||||||
|
/** 回款提醒类型 */
|
||||||
|
export const RECEIVABLE_REMIND_TYPE = [
|
||||||
|
{ label: '待回款', value: 1 },
|
||||||
|
{ label: '已逾期', value: 2 },
|
||||||
|
{ label: '已回款', value: 3 },
|
||||||
|
];
|
||||||
|
|
||||||
|
/** 合同过期状态 */
|
||||||
|
export const CONTRACT_EXPIRY_TYPE = [
|
||||||
|
{ label: '即将过期', value: 1 },
|
||||||
|
{ label: '已过期', value: 2 },
|
||||||
|
];
|
||||||
|
|
||||||
|
/** 左侧菜单 */
|
||||||
|
export const useLeftSides = (
|
||||||
|
customerTodayContactCount: Ref<number>,
|
||||||
|
clueFollowCount: Ref<number>,
|
||||||
|
customerFollowCount: Ref<number>,
|
||||||
|
customerPutPoolRemindCount: Ref<number>,
|
||||||
|
contractAuditCount: Ref<number>,
|
||||||
|
contractRemindCount: Ref<number>,
|
||||||
|
receivableAuditCount: Ref<number>,
|
||||||
|
receivablePlanRemindCount: Ref<number>,
|
||||||
|
): LeftSideItem[] => {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
name: '今日需联系客户',
|
||||||
|
menu: 'customerTodayContact',
|
||||||
|
count: customerTodayContactCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '分配给我的线索',
|
||||||
|
menu: 'clueFollow',
|
||||||
|
count: clueFollowCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '分配给我的客户',
|
||||||
|
menu: 'customerFollow',
|
||||||
|
count: customerFollowCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '待进入公海的客户',
|
||||||
|
menu: 'customerPutPoolRemind',
|
||||||
|
count: customerPutPoolRemindCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '待审核合同',
|
||||||
|
menu: 'contractAudit',
|
||||||
|
count: contractAuditCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '待审核回款',
|
||||||
|
menu: 'receivableAudit',
|
||||||
|
count: receivableAuditCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '待回款提醒',
|
||||||
|
menu: 'receivablePlanRemind',
|
||||||
|
count: receivablePlanRemindCount,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '即将到期的合同',
|
||||||
|
menu: 'contractRemind',
|
||||||
|
count: contractRemindCount,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
};
|
||||||
115
apps/web-ele/src/views/crm/backlog/index.vue
Normal file
115
apps/web-ele/src/views/crm/backlog/index.vue
Normal file
@@ -0,0 +1,115 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import { computed, onActivated, onMounted, ref } from 'vue';
|
||||||
|
|
||||||
|
import { Page } from '@vben/common-ui';
|
||||||
|
|
||||||
|
import { ElBadge, ElCard } from 'element-plus';
|
||||||
|
|
||||||
|
import { getFollowClueCount } from '#/api/crm/clue';
|
||||||
|
import {
|
||||||
|
getAuditContractCount,
|
||||||
|
getRemindContractCount,
|
||||||
|
} from '#/api/crm/contract';
|
||||||
|
import {
|
||||||
|
getFollowCustomerCount,
|
||||||
|
getPutPoolRemindCustomerCount,
|
||||||
|
getTodayContactCustomerCount,
|
||||||
|
} from '#/api/crm/customer';
|
||||||
|
import { getAuditReceivableCount } from '#/api/crm/receivable';
|
||||||
|
import { getReceivablePlanRemindCount } from '#/api/crm/receivable/plan';
|
||||||
|
|
||||||
|
import { useLeftSides } from './data';
|
||||||
|
import ClueFollowList from './modules/clue-follow-list.vue';
|
||||||
|
import ContractAuditList from './modules/contract-audit-list.vue';
|
||||||
|
import ContractRemindList from './modules/contract-remind-list.vue';
|
||||||
|
import CustomerFollowList from './modules/customer-follow-list.vue';
|
||||||
|
import CustomerPutPoolRemindList from './modules/customer-put-pool-remind-list.vue';
|
||||||
|
import CustomerTodayContactList from './modules/customer-today-contact-list.vue';
|
||||||
|
import ReceivableAuditList from './modules/receivable-audit-list.vue';
|
||||||
|
import ReceivablePlanRemindList from './modules/receivable-plan-remind-list.vue';
|
||||||
|
|
||||||
|
const leftMenu = ref('customerTodayContact');
|
||||||
|
|
||||||
|
const clueFollowCount = ref(0);
|
||||||
|
const customerFollowCount = ref(0);
|
||||||
|
const customerPutPoolRemindCount = ref(0);
|
||||||
|
const customerTodayContactCount = ref(0);
|
||||||
|
const contractAuditCount = ref(0);
|
||||||
|
const contractRemindCount = ref(0);
|
||||||
|
const receivableAuditCount = ref(0);
|
||||||
|
const receivablePlanRemindCount = ref(0);
|
||||||
|
|
||||||
|
const leftSides = useLeftSides(
|
||||||
|
customerTodayContactCount,
|
||||||
|
clueFollowCount,
|
||||||
|
customerFollowCount,
|
||||||
|
customerPutPoolRemindCount,
|
||||||
|
contractAuditCount,
|
||||||
|
contractRemindCount,
|
||||||
|
receivableAuditCount,
|
||||||
|
receivablePlanRemindCount,
|
||||||
|
);
|
||||||
|
|
||||||
|
const currentComponent = computed(() => {
|
||||||
|
const components = {
|
||||||
|
customerTodayContact: CustomerTodayContactList,
|
||||||
|
clueFollow: ClueFollowList,
|
||||||
|
contractAudit: ContractAuditList,
|
||||||
|
receivableAudit: ReceivableAuditList,
|
||||||
|
contractRemind: ContractRemindList,
|
||||||
|
customerFollow: CustomerFollowList,
|
||||||
|
customerPutPoolRemind: CustomerPutPoolRemindList,
|
||||||
|
receivablePlanRemind: ReceivablePlanRemindList,
|
||||||
|
} as const;
|
||||||
|
return components[leftMenu.value as keyof typeof components];
|
||||||
|
});
|
||||||
|
|
||||||
|
/** 侧边点击 */
|
||||||
|
function sideClick(item: { menu: string }) {
|
||||||
|
leftMenu.value = item.menu;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取数量 */
|
||||||
|
async function getCount() {
|
||||||
|
customerTodayContactCount.value = await getTodayContactCustomerCount();
|
||||||
|
customerPutPoolRemindCount.value = await getPutPoolRemindCustomerCount();
|
||||||
|
customerFollowCount.value = await getFollowCustomerCount();
|
||||||
|
clueFollowCount.value = await getFollowClueCount();
|
||||||
|
contractAuditCount.value = await getAuditContractCount();
|
||||||
|
contractRemindCount.value = await getRemindContractCount();
|
||||||
|
receivableAuditCount.value = await getAuditReceivableCount();
|
||||||
|
receivablePlanRemindCount.value = await getReceivablePlanRemindCount();
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 激活时 */
|
||||||
|
onActivated(() => {
|
||||||
|
getCount();
|
||||||
|
});
|
||||||
|
|
||||||
|
/** 初始化 */
|
||||||
|
onMounted(() => {
|
||||||
|
getCount();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<Page auto-content-height>
|
||||||
|
<div class="flex h-full w-full">
|
||||||
|
<ElCard class="w-1/5">
|
||||||
|
<div v-for="item in leftSides" :key="item.menu">
|
||||||
|
<div
|
||||||
|
class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700 flex items-center justify-between px-4 py-3 border-b"
|
||||||
|
@click="sideClick(item)"
|
||||||
|
>
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<ElBadge
|
||||||
|
v-if="item.count.value > 0"
|
||||||
|
:value="item.count.value"
|
||||||
|
:type="item.menu === leftMenu ? 'primary' : 'danger'"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ElCard>
|
||||||
|
<component class="ml-4 w-4/5" :is="currentComponent" />
|
||||||
|
</div>
|
||||||
|
</Page>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,79 @@
|
|||||||
|
<!-- 分配给我的线索 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmClueApi } from '#/api/crm/clue';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getCluePage } from '#/api/crm/clue';
|
||||||
|
import { useGridColumns } from '#/views/crm/clue/data';
|
||||||
|
|
||||||
|
import { FOLLOWUP_STATUS } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 打开线索详情 */
|
||||||
|
function handleDetail(row: CrmClueApi.Clue) {
|
||||||
|
push({ name: 'CrmClueDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'followUpStatus',
|
||||||
|
label: '状态',
|
||||||
|
component: 'RadioGroup',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: FOLLOWUP_STATUS,
|
||||||
|
},
|
||||||
|
defaultValue: false,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getCluePage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
transformStatus: false,
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmClueApi.Clue>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #name="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)">{{
|
||||||
|
row.name
|
||||||
|
}}</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)"
|
||||||
|
>查看详情</ElButton
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,124 @@
|
|||||||
|
<!-- 待审核合同 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmContractApi } from '#/api/crm/contract';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getContractPage } from '#/api/crm/contract';
|
||||||
|
import { useGridColumns } from '#/views/crm/contract/data';
|
||||||
|
|
||||||
|
import { AUDIT_STATUS } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 查看审批 */
|
||||||
|
function handleProcessDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({
|
||||||
|
name: 'BpmProcessInstanceDetail',
|
||||||
|
query: { id: row.processInstanceId },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开合同详情 */
|
||||||
|
function handleContractDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmContractDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleCustomerDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开联系人详情 */
|
||||||
|
function handleContactDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmContactDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开商机详情 */
|
||||||
|
function handleBusinessDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmBusinessDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'auditStatus',
|
||||||
|
label: '合同状态',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: AUDIT_STATUS,
|
||||||
|
},
|
||||||
|
defaultValue: AUDIT_STATUS[0]!.value,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getContractPage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
sceneType: 1, // 我负责的
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmContractApi.Contract>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #name="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleContractDetail(row)">
|
||||||
|
{{ row.name }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #customerName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleCustomerDetail(row)">
|
||||||
|
{{ row.customerName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #businessName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleBusinessDetail(row)">
|
||||||
|
{{ row.businessName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #contactName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleContactDetail(row)">
|
||||||
|
{{ row.contactName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<TableAction
|
||||||
|
:actions="[
|
||||||
|
{
|
||||||
|
label: '查看审批',
|
||||||
|
type: 'primary',
|
||||||
|
link: true,
|
||||||
|
icon: ACTION_ICON.VIEW,
|
||||||
|
onClick: handleProcessDetail.bind(null, row),
|
||||||
|
},
|
||||||
|
]"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,125 @@
|
|||||||
|
<!-- 即将到期的合同 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmContractApi } from '#/api/crm/contract';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getContractPage } from '#/api/crm/contract';
|
||||||
|
import { useGridColumns } from '#/views/crm/contract/data';
|
||||||
|
|
||||||
|
import { CONTRACT_EXPIRY_TYPE } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 查看审批 */
|
||||||
|
function handleProcessDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({
|
||||||
|
name: 'BpmProcessInstanceDetail',
|
||||||
|
query: { id: row.processInstanceId },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开合同详情 */
|
||||||
|
function handleContractDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmContractDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleCustomerDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开联系人详情 */
|
||||||
|
function handleContactDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmContactDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开商机详情 */
|
||||||
|
function handleBusinessDetail(row: CrmContractApi.Contract) {
|
||||||
|
push({ name: 'CrmBusinessDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'expiryType',
|
||||||
|
label: '到期状态',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: CONTRACT_EXPIRY_TYPE,
|
||||||
|
},
|
||||||
|
defaultValue: CONTRACT_EXPIRY_TYPE[0]!.value,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getContractPage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
sceneType: 1, // 自己负责的
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmContractApi.Contract>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #name="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleContractDetail(row)">
|
||||||
|
{{ row.name }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #customerName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleCustomerDetail(row)">
|
||||||
|
{{ row.customerName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #businessName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleBusinessDetail(row)">
|
||||||
|
{{ row.businessName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #signContactName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleContactDetail(row)">
|
||||||
|
{{ row.signContactName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<TableAction
|
||||||
|
:actions="[
|
||||||
|
{
|
||||||
|
label: '查看审批',
|
||||||
|
type: 'primary',
|
||||||
|
link: true,
|
||||||
|
auth: ['crm:contract:update'],
|
||||||
|
onClick: handleProcessDetail.bind(null, row),
|
||||||
|
},
|
||||||
|
]"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,79 @@
|
|||||||
|
<!-- 分配给我的客户 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmCustomerApi } from '#/api/crm/customer';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getCustomerPage } from '#/api/crm/customer';
|
||||||
|
import { useGridColumns } from '#/views/crm/customer/data';
|
||||||
|
|
||||||
|
import { FOLLOWUP_STATUS } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleDetail(row: CrmCustomerApi.Customer) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'followUpStatus',
|
||||||
|
label: '状态',
|
||||||
|
component: 'RadioGroup',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: FOLLOWUP_STATUS,
|
||||||
|
},
|
||||||
|
defaultValue: false,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getCustomerPage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
sceneType: 1,
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmCustomerApi.Customer>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #name="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)">{{
|
||||||
|
row.name
|
||||||
|
}}</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)"
|
||||||
|
>查看详情</ElButton
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,79 @@
|
|||||||
|
<!-- 待进入公海的客户 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmCustomerApi } from '#/api/crm/customer';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getCustomerPage } from '#/api/crm/customer';
|
||||||
|
import { useGridColumns } from '#/views/crm/customer/data';
|
||||||
|
|
||||||
|
import { SCENE_TYPES } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleDetail(row: CrmCustomerApi.Customer) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'sceneType',
|
||||||
|
label: '归属',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: SCENE_TYPES,
|
||||||
|
},
|
||||||
|
defaultValue: SCENE_TYPES[0]!.value,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getCustomerPage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
pool: true, // 固定 公海参数为 true
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmCustomerApi.Customer>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #name="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)">{{
|
||||||
|
row.name
|
||||||
|
}}</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)"
|
||||||
|
>查看详情</ElButton
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,89 @@
|
|||||||
|
<!-- 今日需联系客户 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmCustomerApi } from '#/api/crm/customer';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getCustomerPage } from '#/api/crm/customer';
|
||||||
|
import { useGridColumns } from '#/views/crm/customer/data';
|
||||||
|
|
||||||
|
import { CONTACT_STATUS, SCENE_TYPES } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleDetail(row: CrmCustomerApi.Customer) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'contactStatus',
|
||||||
|
label: '状态',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: CONTACT_STATUS,
|
||||||
|
},
|
||||||
|
defaultValue: CONTACT_STATUS[0]!.value,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
fieldName: 'sceneType',
|
||||||
|
label: '归属',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: SCENE_TYPES,
|
||||||
|
},
|
||||||
|
defaultValue: SCENE_TYPES[0]!.value,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getCustomerPage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
pool: null, // 是否公海数据
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmCustomerApi.Customer>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #name="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)">{{
|
||||||
|
row.name
|
||||||
|
}}</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)"
|
||||||
|
>查看详情</ElButton
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,106 @@
|
|||||||
|
<!-- 待审核回款 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmReceivableApi } from '#/api/crm/receivable';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getReceivablePage } from '#/api/crm/receivable';
|
||||||
|
import { useGridColumns } from '#/views/crm/receivable/data';
|
||||||
|
|
||||||
|
import { AUDIT_STATUS } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
/** 查看审批 */
|
||||||
|
function handleProcessDetail(row: CrmReceivableApi.Receivable) {
|
||||||
|
push({
|
||||||
|
name: 'BpmProcessInstanceDetail',
|
||||||
|
query: { id: row.processInstanceId },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开回款详情 */
|
||||||
|
function handleDetail(row: CrmReceivableApi.Receivable) {
|
||||||
|
push({ name: 'CrmReceivableDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleCustomerDetail(row: CrmReceivableApi.Receivable) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.customerId } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开合同详情 */
|
||||||
|
function handleContractDetail(row: CrmReceivableApi.Receivable) {
|
||||||
|
push({ name: 'CrmContractDetail', params: { id: row.contractId } });
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'auditStatus',
|
||||||
|
label: '合同状态',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: AUDIT_STATUS,
|
||||||
|
},
|
||||||
|
defaultValue: AUDIT_STATUS[0]!.value,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getReceivablePage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmReceivableApi.Receivable>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Grid>
|
||||||
|
<template #no="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)">
|
||||||
|
{{ row.no }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #customerName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleCustomerDetail(row)">
|
||||||
|
{{ row.customerName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #contractNo="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleContractDetail(row)">
|
||||||
|
{{ row.contractNo }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleProcessDetail(row)"
|
||||||
|
>查看审批</ElButton
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,104 @@
|
|||||||
|
<!-- 待回款提醒 -->
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { CrmReceivablePlanApi } from '#/api/crm/receivable/plan';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
|
|
||||||
|
import { ElButton } from 'element-plus';
|
||||||
|
|
||||||
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getReceivablePlanPage } from '#/api/crm/receivable/plan';
|
||||||
|
import Form from '#/views/crm/receivable/modules/form.vue';
|
||||||
|
import { useGridColumns } from '#/views/crm/receivable/plan/data';
|
||||||
|
|
||||||
|
import { RECEIVABLE_REMIND_TYPE } from '../data';
|
||||||
|
|
||||||
|
const { push } = useRouter();
|
||||||
|
|
||||||
|
const [FormModal, formModalApi] = useVbenModal({
|
||||||
|
connectedComponent: Form,
|
||||||
|
destroyOnClose: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
/** 打开回款详情 */
|
||||||
|
function handleDetail(row: CrmReceivablePlanApi.Plan) {
|
||||||
|
push({ name: 'CrmReceivableDetail', params: { id: row.id } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 打开客户详情 */
|
||||||
|
function handleCustomerDetail(row: CrmReceivablePlanApi.Plan) {
|
||||||
|
push({ name: 'CrmCustomerDetail', params: { id: row.customerId } });
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 创建回款 */
|
||||||
|
function handleCreateReceivable(row: CrmReceivablePlanApi.Plan) {
|
||||||
|
formModalApi.setData({ plan: row }).open();
|
||||||
|
}
|
||||||
|
|
||||||
|
const [Grid] = useVbenVxeGrid({
|
||||||
|
formOptions: {
|
||||||
|
schema: [
|
||||||
|
{
|
||||||
|
fieldName: 'remindType',
|
||||||
|
label: '合同状态',
|
||||||
|
component: 'Select',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
options: RECEIVABLE_REMIND_TYPE,
|
||||||
|
},
|
||||||
|
defaultValue: RECEIVABLE_REMIND_TYPE[0]!.value,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
gridOptions: {
|
||||||
|
columns: useGridColumns(),
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
proxyConfig: {
|
||||||
|
ajax: {
|
||||||
|
query: async ({ page }, formValues) => {
|
||||||
|
return await getReceivablePlanPage({
|
||||||
|
pageNo: page.currentPage,
|
||||||
|
pageSize: page.pageSize,
|
||||||
|
...formValues,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
isHover: true,
|
||||||
|
},
|
||||||
|
toolbarConfig: {
|
||||||
|
refresh: true,
|
||||||
|
search: true,
|
||||||
|
},
|
||||||
|
} as VxeTableGridOptions<CrmReceivablePlanApi.Plan>,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<FormModal />
|
||||||
|
<Grid>
|
||||||
|
<template #customerName="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleCustomerDetail(row)">
|
||||||
|
{{ row.customerName }}
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #period="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleDetail(row)">{{
|
||||||
|
row.period
|
||||||
|
}}</ElButton>
|
||||||
|
</template>
|
||||||
|
<template #actions="{ row }">
|
||||||
|
<ElButton type="primary" link @click="handleCreateReceivable(row)">
|
||||||
|
创建回款
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
</Grid>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
Reference in New Issue
Block a user