feat(): 平台监视开发

master
李神峰 2025-02-10 17:56:43 +08:00
parent 585bf6ccd5
commit 0a9a8176a0
14 changed files with 596 additions and 13 deletions

View File

@ -1,4 +1,4 @@
import { httppost, httpget } from "../../utils/request";
import { httppost, httpget,xyt_httpget2 } from "../../utils/request";
export async function findPage(url, params = {},type='post') {
@ -38,3 +38,31 @@ export async function findPage1(url, params = {}, type = 'post') {
}
return {list: [], totalRow: 0};
}
export async function xyt_paginate_noCode(url, params = {}) {
const {pageNumber, pageSize, ...ret} = params;
const pam = {
pageNum:pageNumber,
pageSize:pageSize,
...ret
}
const result = await xyt_httpget2(url, pam);
if (result && result.rows) {
return {
list: result.rows.map((m, index) => ({inx: (pageNumber - 1) * pageSize + index + 1, ...m})),
totalRow: result.total
};
}
return {list: [], totalRow: 0};
}
export function createCrudService(urlSet) {
const xyt_find_noCode = async (params) => {
return xyt_paginate_noCode(urlSet, params);
}
return {
xyt_find_noCode,
}
}

View File

@ -32,11 +32,12 @@ const usePageTable = (service,service2, { defaultParams, defaultPageSize, defaul
sort: opt?.sort ?? state.sort,
search: opt?.params ?? state.params,
};
let data={}
let data = {}
const { search, ...params } = pageParams;
if(opt?.params?.yearShow){
data=await service(pageParams)
}else{
data=opt.params?.year?await service2(pageParams):await service(pageParams)
data=opt.params?.year?await service2(pageParams):await service({...search, ...params})
}
if (!abort.current) {

View File

@ -35,14 +35,15 @@ function LayoutPage(props) {
const token = getParameter('token');
const oldToken = sessionStorage.getItem("token")
const myLayout = getParameter('Layout')
const loading = useMemo(()=>user!==null&&menu.length!==0,[user,menu])
// const loading = useMemo(() => user !== null && menu.length !== 0, [user, menu])
const loading = useMemo(() => menu.length !== 0, [user, menu])
useEffect(()=>{
if(token){
if(oldToken!==token){
dispatch.session.byToken(token)
}else{
dispatch.session.loadMenu(user);
// dispatch.session.loadMenu(user);
dispatch.session.loadMenu();
}
} else {
dispatch.session.loadMenu();

View File

@ -8,7 +8,7 @@ const shengUrl2 = 'service28080'
// const shengUrlPro = 'http://223.75.53.141:28080'
// const shengUrlPro = 'http://223.75.53.141:8000' //正式
const shengUrlPro = 'http://223.75.53.141:9001' //正式
const guishiPro = '/gunshiApp/ptjs'
// const shengUrlPro = 'http://223.75.53.141:9001'
@ -20,6 +20,11 @@ const nmjPro = '/shzh/jcsj'
const jsapi = {
ptjs: {
czrz: shengUrlPro + '/prod-api/baseplat-system/operlog/hb/list',
czdbl: guishiPro + '/monitor/summary'
},
service: {
sysuser: {
getCaptcha: shengUrlPro + '/prod-api/baseplat-auth/tokenHB/getCaptcha',

View File

@ -141,8 +141,8 @@ const session = {
// const { data } = await httpget(`${apiurl.service.adcd.tree}/${userData.adcd}`) || {}
// dbStorage.setItem('dataTree',data)
await setTree('dataTree',userData)
await setTree123('dataTree123',userData)
// await setTree('dataTree',userData)
// await setTree123('dataTree123',userData)
// const im = new IMSDK();
// im.init({
@ -270,7 +270,12 @@ const session = {
{ id: 119, path: "/fhrz/yjgx", parent_id: 500, name: "预警关系", type: 0, order: 1 },
]
},
{
id:121, redirect: "/ptjs/czrz", parent_id: -1, name: "平台监视", type: 1, order: 1, children: [
{ id: 402, path: "/ptjs/czrz", parent_id: 500, name: "操作日志", type: 0, order: 1},
{ id: 403, path: "/ptjs/Czdbl", parent_id: 500, name: "测站到报率", type: 0, order: 1},
]
},
]
let arr = myMenu.map((item,index)=>{

View File

@ -26,7 +26,7 @@ const routes = [
},
{
route: '*', component: Layout, routes: [
{ path: '/', exact: true, component: () => <Redirect to={"/xzqh/xzqhbg"} /> },
{ path: '/', exact: true, component: () => <Redirect to={"/ptjs/czrz"} /> },
//行政区划
{ path: '/xzqh/xzqhbg', exact: true, component: lazy(() => import('./views/Adcd/Bg')) },
{ path: '/xzqh/yhjmwh', exact: true, component: lazy(() => import('./views/Adcd/Wh')) },
@ -38,6 +38,12 @@ const routes = [
//防御责任人
{ path: '/fyzrr/zrrbg', exact: true, component: lazy(() => import('./views/Zrr/Bg')) },
{ path: '/fyzrr/zrrcx', exact: true, component: lazy(() => import('./views/Zrr/Cx')) },
// 平台监视
{ path: '/ptjs/czrz', exact: true, component: lazy(() => import('./views/Ptjs/Czrz')) },
// 测站到报率
{ path: '/ptjs/czdbl', exact: true, component: lazy(() => import('./views/Ptjs/Czdbl')) },
//监测站点
{ path: '/jczd/zdbg', exact: true, component: lazy(() => import('./views/Jczd/Bg')) },
{ path: '/jczd/zdsp', exact: true, component: lazy(() => import('./views/Jczd/Sp')) },

View File

@ -49,5 +49,16 @@ module.exports = function (app) {
},
})
);
app.use(
'/gunshiApp/ptjs',
createProxyMiddleware({
target: 'http://192.168.66.7:20019',
changeOrigin: true,
pathRewrite: {
'^/gunshiApp/ptjs': '',
},
})
);
};

View File

@ -133,6 +133,36 @@ export function httppost(url, data = {}) {
return send(url, options);
}
export function xyt_httpget2(url, data = {}) {
const params = [];
for (const k in data) {
const v = data[k];
if (tools.strIsEmpty(v)) { continue; }
params.push(`${encodeURIComponent(k)}=${encodeURIComponent(v)}`);
}
const strparams = params.join('&');
if (params.length > 0) {
if (url.indexOf('?') > 0) {
url += `&${strparams}`;
} else {
url += `?${strparams}`;
}
}
const options = {
method: 'GET',
headers: {
"cookie":'Token=' + localStorage.getItem('access_token'),
"dataScope":"CUSTOM_WATERSHED",
"customWatershedCode":localStorage.getItem('customWatershedCode'),
"SHOW_LOADING": true,
"authorization":"Bearer" + ' ' + sessionStorage.getItem('token')
},
};
return send(url, options);
}
export function httpPostFile(url, data = {}) {
const form = new FormData();
for (const k in data) {

View File

@ -25,9 +25,8 @@ const Login = ({ isModal = false }) => {
if (result) {
// debugger;
setLoadings(false)
debugger
// history.push(getMainPage(result));
history.push('/fyzrr/zrrbg');
history.push('/ptjs/czrz');
}else{
setLoadings(false)
message.error('登录失败');

View File

@ -0,0 +1,151 @@
import React, { useEffect, useState, useMemo, useRef } from 'react';
import { Card, message, Table, Space, Button } from 'antd';
import ToolBar from './toolbar.js';
import usePageTable from '../../../components/Crud/usePageTable.js'
import apiurl from '../../../models/apiurl'
import { createCrudService } from '../../../components/Crud/_';
import {xyt_httpget2} from "../../../utils/request"
export default function Czrz() {
const refModal = useRef();
const businessType = {
// 0: "其它",
1: "新增",
2: "修改",
3: "删除",
4: "授权",
5: "导出",
6: "导入",
7: "强退",
8: "生成代码",
9: "清空数据",
}
const operatorStatus = {
0: '正常',
1: '异常'
}
const columns = [
{
title: '日志编号',
dataIndex: 'operId',
key: 'operId',
width: 100,
align: "center",
},
{
title: '系统模块',
dataIndex: 'title',
key: 'title',
width: 120,
align: "center",
},
{
title: '操作类型',
dataIndex: 'businessType',
key: 'businessType',
width: 100,
align: "center",
render: (text, record) => (
<span>
{businessType[text]}
</span>
)
},
{
title: '请求方式',
dataIndex: 'requestMethod',
key: 'requestMethod',
width: 100,
align: "center",
},
{
title: '操作人员',
dataIndex: 'operName',
key: 'operName',
width: 180,
align: "center",
},
{
title: '主机',
dataIndex: 'operIp',
key: 'operIp',
width: 180,
align: "center",
},
{
title: '操作地点',
dataIndex: 'operAddress',
key: 'operAddress',
width: 180,
align: "center",
},
{
title: '操作状态',
dataIndex: 'status',
key: 'status',
width: 100,
align: "center",
render: (text, record) => (
<span>
{operatorStatus[text]}
</span>
)
},
{
title: '操作日期',
dataIndex: 'operTime',
key: 'operTime',
width: 150,
align: "center",
},
{
title: '操作', key: 'action', dataIndex: 'action', width: 150, align: "center",
render: (v, r) => (
<Space size="middle">
<a onClick={() => command("view")(r)}>查看</a>
</Space>
)
},
]
const [searchVal, setSearchVal] = useState(false)
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.ptjs.czdbl).xyt_find_noCode);
const getData = async (params) => {
try {
const res = await xyt_httpget2(apiurl.ptjs.czdbl,params)
// debugger
} catch (error) {
console.log(error);
}
}
const command = (type) => (row) => {
refModal.current.showView(row)
}
useEffect(() => {
if (searchVal) {
const params = {
...searchVal
};
getData(params)
}
}, [searchVal])
return (
<div className='page'>
<div style={{width:'100%'}}>
<Card style={{ display: 'flex', flexDirection: 'column' }}>
<ToolBar
setToolVal={setSearchVal}
/>
<Table
columns={columns}
{...tableProps}
scroll={{ x: width, y: "calc( 100vh - 400px )" }}
rowKey="inx"
/>
</Card>
</div>
</div>
)
}

View File

@ -0,0 +1,67 @@
import React, { useEffect,useState } from 'react';
import { Form, Input, Button, DatePicker } from 'antd';
import NormalSelect from '../../../components/Form/NormalSelect';
import dayjs from 'dayjs';
const { RangePicker } = DatePicker;
const ToolBar = ({ setToolVal }) => {
const types = [
// { label: '其它', value: 0 },
{ label: '新增', value: 1 },
{ label: '修改', value: 2 },
{ label: '删除', value: 3 },
{ label: '授权', value: 4 },
{ label: '导出', value: 5 },
{ label: '导入', value: 6 },
{ label: '强退', value: 7 },
{ label: '生成代码', value: 8 },
{ label: '清空数据', value: 9 },
];
const Stypes = [
{ label: '正常', value: 0 },
{ label: '异常', value: 1 },
];
const [form] = Form.useForm();
const onFinish = (values) => {
if (values.operTime) {
values.stm = values.operTime[0] ? dayjs(values.operTime[0]).format('YYYY-MM-DD') : "";
values.etm = values.operTime[1] ? dayjs(values.operTime[1]).format('YYYY-MM-DD') : "";
delete values.operTime
}
setToolVal(values);
}
useEffect(() => {
const defaultValue = [
dayjs().subtract(10, 'days'),
dayjs().subtract(1, 'days')
]
form.setFieldsValue({ operTime: defaultValue })
setToolVal({stm:defaultValue[0].format('YYYY-MM-DD'), etm:defaultValue[1].format('YYYY-MM-DD')})
}, []);
return (
<div className='pageToolBar'>
<Form form={form} onFinish={onFinish} size='Default' layout="inline">
<Form.Item label="监测时间" name="operTime">
<RangePicker
placeholder={['开始日期', '结束日期']}
format='YYYY-MM-DD'
style={{ width: 300 }}
/>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit" size='Default'>查询</Button>
</Form.Item>
<Form.Item>
<Button size='Default' onClick={()=>form.resetFields()}>重置</Button>
</Form.Item>
</Form>
</div>
);
}
export default ToolBar;

View File

@ -0,0 +1,59 @@
import React, { useEffect, useState } from 'react';
import { Form, Descriptions, Input, Row, Col, message, Select, Switch } from 'antd';
const ModalForm = ({ mode, record }) => {
const [form] = Form.useForm();
const businessType = {
0: "其它",
1: "新增",
2: "修改",
3: "删除",
4: "授权",
5: "导出",
6: "导入",
7: "强退",
8: "生成代码",
9: "清空数据",
}
const operatorStatus = {
0: '正常',
1: '异常'
}
return (
<>
<Descriptions column={2}>
<Descriptions.Item label="操作模块" span={1}>
{record?.title}/{businessType[record?.businessType]}
</Descriptions.Item>
<Descriptions.Item label="请求地址" span={1}>
{record?.operUrl}
</Descriptions.Item>
<Descriptions.Item label="登录信息" span={1}>
{record?.operName}/{record?.operIp}/
</Descriptions.Item>
<Descriptions.Item label="请求方式" span={1}>
{record?.requestMethod}
</Descriptions.Item>
<Descriptions.Item label="操作方法" span={2}>
{record?.method}
</Descriptions.Item>
<Descriptions.Item label="请求参数" span={2}>
{record?.operParam}
</Descriptions.Item>
<Descriptions.Item label="返回参数" span={2}>
{record?.jsonResult}
</Descriptions.Item>
<Descriptions.Item label="操作状态" span={1}>
{operatorStatus[record?.status]}
</Descriptions.Item>
<Descriptions.Item label="操作时间" span={1}>
{record?.operTime}
</Descriptions.Item>
</Descriptions>
</>
);
}
export default ModalForm;

View File

@ -0,0 +1,150 @@
import React, { useEffect, useState, useMemo, useRef } from 'react';
import { Card, message, Table, Space, Button } from 'antd';
import ToolBar from './toolbar.js';
import usePageTable from '../../../components/Crud/usePageTable.js'
import apiurl from '../../../models/apiurl'
import { createCrudService } from '../../../components/Crud/_';
import BasicCrudModal from '../../../components/Crud/BasicCrudModal.js';
import ModalForm from './form.js';
export default function Czrz() {
const refModal = useRef();
const businessType = {
// 0: "其它",
1: "新增",
2: "修改",
3: "删除",
4: "授权",
5: "导出",
6: "导入",
7: "强退",
8: "生成代码",
9: "清空数据",
}
const operatorStatus = {
0: '正常',
1: '异常'
}
const columns = [
{
title: '日志编号',
dataIndex: 'operId',
key: 'operId',
width: 100,
align: "center",
},
{
title: '系统模块',
dataIndex: 'title',
key: 'title',
width: 120,
align: "center",
},
{
title: '操作类型',
dataIndex: 'businessType',
key: 'businessType',
width: 100,
align: "center",
render: (text, record) => (
<span>
{businessType[text]}
</span>
)
},
{
title: '请求方式',
dataIndex: 'requestMethod',
key: 'requestMethod',
width: 100,
align: "center",
},
{
title: '操作人员',
dataIndex: 'operName',
key: 'operName',
width: 180,
align: "center",
},
{
title: '主机',
dataIndex: 'operIp',
key: 'operIp',
width: 180,
align: "center",
},
{
title: '操作地点',
dataIndex: 'operAddress',
key: 'operAddress',
width: 180,
align: "center",
},
{
title: '操作状态',
dataIndex: 'status',
key: 'status',
width: 100,
align: "center",
render: (text, record) => (
<span>
{operatorStatus[text]}
</span>
)
},
{
title: '操作日期',
dataIndex: 'operTime',
key: 'operTime',
width: 150,
align: "center",
},
{
title: '操作', key: 'action', dataIndex: 'action', width: 150, align: "center",
render: (v, r) => (
<Space size="middle">
<a onClick={() => command("view")(r)}>查看</a>
</Space>
)
},
]
const [searchVal, setSearchVal] = useState({})
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.ptjs.czrz).xyt_find_noCode);
const command = (type) => (row) => {
refModal.current.showView(row)
}
useEffect(() => {
if (searchVal) {
const params = {
...searchVal
};
search(params)
}
}, [searchVal])
return (
<div className='page'>
<div style={{width:'100%'}}>
<Card style={{ display: 'flex', flexDirection: 'column' }}>
<ToolBar
setToolVal={setSearchVal}
/>
<Table
columns={columns}
{...tableProps}
scroll={{ x: width, y: "calc( 100vh - 400px )" }}
rowKey="inx"
/>
</Card>
</div>
<BasicCrudModal
width={800}
ref={refModal}
title="操作日志详细"
component={ModalForm}
/>
</div>
)
}

View File

@ -0,0 +1,70 @@
import React, { useEffect,useState } from 'react';
import { Form, Input, Button, DatePicker } from 'antd';
import NormalSelect from '../../../components/Form/NormalSelect';
import dayjs from 'dayjs';
const { RangePicker } = DatePicker;
const ToolBar = ({ setToolVal }) => {
const types = [
// { label: '其它', value: 0 },
{ label: '新增', value: 1 },
{ label: '修改', value: 2 },
{ label: '删除', value: 3 },
{ label: '授权', value: 4 },
{ label: '导出', value: 5 },
{ label: '导入', value: 6 },
{ label: '强退', value: 7 },
{ label: '生成代码', value: 8 },
{ label: '清空数据', value: 9 },
];
const Stypes = [
{ label: '正常', value: 0 },
{ label: '异常', value: 1 },
];
const [form] = Form.useForm();
const onFinish = (values) => {
if (values.operTime) {
values.beginTime = values.operTime[0] ? dayjs(values.operTime[0]).format('YYYY-MM-DD') : "";
values.endTime = values.operTime[1] ? dayjs(values.operTime[1]).format('YYYY-MM-DD') : "";
delete values.operTime
}
setToolVal(values);
}
return (
<div className='pageToolBar'>
<Form form={form} onFinish={onFinish} size='Default' layout="inline">
<Form.Item label="系统模块" name="title">
<Input allowClear />
</Form.Item>
<Form.Item label="操作人员" name="operName">
<Input allowClear />
</Form.Item>
<Form.Item label="类型" name="businessType">
<NormalSelect options={types} style={{ width: '180px' }} />
</Form.Item>
<Form.Item label="状态" name="status">
<NormalSelect options={Stypes} style={{ width: '120px' }} />
</Form.Item>
<Form.Item label="操作时间" name="operTime">
<RangePicker
placeholder={['开始日期', '结束日期']}
format='YYYY-MM-DD'
style={{ width: 300 }}
/>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit" size='Default'>查询</Button>
</Form.Item>
<Form.Item>
<Button size='Default' onClick={()=>form.resetFields()}>重置</Button>
</Form.Item>
</Form>
</div>
);
}
export default ToolBar;