消防基础路由
wangyunfei
1 month ago
parent
f5bc63501c
commit
373ccbc654
Binary file not shown.
|
After Width: | Height: | Size: 416 B |
@ -0,0 +1,66 @@
|
|||||||
|
import React, { useState } from 'react';
|
||||||
|
import { Card, Row, Col, Statistic, Progress, Button, Space } from 'antd';
|
||||||
|
import styles from './basic.less';
|
||||||
|
import ResponsibilityImplementation from './module/ResponsibilityImplementation'; //责任落实
|
||||||
|
import OnlineMonitoring from './module/OnlineMonitoring'; //在线监测预警
|
||||||
|
import RiskAssessment from './module/RiskAssessment'; //风险管控
|
||||||
|
import EvaluationReport from './module/EvaluationReport'; //评估报告
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const SafeMajorHazardList = () => {
|
||||||
|
const [activeModule, setActiveModule] = useState('organization');
|
||||||
|
|
||||||
|
const handleModuleClick = (module) => {
|
||||||
|
setActiveModule(module)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const renderModule = () => {
|
||||||
|
switch (activeModule) {
|
||||||
|
case 'organization':
|
||||||
|
return <ResponsibilityImplementation />;
|
||||||
|
case 'equipment':
|
||||||
|
return <OnlineMonitoring />;
|
||||||
|
case 'firefighting':
|
||||||
|
return <RiskAssessment />;
|
||||||
|
case 'other':
|
||||||
|
return <EvaluationReport />;
|
||||||
|
default:
|
||||||
|
return <ResponsibilityImplementation />;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={styles.container}>
|
||||||
|
<div className={styles.TopButton}>
|
||||||
|
<Button
|
||||||
|
className={`${styles.TopButtonItem} ${activeModule === "organization" ? styles.active : ""}`}
|
||||||
|
onClick={() => handleModuleClick("organization")}
|
||||||
|
>组织机构管理
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
className={`${styles.TopButtonItem} ${activeModule === "equipment" ? styles.active : ""}`}
|
||||||
|
onClick={() => handleModuleClick("equipment")}
|
||||||
|
>设备设施管理
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
className={`${styles.TopButtonItem} ${activeModule === "firefighting" ? styles.active : ""}`}
|
||||||
|
onClick={() => handleModuleClick("firefighting")}
|
||||||
|
>建筑消防与器材管理
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
className={`${styles.TopButtonItem} ${activeModule === "other" ? styles.active : ""}`}
|
||||||
|
onClick={() => handleModuleClick("other")}
|
||||||
|
>其他管理
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<div className={styles.content}>
|
||||||
|
{renderModule()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SafeMajorHazardList;
|
||||||
@ -0,0 +1,66 @@
|
|||||||
|
.container {
|
||||||
|
background-color: transparent;
|
||||||
|
width: 100%;
|
||||||
|
height: 89vh;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.TopButton {
|
||||||
|
background-color: white;
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px 30px;
|
||||||
|
display: flex;
|
||||||
|
gap: 24px;
|
||||||
|
margin-left: 6px;
|
||||||
|
|
||||||
|
.TopButtonItem {
|
||||||
|
background-color: transparent !important;
|
||||||
|
color: #333333 !important;
|
||||||
|
font-family: 'PingFang SC', sans-serif !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
font-size: 14px !important;
|
||||||
|
line-height: 100% !important;
|
||||||
|
border-radius: 8px !important;
|
||||||
|
padding: 6px 10px !important;
|
||||||
|
height: auto !important;
|
||||||
|
border: none !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
position: relative !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #333333 !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
color: #2E4CD4 !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: #2E4CD4 !important;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -10px;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 4px;
|
||||||
|
background-color: #2E4CD4;
|
||||||
|
border-radius: 0;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
// ======== 内容区域样式 ========
|
||||||
|
flex: 1; // ======== 占据剩余空间 ========
|
||||||
|
overflow-y: auto; // ======== 允许垂直滚动 ========
|
||||||
|
padding: 0; // ======== 无内边距 ========
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,113 @@
|
|||||||
|
import { useEffect } from 'react'
|
||||||
|
import { Button, Col, Form, Input, Row } from 'antd'
|
||||||
|
import { UpOutlined, SearchOutlined, RedoOutlined } from '@ant-design/icons'
|
||||||
|
import SelectDeptTree from '@/components/SelectDeptTree'
|
||||||
|
import SelectOrganTree from '@/components/SelectOrganTree'
|
||||||
|
import style from '@/global.less'
|
||||||
|
|
||||||
|
const { Item: FormItem } = Form
|
||||||
|
let getDeptTreeBySelectTree
|
||||||
|
let getOrganTreeBySelectTree
|
||||||
|
|
||||||
|
const StaffSheetRenderAdvancedForm = (props) => {
|
||||||
|
const [form] = Form.useForm()
|
||||||
|
const { dispatch, handleSearch, handleFormReset, toggleForm, selectDeptTree, selectOrganTree, params } = props
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
form.setFieldsValue({
|
||||||
|
user_name: params?.user_name,
|
||||||
|
user_name_cn: params?.user_name_cn,
|
||||||
|
deptname: params?.deptname,
|
||||||
|
orgname: params?.orgname,
|
||||||
|
})
|
||||||
|
}, [params])
|
||||||
|
|
||||||
|
const onFinish = values => {
|
||||||
|
// if (getDeptTreeBySelectTree) {
|
||||||
|
// values.dept_code = getDeptTreeBySelectTree.dept_code
|
||||||
|
// values.deptname = getDeptTreeBySelectTree.title
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (getOrganTreeBySelectTree) {
|
||||||
|
values.org_code = getOrganTreeBySelectTree.org_code
|
||||||
|
values.orgname = getOrganTreeBySelectTree.title
|
||||||
|
}
|
||||||
|
|
||||||
|
handleSearch(values)
|
||||||
|
}
|
||||||
|
|
||||||
|
const myHandleFormReset = () => {
|
||||||
|
form.resetFields()
|
||||||
|
handleFormReset()
|
||||||
|
}
|
||||||
|
|
||||||
|
const selectedDeptTreeValue = (deptRecord) => {
|
||||||
|
getDeptTreeBySelectTree = deptRecord
|
||||||
|
}
|
||||||
|
|
||||||
|
const selectedOrganTreeValue = (orgRecord) => {
|
||||||
|
getOrganTreeBySelectTree = orgRecord
|
||||||
|
}
|
||||||
|
|
||||||
|
const parentDeptTreeMethod = {
|
||||||
|
dispatch: dispatch,
|
||||||
|
selectDeptTree: selectDeptTree,
|
||||||
|
selectedDeptTreeValue: selectedDeptTreeValue
|
||||||
|
}
|
||||||
|
|
||||||
|
const parentOrganTreeMethod = {
|
||||||
|
dispatch: dispatch,
|
||||||
|
selectOrganTree: selectOrganTree,
|
||||||
|
selectedOrganTreeValue: selectedOrganTreeValue
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Form form={form} onFinish={onFinish} layout='inline'>
|
||||||
|
<Row gutter={{ md: 8, lg: 24, xl: 48 }} className={style.searchInput}>
|
||||||
|
<Col md={8} sm={24}>
|
||||||
|
<FormItem label='用户名' name='user_name'>
|
||||||
|
<Input placeholder='请输入' />
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col md={8} sm={24}>
|
||||||
|
<FormItem label='用户名称' name='user_name_cn'>
|
||||||
|
<Input placeholder='请输入' />
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col md={8} sm={24}>
|
||||||
|
<FormItem label='机构代码' name='orgname'>
|
||||||
|
<SelectOrganTree {...parentOrganTreeMethod} />
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row gutter={{md: 8, lg: 24, xl: 48}} className={style.searchBox}>
|
||||||
|
{/*<Col md={8} sm={24}>*/}
|
||||||
|
{/* <FormItem label='部门名称' name='deptname'>*/}
|
||||||
|
{/* <SelectDeptTree placeholder={'请选择部门'} {...parentDeptTreeMethod} />*/}
|
||||||
|
{/* </FormItem>*/}
|
||||||
|
{/*</Col>*/}
|
||||||
|
|
||||||
|
<Col md={24} sm={24}>
|
||||||
|
<div className={style.searchBtn}>
|
||||||
|
<Button type='primary' htmlType='submit'>
|
||||||
|
查询
|
||||||
|
</Button>
|
||||||
|
|
||||||
|
<Button onClick={myHandleFormReset}>
|
||||||
|
重置
|
||||||
|
</Button>
|
||||||
|
|
||||||
|
<a onClick={() => toggleForm(form)}>
|
||||||
|
收起 <UpOutlined />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default StaffSheetRenderAdvancedForm
|
||||||
@ -0,0 +1,81 @@
|
|||||||
|
import { useEffect } from 'react'
|
||||||
|
import {Button, Col, Form, Input, Row, DatePicker, Select} from 'antd'
|
||||||
|
import {DownOutlined, RedoOutlined, SearchOutlined} from '@ant-design/icons'
|
||||||
|
import style from '@/global.less'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
const { Item: FormItem } = Form
|
||||||
|
|
||||||
|
const StaffSheetRenderSimpleForm = (props) => {
|
||||||
|
const [form] = Form.useForm()
|
||||||
|
const { handleSearch, handleFormReset, toggleForm, params } = props
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
form.setFieldsValue({
|
||||||
|
user_name: params?.user_name,
|
||||||
|
user_name_cn: params?.user_name_cn,
|
||||||
|
})
|
||||||
|
}, [params])
|
||||||
|
|
||||||
|
const onFinish = values => {
|
||||||
|
handleSearch(values)
|
||||||
|
}
|
||||||
|
|
||||||
|
const myHandleFormReset = () => {
|
||||||
|
form.resetFields()
|
||||||
|
handleFormReset()
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Form form={form} onFinish={onFinish} layout='inline'>
|
||||||
|
<Row gutter={{ md: 8, lg: 24, xl: 48 }} className={style.searchInput}>
|
||||||
|
<Col md={4} sm={24}>
|
||||||
|
<FormItem label='我的查询条件' name='wdcxtj'>
|
||||||
|
<Select
|
||||||
|
placeholder='请选择'
|
||||||
|
options={[]}
|
||||||
|
/>
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col md={4} sm={24}>
|
||||||
|
<FormItem label='日期' name='rq' rules={[{ required: true, message: '请选择日期!' }]}>
|
||||||
|
<DatePicker defaultValue={dayjs('2025-04-10', 'YYYY-MM-DD')} format='YYYY-MM-DD' />
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col md={4} sm={24}>
|
||||||
|
<FormItem label='工作地点' name='gzdd'>
|
||||||
|
<Input placeholder='请输入' />
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
|
||||||
|
<Col md={4} sm={24}>
|
||||||
|
<FormItem label='工号' name='gh'>
|
||||||
|
<Input placeholder='请输入' defaultValue="123456"/>
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col md={4} sm={24}>
|
||||||
|
<FormItem label='名称' name='gh'>
|
||||||
|
<Input placeholder='请输入'/>
|
||||||
|
</FormItem>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col md={4} sm={24}>
|
||||||
|
<div className={style.searchBtn}>
|
||||||
|
<Button type='primary' htmlType='submit'>
|
||||||
|
查询
|
||||||
|
</Button>
|
||||||
|
|
||||||
|
<Button onClick={myHandleFormReset}>
|
||||||
|
重置
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default StaffSheetRenderSimpleForm
|
||||||
@ -0,0 +1,319 @@
|
|||||||
|
import { deleteByPrimaryKeyForProUser, selectByPrimaryKeyForProUser, insertForProUser, updateForProUser, deleteByMapForProUser,updateByMapForProUser, getOneForProUser,getAllForProUser,queryPageForProUser, countForProUser, insertBatchForProUser, deleteBatchForProUser,updateBatchForProUser, resetPwdForProUser } from '@/services/system/api_prouser';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
namespace: 'safemajorhazard',
|
||||||
|
|
||||||
|
state: {
|
||||||
|
params: {},
|
||||||
|
data: {
|
||||||
|
list: [],
|
||||||
|
pagination: {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
effects: {
|
||||||
|
*delete_by_primarykey_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(deleteByPrimaryKeyForProUser, payload)
|
||||||
|
yield put({
|
||||||
|
type: 'deleteByPrimaryKeyForProUser',
|
||||||
|
payload: response
|
||||||
|
})
|
||||||
|
|
||||||
|
if (!response.success) {
|
||||||
|
callback && callback(response)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params)
|
||||||
|
const responseData = yield call(queryPageForProUser, params)
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responseData
|
||||||
|
})
|
||||||
|
|
||||||
|
if (callback) callback(response)
|
||||||
|
},
|
||||||
|
*select_by_primarykey_for_prouser({ payload, callback }, { call, put }) {
|
||||||
|
const response = yield call(selectByPrimaryKeyForProUser, payload)
|
||||||
|
yield put({
|
||||||
|
type: 'selectByPrimaryKeyForProUser',
|
||||||
|
payload: response
|
||||||
|
})
|
||||||
|
|
||||||
|
if (callback) callback(response)
|
||||||
|
},
|
||||||
|
*insert_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(insertForProUser, payload)
|
||||||
|
yield put({
|
||||||
|
type: 'insertForProUser',
|
||||||
|
payload: response
|
||||||
|
})
|
||||||
|
|
||||||
|
if (!response.success) {
|
||||||
|
callback && callback(response)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params)
|
||||||
|
const responseData = yield call(queryPageForProUser, params)
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responseData
|
||||||
|
})
|
||||||
|
|
||||||
|
if (callback) callback(response)
|
||||||
|
},
|
||||||
|
*update_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(updateForProUser, payload)
|
||||||
|
yield put({
|
||||||
|
type: 'updateForProUser',
|
||||||
|
payload: response
|
||||||
|
})
|
||||||
|
|
||||||
|
if (!response.success) {
|
||||||
|
callback && callback(response)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params)
|
||||||
|
const responseData = yield call(queryPageForProUser, params)
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responseData
|
||||||
|
})
|
||||||
|
|
||||||
|
if (callback) callback(response)
|
||||||
|
},
|
||||||
|
*delete_by_map_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(deleteByMapForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'deleteByMapForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const responsedata = yield call(queryPageForProUser, params);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responsedata,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*update_by_map_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(updateByMapForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'updateByMapForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const responsedata = yield call(queryPageForProUser, params);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responsedata,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*get_one_for_prouser({ payload, callback }, { call, put }) {
|
||||||
|
const response = yield call(getOneForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'getOneForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*get_all_for_prouser({ payload, callback }, { call, put }) {
|
||||||
|
const response = yield call(getAllForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'getAllForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*query_page_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const newParams = payload?.resetFlag ? payload : {...params, ...payload};
|
||||||
|
yield put({
|
||||||
|
type: 'setQueryPageByParams',
|
||||||
|
payload: newParams,
|
||||||
|
});
|
||||||
|
const response = yield call(queryPageForProUser, newParams);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*count_for_prouser({ payload, callback }, { call, put }) {
|
||||||
|
const response = yield call(countForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'countForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*insert_batch_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(insertBatchForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'insertBatchForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const responsedata = yield call(queryPageForProUser, params);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responsedata,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*delete_batch_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(deleteBatchForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'deleteBatchForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const responsedata = yield call(queryPageForProUser, params);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responsedata,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*update_batch_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(updateBatchForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'updateBatchForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const responsedata = yield call(queryPageForProUser, params);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responsedata,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
*resetpwd_for_prouser({ payload, callback }, { select, call, put }) {
|
||||||
|
const response = yield call(resetPwdForProUser, payload);
|
||||||
|
yield put({
|
||||||
|
type: 'resetPwdForProUser',
|
||||||
|
payload: response,
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = yield select(state => state.prouser.params);
|
||||||
|
const responsedata = yield call(queryPageForProUser, params);
|
||||||
|
yield put({
|
||||||
|
type: 'queryPageForProUser',
|
||||||
|
payload: responsedata,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (callback) callback(response);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
reducers: {
|
||||||
|
setQueryPageByParams(state, { payload }) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
params: {...payload},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
deleteByPrimaryKeyForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
selectByPrimaryKeyForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
insertForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
updateForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
deleteByMapForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
updateByMapForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
getOneForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
getAllForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
queryPageForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
countForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
insertBatchForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
deleteBatchForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
updateBatchForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
resetPwdForProUser(state, action) {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
data: action.payload,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
@ -0,0 +1,115 @@
|
|||||||
|
.evaluation-report {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
.ant-card {
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
.ant-card-head {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.ant-card-head-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-card-body {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table {
|
||||||
|
.ant-table-thead > tr > th {
|
||||||
|
background-color: #fafafa;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr > td {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr:hover > td {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-btn {
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
&.ant-btn-primary {
|
||||||
|
background-color: #1890ff;
|
||||||
|
border-color: #1890ff;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #40a9ff;
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.ant-btn-link {
|
||||||
|
padding: 4px 8px;
|
||||||
|
height: auto;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tag {
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 2px 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-modal {
|
||||||
|
.ant-modal-header {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.ant-modal-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-modal-body {
|
||||||
|
padding: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-form-item-label > label {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-input,
|
||||||
|
.ant-select-selector {
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus,
|
||||||
|
&.ant-select-focused .ant-select-selector {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-pagination {
|
||||||
|
margin-top: 16px;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.ant-pagination-total-text {
|
||||||
|
color: #8c8c8c;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,157 @@
|
|||||||
|
.online-monitoring {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
.ant-card {
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
.ant-card-head {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.ant-card-head-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-card-body {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table {
|
||||||
|
.ant-table-thead > tr > th {
|
||||||
|
background-color: #fafafa;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr > td {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr:hover > td {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-btn {
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
&.ant-btn-primary {
|
||||||
|
background-color: #1890ff;
|
||||||
|
border-color: #1890ff;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #40a9ff;
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.ant-btn-link {
|
||||||
|
padding: 4px 8px;
|
||||||
|
height: auto;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-badge {
|
||||||
|
.ant-badge-status-dot {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-badge-status-text {
|
||||||
|
margin-left: 8px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-modal {
|
||||||
|
.ant-modal-header {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.ant-modal-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-modal-body {
|
||||||
|
padding: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-form-item-label > label {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-input,
|
||||||
|
.ant-select-selector {
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus,
|
||||||
|
&.ant-select-focused .ant-select-selector {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-pagination {
|
||||||
|
margin-top: 16px;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.ant-pagination-total-text {
|
||||||
|
color: #8c8c8c;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 状态指示器样式
|
||||||
|
.status-indicator {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
|
||||||
|
&.online {
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.offline {
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 数值显示样式
|
||||||
|
.value-display {
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&.normal {
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.warning {
|
||||||
|
color: #faad14;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.danger {
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.unknown {
|
||||||
|
color: #8c8c8c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,413 @@
|
|||||||
|
.containerR {
|
||||||
|
padding: 8px 6px;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.warningBox {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #FFF3CD;
|
||||||
|
border: 1px solid #F4E3AE;
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 8px 20px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
.warningIcon {
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warningText {
|
||||||
|
color: #8C6C0B;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerOne {
|
||||||
|
height: 40%;
|
||||||
|
flex-shrink: 0;
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
gap: 10px;
|
||||||
|
|
||||||
|
.containerOneLeft{
|
||||||
|
background-color: white;
|
||||||
|
width: calc(50% - 5px);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 15px;
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
.leftTopSection {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
|
||||||
|
.titleLeft {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333333;
|
||||||
|
|
||||||
|
.titleIcon {
|
||||||
|
width: 3px;
|
||||||
|
height: 16px;
|
||||||
|
background-color: #2E4CD4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.buttonGroup {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
|
||||||
|
.actionBtn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
border: 1px solid #DFE4F6;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #2E4CD4;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 4px 8px;
|
||||||
|
background: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #F0F2FF;
|
||||||
|
border-color: #2E4CD4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btnIcon {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.leftBottomSection {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background-color: #fafafa;
|
||||||
|
border: 1px dashed #d9d9d9;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
.imagePlaceholder {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
.imageIcon {
|
||||||
|
font-size: 32px;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imageText {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerOneRight{
|
||||||
|
background-color: white;
|
||||||
|
width: calc(50% - 5px);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 15px;
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
.rightTopSection {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
|
||||||
|
.rightTopLeft {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.titleLeft {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333333;
|
||||||
|
|
||||||
|
.titleIcon {
|
||||||
|
width: 3px;
|
||||||
|
height: 16px;
|
||||||
|
background-color: #2E4CD4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightTopRight {
|
||||||
|
.exportBtn {
|
||||||
|
background-color: #2E4CD4 !important;
|
||||||
|
border-color: #2E4CD4 !important;
|
||||||
|
color: #fff !important;
|
||||||
|
font-size: 14px !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
height: 32px;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #1e3bb8 !important;
|
||||||
|
border-color: #1e3bb8 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightBottomSection {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.imagePlaceholder {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
border: 2px dashed #d9d9d9;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
.imageIcon {
|
||||||
|
font-size: 48px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imageText {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.containerTwo{
|
||||||
|
flex: 1;
|
||||||
|
background-color: white;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 15px;
|
||||||
|
border: 1px solid #f0f0f0;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
.containerTwoTitle {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
|
||||||
|
.titleLeft {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333333;
|
||||||
|
|
||||||
|
.titleIcon {
|
||||||
|
width: 3px;
|
||||||
|
height: 16px;
|
||||||
|
background-color: #2E4CD4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerTwoActions {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
|
||||||
|
.searchSection {
|
||||||
|
flex: 1;
|
||||||
|
max-width: 300px;
|
||||||
|
|
||||||
|
:global(.ant-input) {
|
||||||
|
height: 32px;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
border-color: #2E4CD4;
|
||||||
|
box-shadow: 0 0 0 2px rgba(46, 76, 212, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.buttonSection {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
|
||||||
|
:global(.ant-btn) {
|
||||||
|
height: 32px;
|
||||||
|
padding: 0 16px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 14px;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #333;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: #2E4CD4;
|
||||||
|
color: #2E4CD4;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
border-color: #2E4CD4;
|
||||||
|
color: #2E4CD4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerTwoTable {
|
||||||
|
flex: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
:global(.ant-table) {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.ant-table-thead > tr > th) {
|
||||||
|
background-color: #f5f5fa;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333333;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
padding: 8px 12px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.ant-table-tbody > tr > td) {
|
||||||
|
padding: 8px 12px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.ant-table-tbody > tr:hover > td) {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.ant-pagination) {
|
||||||
|
margin-top: 16px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.rightTopSelect{
|
||||||
|
// 下拉框本身的样式
|
||||||
|
:global(.ant-select-selector) {
|
||||||
|
background-color: #f8f9fa !important;
|
||||||
|
border: 1px solid #d9d9d9 !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
height: 32px !important;
|
||||||
|
min-height: 32px !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: #2E4CD4 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
border-color: #2E4CD4 !important;
|
||||||
|
box-shadow: 0 0 0 2px rgba(46, 76, 212, 0.2) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 下拉框内的文字样式
|
||||||
|
:global(.ant-select-selection-item) {
|
||||||
|
color: #333333 !important;
|
||||||
|
font-size: 14px !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
line-height: 30px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 下拉箭头样式
|
||||||
|
:global(.ant-select-arrow) {
|
||||||
|
color: #666666 !important;
|
||||||
|
font-size: 12px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 下拉菜单容器样式
|
||||||
|
:global(.ant-select-dropdown) {
|
||||||
|
background-color: #ffffff !important;
|
||||||
|
border: 1px solid #e8e8e8 !important;
|
||||||
|
border-radius: 8px !important;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
|
||||||
|
padding: 4px 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 下拉选项样式
|
||||||
|
:global(.ant-select-item) {
|
||||||
|
color: #333333 !important;
|
||||||
|
font-size: 14px !important;
|
||||||
|
padding: 8px 12px !important;
|
||||||
|
border-radius: 4px !important;
|
||||||
|
margin: 2px 8px !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #f0f2ff !important;
|
||||||
|
color: #2E4CD4 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.ant-select-item-option-selected {
|
||||||
|
background-color: #e6f7ff !important;
|
||||||
|
color: #2E4CD4 !important;
|
||||||
|
font-weight: 600 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选中状态的样式
|
||||||
|
:global(.ant-select-focused .ant-select-selector) {
|
||||||
|
border-color: #2E4CD4 !important;
|
||||||
|
box-shadow: 0 0 0 2px rgba(46, 76, 212, 0.2) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 自定义选项样式
|
||||||
|
.customOption {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 4px 0;
|
||||||
|
|
||||||
|
.optionIcon {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #2E4CD4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.optionText {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333333;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,241 @@
|
|||||||
|
.risk-assessment {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
.ant-card {
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
.ant-card-head {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.ant-card-head-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-card-body {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table {
|
||||||
|
.ant-table-thead > tr > th {
|
||||||
|
background-color: #fafafa;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr > td {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr:hover > td {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-btn {
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
&.ant-btn-primary {
|
||||||
|
background-color: #1890ff;
|
||||||
|
border-color: #1890ff;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #40a9ff;
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.ant-btn-link {
|
||||||
|
padding: 4px 8px;
|
||||||
|
height: auto;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tag {
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 2px 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-rate {
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
.ant-rate-star {
|
||||||
|
margin-right: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-progress {
|
||||||
|
.ant-progress-bg {
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.ant-progress-small {
|
||||||
|
.ant-progress-text {
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-modal {
|
||||||
|
.ant-modal-header {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
.ant-modal-title {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-modal-body {
|
||||||
|
padding: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-form-item-label > label {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-input,
|
||||||
|
.ant-select-selector {
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus,
|
||||||
|
&.ant-select-focused .ant-select-selector {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-pagination {
|
||||||
|
margin-top: 16px;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.ant-pagination-total-text {
|
||||||
|
color: #8c8c8c;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 风险等级颜色
|
||||||
|
.risk-level-high {
|
||||||
|
color: #ff4d4f;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.risk-level-medium {
|
||||||
|
color: #faad14;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.risk-level-low {
|
||||||
|
color: #52c41a;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 状态指示器
|
||||||
|
.status-indicator {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
|
||||||
|
&.processed {
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.pending {
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.monitoring {
|
||||||
|
color: #1890ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 评分显示
|
||||||
|
.score-display {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
|
||||||
|
.score-value {
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8c8c8c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 概率和影响程度显示
|
||||||
|
.rate-display {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
|
||||||
|
.rate-stars {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rate-text {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8c8c8c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 风险矩阵样式
|
||||||
|
.risk-matrix {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(5, 1fr);
|
||||||
|
gap: 8px;
|
||||||
|
margin: 16px 0;
|
||||||
|
|
||||||
|
.matrix-cell {
|
||||||
|
padding: 8px;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
&.high-risk {
|
||||||
|
background-color: #fff2f0;
|
||||||
|
border-color: #ff4d4f;
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.medium-risk {
|
||||||
|
background-color: #fffbe6;
|
||||||
|
border-color: #faad14;
|
||||||
|
color: #faad14;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.low-risk {
|
||||||
|
background-color: #f6ffed;
|
||||||
|
border-color: #52c41a;
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue