lishenfeng
/
tsg-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

页面搭建

lsf-dev
xielei 2024-09-24 16:52:00 +08:00
parent bd868c929f
commit 946f0f7c85
14 changed files with 326 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/service/apiurl.js
View File

@ -1039,6 +1039,13 @@ const apiurl = {
}
},
// 全周期
gcdsj:{
qzqda:{
list:service_fxdd + '/projectEvents/doc/page'
}
}
}
export default apiurl

4
src/views/sq/qys/kqys/index.js
View File

@ -53,12 +53,12 @@ const Page = () => {
}, [])
return (
<div style={{ backgroundColor: '#fff', height: '100%' }}>
<div style={{ display: 'flex', justifyContent: 'start', alignItems: 'center', }}>
<div style={{ display: 'flex', justifyContent: 'start', alignItems: 'center', padding: 10 }}>
{list.map(item => <div className={url == item.img ? stylesCss.active : stylesCss.tabCheck} onClick={() => tabClick(item)}>{item.name}</div>)}
</div>
<Rnd
default={{
x: 10,
x: 200,
y: 60,
width: '80%',
height: 'calc(100% - 100px)'

83
src/views/sq/qys/kqys/index.module.less
View File

@ -1,47 +1,54 @@
.tabCheck{
border-width: 0px;
width: 125px;
height: 36px;
background: inherit;
background-color: rgba(215, 223, 235, 1);
box-sizing: border-box;
border-width: 1px;
border-style: solid;
border-color: rgba(228, 231, 237, 1);
border-radius: 10px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
font-size: 14px;
color: #303133;
margin: 10px 0;
width: 120px;
height: 40px;
line-height: 40px;
margin-right: 5px;
border-radius: 10px 10px 0 0;
background: #D7DFEB;
border: 1px solid rgba(228, 231, 237, 1);
text-align: center;
line-height: 36px;
font-size: 14px;
font-weight: 500;
color: #333;
cursor: pointer;
}
.active{
width: 125px;
height: 36px;
background: inherit;
background-color: rgba(255, 255, 255, 1);
box-sizing: border-box;
border-width: 1px;
border-style: solid;
border-color: rgba(228, 231, 237, 1);
border-bottom: 0px;
border-radius: 10px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
font-size: 14px;
color: #303133;
margin: 10px 0;
width: 120px;
height: 40px;
line-height: 40px;
margin-right: 5px;
border-radius: 10px 10px 0 0;
background: #D7DFEB;
border: 1px solid rgba(228, 231, 237, 1);
text-align: center;
line-height: 36px;
font-size: 14px;
font-weight: 500;
color: #333;
cursor: pointer;
color: #409EFF;
background: #ffffff;
}
// .fxdd_hsybjs_toolbar_item{
// width: 120px;
// height: 40px;
// line-height: 40px;
// margin-right: 5px;
// border-radius: 10px 10px 0 0;
// background: #D7DFEB;
// border: 1px solid rgba(228, 231, 237, 1);
// text-align: center;
// font-size: 14px;
// font-weight: 500;
// color: #333;
// cursor: pointer;
// }
// .hsybjs_checked{
// color: #409EFF;
// background: #ffffff;
// }

15
src/views/sq/qzq/qzqda/index.js
View File

@ -8,6 +8,7 @@ import apiurl from '../../../../service/apiurl';
import usePageTable from '../../../../components/crud/usePageTable2';
import { createCrudService } from '../../../../components/crud/_';
import {CrudOpRender_text} from '../../../../components/crud/CrudOpRender';
import './index.less'
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
const Page = () => {
@ -43,7 +44,7 @@ const Page = () => {
downloadLink.click();
}
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.gcdsj.page).find_noCode);
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.gcdsj.qzqda.list).find_noCode);
@ -75,7 +76,7 @@ const viewPdf = (params) => {
<div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
<div className='time-line'>
<Timeline>
{tableProps.dataSource.map((item, index) => (
{tableProps.dataSource?.map((item, index) => (
<Timeline.Item key={index}>
<div className='time-line-item'>
<span style={{width:100}}>{item.eventsDate}</span>
@ -85,12 +86,12 @@ const viewPdf = (params) => {
<span>附件：</span>
<Row gutter={[16]} style={{flex:1}}>
{
item.files.length > 0 && item.files.map(file => {
item.files?.length > 0 && item.files?.map(file => {
return (
<Col span={12}>
<div className="file-item" style={{width:"100%"}}>
<div className='file-description'>
{file.fileName.indexOf('.docx') > -1 ?
{file.fileName?.indexOf('.docx') > -1 ?
<div
onClick={() => { download(file.fileId) }}
style={{ cursor: 'pointer' }}
@ -100,7 +101,7 @@ const viewPdf = (params) => {
/>
</div>
:
file.fileName.indexOf('.pdf') > -1 ?
file.fileName?.indexOf('.pdf') > -1 ?
<div
onClick={() => { viewPdf(file?.fileId) }}
style={{ cursor: 'pointer' }}
@ -108,7 +109,7 @@ const viewPdf = (params) => {
<FilePdfOutlined style={{ fontSize: 40 }} />
</div>
:
file.fileName.indexOf('.zip') > -1 ?
file.fileName?.indexOf('.zip') > -1 ?
<div
onClick={() => { download(file?.fileId) }}
style={{ cursor: 'pointer' }}
@ -116,7 +117,7 @@ const viewPdf = (params) => {
<FileZipOutlined style={{ fontSize: 40 }} />
</div>
:
file.fileName.indexOf('.xlsx') > -1 ?
file.fileName?.indexOf('.xlsx') > -1 ?
<div
onClick={() => { download(file?.fileId) }}
style={{ cursor: 'pointer' }}

6
src/views/sq/qzq/qzqda/index.less
View File

@ -24,7 +24,11 @@
// align-items: center;
column-gap: 20px;
.item-right{
flex:1
flex:1;
display: flex;
flex-direction: column;
justify-content: space-between;
height: 70px;
}
}
}

6
src/views/sq/qzq/qzqda/toolbar.js
View File

@ -43,13 +43,9 @@ const ToolBar = ({ setSearchVal, onSave, storeData,role }) => {
<Form.Item>
<Button onClick={() => form.resetFields()}>重置</Button>
</Form.Item>
{
(onSave) ?
<Form.Item>
<Button onClick={onSave}>新增</Button>
<Button type="primary" onClick={onSave}>导出</Button>
</Form.Item>
:null
}
</Form>
</div>
</>

4
src/views/sz/szzf/ajdj/bajz.js
View File

@ -52,7 +52,7 @@ const Page = () => {
<Row>
<Col span={2}>
<div style={{display:'flex',alignItems:'center'}}>
<div style={{width:3,height:12,background:'blue',marginRight:5}}></div>
<div style={{width:3,height:12,background:'#259def',marginRight:5}}></div>
案卷存档</div>
</Col>
<Col span={10}>
@ -76,7 +76,7 @@ const Page = () => {
<Row>
<Col span={2}>
<div style={{display:'flex',alignItems:'center'}}>
<div style={{width:3,height:12,background:'blue',marginRight:5}}></div>
<div style={{width:3,height:12,background:'#259def',marginRight:5}}></div>
{item.type}</div>
</Col>
<Col span={22}>

2
src/views/sz/szzf/ajdj/lsyx.js
View File

@ -44,7 +44,7 @@ const Page = () => {
<Row>
<Col span={2}>
<div style={{display:'flex',alignItems:'center'}}>
<div style={{width:3,height:12,background:'blue',marginRight:5}}></div>
<div style={{width:3,height:12,background:'#259def',marginRight:5}}></div>
{item.type}</div>
</Col>
<Col span={22}>

7
src/views/sz/szzf/ajtj/barCharts.js
View File

@ -3,7 +3,7 @@ import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd'
import ReactECharts from 'echarts-for-react';
import { useEffect, useState, useMemo } from 'react';
const Page = ({title}) => {
const Page = ({ title = '标题' }) => {
const [echart2, setEchart2] = useState(Object())
const [inspectordata, setInspectorData] = useState([{}])
const [plandata, setPlanData] = useState(Object())
@ -73,7 +73,10 @@ const Page = ({title}) => {
return (
<>
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
<div style={{ fontSize: 20, fontWeight: 'bold' }}>{title}</div>
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
{title}
</div>
<DatePicker.RangePicker
style={{ width: 220, }}
onChange={(e, index) => onOk(e, 2)}

7
src/views/sz/szzf/ajtj/bincharts.js
View File

@ -3,7 +3,7 @@ import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd'
import ReactECharts from 'echarts-for-react';
import { useEffect, useState, useMemo } from 'react';
const Page = ({title}) => {
const Page = ({ title = '标题' }) => {
const [echart2, setEchart2] = useState(Object())
const [inspectordata, setInspectorData] = useState([{}])
const [plandata, setPlanData] = useState(Object())
@ -73,7 +73,10 @@ const Page = ({title}) => {
return (
<>
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
<div style={{ fontSize: 20, fontWeight: 'bold' }}>{title}</div>
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
{title}
</div>
<DatePicker.RangePicker
style={{ width: 220, }}
onChange={(e, index) => onOk(e, 2)}

4
src/views/sz/szzf/ajtj/index.js
View File

@ -1,6 +1,8 @@
import Charts from './bincharts'
import BarCharts from './barCharts'
import LineCharts from './lincharts'
import LdCharts from './ldCharts'
const Page = () => {
@ -11,7 +13,7 @@ const Page = () => {
<Charts />
</div>
<div style={{width:'33%',backgroundColor:'#ffffff',margin:5,padding:10}}>
<Charts />
<LdCharts />
</div>
<div style={{width:'33%',backgroundColor:'#ffffff',margin:5,padding:10}}>
<BarCharts />

136
src/views/sz/szzf/ajtj/ldCharts.js Normal file
View File

@ -0,0 +1,136 @@
import dayjs from 'dayjs';
import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd';
import ReactECharts from 'echarts-for-react';
import { useEffect, useState, useMemo } from 'react';
const Page = ({ title = '标题' }) => {
const [echart2, setEchart2] = useState(Object())
const [inspectordata, setInspectorData] = useState([{}])
const [plandata, setPlanData] = useState(Object())
const [problemdata, setProblemData] = useState(Object())
const getPlanOption = useMemo((name, data) => {
// let total = 0
// for (let i = 0; i < data.length; i++) {
// total = total + Number(data[i].value)
// }
return {
angleAxis: {
type: 'category',
data: ['应用服务中心', '技术管理', '综合管理', '进度管理', '质量管理', '安全管理', '其它']
},
radar: [
{
indicator: [
{ text: '' },
{ text: '' },
{ text: '' },
{ text: '' },
{ text: '' },
{ text: '' },
{ text: '' },
],
radius: '80%',
splitNumber: 12,
shape: 'circle',
splitArea: {
areaStyle: {
color: '#fff',
}
},
axisLine: {
lineStyle: {
color: '#d4d4d4'
}
},
},
],
radiusAxis: {
min: 0,
max: 20,
interval: 2,
// 刻度
axisTick: {
show: false
},
//刻度数值
axisLabel: {
show: false
},
// 线
axisLine: {
show: false
},
},
polar: {},
series: [
{
stack: 'a',
type: 'pie',
center: ['50%', '50%'],
selectedOffset: 0,
radius: [0, 140],
roseType: 'area',
itemStyle: {　 //去除饼图的指示折线label
normal: {
label: {
show: false,
},
borderRadius: 8
},
},
data: [
{ value: 40, name: '应用服务中心' },
{ value: 32, name: '技术管理' },
{ value: 30, name: '综合管理' },
{ value: 30, name: '进度管理' },
{ value: 28, name: '质量管理' },
{ value: 28, name: '安全管理' },
{ value: 18, name: '其它' },
]
}
]
}
}, [plandata])
console.log(getPlanOption);
const onOk = (event, index) => {
if (event !== null) {
let params = {
stm: dayjs(new Date(event[0])).format('YYYY-MM-DD'),
etm: dayjs(new Date(event[1])).format('YYYY-MM-DD'),
}
// getStm(params, index)
}
}
useEffect(() => {
let data = [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' },
{ value: 580, name: 'Email' },
{ value: 484, name: 'Union Ads' },
{ value: 300, name: 'Video Ads' }
]
setPlanData(data)
})
return (
<>
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
{title}
</div>
<DatePicker.RangePicker
style={{ width: 220, }}
onChange={(e, index) => onOk(e, 2)}
defaultValue={[dayjs().startOf("year"), dayjs()]}
></DatePicker.RangePicker>
</div>
<ReactECharts
ref={(e) => setEchart2(e)}
option={getPlanOption}
style={{ height: 350 }}
/>
</>
)
}
export default Page

7
src/views/sz/szzf/ajtj/lincharts.js
View File

@ -4,7 +4,7 @@ import ReactECharts from 'echarts-for-react';
import { useEffect, useState, useMemo } from 'react';
import { encode } from 'punycode';
const Page = ({ title }) => {
const Page = ({ title = '标题' }) => {
const [echart2, setEchart2] = useState(Object())
const [inspectordata, setInspectorData] = useState([{}])
const [plandata, setPlanData] = useState([])
@ -74,7 +74,10 @@ const Page = ({ title }) => {
return (
<>
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
<div style={{ fontSize: 20, fontWeight: 'bold' }}>{title}</div>
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
{title}
</div>
<DatePicker.RangePicker
style={{ width: 220, }}
onChange={(e, index) => onOk(e, 2)}

90
src/views/sz/szzf/clyj/treeSelectZdy.js
View File

@ -2,9 +2,9 @@ import React, { useState,useMemo } from 'react';
import { Tree, Input } from 'antd';
const { Search } = Input;
const treeData = [
const data = [
{
value: 'parent 1',
key: 'parent 1',
title: '违反水利工程建设与管理类行为',
children: [
{
@ -12,33 +12,33 @@ const treeData = [
title: '侵占、毁坏水法规定相关设施',
children: [
{
value: 'leaf1',
key: 'leaf1',
title: '侵占、毁坏水工程及堤防、护岸...',
},
{
value: 'leaf2',
key: 'leaf2',
title: '毁坏防汛、水文监测、水文地质...',
},
{
value: 'leaf3',
key: 'leaf3',
title: '在水工程保护范围内，从事影响..',
}
],
},
{
value: 'parent 1-1',
key: 'parent 1-1',
title: '破坏大坝管理设施、妨碍大坝',
children: [
{
value: 'leaf3',
key: 'leaf4',
title: '毁坏大坝及其管理设施',
},
{
value: 'leaf3',
key: 'leaf5',
title: '危害大坝安全或破坏大坝正常运行',
},
{
value: 'leaf3',
key: 'leaf6',
title: '在岸区或坝体从事生产活动',
},
],
@ -46,27 +46,75 @@ const treeData = [
],
},
];
let dataList = [];
const Page = () => {
const [value, setValue] = useState();
const [expandedKeys, setExpandedKeys] = useState([]);
const [searchValue, setSearchValue] = useState('');
const [autoExpandParent, setAutoExpandParent] = useState(true);
const filterTreeNode=useMemo((treeNode)=>{
console.log(1111111);
if (!value) return false;
return treeNode?._title?.indexOf(value) > -1;
},[value])
const onSearch =(e)=>{
setValue(e)
console.log(e);
const onExpand = (newExpandedKeys) => {
setExpandedKeys(newExpandedKeys);
setAutoExpandParent(false);
};
const onSearch = (value) => {
// const newExpandedKeys = dataList
// .map((item) => {
// if (item.title.indexOf(value) > -1) {
// return getParentKey(item.key, data);
// }
// return null;
// })
// .filter((item, i, self) => !!(item && self.indexOf(item) === i));
// setExpandedKeys(newExpandedKeys);
setSearchValue(value);
setAutoExpandParent(true);
};
const treeData = useMemo(() => {
const loop = (data) =>
data.map((item) => {
const strTitle = item.title;
const index = strTitle?.indexOf(searchValue);
const beforeStr = strTitle.substring(0, index);
const afterStr = strTitle.slice(index + searchValue.length);
const title =
index > -1 ? (
<span key={item.key}>
{beforeStr}
<span className="site-tree-search-value" style={{ color: 'red' }}>{searchValue}</span>
{afterStr}
</span>
) : (
<span key={item.key}>{strTitle}</span>
);
if (item.children) {
return { title, key: item.key, children: loop(item.children) };
}
if (index > -1) {
dataList.push(item.key)
setExpandedKeys(dataList);
}
return {
title,
key: item.key,
};
});
return loop(data);
}, [searchValue]);
return (
<>
<div style={{ margin: '10px 0' }}><Search onSearch={onSearch} /></div>
<Tree
defaultExpandAll={true}
blockNode={false}
onExpand={onExpand}
expandedKeys={expandedKeys}
treeData={treeData}
filterTreeNode={filterTreeNode}
autoExpandParent={autoExpandParent}
/>
</>
);