From 4df0471b7dff0494625ff09969b1a13b5359a26e Mon Sep 17 00:00:00 2001 From: XingChuan <m17600301067@163.com> Date: 星期一, 31 五月 2021 22:41:47 +0800 Subject: [PATCH] 统计表弹框UI优化;增加点击企业名称缩放至企业;二级表展示功能优化。 --- src/views/popup/Popup.vue | 93 +++++++++++++++++++++++++++++++++------------- 1 files changed, 66 insertions(+), 27 deletions(-) diff --git a/src/views/popup/Popup.vue b/src/views/popup/Popup.vue index 83e359b..242aea0 100644 --- a/src/views/popup/Popup.vue +++ b/src/views/popup/Popup.vue @@ -1,48 +1,81 @@ <template> - <div v-if="isShow" class="s-map-popup-panel" > - - <div> - {{ data }} - </div> - <div> - {{ data }} - </div> - <br> - <br> - <div> - {{ data }} - </div> - <br> - <br> - - <div> - {{ data }} - </div> - <el-button type="primary" @click="onClick">涓昏鎸夐挳</el-button> + <div id="popup" class="s-map-popup-panel" style="min-width: 280px;max-width: 280px;padding: 0 10px"> + <el-tabs type="card" v-model="tabIndex" @tab-click="handleClick"> + <el-tab-pane + :key="index" + v-for="(item,index) in datas" + :label="item.title" + :name="index.toString()" + > + <el-row v-for="(item,key) in item.content" :key="key"> + <el-col :span="12"><B>{{key}}锛�</B></el-col> + <el-col :span="12">{{item}}</el-col> + </el-row> + <el-table v-if="item.tableList" + :data="item.tableList" + style="width: 100%"> + <el-table-column + prop="pipesegcode" + label="绠℃缂栫爜"> + </el-table-column> + <el-table-column + prop="startpointdepth" + label="璧风偣鍩嬫繁(m)"> + </el-table-column> + <el-table-column + prop="startpointz" + label="璧风偣楂樼▼(m)"> + </el-table-column> + </el-table> + </el-tab-pane> + </el-tabs> </div> </template> <script> // import '@/assets/css/map/map-popup.scss' + +import { highlight } from '../../components/helpers/LocateHelper' + export default { name: 'Popup', + props: ['datas'], data () { return { - + tabsValue: '', + tabIndex: 0, isShow: false, - data: '' + properties: {} } }, - + computed: { + }, methods: { + filter (content) { + var obj = {} + for (const key in content) { + if (this.props[key]) { + obj[this.props[key]] = content[key] + } + } + // console.log(obj) + return obj + }, setShow () { // this.style.display='auto' - this.data = 'adsfadfsadfsdafsdfsdfdsafsdafsdafa' this.isShow = true }, - onClick () { - const param = 1111 - this.$emit('callPopup', param) + handleClick (tab, event) { + const data = this.datas[this.tabIndex] + const feature = data.feature + highlight(feature) + } + }, + watch: { + datas (newVal) { + if (newVal != null) { + this.tabsValue = newVal[0].name + } } } } @@ -50,4 +83,10 @@ <style lang="less" > @import '../../assets/css/map/map-popup.less'; +#popup{ + .el-tabs__content{ + max-height: 240px; + overflow-y: scroll; + } +} </style> -- Gitblit v1.8.0