Browse Source

添加配置

feature/rail
LiLongLong 5 months ago
parent
commit
b118d2cec2
  1. 2
      .env
  2. 2
      package.json
  3. 1
      src/assets/menu/icon_rail.svg
  4. 20
      src/components/SideMenu.tsx
  5. 91
      src/pages/rail/railConfig.tsx

2
.env

@ -1 +1 @@
REACT_APP_WS_URL=192.168.1.200:8080/ws
REACT_APP_WS_URL=192.168.1.201:8080/ws

2
package.json

@ -2,7 +2,7 @@
"name": "outline", "name": "outline",
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"proxy": "http://192.168.1.200:8080",
"proxy": "http://192.168.1.201:8080",
"dependencies": { "dependencies": {
"@babel/core": "^7.16.0", "@babel/core": "^7.16.0",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.3", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",

1
src/assets/menu/icon_rail.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="31" height="30" viewBox="0 0 31 30"><defs><clipPath id="master_svg0_64_7991"><rect x="31" y="0" width="31" height="30" rx="0"/></clipPath></defs><g transform="matrix(-1,0,0,1,62,0)" clip-path="url(#master_svg0_64_7991)"><g><path d="M54.5998,22.7999755859375L62.0036,28.6499755859375L31,28.6499755859375L37.94111,22.6499755859375C36.09015,21.5999755859375,35.010419999999996,19.6499755859375,35.010419999999996,17.5499755859375L35.010419999999996,6.5999755859375C35.010419999999996,3.2999755859375,37.78686,0.5999755859375,41.1803,0.5999755859375L51.6691,0.5999755859375C55.0625,0.5999755859375,57.838899999999995,3.2999755859375,57.838899999999995,6.5999755859375L57.838899999999995,17.5499755859375C57.838899999999995,19.7999755859375,56.4507,21.7499755859375,54.5998,22.7999755859375ZM53.519999999999996,24.4499755859375L39.32933,24.4499755859375L37.94111,25.4999755859375L54.754000000000005,25.4999755859375L53.519999999999996,24.4499755859375ZM53.6743,18.1499755859375C53.6743,17.2499755859375,52.903099999999995,16.4999755859375,51.977599999999995,16.4999755859375C51.052099999999996,16.4999755859375,50.2809,17.2499755859375,50.2809,18.1499755859375C50.2809,19.0499755859375,51.052099999999996,19.7999755859375,51.977599999999995,19.7999755859375C52.903099999999995,19.9499755859375,53.6743,19.0499755859375,53.6743,18.1499755859375ZM42.7228,18.1499755859375C42.7228,17.2499755859375,41.951499999999996,16.4999755859375,41.025999999999996,16.4999755859375C40.10056,16.4999755859375,39.32933,17.2499755859375,39.32933,18.1499755859375C39.32933,19.0499755859375,40.10056,19.7999755859375,41.025999999999996,19.7999755859375C41.951499999999996,19.9499755859375,42.7228,19.0499755859375,42.7228,18.1499755859375ZM37.47837,26.3999755859375L36.09015,27.4499755859375L56.605000000000004,27.4499755859375L55.2168,26.3999755859375L37.47837,26.3999755859375ZM49.0469,1.9499755859375L43.3397,1.9499755859375C42.877,1.9499755859375,42.4143,2.3999755859375,42.4143,2.8499755859375C42.4143,3.2999755859375,42.877,3.7499755859375,43.3397,3.7499755859375L48.8926,3.7499755859375C49.3554,3.7499755859375,49.8181,3.2999755859375,49.8181,2.8499755859375C49.9724,2.3999755859375,49.5096,1.9499755859375,49.0469,1.9499755859375ZM54.5998,7.6499755859375C54.5998,6.4499755859375,53.519999999999996,5.3999755859375,52.286100000000005,5.3999755859375L40.10056,5.3999755859375C38.86659,5.3999755859375,37.78686,6.4499755859375,37.78686,7.6499755859375L37.78686,10.9499755859375C37.78686,12.1499755859375,38.86659,13.1999755859375,40.10056,13.1999755859375L52.286100000000005,13.1999755859375C53.519999999999996,13.1999755859375,54.5998,12.1499755859375,54.5998,10.9499755859375L54.5998,7.6499755859375Z" fill="#FFFFFF" fill-opacity="1" style="mix-blend-mode:passthrough"/></g></g></svg>

20
src/components/SideMenu.tsx

@ -2,7 +2,7 @@ import type { MenuProps } from "antd";
import { Menu } from "antd"; import { Menu } from "antd";
import icon_logo from "../assets/icon_logo.svg"; import icon_logo from "../assets/icon_logo.svg";
import icon_measure from "../assets/menu/icon_measure.svg"; import icon_measure from "../assets/menu/icon_measure.svg";
import icon_substrate from "../assets/menu/icon_substrate.svg";
import icon_rail from "../assets/menu/icon_rail.svg";
import { useNavigate, useLocation } from "react-router-dom"; import { useNavigate, useLocation } from "react-router-dom";
import "./SideMenu.scss"; import "./SideMenu.scss";
@ -25,15 +25,15 @@ const items: MenuItem[] = [
} }
], ],
}, },
// {
// key: "rail",
// label: "轨形管理",
// icon: <img src={icon_substrate} alt=""/>,
// children: [{
// key: '/rail/config',
// label: '轨形配置'
// }]
// }
{
key: "rail",
label: "轨形管理",
icon: <img src={icon_rail} alt=""/>,
children: [{
key: '/rail/config',
label: '轨形配置'
}]
}
]; ];
export default function SideMenu() { export default function SideMenu() {

91
src/pages/rail/railConfig.tsx

@ -1,10 +1,97 @@
import "./rail.scss"; import "./rail.scss";
import { Button, Pagination, Table, TableColumnsType } from 'antd'
import {useState} from 'react'
export default function RailManage() { export default function RailManage() {
type RailItem = {
id: number;
name: string;
}
let [loading, setLoading] = useState()
const [selectionType, setSelectionType] = useState<'checkbox'>('checkbox');
const [selectRows, setSelectedRow] = useState<RailItem[]>([])
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
const rowSelection = {
selectedRowKeys,
onChange: (selectedRowKeys: React.Key[], selectedRows: RailItem[]) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
setSelectedRow(selectedRows)
setSelectedRowKeys(selectedRowKeys)
},
getCheckboxProps: (record:RailItem) => ({
name: record.name,
}),
};
const [pageNum, setPageNum] = useState(1)
const [pageSize, setPageSize] = useState(5)
const onPageChange = (pageNumValue:number, pageSizeValue:number) => {
setPageNum(pageNumValue)
setPageSize(pageSizeValue)
let params = {
pageSize:pageSizeValue,
pageNum:pageNumValue,
}
}
const onShowDetail = (recordData:RailItem) => {
}
let [total, setTotal] = useState()
let [tableData, setTableData] = useState<RailItem[]>([])
const columns: TableColumnsType<RailItem> = [{
title: '序号',
dataIndex: 'seq',
render:(_, record, index)=>{
return index + 1
}
},
{
title: '轨型名称',
dataIndex: 'name',
},
{
title: '创建者',
dataIndex: 'createName',
},{
title: '时间',
dataIndex: 'createtTime',
},{
title: '操作',
dataIndex: 'op',
render:(_, record)=>{
return <div>
<Button type="link" onClick={()=>onShowDetail(record)}></Button>
</div>
}
}]
return ( return (
<div className="main-page"> <div className="main-page">
<main className="bg-white rounded-xl h-full ml-4 mr-6 overflow-auto"> <main className="bg-white rounded-xl h-full ml-4 mr-6 overflow-auto">
<div>12</div>
<div className="p-[1rem] flex gap-[5px]">
<Button type="primary"></Button>
<Button type="primary"></Button>
</div>
<div>
<Table
locale={{
emptyText: '无数据',
}}
loading={loading}
rowSelection={{ type: selectionType, ...rowSelection }}
columns={columns}
rowKey="id"
dataSource={tableData && tableData.map(item => ({ ...item, key: item.name }))}
pagination={false}
scroll={{ y: 500 }}
/>
<div className="float-right mt-[10px] mr-[1rem]">
<Pagination onChange={onPageChange} current={pageNum} pageSizeOptions={[5,10,20,30]} defaultCurrent={pageNum} defaultPageSize={pageSize} total={total}/>
</div>
</div>
</main> </main>
</div> </div>
); );

Loading…
Cancel
Save