Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
S
station-elec-manage-view
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
station
station-elec-manage-view
Commits
7815ce43
Commit
7815ce43
authored
May 26, 2020
by
zhengjiangtao
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
日常训练模块
parent
fe9793bb
Hide whitespace changes
Inline
Side-by-side
Showing
7 changed files
with
1484 additions
and
7 deletions
+1484
-7
asyncView.js
src/routes/asyncView.js
+6
-2
view.js
src/routes/view.js
+5
-3
index.scss
src/styles/view/index.scss
+4
-2
dailyTrain.scss
src/styles/view/monitor/dailyTrain.scss
+322
-0
DailyTrainLeft.js
src/view/monitor/dailyTrain/DailyTrainLeft.js
+577
-0
DailyTrainRight.js
src/view/monitor/dailyTrain/DailyTrainRight.js
+546
-0
index.js
src/view/monitor/dailyTrain/index.js
+24
-0
No files found.
src/routes/asyncView.js
View file @
7815ce43
...
...
@@ -10,6 +10,8 @@ const AsyncRegulate = props => <AsyncLoader load={import('../view/monitor/regula
const
AsyncBills
=
props
=>
<
AsyncLoader
load
=
{
import
(
'../view/biz/regulate/bills'
)}
componentProps
=
{
props
}
/>
;
const
AsyncRootBizView
=
props
=>
<
AsyncLoader
load
=
{
import
(
'./../view/biz/index'
)}
componentProps
=
{
props
}
/>
;
const
AsyncSafetyTraining
=
props
=>
<
AsyncLoader
load
=
{
import
(
'../view/monitor/safetyManage/index'
)}
componentProps
=
{
props
}
/>
;
const
AsyncDaliyTraining
=
props
=>
<
AsyncLoader
load
=
{
import
(
'../view/monitor/dailyTrain/index'
)}
componentProps
=
{
props
}
/>
;
// const AsyncRegionList = props => <AsyncLoader load={import('./../view/common/region/index')} componentProps={props} />;
const
Routes
=
{
...
...
@@ -18,12 +20,14 @@ const Routes = {
situation
:
AsyncSituation
,
regulate
:
AsyncRegulate
,
bills
:
AsyncBills
,
safetyTraining
:
AsyncSafetyTraining
safetyTraining
:
AsyncSafetyTraining
,
dailyTrain
:
AsyncDaliyTraining
};
export
const
businessRouts
=
[
{
path
:
'situation'
,
group
:
'biz'
,
component
:
AsyncSituation
,
childRoutes
:
[]
},
{
path
:
'safetyTraining'
,
group
:
'biz'
,
component
:
AsyncSafetyTraining
,
childRoutes
:
[]
},
{
path
:
'bills'
,
group
:
'biz'
,
component
:
AsyncBills
,
childRoutes
:
[]
}
{
path
:
'bills'
,
group
:
'biz'
,
component
:
AsyncBills
,
childRoutes
:
[]
},
{
path
:
'dailyTrain'
,
group
:
'biz'
,
component
:
AsyncDaliyTraining
,
childRoutes
:
[]
}
];
const
pageCompontent
=
key
=>
{
return
Routes
[
key
]
||
AsyncEmptyPage
;
...
...
src/routes/view.js
View file @
7815ce43
...
...
@@ -6,8 +6,8 @@ import Regulate from '../view/monitor/regulate';
import
Bills
from
'../view/biz/regulate/bills'
;
import
RootBizView
from
'./../view/biz/index'
;
import
EmptyPage
from
'./../view/common/emptyPage/EmptyPage'
;
import
SafetyTraining
from
'./../view/monitor/safetyManage/index'
;
import
DaliyTraining
from
'./../view/monitor/dailyTrain/index'
;
const
Routes
=
{
main
:
RootView
,
...
...
@@ -15,12 +15,14 @@ const Routes = {
situation
:
Situation
,
regulate
:
Regulate
,
bills
:
Bills
,
safetyTraining
:
SafetyTraining
safetyTraining
:
SafetyTraining
,
dailyTrain
:
DaliyTraining
};
export
const
businessRouts
=
[
{
path
:
'situation'
,
group
:
'biz'
,
component
:
Situation
,
childRoutes
:
[]
},
{
path
:
'bills'
,
group
:
'biz'
,
component
:
Bills
,
childRoutes
:
[]
},
{
path
:
'safetyTraining'
,
group
:
'biz'
,
component
:
SafetyTraining
,
childRoutes
:
[]
}
{
path
:
'safetyTraining'
,
group
:
'biz'
,
component
:
SafetyTraining
,
childRoutes
:
[]
},
{
path
:
'dailyTrain'
,
group
:
'biz'
,
component
:
DaliyTraining
,
childRoutes
:
[]
}
];
const
pageCompontent
=
key
=>
{
return
Routes
[
key
]
||
EmptyPage
;
...
...
src/styles/view/index.scss
View file @
7815ce43
...
...
@@ -10,6 +10,8 @@
// 导入amos-pro
@import
'~amos-pro/dist/amospro.css'
;
@import
'~ray-progress/assets/progress.css'
;
//安全培训
@import
'./monitor/safetyTrain.scss'
;
@import
'./monitor/table.scss'
@import
'./monitor/table.scss'
;
//日常训练
@import
'./monitor/dailyTrain.scss'
;
src/styles/view/monitor/dailyTrain.scss
0 → 100644
View file @
7815ce43
.dailyTrain-safety
{
position
:
absolute
;
height
:
100%
;
width
:
100%
;
background-image
:
url('/src/assets/safetyManage/bjt.png')
;
background-repeat
:
no-repeat
;
.dailyTrain-safty-content
{
height
:
100%
;
.dailyTrain-top
{
height
:
2%
;
width
:
100%
;
}
.dailyTrain-bottom
{
height
:
93%
;
width
:
100%
;
position
:
relative
;
.dailyTrain-bottom-left
{
height
:
98%
;
width
:
47%
;
position
:
absolute
;
left
:
2
.6%
;
border
:
2px
solid
rgba
(
0
,
185
,
255
,
0
.3
);
.dailyTrain-bottom-left-content
{
height
:
100%
;
.one-div
{
height
:
9%
;
// border:2px solid blue;
width
:
100%
;
display
:
flex
;
background
:
#222b51
!
important
;
.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-select-style
{
background
:rgba
(
0
,
185
,
255
,
0
.3
)
;
opacity
:
1
;
border-radius
:
17px
;
background
:rgba
(
0
,
185
,
255
,
0
.3
)
;
}
}
.search-three
{
position
:
relative
;
height
:
100%
;
width
:
41%
;
top
:
29%
;
margin-left
:
-3%
;
.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
)
}
}
}
.two-div
{
height
:
91%
;
// border:2px solid green;
}
}
}
.dailyTrain-bottom-right
{
height
:
98%
;
width
:
47%
;
left
:
51%
;
border
:
2px
solid
rgba
(
0
,
185
,
255
,
0
.3
);
position
:
absolute
;
.dailyTrain-bottom-right-content
{
height
:
100%
;
.one-div
{
height
:
9%
;
// border:2px solid blue;
width
:
100%
;
display
:
flex
;
background
:
#222b51
!
important
;
.content-font-wenzi
{
font-size
:
10px
;
font-family
:
Microsoft
YaHei
;
font-weight
:bold
;
// line-height:50px;
color
:rgba
(
225
,
231
,
232
,
1
)
;
display
:
inline-block
;
margin-top
:
4%
;
margin-left
:
4%
;
}
}
.two-div
{
height
:
91%
;
// border:2px solid green;
.ant-table-content
{
height
:
100%
;
//滚动条特殊调整
.ant-table-body
{
// max-height: 500px !important ;
overflow-y
:
scroll
!
important
;
background
:transparent
!
important
;
table
{
width
:
300px
;
border-color
:
transparent
!
important
;
td
{
border-color
:
transparent
!
important
;
}
}
}
}
}
}
}
}
}
}
\ No newline at end of file
src/view/monitor/dailyTrain/DailyTrainLeft.js
0 → 100644
View file @
7815ce43
import
React
,
{
Component
}
from
'react'
;
import
ReactEcharts
from
'amos-viz/lib/echarts'
;
import
{
Table
}
from
'amos-antd'
;
import
AmosGridTable
from
'./../safetyManage/AmosGridTable'
;
import
{
Input
,
Button
}
from
'amos-antd'
;
import
{
DatePicker
}
from
'amos-antd'
;
import
moment
from
'moment'
;
import
dt2react
from
'dt2react'
;
const
dateFormatList
=
[
'DD/MM/YYYY'
,
'DD/MM/YY'
];
const
{
RangePicker
}
=
DatePicker
;
const
dateFormat
=
'YYYY/MM/DD'
;
const
monthFormat
=
'YYYY/MM'
;
import
{
Select
}
from
'amos-framework'
;
const
Option
=
Select
.
Option
;
const
Search
=
Input
.
Search
;
const
columns
=
[
{
title
:
'序号'
,
dataIndex
:
'key'
,
width
:
'10%'
,
align
:
'center'
,
// 设置文本居中的属性
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'换流站名称'
,
width
:
'20%'
,
dataIndex
:
'name'
,
render
:
val
=>
<
span
style
=
{{
color
:
"yellow"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'科目数'
,
width
:
'10%'
,
dataIndex
:
'kemu'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'次数'
,
width
:
'10%'
,
dataIndex
:
'cishu'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'参加人员'
,
width
:
'10%'
,
dataIndex
:
'cjry'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'人员达标率'
,
width
:
'20%'
,
dataIndex
:
'rydbl'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'最近培训时间'
,
width
:
'20%'
,
dataIndex
:
'date'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
}
];
const
data
=
[
{
key
:
'1'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'2'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'3'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'4'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'5'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'6'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'7'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'8'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'9'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'10'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'11'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'12'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'13'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'14'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'15'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'16'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'17'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'18'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'19'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'20'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'21'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'22'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'23'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'225'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'25'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'26'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'27'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'28'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
},
{
key
:
'29'
,
name
:
'复龙换流站'
,
kemu
:
3
,
cishu
:
4
,
cjry
:
5
,
rydbl
:
'50%'
,
date
:
"2019-01-01"
}
];
const
selectdata
=
[
{
id
:
0
,
name
:
'消防理论知识培训'
},
{
id
:
1
,
name
:
'消防技能培训'
},
{
id
:
3
,
name
:
'设备器材维护管理'
},
{
id
:
4
,
name
:
'火灾隐患管理'
},
{
id
:
5
,
name
:
'用火用电管理'
}
];
//偏移
const
offsetHeight
=
110
;
const
defaultHeight
=
450
;
/**
* 日常训练左侧
*/
class
DailyTrainyLeft
extends
Component
{
constructor
(
props
)
{
super
(
props
);
this
.
pageConfig
=
{
current
:
1
,
pageSize
:
14
};
this
.
state
=
{
data
:
[],
loading
:
false
,
equimentId
:
null
,
pagination
:
true
,
isChecked
:
false
,
selectedRows
:
[],
selectedRowKeys
:
[],
dataList
:
[],
newDataList
:[],
totalCount
:
0
,
searchParam
:
''
,
fname
:
''
,
current
:
1
,
pageSize
:
10
,
total
:
0
,
tableHeight
:
450
};
}
componentDidMount
()
{
const
{
pagination
}
=
this
.
state
;
debugger
var
box1
=
document
.
getElementById
(
"dailyTrain-bottom-left"
);
var
box2
=
document
.
getElementById
(
"one-div"
);
if
(
box1
&&
box2
){
//此处在加一层判断,更加严密,如果box存在的情况下获取
console
.
log
(
box1
.
offsetHeight
);
console
.
log
(
box2
.
offsetHeight
);
this
.
setState
({
tableHeight
:(
box1
.
offsetHeight
-
box2
.
offsetHeight
)
})
}
}
onChange
=
(
value
,
item
)
=>
{
debugger
console
.
log
(
value
,
item
);
}
onTimeChange
=
(
value
,
dateString
)
=>
{
console
.
log
(
'Selected Time: '
,
value
);
console
.
log
(
'Formatted Selected Time: '
,
dateString
);
}
onOk
=
(
value
)
=>
{
console
.
log
(
'onOk: '
,
value
);
}
onChangeSelect
=
(
value
,
item
)
=>
{
console
.
log
(
value
,
item
);
}
reload
=
r
=>
{
this
.
setState
(
{
reload
:
()
=>
{
r
();
this
.
setState
({
selectedRows
:
[],
selectedRowKeys
:
[]
});
}
},
r
()
);
};
getAcitonData
=
()
=>
{
this
.
setState
({
data
:
data
})
}
/**
* 分页设置参数
*/
setPageConfig
=
({
pageSize
,
current
})
=>
{
if
(
pageSize
!==
undefined
)
{
this
.
pageConfig
.
pageSize
=
pageSize
;
}
if
(
current
!==
undefined
)
{
this
.
pageConfig
.
pageNumber
=
current
;
}
};
/**
* 获取表格所选则的行数据
*/
getSelectedRows
=
(
selectedRows
,
selectedRowKeys
)
=>
{
this
.
setState
({
selectedRows
,
selectedRowKeys
});
let
{
riskSourceId
,
equipmentId
,
callBack
}
=
this
.
props
;
// callBack(selectedRowKeys,riskSourceId,equipmentId);
};
searchData
=
()
=>
{
let
name
=
this
.
state
.
fname
;
alert
(
name
)
}
onChange
=
(
e
,
value
)
=>
{
this
.
setState
({
fname
:
value
});
}
getPanelHeight
=
()
=>
{
//计算表格高度
var
box1
=
document
.
getElementById
(
"dailyTrain-bottom-left"
);
if
(
box1
){
//此处在加一层判断,更加严密,如果box存在的情况下获取
return
box1
.
offsetHeight
*
0.91
}
};
SearchChange
=
(
value
)
=>
{
alert
(
value
)
}
rowClassName
=
(
record
,
index
)
=>
{
let
className
=
index
%
2
?
'back-01'
:
'back-02'
;
return
className
}
render
()
{
let
defaultPageConfig
=
this
.
pageConfig
;
const
{
current
,
pageSize
,
total
}
=
this
.
state
;
let
{
pagination
,
isChecked
,
fname
,
data
,
totalCount
,
selectedRowKeys
}
=
this
.
state
;
return
(
<
div
className
=
"dailyTrain-bottom-left"
id
=
"dailyTrain-bottom-left"
>
<
div
className
=
"dailyTrain-bottom-left-content"
>
<
div
className
=
"one-div"
id
=
"one-div"
>
<
div
className
=
"search-one"
>
{
/* <div className="search-one-button" onClick={this.searchData} /> */
}
<
div
className
=
"search-one-input"
>
<
Search
placeholder
=
"搜索"
onSearch
=
{
this
.
SearchChange
}
/
>
<
/div
>
<
/div
>
<
div
className
=
"search-two"
>
<
Select
className
=
"search-select-style"
data
=
{
selectdata
}
renderOption
=
{
item
=>
<
Option
value
=
{
item
.
id
}
>
{
item
.
name
}
<
/Option>
}
defaultOption
=
{
<
Option
>
请选择
<
/Option>
}
onChange
=
{
this
.
onChangeSelect
}
/
>
<
/div
>
<
div
className
=
"search-three"
>
<
span
className
=
"three-font"
>
日期
:
&
nbsp
;
&
nbsp
;
<
/span
>
<
DatePicker
placeholder
=
"年-月-日"
showTime
onChange
=
{
this
.
onTimeChange
}
style
=
{{
width
:
'37%'
}}
onOk
=
{
this
.
onOk
}
/
>
{
/* <DatePicker defaultValue={moment('2015/01/01', dateFormat)} format={dateFormat} /> */
}
&
nbsp
;
&
nbsp
;
<
font
style
=
{{
color
:
'#5FFFFD'
}}
>
一
<
/font>  
;
<
DatePicker
placeholder
=
"年-月-日"
showTime
onChange
=
{
this
.
onTimeChange
}
style
=
{{
width
:
'37%'
}}
onOk
=
{
this
.
onOk
}
/
>
<
/div
>
<
/div
>
<
div
className
=
"two-div"
>
<
AmosGridTable
columns
=
{
columns
}
dataList
=
{
data
}
isPageable
=
{
pagination
}
totals
=
{
totalCount
}
callBack
=
{
this
.
reload
}
selectedRowKeys
=
{
selectedRowKeys
}
getSelectedRows
=
{
this
.
getSelectedRows
}
getTableDataAction
=
{
this
.
getAcitonData
}
isChecked
=
{
isChecked
}
setPageConfig
=
{
this
.
setPageConfig
}
defaultPageConfig
=
{
defaultPageConfig
}
getPanelHeight
=
{
this
.
getPanelHeight
}
rowClassName
=
{
this
.
rowClassName
}
/
>
<
/div
>
<
/div
>
<
/div
>
);
}
}
DailyTrainyLeft
.
propTypes
=
{
};
export
default
DailyTrainyLeft
;
src/view/monitor/dailyTrain/DailyTrainRight.js
0 → 100644
View file @
7815ce43
import
React
,
{
Component
}
from
'react'
;
import
ReactEcharts
from
'amos-viz/lib/echarts'
;
import
{
Table
}
from
'amos-antd'
;
import
AmosGridTable
from
'./../safetyManage/AmosGridTable'
;
import
{
Input
,
Button
}
from
'amos-antd'
;
import
{
DatePicker
}
from
'amos-antd'
;
import
moment
from
'moment'
;
import
dt2react
from
'dt2react'
;
const
dateFormatList
=
[
'DD/MM/YYYY'
,
'DD/MM/YY'
];
const
{
RangePicker
}
=
DatePicker
;
const
dateFormat
=
'YYYY/MM/DD'
;
const
monthFormat
=
'YYYY/MM'
;
import
{
Select
}
from
'amos-framework'
;
const
Option
=
Select
.
Option
;
const
Search
=
Input
.
Search
;
const
columns
=
[
{
title
:
'序号'
,
dataIndex
:
'key'
,
width
:
'10%'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'训练科目'
,
width
:
'15%'
,
dataIndex
:
'xlkm'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'训练内容'
,
width
:
'15%'
,
dataIndex
:
'xlnr'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'训练时间'
,
width
:
'20%'
,
dataIndex
:
'xlsj'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'参加人数'
,
width
:
'10%'
,
dataIndex
:
'cjrs'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'达标条件'
,
width
:
'20%'
,
dataIndex
:
'dbtj'
,
render
:
val
=>
<
span
style
=
{{
color
:
"green"
}}
>
{
val
}
<
/span>
,
},
{
title
:
'达标率%'
,
width
:
'20%'
,
dataIndex
:
'dbl'
,
render
:
val
=>
<
span
style
=
{{
color
:
"white"
}}
>
{
val
}
<
/span>
,
}
];
const
data
=
[
{
key
:
'1'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'2'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'3'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'4'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'5'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'6'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'7'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'8'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'9'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'10'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'11'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'12'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'13'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'14'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'15'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'16'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'17'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'18'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'19'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'20'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'21'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'22'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'23'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'225'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'25'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'26'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'27'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'28'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
},
{
key
:
'29'
,
xlkm
:
'消防技能培训'
,
xlnr
:
"1500米长跑"
,
xlsj
:
'2019-01-01'
,
cjrs
:
4
,
dbtj
:
'队列整齐'
,
dbl
:
"60%"
}
];
const
selectdata
=
[
{
id
:
0
,
name
:
'消防理论知识培训'
},
{
id
:
1
,
name
:
'消防技能培训'
},
{
id
:
3
,
name
:
'设备器材维护管理'
},
{
id
:
4
,
name
:
'火灾隐患管理'
},
{
id
:
5
,
name
:
'用火用电管理'
}
];
//偏移
const
offsetHeight
=
110
;
const
defaultHeight
=
450
;
/**
* 日常训练右侧
*/
class
DailyTrainRight
extends
Component
{
constructor
(
props
)
{
super
(
props
);
this
.
pageConfig
=
{
current
:
1
,
pageSize
:
10
};
this
.
state
=
{
data
:
[],
loading
:
false
,
equimentId
:
null
,
pagination
:
true
,
isChecked
:
false
,
selectedRows
:
[],
selectedRowKeys
:
[],
dataList
:
[],
newDataList
:[],
totalCount
:
0
,
searchParam
:
''
,
fname
:
''
,
current
:
1
,
pageSize
:
10
,
total
:
0
,
tableHeight
:
450
};
}
componentDidMount
()
{
const
{
pagination
}
=
this
.
state
;
debugger
var
box1
=
document
.
getElementById
(
"dailyTrain-bottom-left"
);
var
box2
=
document
.
getElementById
(
"one-div"
);
if
(
box1
&&
box2
){
//此处在加一层判断,更加严密,如果box存在的情况下获取
console
.
log
(
box1
.
offsetHeight
);
console
.
log
(
box2
.
offsetHeight
);
this
.
setState
({
tableHeight
:(
box1
.
offsetHeight
-
box2
.
offsetHeight
)
})
}
}
onChange
=
(
value
,
item
)
=>
{
debugger
console
.
log
(
value
,
item
);
}
onTimeChange
=
(
value
,
dateString
)
=>
{
console
.
log
(
'Selected Time: '
,
value
);
console
.
log
(
'Formatted Selected Time: '
,
dateString
);
}
onOk
=
(
value
)
=>
{
console
.
log
(
'onOk: '
,
value
);
}
onChangeSelect
=
(
value
,
item
)
=>
{
console
.
log
(
value
,
item
);
}
reload
=
r
=>
{
this
.
setState
(
{
reload
:
()
=>
{
r
();
this
.
setState
({
selectedRows
:
[],
selectedRowKeys
:
[]
});
}
},
r
()
);
};
getAcitonData
=
()
=>
{
this
.
setState
({
data
:
data
})
}
/**
* 分页设置参数
*/
setPageConfig
=
({
pageSize
,
current
})
=>
{
if
(
pageSize
!==
undefined
)
{
this
.
pageConfig
.
pageSize
=
pageSize
;
}
if
(
current
!==
undefined
)
{
this
.
pageConfig
.
pageNumber
=
current
;
}
};
/**
* 获取表格所选则的行数据
*/
getSelectedRows
=
(
selectedRows
,
selectedRowKeys
)
=>
{
this
.
setState
({
selectedRows
,
selectedRowKeys
});
let
{
riskSourceId
,
equipmentId
,
callBack
}
=
this
.
props
;
// callBack(selectedRowKeys,riskSourceId,equipmentId);
};
searchData
=
()
=>
{
let
name
=
this
.
state
.
fname
;
alert
(
name
)
}
onChange
=
(
e
,
value
)
=>
{
this
.
setState
({
fname
:
value
});
}
getPanelHeight
=
()
=>
{
// //计算表格高度
// var box1=document.getElementById("dailyTrain-bottom-right");
// if(box1){ //此处在加一层判断,更加严密,如果box存在的情况下获取
// return box1.offsetHeight * 0.91;
// }
return
300
};
SearchChange
=
(
value
)
=>
{
alert
(
value
)
}
rowClassName
=
(
record
,
index
)
=>
{
let
className
=
index
%
2
?
'back-01'
:
'back-02'
;
return
className
}
render
()
{
let
defaultPageConfig
=
this
.
pageConfig
;
const
{
current
,
pageSize
,
total
}
=
this
.
state
;
let
{
pagination
,
isChecked
,
fname
,
data
,
totalCount
,
selectedRowKeys
}
=
this
.
state
;
return
(
<
div
className
=
"dailyTrain-bottom-right"
id
=
"dailyTrain-bottom-right"
>
<
div
className
=
"dailyTrain-bottom-right-content"
>
<
div
className
=
"one-div"
>
<
div
className
=
" content-font-wenzi"
>
中州换流站
<
/div
>
<
/div
>
<
div
className
=
"two-div"
>
<
AmosGridTable
columns
=
{
columns
}
dataList
=
{
data
}
isPageable
=
{
pagination
}
totals
=
{
totalCount
}
callBack
=
{
this
.
reload
}
selectedRowKeys
=
{
selectedRowKeys
}
getSelectedRows
=
{
this
.
getSelectedRows
}
getTableDataAction
=
{
this
.
getAcitonData
}
isChecked
=
{
isChecked
}
setPageConfig
=
{
this
.
setPageConfig
}
defaultPageConfig
=
{
defaultPageConfig
}
getPanelHeight
=
{
this
.
getPanelHeight
}
rowClassName
=
{
this
.
rowClassName
}
/
>
<
/div
>
<
/div
>
<
/div
>
);
}
}
DailyTrainRight
.
propTypes
=
{
};
export
default
DailyTrainRight
;
src/view/monitor/dailyTrain/index.js
0 → 100644
View file @
7815ce43
import
React
,
{
Component
}
from
'react'
;
import
DailyTrainyLeft
from
'./DailyTrainLeft'
;
import
DailyTrainRight
from
'./DailyTrainRight'
;
/**
* 日常训练模块
*/
export
default
class
DailyTrain
extends
Component
{
render
()
{
return
(
<
div
className
=
"dailyTrain-safety"
>
<
div
className
=
"dailyTrain-safty-content"
>
<
div
className
=
"dailyTrain-top"
><
/div
>
<
div
className
=
"dailyTrain-bottom"
>
<
DailyTrainyLeft
/>
<
DailyTrainRight
/>
<
/div
>
<
/div
>
<
/div
>
);
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment