| | |
| | | <template> |
| | | <div class="sewers-search" v-if="gdVisible"> |
| | | <div class="search-title"> |
| | | 废气 |
| | | </div> |
| | | <div class="panel-title">{{title}}</div> |
| | | <div class="search-panel "> |
| | | <el-form ref="form" :model="form" label-width="90px" class="search-form"> |
| | | <el-form-item label="区域:" size="mini" class="search-panel-item"> |
| | |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="企业名称" size="mini"> |
| | | <el-form-item label="企业名称:" size="mini"> |
| | | <el-select style="width: 100%" v-model="form.enterpriseVal" @change="enterpriseType" :popper-class="'select-down'"> |
| | | <el-option |
| | | v-for="item in enterpriseTypeOptions" |
| | |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="二级单位" size="mini"> |
| | | <el-form-item label="二级单位:" size="mini"> |
| | | <el-select style="width: 100%" v-model="form.enterpriseSubunitsVal" @change="enterpriseSubunitsType" :popper-class="'select-down'"> |
| | | <el-option |
| | | v-for="item in enterpriseSubunitsTypeOptions" |
| | |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="三级单位" size="mini"> |
| | | <el-form-item label="三级单位:" size="mini"> |
| | | <el-select style="width: 100%" v-model="form.enterpriseSubunitsVal" @change="enterpriseSubunitsType" :popper-class="'select-down'"> |
| | | <el-option |
| | | v-for="item in enterpriseSubunitsTypeOptions" |
| | |
| | | <el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}</span></el-radio> |
| | | </el-radio-group> |
| | | <!-- <el-form-item >--> |
| | | <el-input v-model="form.keyword" size="mini" |
| | | placeholder="在此输入关键字搜索"> |
| | | <!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>--> |
| | | <!-- <i slot="prefix" class="el-input__icon el-icon-search"></i>--> |
| | | <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i> |
| | | </el-input> |
| | | <div class="rightButtonSearch"> |
| | | <el-input v-model="form.keyword" size="mini" placeholder="在此输入关键字搜索"> |
| | | <!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>--> |
| | | <!-- <i slot="prefix" class="el-input__icon el-icon-search"></i>--> |
| | | <!-- <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i> --> |
| | | </el-input> |
| | | <el-button class="el-icon-search" @click="handleSearch"></el-button> |
| | | </div> |
| | | <!-- </el-form-item>--> |
| | | <!-- <el-form-item>--> |
| | | <!-- <input type="button" class="btn-ok" @click="handleSearch" value="查询">--> |
| | |
| | | <!-- </el-form-item>--> |
| | | </el-form> |
| | | </div> |
| | | <el-scrollbar style="height:300px"> |
| | | <el-scrollbar style="height:264px"> |
| | | <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> |
| | | <i class="state"></i> |
| | | <div> |
| | |
| | | <p>风险级别:<span>三级</span></p> |
| | | </div> |
| | | </div> |
| | | <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> |
| | | <i class="state"></i> |
| | | <div> |
| | | <h3>###炼化部</h3> |
| | | <p>所属部门:<span>炼化部</span></p> |
| | | <p>风险级别:<span>三级</span></p> |
| | | </div> |
| | | </div> |
| | | <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> |
| | | <i class="state"></i> |
| | | <div> |
| | | <h3>###炼化部</h3> |
| | | <p>所属部门:<span>炼化部</span></p> |
| | | <p>风险级别:<span>三级</span></p> |
| | | </div> |
| | | </div> |
| | | <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> |
| | | <i class="state"></i> |
| | | <div> |
| | | <h3>###炼化部</h3> |
| | | <p>所属部门:<span>炼化部</span></p> |
| | | <p>风险级别:<span>三级</span></p> |
| | | </div> |
| | | </div> |
| | | <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> |
| | | <i class="state"></i> |
| | | <div> |
| | | <h3>###炼化部</h3> |
| | | <p>所属部门:<span>炼化部</span></p> |
| | | <p>风险级别:<span>三级</span></p> |
| | | </div> |
| | | </div> |
| | | <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> |
| | | <i class="state"></i> |
| | | <div> |
| | | <h3>###炼化部</h3> |
| | | <p>所属部门:<span>炼化部</span></p> |
| | | <p>风险级别:<span>三级</span></p> |
| | | </div> |
| | | </div> |
| | | |
| | | </el-scrollbar> |
| | | <!-- <span class="location-btn" @click="handleLocation(item)">588</span> --> |
| | | <el-card class="footer-page" v-if="total > 10"> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { PipelineTypeOptions } from '@/conf/layers/LayerSewers' |
| | | |
| | | import WfsHelper from '@components/helpers/WfsHelper' |
| | | import AjaxUtils from '@utils/AjaxUtils' |
| | | export default { |
| | | name: 'SewersSearch', |
| | | name: 'GasWasteSearch', |
| | | data () { |
| | | return { |
| | | gdVisible: true, |
| | | list: [], |
| | | labelList: PipelineTypeOptions[0].labelList, |
| | | total: 0, |
| | | inareaTypeOptions: [], |
| | | enterpriseTypeOptions: [], |
| | |
| | | { name: '正常', value: '2' }, |
| | | { name: '超标', value: '3' }, |
| | | { name: '异常', value: '4' }, |
| | | { name: '停产', value: '4' } |
| | | { name: '停产', value: '5' } |
| | | ] |
| | | } |
| | | }, |
| | |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | .levelOfRisk-type{ |
| | | display: inline-block; |
| | | position: relative; |
| | | padding-right: 5px; |
| | | color:#f5f5f5; |
| | | i{ |
| | | display: block; |
| | | width: 15px; |
| | | height: 10px; |
| | | position: absolute; |
| | | top:50%; |
| | | right: -15px; |
| | | margin-top: -5px; |
| | | } |
| | | } |
| | | .el-radio.is-checked .levelOfRisk-type{color:#409EFF} |
| | | .levelOfRisk{padding-left:20px} |
| | | .levelOfRisk .el-radio{padding-bottom:6px} |
| | | .environmental-risk-list{ |
| | | border:1px solid @color; |
| | | margin-right: 10px; |
| | | margin-bottom: 15px; |
| | | position: relative; |
| | | padding-left:50px; |
| | | padding-top:3px; |
| | | padding-bottom:3px; |
| | | color: #f5f5f5; |
| | | .state{ |
| | | width: 30px; |
| | | height: 30px; |
| | | position: absolute; |
| | | top:50%; |
| | | left:10px; |
| | | margin-top: -15px; |
| | | border-radius: 50%; |
| | | box-shadow: 0 0 3px #000; |
| | | background: #0B3B6D; |
| | | } |
| | | } |
| | | /******************以下公共部分**********/ |
| | | .sewers-search{ |
| | | position: relative; |
| | | overflow: hidden; |
| | | .search-panel{ |
| | | background-color: transparent; |
| | | border: 1px solid @background-color-split; |
| | | padding: 10px; |
| | | |
| | | /deep/ input { |
| | | border-radius: 0; |
| | | background-color: @background-color-split ; |
| | | border: solid 1px @color ; |
| | | color: @color-gray; |
| | | font-size: 0.01rem; |
| | | .el-select .el-input.is-focus .el-input__inner{ |
| | | border-color: @color; |
| | | } |
| | | } |
| | | /deep/ input:focus{ |
| | | border-color: @color; |
| | | } |
| | | } |
| | | .search-btn{ |
| | | |
| | | } |
| | | //location-btn{ |
| | | // |
| | | //} |
| | | .location-btn:hover,.el-input__icon:hover{ |
| | | color: @color; |
| | | cursor: pointer; |
| | | } |
| | | .el-radio { |
| | | margin-right: 8px!important; |
| | | } |
| | | } |
| | | </style> |