增加订单查询、订单退款、用户封禁功能；修复bug #1
|
|
@ -0,0 +1,456 @@
|
|||
import React, { useState, useRef, useEffect } from "react";
|
||||
import { Form, Input, Button, Space, Table, Menu, Image, Modal } from "antd";
|
||||
import {
|
||||
Routes,
|
||||
Route,
|
||||
Navigate,
|
||||
useNavigate,
|
||||
useLocation,
|
||||
} from "react-router-dom";
|
||||
import baseRequest from "../../utils/baseRequest";
|
||||
|
||||
const BlockUserContent = (props) => {
|
||||
const { TextArea } = Input;
|
||||
const current = props.current;
|
||||
//表头
|
||||
const columns = [
|
||||
{
|
||||
title: "用户信息",
|
||||
dataIndex: "user",
|
||||
key: "user",
|
||||
onCell: (_, index) => ({
|
||||
rowSpan: _.rowSpan,
|
||||
}),
|
||||
render: (data) => (
|
||||
<div>
|
||||
<Image
|
||||
src={data.avatar}
|
||||
width={50}
|
||||
height={50}
|
||||
className="rounded-full object-cover"
|
||||
/>
|
||||
<p>
|
||||
昵称：<span className="text-red-400">{data.name}</span>
|
||||
</p>
|
||||
<p>
|
||||
ID：<span className="text-red-400">{data.user_id}</span>
|
||||
</p>
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "封禁内容",
|
||||
dataIndex: "type",
|
||||
key: "type",
|
||||
render: (data) => <p>{data === 0 && "主播发帖封禁"}</p>,
|
||||
},
|
||||
{
|
||||
title: "起始时间",
|
||||
dataIndex: "ct",
|
||||
key: "ct",
|
||||
},
|
||||
{
|
||||
title: "结束时间",
|
||||
dataIndex: "end_time",
|
||||
key: "end_time",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "status",
|
||||
key: "status",
|
||||
render: (data, record) => (
|
||||
<div>
|
||||
<p className="text-green-400">{data === 0 && "处罚中"}</p>
|
||||
<p className="text-green-400">{data === 1 && "正常结束"}</p>
|
||||
<p className="text-red-400">
|
||||
{data === 2 && `提前终止：${record.ut}`}
|
||||
</p>
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "opeartion",
|
||||
key: "opeartion",
|
||||
render: (_, record) => (
|
||||
<div>
|
||||
<Space>
|
||||
<Space.Compact direction="vertical">
|
||||
{current === "blocking" && (
|
||||
<Button type="primary" onClick={() => unblock(record)}>
|
||||
{current === "blocking" && "解封"}
|
||||
</Button>
|
||||
)}
|
||||
</Space.Compact>
|
||||
</Space>
|
||||
</div>
|
||||
),
|
||||
},
|
||||
];
|
||||
//给表单绑定ref
|
||||
const formRef = useRef(null);
|
||||
//点击修改状态按钮
|
||||
const unblock = (record) => {
|
||||
formRef.current.id = record.id;
|
||||
formRef.current.btn = "unblock";
|
||||
formRef.current.submit();
|
||||
};
|
||||
//提交表单
|
||||
const handleSubmit = async (value) => {
|
||||
//提交数据
|
||||
try {
|
||||
const base = baseRequest();
|
||||
const _response = await fetch("/op/account_punishment/unblock", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
id: formRef.current.id,
|
||||
...base,
|
||||
}),
|
||||
});
|
||||
const _data = await _response.json();
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
//刷新页面
|
||||
window.location.reload();
|
||||
};
|
||||
|
||||
//获取数据
|
||||
const [data, setData] = useState([]);
|
||||
const getData = async () => {
|
||||
let querryUrl;
|
||||
switch (current) {
|
||||
case "blocking":
|
||||
querryUrl = "/op/account_punishment/list";
|
||||
break;
|
||||
case "terminated":
|
||||
querryUrl = "/op/account_punishment/list_terminated";
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
try {
|
||||
const base = baseRequest();
|
||||
const _response = await fetch(querryUrl, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
offset: 0,
|
||||
limit: 10000,
|
||||
...base,
|
||||
}),
|
||||
});
|
||||
const _data = await _response.json();
|
||||
console.log(_data);
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
//将每人的每种封禁拆分
|
||||
const blockList = _data.data.list
|
||||
.map((item1, index1) =>
|
||||
item1.account_punishments.map((item2, index2) => ({
|
||||
rowSpan: index2 === 0 ? item1.account_punishments.length : 0,
|
||||
account: item1.account,
|
||||
account_punishments: item2,
|
||||
}))
|
||||
)
|
||||
.flat();
|
||||
//匹配表格格式
|
||||
const structedData = blockList.map((item, index) => {
|
||||
return {
|
||||
key: index,
|
||||
id: item.account_punishments.id,
|
||||
rowSpan: item.rowSpan,
|
||||
user: {
|
||||
avatar: item.account.avatar?.images[0].urls[0],
|
||||
user_id: item.account.user_id,
|
||||
name: item.account.name,
|
||||
},
|
||||
type: item.account_punishments.type,
|
||||
ct: new Date(item.account_punishments.ct * 1000).toLocaleString(),
|
||||
end_time: new Date(
|
||||
item.account_punishments.end_time * 1000
|
||||
).toLocaleString(),
|
||||
status: item.account_punishments.status,
|
||||
ut: new Date(item.account_punishments.ut * 1000).toLocaleString(),
|
||||
};
|
||||
});
|
||||
setData([...data, ...structedData]);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, [current]);
|
||||
|
||||
//展示的数据
|
||||
const [showData, setShowData] = useState([]);
|
||||
useEffect(() => {
|
||||
setShowData(data);
|
||||
}, [data]);
|
||||
|
||||
//打开添加封禁Modal
|
||||
const [isModalVisible, setIsModalVisible] = useState(false);
|
||||
|
||||
//在modal中搜索用户
|
||||
const [userInfo, setUserInfo] = useState();
|
||||
const modalSearch = async (value) => {
|
||||
try {
|
||||
const base = baseRequest();
|
||||
const _response = await fetch(`/op/account/list_by_user_id`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
user_id: parseInt(value.userId, 10),
|
||||
...base,
|
||||
}),
|
||||
});
|
||||
const _data = await _response.json();
|
||||
console.log(_data);
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
setSelectedUser();
|
||||
setUserInfo(_data.data.account);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
//选中用户
|
||||
const [selectedUser, setSelectedUser] = useState();
|
||||
const handleSelected = () => {
|
||||
if (selectedUser) {
|
||||
setSelectedUser();
|
||||
return;
|
||||
}
|
||||
setSelectedUser(userInfo.mid);
|
||||
};
|
||||
//添加封禁
|
||||
const [form] = Form.useForm();
|
||||
const block = async (value) => {
|
||||
if (!selectedUser) {
|
||||
alert("还未选中用户");
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const base = baseRequest();
|
||||
const _response = await fetch("/op/account_punishment/create", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
mid: selectedUser,
|
||||
type: parseInt(value.type, 10),
|
||||
duration: parseInt(value.duration, 10),
|
||||
...base,
|
||||
}),
|
||||
});
|
||||
const _data = await _response.json();
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
handleCancelModal();
|
||||
//刷新页面
|
||||
window.location.reload();
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
//关闭弹窗
|
||||
const handleCancelModal = () => {
|
||||
form.resetFields();
|
||||
setUserInfo();
|
||||
setSelectedUser();
|
||||
setIsModalVisible(false);
|
||||
};
|
||||
|
||||
//表单提交失败
|
||||
const onFinishFailed = (errorInfo) => {
|
||||
console.log("Failed:", errorInfo);
|
||||
};
|
||||
return (
|
||||
<div style={{ marginLeft: 20, marginRight: 20, marginTop: 20 }}>
|
||||
<Button
|
||||
className="mb-4"
|
||||
type="primary"
|
||||
onClick={() => setIsModalVisible(true)}
|
||||
>
|
||||
添加封禁
|
||||
</Button>
|
||||
<Form
|
||||
ref={formRef}
|
||||
name="remarks"
|
||||
onFinish={handleSubmit}
|
||||
onFinishFailed={onFinishFailed}
|
||||
>
|
||||
<Table
|
||||
columns={columns}
|
||||
dataSource={showData}
|
||||
pagination={{ pageSize: 20 }}
|
||||
scroll={{ y: window.innerHeight - 300 }}
|
||||
/>
|
||||
</Form>
|
||||
{isModalVisible && (
|
||||
<Modal footer={null} open={isModalVisible} onCancel={handleCancelModal}>
|
||||
<p className="text-sm text-red-400 font-bold">
|
||||
*请选中用户后再执行操作
|
||||
</p>
|
||||
<Form name="modal_search" onFinish={modalSearch}>
|
||||
<Space style={{ marginBottom: 20 }}>
|
||||
<Form.Item label="ID" name="userId" style={{ margin: 0 }}>
|
||||
<Input type="number" />
|
||||
</Form.Item>
|
||||
<Button type="primary" htmlType="submit">
|
||||
搜索
|
||||
</Button>
|
||||
</Space>
|
||||
</Form>
|
||||
{userInfo && (
|
||||
<div
|
||||
className={`flex flex-row items-center p-2 rounded-xl ${
|
||||
selectedUser ? "bg-green-300" : "bg-gray-300"
|
||||
}`}
|
||||
>
|
||||
<Image
|
||||
src={userInfo?.avatar?.images[0].urls[0]}
|
||||
width={80}
|
||||
height={80}
|
||||
/>
|
||||
<div className="flex flex-col justify-center mx-4">
|
||||
<p className="text-lg font-bold">ID：{userInfo.user_id}</p>
|
||||
<p className="text-lg font-bold">昵称：{userInfo.name}</p>
|
||||
</div>
|
||||
<Button
|
||||
type={selectedUser ? "default" : "primary"}
|
||||
onClick={handleSelected}
|
||||
>
|
||||
{selectedUser ? "取消选中" : "选中用户"}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
<Form className="mt-4 flex flex-col" form={form} onFinish={block}>
|
||||
<Space>
|
||||
<Form.Item
|
||||
name="type"
|
||||
label="封禁内容"
|
||||
initialValue={0}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: "请选择封禁内容",
|
||||
},
|
||||
]}
|
||||
>
|
||||
<select
|
||||
style={{
|
||||
height: 32,
|
||||
padding: "4px 11px",
|
||||
border: "1px solid #d9d9d9",
|
||||
borderRadius: 4,
|
||||
outline: "none",
|
||||
}}
|
||||
>
|
||||
<option value={0}>限制发帖</option>
|
||||
</select>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="duration"
|
||||
label="封禁时长"
|
||||
initialValue={86400}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: "请选择封禁时长",
|
||||
},
|
||||
]}
|
||||
>
|
||||
<select
|
||||
style={{
|
||||
height: 32,
|
||||
padding: "4px 11px",
|
||||
border: "1px solid #d9d9d9",
|
||||
borderRadius: 4,
|
||||
outline: "none",
|
||||
}}
|
||||
>
|
||||
<option value={86400}>1天</option>
|
||||
<option value={259200}>3天</option>
|
||||
<option value={604800}>7天</option>
|
||||
<option value={1296000}>15天</option>
|
||||
<option value={2592000}>30天</option>
|
||||
<option value={3155760000}>永久</option>
|
||||
</select>
|
||||
</Form.Item>
|
||||
</Space>
|
||||
<Button className="ml-8" type="primary" htmlType="submit">
|
||||
确认
|
||||
</Button>
|
||||
</Form>
|
||||
</Modal>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default function BlockUser() {
|
||||
const navigate = useNavigate();
|
||||
//当前tab
|
||||
const location = useLocation();
|
||||
const pathname = location.pathname.split("/")[2] || "blocking";
|
||||
const [current, setCurrent] = useState(pathname);
|
||||
//tab名称
|
||||
const items = [
|
||||
{
|
||||
label: "封禁中",
|
||||
key: "blocking",
|
||||
},
|
||||
{
|
||||
label: "已结束",
|
||||
key: "terminated",
|
||||
},
|
||||
];
|
||||
const onClick = (e) => {
|
||||
setCurrent(e.key);
|
||||
navigate(e.key);
|
||||
window.location.reload();
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Menu
|
||||
onClick={onClick}
|
||||
selectedKeys={[current]}
|
||||
mode="horizontal"
|
||||
items={items}
|
||||
/>
|
||||
<Routes>
|
||||
<Route path="/" element={<Navigate to="/blockUser/blocking" />} />
|
||||
<Route
|
||||
path="/blocking"
|
||||
element={<BlockUserContent current="blocking" />}
|
||||
/>
|
||||
<Route
|
||||
path="/terminated"
|
||||
element={<BlockUserContent current="terminated" />}
|
||||
/>
|
||||
</Routes>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -323,6 +323,7 @@ const CreateAndEditPostContent = (props) => {
|
|||
alert(data.msg);
|
||||
return;
|
||||
}
|
||||
setSelectedUser();
|
||||
setUserInfo(data.data.account);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
|
|
|
|||
|
|
@ -149,6 +149,7 @@ const ManualRechargeAndWithdrawalContent = (props) => {
|
|||
alert(data.msg);
|
||||
return;
|
||||
}
|
||||
setSelectedUser();
|
||||
setUserInfo(data.data.account);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
|
|
|
|||
|
|
@ -35,6 +35,10 @@ export default function Data() {
|
|||
}),
|
||||
});
|
||||
const _data = await response.json();
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
const structedData = _data.data.list.map((item, index) => {
|
||||
return {
|
||||
key: index,
|
||||
|
|
@ -54,10 +58,6 @@ export default function Data() {
|
|||
};
|
||||
});
|
||||
setData(structedData);
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -66,9 +66,13 @@ export default function Op() {
|
|||
getItem("手机号查询", "getPhoneNumber"),
|
||||
]),
|
||||
// getItem("用户管理", "userManagement", <UsergroupAddOutlined />),
|
||||
// getItem("订单管理", "orderManagement", <FileSearchOutlined />, [
|
||||
// getItem("订单查询", "ordersQuerry"),
|
||||
// ]),
|
||||
getItem("订单管理", "orderManagement", <FileSearchOutlined />, [
|
||||
getItem("查询", "ordersQuerry"),
|
||||
getItem("退款", "refund"),
|
||||
]),
|
||||
getItem("社区治理", "communityManagement", <UsergroupAddOutlined />, [
|
||||
getItem("用户封禁", "blockUser"),
|
||||
]),
|
||||
getItem(
|
||||
"人工充值/提现",
|
||||
"manualRechargeAndWithdrawal",
|
||||
|
|
|
|||
|
|
@ -1,354 +1,167 @@
|
|||
import React, { useState } from "react";
|
||||
import { Form, Input, Button, Space, Table, Checkbox, Image } from "antd";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import baseRequest from "../../utils/baseRequest";
|
||||
import { DatePicker, Table, Form, Space, Button, Input, Radio } from "antd";
|
||||
|
||||
export default function OrdersQuerry() {
|
||||
//展示的表头
|
||||
const [showColumns, setShowColumns] = useState([
|
||||
"orderId",
|
||||
"orderStatus",
|
||||
"orderTime",
|
||||
"creatorId",
|
||||
"creatorName",
|
||||
"userId",
|
||||
"userName",
|
||||
"requirement",
|
||||
"payment",
|
||||
"comment",
|
||||
]);
|
||||
//动态的表头
|
||||
const dynamicColumns = showColumns.map((item) => {
|
||||
switch (item) {
|
||||
case "orderId":
|
||||
return {
|
||||
title: "订单号",
|
||||
dataIndex: "orderId",
|
||||
key: "orderId",
|
||||
};
|
||||
case "orderStatus":
|
||||
return {
|
||||
title: "订单状态",
|
||||
dataIndex: "orderStatus",
|
||||
key: "orderStatus",
|
||||
};
|
||||
case "orderTime":
|
||||
return {
|
||||
title: "订单时间",
|
||||
dataIndex: "orderTime",
|
||||
key: "orderTime",
|
||||
render: (orderTime) => (
|
||||
<ul>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>创建时间：</span>
|
||||
{orderTime.createTime}
|
||||
</li>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>付款时间：</span>
|
||||
{orderTime.payTime}
|
||||
</li>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>发货时间：</span>
|
||||
{orderTime.deliveryTime}
|
||||
</li>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>完成时间：</span>
|
||||
{orderTime.finishTime}
|
||||
</li>
|
||||
</ul>
|
||||
),
|
||||
};
|
||||
case "creatorId":
|
||||
return {
|
||||
title: "名人ID",
|
||||
dataIndex: "creatorId",
|
||||
key: "creatorId",
|
||||
};
|
||||
case "creatorName":
|
||||
return {
|
||||
title: "名人昵称",
|
||||
dataIndex: "creatorName",
|
||||
key: "creatorName",
|
||||
};
|
||||
case "userId":
|
||||
return {
|
||||
title: "用户ID",
|
||||
dataIndex: "userId",
|
||||
key: "userId",
|
||||
};
|
||||
case "userName":
|
||||
return {
|
||||
title: "用户昵称",
|
||||
dataIndex: "userName",
|
||||
key: "userName",
|
||||
};
|
||||
case "requirement":
|
||||
return {
|
||||
title: "拍摄要求",
|
||||
dataIndex: "requirement",
|
||||
key: "requirement",
|
||||
render: (requirement) => (
|
||||
<ul>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>给谁：</span>
|
||||
{requirement.to}
|
||||
</li>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>拍摄要求：</span>
|
||||
{requirement.requirement}
|
||||
</li>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>备注：</span>
|
||||
{requirement.remark}
|
||||
</li>
|
||||
</ul>
|
||||
),
|
||||
};
|
||||
case "payment":
|
||||
return {
|
||||
title: "实付款",
|
||||
dataIndex: "payment",
|
||||
key: "payment",
|
||||
};
|
||||
case "media":
|
||||
return {
|
||||
title: "成品",
|
||||
dataIndex: "media",
|
||||
key: "media",
|
||||
render: (media) =>
|
||||
media.type === "img" ? (
|
||||
<Image
|
||||
key={media.url}
|
||||
src={media.url}
|
||||
width={150}
|
||||
style={{ marginBottom: 10 }}
|
||||
/>
|
||||
) : (
|
||||
<video key={media.url} src={media.url} width={150} controls />
|
||||
),
|
||||
};
|
||||
case "comment":
|
||||
return {
|
||||
title: "评价",
|
||||
dataIndex: "comment",
|
||||
key: "comment",
|
||||
render: (comment) => (
|
||||
<ul>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>评分：</span>
|
||||
{comment.rate}
|
||||
</li>
|
||||
<li>
|
||||
<span style={{ color: "red" }}>评语：</span>
|
||||
{comment.comment}
|
||||
</li>
|
||||
</ul>
|
||||
),
|
||||
};
|
||||
case "reaction":
|
||||
return {
|
||||
title: "Reaction",
|
||||
dataIndex: "reaction",
|
||||
key: "reaction",
|
||||
render: (reaction) => (
|
||||
<div>
|
||||
{reaction
|
||||
? reaction.map((item) =>
|
||||
item.type === "img" ? (
|
||||
<Image
|
||||
key={item.url}
|
||||
src={item.url}
|
||||
width={150}
|
||||
style={{ marginBottom: 10 }}
|
||||
/>
|
||||
) : (
|
||||
<video
|
||||
key={item.url}
|
||||
src={item.url}
|
||||
width={150}
|
||||
controls
|
||||
/>
|
||||
)
|
||||
)
|
||||
: "无"}
|
||||
</div>
|
||||
),
|
||||
};
|
||||
default:
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//全部数据
|
||||
const data = [
|
||||
const { RangePicker } = DatePicker;
|
||||
const [data, setData] = useState();
|
||||
|
||||
//表头
|
||||
const columns = [
|
||||
{
|
||||
key: "1",
|
||||
orderId: "666666666",
|
||||
orderStatus: "已完成",
|
||||
orderTime: {
|
||||
createTime: "2022-07-25 12:00:00",
|
||||
payTime: "2022-07-25 12:01:00",
|
||||
deliveryTime: "2022-07-26 12:02:00",
|
||||
finishTime: "2022-07-25 12:03:00",
|
||||
title: "基本信息",
|
||||
dataIndex: "base",
|
||||
key: "base",
|
||||
render: (data) => {
|
||||
return (
|
||||
<div>
|
||||
<p>
|
||||
<span className="text-green-400">订单号：</span>
|
||||
{data.order_id}
|
||||
</p>
|
||||
<p>
|
||||
<span className="text-green-400">订单状态：</span>
|
||||
{data.order_status_desc}
|
||||
</p>
|
||||
<p>
|
||||
<span className="text-green-400">创建时间：</span>
|
||||
{data.ct}
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
creatorId: "123456",
|
||||
creatorName: "马牛逼",
|
||||
userId: "888888",
|
||||
userName: "路人甲",
|
||||
requirement: {
|
||||
to: "路人A",
|
||||
requirement: "马牛逼的拍摄要求",
|
||||
remark: "马牛逼的备注",
|
||||
},
|
||||
payment: 60,
|
||||
media: {
|
||||
type: "img",
|
||||
url: "https://s2.loli.net/2023/07/25/fjouqVLAlTn2s58.png",
|
||||
},
|
||||
comment: { rate: "5.0", comment: "马牛逼的评价" },
|
||||
reaction: [
|
||||
{
|
||||
type: "img",
|
||||
url: "https://s2.loli.net/2023/07/25/fjouqVLAlTn2s58.png",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
orderId: "999999999",
|
||||
orderStatus: "已完成",
|
||||
orderTime: {
|
||||
createTime: "2023-07-25 12:00:00",
|
||||
payTime: "2023-07-25 12:01:00",
|
||||
deliveryTime: "2023-07-26 12:02:00",
|
||||
finishTime: "2023-07-25 12:03:00",
|
||||
title: "商品名称",
|
||||
dataIndex: "product",
|
||||
key: "product",
|
||||
},
|
||||
{
|
||||
title: "金额",
|
||||
dataIndex: "cost",
|
||||
key: "cost",
|
||||
render: (data) => {
|
||||
return (
|
||||
<div>
|
||||
{data.coins && <p>{data.coins}</p>}
|
||||
{data.money && <p>{data.money}</p>}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
creatorId: "10086",
|
||||
creatorName: "迪迦",
|
||||
userId: "111111",
|
||||
userName: "路人乙",
|
||||
requirement: {
|
||||
to: "路人B",
|
||||
requirement: "迪迦的拍摄要求",
|
||||
remark: "迪迦的备注",
|
||||
},
|
||||
{
|
||||
title: "购买（双）方",
|
||||
dataIndex: "userAndStreamer",
|
||||
key: "userAndStreamer",
|
||||
render: (data) => {
|
||||
return (
|
||||
<div>
|
||||
<p>
|
||||
<span className="text-green-400">用户id：</span>
|
||||
{data.user_user_id}
|
||||
</p>
|
||||
{data.streamer_user_id && (
|
||||
<p>
|
||||
<span className="text-green-400">主播id：</span>
|
||||
{data.streamer_user_id}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
payment: 50,
|
||||
media: {
|
||||
type: "video",
|
||||
url: "https://media.w3.org/2010/05/sintel/trailer.mp4",
|
||||
},
|
||||
comment: { rate: "4.0", comment: "迪迦的评价" },
|
||||
reaction: [
|
||||
{
|
||||
type: "img",
|
||||
url: "https://s2.loli.net/2023/07/25/1daCqmZGQNUzoJ8.png",
|
||||
},
|
||||
{
|
||||
type: "video",
|
||||
url: "https://media.w3.org/2010/05/sintel/trailer.mp4",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
//表头可见性表单的checkbox选项
|
||||
const showColumnsOptions = [
|
||||
{
|
||||
label: "订单号",
|
||||
value: "orderId",
|
||||
},
|
||||
{
|
||||
label: "订单状态",
|
||||
value: "orderStatus",
|
||||
},
|
||||
{
|
||||
label: "订单时间",
|
||||
value: "orderTime",
|
||||
},
|
||||
{
|
||||
label: "名人ID",
|
||||
value: "creatorId",
|
||||
},
|
||||
{
|
||||
label: "名人昵称",
|
||||
value: "creatorName",
|
||||
},
|
||||
{
|
||||
label: "用户ID",
|
||||
value: "userId",
|
||||
},
|
||||
{
|
||||
label: "用户昵称",
|
||||
value: "userName",
|
||||
},
|
||||
{
|
||||
label: "拍摄要求",
|
||||
value: "requirement",
|
||||
},
|
||||
{
|
||||
label: "实付款",
|
||||
value: "payment",
|
||||
},
|
||||
{
|
||||
label: "成品",
|
||||
value: "media",
|
||||
},
|
||||
{
|
||||
label: "评价",
|
||||
value: "comment",
|
||||
},
|
||||
{
|
||||
label: "Reaction",
|
||||
value: "reaction",
|
||||
},
|
||||
];
|
||||
//展示的数据
|
||||
const [showData, setShowData] = useState(data);
|
||||
//搜索名人
|
||||
const search = (value) => {
|
||||
value.creatorName ||
|
||||
value.creatorId ||
|
||||
value.orderId ||
|
||||
value.userId ||
|
||||
value.userName
|
||||
? setShowData(
|
||||
data.filter(
|
||||
(item) =>
|
||||
item.creatorName === value.creatorName ||
|
||||
item.creatorId === value.creatorId ||
|
||||
item.orderId === value.orderId ||
|
||||
item.userId === value.userId ||
|
||||
item.userName === value.userName
|
||||
)
|
||||
)
|
||||
: setShowData(data);
|
||||
|
||||
//搜索
|
||||
const handleQuerry = async (value) => {
|
||||
const ordersQuerry = async (type) => {
|
||||
try {
|
||||
const base = baseRequest();
|
||||
//金币订单查询
|
||||
const response = await fetch(`/op/vas/${type}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
st: value.time ? Math.floor(value.time[0].valueOf() / 1000) : 0,
|
||||
et: value.time ? Math.floor(value.time[1].valueOf() / 1000) : 0,
|
||||
user_id: value.user_id ? parseInt(value.user_id, 10) : 0,
|
||||
mid: value.mid ? parseInt(value.mid, 10) : 0,
|
||||
order_id: value.order_id ? value.order_id : "",
|
||||
...base,
|
||||
}),
|
||||
});
|
||||
const _data = await response.json();
|
||||
console.log(_data);
|
||||
if (_data.ret === -1) {
|
||||
return false;
|
||||
}
|
||||
const structedData = _data.data.list.map((item, index) => {
|
||||
return {
|
||||
key: index,
|
||||
base: {
|
||||
order_id: item.order_id,
|
||||
order_status_desc: item.order_status_desc,
|
||||
ct: new Date(item.ct * 1000).toLocaleString(),
|
||||
},
|
||||
product: item.product_name,
|
||||
cost: {
|
||||
coins: `${item?.coins}金币`,
|
||||
money: `¥${item?.money / 100}`,
|
||||
},
|
||||
userAndStreamer: {
|
||||
user_user_id: item?.user_user_id,
|
||||
streamer_user_id: item?.streamer_user_id,
|
||||
},
|
||||
};
|
||||
});
|
||||
return structedData;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
let result = await ordersQuerry("coin_order_list");
|
||||
if (!result) result = await ordersQuerry("order_list");
|
||||
setData(result);
|
||||
};
|
||||
|
||||
//表单提交失败
|
||||
const onFinishFailed = (errorInfo) => {
|
||||
console.log("Failed:", errorInfo);
|
||||
};
|
||||
|
||||
return (
|
||||
<div style={{ marginLeft: 20, marginRight: 20 }}>
|
||||
<div style={{ marginTop: 20, marginBottom: 10 }}>
|
||||
<p style={{ display: "inline" }}>数据可见性：</p>
|
||||
<Checkbox.Group
|
||||
options={showColumnsOptions}
|
||||
defaultValue={showColumns}
|
||||
onChange={(value) => setShowColumns(value)}
|
||||
/>
|
||||
</div>
|
||||
<Form name="search" onFinish={search} onFinishFailed={onFinishFailed}>
|
||||
<Space style={{ marginBottom: 20 }}>
|
||||
<Form.Item label="订单号" name="orderId" style={{ margin: 0 }}>
|
||||
<Input />
|
||||
<div className="px-4">
|
||||
<h1>订单查询</h1>
|
||||
<p className="text-red-400">*以下字段择一填写进行查询</p>
|
||||
<Form
|
||||
name="querry"
|
||||
onFinish={handleQuerry}
|
||||
onFinishFailed={onFinishFailed}
|
||||
>
|
||||
<Space direction="vertical" style={{ marginBottom: 20 }}>
|
||||
<Form.Item label="ID" name="user_id" style={{ margin: 0 }}>
|
||||
<Input type="number" />
|
||||
</Form.Item>
|
||||
<Form.Item label="名人ID" name="creatorId" style={{ margin: 0 }}>
|
||||
<Input />
|
||||
<Form.Item
|
||||
label="mid(开发使用，运营勿用)"
|
||||
name="mid"
|
||||
style={{ margin: 0 }}
|
||||
>
|
||||
<Input type="number" />
|
||||
</Form.Item>
|
||||
<Form.Item label="名人昵称" name="creatorName" style={{ margin: 0 }}>
|
||||
<Input />
|
||||
<Form.Item label="订单号" name="order_id" style={{ margin: 0 }}>
|
||||
<Input type="number" />
|
||||
</Form.Item>
|
||||
<Form.Item label="用户ID" name="userId" style={{ margin: 0 }}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item label="用户昵称" name="userName" style={{ margin: 0 }}>
|
||||
<Input />
|
||||
<Form.Item label="时间段" name="time" style={{ margin: 0 }}>
|
||||
<RangePicker
|
||||
showTime={{
|
||||
format: "HH:mm",
|
||||
}}
|
||||
showNow
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Button type="primary" htmlType="submit">
|
||||
搜索
|
||||
|
|
@ -356,8 +169,8 @@ export default function OrdersQuerry() {
|
|||
</Space>
|
||||
</Form>
|
||||
<Table
|
||||
columns={dynamicColumns}
|
||||
dataSource={showData}
|
||||
columns={columns}
|
||||
dataSource={data}
|
||||
pagination={{ pageSize: 20 }}
|
||||
scroll={{ y: window.innerHeight - 300 }}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,87 @@
|
|||
import React from "react";
|
||||
import { Form, Input, Space, Button, message, Radio } from "antd";
|
||||
import baseRequest from "../../utils/baseRequest";
|
||||
|
||||
const RefundContent = (props) => {
|
||||
const [form] = Form.useForm();
|
||||
|
||||
//提交退款
|
||||
const handleRefund = async (value) => {
|
||||
try {
|
||||
const base = baseRequest();
|
||||
const _response = await fetch(
|
||||
`op/vas/${
|
||||
value.type === "coin" ? "refund_coin_order" : "refund_order"
|
||||
}`,
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
order_id: value.orderId,
|
||||
operator: value.operator,
|
||||
...base,
|
||||
}),
|
||||
}
|
||||
);
|
||||
const _data = await _response.json();
|
||||
console.log(_data);
|
||||
if (_data.ret === -1) {
|
||||
alert(_data.msg);
|
||||
return;
|
||||
}
|
||||
form.resetFields();
|
||||
message.success("退款成功");
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
//表单提交失败
|
||||
const onFinishFailed = (errorInfo) => {
|
||||
console.log("Failed:", errorInfo);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="mt-4" style={{ marginLeft: 20, marginRight: 20 }}>
|
||||
<Form
|
||||
name="refund"
|
||||
form={form}
|
||||
onFinish={handleRefund}
|
||||
onFinishFailed={onFinishFailed}
|
||||
>
|
||||
<Space direction="vertical" style={{ marginBottom: 20 }}>
|
||||
<Form.Item label="订单号" name="orderId" style={{ margin: 0 }}>
|
||||
<Input type="number" />
|
||||
</Form.Item>
|
||||
<Form.Item label="操作人" name="operator" style={{ margin: 0 }}>
|
||||
<Input type="text" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="type"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: "未选择",
|
||||
},
|
||||
]}
|
||||
style={{ margin: 0 }}
|
||||
>
|
||||
<Radio.Group>
|
||||
<Radio.Button value="coin">退金币</Radio.Button>
|
||||
<Radio.Button value="cash">退现金</Radio.Button>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
<Button type="primary" htmlType="submit">
|
||||
确认退款
|
||||
</Button>
|
||||
</Space>
|
||||
</Form>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default function Refund() {
|
||||
return <RefundContent />;
|
||||
}
|
||||
|
|
@ -19,6 +19,8 @@ import CreateAndEditPost from "../pages/CreateAndEditPost";
|
|||
import TopPosts from "../pages/TopPosts";
|
||||
import PostMachineReview from "../pages/PostMachineReview";
|
||||
import GetPhoneNumber from "../pages/GetPhoneNumber";
|
||||
import Refund from "../pages/Refund";
|
||||
import BlockUser from "../pages/BlockUser";
|
||||
|
||||
const routes = [
|
||||
{
|
||||
|
|
@ -105,6 +107,14 @@ const routes = [
|
|||
path: "getPhoneNumber/*",
|
||||
element: <GetPhoneNumber />,
|
||||
},
|
||||
{
|
||||
path: "refund/*",
|
||||
element: <Refund />,
|
||||
},
|
||||
{
|
||||
path: "blockUser/*",
|
||||
element: <BlockUser />,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
|
|
|||
Loading…
Reference in New Issue