|
@@ -207,7 +207,7 @@
|
|
|
<el-tab-pane label="预警列表" name="2">
|
|
<el-tab-pane label="预警列表" name="2">
|
|
|
<div class="chart-contaier yhbox">
|
|
<div class="chart-contaier yhbox">
|
|
|
<div style="width: 100%;">
|
|
<div style="width: 100%;">
|
|
|
- <el-select v-model="industry" placeholder="请选择行业" class="sj-select-50" style="margin-left: 5px;" popper-class="sj-s-pop">
|
|
|
|
|
|
|
+ <el-select v-model="industry" placeholder="请选择行业" class="sj-select-50" style="margin-right: 5px;" popper-class="sj-s-pop">
|
|
|
<el-option v-for="item in industryList" :key="item.value" :label="item.label"
|
|
<el-option v-for="item in industryList" :key="item.value" :label="item.label"
|
|
|
:value="item.value">
|
|
:value="item.value">
|
|
|
</el-option>
|
|
</el-option>
|
|
@@ -219,21 +219,22 @@
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</div>
|
|
</div>
|
|
|
<div style="width: 100%;">
|
|
<div style="width: 100%;">
|
|
|
- <el-input placeholder="请输入事件名称" suffix-icon="el-icon-search" v-model="eventName" class="sj-input-style "></el-input>
|
|
|
|
|
|
|
+ <el-input placeholder="请输入事件名称" suffix-icon="el-icon-search" v-model="eventName"
|
|
|
|
|
+ class="sj-input-style sj-select-50" style="margin-right: 5px;"></el-input>
|
|
|
<el-select v-model="eventStatus" placeholder="请选择催办督办" class="sj-select-50" popper-class="sj-s-pop">
|
|
<el-select v-model="eventStatus" placeholder="请选择催办督办" class="sj-select-50" popper-class="sj-s-pop">
|
|
|
<el-option v-for="item in eventStatusList" :key="item.value" :label="item.label"
|
|
<el-option v-for="item in eventStatusList" :key="item.value" :label="item.label"
|
|
|
:value="item.value">
|
|
:value="item.value">
|
|
|
</el-option>
|
|
</el-option>
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="list-ul-style-tit list-ul-100-tit">
|
|
|
|
|
|
|
+ <div class="list-ul-style-tit list-ul-100-tit" style="width: 100%;">
|
|
|
<span style="width: 80%;">事件名称</span>
|
|
<span style="width: 80%;">事件名称</span>
|
|
|
<span style="width: 80px;">催办情况</span>
|
|
<span style="width: 80px;">催办情况</span>
|
|
|
<span style="width: 80px;">督办情况</span>
|
|
<span style="width: 80px;">督办情况</span>
|
|
|
<span style="width: 80px;">处理情况</span>
|
|
<span style="width: 80px;">处理情况</span>
|
|
|
<span style="width: 55px;">定位</span>
|
|
<span style="width: 55px;">定位</span>
|
|
|
</div>
|
|
</div>
|
|
|
- <ul class="list-ul-style list-ul-100" style="height:350px!important; overflow-y:scroll ; ">
|
|
|
|
|
|
|
+ <ul class="list-ul-style list-ul-100" style="height:350px!important; overflow-y:scroll;width: 100%; ">
|
|
|
<li v-for="item in eventList" :key="item.id" @click="openEventDetail(item)">
|
|
<li v-for="item in eventList" :key="item.id" @click="openEventDetail(item)">
|
|
|
<span style="width: 80%;">{{ item.eventTitle }}</span>
|
|
<span style="width: 80%;">{{ item.eventTitle }}</span>
|
|
|
<span style="width: 80px;">{{ item.expediteStatusLabel}}</span>
|
|
<span style="width: 80px;">{{ item.expediteStatusLabel}}</span>
|
|
@@ -735,290 +736,7 @@ export default {
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
|
-.eventDialog {
|
|
|
|
|
- width: 97%;
|
|
|
|
|
- height: 95%;
|
|
|
|
|
- border-radius: 10px;
|
|
|
|
|
|
|
|
|
|
- .el-dialog__body {
|
|
|
|
|
- height: 93%;
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .transferBg {
|
|
|
|
|
- padding: 15px 0 0 15px;
|
|
|
|
|
- background: linear-gradient(to bottom, rgba(15, 42, 58, 0.9), rgba(35, 42, 48, .9));
|
|
|
|
|
- border-radius: 10px;
|
|
|
|
|
- h3{
|
|
|
|
|
- padding-left: 20px;
|
|
|
|
|
- background: url("../../assets/gas/leftlist_btn.png") no-repeat 0px 0px;
|
|
|
|
|
- background-size: 12px 15px;
|
|
|
|
|
- font-size: 16px;
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- }
|
|
|
|
|
- .spsb_xx{
|
|
|
|
|
- display: flex;
|
|
|
|
|
- height: 130px;
|
|
|
|
|
- border-radius: 10px;
|
|
|
|
|
- padding-left: 3%;
|
|
|
|
|
- .spsb_text{
|
|
|
|
|
- width: 60%;
|
|
|
|
|
- height: 100%;
|
|
|
|
|
- padding: 5px;
|
|
|
|
|
- border-color: #22BCF3;
|
|
|
|
|
- background: #14375A;
|
|
|
|
|
- border-radius: 4px;
|
|
|
|
|
- outline: 0px;
|
|
|
|
|
- border-radius: 10px;
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- line-height: 25px;
|
|
|
|
|
- }
|
|
|
|
|
- .btn_option{
|
|
|
|
|
- width: 40%;
|
|
|
|
|
- height: 100%;
|
|
|
|
|
- .el-button{
|
|
|
|
|
- width: 70%;
|
|
|
|
|
- height: 20%;
|
|
|
|
|
- margin: 2.5% 0 0 15% !important;
|
|
|
|
|
- background-color: #14375A !important;
|
|
|
|
|
- border: 1px solid #475b93 !important;
|
|
|
|
|
- color:#fff;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .xczk_div{
|
|
|
|
|
- margin-top: 15px!important;
|
|
|
|
|
- div{
|
|
|
|
|
- font-size: 14px;
|
|
|
|
|
- line-height: 20px;
|
|
|
|
|
- color: #c9e3f3;
|
|
|
|
|
- padding-left: 19px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .continueForm_contain {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- width: 8vh;
|
|
|
|
|
- right: 3%;
|
|
|
|
|
- top: 10%;
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- background-color: #5bdddd;
|
|
|
|
|
- border-radius: 10px;
|
|
|
|
|
- border: 0px;
|
|
|
|
|
- outline: 0px;
|
|
|
|
|
- padding: 4px 0px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .d1 {
|
|
|
|
|
- height: 20%;
|
|
|
|
|
-
|
|
|
|
|
- .eventInfo_contain {
|
|
|
|
|
- display: flex;
|
|
|
|
|
- height: 60%;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
|
- margin-top: 1.5%;
|
|
|
|
|
- .sj_tit{
|
|
|
|
|
- font-size: 14px;
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- color: #22bcf3;
|
|
|
|
|
- }
|
|
|
|
|
- >div {
|
|
|
|
|
- width: 250px;
|
|
|
|
|
- color: #b9e5ff;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- >div:not(:nth-child(4n+1)) {
|
|
|
|
|
- margin-right: 5%;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .d2 {
|
|
|
|
|
- position: relative;
|
|
|
|
|
- width: 69%;
|
|
|
|
|
- height: 146px;
|
|
|
|
|
- margin-top: 1%;
|
|
|
|
|
-
|
|
|
|
|
- .progress_contain {
|
|
|
|
|
- height: 60%;
|
|
|
|
|
- margin-top: 1.5%;
|
|
|
|
|
-
|
|
|
|
|
- color: #c3e7ff;
|
|
|
|
|
- .line {
|
|
|
|
|
- width: 99%;
|
|
|
|
|
- height: 2px;
|
|
|
|
|
- margin-top: 3%;
|
|
|
|
|
- background-color: #09C2C4;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .e1 {
|
|
|
|
|
- width: 60px;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- bottom: 18%;
|
|
|
|
|
- left: 8%;
|
|
|
|
|
- div{
|
|
|
|
|
- height: 22px;
|
|
|
|
|
- line-height: 35px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .e2 {
|
|
|
|
|
- width: 60px;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- bottom: 18%;
|
|
|
|
|
- left: 32%;
|
|
|
|
|
- div{
|
|
|
|
|
- height: 22px;
|
|
|
|
|
- line-height: 35px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .e3 {
|
|
|
|
|
- width: 60px;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- bottom: 18%;
|
|
|
|
|
- left: 59%;
|
|
|
|
|
- div{
|
|
|
|
|
- height: 22px;
|
|
|
|
|
- line-height: 35px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .e4 {
|
|
|
|
|
- width: 60px;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- bottom: 18%;
|
|
|
|
|
- left: 86%;
|
|
|
|
|
- div{
|
|
|
|
|
- height: 22px;
|
|
|
|
|
- line-height: 35px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .z-lc-time {
|
|
|
|
|
- width: 120px;
|
|
|
|
|
- height: 23px;
|
|
|
|
|
- background: linear-gradient(0deg, #2A6DCD 0%, rgba(43, 96, 152, 0.5) 100%);
|
|
|
|
|
- border-radius: 50px;
|
|
|
|
|
- font-size: 12px;
|
|
|
|
|
- padding: 0 5px;
|
|
|
|
|
- line-height: 24px !important;
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- left: 55px;
|
|
|
|
|
- top: 15px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .z-clyj {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- left: 190px;
|
|
|
|
|
- top: 9px;
|
|
|
|
|
-
|
|
|
|
|
- img {
|
|
|
|
|
- width: 35px;
|
|
|
|
|
- height: 35px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .d3 {
|
|
|
|
|
- display: flex;
|
|
|
|
|
- height: 56%;
|
|
|
|
|
- margin-top: 1%;
|
|
|
|
|
-
|
|
|
|
|
- .video {
|
|
|
|
|
- width: 34%;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .mid {
|
|
|
|
|
- width: 34%;
|
|
|
|
|
- margin-left: 1.5%;
|
|
|
|
|
-
|
|
|
|
|
- .info {
|
|
|
|
|
- width: 48.5%;
|
|
|
|
|
- height: 48.5%;
|
|
|
|
|
- float: left;
|
|
|
|
|
-
|
|
|
|
|
- >div {
|
|
|
|
|
- margin-top: 2.5%;
|
|
|
|
|
- height: 76%;
|
|
|
|
|
-
|
|
|
|
|
- >div:not(:nth-child(1)) {
|
|
|
|
|
- margin-top: 2%;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .info_right {
|
|
|
|
|
- float: left;
|
|
|
|
|
- width: 48.5%;
|
|
|
|
|
- height: 48.5%;
|
|
|
|
|
- margin-left: 3%;
|
|
|
|
|
-
|
|
|
|
|
- >div {
|
|
|
|
|
- margin-top: 3%;
|
|
|
|
|
-
|
|
|
|
|
- >div:not(:nth-child(1)) {
|
|
|
|
|
- margin-top: 2%;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .pics {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 48.5%;
|
|
|
|
|
- float: left;
|
|
|
|
|
- margin-top: 2%;
|
|
|
|
|
-
|
|
|
|
|
- >div {
|
|
|
|
|
- overflow-x: auto;
|
|
|
|
|
- /* 横向滚动条 */
|
|
|
|
|
- overflow-y: hidden;
|
|
|
|
|
- /* 隐藏纵向滚动条 */
|
|
|
|
|
- white-space: nowrap;
|
|
|
|
|
- /* 防止换行(如果不是 flex) */
|
|
|
|
|
- display: flex;
|
|
|
|
|
- padding-top: 2%;
|
|
|
|
|
-
|
|
|
|
|
- img {
|
|
|
|
|
- flex-shrink: 0;
|
|
|
|
|
- width: 200px;
|
|
|
|
|
- height: 140px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- >img:not(:nth-child(1)) {
|
|
|
|
|
- margin-left: 3%;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .right {
|
|
|
|
|
- width: 30%;
|
|
|
|
|
- height: 140%;
|
|
|
|
|
- margin-left: 1.5%;
|
|
|
|
|
- margin-top: -168px;
|
|
|
|
|
- padding-right: 1%;
|
|
|
|
|
-
|
|
|
|
|
- >div {
|
|
|
|
|
- margin-top: 1.5%;
|
|
|
|
|
-
|
|
|
|
|
- >div:not(:nth-child(1)) {
|
|
|
|
|
- margin-top: 2%;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-.eventDialog .transferBg {
|
|
|
|
|
- background: -webkit-gradient(linear, left top, left bottom, from(rgba(16, 28, 45, 0.9)), to(rgba(3, 27, 49, 0.9)));
|
|
|
|
|
- background: linear-gradient(to bottom, rgb(16 28 45 / 90%), rgb(3 27 49 / 90%));
|
|
|
|
|
-}
|
|
|
|
|
-.eventDialog .d2 .progress_contain .line {
|
|
|
|
|
- background-color: #22bcf3;
|
|
|
|
|
-}
|
|
|
|
|
/*.shexiangTou{*/
|
|
/*.shexiangTou{*/
|
|
|
/*float: right;*/
|
|
/*float: right;*/
|
|
|
/*width: 13%;*/
|
|
/*width: 13%;*/
|
|
@@ -1077,13 +795,7 @@ export default {
|
|
|
display: block;
|
|
display: block;
|
|
|
margin-top: -11px !important;
|
|
margin-top: -11px !important;
|
|
|
}
|
|
}
|
|
|
-.eventDialog .transferBg {
|
|
|
|
|
- background: -webkit-gradient(linear, left top, left bottom, from(rgba(16, 28, 45, 0.9)), to(rgba(3, 27, 49, 0.9)));
|
|
|
|
|
- background: linear-gradient(to bottom, rgb(16 28 45 / 90%), rgb(3 27 49 / 90%));
|
|
|
|
|
-}
|
|
|
|
|
-.eventDialog .d2 .progress_contain .line {
|
|
|
|
|
- background-color: #22bcf3;
|
|
|
|
|
-}
|
|
|
|
|
|
|
+
|
|
|
.el-timeline-item__node {
|
|
.el-timeline-item__node {
|
|
|
background-color: #22bcf3;
|
|
background-color: #22bcf3;
|
|
|
-webkit-box-shadow: 0px 0px 5px #22bcf3;
|
|
-webkit-box-shadow: 0px 0px 5px #22bcf3;
|
|
@@ -1340,11 +1052,12 @@ export default {
|
|
|
width: 414px;
|
|
width: 414px;
|
|
|
height: 38px;
|
|
height: 38px;
|
|
|
background: url(../../assets/index_img/list-bg-img-t.png) no-repeat;
|
|
background: url(../../assets/index_img/list-bg-img-t.png) no-repeat;
|
|
|
|
|
+ background-size: 100%;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
margin-top: 10px !important;
|
|
margin-top: 10px !important;
|
|
|
- background-size: contain;
|
|
|
|
|
|
|
+ /*background-size: contain;*/
|
|
|
padding: 0 10px !important;
|
|
padding: 0 10px !important;
|
|
|
color: #a2d4ef;
|
|
color: #a2d4ef;
|
|
|
text-align: center;
|
|
text-align: center;
|
|
@@ -1367,11 +1080,22 @@ export default {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+.list-ul-100{
|
|
|
|
|
+ li{
|
|
|
|
|
+ width: 100% !important;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+.list-ul-100::-webkit-scrollbar{
|
|
|
|
|
+ width: 0px!important;
|
|
|
|
|
+ height: 0px!important;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
.list-ul-style {
|
|
.list-ul-style {
|
|
|
li {
|
|
li {
|
|
|
width: 410px;
|
|
width: 410px;
|
|
|
height: 50px;
|
|
height: 50px;
|
|
|
background: url(../../assets/index_img/list-bg-img-1.png) no-repeat;
|
|
background: url(../../assets/index_img/list-bg-img-1.png) no-repeat;
|
|
|
|
|
+ background-size: 100%;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
@@ -1402,6 +1126,7 @@ export default {
|
|
|
|
|
|
|
|
li:nth-child(2n) {
|
|
li:nth-child(2n) {
|
|
|
background: url(../../assets/index_img/list-bg-img-2.png) no-repeat;
|
|
background: url(../../assets/index_img/list-bg-img-2.png) no-repeat;
|
|
|
|
|
+ background-size: 100%;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
li:hover {
|
|
li:hover {
|