From ae3da7e6c7e6916052e3de4f3fab0cfb73bf80c3 Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期三, 07 四月 2021 10:08:04 +0800 Subject: [PATCH] 天地图修改为一排 --- src/components/panel/topicSearch/WaterWasteSearch.vue | 183 ++++++++++++++++++++++++++++++--------------- 1 files changed, 121 insertions(+), 62 deletions(-) diff --git a/src/components/panel/topicSearch/WaterWasteSearch.vue b/src/components/panel/topicSearch/WaterWasteSearch.vue index 39bd33c..b332edf 100644 --- a/src/components/panel/topicSearch/WaterWasteSearch.vue +++ b/src/components/panel/topicSearch/WaterWasteSearch.vue @@ -1,69 +1,128 @@ <template> - <div class="solidwaste-search" v-if="judgeVisible"> - <div class="search-title"> - <span>搴熸按</span> - <!-- <span>{{ title }}</span>--> + <div class="query-search" v-if="judgeVisible"> + <div class="search-title">{{title}}</div> + <div class="search-panel "> + <el-form ref="form" :model="form" label-width="90px" class="search-form"> + <el-form-item v-for="(item,index) in solidWasteTypeOptions" :key="index" :label="item.label+'锛�'" size="mini" + class="search-panel-item"> + <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType" + :popper-class="'select-down'"> + <el-option + v-for="item in solidWasteTypeOptions" + :key="item.value" + :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <el-radio-group v-model="form.type" class="levelOfRisk"> + <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> + <div class="rightButtonSearch"> + <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input> + <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom> </div> - <div class="search-panel "> - <el-form ref="form" :model="form" label-width="90px" class="search-form"> - <el-form-item v-for="(item,index) in solidWasteTypeOptions" :key="index" :label="item.label+'锛�'" size="mini" - class="search-panel-item"> - <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType" - :popper-class="'select-down'"> - <el-option - v-for="item in solidWasteTypeOptions" - :key="item.value" - :label="item.label" - :value="item.value"> - </el-option> - </el-select> - </el-form-item> - <el-radio-group v-model="form.type" class="levelOfRisk"> - <el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}<i :style="'background:'+item.color"></i></span></el-radio> - </el-radio-group> - <div class="rightButtonSearch"> - <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input> - <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom> - </div> - </el-form> - <div> - <el-card class="box-card" v-for="(item,index) in searchDataDisplay" :key="index"> - <div v-if="total > 3"> - {{ item.CompanyName }} - </div> - </el-card> - <!-- <el-pagination--> - <!-- small--> - <!-- layout="prev, pager, next"--> - <!-- :total=total--> - <!-- :current-page=1--> - <!-- class="warnPagination"--> - <!-- >--> - <!-- </el-pagination>--> - </div> - <!-- <el-scrollbar style="height:100%">--> - <!-- <el-card class="footer-page">--> - <!-- <ul>--> - <!-- {{ searchDataDisplay }}--> - <!-- <li v-for="(item,index) in searchDataDisplay" :key="index">--> - <!-- {{ item.CompanyName }}--> - <!-- </li>--> - <!-- </ul>--> - <!-- </el-card>--> - <!-- <el-pagination--> - <!-- small--> - <!-- @current-change="handlePage"--> - <!-- :page-size=pageSize--> - <!-- layout="prev, pager, next"--> - <!-- :total=total--> - <!-- :current-page=current--> - <!-- class="warnPagination"--> - <!-- >--> - <!-- </el-pagination>--> - <!-- </el-card>--> - <!-- </el-scrollbar>--> + </el-form> + <el-scrollbar style="height:300px"> + <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> + <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> + <div> + <!-- <el-card class="box-card" v-for="(item,index) in searchDataDisplay" :key="index">--> + <!-- <div v-if="total > 3">--> + <!-- {{ item.CompanyName }}--> + <!-- </div>--> + <!-- </el-card>--> + <el-card class="footer-page" v-if="total > 10"> + <el-pagination + small + @current-change="handlePage" + :page-size=pageSize + layout="prev, pager, next" + :total=total + :current-page=current + class="warnPagination" + > + </el-pagination> + </el-card> + <!-- <el-pagination--> + <!-- small--> + <!-- layout="prev, pager, next"--> + <!-- :total=total--> + <!-- :current-page=1--> + <!-- class="warnPagination"--> + <!-- >--> + <!-- </el-pagination>--> + </div> + <!-- <el-scrollbar style="height:100%">--> + <!-- <el-card class="footer-page">--> + <!-- <ul>--> + <!-- {{ searchDataDisplay }}--> + <!-- <li v-for="(item,index) in searchDataDisplay" :key="index">--> + <!-- {{ item.CompanyName }}--> + <!-- </li>--> + <!-- </ul>--> + <!-- </el-card>--> + <!-- <el-pagination--> + <!-- small--> + <!-- @current-change="handlePage"--> + <!-- :page-size=pageSize--> + <!-- layout="prev, pager, next"--> + <!-- :total=total--> + <!-- :current-page=current--> + <!-- class="warnPagination"--> + <!-- >--> + <!-- </el-pagination>--> + <!-- </el-card>--> + <!-- </el-scrollbar>--> </div> + </div> </template> <script> -- Gitblit v1.8.0