Browse Source

订单

tmp
zhaoy 11 months ago
parent
commit
6556fb4fa5
10 changed files with 1098 additions and 2 deletions
  1. +16
    -2
      config/routes.js
  2. +304
    -0
      src/pages/order/orderflow/index.jsx
  3. +228
    -0
      src/pages/order/orderflow/orderflowDetail.jsx
  4. +116
    -0
      src/pages/order/orderflow/service.js
  5. +0
    -0
     
  6. +0
    -0
     
  7. +210
    -0
      src/pages/order/thirdAuthorize/index.jsx
  8. +42
    -0
      src/pages/order/thirdAuthorize/service.js
  9. +124
    -0
      src/pages/order/thirdOrder/index.jsx
  10. +58
    -0
      src/pages/order/thirdOrder/service.js

+ 16
- 2
config/routes.js View File

@@ -235,8 +235,22 @@ export default [
{
name: '订单流水',
icon: 'smile',
path: '/order/orderrecode',
component: './order/orderrecode',
path: '/order/orderflow',
component: './order/orderflow',
access: 'k12',
},
{
name: '订单授权',
icon: 'smile',
path: '/order/thirdAuthorize',
component: './order/thirdAuthorize',
access: 'k12',
},
{
name: '第三方订单',
icon: 'smile',
path: '/order/thirdOrder',
component: './order/thirdOrder',
access: 'k12',
},
],


+ 304
- 0
src/pages/order/orderflow/index.jsx View File

@@ -0,0 +1,304 @@
import { DropboxOutlined, PlusOutlined, DownloadOutlined } from '@ant-design/icons';
import { Button, message, Select, Input, Drawer, Popconfirm } from 'antd';
import React, { useState, useRef, useEffect } from 'react';
import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions';
import ExportJsonExcel from 'js-export-excel';
import api from './service';
import OrderflowDetail from './orderflowDetail';

const handlerefund = async (value) => {
var data = { number: value };
const hide = message.loading('正在发起退款');
try {
api.StartRefund(data);
hide();
message.success('发起退款成功,即将刷新');
return true;
} catch (error) {
hide();
message.error('发起退款失败,请重试');
return false;
}
};
const Manage = () => {
const [row, setRow] = useState();
const [createModalVisible, handleModalVisible] = useState(false);
//获取店铺(店铺信息)
const [srdList, setsrdList] = useState([]);
const [dataList, setdataList] = useState([]);
//绑定
const actionRef = useRef();
const [Selectparams, setparams] = useState([]);
// 获取店铺分类、商品名称信息
useEffect(() => {
//店铺名称(店铺信息)
function initsrdList() {
api.srdList().then((r) => {
var arr = r.data;
arr?.forEach((element) => {
element.value = element.id;
element.label = element.name;
});
setsrdList(arr);
});
}

initsrdList();
}, []);
/**导出 */
function handleExport() {
api.GetFlowExport(Selectparams).then((res) => {
let url = URL.createObjectURL(new Blob([res]));
let filename = '订单流水.xlsx';
let a = document.createElement('a');
a.href = url;
a.download = filename;
a.click();
URL.revokeObjectURL(url);
});
}
/** 国际化配置 */

const columns = [
{
title: '主键',
dataIndex: 'id',
tip: '规则名称是唯一的 key',
hideInSearch: true,
hideInTable: true,
},
{
title: '订单时间',
dataIndex: 'order_CreateTime',
valueType: 'dateRange',
hideInTable: true,
search: {
transform: (value) => {
return {
order_CreateTime: value[0],
order_EndTime: value[1],
};
},
},
},
{
title: '手机号',
dataIndex: 'Customer_Tel',
hideInTable: true,
},
{
title: '店铺名称',
dataIndex: 'storeId',
hideInTable: true,
valueType: 'select',
renderFormItem: () => (
<Select
mode="multiple"
showArrow
optionFilterProp="label"
placeholder="请选择店铺"
style={{ width: '100%' }}
options={srdList}
/>
),
},
{
title: '交易单号',
dataIndex: 'order_Number',
hideInSearch: true,
},

{
title: '店铺名称',
dataIndex: 'storeName',
hideInSearch: true,
},

{
title: '应付金额',
dataIndex: 'order_OriginalMoney',
renderText: (val) => `${val}¥`,
hideInSearch: true,
},
{
title: '实付金额',
dataIndex: 'order_RealMoney',
hideInSearch: true,
renderText: (val) => `${val}¥`,
},
{
title: '应付金额(退)',
dataIndex: 'refundOriginalMoney',
renderText: (val) => `${val}¥`,
hideInSearch: true,
},
{
title: '实付金额(退)',
dataIndex: 'refundRealMoney',
hideInSearch: true,
renderText: (val) => `${val}¥`,
},
{
title: '数量',
dataIndex: 'order_Count',
hideInSearch: true,
},
{
title: '支付类型',
dataIndex: 'payMode',
valueEnum: {
0: {
text: '微信支付',
},
1: {
text: '支付宝',
},
2: {
text: '余额',
},
3: {
text: '银联',
},
4: {
text: '现金',
},
},
},
{
title: '创建时间',
sorter: true,
dataIndex: 'order_CreateTime',
valueType: 'dateTime',
hideInSearch: true,
renderFormItem: (item, { defaultRender, ...rest }, form) => {
const status = form.getFieldValue('status');

if (`${status}` === '0') {
return false;
}

if (`${status}` === '3') {
return <Input {...rest} placeholder="请输入异常原因!" />;
}

return defaultRender(item);
},
},
{
title: '操作',
dataIndex: 'option',
valueType: 'option',
render: (_, record) => [
<a
key="config"
onClick={() => {
setRow(record), handleModalVisible(true);
}}
>
查看详情
</a>,
// <a
// key="config"
// onClick={() => {
// api.printsmallticket({ "orderId": record.id })
// .then(re => {
// if (re.data) {
// message.success('打印成功');
// } else {
// message.error('打印失败');
// }

// })

// }} >
// 打印小票
// </a>,
],
},
];

//下载Excel
const onDownloadExcel = async () => {
const response = await api.GetFlowExport(Selectparams)
if (response.isSuccess) {
let option = {}; //option代表的就是excel文件
const date = new Date();
const excelName = "订单流水" + date.toLocaleString().replaceAll('\/', '-');
option.fileName = excelName; //excel文件名称
const sheetHeader = ['storeTypeName','storeName','order_Number','order_OriginalMoney','order_RealMoney','refundOriginalMoney','refundRealMoney','order_Count','order_CreateTime'];;
// Object.keys(response.data[0]).forEach(item => {
// sheetHeader.push(item);
// });
option.datas = [
{
sheetData: response.data, //excel文件中的数据源
sheetName: excelName, //excel文件中sheet页名称
sheetFilter: sheetHeader, //excel文件中需显示的列数据
sheetHeader: ['店铺分类', '店铺名称', '交易单号', '应付金额', '实付金额',
'应付金额(退)', '实付金额(退)', '子订单数量', '创建时间',
] //excel文件中每列的表头名称
}
]
let toExcel = new ExportJsonExcel(option); //生成excel文件
toExcel.saveExcel();
} else {
message.error(response.errors || '导出失败');
}
}

return (
<PageContainer header={{
title: '',
breadcrumb: {},
}}>
<ProTable
headerTitle="订单流水"
actionRef={actionRef}
rowKey="orderFlowId"
search={{
labelWidth: 120,
}}
toolBarRender={() => [
// <Button type="primary" key="create" onClick={onDownloadExcel}>
// <DownloadOutlined /> 导出
// </Button>,
]}
columns={columns}
//数据绑定
request={async (params, sorter, filter) => {
if (params.storeTypeId != undefined) {
//店铺分类
params.storeTypeId = srdTypeList[params.storeTypeId].storeTypeId;
}
const msg = await api.orderList(params);
setparams(params);
setdataList(msg.data.data);
return {
data: msg.data.data,
success: true,
total: msg.data.total,
};
}}
></ProTable>

{!!row && (
<OrderflowDetail
// onFinish={async (value) => {
// var success = false;

// }}
onCancel={() => {
setRow(undefined);
handleModalVisible(false);
}}
createModalVisible={createModalVisible}
values={row || {}}
/>
)}
</PageContainer>
);
};

export default Manage;

+ 228
- 0
src/pages/order/orderflow/orderflowDetail.jsx View File

@@ -0,0 +1,228 @@
import React, { useState, useEffect } from 'react';
import { message, Modal, Descriptions } from 'antd';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions';
import api from './service';
import { FrownTwoTone } from '@ant-design/icons';

let defaultData = {};
const OrderflowDetail = (props) => {
const { createModalVisible, onCancel } = props;
const [orderInfo, setOrderInfo] = useState([]);
return (
<Modal
title={'订单详情'}
width={1000}
visible={props.createModalVisible}
bodyStyle={{ padding: '32px 40px 48px' }}
footer={null}
destroyOnClose
onCancel={() => onCancel()}
maskClosable={false}
>
<ProDescriptions title="订单信息"
request={async () => {
defaultData = await api.GetOrderDetails({ id: props.values.id });
setOrderInfo(defaultData);
return Promise.resolve({
success: true,
data: defaultData,
});
}}
columns={[
{
title: '会员姓名',
key: 'customer_Name',
dataIndex: 'customer_Name',
},
{
title: '手机号',
key: 'customer_Tel',
dataIndex: 'customer_Tel',
},
{
title: '订单流水',
key: 'order_Number',
dataIndex: 'order_Number',
},
{
title: '订单号',
key: 'transaction_ID',
dataIndex: 'transaction_ID',
},
{
title: '交易单号',
key: 'trade_no',
dataIndex: 'trade_no',
},
{
title: '排队号',
key: 'order_SortID',
dataIndex: 'order_SortID',
},
{
title: '折扣',
key: 'discount',
dataIndex: 'discount',
},
{
title: '实付金额',
dataIndex: 'order_RealMoney',
valueType: 'money',
fieldProps: {
moneySymbol: '¥',
},
},
{
title: '应付金额',
dataIndex: 'order_OriginalMoney',
valueType: 'money',
fieldProps: {
moneySymbol: '¥',
},
},
{
title: '实付金额(退)',
dataIndex: 'refundRealMoney',
valueType: 'money',
fieldProps: {
moneySymbol: '¥',
},
},
{
title: '应付金额(退)',
dataIndex: 'refundOriginalMoney',
valueType: 'money',
fieldProps: {
moneySymbol: '¥',
},
},

{
title: '数量',
dataIndex: 'order_Count',
hideInSearch: true,
},
{
title: '支付方式',
dataIndex: 'payMode',
key: 'payMode',
},

{
title: '订单状态',
dataIndex: 'order_Status',
key: 'order_Status',
},
{
title: '消费金额',
dataIndex: 'recharge',
key: 'recharge',
},
{
title: '消费赠送金额',
dataIndex: 'rechargeBalance',
key: 'rechargeBalance',
},
]}
></ProDescriptions>
<h3 style={{fontWeight:'bold',fontSize:16,marginTop:30}}>商品列表</h3>
<ProTable
rowKey="id"
request={async () => {
defaultData = await api.GetOrderDetails({ id: props.values.id });
return {
data: defaultData.detailList,
success: true,
};
}}
columns={[
{
title: '商品分类',
key: 'goodsTypeName',
dataIndex: 'goodsTypeName',
},
{
title: '商品名称',
key: 'goodsName',
dataIndex: 'goodsName',
},
{
title: '应付金额',
key: 'originalMoney',
dataIndex: 'originalMoney',
valueType: 'money',
fieldProps: {
moneySymbol: '¥',
},
},
{
title: '实付金额',
dataIndex: 'realMoney',
valueType: 'money',
fieldProps: {
moneySymbol: '¥',
},
},
{
title: '操作',
dataIndex: 'option',
valueType: 'option',
render: (_, record) => [
<a
key="config"
onClick={() => {
api.printsmallticket({ "orderId": props.values.id, "subOrderId": record.id })
.then(re => {
debugger
if (re.data) {
message.success('打印成功');
} else {
message.error('打印失败');
}

})

}} >
打印小票
</a>,
],
},

]}
toolBarRender={false}
search={false}
/>
<Descriptions title="优惠券">
{defaultData?.paperCoupons?.map(item => {
return (
<>
<Descriptions.Item label="平台">{item.platformName }</Descriptions.Item>
<Descriptions.Item label="优惠券">{item.name}</Descriptions.Item>
<Descriptions.Item label="优惠金额">{item.amount}</Descriptions.Item>
</>
);
})}

</Descriptions>
<Descriptions
column={5}
title="抵扣券">
{defaultData?.goodsCoupons?.map(item => {
return (
<>
<Descriptions.Item label="平台">{item.platformName }</Descriptions.Item>
<Descriptions.Item label="抵扣券">{item.name}</Descriptions.Item>
<Descriptions.Item label="商品">{item.goodsName}</Descriptions.Item>
<Descriptions.Item label="商品原价">{item.goodsAmount}</Descriptions.Item>
<Descriptions.Item label="平台售价">{item.platformAmount}</Descriptions.Item>
</>
);
})}

</Descriptions>
</Modal>
);
};

export default OrderflowDetail;

+ 116
- 0
src/pages/order/orderflow/service.js View File

@@ -0,0 +1,116 @@
// @ts-ignore

/* eslint-disable */
import { request } from 'umi';

export default {
/** 获取订单流水信息*/
orderList(data) {
data.isreport = true;
return request(`/groupmealorder/api/Order/PostDetail`, {
method: 'Post',
data: data,
// params: { ...params },
// ...(options || {}),
});
},

/**
* 查询店铺信息(设备信息)
*/
srdList(data) {
return request('/groupmeal/api/shop/alllist', {
method: 'GET'
});
},

GetFlowExport(data) {
return request(`/groupmealorder/api/Order/GetFlowExport`, {
method: 'Post',
data: data
// params: { ...params },
// ...(options || {}),
});
},
















/**
* 查询店铺分类(设备类型)信息
*/
srdTypeList(data) {
return request(`/kitchen/api/storetype/list`, {
method: 'Post',
data: data,
// params: { ...params },
// ...(options || {}),
});
},

/**
* 查询商品信息
*/
goodsList(data) {
return request(`/kitchen/api/goodes/list`, {
method: 'Post',
data: data,
// params: { ...params },
// ...(options || {}),
});
},
/**
* 查询商品类型
*/
goodsTypeList(data) {
return request(`/kitchen/api/goodstype/list`, {
method: 'Post',
data: data,
// params: { ...params },
// ...(options || {}),
});
},
StartRefund(data) {
return request(`/kitchen/api/refund/StartOrderRefund`, {
method: 'Post',
params: data,
// params: { ...params },
// ...(options || {}),
});
},
GetOrderDetails(data) {
return request(`/kitchen/api/Order/GetOrderDetails`, {
method: 'Post',
params: data,
// params: { ...params },
// ...(options || {}),
});
},


// 打印小票
printsmallticket(data) {
return request(`/kitchen/api/printer/print-small-ticket`, {
method: 'Post',
data: data,
// params: { ...params },
// ...(options || {}),
});
},
};



+ 0
- 0
View File


+ 0
- 0
View File


+ 210
- 0
src/pages/order/thirdAuthorize/index.jsx View File

@@ -0,0 +1,210 @@
import { DropboxOutlined, PlusOutlined, DownloadOutlined } from '@ant-design/icons';
import { Button, message, Modal, Input, Form, Select, Popconfirm } from 'antd';
import React, { useState, useRef, useEffect } from 'react';
import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions';
import api from './service';

const Manage = () => {
const [row, setRow] = useState();
//获取店铺(店铺信息)
const [shopList, setShopList] = useState([]);
//绑定
const actionRef = useRef();

const [isModalOpen, setIsModalOpen] = useState(false);
const [form] = Form.useForm();


// 获取店铺分类、商品名称信息
useEffect(() => {
getShopList();
}, []);
const getShopList = async () => {
const response = await api.GetAllStore();
if (response.statusCode == 200) {
setShopList(response.data);
} else {
message.error(response.msg || '获取店铺列表失败');
}

}

const columns = [
{
title: '主键',
dataIndex: 'id',
tip: '规则名称是唯一的 key',
hideInSearch: true,
hideInTable: true,
},
{
title: '归属场景',
dataIndex: 'storeId',
ellipsis: true,
hideInSearch: true,
render: (_, record) => {
const find = shopList.find(item => item.id === record.storeId);
if (find) {
return <div>{find.name}</div>
}
}
},
{
title: '授权码',
dataIndex: 'authorizeCode',
hideInSearch: true,
},
{
title: '操作',
dataIndex: 'option',
valueType: 'option',
width: 200,
render: (_, record) => [
<Popconfirm
title="确定要重新授权吗?"
onConfirm={() => {
api.Update({ id: record.id }).then((re) => {
if (re.data) {
message.success('修改成功');
setIsModalOpen(false);
actionRef.current.reload();
} else {
message.error('修改失败');
}
});
}}
okText="确定"
cancelText="取消" >
<a
key={record.id}
onClick={async () => {

}} >
重新授权
</a>
</Popconfirm>,
<Popconfirm
title="确认删除吗?"
onConfirm={() => {
api.Del(record.id).then((re) => {
if (re.data) {
message.success('删除成功');
setIsModalOpen(false);
actionRef.current.reload();
} else {
message.error('删除成功');
}
});
}}
okText="确定"
cancelText="取消" >
<a
key={record.id}
onClick={async () => {

}} >
删除
</a>
</Popconfirm>

],
},
];



return (
<PageContainer header={{
title: '',
breadcrumb: {},
}}>
<ProTable
headerTitle=""
actionRef={actionRef}
rowKey="orderFlowId"
search={{
labelWidth: 120,
}}
toolBarRender={() => [
<Button type="primary" key="create" onClick={() => { setIsModalOpen(true); }}>
<DownloadOutlined /> 新建
</Button>,
]}
columns={columns}
//数据绑定
request={async (params, sorter, filter) => {
const msg = await api.page(params);
return {
data: msg.data.data,
success: true,
total: msg.data.total,
};
}}
></ProTable>

<>
<Modal title="授权" open={isModalOpen} onOk={() => { form.submit() }} onCancel={() => {
setIsModalOpen(false);
}}>
<Form
form={form}
preserve={false}
layout="horizontal"
labelCol={{ span: 4 }}
onFinish={async (value) => {
if (value.id) {
api.Update(value).then((re) => {
if (re.data) {
message.success('修改成功');
handleModalVisible(false);
actionRef.current.reload();
} else {
message.error('修改失败');
}
});
} else {
api.Create(value).then((re) => {
if (re.data) {
setIsModalOpen(false);
message.success('添加成功');
actionRef.current.reload();
} else {
message.error(re.errors || '添加失败');
}
});

}
}}
>
<Form.Item name="id" hidden={true}>
<Input />
</Form.Item>
<Form.Item
label="归属场景"
name="storeId"
rules={[
{
required: true,
message: '请选择归属场景!',
},
]}
>
<Select allowClear placeholder="请选择归属场景" style={{ width: '100%' }}>
{
shopList.map(item => {
return <Option value={item.id} key={item.id}>{item.name}</Option>
})
}
</Select>
</Form.Item>
</Form>
</Modal>

</>
</PageContainer>
);
};

export default Manage;

+ 42
- 0
src/pages/order/thirdAuthorize/service.js View File

@@ -0,0 +1,42 @@
// @ts-ignore

/* eslint-disable */
import { request } from 'umi';

export default {

page(data) {
data.isreport = true;
return request(`/groupmealorder/api/ThirdAuthorize/Page`, {
method: 'Post',
data: data,
});
},
GetAllStore() {
return request('/groupmeal/api/shop/alllist', {
method: 'GET'
});
},
Create(data) {
return request('/groupmealorder/api/ThirdAuthorize/Create', {
method: 'Post',
data: data,
});
},
Update(data) {
return request('/groupmealorder/api/ThirdAuthorize/Update', {
method: 'Post',
data: data,
});
},
Del(data) {
return request('/groupmealorder/api/ThirdAuthorize/Del?id='+data, {
method: 'Post',
});
},


};



+ 124
- 0
src/pages/order/thirdOrder/index.jsx View File

@@ -0,0 +1,124 @@
import { DropboxOutlined, PlusOutlined, DownloadOutlined } from '@ant-design/icons';
import { message, Modal, Input, Form, Space, Table, Tag } from 'antd';
import React, { useState, useRef, useEffect } from 'react';
import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions';
import api from './service';
const handlerefund = async (value) => {
var data = { number: value };
const hide = message.loading('正在发起退款');
try {
api.StartRefund(data);
hide();
message.success('发起退款成功,即将刷新');
return true;
} catch (error) {
hide();
message.error('发起退款失败,请重试');
return false;
}
};
const Manage = () => {
const [row, setRow] = useState();
//绑定
const actionRef = useRef();
const [form] = Form.useForm();
const [isModalOpen, setIsModalOpen] = useState(false);

const [thirdOrderInfo, setThirdOrderInfo] = useState(false);


// 获取店铺分类、商品名称信息
useEffect(() => {

}, []);

const columns = [
{
title: '主键',
dataIndex: 'id',
tip: '规则名称是唯一的 key',
hideInSearch: true,
hideInTable: true,
},
{
title: '订单编号',
dataIndex: 'orderNum',
},
{
title: '同步时间',
dataIndex: 'createAt',
hideInSearch: true,
},
{
title: '操作',
dataIndex: 'option',
valueType: 'option',
width: 200,
render: (_, record) => [
<a
key={record.id}
onClick={async () => {
var data = await api.getThirdOrderInfo(record.id);
setThirdOrderInfo(data.data.thirdOrderInfos);
setIsModalOpen(true);
}} >
查看详情
</a>
],
},
];

const columnInfos = [
{
title: '商品名称',
dataIndex: 'goodsName',
key: 'goodsName',
render: (text) => <a>{text}</a>,
},
{
title: '数量',
dataIndex: 'count',
key: 'count',
}
];
return (
<PageContainer header={{
title: '',
breadcrumb: {},
}}>
<ProTable
headerTitle="第三方订单"
actionRef={actionRef}
rowKey="orderFlowId"
search={{
labelWidth: 120,
}}
// toolBarRender={() => [
// <Button type="primary" key="create" onClick={() => { setIsModalOpen(true); }}>
// <DownloadOutlined /> 新建
// </Button>,
// ]}
columns={columns}
//数据绑定
request={async (params, sorter, filter) => {
const msg = await api.page(params);
return {
data: msg.data.data,
success: true,
total: msg.data.total,
};
}}
></ProTable>
<>
<Modal title="详情" open={isModalOpen} onOk={() => { }} onCancel={() => { setIsModalOpen(false); }}>
<Table columns={columnInfos} dataSource={thirdOrderInfo} />
</Modal>
</>
</PageContainer>
);
};

export default Manage;

+ 58
- 0
src/pages/order/thirdOrder/service.js View File

@@ -0,0 +1,58 @@
// @ts-ignore

/* eslint-disable */
import { request } from 'umi';

export default {

page(data) {
data.isreport = true;
return request(`/groupmealorder/api/Order/ThirdOrderPage`, {
method: 'Post',
data: data,
});
},

getThirdOrderInfo(data) {
return request(`/groupmealorder/api/Order/GetThirdOrderInfo?thirdOrderId=`+data, {
method: 'get',
});
},





/** 获取订单流水信息*/
orderList(data) {
data.isreport = true;
return request(`/groupmealorder/api/Order/PostDetail`, {
method: 'Post',
data: data,
// params: { ...params },
// ...(options || {}),
});
},

/**
* 查询店铺信息(设备信息)
*/
srdList(data) {
return request('/groupmealorder/api/shop/alllist', {
method: 'GET'
});
},

GetFlowExport(data) {
return request(`/groupmealorder/api/Order/GetFlowExport`, {
method: 'Post',
data: data
// params: { ...params },
// ...(options || {}),
});
},

};



Loading…
Cancel
Save