Skip to content

S
station-elec-manage-view
Commit bc4fd844 authored by zhengjiangtao's avatar zhengjiangtao
Browse files
Options

修改风险管控弹出框bug

parent 54590b1f
Hide whitespace changes
Inline Side-by-side
Showing with 263 additions and 105 deletions
src/styles/view/monitor/homePage.scss
View file @ bc4fd844
...@@ -148,9 +148,205 @@ ...@@ -148,9 +148,205 @@
height: 87% height: 87%
} }
} }
.sou{ .sou{
height: 10%; height: 10%;
width: 100%;
display: flex;
top: -2%;
position: relative;
.search-one {
height: 100%;
width: 30%;
position: relative;
text-align: center;
/* vertical-align: middle; */
top: 29%;
.search-one-button{
background-image: url('/src/assets/safetyManage/sousuo.png');
background-repeat: no-repeat !important;
right: 26%;
height: 20px;
position: relative;
width: 20px;
/* margin-top: 10%; */
margin-top: -1%;
float: right;
/* padding-left: 8%; */
top: 11%;
}
.search-one-input{
width: 100%;
.ant-input-affix-wrapper .ant-input-suffix{
position: absolute;
padding-right: 24px;
top: 50%;
transform: translateY(-50%);
line-height: 0;
color: rgba(0, 0, 0, 0.65);
}
.ant-input-affix-wrapper {
padding: 0;
margin: 0;
font-family: "Helvetica Neue For Number", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
font-variant: tabular-nums;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
list-style: none;
box-sizing: border-box;
position: relative;
display: inline-block;
width: 50;
padding-left: 24px;
padding-right: 24px;
}
.ant-input-search {
.anticon-search {
&::before {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/sousuo.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
top: 0px;
content: '' !important;
}
}
}
.ant-input {
// width: 10.7rem;
height: 30px;
// position: relative;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
opacity:1;
background: rgba(0,185,255,0.3) !important;
border-radius: 17px;
left: 34%;
.anticon:before {
margin-top: 1px;
}
border-color:rgba(0,185,255,0.3)
}
}
}
.search-two {
height: 100%;
width: 30%;
// border:2px solid red;
left: 2%;
position: relative;
top: 29%;
.amos-popover-trigger {
border-color:rgba(0,185,255,0.3);
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
opacity:1;
width: 74%;
}
.aficon-down:before {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/xiangxia.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
top: 4px;
content: '' !important;
}
} }
.search-three {
position: relative;
height: 100%;
width: 41%;
top: 29%;
margin-left: -3%;
.ant-calendar-picker {
width: 36% !important
}
.ant-calendar-picker-input{
background-color: rgba(0,185,255,0.3);
border-color:rgba(0,185,255,0.3)
}
.ant-input {
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
border-radius: 17px;
width: 102%;
}
.ant-calendar-picker-icon:after {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/rjd.png') no-repeat;
background-size: 100% 100%;
width: 18px;
height: 20px;
bottom: 4px;
right: -2px;
content: '' !important;
}
.three-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height: 23px;
color:rgba(255,255,255,1);
}
.ant-calendar-picker-icon{
// background-image: url('/src/assets/safetyManage/sousuo.png');
// background-repeat: no-repeat !important;
border-color:rgba(0,185,255,0.3)
}
}
} }
...@@ -160,27 +356,7 @@ ...@@ -160,27 +356,7 @@
border:1px solid rgba(240,242,243,1)!important; border:1px solid rgba(240,242,243,1)!important;
} }
.inputxq{
float: left;
width: 24%;
.amos-std-form.amos-std-form-right .amos-std-form-label {
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
color: rgba(240,242,243,1);
}
.ant-input {
color: rgba(240,242,243,1);
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
}
.amos-select-title {
color: rgba(240,242,243,1);
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 32px;
}
.amos-select-dropdown { .amos-select-dropdown {
background-color:rgba(0,185,255,0.3); background-color:rgba(0,185,255,0.3);
...@@ -232,31 +408,7 @@ ...@@ -232,31 +408,7 @@
} }
} }
.inputxq1{
margin-left: 2%;
float: left;
width: 24%;
.amos-std-form-content{
width: 100%;
}
.amos-search{
width: 80%;
}
.amos-search-inner{
background-color:rgba(0,185,255,0.3);
opacity:1;
border-radius: 17px;
height: 34px;
}
.amos-search-inner{
color: rgba(240,242,243,1);
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
}
}
.risk-model-model99{ .risk-model-model99{
......
src/view/monitor/statistical/RiskControlTable.js
View file @ bc4fd844
...@@ -3,13 +3,15 @@ ...@@ -3,13 +3,15 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Form, Input, Select, Radio,StdForm ,Search,Icon,AmosAlert} from 'amos-framework'; import { Form, Select, Radio,StdForm ,Icon,AmosAlert} from 'amos-framework';
import { TreeSelect, DatePicker } from 'amos-antd'; import { TreeSelect, DatePicker } from 'amos-antd';
import { Input, Button } from 'amos-antd';
import moment from 'moment'; import moment from 'moment';
import InputTable from './InputTable'; import InputTable from './InputTable';
import { SingleTable } from 'amos-pro'; import { SingleTable } from 'amos-pro';
const FormItem = Form.Item; const FormItem = Form.Item;
const Option = Select.Option; const Option = Select.Option;
const Search = Input.Search;
const tableList1 = [ const tableList1 = [
{ id: '1', name: '复龙换流站1', sex: '10', age: 10,age1: 30, address: '10' } , { id: '1', name: '复龙换流站1', sex: '10', age: 10,age1: 30, address: '10' } ,
...@@ -53,15 +55,15 @@ const data = [ ...@@ -53,15 +55,15 @@ const data = [
title: '换流站', title: '换流站',
dataIndex: 'name', dataIndex: 'name',
key: 'name', key: 'name',
width: '10%', width: '20%',
query: true, query: true,
}, },
{ {
title: '一级', title: <div style={{"color":"#48E0FF"}}>一级</div>,
dataIndex: 'sex', dataIndex: 'sex',
key: 'sex', key: 'sex',
width: '9%', width: '15%',
query: true, query: true,
required: true, //是否是默认显示的 required: true, //是否是默认显示的
render: (text,record) => { render: (text,record) => {
...@@ -73,10 +75,10 @@ const data = [ ...@@ -73,10 +75,10 @@ const data = [
}, },
{ {
title: '二级', title: <div style={{"color":"#F1F10C"}}>二级</div>,
dataIndex: 'age', dataIndex: 'age',
key: 'age', key: 'age',
width: '10%', width: '15%',
query: true, query: true,
required: true, //是否是默认显示的 required: true, //是否是默认显示的
render: (text,record) => { render: (text,record) => {
...@@ -86,10 +88,10 @@ const data = [ ...@@ -86,10 +88,10 @@ const data = [
}, },
{ {
title: '三级', title: <div style={{"color":"#FF8000"}}>三级</div>,
dataIndex: 'address', dataIndex: 'address',
key: 'address', key: 'address',
width: '10%', width: '15%',
query: true, query: true,
required: true, //是否是默认显示的 required: true, //是否是默认显示的
render: (text,record) => { render: (text,record) => {
...@@ -98,12 +100,12 @@ const data = [ ...@@ -98,12 +100,12 @@ const data = [
} }
}, },
{ {
title: '四级', title: <div style={{"color":"#FC2F1E"}}>四级</div>,
dataIndex: 'id', dataIndex: 'id',
key: 'id', key: 'id',
query: true, query: true,
required: true, //是否是默认显示的 required: true, //是否是默认显示的
width: '10%', width: '15%',
render: (text,record) => { render: (text,record) => {
return <p className="si">{text}</p> ; return <p className="si">{text}</p> ;
...@@ -116,7 +118,7 @@ const data = [ ...@@ -116,7 +118,7 @@ const data = [
query: true, query: true,
st: 'text', //搜索的类型 st: 'text', //搜索的类型
width: '10%' width: '20%'
} }
]; ];
...@@ -155,7 +157,7 @@ class RiskControlTable extends Component { ...@@ -155,7 +157,7 @@ class RiskControlTable extends Component {
}; };
componentWillReceiveProps = (nextProps) => { componentWillReceiveProps = (nextProps) => {
debugger
if (nextProps.refresh){ if (nextProps.refresh){
this.setState({ name:"" }); this.setState({ name:"" });
...@@ -191,6 +193,10 @@ class RiskControlTable extends Component { ...@@ -191,6 +193,10 @@ class RiskControlTable extends Component {
this.setState({ totals:5}); this.setState({ totals:5});
} }
onOk=(value) =>{
console.log('onOk: ', value);
}
...@@ -203,12 +209,10 @@ class RiskControlTable extends Component { ...@@ -203,12 +209,10 @@ class RiskControlTable extends Component {
onChange1 = (e, value) => { onChange1 = (e, value) => {
debugger
this.setState({ name:value }); this.setState({ name:value });
} }
onChange = (key, value) => { onChange = (key, value) => {
debugger
if(key==='startTime'){ if(key==='startTime'){
this.setState({ startTime: moment(value).format('YYYY-MM-DD')}); this.setState({ startTime: moment(value).format('YYYY-MM-DD')});
}else if(key==='endTime'){ }else if(key==='endTime'){
...@@ -218,6 +222,10 @@ class RiskControlTable extends Component { ...@@ -218,6 +222,10 @@ class RiskControlTable extends Component {
} }
} }
SearchChange = (value) => {
alert(value)
}
// renderEndTime(type) { // renderEndTime(type) {
...@@ -275,62 +283,60 @@ class RiskControlTable extends Component { ...@@ -275,62 +283,60 @@ class RiskControlTable extends Component {
render() { render() {
const { dataList,totals ,name,grade,endTime,startTime} = this.state; const { dataList,totals ,name,grade,endTime,startTime} = this.state;
debugger
return ( return (
<div className="souh" > <div className="souh" >
<div className="sou"> <div className="sou">
<div className="inputxq1"> <div className="search-one">
<StdForm > {/* <div className="search-one-button" onClick={this.searchData} /> */}
<Search value={name} className="input_item_select" icon={<Icon icon='search' onClick={ this.onIconClick1} />} onChange={ this.onChange1} /> <div className="search-one-input">
<Search placeholder="搜索" onSearch={this.SearchChange} />
</StdForm> </div>
</div>
<div className="inputxq">
<StdForm > </div>
<Select <div className="search-two" >
<Select className="search-select-style"
data={data} data={data}
value={grade} value={grade}
renderOption={item => <Option value={item.id}>{item.name}</Option>} renderOption={item => <Option value={item.id}>{item.name}</Option>}
onChange={(value4) => { this.onChange('grade', value4); }} onChange={(value4) => { this.onChange('grade', value4); }}
/> />
</StdForm>
</div>
<div className="inputxq"> </div>
<StdForm label="日期"> <div className="search-three">
<DatePicker <span className="three-font">日期:&nbsp;&nbsp;</span>
format="YYYY-MM-DD" <DatePicker
className="input_item_select" placeholder="年-月-日"
value={moment(startTime)} format="YYYY-MM-DD"
onChange={ e => this.onChange('startTime', e) } className="input_item_select"
allowClear={false} value={moment(startTime)}
/> style={{width:'37%'}}
onChange={ e => this.onChange('startTime', e) }
allowClear={false}
/>
</StdForm> {/* <DatePicker defaultValue={moment('2015/01/01', dateFormat)} format={dateFormat} /> */}
</div> &nbsp;&nbsp;<font style={{color:'#5FFFFD'}}>一</font>&nbsp;&nbsp;
<div className="inputxq"> <DatePicker
<StdForm label="至"> placeholder="年-月-日"
<DatePicker value={moment(endTime)}
value={moment(endTime)} format="YYYY-MM-DD"
format="YYYY-MM-DD" className="input_item_select"
className="input_item_select" onChange={ e => this.onChange('endTime', e)}
onChange={ e => this.onChange('endTime', e)} style={{width:'37%'}}
allowClear={false} allowClear={false}
/> />
</div>
</StdForm>
</div>
</div> </div>
<div className="inputxqtable"> <div className="inputxqtable">
<InputTable <InputTable
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment