ylj/cloud-JG
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
ylj20011123 2025-07-09 21:31:17 +08:00
parent 3fbb6dc0b0
commit 0771f7dd3f
15 changed files with 4618 additions and 822 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/layouts/BasicLayout.tsx
View File

@ -29,7 +29,7 @@ import IconFont from '@/components/IconFont';
import type { CurrentUser } from '@/models/user' import type { CurrentUser } from '@/models/user'
import session from '@/utils/session'; import session from '@/utils/session';
import upMenu from '@/assets/tab/upMenu.svg' import upMenu from '@/assets/tab/upMenu.svg'
import { getFieldEnum, getFieldEnumTree, getFieldGetFieEnumList, getTravelFieldEnumTree } from "@/services/options"; import { getFieldEnum, getFieldEnumTree, getFieldGetFieEnumList, getTravelFieldEnumTree, handleGetFieldEnumTreeTravel } from "@/services/options";
import { handleGetServerpartTree } from '@/pages/basicManage/serverpartAssets/service'; import { handleGetServerpartTree } from '@/pages/basicManage/serverpartAssets/service';
@ -205,6 +205,21 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
// 拿到所有枚举的方法 // 拿到所有枚举的方法
const handleGetAllFieldEnum = async () => { const handleGetAllFieldEnum = async () => {
// 云南门店业态
handleGetFieldEnumTreeTravel({ FieldExplainField: 'BUSINESS_TRADE', FieldEnumStatus: false }).then((BUSINESSTRADEYN: any) => {
if (BUSINESSTRADEYN && BUSINESSTRADEYN.length > 0) {
const obj: any = {}
const list: any = []
BUSINESSTRADEYN.forEach((item: any) => {
list.push({ label: item.label, value: item.value })
obj[item.value] = item.label
})
session.set('BUSINESSTRADEYNList', list);
session.set('BUSINESSTRADEYNObj', obj);
session.set('BUSINESSTRADEYNTree', BUSINESSTRADEYN);
}
})
// 景区状态 // 景区状态
getFieldEnumTree({ FieldExplainField: 'BUSINESSSTATE' }).then((BUSINESSSTATE: any) => { getFieldEnumTree({ FieldExplainField: 'BUSINESSSTATE' }).then((BUSINESSSTATE: any) => {
if (BUSINESSSTATE && BUSINESSSTATE.length > 0) { if (BUSINESSSTATE && BUSINESSSTATE.length > 0) {

273
src/pages/operatingMerchants/MerchantInformation/index.tsx
View File

@ -9,7 +9,7 @@ import Draggable from 'react-draggable';
import SubMenu from "antd/lib/menu/SubMenu"; import SubMenu from "antd/lib/menu/SubMenu";
import ProTable from '@ant-design/pro-table'; import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions'; import ProDescriptions from '@ant-design/pro-descriptions';
import ProForm, { ProFormDatePicker, ProFormDateTimePicker, ProFormMoney, ProFormSelect, ProFormText, ProFormTextArea, ProFormUploadButton } from '@ant-design/pro-form'; import ProForm, { ProFormDatePicker, ProFormDateTimePicker, ProFormMoney, ProFormSelect, ProFormText, ProFormTextArea, ProFormTreeSelect, ProFormUploadButton } from '@ant-design/pro-form';
import { MenuFoldOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; import { MenuFoldOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import { PageContainer } from '@ant-design/pro-layout'; import { PageContainer } from '@ant-design/pro-layout';
import { Button, Col, Drawer, message, Row, Popconfirm, Space, Image, Modal, Form, Switch, Upload, Tooltip, Descriptions, TreeSelect, Divider, Tabs, Select, Input, Tree } from 'antd'; import { Button, Col, Drawer, message, Row, Popconfirm, Space, Image, Modal, Form, Switch, Upload, Tooltip, Descriptions, TreeSelect, Divider, Tabs, Select, Input, Tree } from 'antd';
@ -23,7 +23,7 @@ import { handleDeleteSERVERPARTSELLER, handleGetMEMBERADDRESSList, handleGetRela
import LeftSelectTree from '@/pages/reports/settlementAccount/component/leftSelectTree'; import LeftSelectTree from '@/pages/reports/settlementAccount/component/leftSelectTree';
import session from '@/utils/session'; import session from '@/utils/session';
import PageTitleBox from '@/components/PageTitleBox'; import PageTitleBox from '@/components/PageTitleBox';
import { handeGetCOMMENTList, handeGetPictureList } from '@/pages/travelMember/service'; import { handeGetCOMMENTList, handeGetPictureList, handeGetRevenueReport } from '@/pages/travelMember/service';
import { deletePicture, uploadPicture } from '@/services/picture'; import { deletePicture, uploadPicture } from '@/services/picture';
const beforeUpload = (file: any) => { const beforeUpload = (file: any) => {
@ -73,10 +73,16 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
const [DoorImageList, setDoorImageList] = useState<any>([]) const [DoorImageList, setDoorImageList] = useState<any>([])
// 内景图片列表 // 内景图片列表
const [InteriorImage, setInteriorImageList] = useState<any>([]) const [InteriorImage, setInteriorImageList] = useState<any>([])
// 营收的加载效果
const [revenueLoading, setRevenueLoading] = useState<boolean>(false)
let SHOPTRADEObj = session.get('SHOPTRADEObj') let SHOPTRADEObj = session.get('SHOPTRADEObj')
let SHOPTRADEList = session.get('SHOPTRADEList') let SHOPTRADEList = session.get('SHOPTRADEList')
// 云南 门店业态
let BUSINESSTRADEYNTree = session.get('BUSINESSTRADEYNTree')
console.log('BUSINESSTRADEYNTree', BUSINESSTRADEYNTree);
let shopregionObj = session.get('shopregionObj') let shopregionObj = session.get('shopregionObj')
let businessStateObj = session.get('businessStateObj') let businessStateObj = session.get('businessStateObj')
let SERVERPARTTree = session.get('SERVERPARTTree') let SERVERPARTTree = session.get('SERVERPARTTree')
@ -108,6 +114,14 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
}); });
}; };
// 拖动结束 // 拖动结束
const formatTreeData = (data: any) => {
return data.map((item: any) => ({
...item,
value: String(item.value), // 数字转字符串
children: item.children ? formatTreeData(item.children) : undefined,
}));
};
// 定义列表字段内容 // 定义列表字段内容
const columns: any = [ const columns: any = [
@ -127,13 +141,16 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
title: '经营业态', title: '经营业态',
align: 'center', align: 'center',
width: 120, width: 120,
valueType: 'select', valueType: 'treeSelect',
ellipsis: true, ellipsis: true,
valueEnum: SHOPTRADEObj,
fieldProps: { fieldProps: {
showSearch: true, treeData: formatTreeData(BUSINESSTRADEYNTree), // 设置树形数据源
filterOption: (input, option) => showSearch: true, // 启用搜索
(option?.label ?? '').toLowerCase().includes(input.toLowerCase()), treeNodeFilterProp: 'label', // 按 label 过滤
treeDefaultExpandAll: true,
filterTreeNode: (input: any, treeNode: any) => {
return String(treeNode.label).toLowerCase().includes(input.toLowerCase());
},
}, },
}, },
{ {
@ -706,6 +723,49 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
setImageCommentPreviewVisible(val) setImageCommentPreviewVisible(val)
} }
// 获取营收数据
const handleGetRevenueData = async () => {
const req: any = {
DataType: 1,
DataSourceType: 1,
ServerpartIds: currentRow?.SERVERPART_ID || "",
ServerpartShopIds: currentRow?.SERVERPARTSHOP_IDS || "",
StartDate: moment().subtract(1, 'M').startOf('M').format('YYYY-MM-DD'),
EndDate: moment().subtract(1, 'M').endOf('M').format('YYYY-MM-DD'),
}
setRevenueLoading(true)
console.log('req', req);
const data = await handeGetRevenueReport(req)
setRevenueLoading(false)
console.log('datadata', data);
if (data && data.length > 0) {
let obj: any = data[0]
formRef.current?.setFieldsValue({
MONTHLYSALES: obj.TotalRevenue.Ticket_Count || "0",
CASHPAY: obj.TotalRevenue.Revenue_Amount || "0",
PERCAPITA: obj.TotalRevenue.Ticket_Count ? (obj.TotalRevenue.Revenue_Amount / obj.TotalRevenue.Ticket_Count).toFixed(2) : "0",
})
}
}
const processTreeData = (data: any) => {
return data.map((item: any) => {
if (item.children && item.children.length > 0) {
return {
...item,
disabled: true, // 有子节点的节点禁用
children: processTreeData(item.children)
};
}
return item;
});
};
return ( return (
<div> <div>
<div style={{ backgroundColor: '#fff', display: 'flex' }}> <div style={{ backgroundColor: '#fff', display: 'flex' }}>
@ -723,7 +783,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
return `${record?.SERVERPARTSELLER_ID}` return `${record?.SERVERPARTSELLER_ID}`
}} }}
bordered bordered
formRef={formRef} // formRef={formRef}
headerTitle={<PageTitleBox props={props} />} // 列表表头 headerTitle={<PageTitleBox props={props} />} // 列表表头
actionRef={actionRef} actionRef={actionRef}
search={{ span: 6, labelWidth: 'auto' }} search={{ span: 6, labelWidth: 'auto' }}
@ -960,7 +1020,9 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
<Button type={"primary"} onClick={() => { <Button type={"primary"} onClick={() => {
setShowAddModal(true) setShowAddModal(true)
}}>关联门店</Button> }}>关联门店</Button>
<Button type={"primary"}>获取营收</Button> <Button type={"primary"} loading={revenueLoading} onClick={() => {
handleGetRevenueData()
}}>获取营收</Button>
</div> </div>
: <div></div> : <div></div>
} }
@ -994,79 +1056,117 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
let list2: any = [] let list2: any = []
let list3: any = [] let list3: any = []
if (currentRow?.SELLER_ID) { if (currentRow?.IconList && currentRow?.IconList.length > 0) {
let req: any = { currentRow?.IconList.forEach((item: any) => {
TableId: currentRow?.SELLER_ID, let obj = JSON.parse(JSON.stringify(item))
// TableName: '', obj.url = obj.ImageUrl
TableType: "1204", obj.name = obj.ImageName
ImageType: "1000", obj.uid = item.ImageId
} obj.status = 'done'
const MerchantLogoData = await handeGetPictureList(req) list1.push(obj)
})
if (MerchantLogoData.List && MerchantLogoData.List.length > 0) {
if (MerchantLogoData.List && MerchantLogoData.List.length > 0) {
MerchantLogoData.List.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
list1.push(obj)
})
}
setMerchantLogoList(list1);
}
let req2: any = {
TableId: currentRow?.SELLER_ID,
// TableName: '',
TableType: "1204",
ImageType: "2000",
}
const DoorImageData = await handeGetPictureList(req2)
if (DoorImageData.List && DoorImageData.List.length > 0) {
if (DoorImageData.List && DoorImageData.List.length > 0) {
DoorImageData.List.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
list2.push(obj)
})
}
setDoorImageList(list2);
}
let req3: any = {
TableId: currentRow?.SELLER_ID,
// TableName: '',
TableType: "1204",
ImageType: "3000",
}
const InteriorImageData = await handeGetPictureList(req3)
if (InteriorImageData.List && InteriorImageData.List.length > 0) {
if (InteriorImageData.List && InteriorImageData.List.length > 0) {
InteriorImageData.List.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
list3.push(obj)
})
}
setInteriorImageList(list3);
}
} }
setMerchantLogoList(list1);
if (currentRow?.DoorImgList && currentRow?.DoorImgList.length > 0) {
currentRow?.DoorImgList.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
list2.push(obj)
})
}
setDoorImageList(list2);
if (currentRow?.InsideImgList && currentRow?.InsideImgList.length > 0) {
currentRow?.InsideImgList.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
list3.push(obj)
})
}
setInteriorImageList(list3);
// if (currentRow?.SELLER_ID) {
// let req: any = {
// TableId: currentRow?.SELLER_ID,
// // TableName: '',
// TableType: "1204",
// ImageType: "1000",
// }
// const MerchantLogoData = await handeGetPictureList(req)
// if (MerchantLogoData.List && MerchantLogoData.List.length > 0) {
// if (MerchantLogoData.List && MerchantLogoData.List.length > 0) {
// MerchantLogoData.List.forEach((item: any) => {
// let obj = JSON.parse(JSON.stringify(item))
// obj.url = obj.ImageUrl
// obj.name = obj.ImageName
// obj.uid = item.ImageId
// obj.status = 'done'
// list1.push(obj)
// })
// }
// setMerchantLogoList(list1);
// }
// let req2: any = {
// TableId: currentRow?.SELLER_ID,
// // TableName: '',
// TableType: "1204",
// ImageType: "2000",
// }
// const DoorImageData = await handeGetPictureList(req2)
// if (DoorImageData.List && DoorImageData.List.length > 0) {
// if (DoorImageData.List && DoorImageData.List.length > 0) {
// DoorImageData.List.forEach((item: any) => {
// let obj = JSON.parse(JSON.stringify(item))
// obj.url = obj.ImageUrl
// obj.name = obj.ImageName
// obj.uid = item.ImageId
// obj.status = 'done'
// list2.push(obj)
// })
// }
// setDoorImageList(list2);
// }
// let req3: any = {
// TableId: currentRow?.SELLER_ID,
// // TableName: '',
// TableType: "1204",
// ImageType: "3000",
// }
// const InteriorImageData = await handeGetPictureList(req3)
// if (InteriorImageData.List && InteriorImageData.List.length > 0) {
// if (InteriorImageData.List && InteriorImageData.List.length > 0) {
// InteriorImageData.List.forEach((item: any) => {
// let obj = JSON.parse(JSON.stringify(item))
// obj.url = obj.ImageUrl
// obj.name = obj.ImageName
// obj.uid = item.ImageId
// obj.status = 'done'
// list3.push(obj)
// })
// }
// setInteriorImageList(list3);
// }
// }
return { return {
...data, ...data,
MerchantLogo: list1, SHOPTRADE: currentRow?.SHOPTRADE ? Number(currentRow?.SHOPTRADE) : "",
DoorImage: list2, // MerchantLogo: list1,
InteriorImage: list3, // DoorImage: list2,
// InteriorImage: list3,
} }
// if (currentRow?.SELLER_ID) { // if (currentRow?.SELLER_ID) {
// const data = await handleGetSERVERPARTSELLERDetail({ SERVERPARTSELLERId: currentRow?.SELLER_ID }) // const data = await handleGetSERVERPARTSELLERDetail({ SERVERPARTSELLERId: currentRow?.SELLER_ID })
@ -1114,10 +1214,17 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
/> />
</Col> </Col>
<Col span={8}> <Col span={8}>
<ProFormSelect <ProFormTreeSelect
name="SHOPTRADE" name="SHOPTRADE"
label="门店业态" label="门店业态"
options={SHOPTRADEList} request={() => {
return processTreeData(BUSINESSTRADEYNTree)
}}
fieldProps={{
treeDefaultExpandAll: true, // 默认展开所有节点
showSearch: true, // 可选：添加搜索功能
treeNodeFilterProp: 'label', // 可选：按标签搜索
}}
rules={[ rules={[
{ {
required: true, required: true,
@ -1393,9 +1500,6 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
/> />
</Col> </Col>
</Row> </Row>
</div> </div>
@ -1407,6 +1511,9 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
columns={commentColumns} columns={commentColumns}
style={{ display: selectTab === '2' ? 'block' : 'none' }} style={{ display: selectTab === '2' ? 'block' : 'none' }}
request={async () => { request={async () => {
if (!currentRow?.SELLER_ID) {
return { data: [], success: true }
}
const req: any = { const req: any = {
searchParameter: { searchParameter: {
MERCHANTS_ID: currentRow?.SELLER_ID MERCHANTS_ID: currentRow?.SELLER_ID

388
src/pages/travelMember/MallOrderManage/index.tsx
View File

@ -3,21 +3,48 @@ import { connect } from "umi";
import type { CurrentUser } from "umi"; import type { CurrentUser } from "umi";
import type { ConnectState } from "@/models/connect"; import type { ConnectState } from "@/models/connect";
import React, { useRef, useState } from "react"; import React, { useRef, useState } from "react";
import type { FormInstance } from "antd"; import { Col, Modal, Row, type FormInstance } from "antd";
import type { ActionType } from "@ant-design/pro-table"; import type { ActionType } from "@ant-design/pro-table";
import ProTable from "@ant-design/pro-table"; import ProTable from "@ant-design/pro-table";
import PageTitleBox from "@/components/PageTitleBox"; import PageTitleBox from "@/components/PageTitleBox";
import moment from 'moment' import moment from 'moment'
import { handeGetSALEBILLList, handeGetSaleBillWholeList, handeGetSALEDETAILList } from "../service"; import { handeGetSALEBILLList, handeGetSaleBillWholeList, handeGetSALEDETAILList } from "../service";
import './style.less'
import Draggable from "react-draggable";
import ProForm, { ProFormSelect, ProFormText } from "@ant-design/pro-form";
import orderIcon from '@/assets/detail/orderIcon.png'
import closeIcon from '@/assets/detail/closeIcon.png'
const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => { const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
const { currentUser } = props const { currentUser } = props
const draggleRef = React.createRef<any>()
const actionRef = useRef<ActionType>(); const actionRef = useRef<ActionType>();
const formRef = useRef<FormInstance>(); const formRef = useRef<FormInstance>();
const modalRef = useRef<FormInstance>();
// 查询的条件 // 查询的条件
const [searchParams, setSearchParams] = useState<any>() const [searchParams, setSearchParams] = useState<any>()
const [currentRow, setCurrentRow] = useState<any>();
const [modalVisible, handleModalVisible] = useState<boolean>();
const [confirmLoading, handleConfirmLoading] = useState<boolean>(false) // 弹出框的内容表单是否在提交
// 弹出框拖动效果
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
const onDraggaleStart = (event, uiData) => {
const { clientWidth, clientHeight } = window.document.documentElement;
const targetRect = draggleRef.current?.getBoundingClientRect();
if (!targetRect) {
return;
}
setBounds({
left: -targetRect.left + uiData.x,
right: clientWidth - (targetRect.right - uiData.x),
top: -targetRect.top + uiData.y,
bottom: clientHeight - (targetRect.bottom - uiData.y),
});
};
const columns: any = [ const columns: any = [
{ {
@ -115,6 +142,21 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
ellipsis: true, ellipsis: true,
align: "center", align: "center",
}, },
{
dataIndex: 'SALEBILL_CODE',
title: '订单编号',
align: 'center',
hideInSearch: true,
width: 200,
ellipsis: true,
render: (_, record) => {
return record?.SALEBILL_CODE ? <a onClick={() => {
console.log('recordrecordrecordrecord', record);
setCurrentRow(record);
handleModalVisible(true)
}}>{record?.SALEBILL_CODE}</a> : "-"
}
},
{ {
title: "购买的商品", title: "购买的商品",
dataIndex: "COMMODITY_NAME", dataIndex: "COMMODITY_NAME",
@ -185,14 +227,14 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
return record?.ORDER_DATE ? moment(record?.ORDER_DATE).format('YYYY-MM-DD HH:mm:ss') : "-" return record?.ORDER_DATE ? moment(record?.ORDER_DATE).format('YYYY-MM-DD HH:mm:ss') : "-"
} }
}, },
{ // {
title: "订单编号", // title: "订单编号",
dataIndex: "SALEBILL_CODE", // dataIndex: "SALEBILL_CODE",
width: 150, // width: 150,
hideInSearch: true, // hideInSearch: true,
ellipsis: true, // ellipsis: true,
align: "center", // align: "center",
}, // },
{ {
title: "订单状态", title: "订单状态",
dataIndex: "SALEBILL_STATE", dataIndex: "SALEBILL_STATE",
@ -222,7 +264,65 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
align: "center", align: "center",
} }
] ]
// 订单详情的表格
const orderDetailColumns: any = [
{
dataIndex: "index",
title: "序号",
align: 'center',
hideInSearch: true,
valueType: "index",
width: 70,
ellipsis: true,
},
{
dataIndex: 'COMMODITY_NAME',
title: '商品名称',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'COMMODITY_BARCODE',
title: '商品条码',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'ORDER_COUNT',
title: '数量',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'AVERAGE_PRICE',
title: '单价',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'ORDER_AMOUNT',
title: '金额',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
]
// 关闭悬浮框
const handleCloseModal = () => {
handleConfirmLoading(false)
handleModalVisible(false)
setCurrentRow(undefined);
}
return ( return (
<div> <div>
@ -276,6 +376,276 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
/> />
</div> </div>
</div> </div>
<Modal
className="MallOrderManageModal"
// title={
// <div
// style={{
// width: '100%',
// cursor: 'move',
// }}
// onMouseOver={() => {
// if (disabled) {
// setDraggleDisabled(false)
// }
// }}
// onMouseOut={() => {
// setDraggleDisabled(true)
// }}
// onFocus={() => { }}
// onBlur={() => { }}
// >
// {'订单详情'}
// </div>
// }
title={false}
closeIcon={<div></div>}
destroyOnClose={true}
width={1200}
visible={modalVisible}
confirmLoading={confirmLoading}
afterClose={() => {
formRef.current?.resetFields();
setCurrentRow(undefined);
}}
onCancel={() => {
handleConfirmLoading(false)
handleModalVisible(false)
setCurrentRow(undefined);
}}
footer={false}
modalRender={(modal) => {
return <Draggable
disabled={disabled}
bounds={bounds}
onStart={(event, uiData) => onDraggaleStart(event, uiData)}
handle=".bookingOrderModalTop"
>
<div ref={draggleRef}>{modal}</div>
</Draggable>
}}
>
<ProForm
layout={'horizontal'}
formRef={modalRef}
submitter={false}
initialValues={currentRow ? {
...currentRow,
ORDER_DATE: currentRow?.ORDER_DATE ? moment(currentRow?.ORDER_DATE).format('YYYY-MM-DD HH:mm:ss') : ''
} : {}}
>
<div className="bookingOrderModalTop">
<div className="modalTopLeft">
<img className="memberIcon" src={orderIcon} />
<span className="modalTitle">订单详情</span>
</div>
<div className="modalTopRight">
<img className="memberIcon" src={closeIcon} onClick={() => {
handleCloseModal()
}} />
</div>
</div>
<div className="bookingOrderModalCenter">
<div className="smallTitle">订单信息</div>
<Row gutter={8}>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"SALEBILL_CODE"}
label={"订单编码"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"CHANNEL_TYPE"}
label={"支付渠道"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"ORDER_DATE"}
label={"下单时间"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"RECORD_COUNT"}
label={"商品种类"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"TOTAL_COUNT"}
label={"商品件数"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"ORDER_AMOUNT"}
label={"订单金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"COUPON_AMOUNT"}
label={"优惠金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"PACK_AMOUNT"}
label={"打包金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"CONSUME_SCORE"}
label={"使用积分"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"PAY_AMOUNT"}
label={"实付金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"COST_AMOUNT"}
label={"成本金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"SALEBILL_STATE"}
label={"订单状态"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "订单待支付", value: 1005 },
{ label: "订单待制作", value: 1010 },
{ label: "订单待取餐", value: 2000 },
{ label: "订单已完成", value: 3000 },
{ label: "退款申请中", value: 8000 },
{ label: "订单已退款", value: 8900 },
{ label: "订单已关闭", value: 9000 },
{ label: "订单已撤销", value: 9999 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"COMMENT_STATE"}
label={"订单评价状态"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "未评价", value: 0 },
{ label: "已评价", value: 1 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"TAKE_TYPE"}
label={"取餐方式"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "堂食", value: 1000 },
{ label: "预约", value: 2000 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"PACK_TYPE"}
label={"就餐方式"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "堂食", value: 1000 },
{ label: "打包", value: 2000 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"TAKE_NUMBER"}
label={"取餐码"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
</Row>
</div>
</ProForm>
<ProTable
columns={orderDetailColumns}
bordered
search={false}
options={false}
request={async () => {
const req: any = {
searchParameter: {
SALEBILL_ID: currentRow?.SALEBILL_ID
},
PageIndex: 1,
PageSize: 999999,
}
const data = await handeGetSALEDETAILList(req)
console.log('datadatadata', data);
if (data.List && data.List.length > 0) {
return { data: data.List, success: true, total: data.TotalCount }
}
return { data: [], success: true }
}}
summary={() => {
// extra 是 request 返回的 extra 字段
return (
<tr>
<td colSpan={2} style={{ textAlign: 'center', fontWeight: 'bold' }}>合计</td>
<td />
<td style={{ textAlign: 'center', fontWeight: 'bold' }}>{currentRow?.TOTAL_COUNT || 0}</td>
<td />
<td style={{ textAlign: 'center', fontWeight: 'bold' }}>{currentRow?.ORDER_AMOUNT?.toFixed(2) || '0.00'}</td>
</tr>
)
}}
/>
</Modal>
</div> </div>
) )
} }

106
src/pages/travelMember/MallOrderManage/style.less Normal file
View File

@ -0,0 +1,106 @@
.MallOrderManageModal {
.react-draggable {
.ant-modal-content {
border-radius: 16px;
.ant-modal-body {
padding: 0;
height: 800px;
overflow-y: auto;
overflow: hidden;
.ant-form {
.bookingOrderModalTop {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #D5D8DE;
box-sizing: border-box;
padding-bottom: 10px;
box-sizing: border-box;
padding: 30px 20px;
.modalTopLeft {
display: flex;
align-items: center;
.memberIcon {
width: 18px;
height: 18px;
margin-right: 5px;
}
.modalTitle {
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 18px;
color: rgba(0, 0, 0, 0.85);
line-height: 18px;
text-align: left;
font-style: normal;
}
}
.modalTopRight {
width: 18px;
height: 18px;
.memberIcon {
width: 18px;
height: 18px;
cursor: pointer;
}
}
}
.bookingOrderModalCenter {
width: 100%;
height: 100%;
margin-top: 14px;
box-sizing: border-box;
padding: 0 34px;
.smallTitle {
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 16px;
color: #333333;
line-height: 10px;
text-align: left;
font-style: normal;
margin-bottom: 10px;
}
.smallTitle::after {
content: "";
width: 2px;
height: 14px;
background-color: #155DFE;
position: relative;
left: -5px;
top: 2px;
}
.ant-row {
.memberInfoDetailItem {
.ant-form-item {
margin-bottom: 12px;
}
}
}
}
}
}
.ant-modal-body::-webkit-scrollbar {
width: 0;
display: none;
}
}
}
}

561
src/pages/travelMember/OrderAfterSalesManage/index.tsx
View File

@ -1,11 +1,564 @@
// 订单售后管理 // 订单售后管理 售后订单管理
import { ConnectState } from "@/models/connect"; import { connect } from "umi";
import { connect, CurrentUser } from "umi"; import type { CurrentUser } from "umi";
import type { ConnectState } from "@/models/connect";
import React, { useRef, useState } from "react";
import { Col, Modal, Row, type FormInstance } from "antd";
import type { ActionType } from "@ant-design/pro-table";
import ProTable from "@ant-design/pro-table";
import PageTitleBox from "@/components/PageTitleBox";
import moment from 'moment'
import { handeGetSALEBILLList, handeGetSaleBillWholeList, handeGetSALEDETAILList } from "../service";
import Draggable from "react-draggable";
import ProForm, { ProFormSelect, ProFormText } from "@ant-design/pro-form";
import orderIcon from '@/assets/detail/orderIcon.png'
import closeIcon from '@/assets/detail/closeIcon.png'
import './style.less'
const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
const { currentUser } = props
const draggleRef = React.createRef<any>()
const actionRef = useRef<ActionType>();
const formRef = useRef<FormInstance>();
const modalRef = useRef<FormInstance>();
// 查询的条件
const [searchParams, setSearchParams] = useState<any>()
const [currentRow, setCurrentRow] = useState<any>();
const [modalVisible, handleModalVisible] = useState<boolean>();
const [confirmLoading, handleConfirmLoading] = useState<boolean>(false) // 弹出框的内容表单是否在提交
// 弹出框拖动效果
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
const onDraggaleStart = (event, uiData) => {
const { clientWidth, clientHeight } = window.document.documentElement;
const targetRect = draggleRef.current?.getBoundingClientRect();
if (!targetRect) {
return;
}
setBounds({
left: -targetRect.left + uiData.x,
right: clientWidth - (targetRect.right - uiData.x),
top: -targetRect.top + uiData.y,
bottom: clientHeight - (targetRect.bottom - uiData.y),
});
};
const columns: any = [
{
title: '查询时间',
dataIndex: 'search_date',
valueType: 'dateRange',
hideInTable: true,
hideInDescriptions: true,
search: {
transform: (value) => {
return {
ORDER_DATE_Start: value[0],
ORDER_DATE_End: value[1],
};
},
},
initialValue: [moment().format('YYYY-MM-DD'), moment().add(-1, 'M').format('YYYY-MM-DD')],
},
{
title: "订单状态",
dataIndex: "orderStatus",
valueType: "select",
valueEnum: {
"0": "全部",
"8000": "退款申请中",
"8020": "退款申请中",
"8900": "订单已退款",
"9000": "订单已关闭",
},
initialValue: '8000',
hideInTable: true,
},
{
title: "序号",
dataIndex: "index",
valueType: "index",
hideInSearch: true,
align: "center",
width: 60,
},
{
title: "会员名称",
dataIndex: "ORDER_PERSON",
width: 200,
hideInSearch: true,
ellipsis: true,
align: "center",
},
{
title: "联系电话",
dataIndex: "ORDER_PERSONTEL",
width: 150,
hideInSearch: true,
ellipsis: true,
align: "center",
},
{
title: "订单编号",
dataIndex: "SALEBILL_CODE",
width: 200,
hideInSearch: true,
ellipsis: true,
align: "center",
render: (_, record) => {
return record?.SALEBILL_CODE ? <a onClick={() => {
setCurrentRow(record);
handleModalVisible(true)
}}>
{record?.SALEBILL_CODE}
</a> : ""
}
},
{
title: "购买的商品",
dataIndex: "COMMODITY_NAME",
width: 300,
hideInSearch: true,
ellipsis: true,
align: "center",
},
{
title: "退款金额",
dataIndex: "ORDER_AMOUNT",
width: 120,
hideInSearch: true,
ellipsis: true,
align: "center",
},
{
title: "申请时间",
dataIndex: "ORDER_DATE",
width: 150,
hideInSearch: true,
ellipsis: true,
align: "center",
render: (_, record) => {
return record?.ORDER_DATE ? moment(record?.ORDER_DATE).format('YYYY-MM-DD HH:mm:ss') : "-"
}
},
{
title: "退款时间",
dataIndex: "RESERVATION_ENDDATE",
width: 120,
hideInSearch: true,
ellipsis: true,
align: "center",
},
{
title: "订单状态",
dataIndex: "SALEBILL_STATE",
width: 120,
hideInSearch: true,
ellipsis: true,
valueType: "select",
valueEnum: {
"8000": "退款申请中",
"8020": "退款申请中",
"8900": "订单已退款",
"9000": "订单已关闭",
},
align: "center",
},
{
title: "备注说明",
dataIndex: "SALEBILL_DESC",
width: 180,
hideInSearch: true,
ellipsis: true,
align: "center",
}
]
// 订单详情的表格
const orderDetailColumns: any = [
{
dataIndex: "index",
title: "序号",
align: 'center',
hideInSearch: true,
valueType: "index",
width: 70,
ellipsis: true,
},
{
dataIndex: 'COMMODITY_NAME',
title: '商品名称',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'COMMODITY_BARCODE',
title: '商品条码',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'ORDER_COUNT',
title: '数量',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'AVERAGE_PRICE',
title: '单价',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'ORDER_AMOUNT',
title: '金额',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
]
// 关闭悬浮框
const handleCloseModal = () => {
handleConfirmLoading(false)
handleModalVisible(false)
setCurrentRow(undefined);
}
const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser | undefined }> = (props) => {
return ( return (
<div> <div>
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
<div style={{
width: '100% ',
paddingTop: 0,
paddingBottom: 0,
paddingRight: 0
}}>
<ProTable
actionRef={actionRef}
formRef={formRef}
columns={columns}
bordered
expandable={{
expandRowByClick: true
}}
scroll={{ x: "100%", y: "calc(100vh - 410px)" }}
headerTitle={<PageTitleBox props={props} />} // 列表表头
search={{ span: 6 }}
request={async (params) => {
const req = {
SearchParameter: {
OWNERUNIT_ID: currentUser?.OwnerUnitId,
PROVINCE_CODE: currentUser?.ProvinceCode,
// SALEBILL_TYPES: params?.orderType === '0' ? '8000,8020,8900,9000' : params?.orderType,
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
ORDER_DATE_End: params?.ORDER_DATE_End || "",
SALEBILL_STATES: params?.orderStatus === "0" ? "8000,8020,8900,9000" : params?.orderStatus,
SALEBILL_TYPES: "3999"
// CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD
},
PageIndex: 1,
PageSize: 999999,
SortStr: "ORDER_DATE desc",
}
console.log('reqreqreqreqreq', req);
// const data = await handeGetSALEBILLList(req);
const data = await handeGetSaleBillWholeList(req);
console.log('datadatadatadatadata', data);
if (data.List && data.List.length > 0) {
return { data: data.List, success: true, total: data.TotalCount }
}
return { data: [], success: true }
}}
toolbar={{
}}
/>
</div>
</div>
<Modal
className="OrderAfterSalesManageModal"
// title={
// <div
// style={{
// width: '100%',
// cursor: 'move',
// }}
// onMouseOver={() => {
// if (disabled) {
// setDraggleDisabled(false)
// }
// }}
// onMouseOut={() => {
// setDraggleDisabled(true)
// }}
// onFocus={() => { }}
// onBlur={() => { }}
// >
// {'订单详情'}
// </div>
// }
title={false}
closeIcon={<div></div>}
destroyOnClose={true}
width={1200}
visible={modalVisible}
confirmLoading={confirmLoading}
afterClose={() => {
formRef.current?.resetFields();
setCurrentRow(undefined);
}}
onCancel={() => {
handleConfirmLoading(false)
handleModalVisible(false)
setCurrentRow(undefined);
}}
footer={false}
modalRender={(modal) => {
return <Draggable
disabled={disabled}
bounds={bounds}
onStart={(event, uiData) => onDraggaleStart(event, uiData)}
handle=".bookingOrderModalTop"
>
<div ref={draggleRef}>{modal}</div>
</Draggable>
}}
>
<ProForm
layout={'horizontal'}
formRef={modalRef}
submitter={false}
initialValues={currentRow ? {
...currentRow,
ORDER_DATE: currentRow?.ORDER_DATE ? moment(currentRow?.ORDER_DATE).format('YYYY-MM-DD HH:mm:ss') : ''
} : {}}
>
<div className="bookingOrderModalTop">
<div className="modalTopLeft">
<img className="memberIcon" src={orderIcon} />
<span className="modalTitle">订单详情</span>
</div>
<div className="modalTopRight">
<img className="memberIcon" src={closeIcon} onClick={() => {
handleCloseModal()
}} />
</div>
</div>
<div className="bookingOrderModalCenter">
<div className="smallTitle">订单信息</div>
<Row gutter={8}>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"SALEBILL_CODE"}
label={"订单编码"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"CHANNEL_TYPE"}
label={"支付渠道"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"ORDER_DATE"}
label={"下单时间"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"RECORD_COUNT"}
label={"商品种类"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"TOTAL_COUNT"}
label={"商品件数"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"ORDER_AMOUNT"}
label={"订单金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"COUPON_AMOUNT"}
label={"优惠金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"PACK_AMOUNT"}
label={"打包金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"CONSUME_SCORE"}
label={"使用积分"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"PAY_AMOUNT"}
label={"实付金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormText
name={"COST_AMOUNT"}
label={"成本金额"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"SALEBILL_STATE"}
label={"订单状态"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "订单待支付", value: 1005 },
{ label: "订单待制作", value: 1010 },
{ label: "订单待取餐", value: 2000 },
{ label: "订单已完成", value: 3000 },
{ label: "退款申请中", value: 8000 },
{ label: "订单已退款", value: 8900 },
{ label: "订单已关闭", value: 9000 },
{ label: "订单已撤销", value: 9999 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"COMMENT_STATE"}
label={"订单评价状态"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "未评价", value: 0 },
{ label: "已评价", value: 1 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"TAKE_TYPE"}
label={"取餐方式"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "堂食", value: 1000 },
{ label: "预约", value: 2000 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"PACK_TYPE"}
label={"就餐方式"}
readonly
style={{ marginBottom: '16px' }}
options={[
{ label: "堂食", value: 1000 },
{ label: "打包", value: 2000 },
]}
/>
</Col>
<Col span={8} className="memberInfoDetailItem">
<ProFormSelect
name={"TAKE_NUMBER"}
label={"取餐码"}
readonly
style={{ marginBottom: '16px' }}
/>
</Col>
</Row>
</div>
</ProForm>
<ProTable
columns={orderDetailColumns}
bordered
search={false}
options={false}
request={async () => {
const req: any = {
searchParameter: {
SALEBILL_ID: currentRow?.SALEBILL_ID
},
PageIndex: 1,
PageSize: 999999,
}
const data = await handeGetSALEDETAILList(req)
console.log('datadatadata', data);
if (data.List && data.List.length > 0) {
return { data: data.List, success: true, total: data.TotalCount }
}
return { data: [], success: true }
}}
summary={() => {
// extra 是 request 返回的 extra 字段
return (
<tr>
<td colSpan={2} style={{ textAlign: 'center', fontWeight: 'bold' }}>合计</td>
<td />
<td style={{ textAlign: 'center', fontWeight: 'bold' }}>{currentRow?.TOTAL_COUNT || 0}</td>
<td />
<td style={{ textAlign: 'center', fontWeight: 'bold' }}>{currentRow?.ORDER_AMOUNT?.toFixed(2) || '0.00'}</td>
</tr>
)
}}
/>
</Modal>
</div> </div>
) )
} }

106
src/pages/travelMember/OrderAfterSalesManage/style.less Normal file
View File

@ -0,0 +1,106 @@
.OrderAfterSalesManageModal {
.react-draggable {
.ant-modal-content {
border-radius: 16px;
.ant-modal-body {
padding: 0;
height: 800px;
overflow-y: auto;
overflow: hidden;
.ant-form {
.bookingOrderModalTop {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #D5D8DE;
box-sizing: border-box;
padding-bottom: 10px;
box-sizing: border-box;
padding: 30px 20px;
.modalTopLeft {
display: flex;
align-items: center;
.memberIcon {
width: 18px;
height: 18px;
margin-right: 5px;
}
.modalTitle {
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 18px;
color: rgba(0, 0, 0, 0.85);
line-height: 18px;
text-align: left;
font-style: normal;
}
}
.modalTopRight {
width: 18px;
height: 18px;
.memberIcon {
width: 18px;
height: 18px;
cursor: pointer;
}
}
}
.bookingOrderModalCenter {
width: 100%;
height: 100%;
margin-top: 14px;
box-sizing: border-box;
padding: 0 34px;
.smallTitle {
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 16px;
color: #333333;
line-height: 10px;
text-align: left;
font-style: normal;
margin-bottom: 10px;
}
.smallTitle::after {
content: "";
width: 2px;
height: 14px;
background-color: #155DFE;
position: relative;
left: -5px;
top: 2px;
}
.ant-row {
.memberInfoDetailItem {
.ant-form-item {
margin-bottom: 12px;
}
}
}
}
}
}
.ant-modal-body::-webkit-scrollbar {
width: 0;
display: none;
}
}
}
}

480
src/pages/travelMember/OrderProductManage/index.tsx
View File

@ -1,5 +1,5 @@
// 点餐商品管理 // 点餐商品管理
import React, { useRef, useState, Suspense } from 'react'; import React, { useRef, useState, Suspense, Children, useEffect } from 'react';
import moment from 'moment'; // 时间相关引用，没有使用可以删除 import moment from 'moment'; // 时间相关引用，没有使用可以删除
import numeral from "numeral"; // 数字相关引用，没有使用可以删除 import numeral from "numeral"; // 数字相关引用，没有使用可以删除
import { connect } from 'umi'; import { connect } from 'umi';
@ -21,9 +21,9 @@ import type { ProDescriptionsItemProps } from '@ant-design/pro-descriptions';
import type { FormInstance } from 'antd'; import type { FormInstance } from 'antd';
import { getFieldEnumTree, getFieldEnumName } from "@/services/options"; // 枚举的引用，没有使用可以删除 import { getFieldEnumTree, getFieldEnumName } from "@/services/options"; // 枚举的引用，没有使用可以删除
import { handeDeleteCOMMODITY, handeGetCOMMODITYList, handeSynchroCOMMODITY, handlDeleteUSERDEFINEDTYPE, handlGetUSERDEFINEDTYPEList, handlSynchroUSERDEFINEDTYPE } from '../service'; import { handeDeleteCOMMODITY, handeGetBusinessCommodityList, handeGetCOMMODITYList, handeGetSellerCommodityList, handeSynchroCOMMODITY, handeSyncSellerCommodityInfo, handlDeleteUSERDEFINEDTYPE, handlGetUSERDEFINEDTYPEList, handlSynchroUSERDEFINEDTYPE } from '../service';
import PageTitleBox from '@/components/PageTitleBox'; import PageTitleBox from '@/components/PageTitleBox';
import { deletePicture, uploadPicture } from '@/services/picture'; import { deletePicture, SavePicture, uploadPicture } from '@/services/picture';
import defaultIcon from '../../../assets/brand/defaultIcon.png' import defaultIcon from '../../../assets/brand/defaultIcon.png'
import OrderCategoryTree from './components/OrderCategoryTree'; import OrderCategoryTree from './components/OrderCategoryTree';
import OrderCategoryManage from '../OrderCategoryManage'; import OrderCategoryManage from '../OrderCategoryManage';
@ -72,7 +72,14 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
const [selectedId, setSelectedId] = useState<string>() const [selectedId, setSelectedId] = useState<string>()
// 显示新增点餐分类的悬浮框 // 显示新增点餐分类的悬浮框
const [showFoodTypeModal, setShowFoodTypeModal] = useState<boolean>(false) const [showFoodTypeModal, setShowFoodTypeModal] = useState<boolean>(false)
// 获取商品的悬浮框
const [getProducts, setGetProducts] = useState<boolean>(false)
// 判断是否是第一次进入到页面
const [isFirst, setIsFirst] = useState<boolean>(true)
// 选择要上架的商品
const [selectListShop, setSelectListShop] = useState<any>()
// 点击选择了的商品上架的加载效果
const [selectListShopLoading, setSelectListShopLoading] = useState<boolean>(false)
const onDraggaleStart = (event, uiData) => { const onDraggaleStart = (event, uiData) => {
const { clientWidth, clientHeight } = window.document.documentElement; const { clientWidth, clientHeight } = window.document.documentElement;
@ -103,7 +110,7 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
}; };
}, },
}, },
initialValue: [moment().format('YYYY-MM-DD'), moment().subtract(1, 'M').format('YYYY-MM-DD')], // initialValue: [moment().format('YYYY-MM-DD'), moment().subtract(1, 'M').format('YYYY-MM-DD')],
}, },
// { // {
// title: '上级类别', // title: '上级类别',
@ -143,6 +150,8 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
hideInSearch: true, hideInSearch: true,
render: (_, record) => { render: (_, record) => {
return record?.COMMODITY_NAME ? <a onClick={() => { return record?.COMMODITY_NAME ? <a onClick={() => {
console.log('recordrecordrecord', record);
setCurrentRow(record) setCurrentRow(record)
setShowDetail(true) setShowDetail(true)
}}>{record?.COMMODITY_NAME}</a> : "" }}>{record?.COMMODITY_NAME}</a> : ""
@ -211,7 +220,58 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
hideInSearch: true, hideInSearch: true,
} }
]; ];
// 新增商品的columns
const getProductsColumns: any = [
{
title: "序号",
width: 70,
dataIndex: "index",
ellipsis: true,
hideInSearch: true,
align: 'center',
valueType: "index"
},
{
title: "商品名称",
width: 300,
dataIndex: "COMMODITY_NAME",
ellipsis: true,
align: 'center',
hideInSearch: true,
},
{
title: "商品条码",
width: 200,
dataIndex: "COMMODITY_BARCODE",
ellipsis: true,
align: 'center',
hideInSearch: true,
},
{
title: "零售价",
width: 150,
dataIndex: "COMMODITY_RETAILPRICE",
ellipsis: true,
align: 'center',
hideInSearch: true,
},
{
title: "商品单位",
width: 150,
dataIndex: "COMMODITY_UNIT",
ellipsis: true,
align: 'center',
hideInSearch: true,
},
{
title: "商品规格",
width: 150,
dataIndex: "COMMODITY_RULE",
ellipsis: true,
align: 'center',
hideInSearch: true,
},
]
// 预览上传后的图片 // 预览上传后的图片
const handlePreview = async () => { const handlePreview = async () => {
@ -235,41 +295,115 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
const handleAddUpdate = async (res: any) => { const handleAddUpdate = async (res: any) => {
let req: any = {} let req: any = {}
if (currentRow?.USERDEFINEDTYPE_ID) { console.log('resresresresresres', res);
if (currentRow?.COMMODITY_ID) {
req = { req = {
...currentRow, ...currentRow,
...res, ...res,
MERCHANTS_ID: selectedId,
OWNERUNIT_ID: currentUser?.OwnerUnitId, OWNERUNIT_ID: currentUser?.OwnerUnitId,
OWNERUNIT_NAME: currentUser?.OwnerUnitName, OWNERUNIT_NAME: currentUser?.OwnerUnitName,
PROVINCE_CODE: currentUser?.ProvinceCode, PROVINCE_CODE: currentUser?.ProvinceCode,
OPERATE_PERSON: currentUser?.ID, STAFF_ID: currentUser?.ID,
COMMODITY_TYPE: 3000, STAFF_NAME: currentUser?.Name,
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'), OPERATE_DATE: moment().format('YYYY-MM-DD HH:mm:ss'),
} }
} else { } else {
req = { req = {
...res, ...res,
MERCHANTS_ID: selectedId,
OWNERUNIT_ID: currentUser?.OwnerUnitId, OWNERUNIT_ID: currentUser?.OwnerUnitId,
OWNERUNIT_NAME: currentUser?.OwnerUnitName, OWNERUNIT_NAME: currentUser?.OwnerUnitName,
PROVINCE_CODE: currentUser?.ProvinceCode, PROVINCE_CODE: currentUser?.ProvinceCode,
OPERATE_PERSON: currentUser?.ID, STAFF_ID: currentUser?.ID,
COMMODITY_TYPE: 3000, STAFF_NAME: currentUser?.Name,
OPERATE_DATE: moment().format('YYYY-MM-DD HH:mm:ss'),
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'), OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
} }
} }
const data = await handeSynchroCOMMODITY(req) // const data = await handeSynchroCOMMODITY(req)
if (res.ImageInfo && res.ImageInfo.length > 0) {
let imageData = await handleUploadShopImg(res)
console.log('imageData', imageData);
let imgList: any = imageData.Result_Data
req.ImageInfo = imgList
}
console.log('reqreqreqreqreq', req);
const data = await handeSyncSellerCommodityInfo({ list: [req] })
handleConfirmLoading(false) handleConfirmLoading(false)
if (data.Result_Code === 100) { if (data.Result_Code === 100) {
message.success("新增成功！")
message.success("同步成功！")
setCurrentRow(undefined) setCurrentRow(undefined)
formRef?.current?.resetFields() formRef?.current?.resetFields()
handleModalVisible(false) handleConfirmLoading(false)
setShowDetail(false)
setFileList([])
actionRef.current?.reload() actionRef.current?.reload()
} else { } else {
message.error(data.Result_Desc) message.error(data.Result_Desc)
} }
}; };
// 上传商品图片
const handleUploadShopImg = async (formRes: any) => {
if (formRes.ImageInfo && formRes.ImageInfo.length > 0) {
const formData = new FormData();
formRes.ImageInfo.forEach((file: any) => {
formData.append('files[]', file.originFileObj);
formData.append('ImageName', typeof file !== 'string' ? file?.name : '');
});
formData.append('imageType', "1000");
formData.append('TableType', "1207");
console.log('formData', formData);
let res = await SavePicture(formData)
return res
}
}
// 获取商品类别的树
const handleGetCOMMODITYTYPE = async () => {
const req = {
OWNERUNIT_ID: currentUser?.OwnerUnitId,
PROVINCE_CODE: "",
GOODSTYPE: 3000,
USERDEFINEDTYPE_STATE: 1
// SearchKey: ""
}
let data = await handlGetUSERDEFINEDTYPEList(req);
console.log('datadatadatadatadata2', data);
if (data && data.length > 0) {
// data.unshirft({ USERDEFINEDTYPE_NAME: "默认类别", USERDEFINEDTYPE_ID: -1 })
setTypeTreeData(processTreeData(data))
} else {
setTypeTreeData([])
}
}
const processTreeData = (data: any) => {
return data.map((item: any) => {
if (item.children && item.children.length > 0) {
return {
...item,
disabled: true, // 有子节点的节点禁用
children: processTreeData(item.children)
};
}
return item;
});
};
useEffect(async () => {
await handleGetCOMMODITYTYPE()
}, [])
return ( return (
<div> <div>
<div style={{ backgroundColor: '#fff', display: 'flex' }}> <div style={{ backgroundColor: '#fff', display: 'flex' }}>
@ -282,8 +416,7 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
paddingRight: 0 paddingRight: 0
}}> }}>
<ProTable <ProTable
style={{ height: 'calc(100vh - 135px)', background: '#fff' }} scroll={{ x: "100%", y: 'calc(100vh - 410px)' }}
scroll={{ y: 'calc(100vh - 410px)' }}
rowKey={(record) => { rowKey={(record) => {
return `${record?.USERDEFINEDTYPE_PID}-${record?.USERDEFINEDTYPE_ID}` return `${record?.USERDEFINEDTYPE_PID}-${record?.USERDEFINEDTYPE_ID}`
}} }}
@ -294,6 +427,10 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
bordered bordered
// 请求数据 // 请求数据
request={async (params, sorter) => { request={async (params, sorter) => {
if (isFirst) {
setIsFirst(false)
return []
}
console.log('selectedIdselectedIdselectedIdselectedIdselectedId', selectedId); console.log('selectedIdselectedIdselectedIdselectedIdselectedId', selectedId);
@ -301,12 +438,13 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
searchParameter: { searchParameter: {
// OWNERUNIT_ID: currentUser?.OwnerUnitId, // OWNERUNIT_ID: currentUser?.OwnerUnitId,
PROVINCE_CODE: currentUser?.ProvinceCode, PROVINCE_CODE: currentUser?.ProvinceCode,
SERVERPART_IDS: params?.SERVERPART_IDS || "",
SELLER_IDS: selectedId || "",
UPPER_STATE: params?.UPPER_STATE === "-1" ? "" : params?.UPPER_STATE,
// USERDEFINEDTYPE_IDS: selectedId, // USERDEFINEDTYPE_IDS: selectedId,
OPERATE_DATE_Start: params?.OPERATE_DATE_Start || "", OPERATE_DATE_Start: params?.OPERATE_DATE_Start || "",
OPERATE_DATE_End: params?.OPERATE_DATE_End || "", OPERATE_DATE_End: params?.OPERATE_DATE_End || "",
UPPER_STATE: params?.UPPER_STATE === "-1" ? "" : params?.UPPER_STATE,
SELLER_IDS: selectedId || "",
COMMODITY_TYPE: 3000
}, },
PageIndex: 1, PageIndex: 1,
PageSize: 999999, PageSize: 999999,
@ -314,7 +452,8 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
} }
console.log('reqreqreqreq', req); console.log('reqreqreqreq', req);
const data = await handeGetCOMMODITYList(req); const data = await handeGetSellerCommodityList(req);
// const data = await handeGetCOMMODITYList(req);
console.log('datadatadatadatadata', data); console.log('datadatadatadatadata', data);
if (data.List && data.List.length > 0) { if (data.List && data.List.length > 0) {
return { data: data.List, success: true, total: data.TotalCount } return { data: data.List, success: true, total: data.TotalCount }
@ -324,28 +463,38 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
columns={columns} columns={columns}
toolbar={{ toolbar={{
actions: [ actions: [
<Button type={"primary"} onClick={() => { selectedId ?
setShowDetail(true) <>
}}>新增商品</Button> <Button onClick={() => {
setGetProducts(true)
}}>获取商品</Button>
< Button type={"primary"} onClick={() => {
setShowDetail(true)
}}>新增商品</Button>
</>
: "",
], ],
}} }}
/> />
</div> </div>
</div> </div>
{/* 图片预览组件 */} {/* 图片预览组件 */}
{fileList && fileList.length > 0 && <div style={{ display: 'none' }}> {
<Image.PreviewGroup fileList && fileList.length > 0 && <div style={{ display: 'none' }}>
preview={{ <Image.PreviewGroup
visible: imagePreviewVisible, preview={{
onVisibleChange: vis => { visible: imagePreviewVisible,
handleChangePreview(vis) onVisibleChange: vis => {
handleChangePreview(vis)
}
}}>
{
fileList.map((n) => <Image src={n.url} key={n.url} />)
} }
}}> </Image.PreviewGroup>
{ </div>
fileList.map((n) => <Image src={n.url} key={n.url} />) }
}
</Image.PreviewGroup>
</div>}
<Modal <Modal
@ -383,6 +532,7 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
handleConfirmLoading(false) handleConfirmLoading(false)
setShowDetail(false) setShowDetail(false)
setCurrentRow(undefined) setCurrentRow(undefined)
setFileList([])
}} }}
onOk={async () => { // 提交框内的数据 onOk={async () => { // 提交框内的数据
@ -412,23 +562,48 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
autoFocusFirstInput autoFocusFirstInput
submitter={false} submitter={false}
preserve={false} preserve={false}
initialValues={currentRow ? { request={async () => {
...currentRow, if (currentRow) {
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'), if (currentRow?.ImageInfo && currentRow?.ImageInfo.length > 0) {
} : { let list: any = []
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'), currentRow?.ImageInfo.forEach((item: any) => {
OPERATE_PERSON: currentUser?.Name let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
list.push(obj)
})
setFileList(list)
}
return {
...currentRow,
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
}
} else {
return {
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
OPERATE_PERSON: currentUser?.Name,
UPPER_STATE: 1
}
}
}} }}
// initialValues={currentRow ? {
// ...currentRow,
// OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
// } : {
// OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
// OPERATE_PERSON: currentUser?.Name,
// UPPER_STATE: 1
// }}
onFinish={async (values) => { onFinish={async (values) => {
let newValue = { ...values }; let newValue = { ...values };
if (currentRow) { if (currentRow) {
// 编辑数据 // 编辑数据
newValue = { ...values, USERDEFINEDTYPE_ID: currentRow.USERDEFINEDTYPE_ID }; newValue = { ...values };
} }
console.log('fileListfileList', fileList);
console.log('newValuenewValuenewValue', newValue);
// 如果有开关，要把开关的代码写进去 // 如果有开关，要把开关的代码写进去
await handleAddUpdate(newValue); await handleAddUpdate(newValue);
@ -441,38 +616,44 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
<Row gutter={8}> <Row gutter={8}>
<Col span={18}> <Col span={18}>
<ProFormTreeSelect <ProFormTreeSelect
name="COMMODITY_TYPE" name="USERDEFINEDTYPE_ID"
label="商品类别" label="商品类别"
request={async () => { request={async () => {
// if (typeTreeData && typeTreeData.length > 0) { const req = {
// let list: any = [{ USERDEFINEDTYPE_NAME: "默认类别", USERDEFINEDTYPE_ID: -1 }, ...typeTreeData] OWNERUNIT_ID: currentUser?.OwnerUnitId,
// return list PROVINCE_CODE: "",
// } else { GOODSTYPE: 3000,
// const req = { USERDEFINEDTYPE_STATE: 1
// OWNERUNIT_ID: currentUser?.OwnerUnitId, // SearchKey: ""
// PROVINCE_CODE: "", }
// GOODSTYPE: 4000, let data = await handlGetUSERDEFINEDTYPEList(req);
// } console.log('datadatadatadatadata2', data);
// const data = await handlGetUSERDEFINEDTYPEList(req); if (data && data.length > 0) {
// console.log('datadatadatadatadata', data); // data.unshirft({ USERDEFINEDTYPE_NAME: "默认类别", USERDEFINEDTYPE_ID: -1 })
// if (data.List && data.List.length > 0) { return processTreeData(data)
// data.List.unshirft({ USERDEFINEDTYPE_NAME: "默认类别", USERDEFINEDTYPE_ID: -1 }) } else {
// setTypeTreeData(data.List) return []
// return data.List }
// } else {
// return [{ USERDEFINEDTYPE_NAME: "默认类别", USERDEFINEDTYPE_ID: -1 }]
// }
// }
}} }}
fieldProps={{ fieldProps={{
// fieldNames: { fieldNames: {
// label: 'USERDEFINEDTYPE_NAME', label: 'USERDEFINEDTYPE_NAME',
// value: 'USERDEFINEDTYPE_ID', value: 'USERDEFINEDTYPE_ID',
// children: 'children' children: 'children'
// }, },
// showSearch: true, showSearch: true,
// filterTreeNode: (input, node) => treeDefaultExpandAll: true,
// (node.USERDEFINEDTYPE_NAME || '').toLowerCase().includes(input.toLowerCase()) filterTreeNode: (input, node) =>
(node.USERDEFINEDTYPE_NAME || '').toLowerCase().includes(input.toLowerCase()),
onChange: (value, label) => {
console.log('value', value);
console.log('label', label);
formRef.current?.setFieldsValue({
USERDEFINEDTYPE_NAME: label.toString(),
USERDEFINEDTYPE_ID: value
});
}
}} }}
rules={[ rules={[
{ {
@ -489,6 +670,12 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
</Col> </Col>
</Row> </Row>
</Col> </Col>
<Col style={{ display: 'none' }}>
<ProFormText
name="USERDEFINEDTYPE_NAME"
label=""
/>
</Col>
<Col span={8}> <Col span={8}>
<ProFormText <ProFormText
name="COMMODITY_NAME" name="COMMODITY_NAME"
@ -509,14 +696,28 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
</Col> </Col>
<Col span={8}> <Col span={8}>
<ProFormText <ProFormText
name="LIMIT_DAILYCOUNT" name="COMMODITY_STOCK"
label="每日可售" label="每日可售"
/> />
</Col> </Col>
<Col span={16}> <Col span={8}>
<ProFormDateRangePicker <ProFormDatePicker
name="" width={'lg'}
name="UPPER_DATE"
label="生效时间" label="生效时间"
rules={[
{
required: true,
message: '请选择生效时间'
}
]}
/>
</Col>
<Col span={8}>
<ProFormDatePicker
width={'lg'}
name="OFF_DATE"
label="下架时间"
/> />
</Col> </Col>
<Col span={8}> <Col span={8}>
@ -531,12 +732,6 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
label="商品规格" label="商品规格"
/> />
</Col> </Col>
<Col span={8}>
<ProFormText
name="COMMODITY_HOTKEY"
label="快捷键码"
/>
</Col>
<Col span={8}> <Col span={8}>
<ProFormDigit <ProFormDigit
name="COMMODITY_RETAILPRICE" name="COMMODITY_RETAILPRICE"
@ -565,7 +760,7 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
<ProFormSelect <ProFormSelect
name="UPPER_STATE" name="UPPER_STATE"
label="上架状态" label="上架状态"
options={[{ label: "有效", value: 1 }, { label: "无效", value: 0 }]} options={[{ label: "已上架", value: 1 }, { label: "未上架", value: 0 }]}
rules={[ rules={[
{ {
required: true, required: true,
@ -576,33 +771,33 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
</Col> </Col>
<Col span={8}> <Col span={8}>
<ProFormText <ProFormText
name="OPERATE_PERSON" name="STAFF_NAME"
label="操作人员" label="操作人员"
disabled disabled
/> />
</Col> </Col>
<Col span={8}> <Col span={8}>
<ProFormText <ProFormText
name="OPERATE_TIME" name="OPERATE_DATE"
label="操作时间" label="操作时间"
disabled disabled
/> />
</Col> </Col>
<Col span={24}> <Col span={24}>
<ProFormText <ProFormText
name="COMMODITY_INTRO" name="COMMODITY_EN"
label="商品简介" label="商品简介"
/> />
</Col> </Col>
<Col span={24}> <Col span={24}>
<ProFormUploadButton <ProFormUploadButton
name="" name="ImageInfo"
label="商品图片" label="商品图片"
listType="picture-card" listType="picture-card"
accept="image/*" accept="image/*"
max={1}
fieldProps={{ fieldProps={{
beforeUpload, beforeUpload,
maxCount: 1,
onPreview: handlePreview, onPreview: handlePreview,
fileList: fileList, // 绑定 fileList fileList: fileList, // 绑定 fileList
onChange: async (info: any) => { onChange: async (info: any) => {
@ -614,7 +809,13 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
async onOk() { async onOk() {
if (info.file.ImageId) { if (info.file.ImageId) {
const deleteLoading = message.loading('正在删除...') const deleteLoading = message.loading('正在删除...')
const success = await deletePicture(info.file?.ImagePath, info.file?.uid, '', '5000') const success = await deletePicture(info.file?.ImagePath, info.file?.uid, '', '6000')
await handeSyncSellerCommodityInfo({
list: [{
...currentRow,
ImageInfo: null
}]
})
deleteLoading() deleteLoading()
if (success) { if (success) {
@ -647,9 +848,6 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
</ProForm> </ProForm>
</Modal> </Modal>
<Modal <Modal
title={"新增点餐分类"} title={"新增点餐分类"}
destroyOnClose={true} destroyOnClose={true}
@ -666,7 +864,99 @@ const OrderProductManage: React.FC<{ currentUser: CurrentUser | undefined }> = (
> >
<OrderCategoryManage /> <OrderCategoryManage />
</Modal> </Modal>
</div>
{/* 获取商品的悬浮框 */}
<Modal
title={"获取商品"}
destroyOnClose={true}
width={1400}
visible={getProducts}
footer={<div style={{ width: "100%", display: 'flex', justifyContent: 'flex-end', boxSizing: 'border-box', padding: '0 16px' }}>
<Button type={"primary"} loading={selectListShopLoading} onClick={async () => {
if (selectListShop && selectListShop.length > 0) {
setSelectListShopLoading(true)
console.log('selectListShopselectListShopselectListShop', selectListShop);
let list: any = []
selectListShop.forEach((item: any) => {
let obj: any = JSON.parse(JSON.stringify(item))
obj.MERCHANTS_ID = selectedId
obj.UPPER_STATE = 1
obj.STAFF_ID = currentUser?.ID
obj.STAFF_NAME = currentUser?.Name
obj.OPERATE_DATE = moment().format('YYYY-MM-DD HH:mm:ss')
obj.PROVINCE_CODE = currentUser?.ProvinceCode
list.push(obj)
})
const req: any = {
list: list
}
console.log('req', req);
const data = await handeSyncSellerCommodityInfo(req)
console.log('data', data);
if (data.Result_Code === 100) {
message.success("同步成功!")
setGetProducts(false)
setSelectListShop([])
setSelectListShopLoading(false)
actionRef.current?.reload()
} else {
message.error(data.Result_Desc)
}
} else {
message.error('请勾选需要上架的商品！')
}
}}>确认上架</Button>
</div>}
onCancel={() => {
setGetProducts(false)
setSelectListShop([])
setSelectListShopLoading(false)
}}
bodyStyle={{
maxHeight: '700px', // 你可以根据需要调整高度
overflowY: 'auto',
}}
>
<ProTable
columns={getProductsColumns}
bordered
search={false}
rowKey={"COMMODITY_ID"}
options={false}
request={async () => {
const req: any = {
ProvinceCode: currentUser?.ProvinceCode,
ServerpartShopId: "",
SellerId: selectedId,
SearchKeyName: "",
SearchKeyValue: "",
PageIndex: 1,
PageSize: 999999,
SortStr: ""
}
console.log('reqreqreqreq', req);
const data = await handeGetBusinessCommodityList(req)
console.log('datadatadatadata', data);
if (data.List && data.List.length > 0) {
return { data: data.List, success: true, total: data.TotalCount }
}
return { data: [], success: true }
}}
rowSelection={{
type: "checkbox",
onChange: (_, selectedRows) => {
setSelectListShop(selectedRows)
}
}}
/>
</Modal>
</div >
); );
}; };
export default connect(({ user }: ConnectState) => ({ export default connect(({ user }: ConnectState) => ({

31
src/pages/travelMember/ProductListingManagement/component/LeftSelectMallType.tsx
View File

@ -12,6 +12,7 @@ import useRequest from "@ahooksjs/use-request";
import './style.less' import './style.less'
import { getMerchantShopTree } from "@/pages/Setting/Users/service"; import { getMerchantShopTree } from "@/pages/Setting/Users/service";
import { handlGetUSERDEFINEDTYPEList } from "../../service"; import { handlGetUSERDEFINEDTYPEList } from "../../service";
import session from "@/utils/session";
type DetailProps = { type DetailProps = {
@ -37,16 +38,28 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
const [isShowAllInTree, setIsShowAllInTree] = useState<boolean>(false) const [isShowAllInTree, setIsShowAllInTree] = useState<boolean>(false)
// 加载服务区树 // 加载服务区树
const { loading: treeLoading, data: treeViews } = useRequest(async () => { const { loading: treeLoading, data: treeViews } = useRequest(async () => {
const req = {
OWNERUNIT_ID: currentUser?.OwnerUnitId, let USERDEFINEDTYPEList: any = session.get('USERDEFINEDTYPEList')
PROVINCE_CODE: "", if (USERDEFINEDTYPEList && USERDEFINEDTYPEList.length > 0) {
GOODSTYPE: 4000, setTreeView(USERDEFINEDTYPEList)
USERDEFINEDTYPE_STATE: 1 setData(USERDEFINEDTYPEList)
return USERDEFINEDTYPEList
} else {
const req = {
OWNERUNIT_ID: currentUser?.OwnerUnitId,
PROVINCE_CODE: "",
GOODSTYPE: 4000,
USERDEFINEDTYPE_STATE: 1
}
const data = await handlGetUSERDEFINEDTYPEList(req);
setTreeView(data)
setData(data)
session.set("USERDEFINEDTYPEList", data)
return data
} }
const data = await handlGetUSERDEFINEDTYPEList(req);
setTreeView(data)
setData(data)
return data
}) })
// 显示服务区树搜索框 // 显示服务区树搜索框
const [showServiceSearchBox, setShowServiceSearchBox] = useState<boolean>(false) const [showServiceSearchBox, setShowServiceSearchBox] = useState<boolean>(false)

580
src/pages/travelMember/ProductListingManagement/index.tsx
View File

@ -12,7 +12,7 @@ import ProDescriptions from '@ant-design/pro-descriptions';
import ProForm, { ProFormDatePicker, ProFormDateRangePicker, ProFormDateTimePicker, ProFormDigit, ProFormMoney, ProFormSelect, ProFormText, ProFormTextArea, ProFormTreeSelect, ProFormUploadButton } from '@ant-design/pro-form'; import ProForm, { ProFormDatePicker, ProFormDateRangePicker, ProFormDateTimePicker, ProFormDigit, ProFormMoney, ProFormSelect, ProFormText, ProFormTextArea, ProFormTreeSelect, ProFormUploadButton } from '@ant-design/pro-form';
import { MenuFoldOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; import { MenuFoldOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import { PageContainer } from '@ant-design/pro-layout'; import { PageContainer } from '@ant-design/pro-layout';
import { Button, Col, Drawer, message, Row, Popconfirm, Space, Image, Modal, Form, Switch, Upload, Tooltip, Descriptions, TreeSelect, Divider } from 'antd'; import { Button, Col, Drawer, message, Row, Popconfirm, Space, Image, Modal, Form, Switch, Upload, Tooltip, Descriptions, TreeSelect, Divider, Input } from 'antd';
import type { CurrentUser } from "umi"; import type { CurrentUser } from "umi";
import type { ConnectState } from '@/models/connect'; import type { ConnectState } from '@/models/connect';
@ -24,13 +24,28 @@ import { getFieldEnumTree, getFieldEnumName } from "@/services/options"; // 枚
import { getList, delcommodity, updatecommodity } from './service'; // 接口相关对象的引用 import { getList, delcommodity, updatecommodity } from './service'; // 接口相关对象的引用
import PageTitleBox from "@/components/PageTitleBox"; import PageTitleBox from "@/components/PageTitleBox";
import LeftSelectMallType from './component/LeftSelectMallType'; import LeftSelectMallType from './component/LeftSelectMallType';
import { handeDeleteCOMMODITY, handeGetCOMMODITY_MULTIList, handeGetCOMMODITYDetail, handeGetCOMMODITYList, handeGetMERCHANTSList, handeGetRTCOMMODITY_MULTIList, handeSynchroCOMMODITY, handleGetBRANDList, handlGetUSERDEFINEDTYPEList } from '../service'; import { handeDeleteCOMMODITY, handeDeleteRTCOMMODITY_MULTI, handeGetCOMMODITY_MULTIList, handeGetCOMMODITYDetail, handeGetCOMMODITYList, handeGetMERCHANTSList, handeGetRTCOMMODITY_MULTIList, handeSynchroCOMMODITY, handeSynchroRTCOMMODITYMULTIList, handleGetBRANDList, handlGetUSERDEFINEDTYPEList } from '../service';
import session from '@/utils/session'; import session from '@/utils/session';
import { deletePicture, uploadPicture } from '@/services/picture';
const beforeUpload = (file: any) => {
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
if (!isJpgOrPng) {
message.error('请上传JPEG、jpg、png格式的图片文件!');
}
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
message.error('图片大小不超过 2MB!');
}
return isJpgOrPng && isLt2M;
}
const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (props) => { const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (props) => {
const { currentUser } = props const { currentUser } = props
const { confirm } = Modal;
const actionRef = useRef<ActionType>(); const actionRef = useRef<ActionType>();
const ruleActionRef = useRef<ActionType>();
const formRef = useRef<FormInstance>(); const formRef = useRef<FormInstance>();
const [currentRow, setCurrentRow] = useState<any>(); const [currentRow, setCurrentRow] = useState<any>();
const [showDetail, setShowDetail] = useState<boolean>(); const [showDetail, setShowDetail] = useState<boolean>();
@ -70,7 +85,24 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
const [selectedRows, setSelectedRows] = useState<any>() const [selectedRows, setSelectedRows] = useState<any>()
// 当前商品关联的规格数据 // 当前商品关联的规格数据
const [specsData, setSpecsData] = useState<any>() const [specsData, setSpecsData] = useState<any>()
// 主图图片
const [mainImgList, setMainImgList] = useState<any>()
// 头部轮播框
const [headerImgList, setHeaderImgList] = useState<any>()
// 详情图
const [detailImgList, setDetailImgList] = useState<any>()
// 文件列表
const [fileList, setFileList] = useState<any>([])
const [imagePreviewVisible, setImagePreviewVisible] = useState<boolean>(false) // 预览图片
// 预览上传后的图片
const handlePreview = async () => {
setFileList(fileList)
setImagePreviewVisible(true)
};
const handleChangePreview = (val: any) => {
setImagePreviewVisible(val)
}
const onDraggaleStart = (event, uiData) => { const onDraggaleStart = (event, uiData) => {
@ -217,6 +249,8 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
<Space> <Space>
<a <a
onClick={() => { onClick={() => {
console.log('recordrecordrecord', record);
setCurrentRow({ ...record }); setCurrentRow({ ...record });
handleModalVisible(true); handleModalVisible(true);
}} }}
@ -248,14 +282,14 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
valueType: 'index', valueType: 'index',
}, },
{ {
dataIndex: 'COMMODITY_MULTI_ID', dataIndex: 'USERDEFINEDTYPE_NAME',
title: '规格分类', title: '规格分类',
align: 'center', align: 'center',
width: 120, width: 120,
ellipsis: true, ellipsis: true,
}, },
{ {
dataIndex: 'USERDEFINEDTYPE_NAME ', dataIndex: 'COMMODITY_NAME',
title: '规格名称', title: '规格名称',
align: 'center', align: 'center',
width: 150, width: 150,
@ -267,6 +301,19 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
align: 'center', align: 'center',
width: 120, width: 120,
ellipsis: true, ellipsis: true,
render: (_, record) => {
return <Input value={record.COMMODITY_STOCK} onChange={(e: any) => {
let oldData: any = JSON.parse(JSON.stringify(specsData))
let list: any = []
oldData.forEach((item: any) => {
if (item.COMMODITY_MULTI_ID === record?.COMMODITY_MULTI_ID) {
item.COMMODITY_STOCK = e.target.value
}
list.push(item)
})
setSpecsData(list)
}} />
}
}, },
{ {
dataIndex: 'COMMODITY_RETAILPRICE', dataIndex: 'COMMODITY_RETAILPRICE',
@ -274,6 +321,19 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
align: 'center', align: 'center',
width: 120, width: 120,
ellipsis: true, ellipsis: true,
render: (_, record) => {
return <Input value={record.COMMODITY_RETAILPRICE} onChange={(e: any) => {
let oldData: any = JSON.parse(JSON.stringify(specsData))
let list: any = []
oldData.forEach((item: any) => {
if (item.COMMODITY_MULTI_ID === record?.COMMODITY_MULTI_ID) {
item.COMMODITY_RETAILPRICE = e.target.value
}
list.push(item)
})
setSpecsData(list)
}} />
}
}, },
{ {
dataIndex: 'COMMODITY_MEMBERPRICE', dataIndex: 'COMMODITY_MEMBERPRICE',
@ -281,6 +341,19 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
align: 'center', align: 'center',
width: 120, width: 120,
ellipsis: true, ellipsis: true,
render: (_, record) => {
return <Input value={record.COMMODITY_MEMBERPRICE} onChange={(e: any) => {
let oldData: any = JSON.parse(JSON.stringify(specsData))
let list: any = []
oldData.forEach((item: any) => {
if (item.COMMODITY_MULTI_ID === record?.COMMODITY_MULTI_ID) {
item.COMMODITY_MEMBERPRICE = e.target.value
}
list.push(item)
})
setSpecsData(list)
}} />
}
}, },
{ {
dataIndex: 'COMMODITY_PURCHASEPRICE', dataIndex: 'COMMODITY_PURCHASEPRICE',
@ -288,7 +361,50 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
align: 'center', align: 'center',
width: 120, width: 120,
ellipsis: true, ellipsis: true,
} render: (_, record) => {
return <Input value={record.COMMODITY_PURCHASEPRICE} onChange={(e: any) => {
let oldData: any = JSON.parse(JSON.stringify(specsData))
let list: any = []
oldData.forEach((item: any) => {
if (item.COMMODITY_MULTI_ID === record?.COMMODITY_MULTI_ID) {
item.COMMODITY_PURCHASEPRICE = e.target.value
}
list.push(item)
})
setSpecsData(list)
}} />
}
},
{
dataIndex: 'option',
title: '操作',
valueType: 'option',
align: 'center',
hideInSearch: true,
width: 120,
ellipsis: true,
render: (_, record) => {
return (
<Space>
<Popconfirm
title="确认删除该商品规格嘛?"
onConfirm={async () => {
console.log('recordrecordrecord', record);
const data = await handeDeleteRTCOMMODITY_MULTI({ RTCOMMODITY_MULTIId: record?.RTCOMMODITY_MULTI_ID })
if (data.Result_Code !== 100) {
message.error(`${data.Result_Desc}` || `${data.Result_Code}:删除失败`);
} else {
message.success('删除成功！');
ruleActionRef.current?.reload()
}
}}
>
<a>删除</a>
</Popconfirm>
</Space>
);
},
},
] ]
// 新增多规格的表格 // 新增多规格的表格
@ -341,6 +457,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
req = { req = {
...currentRow, ...currentRow,
...res, ...res,
UserDefinedTypeIds: res.USERDEFINEDTYPE_ID ? res.USERDEFINEDTYPE_ID.toString() : "",
BRAND_ID: res.BRAND_ID.split('-')[1], BRAND_ID: res.BRAND_ID.split('-')[1],
BRAND_NAME: res.BRAND_ID.split('-')[0], BRAND_NAME: res.BRAND_ID.split('-')[0],
MERCHANTS_ID: res.MERCHANTS_ID.split('-')[1], MERCHANTS_ID: res.MERCHANTS_ID.split('-')[1],
@ -348,9 +465,11 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
OWNERUNIT_ID: currentUser?.OwnerUnitId, OWNERUNIT_ID: currentUser?.OwnerUnitId,
OWNERUNIT_NAME: currentUser?.OwnerUnitName, OWNERUNIT_NAME: currentUser?.OwnerUnitName,
PROVINCE_CODE: currentUser?.ProvinceCode, PROVINCE_CODE: currentUser?.ProvinceCode,
OPERATE_PERSON: currentUser?.ID, OPERATE_PERSON: currentUser?.Name,
SELLER_ID: currentUser?.ID,
COMMODITY_TYPE: 4000, COMMODITY_TYPE: 4000,
COMMODITY_STATE: 1, COMMODITY_STATE: 1,
USERDEFINEDTYPE_ID: "",
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'), OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
UPPER_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[0]).format('YYYY-MM-DD HH:mm:ss') : "", UPPER_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[0]).format('YYYY-MM-DD HH:mm:ss') : "",
OFF_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[1]).format('YYYY-MM-DD HH:mm:ss') : "", OFF_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[1]).format('YYYY-MM-DD HH:mm:ss') : "",
@ -358,6 +477,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
} else { } else {
req = { req = {
...res, ...res,
UserDefinedTypeIds: res.USERDEFINEDTYPE_ID ? res.USERDEFINEDTYPE_ID.toString() : "",
BRAND_ID: res.BRAND_ID.split('-')[1], BRAND_ID: res.BRAND_ID.split('-')[1],
BRAND_NAME: res.BRAND_ID.split('-')[0], BRAND_NAME: res.BRAND_ID.split('-')[0],
MERCHANTS_ID: res.MERCHANTS_ID.split('-')[1], MERCHANTS_ID: res.MERCHANTS_ID.split('-')[1],
@ -365,9 +485,11 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
OWNERUNIT_ID: currentUser?.OwnerUnitId, OWNERUNIT_ID: currentUser?.OwnerUnitId,
OWNERUNIT_NAME: currentUser?.OwnerUnitName, OWNERUNIT_NAME: currentUser?.OwnerUnitName,
PROVINCE_CODE: currentUser?.ProvinceCode, PROVINCE_CODE: currentUser?.ProvinceCode,
OPERATE_PERSON: currentUser?.ID, OPERATE_PERSON: currentUser?.Name,
SELLER_ID: currentUser?.ID,
COMMODITY_TYPE: 4000, COMMODITY_TYPE: 4000,
COMMODITY_STATE: 1, COMMODITY_STATE: 1,
USERDEFINEDTYPE_ID: "",
OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'), OPERATE_TIME: moment().format('YYYY-MM-DD HH:mm:ss'),
UPPER_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[0]).format('YYYY-MM-DD HH:mm:ss') : "", UPPER_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[0]).format('YYYY-MM-DD HH:mm:ss') : "",
OFF_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[1]).format('YYYY-MM-DD HH:mm:ss') : "", OFF_DATE: res.UPPER_DATE && res.UPPER_DATE.length > 0 ? moment(res.UPPER_DATE[1]).format('YYYY-MM-DD HH:mm:ss') : "",
@ -378,6 +500,9 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
const data = await handeSynchroCOMMODITY(req) const data = await handeSynchroCOMMODITY(req)
handleConfirmLoading(false) handleConfirmLoading(false)
if (data.Result_Code === 100) { if (data.Result_Code === 100) {
await handleUploadShopImg(res, data.Result_Data)
message.success("新增成功！") message.success("新增成功！")
setCurrentRow(undefined) setCurrentRow(undefined)
formRef?.current?.resetFields() formRef?.current?.resetFields()
@ -388,11 +513,63 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
// 清空一下 商品关联表的选择行 // 清空一下 商品关联表的选择行
setSelectedRowKeys([]) setSelectedRowKeys([])
setSelectedRows([]) setSelectedRows([])
setMainImgList([])
setHeaderImgList([])
setDetailImgList([])
} else { } else {
message.error(data.Result_Desc) message.error(data.Result_Desc)
} }
}; };
// 上传商品图片
const handleUploadShopImg = async (formRes: any, shopData: any) => {
// formRes 当前表单的全部数据 shopData 商品数据
// 主图
if (formRes.mainImgList && formRes.mainImgList.length > 0) {
const formData = new FormData();
formRes.mainImgList.forEach((file: any) => {
formData.append('files[]', file.originFileObj);
formData.append('ImageName', typeof file !== 'string' ? file?.name : '');
});
formData.append('TableId', shopData.COMMODITY_ID);
formData.append('imageType', "1000");
formData.append('TableType', "1207");
console.log('formData', formData);
let res = await uploadPicture(formData)
}
// 头部轮播图
if (formRes.headerImgList && formRes.headerImgList.length > 0) {
const formData = new FormData();
formRes.headerImgList.forEach((file: any) => {
formData.append('files[]', file.originFileObj);
formData.append('ImageName', typeof file !== 'string' ? file?.name : '');
});
formData.append('TableId', shopData.COMMODITY_ID);
formData.append('imageType', "2000");
formData.append('TableType', "1207");
console.log('formData', formData);
let res = await uploadPicture(formData)
}
// 头部轮播图
if (formRes.detailImgList && formRes.detailImgList.length > 0) {
const formData = new FormData();
formRes.detailImgList.forEach((file: any) => {
formData.append('files[]', file.originFileObj);
formData.append('ImageName', typeof file !== 'string' ? file?.name : '');
});
formData.append('TableId', shopData.COMMODITY_ID);
formData.append('imageType', "5000");
formData.append('TableType', "1207");
console.log('formData', formData);
let res = await uploadPicture(formData)
}
}
// 拿到类别列表里面得规格 // 拿到类别列表里面得规格
const collectItemsWithCommodityMultiId = (data: any, result = []) => { const collectItemsWithCommodityMultiId = (data: any, result = []) => {
// 检查输入是否为数组 // 检查输入是否为数组
@ -418,6 +595,9 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
return result; return result;
} }
// 同步商品多规格
return ( return (
<div> <div>
<div style={{ backgroundColor: '#fff', display: 'flex' }}> <div style={{ backgroundColor: '#fff', display: 'flex' }}>
@ -501,28 +681,29 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
</div> </div>
{/* 添加商品的悬浮框 */} {/* 添加商品的悬浮框 */}
<Modal <Modal
title={currentRow ? '更新商品管理' : '新建商品管理'} // title={currentRow ? '更新商品管理' : '新建商品管理'}
// title={ title={
// <div <div
// style={{ className='productListing'
// width: '100%', style={{
// cursor: 'move', width: '100%',
// }} cursor: 'move',
// onMouseOver={() => { }}
// if (disabled) { onMouseOver={() => {
// setDraggleDisabled(false) if (disabled) {
// } setDraggleDisabled(false)
// }} }
// onMouseOut={() => { }}
// setDraggleDisabled(true) onMouseOut={() => {
// }} setDraggleDisabled(true)
}}
// onFocus={() => { }} onFocus={() => { }}
// onBlur={() => { }} onBlur={() => { }}
// > >
// {currentRow ? '更新商品管理' : '新建商品管理'} {currentRow ? '更新商品管理' : '新建商品管理'}
// </div> </div>
// } }
destroyOnClose={true} destroyOnClose={true}
width={'70%'} width={'70%'}
visible={modalVisible} visible={modalVisible}
@ -534,9 +715,15 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
onCancel={() => { onCancel={() => {
handleConfirmLoading(false) handleConfirmLoading(false)
handleModalVisible(false) handleModalVisible(false)
setMainImgList([])
setHeaderImgList([])
setDetailImgList([])
// setBRAND_NAMEList([]) // setBRAND_NAMEList([])
}} }}
bodyStyle={{
maxHeight: '700px', // 你可以根据需要调整高度
overflowY: 'auto',
}}
footer={<div style={{ width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> footer={<div style={{ width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
<div> <div>
{ {
@ -556,6 +743,9 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
// 清空一下 商品关联表的选择行 // 清空一下 商品关联表的选择行
setSelectedRowKeys([]) setSelectedRowKeys([])
setSelectedRows([]) setSelectedRows([])
setMainImgList([])
setHeaderImgList([])
setDetailImgList([])
}}>取 消</Button> }}>取 消</Button>
<Button type={"primary"} loading={confirmLoading} onClick={() => { <Button type={"primary"} loading={confirmLoading} onClick={() => {
formRef?.current?.validateFields().then(() => { formRef?.current?.validateFields().then(() => {
@ -571,15 +761,16 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
formRef?.current?.submit() formRef?.current?.submit()
}) })
}} }}
// modalRender={(modal) => { modalRender={(modal) => {
// return <Draggable return <Draggable
// disabled={disabled} disabled={disabled}
// bounds={bounds} bounds={bounds}
// onStart={(event, uiData) => onDraggaleStart(event, uiData)} onStart={(event, uiData) => onDraggaleStart(event, uiData)}
// > handle='.productListing'
// <div ref={draggleRef}>{modal}</div> >
// </Draggable> <div ref={draggleRef}>{modal}</div>
// }} </Draggable>
}}
> >
<ProForm <ProForm
layout={'horizontal'} layout={'horizontal'}
@ -587,10 +778,80 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
autoFocusFirstInput autoFocusFirstInput
submitter={false} submitter={false}
preserve={false} preserve={false}
initialValues={currentRow ? currentRow : { request={async () => {
OPERATE_PERSON: currentUser?.Name, if (currentRow?.COMMODITY_ID) {
UPPER_STATE: currentUser?.SupplierID ? 0 : "" const data = await handeGetCOMMODITYDetail({ COMMODITYId: currentRow?.COMMODITY_ID })
}}
let mainImgList: any = []
let headerImgList: any = []
let detailImgList: any = []
// 主图
if (data.IconList && data.IconList.length > 0) {
data.IconList.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
mainImgList.push(obj)
})
}
// 轮播框图
if (data.GalleryImgList && data.GalleryImgList.length > 0) {
data.GalleryImgList.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
headerImgList.push(obj)
})
}
// 详情图
if (data.DetailImgList && data.DetailImgList.length > 0) {
data.DetailImgList.forEach((item: any) => {
let obj = JSON.parse(JSON.stringify(item))
obj.url = obj.ImageUrl
obj.name = obj.ImageName
obj.uid = item.ImageId
obj.status = 'done'
detailImgList.push(obj)
})
}
setMainImgList(mainImgList)
setHeaderImgList(headerImgList)
setDetailImgList(detailImgList)
return {
...data,
USERDEFINEDTYPE_ID: data.UserDefinedTypeIds ? data.UserDefinedTypeIds.split(',').map(Number) : [],
BRAND_ID: `${data?.BRAND_NAME}-${data?.BRAND_ID}`,
MERCHANTS_ID: `${data?.MERCHANTS_NAME}-${data?.MERCHANTS_ID}`,
UPPER_DATE: data.UPPER_DATE && data.OFF_DATE ? [data.UPPER_DATE, data.OFF_DATE] : [],
// mainImgList: mainImgList,
// headerImgList: headerImgList,
// detailImgList: detailImgList,
}
} else {
return {
OPERATE_PERSON: currentUser?.Name,
UPPER_STATE: currentUser?.SupplierID ? 0 : ""
}
}
}
}
// initialValues={currentRow ? {
// ...currentRow,
// BRAND_ID: `${currentRow?.BRAND_NAME}-${currentRow?.BRAND_ID}`,
// MERCHANTS_ID: `${currentRow?.MERCHANTS_NAME}-${currentRow?.MERCHANTS_ID}`,
// } : {
// OPERATE_PERSON: currentUser?.Name,
// UPPER_STATE: currentUser?.SupplierID ? 0 : ""
// }}
onFinish={async (values) => { onFinish={async (values) => {
let newValue: any = { ...values }; let newValue: any = { ...values };
if (currentRow) { if (currentRow) {
@ -635,8 +896,6 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
name="BRAND_ID" name="BRAND_ID"
label="商品品牌" label="商品品牌"
request={async () => { request={async () => {
console.log('BRAND_NAMEListBRAND_NAMEListBRAND_NAMEList', BRAND_NAMEList);
if (BRAND_NAMEList && BRAND_NAMEList.length > 0) { if (BRAND_NAMEList && BRAND_NAMEList.length > 0) {
return BRAND_NAMEList return BRAND_NAMEList
} else { } else {
@ -686,6 +945,8 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
name="USERDEFINEDTYPE_ID" name="USERDEFINEDTYPE_ID"
label="商品分类" label="商品分类"
request={async () => { request={async () => {
console.log('leftTreeDataleftTreeDataleftTreeData', leftTreeData);
return leftTreeData return leftTreeData
}} }}
fieldProps={{ fieldProps={{
@ -695,6 +956,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
}, },
showSearch: true, showSearch: true,
multiple: true, // 支持多选 multiple: true, // 支持多选
allowClear: true, // 允许清除和删除
filterTreeNode: (input, node) => filterTreeNode: (input, node) =>
(node.USERDEFINEDTYPE_NAME || '').toLowerCase().includes(input.toLowerCase()) (node.USERDEFINEDTYPE_NAME || '').toLowerCase().includes(input.toLowerCase())
}} }}
@ -1001,6 +1263,153 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
disabled disabled
/> />
</Col> </Col>
<Divider orientation="left">主图</Divider>
<Col span={24}>
<ProFormUploadButton
name="mainImgList"
label="主图图片"
listType="picture-card"
accept="image/*"
fieldProps={{
beforeUpload,
onPreview: handlePreview,
fileList: mainImgList, // 绑定 fileList
onChange: async (info: any) => {
if (info.file.status === 'removed') {
const index = mainImgList.findIndex(n => n.uid === info.file.uid);
confirm({
title: '确认删除该文件吗？',
icon: <ExclamationCircleOutlined />,
async onOk() {
if (info.file.ImageId) {
const deleteLoading = message.loading('正在删除...')
const success = await deletePicture(info.file?.ImagePath, info.file?.uid, '', '6000')
deleteLoading()
if (success) {
const files = [...mainImgList]
files.splice(index, 1)
setMainImgList(files)
message.success("删除成功")
actionRef.current?.reload()
}
else {
message.error("删除失败")
}
} else {
const files = [...mainImgList];
files.splice(index, 1);
setMainImgList(files);
}
},
onCancel() {
},
});
} else {
setMainImgList(info.fileList)
}
}
}}
/>
</Col>
<Divider orientation="left">头部轮播图</Divider>
<Col span={24}>
<ProFormUploadButton
name="headerImgList"
label="轮播框图"
listType="picture-card"
accept="image/*"
fieldProps={{
beforeUpload,
onPreview: handlePreview,
fileList: headerImgList, // 绑定 fileList
onChange: async (info: any) => {
if (info.file.status === 'removed') {
const index = headerImgList.findIndex(n => n.uid === info.file.uid);
confirm({
title: '确认删除该文件吗？',
icon: <ExclamationCircleOutlined />,
async onOk() {
if (info.file.ImageId) {
const deleteLoading = message.loading('正在删除...')
const success = await deletePicture(info.file?.ImagePath, info.file?.uid, '', '6000')
deleteLoading()
if (success) {
const files = [...headerImgList]
files.splice(index, 1)
setHeaderImgList(files)
message.success("删除成功")
actionRef.current?.reload()
}
else {
message.error("删除失败")
}
} else {
const files = [...headerImgList];
files.splice(index, 1);
setHeaderImgList(files);
}
},
onCancel() {
},
});
} else {
setHeaderImgList(info.fileList)
}
}
}}
/>
</Col>
<Divider orientation="left">详情图</Divider>
<Col span={24}>
<ProFormUploadButton
name="detailImgList"
label="详情图"
listType="picture-card"
accept="image/*"
fieldProps={{
beforeUpload,
onPreview: handlePreview,
fileList: detailImgList, // 绑定 fileList
onChange: async (info: any) => {
if (info.file.status === 'removed') {
const index = detailImgList.findIndex(n => n.uid === info.file.uid);
confirm({
title: '确认删除该文件吗？',
icon: <ExclamationCircleOutlined />,
async onOk() {
if (info.file.ImageId) {
const deleteLoading = message.loading('正在删除...')
const success = await deletePicture(info.file?.ImagePath, info.file?.uid, '', '6000')
deleteLoading()
if (success) {
const files = [...detailImgList]
files.splice(index, 1)
setDetailImgList(files)
message.success("删除成功")
actionRef.current?.reload()
}
else {
message.error("删除失败")
}
} else {
const files = [...detailImgList];
files.splice(index, 1);
setDetailImgList(files);
}
},
onCancel() {
},
});
} else {
setDetailImgList(info.fileList)
}
}
}}
/>
</Col>
</Row> </Row>
</ProForm> </ProForm>
</Modal> </Modal>
@ -1009,21 +1418,75 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
<Modal <Modal
title={"多规格管理"} title={"多规格管理"}
destroyOnClose={true} destroyOnClose={true}
width={1000} width={1200}
visible={showMoreSpecs} visible={showMoreSpecs}
onCancel={() => { onCancel={() => {
setShowMoreSpecs(false) setShowMoreSpecs(false)
setSpecsData([])
}} }}
onOk={async () => { // 提交框内的数据 onOk={async () => { // 提交框内的数据
console.log('specsDataspecsData', specsData);
// 判断表格数据是不是都填了
let isAllOk: boolean = true
if (specsData && specsData.length > 0) {
specsData.forEach((item: any) => {
if (!item.COMMODITY_STOCK || !item.COMMODITY_RETAILPRICE || !item.COMMODITY_MEMBERPRICE || !item.COMMODITY_PURCHASEPRICE) {
isAllOk = false
}
})
}
if (!isAllOk) {
message.error('请先完善表格数据！')
}
if (specsData && specsData.length > 0) {
let list: any = []
specsData.forEach((item: any) => {
list.push({
RTCOMMODITY_MULTI_ID: item.RTCOMMODITY_MULTI_ID ? item.RTCOMMODITY_MULTI_ID : "",
COMMODITY_ID: currentRow?.COMMODITY_ID,
COMMODITY_MULTI_ID: item.COMMODITY_MULTI_ID,
COMMODITY_STOCK: item.COMMODITY_STOCK,
COMMODITY_RETAILPRICE: item.COMMODITY_RETAILPRICE,
COMMODITY_PURCHASEPRICE: item.COMMODITY_PURCHASEPRICE,
COMMODITY_MEMBERPRICE: item.COMMODITY_MEMBERPRICE,
STAFF_ID: currentUser?.ID,
STAFF_NAME: currentUser?.Name,
OPERATE_DATE: moment().format('YYYY-MM-DD HH:mm:ss')
})
})
// return
const req: any = {
list: list
}
console.log('reqreqreq', req);
const data = await handeSynchroRTCOMMODITYMULTIList(req)
console.log('datadatadatadata', data);
if (data.Result_Code === 100) {
message.success("同步成功！")
setShowMoreSpecs(false)
setSpecsData([])
} else {
message.error(data.Result_Desc)
}
} else {
setShowMoreSpecs(false)
setSpecsData([])
}
}} }}
> >
<ProTable <ProTable
actionRef={ruleActionRef}
search={false} search={false}
pagination={false} pagination={false}
options={false} options={false}
columns={specsColumns} columns={specsColumns}
scroll={{ x: "100%" }} scroll={{ x: "100%" }}
bordered
toolbar={{ toolbar={{
actions: [ actions: [
<Button type={"primary"} onClick={() => { <Button type={"primary"} onClick={() => {
@ -1043,6 +1506,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
}, },
PageIndex: 1, PageIndex: 1,
PageSize: 999999, PageSize: 999999,
SortStr: "COMMODITY_MULTI_ID"
} }
const data = await handeGetRTCOMMODITY_MULTIList(req) const data = await handeGetRTCOMMODITY_MULTIList(req)
console.log('多规格管理', data); console.log('多规格管理', data);
@ -1064,7 +1528,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
<Modal <Modal
title={"新增规格管理"} title={"新增规格管理"}
destroyOnClose={true} destroyOnClose={true}
width={800} width={1200}
visible={showAddSpecsModal} visible={showAddSpecsModal}
onCancel={() => { onCancel={() => {
setShowAddSpecsModal(false) setShowAddSpecsModal(false)
@ -1073,7 +1537,19 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
setShowAddSpecsModal(false) setShowAddSpecsModal(false)
console.log('specsDataspecsDataspecsData', specsData); console.log('specsDataspecsDataspecsData', specsData);
console.log('selectedRowsselectedRowsselectedRows', selectedRows); console.log('selectedRowsselectedRowsselectedRows', selectedRows);
let list: any = JSON.parse(JSON.stringify(specsData))
// list = list.concat(selectedRows)
if (selectedRows && selectedRows.length > 0) {
selectedRows.forEach((item: any) => {
let filterList: any = list.filter((filterItem: any) => filterItem.COMMODITY_MULTI_ID === item.COMMODITY_MULTI_ID)
if (filterList && filterList.length > 0) {
} else {
list.push(item)
}
// let obj: any = JSON.parse(JSON.stringify(item))
})
}
setSpecsData(list)
}} }}
> >
<ProTable <ProTable
@ -1093,13 +1569,15 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
request={async () => { request={async () => {
const req = { const req = {
searchParameter: { searchParameter: {
OWNERUNIT_ID: currentUser?.OwnerUnitId, OwnerUnitId: currentUser?.OwnerUnitId,
PROVINCE_CODE: "", ExcludeCommodityId: currentRow?.COMMODITY_ID,
GOODSTYPE: 6000, // PROVINCE_CODE: currentUser?.ProvinceCode,
USERDEFINEDTYPE_STATE: 1 // GOODSTYPE: 6000,
COMMODITY_STATE: 1
}, },
PageIndex: 1, PageIndex: 1,
PageSize: 999999, PageSize: 999999,
SortStr: "USERDEFINEDTYPE_ID,COMMODITY_MULTI_ID"
} }
const data = await handeGetCOMMODITY_MULTIList(req); const data = await handeGetCOMMODITY_MULTIList(req);
console.log('datadatadatadata', data); console.log('datadatadatadata', data);

1618
src/pages/travelMember/ShoppingMallProductSearch/index.tsx
View File

File diff suppressed because it is too large Load Diff

1160
src/pages/travelMember/serverpartInfo/components/serverpartInfo.tsx
View File

File diff suppressed because it is too large Load Diff

2
src/pages/travelMember/serverpartInfo/index.tsx
View File

@ -459,7 +459,7 @@ const serverpartInfo: React.FC<{ currentUser: CurrentUser }> = (props) => {
<div style={{ height: 'calc(100% - 60px)', overflowY: 'auto', boxSizing: "border-box", paddingTop: '12px' }}> <div style={{ height: 'calc(100% - 60px)', overflowY: 'auto', boxSizing: "border-box", paddingTop: '12px' }}>
{ {
showRightForm ? showRightForm ?
<ServerpartInfo onRef={serverPartRef} currentRow={{ SERVERPART_ID: currenMenu ? currenMenu : '' }} onShow={showRightForm} /> : <ServerpartInfo pageType={2} onRef={serverPartRef} currentRow={{ SERVERPART_ID: currenMenu ? currenMenu : '' }} onShow={showRightForm} /> :
<LoadingBox /> <LoadingBox />
} }
</div> </div>

79
src/pages/travelMember/service.ts
View File

@ -500,7 +500,7 @@ export async function handeDeleteCOMMODITY_MULTI(params: any) {
// 获取商品规格关联的列表(就是拿到商品已经关联了的规格) // 获取商品规格关联的列表(就是拿到商品已经关联了的规格)
export async function handeGetRTCOMMODITY_MULTIList(params: any) { export async function handeGetRTCOMMODITY_MULTIList(params: any) {
const data = await requestEncryption(`/MemberConfig/GetRTCOMMODITY_MULTIList`, { const data = await requestEncryption(`/MallBasic/GetRTCOMMODITY_MULTIList`, {
method: 'POST', method: 'POST',
data: { ...params, requestEncryption: true } data: { ...params, requestEncryption: true }
}) })
@ -586,3 +586,80 @@ export async function handeGetSPRegionShopTree(params: any) {
} }
return wrapTreeNode(data.Result_Data.List) return wrapTreeNode(data.Result_Data.List)
} }
// 获取点餐商品
export async function handeGetBusinessCommodityList(params: any) {
const data = await requestEncryption(`/BaseInfo/GetBusinessCommodityList`, {
method: 'POST',
data: { ...params, requestEncryption: true }
})
if (data.Result_Code !== 100) {
return []
}
return data.Result_Data
}
// 删除商品多规格
export async function handeDeleteRTCOMMODITY_MULTI(params: any) {
const data = await requestEncryption(`/MallBasic/DeleteRTCOMMODITY_MULTI`, {
method: 'POST',
data: { ...params, requestEncryption: true }
})
if (data.Result_Code !== 100) {
return []
}
return data
}
// 批量同步规格
export async function handeSynchroRTCOMMODITYMULTIList(params: any) {
const data = await requestEncryption(`/MallBasic/SynchroRTCOMMODITYMULTIList`, {
method: 'POST',
data: { ...params, requestEncryption: true }
})
if (data.Result_Code !== 100) {
return []
}
return data
}
// 获取业主营收统计报表数据
export async function handeGetRevenueReport(params: any) {
const data = await requestEncryption(`/Revenue/GetRevenueReport`, {
method: 'POST',
data: { ...params, requestEncryption: true }
})
if (data.Result_Code !== 100) {
return []
}
return wrapTreeNode(data.Result_Data.List)
}
// 获取点餐商品
export async function handeGetSellerCommodityList(params: any) {
const data = await requestEncryption(`/MallBasic/GetSellerCommodityList`, {
method: 'POST',
data: { ...params, requestEncryption: true }
})
if (data.Result_Code !== 100) {
return []
}
return data.Result_Data
}
// 同步经营商家商品数据
export async function handeSyncSellerCommodityInfo(params: any) {
const data = await requestEncryption(`/MallBasic/SyncSellerCommodityInfo`, {
method: 'POST',
data: { ...params, requestEncryption: true }
})
if (data.Result_Code !== 100) {
return []
}
return data
}

23
src/services/options/index.ts
View File

@ -115,6 +115,29 @@ export async function getFieldEnumTree(params: FieldParamsModel) {
return [...options]; return [...options];
} }
// 出行平台请求树的
export async function handleGetFieldEnumTreeTravel(params: FieldParamsModel) {
const sessionName = `${params.sessionName ? params.sessionName : params.FieldExplainField}Tree`;
const FieldExplain = session.get(sessionName);
// if (FieldExplain && !params?.noStorge) {
// return FieldExplain;
// }
const data = await requestEncryption(`/FrameWork/GetFieldEnumTree`, {
method: 'GET',
params,
});
if (data.Result_Code !== 100) {
return [];
}
const options = params.notformate ? formateTreeField(data.Result_Data.List) : wrapTreeNode(data.Result_Data.List);
session.set(sessionName, options);
// const oneList = getName(options)
// session.set(`${sessionName}One`,oneList);
return [...options];
}
/* 获取枚举列表 出行平台的枚举 */ /* 获取枚举列表 出行平台的枚举 */
export async function getTravelFieldEnumTree(params: FieldParamsModel) { export async function getTravelFieldEnumTree(params: FieldParamsModel) {

10
src/services/options/typings.d.ts vendored
View File

@ -9,7 +9,7 @@
// 字段枚举 model（ 下拉框数据字典） // 字段枚举 model（ 下拉框数据字典）
type FieldParamsModel = { type FieldParamsModel = {
FieldExplainField: string; FieldExplainField: string;
FieldEnumStatus?: string; FieldEnumStatus?: string | Boolean;
FieldEnumValue?: string; FieldEnumValue?: string;
notformate?: boolean; notformate?: boolean;
sessionName?: string; sessionName?: string;
@ -19,7 +19,7 @@ type FieldParamsModel = {
noStorge?: any;// 不管那个缓存的判断 noStorge?: any;// 不管那个缓存的判断
}; };
// 通用选择/树数据源model // 通用选择/树数据源model
type CommonTypeModel ={ type CommonTypeModel = {
label: string;// 名称 , label: string;// 名称 ,
value: number;// 数值（对应数据表id） , value: number;// 数值（对应数据表id） ,
key: string;// 数值代码（字符串） , key: string;// 数值代码（字符串） ,
@ -31,7 +31,7 @@ type CommonTypeModel ={
type RequestResult = { type RequestResult = {
Result_Code: number; // 状态码 , Result_Code: number; // 状态码 ,
Result_Desc: string; // 消息 , Result_Desc: string; // 消息 ,
Result_Data: Record<string, any> | ListJson | string | any;// 返回对象 Result_Data: Record<string, any> | ListJson | string | any;// 返回对象
} }
// 列表model // 列表model
type ListJson = { type ListJson = {
@ -42,9 +42,9 @@ type ListJson = {
List: any[];// 返回数据集 List: any[];// 返回数据集
} }
// 文件model // 文件model
export type PictureModel = { export type PictureModel = {
ImageId: number; // 图片内码 , ImageId: number; // 图片内码 ,
ImageType?: 1000 | 2000 | 3000 | 4000 ;// 文件类型 1000【营业执照】、2000【合同图片】, 3000 身份证人像面 4000 身份证国徽面; , ImageType?: 1000 | 2000 | 3000 | 4000;// 文件类型 1000【营业执照】、2000【合同图片】, 3000 身份证人像面 4000 身份证国徽面; ,
ImageName: string; // 图片名称 , ImageName: string; // 图片名称 ,
ImageUrl: string; // 图片地址 , ImageUrl: string; // 图片地址 ,
ImagePath: string; // 图片相对路径（删除图片时提供的参数） ImagePath: string; // 图片相对路径（删除图片时提供的参数）