Commit c23f8259 authored by 张博's avatar 张博

弹框样式

parent e17d3cef
......@@ -20,17 +20,19 @@
.common-footer {
text-align: center;
background: transparent;//$core-color;
border: 1px solid $core-border-color;
border-radius: $core-border-radius;
// border: 1px solid $core-border-color;
// border-radius: $core-border-radius;
.common-footer-item {
display: inline-block;
width: $dialog-footer-width;
//width: $dialog-footer-width;
width: 100px;
height: $dialog-footer-height;
overflow: hidden;
cursor: pointer;
background: $dialog-footer-item-bg;
border: 1px solid $core-border-color;
padding-top: 10px;
background: transparent;
//border: 1px solid $core-border-color;
border-top: 0;
box-sizing: border-box;
......@@ -84,21 +86,32 @@
.dialog-body-min {
position: relative;
width: $dialog-min-width;
height: $dialog-height;
// width: $dialog-min-width;
// height: $dialog-height;
height:497px;
width: 866px !important;
min-width: $dialog-min-width;
color: black;
background: $content-color;
border: 1px solid $core-border-color;
border-radius: $core-border-radius;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
box-sizing: border-box;
//color: black;
// background: $content-color;
// border: 1px solid $core-border-color;
// border-radius: $core-border-radius;
// box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
// box-sizing: border-box;
background-image: url('./../assets/convertor/3dview/dialogbg.png');
background-color: rgba(25, 86, 147, 0.5);
.body-min-header {
position: relative;
height: 2.5rem;
margin-left: 1rem;
.dialog-min-title{
position: absolute;
line-height: 2.5rem;
padding-top: 1rem;
left: 9px;
font-size: 18px;
color: #fff;
}
.common-close {
position: absolute;
right: 0;
......@@ -112,6 +125,7 @@
}
.body-min-content {
margin-top: 2.5rem;
height: calc(35% - 50px - 2.5rem);
margin-right: 1rem;
margin-left: 1rem;
......@@ -122,6 +136,7 @@
margin-right: 1rem;
margin-left: 1rem;
.ant-table-title {
display: none;
}
......@@ -129,9 +144,11 @@
.ant-table-thead {
tr {
th {
color: $biz-table-font-color;
background: $biz-table-title-color;//rgba(40, 40, 40, 1);
border-color: $core-border-color;
// color: $biz-table-font-color;
// background: $biz-table-title-color;//rgba(40, 40, 40, 1);
// border-color: $core-border-color;
color:#fff;
background-color: transparent;
}
}
}
......@@ -139,18 +156,23 @@
.ant-table-body {
tr {
td {
color: $biz-table-font-color;//#ffffff;
background: $content-color;//rgba(51, 51, 51, 1);
border-color: $core-border-color;//#252525;
// color: $biz-table-font-color;//#ffffff;
// background: $content-color;//rgba(51, 51, 51, 1);
// border-color: $core-border-color;//#252525;
color:#fff;
background-color: transparent;
}
}
max-height: 273px !important;
overflow-y: scroll;
}
.ant-table-placeholder {
color: $biz-table-font-color;
background-color: $content-color;//rgba(40, 40, 40, 1);
//color: $biz-table-font-color;
//background-color: $content-color;//rgba(40, 40, 40, 1);
background-color: transparent;
color: #fff;
}
.highlight-row {
......
......@@ -110,7 +110,8 @@
display: inline;
font-size: 7px;
line-height: 40px;
color: $biz-table-font-color;//white;
//color: $biz-table-font-color;//white;
color:#fff;
.colTitle {
padding-left: 8px;
......@@ -124,21 +125,22 @@
display: flex;
border: 1px solid $core-border-color;
border-bottom: 0;
border-left: 0;
}
.point-detail-table-row2 {
display: flex;
border: 1px solid $core-border-color;
border-left: 0;
}
.colTitle {
float: left;
width: 131px;//9.84%;
height: 40px;
background: $biz-table-title-color;//#333;
border-left: 1px solid $core-border-color;
//background: $biz-table-title-color;//#333;
background: rgba(25, 86, 147, 1);
// border-left: 1px solid $core-border-color;
box-sizing: border-box;
flex: 1;
}
......@@ -147,12 +149,12 @@
float: left;
width: 131px;//9.83%;
height: 40px;
background: $content-color;//rgb(97, 96, 96);
//background: $content-color;//rgb(97, 96, 96);
background: transparent;
flex: 1;
border-left: 1px solid $core-border-color;
//border-left: 1px solid $core-border-color;
}
}
.point-dialog-modal{
width: 100%;
height: 100%;
......@@ -174,6 +176,7 @@
.amos-modal-title{
line-height: 30px;
padding-left: 9px;
}
}
.amos-modal-content{
......@@ -206,9 +209,29 @@
}
.risk-warn-modal{
height: 100%;
::-webkit-scrollbar { /* 血槽宽度 */
width: 14px;
height: 8px;
}
::-webkit-scrollbar-thumb { /* 拖动条 */
background-image: url('./../assets/convertor/3dview/control-track.png') ;
background-repeat: no-repeat;
height: 10px;
}
::-webkit-scrollbar-track { /* 背景槽 */
background-color:rgba(17, 44, 88, 0.2);
}
::-webkit-scrollbar-button{
background-image: url('./../assets/convertor/3dview/control-track.png') ;
}
height:100%;
.amos-modal-container{
width: 740px !important;
background-image: url('./../assets/convertor/3dview/modalbg.png');
height:497px;
width: 866px !important;
background-color: rgba(255,255,255,0);
.amos-modal-close{
color: white;
background: linear-gradient(180deg, rgba(255, 0, 102, 1) 0%, rgba(255, 0, 102, 1) 0%, rgba(255, 51, 0, 1) 100%, rgba(255, 51, 0, 1) 100%);
......@@ -219,37 +242,69 @@
}
}
.amos-modal-header{
background: $model-header-color-3d;
height: 30px;
background: rgba(255,255,255,0);
height: 50px;
padding: 0;
border-width: 0em;
.amos-modal-title{
line-height: 30px;
line-height: 50px;
padding-left: 9px;
color: #fff;
font-size: 18px;
}
}
.amos-modal-content{
padding: 1rem 2rem 2rem 2rem;
max-height: 45rem;
.risk-warn{
.risk-warn-header{
padding-bottom: 1rem;
padding-top: 0.5rem;
padding-left: 0.5rem;
border: 1px solid $core-border-color;
margin-bottom: 1rem;
color:#fff;
}
.risk-warn-table{
background-color: transparent;
.ant-table-title{
display: none;
}
span{
font-size: 14px;
}
.ant-table-placeholder {
//color: $biz-table-font-color;
//background-color: $content-color;//rgba(40, 40, 40, 1);
background-color: transparent;
color: #fff;
}
.ant-table-thead {
tr {
th {
color:#fff;
background-color: rgba(25, 86, 147, 1);
}
}
}
.ant-table-body {
tr {
td {
color:#fff;
background-color: transparent;
}
}
}
.ant-table-body{
max-height: 35rem !important;
background-color:transparent;
}
}
.risk-warn-content{
padding-bottom: 2rem;
border: 1px solid $core-border-color;
padding: 15px;
border: 1px solid rgba(255, 255, 255, 0.3);;
margin-top: 1rem;
margin-bottom: 2em;
span{
color: #fff;
}
}
}
}
......
......@@ -13,7 +13,7 @@ const Footer = props => {
return (
<div key={f.key} className={cls} onClick={(e) => onItemClick(f.key, e)}>
<Icon icon={f.icon} />
<p className="footer-item-text">{f.text}</p>
<span className="footer-item-text">{f.text}</span>
</div>
);
})
......
......@@ -235,14 +235,14 @@ class AmosGridTable extends Component {
</div>
)}
rowKey={isTreeTable ? 'key' : this.generateRowkey}
loading={loading}
rowSelection={rowSelection}
columns={columns}
dataSource={dataList}
//dataSource={dataList}
dataSource={[{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{}]}
pagination={_pagination}
size={size}
bordered={bordered}
scroll={{ y: maxHeight }}
rowClassName={rowClassName}
onRowDoubleClick={onRowDoubleClick}
/>
......
......@@ -9,6 +9,7 @@ class MinInfo extends Component {
return (
<div className="dialog-body-min">
<div className="body-min-header">
<div className='dialog-min-title'>巡检触发预警详情</div>
<Close onClose={onClose} />
</div>
<div className="body-min-content">
......
......@@ -42,7 +42,7 @@ const checkListColumns = (self) => {
key: 'status',
width: '10%',
render: function( text, record, index) {
return <span><a href="javascript:;" onClick={function() { self.onCheckStatusClick(record)} }>{text}</a></span>;
return <span ><a href="javascript:;" onClick={function() { self.onCheckStatusClick(record)} } style={{color:'rgba(255, 173, 0, 1)'}}>{text}</a></span>;
}
}
];
......@@ -76,19 +76,19 @@ class RiskContentTable extends Component {
onCheckStatusClick =(record)=>{
this.props.onCheckStatusClick(record);
}
render() {
const { dataList,fetchData } = this.props;
return (
<div>
<AmosGridTable
columns={checkListColumns(this)}
getTableDataAction={()=>{}}
callBack={this.reload}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable = {false}
isChecked = {false}
dataList={dataList}
/>
/>
</div>
);
}
......
......@@ -73,7 +73,7 @@ class RiskWarnModal extends Component {
</p>
});
}
renderEquipWaring =(alarm)=>{
return alarm.map(item =>{
return <p>
......@@ -82,11 +82,11 @@ class RiskWarnModal extends Component {
</p>
});
}
render() {
const { dataList =[], riskSourceInfo={}, inputitemContent=[], alarm =[]} = this.state;
const {code, level ,name } = riskSourceInfo;
const {code, level ,name } = riskSourceInfo;
return (
<div className = "risk-warn">
<div className = "risk-warn-header">
......@@ -102,12 +102,12 @@ class RiskWarnModal extends Component {
<div className = "risk-warn-table">
<AmosGridTable
columns={checkListColumns(this)}
getTableDataAction={()=>{}}
callBack={this.reload}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable = {false}
isChecked = {false}
dataList={dataList}
/>
/>
</div>
<div className = "risk-warn-content">
<p>
......
This diff is collapsed.
This diff is collapsed.
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