feat: 完成接口联调

develop
JINGYJ 1 year ago
parent 5214210ad6
commit cb3a0b109d

@ -11,7 +11,7 @@ const { REACT_APP_ENV,
FILE_SERVER_HOST,
WEBRTC_SERVER_HOST
} = process.env;
console.log(REACT_APP_ENV)
console.log(REACT_APP_ENV, 'REACT_APP_ENV')
export default defineConfig({
/**
* @name hash

@ -34,7 +34,7 @@ export default {
},
'/api/': {
// 要代理的地址
target: 'http://192.168.10.21:8000/',
target: 'http://192.168.10.31:8000/',
// target: 'https://www.baidu.com',
// 配置了这个可以从 http 代理到 https
// 依赖 origin 的功能可能需要这个,比如 cookie
@ -69,5 +69,5 @@ export default {
changeOrigin: true,
pathRewrite: { '^': '' },
},
},
}
};

@ -16,88 +16,6 @@ const getMenus = (req: Request, res: Response) => {
"title": "首页",
"routes": []
},
// {
// "path": "/device",
// "key": "",
// "name": "device",
// "icon": "DesktopOutlined",
// "access": "",
// "component": "",
// "title": "设备管理",
// "routes": [
// {
// "path": "/device/device-list",
// "key": "12",
// "name": "device-list",
// "icon": "",
// "access": "",
// "component": "Device/DeviceList",
// "title": "设备列表",
// "routes": []
// },
// {
// "path": "/device/device-category-list",
// "key": "13",
// "name": "device-category-list",
// "icon": "",
// "access": "",
// "component": "Device/DeviceCategoryList",
// "title": "设备类别",
// "routes": []
// },
// {
// "path": "/device/device-group-list",
// "key": "14",
// "name": "device-group-list",
// "icon": "",
// "access": "",
// "component": "Device/DeviceGroupList",
// "title": "设备组",
// "routes": []
// }
// ]
// },
// {
// "path": "/alarm",
// "key": "",
// "name": "alarm",
// "icon": "WarningOutlined",
// "access": "",
// "component": "",
// "title": "告警管理",
// "routes": [
// {
// "path": "/alarm/alarm-list",
// "key": "50",
// "name": "alarm-list",
// "icon": "",
// "access": "",
// "component": "Alarm/AlarmList",
// "title": "告警列表",
// "routes": []
// },
// {
// "path": "/alarm/alarm-setting",
// "key": "51",
// "name": "alarm-setting",
// "icon": "",
// "access": "",
// "component": "Alarm/AlarmSetting",
// "title": "告警设置",
// "routes": []
// },
// {
// "path": "/alarm/alarm-ways",
// "key": "55",
// "name": "alarm-ways",
// "icon": "",
// "access": "",
// "component": "Alarm/AlarmWays",
// "title": "告警方式",
// "routes": []
// }
// ]
// },
{
"path": "/alarm/alarm-list",
"key": "",

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 7.7 KiB

@ -45,7 +45,56 @@ export async function getInitialState(): Promise<{
const { location } = history;
if (location.pathname !== loginPath && localStorage.getItem('access')) {
const currentUser = await fetchUserInfo();
const menus = await postMenuGetMenu();
// const menus = await postMenuGetMenu();
const menus = {
code: 0,
success: true,
data: {
routes: [
{
"path": "/welcome",
"key": "",
"name": "welcome",
"icon": "HomeOutlined",
"access": "",
"component": "Welcome",
"title": "首页",
"routes": []
},
{
"path": "/alarm/alarm-list",
"key": "",
"name": "alarm-list",
"icon": "WarningOutlined",
"access": "",
"component": "Hidden",
"title": "告警列表",
"routes": []
},
{
"path": "alarm_rules",
"key": "",
"name": "alarm_rules",
"icon": "OrderedListOutlined",
"access": "",
"component": "Hidden",
"title": "告警规则",
"routes": []
},
{
"path": "interfaceManage",
"key": "",
"name": "interfaceManage",
"icon": "BranchesOutlined",
"access": "",
"component": "Hidden",
"title": "接口管理",
"routes": []
}
]
},
msg: "获取成功"
}
if (getLocale() === 'zh-CN') {
let localData = getAllRouteNameTile(menus.data.routes, '');
let localRes: any = {};

@ -26,7 +26,7 @@ export const AvatarDropdown: React.FC<GlobalHeaderRightProps> = ({ menu, childre
* 退 url
*/
const loginOut = async () => {
await postJwtJsonInBlacklist()
// await postJwtJsonInBlacklist()
// await UserLogOut();
localStorage.removeItem('access')
const { search, pathname } = window.location;

@ -14,10 +14,10 @@ export const alarmRulesEnums: Record<string, any>[] = [
label: '敏感时间段告警',
key: '3',
},
{
label: '已忽略',
key: '4',
},
// {
// label: '已忽略',
// key: '4',
// },
];
// 分布式设备状态

@ -53,8 +53,16 @@ export const alarm_rules: { [key: string]: string } = {
'alarm_rules.page.status': '规则状态',
'alarm_rules.page.updateTime': '修改时间',
'alarm_rules.page.form.title': '编辑单人徘徊告警',
'alarm_rules.page.form.isEnabled': '启用单人徘徊告警',
'alarm_rules.page.form.multiTitle': '编辑多人聚集告警',
'alarm_rules.page.form.timeTitle': '编辑敏感时间告警',
'alarm_rules.page.form.isEnabled': '启用告警',
'alarm_rules.page.form.name': '告警名称',
'alarm_rules.page.form.triggerConditions': '触发条件',
'alarm_rules.page.rule.required.name': '请填写告警名称'
'alarm_rules.page.form.trigger_start_time': '敏感开始时间',
'alarm_rules.page.rule.required.name': '请填写告警名称',
'alarm_rules.page.rule.required.trigger_start_time': '请填写时间',
'alarm_rules.page.rule.required.person_number': '请填写人数',
'alarm_rules.page.rule.required.time_interval': '请填写时间',
'alarm_rules.page.rule.required.appear_number': '请填写次数'
}

@ -77,6 +77,8 @@ export const interface_manage: { [key: string]: string } = {
'device.interface_manage.table.list.createTime': '创建时间',
'device.interface_manage.table.list.remark': '备注',
'device.interface_manage.table.list.add': '新建设备/输入源',
'device.interface_manage.table.list.addPic': '新建图像获取接口',
'device.interface_manage.table.list.updatePic': '编辑图像获取接口',
'device.interface_manage.table.rule.required.name': '接口名称为必填项',
'device.interface_manage.table.rule.required.address': '接口地址为必填项',
};

@ -6,12 +6,18 @@
margin-right: 32px;
width: 120px;
// height: 600px;
.alarmImgLeftBox {
.alarmImgLeftBox{
width: 112px;
height: 112px;
// border-radius: 4px;
border-radius: 4px;
// background: skyblue;
}
.alarmImgLeftBoxActive {
width: 112px;
height: 112px;
border-radius: 4px;
border: 1.5px solid #081FA8;
}
.shadowBox {
position: absolute;
left: 0;

@ -3,7 +3,7 @@ import { postDeviceGroupGetDeviceGroupFkSelect } from '@/services/device/DeviceG
import { ModalForm, ProForm, ProFormFieldSet, ProFormSelect, ProFormSwitch, ProFormText } from '@ant-design/pro-components';
import { FormattedMessage, useIntl } from '@umijs/max';
import { Form, message,Image } from 'antd';
import React from 'react';
import React, { useEffect, useState } from 'react';
import {
proFormSmallItemStyleProps,
proFormSmallModelWidth,
@ -11,7 +11,7 @@ import {
import { postIgnoringvents } from '@/services/alarm/Alarmlist';
// Import Swiper React components
import { Swiper, SwiperSlide } from 'swiper/react';
import { Navigation, Pagination } from 'swiper/modules';
import { Navigation, Pagination, Mousewheel } from 'swiper/modules';
// Import Swiper styles
import 'swiper/css';
import 'swiper/css/navigation';
@ -35,7 +35,11 @@ export type UpdateFormProps = {
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
const intl = useIntl();
const [form] = Form.useForm<API.AlarmDetailsParams>();
const [isActive, setIsActive] = useState(0);
const [imageSrc, setImageSrc] = useState('');
useEffect(() => {
setImageSrc(props?.values?.picture_path?.[0])
}, [props.updateModalOpen])
return (
<ModalForm<any>
width={832}
@ -62,20 +66,20 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
}}
submitTimeout={2000}
onFinish={async (values) => {
// values.is_ignore = true
// values.person_id = props.values.person_id
console.log(values);
// postIgnoringvents(values)
// .then(() => {
// message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
values.is_ignore = true
values.person_id = props.values.person_id
// console.log(values);
postIgnoringvents(values)
.then(() => {
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
props.reload();
// })
// .catch(() => {
// message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
// });
})
.catch(() => {
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
});
// props.handleModal();
// return true;
props.handleModal();
return true;
}}
>
{/* <ProForm.Group> */}
@ -89,20 +93,48 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
slidesPerView={5}
spaceBetween={20}
direction='vertical'
mousewheel={true}
modules={[Mousewheel]}
onSlideChange={() => {
console.log(111);
}}
// pagination={{
// clickable: true,
// }}
// modules={[Pagination]}
>
<SwiperSlide>
<div className={styles.alarmImgLeftBox}>
<Image
preview={false}
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
{ Array.isArray(props?.values?.picture_path) && props?.values?.picture_path.length && props?.values?.picture_path.map((item: any, index: any) => {
return (<SwiperSlide key={index} virtualIndex={index} onClick={() => {
console.log(index);
setIsActive(index)
setImageSrc(item)
}}>
<div className={ styles.alarmImgLeftBox }>
<Image
style={{
width: 112,
height: 112,
borderRadius: 4
}}
className={ index === isActive ? styles.alarmImgLeftBoxActive : '' }
preview={false}
src={item}
/>
</div>
</SwiperSlide>
<SwiperSlide>
</div>
</SwiperSlide>)
})}
{/* {props?.values?.picture_path.length && props?.values?.picture_path.map((slideContent:any, index:any) => (
return (<SwiperSlide key={slideContent} virtualIndex={index}>
<div className={styles.alarmImgLeftBox}>
<Image
preview={false}
src={slideContent}
/>
</div>
</SwiperSlide>)
))} */}
{/* <SwiperSlide>
<div className={styles.alarmImgLeftBox}>
<Image
preview={false}
@ -149,7 +181,7 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
/>
</div>
</SwiperSlide>
</SwiperSlide> */}
</Swiper>
<div className={styles.shadowBox}></div>
</div>
@ -159,7 +191,7 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
width={640}
height={640}
preview={false}
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
src={imageSrc}
/>
</div>
<div className={styles.alarmDetails}>

@ -55,7 +55,9 @@ const AlarmList: React.FC = () => {
// const intl = useIntl();
const actionRef = useRef<ActionType>();
// 动态设置每页数量
const [currentPageSize, setCurrentPageSize] = useState<number>(8);
const [currentPageSize, setCurrentPageSize] = useState<number>(10);
const [currentPage, setCurrentPage] = useState<number>(1);
const [total, setTotal] = useState<number>(0);
const [activeTabIndex, setActiveTabIndex] = useState<number>(0);
const [dataTestList, setdataTestList] = useState<any>([]);
@ -65,6 +67,7 @@ const AlarmList: React.FC = () => {
const changeProjectTab = (key: string) => {
setTab(key);
console.log(key);
// eslint-disable-next-line @typescript-eslint/no-use-before-define
initList(key)
};
const getTabs = () => {
@ -158,7 +161,7 @@ const AlarmList: React.FC = () => {
<Image
width={96}
preview={false}
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
src={record.picture_path[0]}
/>
<div
style={{
@ -207,19 +210,23 @@ const AlarmList: React.FC = () => {
};
});
}
setdataTestList(() => [...finalList]);
}
// 初始化加载
async function initList(tabId:string = tab) {
const reqParams = {
// page: current,
page: currentPage,
pageSize: currentPageSize,
// desc: false,
warning_type: tabId,
// ...rest,
};
const resp = await postAlarmList({ ...reqParams });
// console.log(resp,'resp');
// setCurrentPageSize(resp?.data?.count)
setTotal(resp?.data?.count)
initDataTestList(resp?.data?.results);
// request={async (params = {}, sort) => {
// const { current, ...rest } = params;
@ -253,7 +260,10 @@ const AlarmList: React.FC = () => {
getTabs();
initList();
}, []);
useEffect(() => {
// 模拟异步请求数据
initList();
}, [currentPage, currentPageSize]);
return (
<PageContainer
// title={false}
@ -272,7 +282,7 @@ const AlarmList: React.FC = () => {
>
<ProCard
className="gn"
bodyStyle={{ padding: 0, margin: 0 }}
bodyStyle={{ padding: 10, margin: 0 }}
style={{ padding: 0, margin: 0 }}
>
<Tabs
@ -291,6 +301,7 @@ const AlarmList: React.FC = () => {
style: {
width: '100%',
border: 0,
// minHeight: 700
// padding: 0, margin: 0
},
}}
@ -329,12 +340,19 @@ const AlarmList: React.FC = () => {
}}
pagination={{
...proTablePaginationOptions,
total: total,
current: currentPage,
pageSize: currentPageSize,
onChange: (page, pageSize) => setCurrentPageSize(pageSize),
showSizeChanger: true,
onChange: (page, pageSize) => {
console.log(page, pageSize);
setCurrentPage(page)
setCurrentPageSize(pageSize)
},
}}
showActions="hover"
rowSelection={false}
grid={{ gutter: 16, xs: 1, md: 2, lg: 2, xl: 4, xxl: 3 }}
grid={{ gutter: 16, xs: 1, md: 2, lg: 2, xl: 3, xxl: 3 }}
metas={{
type: {
// 不展示在筛选项
@ -401,7 +419,7 @@ const AlarmList: React.FC = () => {
updateModalOpen={updateModalOpen}
values={currentRow || {}}
handleModal={handleUpdateModal}
reload={actionRef.current?.reload}
reload={initList}
/>
</PageContainer>
);

@ -32,8 +32,8 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
<ModalForm<any>
width={proFormSmallModelWidth}
title={intl.formatMessage({
id: 'alarm_rules.page.form.title1',
defaultMessage: `编辑${props.values.warning_name}`,
id: 'alarm_rules.page.form.title',
defaultMessage: `$$$`,
})}
open={props.updateModalOpen}
form={form}
@ -43,11 +43,6 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
onCancel: () => props.handleModal(),
}}
submitTimeout={2000}
initialValues={{
list: [props.values.time_period,
props.values.time_interval,
props.values.appear_number],
}}
onFinish={async (values) => {
values.id = props.values.id
values.is_use = values.is_use ? 1 : 0
@ -66,21 +61,6 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
}}
>
<ProForm.Group>
{/* <ProFormText
width={proFormSmallItemStyleProps.width}
name="name"
label={<FormattedMessage id="alarm_rules.page.form.enabled" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.enabled',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.enabled}
disabled={false}
/> */}
<ProFormSwitch
width={proFormSmallItemStyleProps.column2Width}
name="is_use"
@ -121,159 +101,96 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
},
]}
/>
<ProFormFieldSet
name="list"
label="触发条件"
type='space'
transform={(value: any) => ({
// list: value,
// startTime: value[0],
// endTime: value[1],
time_period: value[0],
time_interval: value[1],
appear_number: value[2],
})}
className={styles}
>
<ProFormText
width={100}
name="time_period"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.time_period}
disabled={false}
/>
<ProFormText
width={100}
name="time_interval"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.time_interval}
disabled={false}
/>
<ProFormText
width={100}
name="appear_number"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.appear_number}
disabled={false}
/>
</ProFormFieldSet>
{/* { multipleStatus &&
<ProFormFieldSet
name="list"
label="触发条件"
type='space'
transform={(value: any) => ({
// list: value,
// startTime: value[0],
// endTime: value[1],
time_period: value[0],
time_interval: value[1],
appear_number: value[2],
})}
className={styles}
>
<ProFormText
width={100}
name="person_number"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.person_number}
disabled={false}
/>
<ProFormText
width={100}
name="time_interval"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.time_interval}
disabled={false}
/>
</ProFormFieldSet>}
{ timeStatus &&
<ProFormFieldSet
name="list"
label="触发条件"
type='space'
transform={(value: any) => ({
// list: value,
// startTime: value[0],
// endTime: value[1],
time_period: value[0],
time_interval: value[1],
appear_number: value[2],
})}
className={styles}
>
<ProFormText
width={100}
name="trigger_start_time"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.trigger_start_time}
disabled={false}
/>
<ProFormText
width={100}
name="trigger_end_time"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.trigger_end_time}
disabled={false}
/>
</ProFormFieldSet>} */}
<div></div>
<div style={{
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',
alignItems: 'baseline'
}}>
<span style={{ marginRight: 6 }}></span>
<ProFormText
width={100}
name="time_period"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={true}
initialValue={props.values.time_period}
disabled={false}
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.time_interval"
defaultMessage="name is required"
/>
),
},
]}
/>
<span style={{ margin: '0 6px' }}></span>
<ProFormText
width={100}
name="time_interval"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={true}
initialValue={props.values.time_interval}
disabled={false}
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.time_interval"
defaultMessage="name is required"
/>
),
},
]}
/>
<span style={{ marginRight: 6 }}></span>
<ProFormText
width={100}
name="appear_number"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={true}
initialValue={props.values.appear_number}
disabled={false}
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.appear_number"
defaultMessage="name is required"
/>
),
},
]}
/>
<span style={{ marginLeft: 6 }}></span>
</div>
</ProForm.Group>
</ModalForm>
);

@ -32,7 +32,7 @@ const UpdateMultiForm: React.FC<UpdateFormProps> = (props) => {
<ModalForm<any>
width={proFormSmallModelWidth}
title={intl.formatMessage({
id: 'alarm_rules.page.form.title1',
id: 'alarm_rules.page.form.multiTitle',
defaultMessage: `编辑${props.values.warning_name}`,
})}
open={props.updateModalOpen}
@ -43,10 +43,6 @@ const UpdateMultiForm: React.FC<UpdateFormProps> = (props) => {
onCancel: () => props.handleModal(),
}}
submitTimeout={2000}
initialValues={{
list: [props.values.person_number,
props.values.time_interval],
}}
onFinish={async (values) => {
values.id = props.values.id
values.is_use = values.is_use ? 1 : 0
@ -120,50 +116,69 @@ const UpdateMultiForm: React.FC<UpdateFormProps> = (props) => {
},
]}
/>
<ProFormFieldSet
name="list"
label="触发条件"
type='space'
transform={(value: any) => ({
// list: value,
// startTime: value[0],
// endTime: value[1],
person_number: value[0],
time_interval: value[1]
})}
className={styles}
>
<ProFormText
width={100}
name="person_number"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.person_number}
disabled={false}
/>
<ProFormText
width={100}
name="time_interval"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.time_interval}
disabled={false}
/>
</ProFormFieldSet>
<div></div>
<div style={{
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',
alignItems: 'baseline'
}}>
<span style={{ marginRight: 6 }}></span>
<ProFormText
width={100}
name="person_number"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={true}
initialValue={props.values.person_number}
disabled={false}
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.person_number"
defaultMessage="name is required"
/>
),
},
]}
/>
<span style={{ margin: '0 6px' }}></span>
<ProFormText
width={100}
name="time_interval"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.time_interval',
defaultMessage: '$$$',
})}`}
required={true}
initialValue={props.values.time_interval}
disabled={false}
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.time_interval"
defaultMessage="name is required"
/>
),
},
]}
/>
<span style={{ marginLeft: 6 }}></span>
</div>
{/* { timeStatus &&
<ProFormFieldSet
name="list"

@ -1,7 +1,7 @@
import { putDeviceCategoryUpdateDeviceCategory } from '@/services/device/DeviceCategory';
import { postDeviceGroupGetDeviceGroupFkSelect } from '@/services/device/DeviceGroup';
import { postAlarmRules } from '@/services/alarm/AlarmRules';
import { ModalForm, ProForm, ProFormFieldSet, ProFormSelect, ProFormSwitch, ProFormText } from '@ant-design/pro-components';
import { ModalForm, ProForm, ProFormFieldSet, ProFormSelect, ProFormSwitch, ProFormText, ProFormTimePicker } from '@ant-design/pro-components';
import { FormattedMessage, useIntl } from '@umijs/max';
import { Form, message } from 'antd';
import React, { useState } from 'react';
@ -32,7 +32,7 @@ const UpdateTimeForm: React.FC<UpdateFormProps> = (props) => {
<ModalForm<any>
width={proFormSmallModelWidth}
title={intl.formatMessage({
id: 'alarm_rules.page.form.title1',
id: 'alarm_rules.page.form.timeTitle',
defaultMessage: `编辑${props.values.warning_name}`,
})}
open={props.updateModalOpen}
@ -43,10 +43,6 @@ const UpdateTimeForm: React.FC<UpdateFormProps> = (props) => {
onCancel: () => props.handleModal(),
}}
submitTimeout={2000}
initialValues={{
list: [props.values.trigger_start_time,
props.values.trigger_end_time],
}}
onFinish={async (values) => {
values.id = props.values.id
values.is_use = values.is_use ? 1 : 0
@ -120,50 +116,104 @@ const UpdateTimeForm: React.FC<UpdateFormProps> = (props) => {
},
]}
/>
<ProFormFieldSet
name="list"
label="触发条件"
type='space'
transform={(value: any) => ({
// list: value,
// startTime: value[0],
// endTime: value[1],
trigger_start_time: value[0],
trigger_end_time: value[1]
})}
className={styles}
>
<ProFormText
width={100}
name="trigger_start_time"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
<div style={{
marginBottom: 6
}}></div>
<div style={{
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'flex-start',
alignItems: 'baseline'
}}>
<ProFormTimePicker
style={{
padding: '0 6px'
}}
width={100}
name="trigger_start_time"
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
id: 'alarm_rules.page.form.trigger_start_time',
defaultMessage: '$$$',
})}`}
required={false}
required={true}
initialValue={props.values.trigger_start_time}
disabled={false}
/>
<ProFormText
width={100}
name="trigger_end_time"
label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.trigger_end_time}
disabled={false}
/>
</ProFormFieldSet>
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.trigger_start_time"
defaultMessage="name is required"
/>
),
},
]}
/>
{/* <ProFormText
width={100}
name="trigger_start_time"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.trigger_start_time}
disabled={false}
/> */}
<ProFormTimePicker
width={100}
name="trigger_end_time"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={true}
initialValue={props.values.trigger_end_time}
disabled={false}
rules={[
{
required: true,
message: (
<FormattedMessage
id="alarm_rules.page.rule.required.trigger_start_time"
defaultMessage="name is required"
/>
),
},
]}
/>
{/* <ProFormText
width={100}
name="trigger_end_time"
// label={<FormattedMessage id="alarm_rules.page.form.triggerConditions" defaultMessage="$$$" />}
placeholder={`${intl.formatMessage({
id: 'common.please_input',
defaultMessage: '$$$',
})}${intl.formatMessage({
id: 'alarm_rules.page.form.triggerConditions',
defaultMessage: '$$$',
})}`}
required={false}
initialValue={props.values.trigger_end_time}
disabled={false}
/> */}
{/* <span style={{ marginLeft: 6 }}></span> */}
</div>
</ProForm.Group>
</ModalForm>
);

@ -62,9 +62,10 @@ const AlarmRulesList: React.FC = () => {
}
};
const handleUpdateTimeModal = () => {
setCurrentRow(undefined);
if (updateTimeModalOpen) {
setUpdateTimeModalOpen(false);
setCurrentRow(undefined);
} else {
setUpdateTimeModalOpen(true);
}
@ -186,16 +187,16 @@ const AlarmRulesList: React.FC = () => {
</Button>
),
},
{
key: 'destroy',
renderDom: (
<IsDelete
deleteApi={() => {
handleDestroy(record).then(() => {});
}}
></IsDelete>
),
},
// {
// key: 'destroy',
// renderDom: (
// <IsDelete
// deleteApi={() => {
// handleDestroy(record).then(() => {});
// }}
// ></IsDelete>
// ),
// },
]}
></TableActionCard>,
],

@ -31,7 +31,7 @@ const CreateForm: React.FC<CreateFormProps> = (props) => {
<ModalForm<API.UpdateInterfacesParams>
width={proFormSmallModelWidth}
title={intl.formatMessage({
id: 'resource.server_status.table.list.add',
id: 'device.interface_manage.table.list.addPic',
defaultMessage: '$$$',
})}
open={props.createModalOpen}

@ -39,7 +39,7 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
<ModalForm<any>
width={proFormSmallModelWidth}
title={intl.formatMessage({
id: 'alarm_rules.page.form.title',
id: 'device.interface_manage.table.list.updatePic',
defaultMessage: `编辑${props.values.device_name}`,
})}
open={props.updateModalOpen}

@ -6,7 +6,7 @@ import {
deleteDeviceCategoryDeleteDeviceCategory,
postDeviceCategoryGetDeviceCategoryList,
} from '@/services/device/DeviceCategory';
import { getInterfaces } from '@/services/alarm/Interfaces'
import { getInterfaces, postInterfaces } from '@/services/alarm/Interfaces'
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { PageContainer, ProTable } from '@ant-design/pro-components';
import { FormattedMessage, useIntl } from '@umijs/max';
@ -27,8 +27,8 @@ const InterfaceManageList: React.FC = () => {
// 动态设置每页数量
const [currentPageSize, setCurrentPageSize] = useState<number>(10);
const handleDestroy = async (selectedRow: API.DeviceCategory) => {
deleteDeviceCategoryDeleteDeviceCategory({ id: selectedRow.id })
const handleDestroy = async (selectedRow: API.UpdateInterfacesParams) => {
postInterfaces({ id: selectedRow.id, device_status: '3' } )
.then(() => {
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
actionRef.current?.reload();
@ -38,7 +38,7 @@ const InterfaceManageList: React.FC = () => {
});
};
const [currentRow, setCurrentRow] = useState<API.DeviceCategory>();
const [currentRow, setCurrentRow] = useState<API.UpdateInterfacesParams>();
/**
* @en-US Pop-up window of new window
* @zh-CN
@ -106,7 +106,7 @@ const InterfaceManageList: React.FC = () => {
}
}
const columns: ProColumns<API.DeviceCategory>[] = [
const columns: ProColumns<API.UpdateInterfacesParams>[] = [
{
title: <FormattedMessage id="device.interface_manage.table.list.name" defaultMessage="$$$" />,
dataIndex: 'device_name',

@ -125,11 +125,60 @@ const Login: React.FC = () => {
}
useEffect(()=>{
refreshCaptcha()
// refreshCaptcha()
}, [])
const fetchUserInfo = async () => {
const userInfo = await initialState?.fetchUserInfo?.();
const menus = await postMenuGetMenu();
// const menus = await postMenuGetMenu();
const menus = {
code: 0,
success: true,
data: {
routes: [
{
"path": "/welcome",
"key": "",
"name": "welcome",
"icon": "HomeOutlined",
"access": "",
"component": "Welcome",
"title": "首页",
"routes": []
},
{
"path": "/alarm/alarm-list",
"key": "",
"name": "alarm-list",
"icon": "WarningOutlined",
"access": "",
"component": "Hidden",
"title": "告警列表",
"routes": []
},
{
"path": "alarm_rules",
"key": "",
"name": "alarm_rules",
"icon": "OrderedListOutlined",
"access": "",
"component": "Hidden",
"title": "告警规则",
"routes": []
},
{
"path": "interfaceManage",
"key": "",
"name": "interfaceManage",
"icon": "BranchesOutlined",
"access": "",
"component": "Hidden",
"title": "接口管理",
"routes": []
}
]
},
msg: "获取成功"
}
if (userInfo) {
console.log(22, userInfo)
if (getLocale() === 'zh-CN') {

@ -23,7 +23,7 @@ const rankingColSpanProps = { sm: 24, md: 12, lg: 8}; // 排名卡片项栅格
/**state 初始化数据 */
const offendingTabData: Record<string, any>[] = [
{ tabName: '违规总量', keyName: 'totalCount' },
{ tabName: '风险人员识别量', keyName: 'totalCount' },
// { tabName: '违规网点', keyName: 'network' },
];
// const topItemStyle = { marginBottom: 24, height: 190 }; // 每个卡片独立样式
@ -150,7 +150,7 @@ const BannerInfoCard: React.FC = ({
}}
meta={{
y: {
alias: '违规量',
alias: '风险人员识别量',
},
}}
/>

@ -57,12 +57,12 @@ const netWorkColumns: ProColumns[] = [
),
},
{
title: '网点名',
title: '设备名称',
dataIndex: 'keyword',
sorter: (a, b) => a.keyword.localeCompare(b.keyword),
},
{
title: '异常数',
title: '识别次数',
dataIndex: 'users',
sorter: (a, b) => a.users - b.users,
},
@ -88,9 +88,9 @@ const trendItemHeadStyle = { padding: 0 };
/**state 初始化数据 */
const offendingTrendData: Record<string, any>[] = [
{ label: '玩手机', value1: 11093, value2: '17.1', status: 0 },
{ label: '打瞌睡', value1: 26, value2: '27.1', status: 1 },
{ label: '离岗', value1: 145, value2: '37.1', status: 1 },
{ label: '一级', value1: 11093, value2: '17.1', status: 0 },
{ label: '二级', value1: 26, value2: '27.1', status: 1 },
{ label: '三级', value1: 145, value2: '37.1', status: 1 },
];
/**methods 事件交互 */
@ -158,7 +158,7 @@ const DonutChart: React.FC = () => {
legend: {
orient: 'vertical',
left: 10,
data: ['玩手机', '打瞌睡', '离岗'],
data: ['一级', '二级', '三级'],
},
series: [
{
@ -182,9 +182,9 @@ const DonutChart: React.FC = () => {
show: false,
},
data: [
{ value: 235, name: '玩手机'},
{ value: 510, name: '打瞌睡' },
{ value: 134, name: '离岗' },
{ value: 235, name: '二级'},
{ value: 510, name: '三级' },
{ value: 134, name: '一级' },
],
},
],
@ -232,12 +232,12 @@ const FootInfoCard: React.FC = () => {
<ProCard key="resize-observer" wrap gutter={24} bodyStyle={{ marginTop: 40, padding: 0 }}>
<ProCard
gutter={24}
title="线上热门搜索"
title="风险人员区域分布"
headStyle={footItemHeadStyleProps}
colSpan={footItemColSpanProps}
bodyStyle={{ margin: 0, padding: 0 }}
>
<TrendInfoCard></TrendInfoCard>
{/* <TrendInfoCard></TrendInfoCard> */}
<ProTable
columns={netWorkColumns}
dataSource={data}
@ -259,7 +259,7 @@ const FootInfoCard: React.FC = () => {
colSpan={footItemColSpanProps}
wrap
bodyStyle={{ margin: 0, padding: 0 }}
title="违规类别占比"
title="告警级别占比"
>
<div style={{maxWidth: '40vw'}}>
<DonutChart ></DonutChart>

@ -17,10 +17,10 @@ const { Statistic } = StatisticCard;
/**styles 组件样式配置 */
const topColSpanProps = { sm: 24, md: 12, lg: 6 }; // 每个卡片项栅格配置
const topItemStyle = { marginBottom: 24, height: 190, backgroundColor: '#FFFAF5', border: '1px solid #FFE9D6', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle1 = { marginBottom: 24, height: 190, backgroundColor: '#F5F8FF', border: '1px solid #D6E1FF', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle2 = { marginBottom: 24, height: 190, backgroundColor: '#F5F3FD', border: '1px solid #DDD5FD', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle3 = { marginBottom: 24, height: 190, backgroundColor: '#F5FBFF', border: '1px solid #D6EFFF', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle = { marginBottom: 24, height: 160, backgroundColor: '#FFFAF5', border: '1px solid #FFE9D6', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle1 = { marginBottom: 24, height: 160, backgroundColor: '#F5F8FF', border: '1px solid #D6E1FF', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle2 = { marginBottom: 24, height: 160, backgroundColor: '#F5F3FD', border: '1px solid #DDD5FD', borderRadius: 4 }; // 每个卡片独立样式
const topItemStyle3 = { marginBottom: 24, height: 160, backgroundColor: '#F5FBFF', border: '1px solid #D6EFFF', borderRadius: 4 }; // 每个卡片独立样式
const topItemHeadStyle = { padding: 15 };
const chartsStyle = {
height: 84
@ -38,7 +38,7 @@ const NavInfoCardList: React.FC = () => {
gutter={24}
wrap
ghost
title="异常总量"
title="风险人员总量"
headStyle={topItemHeadStyle}
extra={
<>
@ -63,16 +63,16 @@ const NavInfoCardList: React.FC = () => {
</Space>
),
}}
chart={
<>
<Divider style={{ margin: 5 }} />
<Space>
<StatisticCard bodyStyle={{ padding: 0, backgroundColor: '#FFFAF5' }}>
<Statistic title="日异常量" value="0.00%" />
</StatisticCard>
</Space>
</>
}
// chart={
// <>
// <Divider style={{ margin: 5 }} />
// <Space>
// <StatisticCard bodyStyle={{ padding: 0, backgroundColor: '#FFFAF5' }}>
// <Statistic title="日异常量" value="0.00%" />
// </StatisticCard>
// </Space>
// </>
// }
/>
</ProCard>
{/* 设备总量 */}
@ -80,7 +80,7 @@ const NavInfoCardList: React.FC = () => {
gutter={24}
wrap
ghost
title="设备总量"
title="总识别人员"
headStyle={topItemHeadStyle}
extra={
<>
@ -113,16 +113,16 @@ const NavInfoCardList: React.FC = () => {
</>
),
}}
chart={
<>
<Divider style={{ margin: 5 }} />
<Space>
<StatisticCard bodyStyle={{ padding: 0, backgroundColor: '#F5F8FF' }}>
<Statistic title="设备量" value="0.00%" />
</StatisticCard>
</Space>
</>
}
// chart={
// <>
// <Divider style={{ margin: 5 }} />
// <Space>
// <StatisticCard bodyStyle={{ padding: 0, backgroundColor: '#F5F8FF' }}>
// <Statistic title="设备量" value="0.00%" />
// </StatisticCard>
// </Space>
// </>
// }
/>
</ProCard>
{/* 覆盖网点 */}
@ -130,7 +130,7 @@ const NavInfoCardList: React.FC = () => {
gutter={24}
wrap
ghost
title="覆盖网点"
title="总告警量"
headStyle={topItemHeadStyle}
extra={
<>
@ -161,16 +161,16 @@ const NavInfoCardList: React.FC = () => {
</>
),
}}
chart={
<>
<Divider style={{ margin: 5 }} />
<Space>
<StatisticCard bodyStyle={{ padding: 0, backgroundColor: '#F5F3FD' }}>
<Statistic title="覆盖网点率" value="0.00%" />
</StatisticCard>
</Space>
</>
}
// chart={
// <>
// <Divider style={{ margin: 5 }} />
// <Space>
// <StatisticCard bodyStyle={{ padding: 0, backgroundColor: '#F5F3FD' }}>
// <Statistic title="覆盖网点率" value="0.00%" />
// </StatisticCard>
// </Space>
// </>
// }
/>
</ProCard>
{/* 资源使用 */}
@ -178,7 +178,7 @@ const NavInfoCardList: React.FC = () => {
gutter={24}
wrap
ghost
title="资源使用"
title="设备数量"
headStyle={topItemHeadStyle}
extra={
<>
@ -218,15 +218,15 @@ const NavInfoCardList: React.FC = () => {
</>
),
}}
chart={
<>
<Divider style={{ margin: 5 }} />
<Space style={{ marginTop: 0, backgroundColor: '#F5FBFF' }}>
<Statistic title="周同比" value="12%" trend="up" />
<Statistic title="日同比" value="11%" trend="down" />
</Space>
</>
}
// chart={
// <>
// <Divider style={{ margin: 5 }} />
// <Space style={{ marginTop: 0, backgroundColor: '#F5FBFF' }}>
// <Statistic title="周同比" value="12%" trend="up" />
// <Statistic title="日同比" value="11%" trend="down" />
// </Space>
// </>
// }
/>
</ProCard>
</ProCard>

@ -24,7 +24,7 @@ export async function getInterfaces(
/** 更新接口列表 */
export async function postInterfaces(
body: API.UpdateAlarmRulesParams,
body: API.UpdateInterfacesParams,
options?: { [key: string]: any },
) {
return request<API.Response & { data?: API.PageResult; msg?: string }>(

@ -44,9 +44,16 @@ export async function deleteUserDeleteUser(body: API.GetById, options?: { [key:
});
}
// /** 获取用户信息 GET /user/getUserInfo */
// export async function getUserGetUserInfo(options?: { [key: string]: any }) {
// return request<API.Response & { data?: API.UserView; msg?: string }>(`/api/v1/user/getUserInfo`, {
// method: 'GET',
// ...(options || {}),
// });
// }
/** 获取用户信息 GET /user/getUserInfo */
export async function getUserGetUserInfo(options?: { [key: string]: any }) {
return request<API.Response & { data?: API.UserView; msg?: string }>(`/api/v1/user/getUserInfo`, {
return request<API.Response & { data?: API.UserView; msg?: string }>(`/api/get_user_info/`, {
method: 'GET',
...(options || {}),
});

Loading…
Cancel
Save