tashow/tashow-manager
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 基本信息

Browse Source
This commit is contained in:
wuxichen
2025-10-17 17:43:42 +08:00
parent 3c7473f8d1
commit 263a7d3e20
20 changed files with 1745 additions and 492 deletions
Download Patch File Download Diff File Expand all files Collapse all files

845
mock/login.ts
View File

@@ -20,4 +20,849 @@ export default {
userId: 1,
},
},
"GET /admin-api/system/auth/get-permission-info": {
data: {
user: {
id: 1,
nickname: "芋道源码",
avatar:
"http://test.yudao.iocoder.cn/bf2002b38950c904243be7c825d3f82e29f25a44526583c3fde2ebdff3a87f75.png",
deptId: 103,
},
roles: ["super_admin"],
permissions: [
"",
"infra:config:create",
"system:menu:query",
"infra:file-config:query",
"infra:config:export",
"system:user:query",
"infra:file-config:create",
"system:user:export",
"system:dept:update",
"infra:api-access-log:export",
"infra:data-source-config:update",
"system:dept:query",
"infra:file-config:export",
"infra:demo01-contact:query",
"system:tenant-package:delete",
"infra:demo02-category:query",
"system:role:delete",
"system:dept:create",
"system:menu:create",
"infra:codegen:download",
"system:dict:query",
"infra:api-error-log:query",
"infra:demo03-student:delete",
"system:dict:update",
"infra:demo01-contact:delete",
"infra:job:delete",
"system:tenant:export",
"system:post:update",
"infra:api-error-log:update-status",
"system:tenant:create",
"infra:demo02-category:update",
"system:post:export",
"infra:file:delete",
"infra:data-source-config:create",
"infra:job:trigger",
"system:menu:update",
"infra:demo02-category:delete",
"system:login-log:query",
"system:role:update",
"system:login-log:export",
"system:user:create",
"system:role:export",
"infra:file-config:update",
"infra:demo01-contact:update",
"system:permission:assign-user-role",
"system:post:delete",
"infra:demo03-student:create",
"infra:config:update",
"infra:job:update",
"infra:job:export",
"infra:demo01-contact:export",
"infra:api-error-log:export",
"infra:demo02-category:export",
"infra:job:create",
"system:permission:assign-role-menu",
"infra:config:query",
"infra:demo02-category:create",
"system:dept:delete",
"system:tenant:update",
"ai:sample:tag",
"system:tenant-package:update",
"infra:codegen:create",
"infra:data-source-config:delete",
"infra:file-config:delete",
"infra:codegen:preview",
"system:dict:create",
"infra:api-access-log:query",
"infra:redis:get-monitor-info",
"infra:file:query",
"infra:config:delete",
"system:user:update-password",
"system:dict:export",
"system:post:query",
"system:post:create",
"infra:codegen:delete",
"infra:redis:get-key-list",
"system:user:delete",
"infra:build:list",
"infra:codegen:update",
"infra:data-source-config:export",
"system:user:import",
"infra:swagger:list",
"infra:job:query",
"system:user:update",
"system:menu:delete",
"infra:data-source-config:query",
"system:permission:assign-role-data-scope",
"system:tenant-package:create",
"infra:demo03-student:update",
"system:user:list",
"infra:demo01-contact:create",
"system:operate-log:query",
"infra:codegen:query",
"system:tenant:delete",
"system:tenant-package:query",
"system:role:create",
"infra:demo03-student:query",
"system:dict:delete",
"system:operate-log:export",
"system:role:query",
"infra:demo03-student:export",
],
menus: [
{
id: 5015,
parentId: 0,
name: "商品管理",
path: "/prod",
component: "",
componentName: "",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 5016,
parentId: 5015,
name: "商品管理",
path: "list",
component: "prod/prod-manager/index",
componentName: "ProdManagerList",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5022,
parentId: 5015,
name: "类目管理",
path: "category",
component: "prod/category-manager/index",
componentName: "CategoryManager",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 5001,
parentId: 0,
name: "系统管理1",
path: "/system1",
component: "",
componentName: "",
icon: "ep:setting",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 5003,
parentId: 5001,
name: "租户管理",
path: "tenant",
component: "",
componentName: "",
icon: "fa-solid:house-user",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 5004,
parentId: 5003,
name: "租户列表",
path: "list",
component: "system/tenant/list/index",
componentName: "SystemTenantListIndex",
icon: "ep:list",
visible: true,
keepAlive: false,
alwaysShow: true,
children: null,
},
{
id: 5005,
parentId: 5003,
name: "租户套餐",
path: "package",
component: "system/tenant/package/index",
componentName: "SystemPackage",
icon: "fa:align-justify",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 5007,
parentId: 5001,
name: "用户管理",
path: "user",
component: "system/user/index",
componentName: "SystemUserIndex",
icon: "ep:user-filled",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5006,
parentId: 5001,
name: "角色管理",
path: "role",
component: "system/role/index",
componentName: "SystemRoleIndex",
icon: "ep:user",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5008,
parentId: 5001,
name: "菜单管理",
path: "menu",
component: "system/menu/index",
componentName: "SystemMenuIndex",
icon: "ep:menu",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5009,
parentId: 5001,
name: "字典管理",
path: "dict",
component: "system/dict/index",
componentName: "SystemDictIndex",
icon: "ep:search",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5019,
parentId: 5001,
name: "部门管理",
path: "dept",
component: "system/dept/index",
componentName: null,
icon: "#",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5020,
parentId: 5001,
name: "审计日志",
path: "log",
component: "",
componentName: "",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 5021,
parentId: 5020,
name: "操作日志",
path: "operate",
component: "system/log/operate/index",
componentName: "SystemOperateLog",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
],
},
{
id: 5055,
parentId: 0,
name: "AI",
path: "/ai",
component: "",
componentName: "",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 5057,
parentId: 5055,
name: "样本管理",
path: "sample-tag",
component: "ai/sample-tag/index",
componentName: "AiSampleTag",
icon: "",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 1,
parentId: 0,
name: "系统管理",
path: "/system",
component: null,
componentName: null,
icon: "ep:tools",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 1224,
parentId: 1,
name: "租户管理",
path: "tenant",
component: null,
componentName: null,
icon: "fa-solid:house-user",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 1138,
parentId: 1224,
name: "租户列表",
path: "list",
component: "system/tenant/index",
componentName: "SystemTenant",
icon: "ep:house",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1225,
parentId: 1224,
name: "租户套餐",
path: "package",
component: "system/tenantPackage/index",
componentName: "SystemTenantPackage",
icon: "fa:bars",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 100,
parentId: 1,
name: "用户管理",
path: "user",
component: "system/user/index",
componentName: "SystemUser",
icon: "ep:avatar",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 101,
parentId: 1,
name: "角色管理",
path: "role",
component: "system/role/index",
componentName: "SystemRole",
icon: "ep:user",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 102,
parentId: 1,
name: "菜单管理",
path: "menu",
component: "system/menu/index",
componentName: "SystemMenu",
icon: "ep:menu",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 103,
parentId: 1,
name: "部门管理",
path: "dept",
component: "system/dept/index",
componentName: "SystemDept",
icon: "fa:address-card",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 104,
parentId: 1,
name: "岗位管理",
path: "post",
component: "system/post/index",
componentName: "SystemPost",
icon: "fa:address-book-o",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 105,
parentId: 1,
name: "字典管理",
path: "dict",
component: "system/dict/index",
componentName: "SystemDictType",
icon: "ep:collection",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 5058,
parentId: 1,
name: "字典详情",
path: "dict/data/:type",
component: "system/dict/data/index",
componentName: "SyStemDictData",
icon: "#",
visible: false,
keepAlive: true,
alwaysShow: false,
children: null,
},
{
id: 108,
parentId: 1,
name: "审计日志",
path: "log",
component: "",
componentName: null,
icon: "ep:document-copy",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 500,
parentId: 108,
name: "操作日志",
path: "operate-log",
component: "system/operatelog/index",
componentName: "SystemOperateLog",
icon: "ep:position",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 501,
parentId: 108,
name: "登录日志",
path: "login-log",
component: "system/loginlog/index",
componentName: "SystemLoginLog",
icon: "ep:promotion",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
],
},
{
id: 2,
parentId: 0,
name: "基础设施",
path: "/infra",
component: null,
componentName: null,
icon: "ep:monitor",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 115,
parentId: 2,
name: "代码生成",
path: "codegen",
component: "infra/codegen/index",
componentName: "InfraCodegen",
icon: "ep:document-copy",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1070,
parentId: 2,
name: "代码生成案例",
path: "demo",
component: "infra/testDemo/index",
componentName: null,
icon: "ep:aim",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 2478,
parentId: 1070,
name: "单表（增删改查）",
path: "demo01-contact",
component: "infra/demo/demo01/index",
componentName: "Demo01Contact",
icon: "ep:bicycle",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 2484,
parentId: 1070,
name: "树表（增删改查）",
path: "demo02-category",
component: "infra/demo/demo02/index",
componentName: "Demo02Category",
icon: "fa:tree",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 2490,
parentId: 1070,
name: "主子表（标准）",
path: "demo03-normal",
component: "infra/demo/demo03/normal/index",
componentName: "Demo03StudentNormal",
icon: "fa:battery-3",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 2497,
parentId: 1070,
name: "主子表（ERP）",
path: "demo03-erp",
component: "infra/demo/demo03/erp/index",
componentName: "Demo03StudentERP",
icon: "ep:calendar",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 2472,
parentId: 1070,
name: "主子表（内嵌）",
path: "demo03-inner",
component: "infra/demo/demo03/inner/index",
componentName: "Demo03StudentInner",
icon: "fa:power-off",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 1255,
parentId: 2,
name: "数据源配置",
path: "data-source-config",
component: "infra/dataSourceConfig/index",
componentName: "InfraDataSourceConfig",
icon: "ep:data-analysis",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 114,
parentId: 2,
name: "表单构建",
path: "build",
component: "infra/build/index",
componentName: "InfraBuild",
icon: "fa:wpforms",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 116,
parentId: 2,
name: "API 接口",
path: "swagger",
component: "infra/swagger/index",
componentName: "InfraSwagger",
icon: "fa:fighter-jet",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1083,
parentId: 2,
name: "API 日志",
path: "log",
component: null,
componentName: null,
icon: "fa:tasks",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 1078,
parentId: 1083,
name: "访问日志",
path: "api-access-log",
component: "infra/apiAccessLog/index",
componentName: "InfraApiAccessLog",
icon: "ep:place",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1084,
parentId: 1083,
name: "错误日志",
path: "api-error-log",
component: "infra/apiErrorLog/index",
componentName: "InfraApiErrorLog",
icon: "ep:warning-filled",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 2525,
parentId: 2,
name: "WebSocket",
path: "websocket",
component: "infra/webSocket/index",
componentName: "InfraWebSocket",
icon: "ep:connection",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1243,
parentId: 2,
name: "文件管理",
path: "file",
component: null,
componentName: "",
icon: "ep:files",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 1237,
parentId: 1243,
name: "文件配置",
path: "file-config",
component: "infra/fileConfig/index",
componentName: "InfraFileConfig",
icon: "fa-solid:file-signature",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1090,
parentId: 1243,
name: "文件列表",
path: "file",
component: "infra/file/index",
componentName: "InfraFile",
icon: "ep:upload-filled",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
{
id: 110,
parentId: 2,
name: "定时任务",
path: "job",
component: "infra/job/index",
componentName: "InfraJob",
icon: "fa-solid:tasks",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 106,
parentId: 2,
name: "配置管理",
path: "config",
component: "infra/config/index",
componentName: "InfraConfig",
icon: "fa:connectdevelop",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 2740,
parentId: 2,
name: "监控中心",
path: "monitors",
component: "",
componentName: "",
icon: "ep:monitor",
visible: true,
keepAlive: true,
alwaysShow: true,
children: [
{
id: 111,
parentId: 2740,
name: "MySQL 监控",
path: "druid",
component: "infra/druid/index",
componentName: "InfraDruid",
icon: "fa-solid:box",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 113,
parentId: 2740,
name: "Redis 监控",
path: "redis",
component: "infra/redis/index",
componentName: "InfraRedis",
icon: "fa:reddit-square",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 112,
parentId: 2740,
name: "Java 监控",
path: "admin-server",
component: "infra/server/index",
componentName: "InfraAdminServer",
icon: "ep:coffee-cup",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
{
id: 1077,
parentId: 2740,
name: "链路追踪",
path: "skywalking",
component: "infra/skywalking/index",
componentName: "InfraSkyWalking",
icon: "fa:eye",
visible: true,
keepAlive: true,
alwaysShow: true,
children: null,
},
],
},
],
},
],
},
},
};

270
mock/order.ts
View File

@@ -14,7 +14,7 @@ const getOrderPage = (_req: Request, res: Response) => {
userNickName: "张宁清", // 用户昵称
userAvatar: "", // 用户头像
userMobile: "18634556151", // 用户手机号
orderStatus: 2, // 订单状态
orderStatus: 10, // 订单状态
picUrl: "", // 商品图片
spuName:
"商品主标题商品主标题商品主标题商品主标题商品主题商品主标题商品主标题商品主", // 商品名称
@@ -24,7 +24,7 @@ const getOrderPage = (_req: Request, res: Response) => {
handedPrice: 80, // 到手价
payPrice: "500", // 应付金额
unit: "", // 单位
subTime: "", // 预约时间
subTime: 1760585499000, // 预约时间
serveAddress: "张宁清,18659156151,福州 台江区 鳌峰路 万达中心甲",
userRemark: "你好呀你好元", // 用户备注
payType: "wx", // 微信
@@ -34,14 +34,150 @@ const getOrderPage = (_req: Request, res: Response) => {
id: 2,
orderNum: "3214421412",
createTime: "",
orderCategoryName: "",
orderCategoryName: "宠物殡葬",
orderTerminal: 0,
userId: 0,
userName: "",
userNickName: "",
userAvatar: "",
userMobile: "",
orderStatus: 0,
orderStatus: 20,
picUrl: "",
spuName: "",
skuName: "",
subTime: 1760585499000, // 预约时间
count: 0,
price: 0,
handedPrice: 0,
payPrice: 0,
unit: "",
orderTime: "",
serveAddress: "",
userRemark: "",
payType: "",
financeStatus: "",
},
{
id: 3,
orderNum: "3214421412",
createTime: "",
orderCategoryName: "宠物殡葬",
orderTerminal: 0,
userId: 0,
userName: "",
subTime: 1760585499000, // 预约时间
userNickName: "",
userAvatar: "",
userMobile: "",
orderStatus: 30,
picUrl: "",
spuName: "",
skuName: "",
count: 0,
price: 0,
handedPrice: 0,
payPrice: 0,
unit: "",
orderTime: "",
serveAddress: "",
userRemark: "",
payType: "",
financeStatus: "",
},
{
id: 4,
orderNum: "3214421412",
createTime: "",
orderCategoryName: "宠物殡葬",
orderTerminal: 0,
userId: 0,
userName: "",
subTime: 1760585499000, // 预约时间
userNickName: "",
userAvatar: "",
userMobile: "",
orderStatus: 40,
picUrl: "",
spuName: "",
skuName: "",
count: 0,
price: 0,
handedPrice: 0,
payPrice: 0,
unit: "",
orderTime: "",
serveAddress: "",
userRemark: "",
payType: "",
financeStatus: "",
},
{
id: 5,
orderNum: "3214421412",
createTime: "",
orderCategoryName: "宠物殡葬",
orderTerminal: 0,
userId: 0,
userName: "",
subTime: 1760585499000, // 预约时间
userNickName: "",
userAvatar: "",
userMobile: "",
orderStatus: 50,
picUrl: "",
spuName: "",
skuName: "",
count: 0,
price: 0,
handedPrice: 0,
payPrice: 0,
unit: "",
orderTime: "",
serveAddress: "",
userRemark: "",
payType: "",
financeStatus: "",
},
{
id: 6,
orderNum: "3214421412",
createTime: "",
orderCategoryName: "宠物殡葬",
orderTerminal: 0,
userId: 0,
userName: "",
subTime: 1760585499000, // 预约时间
userNickName: "",
userAvatar: "",
userMobile: "",
orderStatus: 60,
picUrl: "",
spuName: "",
skuName: "",
count: 0,
price: 0,
handedPrice: 0,
payPrice: 0,
unit: "",
orderTime: "",
serveAddress: "",
userRemark: "",
payType: "",
financeStatus: "",
},
{
id: 7,
orderNum: "3214421412",
createTime: "",
orderCategoryName: "宠物殡葬",
orderTerminal: 0,
userId: 0,
userName: "",
subTime: 1760585499000, // 预约时间
userNickName: "",
userAvatar: "",
userMobile: "",
orderStatus: 70,
picUrl: "",
spuName: "",
skuName: "",
@@ -66,72 +202,70 @@ const getOrderPage = (_req: Request, res: Response) => {
const getOrderDetail = (_req: Request, res: Response) => {
res.json({
data: {
code: 0,
data: {
tradeOrderInfoBase: {
id: "",
orderNo: "",
orderStatus: "",
orderType: "",
orderCategoryNameAndId: "",
orderTerminal: "",
userInfo: "",
cancelTime: "",
cancelReason: "",
merchantRemark: "",
refundTime: "",
propertyTime: "",
propertyStatus: "",
price: "",
discountPrice: "",
payPrice: 0,
refundPrice: "",
livePrice: "",
payType: "",
payChannelCode: "",
payOrderId: "",
payTime: "",
createTime: "",
finishTime: "",
},
tradeProductInfo: {
shopLogoUrl: "",
shopName: "",
spuId: 0,
skuId: 0,
skuPicUrl: "",
spuName: "",
skuName: "",
count: 0,
price: 0,
unit: "",
handedPrice: 0,
expensePrice: 0,
properties: [""],
serveContent: "",
totalPrice: 0,
discountPrice: 0,
payPrice: 0,
refundPrice: 0,
refundCount: 0,
},
tradeServeInfo: {
properties: {
"": {},
},
},
tradeExtendServeInfo: {
properties: {
"": {},
},
},
tradeExtendCostInfo: {
properties: {
"": {},
},
tradeOrderInfoBase: {
id: "7655265",
orderNo: "BZ000548787",
orderStatus: "50",
orderType: "1",
orderCategoryName: "宠物殡葬", // 订单类目
orderCategoryId: "3232321",
orderTerminal: "微信小程序",
userInfo: null,
userAvatar: null,
cancelTime: "2025-10-16T11:28:57",
cancelReason: "非常",
merchantRemark: "测试商家备注",
refundTime: null,
propertyTime: null,
propertyStatus: null,
price: null,
discountPrice: null,
payPrice: null,
refundPrice: null,
livePrice: null,
payType: "1",
payChannelCode: "1",
payOrderId: "12323123123",
payTime: 1760585391000,
createTime: 1760585499000,
finishTime: 1760585335000,
},
tradeProductInfo: {
shopLogoUrl: "",
shopName: "",
spuId: 0,
skuId: 0,
skuPicUrl: "",
spuName: "",
skuName: "",
count: 0,
price: 0,
unit: "",
handedPrice: 0,
expensePrice: 0,
properties: [""],
serveContent: "",
totalPrice: 0,
discountPrice: 0,
payPrice: 0,
refundPrice: 0,
refundCount: 0,
},
tradeServeInfo: {
properties: {
"": {},
},
},
tradeExtendServeInfo: {
properties: {
"": {},
},
},
tradeExtendCostInfo: {
properties: {
"": {},
},
},
msg: "",
},
code: 0,
});

24
src/components/DrawerForm/index.tsx
View File

@@ -2,7 +2,12 @@ import type { ProFormColumnsType } from '@ant-design/pro-components';
import { BetaSchemaForm } from '@ant-design/pro-components';
import { Button, type ColProps, Drawer, Space } from 'antd';
import type { FormInstance } from 'antd/lib';
import React, { forwardRef, useImperativeHandle } from 'react';
import React, {
Children,
cloneElement,
forwardRef,
useImperativeHandle,
} from 'react';
interface ConfigurableDrawerFormProps {
title?: string;
@@ -56,7 +61,17 @@ const ConfigurableDrawerForm = forwardRef<
},
close: () => setOpen(false),
}));
const renderChildren = () => {
return Children.map(children, (child) => {
if (React.isValidElement(child)) {
// 使用更安全的方式传递属性，避免 TypeScript 错误
return cloneElement(child, {
...formData,
} as any);
}
return child;
});
};
const handleSubmit = async () => {
try {
if (onSubmit) {
@@ -75,7 +90,7 @@ const ConfigurableDrawerForm = forwardRef<
setLoading(false);
}
};
console.log(footer);
return (
<Drawer
title={title}
@@ -122,7 +137,8 @@ const ConfigurableDrawerForm = forwardRef<
submitter={false}
/>
) : (
children
renderChildren()
// children
)}
</Drawer>
);

54
src/components/EnhancedProTable/index.tsx
View File

@@ -25,57 +25,6 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
...restProps
} = props;
// const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
// const [selectedRows, setSelectedRows] = useState<T[]>([]);
// // 行选择配置
// const rowSelection = useMemo(() => {
// if (!showSelection) return undefined;
// return {
// selectedRowKeys,
// selections: [Table.SELECTION_ALL, Table.SELECTION_INVERT],
// onChange: (keys: React.Key[], rows: T[]) => {
// setSelectedRowKeys(keys);
// setSelectedRows(rows);
// },
// getCheckboxProps: (record: T) => ({
// name: record[rowKey]?.toString(),
// }),
// };
// }, [showSelection, selectedRowKeys]);
// // 处理行点击事件
// const handleRowClick = useCallback(
// (record: T, index?: number) => {
// console.log("handleRowClick");
// if (!enableRowClick) return {};
// return {
// onClick: (event: React.MouseEvent<HTMLElement>) => {
// // 阻止事件冒泡到其他元素
// event.stopPropagation();
// // 如果点击的是 checkbox 或其他交互元素，不处理行选中
// const target = event.target as HTMLElement;
// console.log("handleRowClick");
// if (
// target.closest(".ant-checkbox") ||
// target.closest(".ant-btn") ||
// target.closest(".ant-dropdown") ||
// target.closest("a")
// ) {
// return;
// }
// // // 切换选中状态
// // handleRowSelect(record, !isSelected);
// // // 调用原始的 onRow 点击事件
// onRow?.(record, index)?.onClick?.(event);
// },
// };
// },
// [enableRowClick, onRow]
// );
const toolBarRender = useCallback(() => {
const toolbarElements =
toolbarActions?.map((action) => {
@@ -105,7 +54,8 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
toolBarRender={toolBarRender}
manualRequest={false}
showSorterTooltip
scroll={{ x: 'max-content' }}
// scroll={{ x: "max-content" }}
scroll={{ x: 1200 }}
components={components}
search={
search

3
src/constants/index.ts
View File

@@ -35,3 +35,6 @@ export const systemDataScopetStatus = [
{ label: '部门及以下数据权限', value: 4 },
{ label: '仅本人数据权限', value: 5 },
];
export const dateFormat = 'YYYY-MM-DD';
export const dateFormatS = 'YYYY-MM-DD HH:mm:ss';

0
src/constants/order.ts
View File

55
src/constants/trade.ts Normal file
View File

@@ -0,0 +1,55 @@
import type { BadgeProps } from 'antd';
export enum OrderStatus {
All = 1,
PendingPayment = 10,
PendingConfirmation = 20,
PendingService = 30,
PendingAcceptance = 40,
Completed = 50,
Cancelled = 60,
Refunded = 70,
}
export const OrderBtnLableMap: Record<OrderStatus, string> = {
[OrderStatus.PendingPayment]: '取消订单',
[OrderStatus.PendingConfirmation]: '接单确定',
[OrderStatus.PendingService]: '准备完成 开始服务',
[OrderStatus.PendingAcceptance]: '服务完成上报',
[OrderStatus.All]: '',
[OrderStatus.Completed]: '',
[OrderStatus.Cancelled]: '',
[OrderStatus.Refunded]: '',
};
// 状态标签映射
export const OrderStatusLabels: Record<
OrderStatus,
{ label: string; color: string }
> = {
[OrderStatus.All]: { label: '所有订单', color: 'default' },
[OrderStatus.PendingPayment]: { label: '等待付款', color: 'danger' },
[OrderStatus.PendingConfirmation]: { label: '等待确定', color: 'warning' },
[OrderStatus.PendingService]: { label: '等待服务', color: 'primary' },
[OrderStatus.PendingAcceptance]: { label: '等待验收', color: 'success' },
[OrderStatus.Completed]: { label: '已完成', color: 'secondary' },
[OrderStatus.Cancelled]: { label: '已取消', color: 'secondary' },
[OrderStatus.Refunded]: { label: '已退款', color: 'secondary' },
};
export const mapOrderStatusToBadgeStatus = (
statusColor: string,
): BadgeProps['status'] => {
const statusMap: Record<string, BadgeProps['status']> = {
success: 'success',
processing: 'processing',
default: 'default',
error: 'error',
warning: 'warning',
primary: 'processing',
danger: 'error',
secondary: 'default',
};
return statusMap[statusColor] || 'default';
};

91
src/pages/trade/order/config.tsx
View File

@@ -1,62 +1,68 @@
import type { ProColumns } from '@ant-design/pro-components';
import { Space, Typography } from 'antd';
import { Button, Space, Tag, Typography } from 'antd';
import dayjs from 'dayjs';
import { dateFormat, dateFormatS } from '@/constants';
import type { TradeOrderPageRespVO } from '@/services/trade/order';
const { Text } = Typography;
const { Text, Paragraph } = Typography;
export const baseOrderColumns: ProColumns<TradeOrderPageRespVO>[] = [
{
title: '商品',
dataIndex: 'id',
width: '20%',
dataIndex: 'spuName',
hideInSearch: true,
width: '100%',
ellipsis: true,
render: (_, record) =>
// <Space style={{ width: "100%" }}>
// <Image
// src={record.picUrl}
// width={64}
// fallback="data:image/png;base64,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"
// />
record.spuName,
// <Paragraph ellipsis>
// <Paragraph ellipsis>{record.spuName}</Paragraph>
// <div>{record.skuName}</div>
// <Space>
// <div>
// <Text type="secondary">数量：</Text>
// <Text>{record.count}</Text>
// </div>
// <div>
// <Text type="secondary">单价：</Text>
// <Text>
// {record.price}/{record.unit}
// </Text>
// </div>
// <div>
// <Text type="secondary">到手价：</Text>
// <Text>
// {record.handedPrice}/{record.unit}
// </Text>
// </div>
// </Space>
// </Paragraph>
// </Space>
render: (_, record) => (
<Paragraph>
<Paragraph ellipsis style={{ marginBottom: 0 }}>
{record.spuName}
</Paragraph>
<div>{record.skuName}</div>
<Space>
<div>
<Text type="secondary">数量：</Text>
<Text>{record.count}</Text>
</div>
<div>
<Text type="secondary">单价：</Text>
<Text>
{record.price}/{record.unit}
</Text>
</div>
<div>
<Text type="secondary">到手价：</Text>
<Text>
{record.handedPrice}/{record.unit}
</Text>
</div>
</Space>
</Paragraph>
),
},
{
title: '服务',
dataIndex: 'serveAddress',
hideInSearch: true,
ellipsis: true,
width: '100%',
render: (_, record) => (
<Space direction="vertical">
<div>
<Space direction="vertical" style={{ width: '100%' }}>
<Paragraph ellipsis style={{ marginBottom: 0 }}>
<Text type="secondary">预约时间：</Text>
<Text>{record.subTime}</Text>
</div>
<div>
<Text>{dayjs(record.subTime).format(dateFormatS)}</Text>
<Tag style={{ marginLeft: 10 }}>预约</Tag>
<Tag color="error" style={{ marginLeft: 10 }}>
加急
</Tag>
</Paragraph>
<Paragraph ellipsis style={{ marginBottom: 0 }}>
<Text type="secondary">服务地址：</Text>
<Text>{record.serveAddress}</Text>
</div>
<Text>
{record.serveAddress}
服务地址：服务地址：服务地址：服务地址：服务地址：服务地址：
</Text>
</Paragraph>
<div>
<Text type="secondary">用户备注：</Text>
<Text>{record.userRemark}</Text>
@@ -68,6 +74,7 @@ export const baseOrderColumns: ProColumns<TradeOrderPageRespVO>[] = [
title: '财务',
dataIndex: 'price',
hideInSearch: true,
width: '100',
render: (_, record) => (
<Space direction="vertical">
<div>

251
src/pages/trade/order/detail/component/info/basic-info.tsx
View File

@@ -1,87 +1,192 @@
import { ProCard } from '@ant-design/pro-components';
import { Button, Card, Steps, Typography } from 'antd';
import { Avatar, Button, Card, Empty, Space, Steps, Typography } from 'antd';
import dayjs from 'dayjs';
import RcResizeObserver from 'rc-resize-observer';
import React, { useCallback, useState } from 'react';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { OrderStatus, OrderStatusLabels } from '@/constants/trade';
import type { TradeOrderBaseInfo } from '@/services/trade/order';
import { type BtnType, renderBaseInfoOrder } from './config';
import styles from './index.module.less';
const { Title, Text } = Typography;
const BasicInfo: React.FC = () => {
const BasicInfo: React.FC<{ data?: TradeOrderBaseInfo; id: number }> = (
props,
) => {
const { data } = props;
const [orderStatus, setOrderStatus] = useState<number>(0);
useEffect(() => {
if (data) {
setOrderStatus(Number(data.orderStatus));
}
}, [data]);
const [responsive, setResponsive] = useState(false);
const renderTitle = useCallback(() => {
return <div>标题</div>;
}, []);
return (
<Space size={16}>
<div>
<Text type="secondary">订单编号：</Text>
<Text copyable>{data?.orderNo}</Text>
</div>
<div>
<Text type="secondary">订单类目：</Text>
<Text>{data?.orderCategoryId}</Text>
<Text>ID:</Text>
<Text copyable>{data?.id}</Text>
</div>
<div>
<Text type="secondary">订单来源：</Text>
<Text>{data?.orderCategoryName}</Text>
</div>
<div>
<Avatar size={20} src={data?.userAvatar} />
<Text>{data?.userInfo}</Text>
</div>
</Space>
);
}, [data]);
const handleClick = useCallback(
(type: BtnType) => {
if (type === 'confirm') {
//还未完成的按钮事件
console.log(data?.orderStatus);
} else if (type === 'sales') {
//新建售后事件
}
console.log(type);
},
[data],
);
const renderOrderStatus = useMemo(() => {
if (data) return renderBaseInfoOrder(data, handleClick);
}, [data]);
return (
<div className={styles['order-info']}>
<Card title="基本信息">
<ProCard
size="small"
title={renderTitle()}
bordered
headerBordered
gutter={8}
className="order-info-card"
>
<ProCard colSpan="200px">
<div
style={{
display: 'flex',
flexDirection: 'column',
gap: 10,
alignItems: 'center',
}}
>
<Title type="danger" level={4} style={{ margin: 0 }}>
等待付款
</Title>
<span>
<Text type="secondary">剩余</Text>
<Text>4分30秒</Text>
</span>
<Button type="primary" block>
取消订单
</Button>
<Button block>添加备注</Button>
</div>
{data ? (
<ProCard
size="small"
title={renderTitle()}
bordered
headerBordered
gutter={8}
className="order-info-card"
>
<ProCard colSpan="300px">
<div
style={{
display: 'flex',
flexDirection: 'column',
gap: 10,
alignItems: 'center',
}}
>
{renderOrderStatus}
</div>
</ProCard>
<ProCard layout="center">
<RcResizeObserver
key="resize-observer"
onResize={(offset) => {
setResponsive(offset.width < 460);
}}
>
<Steps
size="small"
progressDot
style={{ width: '100%' }}
current={orderStatus / 10}
direction={responsive ? 'vertical' : 'horizontal'}
items={[
{
title: `创建订单`,
description: (
<Space direction="vertical" size={0}>
{dayjs(data.createTime).format('YYYY-MM-DD')}
{dayjs(data.createTime).format('HH:mm:ss')}
</Space>
),
},
{
title: `${
OrderStatusLabels[OrderStatus.PendingPayment].label
} ${
orderStatus > OrderStatus.PendingPayment
? '(已付款)'
: ''
}`,
description: (
<Space direction="vertical" size={0}>
{dayjs(data.createTime).format('YYYY-MM-DD')}
{dayjs(data.createTime).format('HH:mm:ss')}
</Space>
),
},
{
title: `${
OrderStatusLabels[OrderStatus.PendingConfirmation].label
} ${
orderStatus > OrderStatus.PendingConfirmation
? '(已确定)'
: ''
}`,
description: (
<Space direction="vertical" size={0}>
{/* {dayjs(data.finishTime).format("YYYY-MM-DD")}
{dayjs(data.finishTime).format("HH:mm:ss")} */}
</Space>
),
},
{
title: `${
OrderStatusLabels[OrderStatus.PendingService].label
} ${
orderStatus > OrderStatus.PendingService
? '(已开始)'
: ''
}`,
description: (
<Space direction="vertical" size={0}>
{/* {dayjs(data.finishTime).format("YYYY-MM-DD")}
{dayjs(data.finishTime).format("HH:mm:ss")} */}
</Space>
),
},
{
title: `${
OrderStatusLabels[OrderStatus.PendingAcceptance].label
} ${
orderStatus > OrderStatus.PendingAcceptance
? '(已验收)'
: ''
}`,
description: (
<Space direction="vertical" size={0}>
{/* {dayjs(data.finishTime).format("YYYY-MM-DD")}
{dayjs(data.finishTime).format("HH:mm:ss")} */}
</Space>
),
},
{
title: '完成',
description: (
<Space direction="vertical" size={0}>
{dayjs(data.finishTime).format('YYYY-MM-DD')}
{dayjs(data.finishTime).format('HH:mm:ss')}
</Space>
),
},
]}
/>
</RcResizeObserver>
</ProCard>
</ProCard>
<ProCard layout="center">
<RcResizeObserver
key="resize-observer"
onResize={(offset) => {
setResponsive(offset.width < 460);
}}
>
<Steps
size="small"
progressDot
style={{ width: '100%' }}
current={1}
direction={responsive ? 'vertical' : 'horizontal'}
items={[
{
title: '创建订单',
description: 'This is a description.',
},
{
title: '等待付款',
},
{
title: '等待确定',
},
{
title: '等待服务',
},
{
title: '等待验收',
},
{
title: '完成',
},
]}
/>
</RcResizeObserver>
</ProCard>
</ProCard>
) : (
<Empty />
)}
</Card>
</div>
);

110
src/pages/trade/order/detail/component/info/config.tsx
View File

@@ -1,6 +1,17 @@
import type { ProColumns } from '@ant-design/pro-components';
import { Tag } from 'antd';
import { Button, Tag, Typography } from 'antd';
import type { BaseType } from 'antd/es/typography/Base';
import dayjs from 'dayjs';
import { dateFormat } from '@/constants';
import {
OrderBtnLableMap,
OrderStatus,
OrderStatusLabels,
} from '@/constants/trade';
import type { DeptVO } from '@/services/system/dept';
import type { TradeOrderBaseInfo } from '@/services/trade/order';
const { Title, Text, Paragraph } = Typography;
export const baseOrderColumns: ProColumns<DeptVO>[] = [
{
@@ -62,3 +73,100 @@ export const surchargeInfoColumns: ProColumns<DeptVO>[] = [
onCell: sharedOnCell,
},
];
export type BtnType = 'sales' | 'confirm';
export const renderBaseInfoOrder = (
data: TradeOrderBaseInfo,
handleClick: (type: BtnType) => void,
): React.ReactNode => {
const orderStatusObj =
OrderStatusLabels[data.orderStatus as unknown as OrderStatus];
console.log(orderStatusObj, data);
return (
<>
<Title
type={(orderStatusObj.color as BaseType) || ''}
level={4}
style={{ margin: 0 }}
>
{data?.orderStatus && orderStatusObj.label}
</Title>
<span>
<Text type="secondary">剩余</Text>
<Text>4分30秒</Text>
</span>
{data.orderStatus &&
Number(data.orderStatus) === OrderStatus.Refunded && (
<Paragraph>
<Text type="secondary">退款时间：</Text>
<Text>退款时间</Text>
</Paragraph>
)}
{data.orderStatus &&
(Number(data.orderStatus) === OrderStatus.Completed ||
Number(data.orderStatus) === OrderStatus.Refunded) && (
<Paragraph>
<Text type="secondary">服务完成时间：</Text>
<Text>{dayjs(data.finishTime).format(dateFormat)}</Text>
</Paragraph>
)}
{data.orderStatus &&
Number(data.orderStatus) === OrderStatus.Completed && (
<Paragraph>
<Text type="secondary">售后保障期：</Text>
<Tag
color={
data.propertyStatus && Number(data.propertyStatus) === 1
? 'default'
: 'gay'
}
>
未过期
</Tag>
<Tag
color={
data.propertyStatus && Number(data.propertyStatus) === 1
? 'gay'
: 'default'
}
>
已过期
</Tag>
<Text>{data.propertyTime}</Text>
</Paragraph>
)}
{/* 取消 */}
{data.orderStatus &&
Number(data.orderStatus) === OrderStatus.Cancelled && (
<>
<Paragraph>
<Text type="secondary">取消时间：</Text>
<Text>取消时间</Text>
</Paragraph>
<Paragraph>
<Text type="secondary">取消原因：</Text>
<Text>{data.cancelReason}</Text>
</Paragraph>
<Paragraph>
<Text type="secondary">备注：</Text>
<Text>{data?.merchantRemark}</Text>
</Paragraph>
</>
)}
{data.orderStatus &&
Number(data.orderStatus) <= OrderStatus.PendingAcceptance && (
<Button type="primary" block onClick={() => handleClick('confirm')}>
{OrderBtnLableMap[data.orderStatus as unknown as OrderStatus]}
</Button>
)}
{data.orderStatus &&
Number(data.orderStatus) <= OrderStatus.Completed && (
<Button block onClick={() => handleClick('sales')}>
新建售后
</Button>
)}
</>
);
};

9
src/pages/trade/order/detail/component/info/index.module.less
View File

@@ -21,5 +21,14 @@
.ant-pro-card-body {
padding: 0px;
}
.ant-steps-item-icon {
height: 8px !important;
line-height: 8px !important;
}
.ant-steps-item-active {
.ant-steps-icon-dot {
height: 10px !important;
}
}
}
}

5
src/pages/trade/order/detail/component/info/prod-info.tsx
View File

@@ -1,10 +1,13 @@
import { ProCard } from '@ant-design/pro-components';
import { Button, Card, Image, Space, Tag, Typography } from 'antd';
import React, { useCallback } from 'react';
import type { TradeProductInfo } from '@/services/trade/order';
import styles from './index.module.less';
const { Text, Paragraph } = Typography;
const ProdInfo: React.FC = () => {
const ProdInfo: React.FC<{ data?: TradeProductInfo; id: number }> = (props) => {
const { data = {}, id } = props;
const renderTitle = useCallback(() => {
return (
<Space style={{ height: '100%' }} size={16}>

6
src/pages/trade/order/detail/component/info/select-info.tsx
View File

@@ -7,10 +7,14 @@ import {
type DeptVO,
getDeptPage,
} from '@/services/system/dept';
import type { TradeExtendCostInfo } from '@/services/trade/order';
import { baseOrderColumns } from '../../../config';
import styles from './index.module.less';
const SelectInfo: React.FC = () => {
const SelectInfo: React.FC<{ data?: TradeExtendCostInfo; id: number }> = (
props,
) => {
const { data = {}, id } = props;
const onFetch = async (
params: DeptReqVO & {
pageSize?: number;

6
src/pages/trade/order/detail/component/info/service-info.tsx
View File

@@ -1,10 +1,14 @@
import { ProCard } from '@ant-design/pro-components';
import { Button, Card, Image, Space, Typography } from 'antd';
import React from 'react';
import type { TradeServeInfo } from '@/services/trade/order';
import styles from './index.module.less';
const { Text, Paragraph } = Typography;
const ServiceInfo: React.FC = () => {
const ServiceInfo: React.FC<{ data?: TradeServeInfo; id: number }> = (
props,
) => {
const { data = {}, id } = props;
return (
<div className={styles['order-info']}>
<Card title="服务信息">

6
src/pages/trade/order/detail/component/info/surcharge-info.tsx
View File

@@ -6,10 +6,14 @@ import {
type DeptVO,
getDeptPage,
} from '@/services/system/dept';
import type { TradeExtendServeInfo } from '@/services/trade/order';
import { surchargeInfoColumns } from './config';
import styles from './index.module.less';
const SurchargeInfo: React.FC = () => {
const SurchargeInfo: React.FC<{ data?: TradeExtendServeInfo; id: number }> = (
props,
) => {
const { data, id } = props;
const onFetch = async (
params: DeptReqVO & {
pageSize?: number;

5
src/pages/trade/order/detail/index.tsx
View File

@@ -1,13 +1,14 @@
import { Tabs, type TabsProps } from 'antd';
import React from 'react';
import type { TradeOrderPageRespVO } from '@/services/trade/order';
import OrderInfo from './order-info';
const DetailCom: React.FC = () => {
const DetailCom: React.FC<{ data?: TradeOrderPageRespVO }> = (props) => {
const items: TabsProps['items'] = [
{
key: '1',
label: '订单信息 ',
children: <OrderInfo />,
children: <OrderInfo data={props.data} />,
},
{
key: '2',

31
src/pages/trade/order/detail/order-info.tsx
View File

@@ -1,19 +1,36 @@
import { Space } from 'antd';
import React from 'react';
import React, { useCallback, useEffect, useState } from 'react';
import {
getTradeOrderDetail,
type TradeOrderDetailRespVO,
} from '@/services/trade/order';
import BasicInfo from './component/info/basic-info'; //基本信息（通版）
import ProdInfo from './component/info/prod-info'; //商品信息（通版）
import SelectInfo from './component/info/select-info'; //可选服务（殡葬专属字段）
import ServiceInfo from './component/info/service-info';
import SurchargeInfo from './component/info/surcharge-info'; //服务附加费（殡葬专属字段）
const OrderDetail: React.FC = () => {
const OrderDetail: React.FC<{ data?: TradeOrderDetailRespVO }> = (props) => {
const { data } = props;
const [detais, setDetails] = useState<TradeOrderDetailRespVO>();
const fetch = useCallback(async () => {
if (data?.id) {
const res = await getTradeOrderDetail(data.id);
setDetails(res);
}
}, [data]);
useEffect(() => {
fetch();
}, [data]);
return (
<Space direction="vertical" size={24} style={{ width: '100%' }}>
<BasicInfo />
<ProdInfo />
<ServiceInfo />
<SelectInfo />
<SurchargeInfo />
<BasicInfo data={detais?.tradeOrderInfoBase} id={data?.id} />
<ProdInfo data={detais?.tradeProductInfo} id={data?.id} />
<ServiceInfo data={detais?.tradeServeInfo} id={data?.id} />
<SelectInfo data={detais?.tradeExtendCostInfo} id={data?.id} />
<SurchargeInfo data={detais?.tradeExtendServeInfo} id={data?.id} />
</Space>
);
};

33
src/pages/trade/order/index.tsx
View File

@@ -1,35 +1,26 @@
import type { TabsProps } from 'antd';
import { Tabs } from 'antd';
import React from 'react';
import { OrderStatusLabels } from '@/constants/trade';
import styles from './index.module.less';
import OrderListItem from './list';
const onChange = (key: string) => {
console.log(key);
};
const status: string[] = [
'所有订单',
'等待付款',
'等待确定',
'等待服务',
'等待验收',
'等待评价',
'已完成',
'已取消',
'已退款',
];
// const onChange = (key: string) => {
// console.log(key);
// };
const OrderList: React.FC = () => {
const items: TabsProps['items'] = status.map((item, index) => ({
key: `${index + 1}`,
label: item,
children: <OrderListItem />,
}));
const items: TabsProps['items'] = Object.entries(OrderStatusLabels).map(
([value, list]) => ({
key: value,
label: list.label,
children: <OrderListItem orderStatus={Number(value)} />,
}),
);
return (
<div className={`${styles['trade-order']} "page-container" `}>
<Tabs defaultActiveKey="1" items={items} onChange={onChange} />
<Tabs defaultActiveKey="1" items={items} />
</div>
);
};

66
src/pages/trade/order/list.tsx
View File

@@ -12,6 +12,7 @@ import {
message,
Space,
Statistic,
Typography,
} from 'antd';
import React, { useCallback, useRef, useState } from 'react';
import ConfigurableDrawerForm, {
@@ -22,10 +23,17 @@ import { baseOrderColumns } from './config';
const { Search } = Input;
const { Text } = Typography;
import { DownOutlined, UpOutlined, UserOutlined } from '@ant-design/icons';
import PopconfirmForm, {
type PopconfirmFormRef,
} from '@/components/PopconfirmForm';
import {
mapOrderStatusToBadgeStatus,
type OrderStatus,
OrderStatusLabels,
} from '@/constants/trade';
import {
getTradeOrderPage,
type TradeOrderPageRespVO,
@@ -33,10 +41,11 @@ import {
} from '@/services/trade/order';
import DetailCom from './detail';
const OrderListItem: React.FC = () => {
const OrderListItem: React.FC<{ orderStatus: number }> = (props) => {
const { orderStatus } = props;
const tableRef = useRef<ActionType>(null);
const configurableDrawerRef = useRef<ConfigurableDrawerFormRef>(null);
const [modalTitle, setModalTitle] = useState<string>('订单：BZ000548787');
const [modalData, setModalData] = useState<TradeOrderPageRespVO>();
const [isShowTotal, setIsShowTotal] = useState<boolean>(false);
const popconfirmFormRef = useRef<PopconfirmFormRef>(null);
const onFetch = async (
@@ -47,6 +56,7 @@ const OrderListItem: React.FC = () => {
) => {
const data = await getTradeOrderPage({
...params,
orderStatus,
pageNo: params.current,
pageSize: params.pageSize,
});
@@ -59,7 +69,7 @@ const OrderListItem: React.FC = () => {
};
const handleDetail = useCallback((record: TradeOrderPageRespVO) => {
setModalTitle(`订单：${record.orderNum}`);
setModalData(record);
configurableDrawerRef.current?.open();
}, []);
@@ -97,6 +107,12 @@ const OrderListItem: React.FC = () => {
<a key="cancel" onClick={() => handleOrder(record.id)}>
取消订单
</a>
<a key="cancel" onClick={() => handleOrder(record.id)}>
开始服务
</a>
<a key="cancel" onClick={() => handleOrder(record.id)}>
新建售后
</a>
<a key="detail" onClick={() => handleDetail(record)}>
订单详情
</a>
@@ -138,7 +154,7 @@ const OrderListItem: React.FC = () => {
const { children, ...restProps } = props;
const record = props['data-record']
? JSON.parse(props['data-record'])
: {};
: undefined;
return (
<>
{record && (
@@ -148,18 +164,22 @@ const OrderListItem: React.FC = () => {
style={{
padding: '0px 8px',
borderBottom: '1px solid #f0f0f0',
fontSize: '12px',
color: '#666',
}}
>
<Space>
<span>
<Badge
status="success"
text={record.orderStatus}
size="small"
/>
</span>
<Badge
status={mapOrderStatusToBadgeStatus(
OrderStatusLabels[record.orderStatus as OrderStatus]
.color,
)}
text={
OrderStatusLabels[record.orderStatus as OrderStatus]
.label
}
size="small"
/>
<Divider />
<span> {record.orderCategoryName}</span>
<span> {record.createTime}</span>
@@ -188,6 +208,13 @@ const OrderListItem: React.FC = () => {
);
},
},
header: {
cell: (props: any) => {
const { children, ...restProps } = props;
console.log(restProps, children);
return <th {...restProps}>{children}</th>;
},
},
};
const columns = [...baseOrderColumns, actionColumns];
@@ -201,7 +228,14 @@ const OrderListItem: React.FC = () => {
}, []);
return (
<>
<Space>
<Space
style={{
padding: '18px',
background: '#fff',
width: '100%',
marginBottom: 16,
}}
>
<Search
placeholder="商品名称/商品ID/订单号"
enterButton
@@ -215,7 +249,7 @@ const OrderListItem: React.FC = () => {
</Button>
</Space>
{isShowTotal && (
<ProCard.Group direction="row" bordered style={{ marginTop: 16 }}>
<ProCard.Group direction="row" style={{ marginBottom: 18 }}>
<ProCard layout="center" style={{ background: '#f5f5f5' }}>
<Statistic title="订单数量" value={79.0} precision={2} />
</ProCard>
@@ -243,14 +277,14 @@ const OrderListItem: React.FC = () => {
<ConfigurableDrawerForm
ref={configurableDrawerRef}
width="80vw"
title={modalTitle}
title={`订单：${modalData?.orderNum}`}
bodyStyle={{
background: '#f5f5f5',
paddingTop: 8,
}}
footer={<Button onClick={onClose}>关闭</Button>}
>
<DetailCom />
<DetailCom data={modalData} />
</ConfigurableDrawerForm>
</>
);

367
src/services/trade/order/index.ts
View File

@@ -158,86 +158,14 @@ export interface TradeOrderPageRespVO {
* TradeOrderDetailRespVO
*/
export interface TradeOrderDetailRespVO {
/**
* 购买的商品数量
*/
count?: number;
/**
* 下单时间 - 必填
*/
createTime?: string;
/**
* 财务状态
*/
financeStatus?: string;
/**
* 到手价
*/
handedPrice?: number;
/**
* 订单编号 - 必填，示例：1024
*/
id?: number;
/**
* 订单类目
*/
orderCategoryName?: string;
/**
* 订单流水号 - 必填，示例：1146347329394184195
*/
orderNum?: string;
/**
* 订单状态
*/
orderStatus?: number;
/**
* 订单来源
*/
orderTerminal?: number;
/**
* 预约时间
*/
orderTime?: string;
/**
* 应付金额（总） - 必填，示例：1000
*/
payPrice?: number;
/**
* 支付方式
*/
payType?: string;
/**
* 商品图片
*/
picUrl?: string;
/**
* 单价
*/
price?: number;
/**
* 服务地址
*/
serveAddress?: string;
/**
* 商品规格
*/
skuName?: string;
/**
* 商品名称
*/
spuName?: string;
/**
* 配送信息
*/
tradeDeliveryInfo?: TradeDeliveryInfo;
/**
* 附加费信息
*/
tradeExtendCostInfo?: string;
tradeExtendCostInfo?: TradeExtendCostInfo;
/**
* 扩展服务信息
*/
tradeExtendServeInfo?: string;
tradeExtendServeInfo?: TradeExtendServeInfo;
/**
* 基本信息
*/
@@ -245,71 +173,48 @@ export interface TradeOrderDetailRespVO {
/**
* 商品信息
*/
tradeProductInfo?: string;
tradeProductInfo?: TradeProductInfo;
/**
* 单位
* 服务信息
*/
unit?: string;
/**
* 用户头像
*/
userAvatar?: string;
/**
* 用户编号 - 必填，示例：2048
*/
userId?: number;
/**
* 用户手机号
*/
userMobile?: string;
/**
* 用户姓名
*/
userName?: string;
/**
* 用户昵称
*/
userNickName?: string;
/**
* 用户备注 - 必填，示例：你猜
*/
userRemark?: string;
tradeServeInfo?: TradeServeInfo;
[property: string]: any;
}
/**
* 配送信息
* 附加费信息
*
* TradeDeliveryInfo
* TradeExtendCostInfo
*/
export interface TradeDeliveryInfo {
export interface TradeExtendCostInfo {
/**
* 快递详情
* 内部存储动态属性的 Map，键为属性名称，值为属性值
*/
deliveryDetail?: string;
properties?: MapObject;
[property: string]: any;
}
/**
* 内部存储动态属性的 Map，键为属性名称，值为属性值
*
* MapObject
*/
export interface MapObject {
key?: { [key: string]: any };
[property: string]: any;
}
/**
* 扩展服务信息
*
* TradeExtendServeInfo
*/
export interface TradeExtendServeInfo {
/**
* 承运方
* 内部存储动态属性的 Map，键为属性名称，值为属性值
*/
logisticsName?: string;
/**
* 送货上门
*/
logisticsNum?: string;
/**
* 送货方式
*/
logisticsType?: string;
/**
* 收货地址
*/
receiverDetailAddress?: string;
/**
* 收货手机
*/
receiverMobile?: string;
/**
* 收货人
*/
receiverName?: string;
properties?: MapObject;
[property: string]: any;
}
/**
@@ -319,37 +224,13 @@ export interface TradeDeliveryInfo {
*/
export interface TradeOrderBaseInfo {
/**
* 实收金额
* 取消原因
*/
actualPrice?: string;
/**
* 售后编号 - 必填，示例：450878
*/
afterSaleCode?: string;
/**
* 售后类型 - 必填，示例：仅退款/退货退款/可扩展增加使用
*/
afterSaleType?: string;
/**
* 申请人 - 必填，示例：用户/商家/平台+ID
*/
applicant?: string;
/**
* 审核人 - 必填，示例：姓名+ID
*/
auditor?: string;
/**
* 审核时间 - 必填，示例：2025-07-01 12:00:00
*/
auditTime?: string;
cancelReason?: string;
/**
* 取消时间
*/
cancelTime?: string;
/**
* 关闭时间 - 必填，示例：2025-07-01 12:00:00
*/
closeTime?: string;
/**
* 创建时间
*/
@@ -366,6 +247,19 @@ export interface TradeOrderBaseInfo {
* 订单id
*/
id?: string;
/**
* 实收金额
*/
livePrice?: string;
/**
* 商家备注
*/
merchantRemark?: string;
/**
* 订单类目
*/
orderCategoryId?: string;
orderCategoryName?: string;
/**
* 订单编号
*/
@@ -383,9 +277,9 @@ export interface TradeOrderBaseInfo {
*/
orderType?: string;
/**
* 支付方式
* 支付渠道 （线上线下）
*/
payChannel?: string;
payChannelCode?: string;
/**
* 交易流水号
*/
@@ -393,70 +287,139 @@ export interface TradeOrderBaseInfo {
/**
* 订单金额
*/
payPrice?: string;
payPrice?: number;
/**
* 支付时间
*/
payTime?: string;
/**
* 退款金额 - 必填
* 支付方式（支付宝微信）
*/
refundAmount?: number;
payType?: string;
/**
* 退款方式 - 必填，示例：系统自动退款
* 订单总价
*/
refundMethod?: string;
price?: string;
/**
* 保障状态
*/
propertyStatus?: string;
/**
* 保障时间
*/
propertyTime?: string;
/**
* 退款金额
*/
refundPrice?: string;
/**
* 退款原因 - 必填，示例：不想要了
* 退款时间
*/
refundReason?: string;
refundTime?: string;
/**
* 退款说明 - 必填，示例：这里是用户填写的退款描述
* 用户信息
*/
refundRemark?: string;
/**
* 退款状态 - 必填，示例：待审核/待退款/已退款/已拒绝
*/
refundStatus?: string;
/**
* 退款至 - 必填，示例：原支付方式返还
*/
refundTo?: string;
/**
* 退款类型 - 必填，示例：订单退款/差价退款/运费退款/可扩展增加
*/
refundType?: string;
/**
* 用户ID 示例：666
*/
userId?: number;
/**
* 用户昵称 示例：钱多多
*/
userNickname?: string;
userInfo?: string;
userAvatar?: string;
}
// /**
// * CommonResultTradeOrderDetailRespVO
// */
// export interface ApifoxModel {
// /**
// * 错误码
// */
// code?: number;
// /**
// * 返回数据
// */
// data?: TradeOrderDetailRespVO;
// /**
// * 错误提示，用户可阅读
// */
// msg?: string;
// }
/**
* 商品信息
*
* TradeProductInfo
*/
export interface TradeProductInfo {
/**
* 购买数量
*/
count?: number;
/**
* 优惠金额
*/
discountPrice?: number;
/**
* 成本价
*/
expensePrice?: number;
/**
* 到手价（单价 - 优惠）
*/
handedPrice?: number;
/**
* 实付金额
*/
payPrice?: number;
/**
* 商品单价
*/
price?: number;
/**
* 保障
*/
properties?: string[];
/**
* 累计退款数量
*/
refundCount?: number;
/**
* 累计退款金额
*/
refundPrice?: number;
/**
* 服务内容
*/
serveContent?: string;
/**
* 店铺log
*/
shopLogoUrl?: string;
/**
* 店铺名称
*/
shopName?: string;
/**
* skuid
*/
skuId?: number;
/**
* 商品规格
*/
skuName?: string;
/**
* 商品规格图
*/
skuPicUrl?: string;
/**
* 商品id
*/
spuId?: number;
/**
* 商品名称
*/
spuName?: string;
/**
* 商品总价
*/
totalPrice?: number;
/**
* 商品单位
*/
unit?: string;
[property: string]: any;
}
/**
* 服务信息
*
* TradeServeInfo
*/
export interface TradeServeInfo {
/**
* 内部存储动态属性的 Map，键为属性名称，值为属性值
*/
properties?: MapObject;
[property: string]: any;
}
export const getTradeOrderPage = async (params: TradeReq) => {
return request<PageResult<TradeOrderPageRespVO[]>>("/trade/order/page", {