Skip to content

A
admin-ci-test
提交 3220f9f3 作者: ZhangLingKun
操作

功能：onSelect改为onClick

上级 db0faf09
正在显示 包含 193 行增加 和 13 行删除
src/assets/style/App.scss
......@@ -11,7 +11,7 @@
font-size: 14px;
}
.ant-btn-link{
.ant-btn-link {
padding: 0;
font-size: 16px !important;
font-weight: bold !important;
......@@ -22,3 +22,27 @@
}
}
}
.ant-table-row:nth-child(odd) {
background: #FCFCFC;
}
.ant-table-row:nth-child(odd) > td {
background: #FCFCFC;
}
::-webkit-scrollbar {
background-color: transparent;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em;
width: 7px;
height: 7px;
}
::-webkit-scrollbar-thumb {
background-color: #1677ff;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em;
}
src/components/layout/menu/index.tsx
......@@ -24,9 +24,10 @@ export function MenuView() {
const onOpenChange: MenuProps['onOpenChange'] = (keys) => {
setOpenKeys([keys[keys.length - 1]]);
};
// 点击侧边栏事件
const onSelect: MenuProps['onSelect'] = (keys) => {
setSelectedKeys(keys.selectedKeys);
// 点击侧边栏事件 onSelect改为onClick
const onSelect: MenuProps['onClick'] = (keys) => {
setSelectedKeys([keys.key]);
// setSelectedKeys(keys.selectedKeys);
const id = Number(keys.key);
const current = GetRouteByID(id, routerList);
// console.log(current?.path);
......@@ -74,7 +75,7 @@ export function MenuView() {
<Menu
openKeys={openKeys}
selectedKeys={selectedKeys}
onSelect={onSelect}
onClick={onSelect}
onOpenChange={onOpenChange}
mode='inline'
items={items}
......
src/pages/orderManage/productOrder/detail/index.tsx 0 → 100644
import React, { useEffect } from 'react';
import { useLocation } from 'react-router-dom';
function ProductOrderDetail() {
// 路由钩子
const location = useLocation();
// 接收参数
const { id } = location.state;
// componentDidMount
useEffect(() => {
console.log('拿到的id是 --->', id);
}, [id]);
return (
<div>
<h2>ProductOrderDetail</h2>
<h3>{id}</h3>
</div>
);
}
export default ProductOrderDetail;
src/pages/orderManage/productOrder/index.tsx
import { useState } from 'react';
import SearchBox from '~/components/search-box';
import { Button } from 'antd';
import { Button, Table } from 'antd';
import { ColumnsType } from 'antd/es/table';
import { useNavigate } from 'react-router-dom';
// 表格数据类型
type TableType = any;
// 订单状态搜索列表
const statusCodeButtonList = [
......@@ -14,12 +19,105 @@ const statusCodeButtonList = [
];
function ProductOrderView() {
// 路由钩子
const navigate = useNavigate();
// 当前选择的是第几个按钮
const [statusCodeButtonIndex, setStatusCodeButtonIndex] = useState<number>(0);
// 表格分页配置
const [pagination] = useState({
total: 0,
pageSize: 10,
current: 1,
totalPage: 0,
});
// 表格数据
const [tableData] = useState<TableType>([{ id: 1 }]);
// 订单状态筛选
const statusChangeEvent = (index: number) => {
setStatusCodeButtonIndex(index);
const statusChangeEvent = (i: number) => {
console.log('订单状态筛选 --->', i);
setStatusCodeButtonIndex(i);
};
// 跳转订单详情
const handleDetail = (record: TableType[0]) => {
navigate(`/orderManage/productOrder/detail`, { state: { id: record.id } });
console.log('跳转订单详情 --->', record.id);
};
// 表格结构
const columns: ColumnsType<TableType[0]> = [
{
title: '商品',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '单价(元)',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '数量',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '买家',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '订单状态',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '实收款',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '相关运营',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '推荐人',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '订单交期',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '备注',
dataIndex: 'remark',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
fixed: 'right',
render: (_text, record) => (
<>
<Button type={'link'} onClick={() => handleDetail(record)}>
详情
</Button>
</>
),
},
];
return (
<>
<SearchBox
......@@ -68,6 +166,24 @@ function ProductOrderView() {
</>
}
/>
<Table
size='small'
dataSource={tableData}
columns={columns}
rowKey='id'
scroll={{ x: 1200 }}
pagination={{
total: pagination.total,
pageSize: pagination.pageSize,
current: pagination.current,
showSizeChanger: true,
showQuickJumper: true,
// onChange: (page: number, pageSize: number) =>
// paginationChange(page, pageSize),
showTotal: (total, range) => `当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`,
}}
// rowSelection={{ selectedRowKeys, onChange: onSelectChange }}
/>
</>
);
}
......
src/router/router.tsx
......@@ -2,7 +2,14 @@ import React from 'react';
import { Navigate, RouteObject } from 'react-router-dom';
import ErrorPage from '~/pages/common/error';
import LayoutView from '~/components/layout';
import { AccountBookOutlined, MacCommandOutlined } from '@ant-design/icons';
import {
AccountBookOutlined,
BarsOutlined,
MacCommandOutlined,
ShopOutlined,
CreditCardOutlined,
ShoppingOutlined,
} from '@ant-design/icons';
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
import { AgnosticIndexRouteObject } from '@remix-run/router';
......@@ -14,6 +21,7 @@ import PointDetailList from '~/pages/pointManage/pointDetail';
import DivideOrder from '~/pages/pointManage/divideOrder';
import DivideRules from '~/pages/pointManage/divideRules';
import LoginView from '~/pages/common/login';
import ProductOrderDetail from '~/pages/orderManage/productOrder/detail';
const ProductOrderView = React.lazy(() => import('src/pages/orderManage/productOrder')); //销售订单
const EquipmentOrderView = React.lazy(() => import('src/pages/orderManage/equipmentOrder')); //设备订单
......@@ -53,7 +61,7 @@ export const routerList: Array<RouteObjectType> = [
errorElement: <ErrorPage />,
meta: {
id: 10000,
icon: <MacCommandOutlined />,
icon: <BarsOutlined />,
title: '订单管理',
},
children: [
......@@ -63,7 +71,17 @@ export const routerList: Array<RouteObjectType> = [
meta: {
id: 10010,
title: '商城订单',
icon: <MacCommandOutlined />,
icon: <ShoppingOutlined />,
},
},
{
path: '/orderManage/productOrder/detail',
element: withLoadingComponent(<ProductOrderDetail />),
meta: {
id: 10010,
title: '商城订单 / 详情',
icon: <ShoppingOutlined />,
hidden: true,
},
},
{
......@@ -72,7 +90,7 @@ export const routerList: Array<RouteObjectType> = [
meta: {
id: 10020,
title: '租赁订单',
icon: <MacCommandOutlined />,
icon: <ShopOutlined />,
},
},
{
......@@ -81,7 +99,7 @@ export const routerList: Array<RouteObjectType> = [
meta: {
id: 10030,
title: '服务订单',
icon: <MacCommandOutlined />,
icon: <CreditCardOutlined />,
},
},
],
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论