From 3b755f9a00e7b8e84a3487dd0f81b91c66abb582 Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期五, 21 十月 2022 14:40:19 +0800 Subject: [PATCH] test --- src/components/mapsdk.vue | 186 ++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 186 insertions(+), 0 deletions(-) diff --git a/src/components/mapsdk.vue b/src/components/mapsdk.vue index 3d51d8e..1b00353 100644 --- a/src/components/mapsdk.vue +++ b/src/components/mapsdk.vue @@ -49,10 +49,68 @@ </div> </el-card> </div> + <div class="toponymicLocalBox" v-if="showToponymicLocalBoxDialog"> + <el-card class="box-card"> + <div slot="header" class="clearfix"> + <span>鍦板悕瀹氫綅</span> + <div style="float: right; cursor: pointer"> + <i class="el-icon-close" @click="closeBufferBox(3)"></i> + </div> + </div> + <div class="box-body"> + <el-form :model="comprehensive" :inline="true" label-width="50px"> + <el-form-item label="鍦板悕:"> + <el-input + style="width: 200px" + v-model="comprehensive.name" + ></el-input> + </el-form-item> + <el-form-item> + <el-button type="info">鏌ヨ</el-button> + </el-form-item> + </el-form> + <el-table :data="tableData" height="200px" style="width: 100%"> + <el-table-column + align="center" + type="index" + label="搴忓彿" + width="70px" + /> + <el-table-column prop="name" align="center" label="瀹氫綅"> + <template slot-scope="scope"> + <el-button + @click="handleLocation(scope.$index, scope.row)" + size="small" + icon="el-icon-place" + ></el-button> + </template> + </el-table-column> + <el-table-column prop="name" align="center" label="鍦板悕"> + </el-table-column> + </el-table> + <div style="margin-top: 10px" class="pagination_box"> + <el-pagination + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page="listData.pageIndex" + :page-sizes="[10, 20, 30, 40]" + :page-size="listData.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="count" + > + </el-pagination> + </div> + </div> + </el-card> + </div> </div> </template> <script> +import { + select_Comprehensive_ByPageAndCount, + select_Comprehensive_SelectWktById, +} from '../api/api'; export default { name: '', data() { @@ -60,6 +118,8 @@ buffer: null, showBufferBoxDialog: false, showCoordLocalBoxDialog: false, + showToponymicLocalBoxDialog: false, + comprehensive: {}, bufFrom: { val: 50, }, @@ -68,6 +128,14 @@ lat: 32, height: 8000000, }, + listData: { + name: null, + pageIndex: 1, + pageSize: 10, + }, + count: 0, + tableData: [], + imagePoint: null, }; }, mounted() { @@ -144,8 +212,69 @@ } else if (res.name == 'Coord') { if (res.id == '1') { this.showCoordLocalBoxDialog = true; + } else if (res.id == '2') { + this.showToponymicLocalBoxDialog = true; + this.getToponymicData(); } } + }, + handleSizeChange(val) { + this.listData.pageSize = val; + this.getToponymicData(); + }, + handleCurrentChange(val) { + this.listData.pageIndex = val; + this.getToponymicData(); + }, + async getToponymicData() { + if (this.listData.tab == '') { + delete this.listData.tab; + } + this.listData.name = this.comprehensive.name; + const data = await select_Comprehensive_ByPageAndCount(this.listData); + + if (data.code != 200) { + this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + this.tableData = data.result; + this.count = data.count; + }, + async handleLocation(index, row) { + const data = await select_Comprehensive_SelectWktById({ id: row.gid }); + if (data.code != 200) { + this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + var val = data.result.slice(6, data.result.length - 1); + val = val.split(' '); + var position = { + X: parseFloat(val[0]), + Y: parseFloat(val[1]), + Altitude: 2000, + }; + if (this.imagePoint != null) { + sgworld.Creator.DeleteObject(this.imagePoint); + this.imagePoint = null; + } + this.imagePoint = sgworld.Creator.CreateLabel( + position, + '', + SmartEarthRootUrl + 'Workers/image/mark.png', + { + disableDepthTestDistance: Infinity, + scale: 0.8, + }, + 0, + '宸℃鐐�' + ); + + sgworld.Navigate.jumpTo({ + //璺宠浆瑙嗚 + destination: new Cesium.Cartesian3.fromDegrees( + parseFloat(val[0]), + parseFloat(val[1]), + 10000 + ), + }); }, closeBufferBox(res) { switch (res) { @@ -155,6 +284,13 @@ break; case 2: this.showCoordLocalBoxDialog = false; + break; + case 3: + this.showToponymicLocalBoxDialog = false; + if (this.imagePoint != null) { + sgworld.Creator.DeleteObject(this.imagePoint); + this.imagePoint = null; + } break; } }, @@ -248,6 +384,14 @@ right: 1%; bottom: 1%; } +.toponymicLocalBox { + width: 750px; + height: 450x; + z-index: 40; + position: absolute; + right: 1%; + bottom: 1%; +} .box-card { background-color: rgba(0, 0, 0, 0.6); border: 1px solid rgba(32, 160, 255, 0.6); @@ -259,4 +403,46 @@ /deep/ .el-form-item__label { color: white !important; } +/deep/ .el-input__inner { + background: rgba(255, 255, 255, 0.2) !important; + color: white !important; +} + +::v-deep .el-table, +.el-table__expanded-cell { + background-color: transparent; + color: white; +} + +::v-deep .el-table tr { + background-color: transparent !important; +} +::v-deep .el-table tbody tr:hover > td { + background-color: rgba(255, 255, 255, 0.2) !important; +} +::v-deep .el-table鈥揺nable-row-transition .el-table__body td, +.el-table .cell { + background-color: transparent !important; +} +::v-deep .el-table th.el-table__cell { + background-color: transparent !important; + color: white; +} +::v-deep .el-pager li { + background-color: transparent !important; + color: white; +} +::v-deep .btn-prev { + background-color: transparent !important; +} +::v-deep .btn-next { + background-color: transparent !important; + color: white !important; +} +::v-deep .el-pagination__total { + color: white; +} +::v-deep .el-pagination__jump { + color: white; +} </style> -- Gitblit v1.9.3