Rain-Bus/trailway-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

temp

Browse Source
This commit is contained in:
Rain&Bus
2024-01-18 13:28:56 +08:00
parent fe6e1933a0
commit 97b143b526
11 changed files with 450 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Page.tsx
View File

@@ -1,6 +1,7 @@
import React from 'react';
import { HashRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
import NotFound from './components/pages/NotFound';
import Register from './components/pages/Register';
import Login from './components/pages/Login';
import App from './App';
@@ -11,6 +12,7 @@ export default () => (
<Route path="/app" component={App} />
<Route path="/404" component={NotFound} />
<Route path="/login" component={Login} />
<Route path="/register" component={Register} />
<Route component={NotFound} />
</Switch>
</Router>

5
src/components/HeaderCustom.tsx
View File

@@ -93,14 +93,15 @@ const HeaderCustom = (props: HeaderCustomProps) => {
onClick={props.toggle}
/>
)}
<span style={{ color: 'white' }}>地铁换乘站换乘客流预测系统</span>
<Menu
mode="horizontal"
style={{ lineHeight: '64px', float: 'right' }}
onClick={menuClick}
>
<Menu.Item key="pwa">
{/* <Menu.Item key="pwa">
<PwaInstaller />
</Menu.Item>
</Menu.Item> */}
<Menu.Item key="full">
<ArrowsAltOutlined onClick={screenFull} />
</Menu.Item>

4
src/components/index.tsx
View File

@@ -36,6 +36,8 @@ import UserManage from './management/UserManage';
import BlankPage from './management/BlankPage';
import StationInfo from './station/StationInfo';
import PredictInfo from './station/PredictInfo';
import StationManage from './management/StationManage';
import ChangePwd from './user/ChangePwd';
const WysiwygBundle = Loadable({
// 按需加载富文本配置
@@ -77,4 +79,6 @@ export default {
BlankPage,
StationInfo,
PredictInfo,
StationManage,
ChangePwd,
} as any;

316
src/components/management/StationManage.tsx Normal file
View File

@@ -0,0 +1,316 @@
import React from 'react';
import { Button, Table } from 'antd';
const StationManage = () => {
const columns = [
{
title: 'ID',
dataIndex: 'id',
key: 'id',
sorter: (a: any, b: any) => a.id - b.id,
},
{
title: '站点名称',
dataIndex: 'name',
key: 'name',
},
{
title: '所属线路',
dataIndex: 'route',
key: 'route',
},
{
title: '操作',
render: (record: any) => (
<div>
<Button type="primary" size="small">
修改信息
</Button>
<Button type="primary" size="small">
删除车站
</Button>
</div>
),
},
];
const data = [
{
id: 1,
name: 'F7',
route: '1号线',
},
{
id: 2,
name: 'F6',
route: '1号线',
},
{
id: 3,
name: 'F5',
route: '1号线',
},
{
id: 4,
name: 'F4',
route: '1号线',
},
{
id: 5,
name: 'F3',
route: '1号线',
},
{
id: 6,
name: 'F2',
route: '1号线',
},
{
id: 7,
name: 'F1',
route: '1号线',
},
{
id: 8,
name: 'F9',
route: '1号线',
},
{
id: 9,
name: 'F11',
route: '1号线',
},
{
id: 10,
name: 'F12',
route: '1号线',
},
{
id: 11,
name: 'F13',
route: '1号线',
},
{
id: 12,
name: 'F14',
route: '1号线',
},
{
id: 13,
name: 'F15',
route: '1号线',
},
{
id: 14,
name: 'F16',
route: '1号线',
},
{
id: 15,
name: 'F17',
route: '1号线',
},
{
id: 16,
name: 'F18',
route: '1号线',
},
{
id: 17,
name: 'S1',
route: '2号线',
},
{
id: 18,
name: 'S2',
route: '2号线',
},
{
id: 19,
name: 'S3',
route: '2号线',
},
{
id: 20,
name: 'S4',
route: '2号线',
},
{
id: 21,
name: 'S5',
route: '2号线',
},
{
id: 22,
name: 'S6',
route: '2号线',
},
{
id: 23,
name: 'FS8',
route: '2号线',
},
{
id: 24,
name: 'S8',
route: '2号线',
},
{
id: 25,
name: 'S9',
route: '2号线',
},
{
id: 26,
name: 'S10',
route: '2号线',
},
{
id: 27,
name: 'S12',
route: '2号线',
},
{
id: 28,
name: 'S13',
route: '2号线',
},
{
id: 29,
name: 'S14',
route: '2号线',
},
{
id: 30,
name: 'S15',
route: '2号线',
},
{
id: 31,
name: 'S16',
route: '2号线',
},
{
id: 32,
name: 'S17',
route: '2号线',
},
{
id: 33,
name: 'S18',
route: '2号线',
},
{
id: 34,
name: 'S19',
route: '2号线',
},
{
id: 35,
name: 'S20',
route: '2号线',
},
{
id: 36,
name: 'T16',
route: '3号线',
},
{
id: 37,
name: 'T15',
route: '3号线',
},
{
id: 38,
name: 'FT10',
route: '3号线',
},
{
id: 39,
name: 'T13',
route: '3号线',
},
{
id: 40,
name: 'T12',
route: '3号线',
},
{
id: 41,
name: 'ST11',
route: '3号线',
},
{
id: 42,
name: 'T10',
route: '3号线',
},
{
id: 43,
name: 'T9',
route: '3号线',
},
{
id: 44,
name: 'T8',
route: '3号线',
},
{
id: 45,
name: 'T7',
route: '3号线',
},
{
id: 46,
name: 'T6',
route: '3号线',
},
{
id: 47,
name: 'T5',
route: '3号线',
},
{
id: 48,
name: 'T4',
route: '3号线',
},
{
id: 49,
name: 'T3',
route: '3号线',
},
{
id: 50,
name: 'T2',
route: '3号线',
},
{
id: 51,
name: 'T1',
route: '3号线',
},
];
return (
<div>
<Button type="primary">增加车站</Button>
<Table columns={columns} dataSource={data} rowKey={(record) => record.id} />
<style>{`
.custom-filter-dropdown {
padding: 8px;
border-radius: 6px;
background: #fff;
box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
}
.custom-filter-dropdown input {
width: 130px;
margin-right: 8px;
}
.highlight {
color: #f50;
}
`}</style>
</div>
);
};
export default StationManage;

4
src/components/pages/Login.tsx
View File

@@ -40,10 +40,10 @@ const Login = (props: LoginProps) => {
if (res.data.success) {
let user = {
uid: res.data.id,
role: res.data.role === 1 ? '系统管理员' : '访客',
role: res.data.role == 1 ? '系统管理员' : '访客',
roleType: res.data.role,
username: values.userName,
permissions: res.data.role === 1 ? ['auth/admin'] : [],
permissions: res.data.role == 1 ? ['auth/admin'] : [],
};
setAlita('auth', user);
}

68
src/components/pages/Register.tsx Normal file
View File

@@ -0,0 +1,68 @@
/**
* Created by hao.cheng on 2017/4/16.
*/
import React, { useEffect } from 'react';
import { Button, Form, Input } from 'antd';
import { PwaInstaller } from '../widget';
import { useAlita } from 'redux-alita';
import { RouteComponentProps } from 'react-router';
import { FormProps } from 'antd/lib/form';
import umbrella from 'umbrella-storage';
import { GithubOutlined, LockOutlined, UserOutlined } from '@ant-design/icons';
import { useUpdateEffect } from 'ahooks';
const FormItem = Form.Item;
type RegisterProps = {
setAlitaState: (param: any) => void;
auth: any;
} & RouteComponentProps &
FormProps;
const Register = (props: RegisterProps) => {
return (
<div className="login">
<div className="login-form">
<div className="login-logo">
<span>用户注册</span>
</div>
<Form style={{ maxWidth: '300px' }}>
<FormItem
name="userName"
rules={[{ required: true, message: '请输入用户名!' }]}
>
<Input prefix={<UserOutlined size={13} />} placeholder="Username" />
</FormItem>
<FormItem name="password" rules={[{ required: true, message: '请输入密码!' }]}>
<Input
prefix={<LockOutlined size={13} />}
type="password"
placeholder="Password"
/>
</FormItem>
<FormItem
name="passwordConfirm"
rules={[{ required: true, message: '请再次输入密码!' }]}
>
<Input
prefix={<LockOutlined size={13} />}
type="password"
placeholder="Password Confirm"
/>
</FormItem>
<FormItem>
<Button
type="primary"
htmlType="submit"
className="Register-form-button"
style={{ width: '100%' }}
>
注册
</Button>
</FormItem>
</Form>
</div>
</div>
);
};
export default Register;

6
src/components/station/PredictInfo.tsx
View File

@@ -15,13 +15,13 @@ const StationInfo = () => {
return (
<Tabs defaultActiveKey="1" tabBarExtraContent={durationSelect()}>
<Tabs.TabPane tab="FS8" key="1">
<Image style={{ maxWidth: '90%' }} src={predict} />
<Image style={{ maxWidth: '80%' }} src={predict} />
</Tabs.TabPane>
<Tabs.TabPane tab="FT10" key="2">
<Image style={{ maxWidth: '90%' }} src={predict} />
<Image style={{ maxWidth: '80%' }} src={predict} />
</Tabs.TabPane>
<Tabs.TabPane tab="ST11" key="3">
<Image style={{ maxWidth: '98%' }} src={predict} />
<Image style={{ maxWidth: '80%' }} src={predict} />
</Tabs.TabPane>
</Tabs>
);

7
src/components/station/StationInfo.tsx
View File

@@ -46,7 +46,12 @@ const StationInfo = (props: StationInfoProps) => {
<p>站点名称： {props.query.station}</p>
<p>地址： xx省 xx市 xx区 xx路 xxx号</p>
<p>出入口数量：{Math.floor(Math.random() * 5) + 1}</p>
<p>进站人数: {Math.floor(Math.random() * 100)}</p>
<p>
{['ST', 'FS', 'FT'].some((ele) => String(props.query.station).startsWith(ele))
? '换乘'
: '近站'}
人数: {Math.floor(Math.random() * 100)}
</p>
<p>出站人数: {Math.floor(Math.random() * 100)}</p>
<p>站点图片:</p>
{images.length > 0 ? (

20
src/components/user/ChangePwd.tsx Normal file
View File

@@ -0,0 +1,20 @@
import React from 'react';
import { Button, Card, Divider, Input, Table } from 'antd';
const ChangePwd = () => {
return (
<div>
<Card title="修改密码" style={{ maxWidth: 400, margin: 'auto' }}>
<Input placeholder="请输入原密码" />
<Divider />
<Input placeholder="请输入新密码" />
<Divider />
<Input placeholder="请再次输入新密码" />
<Divider />
<Button type="primary">更改</Button>
</Card>
</div>
);
};
export default ChangePwd;

9
src/components/visualize/TrailwayRoute.tsx
View File

@@ -3,6 +3,7 @@
*/
import React, { Component } from 'react';
import ReactEcharts from 'echarts-for-react';
import { RouteComponentProps, withRouter } from 'react-router-dom';
var stations = [
{
@@ -518,11 +519,15 @@ const option = {
},
],
};
class TrailwayRoute extends Component {
class TrailwayRoute extends Component<RouteComponentProps, {}> {
render() {
return (
<ReactEcharts
option={option}
onEvents={{
click: (params: any) =>
this.props.history.push('/app/station?station=' + params.data.name),
}}
style={{ height: '700px', width: '1400px' }}
className={'react_for_echarts'}
/>
@@ -530,4 +535,4 @@ class TrailwayRoute extends Component {
}
}
export default TrailwayRoute;
export default withRouter(TrailwayRoute);

20
src/routes/config.ts
View File

@@ -159,7 +159,7 @@ const menus: {
},
{
key: '/app/predict',
title: '人流预测',
title: '中转人流预测',
icon: 'bars',
component: 'PredictInfo',
},
@@ -175,6 +175,12 @@ const menus: {
component: 'UserManage',
requireAuth: 'auth/admin',
},
{
key: '/app/manage/station',
title: '车站信息管理',
component: 'StationManage',
requireAuth: 'auth/admin',
},
// {
// key: '/app/extension/visitor',
// title: '访客模式',
@@ -205,6 +211,18 @@ const menus: {
// },
],
},
{
key: '/app/user',
title: '用户',
icon: 'bars',
subs: [
{
key: '/app/user/pwd',
title: '更改密码',
component: 'ChangePwd',
},
],
},
],
others: [], // 非菜单相关路由
};