From da308e80aa7b82de1a3088be2d43bb27cdb40ef0 Mon Sep 17 00:00:00 2001 From: jason <2667446@qq.com> Date: Thu, 19 Jun 2025 09:34:41 +0800 Subject: [PATCH 01/20] =?UTF-8?q?perf:=20[BPM=20=E5=B7=A5=E4=BD=9C?= =?UTF-8?q?=E6=B5=81]=20=E6=B5=81=E7=A8=8B=E5=8F=96=E6=B6=88=20confirm=20?= =?UTF-8?q?=E6=94=B9=E6=88=90=20prompt=20=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../bpm/processInstance/report/index.vue | 30 +++++++------------ 1 file changed, 11 insertions(+), 19 deletions(-) diff --git a/apps/web-antd/src/views/bpm/processInstance/report/index.vue b/apps/web-antd/src/views/bpm/processInstance/report/index.vue index 878ad8813..3ff85f6cc 100644 --- a/apps/web-antd/src/views/bpm/processInstance/report/index.vue +++ b/apps/web-antd/src/views/bpm/processInstance/report/index.vue @@ -2,10 +2,10 @@ import type { VxeTableGridOptions } from '#/adapter/vxe-table'; import type { BpmProcessInstanceApi } from '#/api/bpm/processInstance'; -import { h, nextTick, onMounted, ref } from 'vue'; +import { nextTick, onMounted, ref } from 'vue'; import { useRoute, useRouter } from 'vue-router'; -import { confirm, Page } from '@vben/common-ui'; +import { Page, prompt } from '@vben/common-ui'; import { Input, message } from 'ant-design-vue'; @@ -29,7 +29,6 @@ const processDefinitionId = query.processDefinitionId as string; const formFields = ref([]); const userList = ref([]); // 用户列表 const gridReady = ref(false); // 表格是否准备好 -const cancelReason = ref(''); // 取消原因 // 表格的列需要解析表单字段，这里定义成变量，解析表单字段后再渲染 let Grid: any = null; @@ -81,26 +80,19 @@ const handleDetail = (row: BpmProcessInstanceApi.ProcessInstance) => { /** 取消按钮操作 */ const handleCancel = async (row: BpmProcessInstanceApi.ProcessInstance) => { - cancelReason.value = ''; // 重置取消原因 - confirm({ + prompt({ + content: '请输入取消原因：', title: '取消流程', - content: h('div', [ - h('p', '请输入取消原因：'), - h(Input, { - value: cancelReason.value, - 'onUpdate:value': (val: string) => { - cancelReason.value = val; - }, - placeholder: '请输入取消原因', - }), - ]), - beforeClose: async ({ isConfirm }) => { - if (!isConfirm) return; - if (!cancelReason.value.trim()) { + icon: 'question', + component: Input, + modelPropName: 'value', + async beforeClose(scope) { + if (!scope.isConfirm) return; + if (!scope.value) { message.warning('请输入取消原因'); return false; } - await cancelProcessInstanceByAdmin(row.id, cancelReason.value); + await cancelProcessInstanceByAdmin(row.id, scope.value); return true; }, }).then(() => { From 4cc6cc45b1e38364842c3a0cfb238641aa677097 Mon Sep 17 00:00:00 2001 From: jason <2667446@qq.com> Date: Sat, 21 Jun 2025 16:53:33 +0800 Subject: [PATCH 02/20] =?UTF-8?q?feat:=20[BPM=20=E5=B7=A5=E4=BD=9C?= =?UTF-8?q?=E6=B5=81]=20Simple=20=E6=A8=A1=E5=9E=8B=E5=9B=BE=E6=B5=8F?= =?UTF-8?q?=E8=A7=88=E6=A8=A1=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/simple-process-model.vue | 2 +- .../components/simple-process-viewer.vue | 45 +++++ .../components/simple-process-design/index.ts | 4 + .../bpm/processInstance/detail/index.vue | 7 +- .../detail/modules/simple-bpm-viewer.vue | 181 +++++++++++++++++- 5 files changed, 232 insertions(+), 7 deletions(-) create mode 100644 apps/web-antd/src/components/simple-process-design/components/simple-process-viewer.vue diff --git a/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue b/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue index d50bd9d12..97fe9b2a1 100644 --- a/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue +++ b/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue @@ -249,7 +249,7 @@ onMounted(() => { /> - + +import type { SimpleFlowNode } from '../consts'; + +import { provide, ref, watch } from 'vue'; + +import { useWatchNode } from '../helpers'; +import SimpleProcessModel from './simple-process-model.vue'; + +defineOptions({ name: 'SimpleProcessViewer' }); + +const props = withDefaults( + defineProps<{ + flowNode: SimpleFlowNode; + // 流程实例 + processInstance?: any; + // 流程任务 + tasks?: any[]; + }>(), + { + processInstance: undefined, + tasks: () => [] as any[], + }, +); +const approveTasks = ref(props.tasks); +const currentProcessInstance = ref(props.processInstance); +const simpleModel = useWatchNode(props); +watch( + () => props.tasks, + (newValue) => { + approveTasks.value = newValue; + }, +); +watch( + () => props.processInstance, + (newValue) => { + currentProcessInstance.value = newValue; + }, +); +// 提供给后代组件使用 +provide('tasks', approveTasks); +provide('processInstance', currentProcessInstance); + + diff --git a/apps/web-antd/src/components/simple-process-design/index.ts b/apps/web-antd/src/components/simple-process-design/index.ts index ff79ef8cf..41269eae8 100644 --- a/apps/web-antd/src/components/simple-process-design/index.ts +++ b/apps/web-antd/src/components/simple-process-design/index.ts @@ -4,4 +4,8 @@ export { default as HttpRequestSetting } from './components/nodes-config/modules export { default as SimpleProcessDesigner } from './components/simple-process-designer.vue'; +export { default as SimpleProcessViewer } from './components/simple-process-viewer.vue'; + +export type { SimpleFlowNode } from './consts'; + export { parseFormFields } from './helpers'; diff --git a/apps/web-antd/src/views/bpm/processInstance/detail/index.vue b/apps/web-antd/src/views/bpm/processInstance/detail/index.vue index f86258ec5..cd2f220f8 100644 --- a/apps/web-antd/src/views/bpm/processInstance/detail/index.vue +++ b/apps/web-antd/src/views/bpm/processInstance/detail/index.vue @@ -346,7 +346,12 @@ onMounted(async () => { - +
-defineOptions({ name: 'ProcessInstanceSimpleViewer' }); - + + + From f15be6eade93f259fe916b778bb93d7c55ae1ecc Mon Sep 17 00:00:00 2001 From: xingyu4j Date: Sat, 21 Jun 2025 19:30:43 +0800 Subject: [PATCH 03/20] feat: format time utils --- packages/@core/base/shared/src/utils/time.ts | 313 +++++++++++++------ 1 file changed, 218 insertions(+), 95 deletions(-) diff --git a/packages/@core/base/shared/src/utils/time.ts b/packages/@core/base/shared/src/utils/time.ts index b73a211ef..979326c47 100644 --- a/packages/@core/base/shared/src/utils/time.ts +++ b/packages/@core/base/shared/src/utils/time.ts @@ -1,47 +1,67 @@ import dayjs from 'dayjs'; -import { isEmpty } from '.'; +import { formatDate } from './date'; -/** 时间段选择器拓展 */ -export function rangePickerExtend() { - return { - // 显示格式 - format: 'YYYY-MM-DD HH:mm:ss', - placeholder: ['开始时间', '结束时间'], - ranges: { - 今天: [dayjs().startOf('day'), dayjs().endOf('day')], - 最近7天: [ - dayjs().subtract(7, 'day').startOf('day'), - dayjs().endOf('day'), - ], - 最近30天: [ - dayjs().subtract(30, 'day').startOf('day'), - dayjs().endOf('day'), - ], - 昨天: [ - dayjs().subtract(1, 'day').startOf('day'), - dayjs().subtract(1, 'day').endOf('day'), - ], - 本周: [dayjs().startOf('week'), dayjs().endOf('day')], - 本月: [dayjs().startOf('month'), dayjs().endOf('day')], - }, - showTime: { - defaultValue: [ - dayjs('00:00:00', 'HH:mm:ss'), - dayjs('23:59:59', 'HH:mm:ss'), - ], - format: 'HH:mm:ss', - }, - transformDateFunc: (dates: any) => { - if (dates && dates.length === 2) { - // 格式化为后台支持的时间格式 - return [dates.createTime[0], dates.createTime[1]].join(','); +/** + * @param {Date | number | string} time 需要转换的时间 + * @param {string} fmt 需要转换的格式 如 yyyy-MM-dd、yyyy-MM-dd HH:mm:ss + */ +export function formatTime(time: Date | number | string, fmt: string) { + if (time) { + const date = new Date(time); + const o = { + 'M+': date.getMonth() + 1, + 'd+': date.getDate(), + 'H+': date.getHours(), + 'm+': date.getMinutes(), + 's+': date.getSeconds(), + 'q+': Math.floor((date.getMonth() + 3) / 3), + S: date.getMilliseconds(), + }; + const yearMatch = fmt.match(/y+/); + if (yearMatch) { + fmt = fmt.replace( + yearMatch[0], + `${date.getFullYear()}`.slice(4 - yearMatch[0].length), + ); + } + for (const k in o) { + const match = fmt.match(new RegExp(`(${k})`)); + if (match) { + fmt = fmt.replace( + match[0], + match[0].length === 1 + ? (o[k as keyof typeof o] as any) + : `00${o[k as keyof typeof o]}`.slice( + `${o[k as keyof typeof o]}`.length, + ), + ); } - return {}; - }, - // 如果需要10位时间戳（秒级）可以使用 valueFormat: 'X' - valueFormat: 'YYYY-MM-DD HH:mm:ss', - }; + } + return fmt; + } else { + return ''; + } +} + +/** + * 获取当前日期是第几周 + * @param dateTime 当前传入的日期值 + * @returns 返回第几周数字值 + */ +export function getWeek(dateTime: Date): number { + const temptTime = new Date(dateTime); + // 周几 + const weekday = temptTime.getDay() || 7; + // 周1+5天=周六 + temptTime.setDate(temptTime.getDate() - weekday + 1 + 5); + let firstDay = new Date(temptTime.getFullYear(), 0, 1); + const dayOfWeek = firstDay.getDay(); + let spendDay = 1; + if (dayOfWeek !== 0) spendDay = 7 - dayOfWeek + 1; + firstDay = new Date(temptTime.getFullYear(), 0, 1 + spendDay); + const d = Math.ceil((temptTime.valueOf() - firstDay.valueOf()) / 86_400_000); + return Math.ceil(d / 7); } /** @@ -94,10 +114,28 @@ export function formatPast( typeof param === 'string' || typeof param === 'object' ? new Date(param) : param; - return dayjs(date).format(format); + return formatDate(date, format) as string; } } +/** + * 时间问候语 + * @param param 当前时间，new Date() 格式 + * @description param 调用 `formatAxis(new Date())` 输出 `上午好` + * @returns 返回拼接后的时间字符串 + */ +export function formatAxis(param: Date): string { + const hour: number = new Date(param).getHours(); + if (hour < 6) return '凌晨好'; + else if (hour < 9) return '早上好'; + else if (hour < 12) return '上午好'; + else if (hour < 14) return '中午好'; + else if (hour < 17) return '下午好'; + else if (hour < 19) return '傍晚好'; + else if (hour < 22) return '晚上好'; + else return '夜里好'; +} + /** * 将毫秒，转换成时间字符串。例如说，xx 分钟 * @@ -105,22 +143,12 @@ export function formatPast( * @returns {string} 字符串 */ export function formatPast2(ms: number): string { - if (isEmpty(ms)) { - return ''; - } - // 定义时间单位常量，便于维护 - const SECOND = 1000; - const MINUTE = 60 * SECOND; - const HOUR = 60 * MINUTE; - const DAY = 24 * HOUR; - - // 计算各时间单位 - const day = Math.floor(ms / DAY); - const hour = Math.floor((ms % DAY) / HOUR); - const minute = Math.floor((ms % HOUR) / MINUTE); - const second = Math.floor((ms % MINUTE) / SECOND); - - // 根据时间长短返回不同格式 + const day = Math.floor(ms / (24 * 60 * 60 * 1000)); + const hour = Math.floor(ms / (60 * 60 * 1000) - day * 24); + const minute = Math.floor(ms / (60 * 1000) - day * 24 * 60 - hour * 60); + const second = Math.floor( + ms / 1000 - day * 24 * 60 * 60 - hour * 60 * 60 - minute * 60, + ); if (day > 0) { return `${day} 天${hour} 小时 ${minute} 分钟`; } @@ -134,43 +162,138 @@ export function formatPast2(ms: number): string { } /** - * @param {Date | number | string} time 需要转换的时间 - * @param {string} fmt 需要转换的格式 如 yyyy-MM-dd、yyyy-MM-dd HH:mm:ss + * 设置起始日期，时间为00:00:00 + * @param param 传入日期 + * @returns 带时间00:00:00的日期 */ -export function formatTime(time: Date | number | string, fmt: string) { - if (time) { - const date = new Date(time); - const o = { - 'M+': date.getMonth() + 1, - 'd+': date.getDate(), - 'H+': date.getHours(), - 'm+': date.getMinutes(), - 's+': date.getSeconds(), - 'q+': Math.floor((date.getMonth() + 3) / 3), - S: date.getMilliseconds(), - }; - const yearMatch = fmt.match(/y+/); - if (yearMatch) { - fmt = fmt.replace( - yearMatch[0], - `${date.getFullYear()}`.slice(4 - yearMatch[0].length), - ); - } - for (const k in o) { - const match = fmt.match(new RegExp(`(${k})`)); - if (match) { - fmt = fmt.replace( - match[0], - match[0].length === 1 - ? (o[k as keyof typeof o] as any) - : `00${o[k as keyof typeof o]}`.slice( - `${o[k as keyof typeof o]}`.length, - ), - ); - } - } - return fmt; - } else { - return ''; - } +export function beginOfDay(param: Date): Date { + return new Date( + param.getFullYear(), + param.getMonth(), + param.getDate(), + 0, + 0, + 0, + ); +} + +/** + * 设置结束日期，时间为23:59:59 + * @param param 传入日期 + * @returns 带时间23:59:59的日期 + */ +export function endOfDay(param: Date): Date { + return new Date( + param.getFullYear(), + param.getMonth(), + param.getDate(), + 23, + 59, + 59, + ); +} + +/** + * 计算两个日期间隔天数 + * @param param1 日期1 + * @param param2 日期2 + */ +export function betweenDay(param1: Date, param2: Date): number { + param1 = convertDate(param1); + param2 = convertDate(param2); + // 计算差值 + return Math.floor((param2.getTime() - param1.getTime()) / (24 * 3600 * 1000)); +} + +/** + * 日期计算 + * @param param1 日期 + * @param param2 添加的时间 + */ +export function addTime(param1: Date, param2: number): Date { + param1 = convertDate(param1); + return new Date(param1.getTime() + param2); +} + +/** + * 日期转换 + * @param param 日期 + */ +export function convertDate(param: Date | string): Date { + if (typeof param === 'string') { + return new Date(param); + } + return param; +} + +/** + * 指定的两个日期, 是否为同一天 + * @param a 日期 A + * @param b 日期 B + */ +export function isSameDay(a: dayjs.ConfigType, b: dayjs.ConfigType): boolean { + if (!a || !b) return false; + + const aa = dayjs(a); + const bb = dayjs(b); + return ( + aa.year() === bb.year() && + aa.month() === bb.month() && + aa.day() === bb.day() + ); +} + +/** + * 获取一天的开始时间、截止时间 + * @param date 日期 + * @param days 天数 + */ +export function getDayRange( + date: dayjs.ConfigType, + days: number, +): [dayjs.ConfigType, dayjs.ConfigType] { + const day = dayjs(date).add(days, 'd'); + return getDateRange(day, day); +} + +/** + * 获取最近7天的开始时间、截止时间 + */ +export function getLast7Days(): [dayjs.ConfigType, dayjs.ConfigType] { + const lastWeekDay = dayjs().subtract(7, 'd'); + const yesterday = dayjs().subtract(1, 'd'); + return getDateRange(lastWeekDay, yesterday); +} + +/** + * 获取最近30天的开始时间、截止时间 + */ +export function getLast30Days(): [dayjs.ConfigType, dayjs.ConfigType] { + const lastMonthDay = dayjs().subtract(30, 'd'); + const yesterday = dayjs().subtract(1, 'd'); + return getDateRange(lastMonthDay, yesterday); +} + +/** + * 获取最近1年的开始时间、截止时间 + */ +export function getLast1Year(): [dayjs.ConfigType, dayjs.ConfigType] { + const lastYearDay = dayjs().subtract(1, 'y'); + const yesterday = dayjs().subtract(1, 'd'); + return getDateRange(lastYearDay, yesterday); +} + +/** + * 获取指定日期的开始时间、截止时间 + * @param beginDate 开始日期 + * @param endDate 截止日期 + */ +export function getDateRange( + beginDate: dayjs.ConfigType, + endDate: dayjs.ConfigType, +): [string, string] { + return [ + dayjs(beginDate).startOf('d').format('YYYY-MM-DD HH:mm:ss'), + dayjs(endDate).endOf('d').format('YYYY-MM-DD HH:mm:ss'), + ]; } From 223c3e7a8aec4cd4a4344734751a091ef2397048 Mon Sep 17 00:00:00 2001 From: xingyu4j Date: Sat, 21 Jun 2025 19:45:31 +0800 Subject: [PATCH 04/20] feat: crm summary --- .../src/api/crm/statistics/customer.ts | 57 ++++-- .../src/views/crm/statistics/customer/data.ts | 135 ++++++++++++++ .../views/crm/statistics/customer/index.vue | 165 +++++++++++++++--- 3 files changed, 322 insertions(+), 35 deletions(-) create mode 100644 apps/web-antd/src/views/crm/statistics/customer/data.ts diff --git a/apps/web-antd/src/api/crm/statistics/customer.ts b/apps/web-antd/src/api/crm/statistics/customer.ts index e661ba81c..8bee0a383 100644 --- a/apps/web-antd/src/api/crm/statistics/customer.ts +++ b/apps/web-antd/src/api/crm/statistics/customer.ts @@ -1,5 +1,3 @@ -import type { PageParam } from '@vben/request'; - import { requestClient } from '#/api/request'; export namespace CrmStatisticsCustomerApi { @@ -93,10 +91,19 @@ export namespace CrmStatisticsCustomerApi { customerDealCycle: number; customerDealCount: number; } + + export interface CustomerSummaryParams { + times: string[]; + interval: number; + deptId: number; + userId: number; + } } /** 客户总量分析(按日期) */ -export function getCustomerSummaryByDate(params: PageParam) { +export function getCustomerSummaryByDate( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-customer-summary-by-date', { params }, @@ -104,7 +111,9 @@ export function getCustomerSummaryByDate(params: PageParam) { } /** 客户总量分析(按用户) */ -export function getCustomerSummaryByUser(params: PageParam) { +export function getCustomerSummaryByUser( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-customer-summary-by-user', { params }, @@ -112,7 +121,9 @@ export function getCustomerSummaryByUser(params: PageParam) { } /** 客户跟进次数分析(按日期) */ -export function getFollowUpSummaryByDate(params: PageParam) { +export function getFollowUpSummaryByDate( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-follow-up-summary-by-date', { params }, @@ -120,7 +131,9 @@ export function getFollowUpSummaryByDate(params: PageParam) { } /** 客户跟进次数分析(按用户) */ -export function getFollowUpSummaryByUser(params: PageParam) { +export function getFollowUpSummaryByUser( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-follow-up-summary-by-user', { params }, @@ -128,7 +141,9 @@ export function getFollowUpSummaryByUser(params: PageParam) { } /** 获取客户跟进方式统计数 */ -export function getFollowUpSummaryByType(params: PageParam) { +export function getFollowUpSummaryByType( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-follow-up-summary-by-type', { params }, @@ -136,7 +151,9 @@ export function getFollowUpSummaryByType(params: PageParam) { } /** 合同摘要信息(客户转化率页面) */ -export function getContractSummary(params: PageParam) { +export function getContractSummary( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-contract-summary', { params }, @@ -144,7 +161,9 @@ export function getContractSummary(params: PageParam) { } /** 获取客户公海分析(按日期) */ -export function getPoolSummaryByDate(params: PageParam) { +export function getPoolSummaryByDate( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-pool-summary-by-date', { params }, @@ -152,7 +171,9 @@ export function getPoolSummaryByDate(params: PageParam) { } /** 获取客户公海分析(按用户) */ -export function getPoolSummaryByUser(params: PageParam) { +export function getPoolSummaryByUser( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-pool-summary-by-user', { params }, @@ -160,7 +181,9 @@ export function getPoolSummaryByUser(params: PageParam) { } /** 获取客户成交周期(按日期) */ -export function getCustomerDealCycleByDate(params: PageParam) { +export function getCustomerDealCycleByDate( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-customer-deal-cycle-by-date', { params }, @@ -168,7 +191,9 @@ export function getCustomerDealCycleByDate(params: PageParam) { } /** 获取客户成交周期(按用户) */ -export function getCustomerDealCycleByUser(params: PageParam) { +export function getCustomerDealCycleByUser( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-customer-deal-cycle-by-user', { params }, @@ -176,7 +201,9 @@ export function getCustomerDealCycleByUser(params: PageParam) { } /** 获取客户成交周期(按地区) */ -export function getCustomerDealCycleByArea(params: PageParam) { +export function getCustomerDealCycleByArea( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get( '/crm/statistics-customer/get-customer-deal-cycle-by-area', { params }, @@ -184,7 +211,9 @@ export function getCustomerDealCycleByArea(params: PageParam) { } /** 获取客户成交周期(按产品) */ -export function getCustomerDealCycleByProduct(params: PageParam) { +export function getCustomerDealCycleByProduct( + params: CrmStatisticsCustomerApi.CustomerSummaryParams, +) { return requestClient.get< CrmStatisticsCustomerApi.CustomerDealCycleByProduct[] >('/crm/statistics-customer/get-customer-deal-cycle-by-product', { params }); diff --git a/apps/web-antd/src/views/crm/statistics/customer/data.ts b/apps/web-antd/src/views/crm/statistics/customer/data.ts new file mode 100644 index 000000000..447cf54d8 --- /dev/null +++ b/apps/web-antd/src/views/crm/statistics/customer/data.ts @@ -0,0 +1,135 @@ +import type { VbenFormSchema } from '#/adapter/form'; +import type { VxeTableGridOptions } from '#/adapter/vxe-table'; + +import { useUserStore } from '@vben/stores'; +import { + beginOfDay, + endOfDay, + erpCalculatePercentage, + formatDateTime, + handleTree, +} from '@vben/utils'; + +import { getSimpleDeptList } from '#/api/system/dept'; +import { getSimpleUserList } from '#/api/system/user'; +import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils'; + +const userStore = useUserStore(); + +/** 列表的搜索表单 */ +export function useGridFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'times', + label: '时间范围', + component: 'RangePicker', + componentProps: { + ...getRangePickerDefaultProps(), + }, + defaultValue: [ + formatDateTime(beginOfDay(new Date(Date.now() - 3600 * 1000 * 24 * 7))), + formatDateTime(endOfDay(new Date(Date.now() - 3600 * 1000 * 24))), + ] as [Date, Date], + }, + { + fieldName: 'interval', + label: '时间间隔', + component: 'Select', + componentProps: { + allowClear: true, + options: getDictOptions(DICT_TYPE.DATE_INTERVAL, 'number'), + }, + defaultValue: 2, + }, + { + fieldName: 'deptId', + label: '归属部门', + component: 'ApiTreeSelect', + componentProps: { + api: async () => { + const data = await getSimpleDeptList(); + return handleTree(data); + }, + labelField: 'name', + valueField: 'id', + childrenField: 'children', + treeDefaultExpandAll: true, + }, + defaultValue: userStore.userInfo?.deptId, + }, + { + fieldName: 'userId', + label: '员工', + component: 'ApiSelect', + componentProps: { + api: getSimpleUserList, + allowClear: true, + labelField: 'nickname', + valueField: 'id', + }, + }, + ]; +} + +/** 列表的字段 */ +export function useSummaryGridColumns(): VxeTableGridOptions['columns'] { + return [ + { + type: 'seq', + title: '序号', + }, + { + field: 'ownerUserName', + title: '员工姓名', + minWidth: 100, + }, + { + field: 'customerCreateCount', + title: '新增客户数', + minWidth: 200, + }, + { + field: 'customerDealCount', + title: '成交客户数', + minWidth: 200, + }, + { + field: 'customerDealRate', + title: '客户成交率(%)', + minWidth: 200, + formatter: ({ row }) => { + return erpCalculatePercentage( + row.customerDealCount, + row.customerCreateCount, + ); + }, + }, + { + field: 'contractPrice', + title: '合同总金额', + minWidth: 200, + formatter: 'formatAmount2', + }, + { + field: 'receivablePrice', + title: '回款金额', + minWidth: 200, + formatter: 'formatAmount2', + }, + { + field: 'creceivablePrice', + title: '未回款金额', + minWidth: 200, + formatter: ({ row }) => { + return erpCalculatePercentage(row.receivablePrice, row.contractPrice); + }, + }, + { + field: 'ccreceivablePrice', + title: '回款完成率(%)', + formatter: ({ row }) => { + return erpCalculatePercentage(row.receivablePrice, row.contractPrice); + }, + }, + ]; +} diff --git a/apps/web-antd/src/views/crm/statistics/customer/index.vue b/apps/web-antd/src/views/crm/statistics/customer/index.vue index f86e725c7..69b674150 100644 --- a/apps/web-antd/src/views/crm/statistics/customer/index.vue +++ b/apps/web-antd/src/views/crm/statistics/customer/index.vue @@ -1,28 +1,151 @@ From ae95eb33672cf976bc8b71c9d750baea429580a7 Mon Sep 17 00:00:00 2001 From: jason <2667446@qq.com> Date: Sat, 21 Jun 2025 22:05:40 +0800 Subject: [PATCH 05/20] =?UTF-8?q?feat:=20[BPM=20=E5=B7=A5=E4=BD=9C?= =?UTF-8?q?=E6=B5=81]=20Simple=20=E6=B5=8F=E8=A7=88=E6=A8=A1=E5=BC=8F?= =?UTF-8?q?=E5=BC=B9=E7=AA=97=E6=98=BE=E7=A4=BA=E5=AE=A1=E6=89=B9=E8=AE=B0?= =?UTF-8?q?=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/nodes/end-event-node.vue | 29 ++++++--- .../nodes/modules/process-instance-data.ts | 56 +++++++++++++++++ .../nodes/modules/process-instance-modal.vue | 44 +++++++++++++ .../nodes/modules/task-list-data.ts | 61 +++++++++++++++++++ .../nodes/modules/task-list-modal.vue | 47 ++++++++++++++ .../components/nodes/start-user-node.vue | 29 +++++---- .../components/nodes/user-task-node.vue | 42 +++++++++++-- 7 files changed, 283 insertions(+), 25 deletions(-) create mode 100644 apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-data.ts create mode 100644 apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-modal.vue create mode 100644 apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-data.ts create mode 100644 apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-modal.vue diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/end-event-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/end-event-node.vue index c03fac9c9..bf6a2c1a9 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/end-event-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/end-event-node.vue @@ -5,7 +5,10 @@ import type { SimpleFlowNode } from '../../consts'; import { inject, ref } from 'vue'; +import { useVbenModal } from '@vben/common-ui'; + import { useTaskStatusClass, useWatchNode } from '../../helpers'; +import ProcessInstanceModal from './modules/process-instance-modal.vue'; defineOptions({ name: 'EndEventNode' }); const props = defineProps({ @@ -20,15 +23,26 @@ const currentNode = useWatchNode(props); const readonly = inject('readonly'); const processInstance = inject>('processInstance', ref({})); -const processInstanceInfos = ref([]); // 流程的审批信息 +const [Modal, modalApi] = useVbenModal({ + connectedComponent: ProcessInstanceModal, + destroyOnClose: true, +}); function nodeClick() { if (readonly && processInstance && processInstance.value) { - console.warn( - 'TODO 只读模式，弹窗显示审批信息', - processInstance.value, - processInstanceInfos.value, - ); + const processInstanceInfo = [ + { + startUser: processInstance.value.startUser, + createTime: processInstance.value.startTime, + endTime: processInstance.value.endTime, + status: processInstance.value.status, + durationInMillis: processInstance.value.durationInMillis, + }, + ]; + modalApi + .setData(processInstanceInfo) + .setState({ title: '流程信息' }) + .open(); } } @@ -42,5 +56,6 @@ function nodeClick() { 结束
- + + diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-data.ts b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-data.ts new file mode 100644 index 000000000..b9f58027d --- /dev/null +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-data.ts @@ -0,0 +1,56 @@ +import type { VxeTableGridOptions } from '@vben/plugins/vxe-table'; + +import { DICT_TYPE } from '#/utils'; + +/** 流程实例列表字段 */ +export function useGridColumns(): VxeTableGridOptions['columns'] { + return [ + { + field: 'startUser', + title: '发起人', + slots: { + default: ({ row }: { row: any }) => { + return row.startUser?.nickname; + }, + }, + minWidth: 100, + }, + { + field: 'deptName', + title: '部门', + slots: { + default: ({ row }: { row: any }) => { + return row.startUser?.deptName; + }, + }, + minWidth: 100, + }, + { + field: 'createTime', + title: '开始时间', + formatter: 'formatDateTime', + minWidth: 140, + }, + { + field: 'endTime', + title: '结束时间', + formatter: 'formatDateTime', + minWidth: 140, + }, + { + field: 'status', + title: '流程状态', + minWidth: 90, + cellRender: { + name: 'CellDict', + props: { type: DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS }, + }, + }, + { + field: 'durationInMillis', + title: '耗时', + minWidth: 100, + formatter: 'formatPast2', + }, + ]; +} diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-modal.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-modal.vue new file mode 100644 index 000000000..e9ddbf34b --- /dev/null +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/process-instance-modal.vue @@ -0,0 +1,44 @@ + + + diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-data.ts b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-data.ts new file mode 100644 index 000000000..124ec6142 --- /dev/null +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-data.ts @@ -0,0 +1,61 @@ +import type { VxeTableGridOptions } from '@vben/plugins/vxe-table'; + +import { DICT_TYPE } from '#/utils'; + +/** 审批记录列表字段 */ +export function useGridColumns(): VxeTableGridOptions['columns'] { + return [ + { + field: 'assigneeUser', + title: '审批人', + slots: { + default: ({ row }: { row: any }) => { + return row.assigneeUser?.nickname || row.ownerUser?.nickname; + }, + }, + minWidth: 100, + }, + { + field: 'deptName', + title: '部门', + slots: { + default: ({ row }: { row: any }) => { + return row.assigneeUser?.deptName || row.ownerUser?.deptName; + }, + }, + minWidth: 100, + }, + { + field: 'createTime', + title: '开始时间', + formatter: 'formatDateTime', + minWidth: 140, + }, + { + field: 'endTime', + title: '结束时间', + formatter: 'formatDateTime', + minWidth: 140, + }, + { + field: 'status', + title: '审批状态', + minWidth: 90, + cellRender: { + name: 'CellDict', + props: { type: DICT_TYPE.BPM_TASK_STATUS }, + }, + }, + { + field: 'reason', + title: '审批建议', + minWidth: 160, + }, + { + field: 'durationInMillis', + title: '耗时', + minWidth: 100, + formatter: 'formatPast2', + }, + ]; +} diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-modal.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-modal.vue new file mode 100644 index 000000000..a5e7e40e7 --- /dev/null +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/modules/task-list-modal.vue @@ -0,0 +1,47 @@ + + + diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue index 74fffa992..c6acbe0ec 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue @@ -6,6 +6,7 @@ import type { SimpleFlowNode } from '../../consts'; import { inject, ref } from 'vue'; +import { useVbenModal } from '@vben/common-ui'; import { IconifyIcon } from '@vben/icons'; import { Input } from 'ant-design-vue'; @@ -15,6 +16,7 @@ import { BpmNodeTypeEnum } from '#/utils'; import { NODE_DEFAULT_TEXT } from '../../consts'; import { useNodeName2, useTaskStatusClass, useWatchNode } from '../../helpers'; import StartUserNodeConfig from '../nodes-config/start-user-node-config.vue'; +import TaskListModal from './modules/task-list-modal.vue'; import NodeHandler from './node-handler.vue'; defineOptions({ name: 'StartUserNode' }); @@ -27,7 +29,6 @@ const props = defineProps({ }); // 定义事件，更新父组件。 -// const emits = defineEmits<{ defineEmits<{ 'update:modelValue': [node: SimpleFlowNode | undefined]; }>(); @@ -44,24 +45,25 @@ const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( const nodeSetting = ref(); -// 任务的弹窗显示，用于只读模式 -const selectTasks = ref([]); // 选中的任务数组 - +const [Modal, modalApi] = useVbenModal({ + connectedComponent: TaskListModal, + destroyOnClose: true, +}); function nodeClick() { if (readonly) { // 只读模式，弹窗显示任务信息 if (tasks && tasks.value) { - console.warn( - 'TODO 只读模式，弹窗显示任务信息', - tasks.value, - selectTasks.value, + // 过滤出当前节点的任务 + const nodeTasks = tasks.value.filter( + (task) => task.taskDefinitionKey === currentNode.value.id, ); + // 弹窗显示任务信息 + modalApi + .setData(nodeTasks) + .setState({ title: currentNode.value.name }) + .open(); } } else { - console.warn( - 'TODO 编辑模式，打开节点配置、把当前节点传递给配置组件', - nodeSetting.value, - ); nodeSetting.value.showStartUserNodeConfig(currentNode.value); } } @@ -122,5 +124,6 @@ function nodeClick() { ref="nodeSetting" :flow-node="currentNode" /> - + + diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue index 3acb853ca..9f7ee6bf1 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue @@ -5,6 +5,7 @@ import type { SimpleFlowNode } from '../../consts'; import { inject, ref } from 'vue'; +import { useVbenModal } from '@vben/common-ui'; import { IconifyIcon } from '@vben/icons'; import { Input } from 'ant-design-vue'; @@ -14,6 +15,26 @@ import { BpmNodeTypeEnum } from '#/utils'; import { NODE_DEFAULT_TEXT } from '../../consts'; import { useNodeName2, useTaskStatusClass, useWatchNode } from '../../helpers'; import UserTaskNodeConfig from '../nodes-config/user-task-node-config.vue'; +import TaskListModal from './modules/task-list-modal.vue'; +// // 使用useVbenVxeGrid +// const [Grid, gridApi] = useVbenVxeGrid({ +// gridOptions: { +// columns: columns.value, +// keepSource: true, +// border: true, +// height: 'auto', +// data: selectTasks.value, +// rowConfig: { +// keyField: 'id', +// }, +// pagerConfig: { +// enabled: false, +// }, +// toolbarConfig: { +// enabled: false, +// }, +// } as VxeTableGridOptions, +// }); import NodeHandler from './node-handler.vue'; defineOptions({ name: 'UserTaskNode' }); @@ -42,11 +63,23 @@ const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( ); const nodeSetting = ref(); +const [Modal, modalApi] = useVbenModal({ + connectedComponent: TaskListModal, + destroyOnClose: true, +}); + function nodeClick() { if (readonly) { if (tasks && tasks.value) { - // 只读模式，弹窗显示任务信息 TODO 待实现 - console.warn('只读模式，弹窗显示任务信息待实现'); + // 过滤出当前节点的任务 + const nodeTasks = tasks.value.filter( + (task) => task.taskDefinitionKey === currentNode.value.id, + ); + // 弹窗显示任务信息 + modalApi + .setData(nodeTasks) + .setState({ title: currentNode.value.name }) + .open(); } } else { // 编辑模式，打开节点配置、把当前节点传递给配置组件 @@ -64,8 +97,6 @@ function findReturnTaskNodes( // 从父节点查找 emits('findParentNode', matchNodeList, BpmNodeTypeEnum.USER_TASK_NODE); } - -// const selectTasks = ref([]); // 选中的任务数组 From 1c8c3c956c64e6dbd83e1cabf4ba6bc66bf0beae Mon Sep 17 00:00:00 2001 From: YunaiV Date: Sun, 22 Jun 2025 11:14:58 +0800 Subject: [PATCH 06/20] =?UTF-8?q?review=EF=BC=9A=E3=80=90ANTD=E3=80=91?= =?UTF-8?q?=E7=9B=B8=E5=85=B3=E7=9A=84=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/table-action/table-action.vue | 21 ++++++++++--------- .../effects/layouts/src/widgets/help/help.vue | 1 + .../tenant-dropdown/tenant-dropdown.vue | 1 + 3 files changed, 13 insertions(+), 10 deletions(-) diff --git a/apps/web-antd/src/components/table-action/table-action.vue b/apps/web-antd/src/components/table-action/table-action.vue index 88e47d356..93d30fbd9 100644 --- a/apps/web-antd/src/components/table-action/table-action.vue +++ b/apps/web-antd/src/components/table-action/table-action.vue @@ -41,11 +41,12 @@ const props = defineProps({ const { hasAccessByCodes } = useAccess(); -/** 缓存处理后的actions */ +/** 缓存处理后的 actions */ const processedActions = ref([]); const processedDropdownActions = ref([]); /** 用于比较的字符串化版本 */ +// TODO @xingyu：下面的拼写错误，需要修改 const actionsStringified = ref(''); const dropdownActionsStringified = ref(''); @@ -65,7 +66,7 @@ function isIfShow(action: ActionItem): boolean { return isIfShow; } -/** 处理actions的纯函数 */ +/** 处理 actions 的纯函数 */ function processActions(actions: ActionItem[]): any[] { return actions .filter((action: ActionItem) => { @@ -84,7 +85,7 @@ function processActions(actions: ActionItem[]): any[] { }); } -/** 处理下拉菜单actions的纯函数 */ +/** 处理下拉菜单 actions 的纯函数 */ function processDropdownActions( dropDownActions: ActionItem[], divider: boolean, @@ -108,7 +109,7 @@ function processDropdownActions( }); } -/** 监听actions变化并更新缓存 */ +/** 监听 actions 变化并更新缓存 */ watchEffect(() => { const rawActions = toRaw(props.actions) || []; const currentStringified = JSON.stringify( @@ -127,7 +128,7 @@ watchEffect(() => { } }); -/** 监听dropDownActions变化并更新缓存 */ +/** 监听 dropDownActions 变化并更新缓存 */ watchEffect(() => { const rawDropDownActions = toRaw(props.dropDownActions) || []; const currentStringified = JSON.stringify({ @@ -154,14 +155,14 @@ const getActions = computed(() => processedActions.value); const getDropdownList = computed(() => processedDropdownActions.value); -/** 缓存Space组件的size计算结果 */ +/** 缓存 Space 组件的 size 计算结果 */ const spaceSize = computed(() => { return unref(getActions)?.some((item: ActionItem) => item.type === 'link') ? 0 : 8; }); -/** 缓存PopConfirm属性 */ +/** 缓存 PopConfirm 属性 */ const popConfirmPropsMap = new Map(); function getPopConfirmProps(attrs: PopConfirm) { @@ -191,7 +192,7 @@ function getPopConfirmProps(attrs: PopConfirm) { return originAttrs; } -/** 缓存Button属性 */ +/** 缓存 Button 属性 */ const buttonPropsMap = new Map(); function getButtonProps(action: ActionItem) { @@ -217,7 +218,7 @@ function getButtonProps(action: ActionItem) { return res; } -/** 缓存Tooltip属性 */ +/** 缓存 Tooltip 属性 */ const tooltipPropsMap = new Map(); function getTooltipProps(tooltip: any | string) { @@ -243,7 +244,7 @@ function handleMenuClick(e: any) { } } -/** 生成稳定的key */ +/** 生成稳定的 key */ function getActionKey(action: ActionItem, index: number) { return `${action.label || ''}-${action.type || ''}-${index}`; } diff --git a/packages/effects/layouts/src/widgets/help/help.vue b/packages/effects/layouts/src/widgets/help/help.vue index ca3c79c8c..640da3453 100644 --- a/packages/effects/layouts/src/widgets/help/help.vue +++ b/packages/effects/layouts/src/widgets/help/help.vue @@ -29,6 +29,7 @@ const [Modal, modalApi] = useVbenModal({
+

项目地址: