| | |
| | | <template> |
| | | <div class="menuPop"> |
| | | <div class="leftBox"> |
| | | <div |
| | | class="leftDown" |
| | | v-if="$store.state.download" |
| | | > |
| | | <div @click="getDownloadDep"> |
| | | <el-link icon="el-icon-download"> </el-link> |
| | | </div> |
| | | </div> |
| | | <ul> |
| | | <li |
| | | v-for="(item, index) in option" |
| | |
| | | <el-table |
| | | :data="tableData" |
| | | ref="dialogPayChannel" |
| | | height="300px" |
| | | height="100%" |
| | | style="width: 100%" |
| | | border |
| | | > |
| | | <el-table-column |
| | | align="center" |
| | |
| | | label="序号" |
| | | width="50" |
| | | /> |
| | | <el-table-column label="定位" width="100" align="center"> |
| | | <el-table-column |
| | | label="定位" |
| | | width="100" |
| | | align="center" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | icon="el-icon-map-location" |
| | | size="mini" |
| | | size="small" |
| | | @click="spaceLocation(scope.$index, scope.row)" |
| | | ></el-button> |
| | | </template> |
| | |
| | | ></el-table-column> |
| | | </el-table> |
| | | </div> |
| | | <div class="pagination_box"> |
| | | <div |
| | | class="pagination_box" |
| | | style="margin-top:10px" |
| | | > |
| | | <el-pagination |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | :current-page="listdata.pageIndex" |
| | | :page-sizes="[10, 20, 30, 40]" |
| | | :page-sizes="[10, 20, 50, 100]" |
| | | :page-size="listdata.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="pageCount" |
| | |
| | | label-width="100px" |
| | | class="codeForm" |
| | | > |
| | | <el-form-item :label="$t('common.passworld')" prop="password"> |
| | | <el-form-item |
| | | :label="$t('common.passworld')" |
| | | prop="password" |
| | | > |
| | | <el-input |
| | | type="password" |
| | | v-model="codeForm.password" |
| | | show-password |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item :label="$t('common.SPassword')" prop="repassword"> |
| | | <el-form-item |
| | | :label="$t('common.SPassword')" |
| | | prop="repassword" |
| | | > |
| | | <el-input |
| | | type="password" |
| | | v-model="codeForm.repassword" |
| | |
| | | class="primary" |
| | | size="small" |
| | | @click="download('codeForm')" |
| | | >{{ $t("common.confirm") }}</el-button |
| | | > |
| | | <el-button type="info" size="small" @click="closeDown('codeForm')">{{ |
| | | >{{ $t("common.confirm") }}</el-button> |
| | | <el-button |
| | | type="info" |
| | | size="small" |
| | | @click="closeDown('codeForm')" |
| | | >{{ |
| | | $t("common.cancel") |
| | | }}</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </el-dialog> |
| | | <el-dialog |
| | | title="数据申请" |
| | | :visible.sync="dialogInsertVisible" |
| | | width="30%" |
| | | top="35vh" |
| | | :modal="false" |
| | | :before-close="handleInsertClose" |
| | | > |
| | | <div style="width: 100%; max-height: 450px; overflow-y: auto"> |
| | | <el-form |
| | | ref="form" |
| | | :model="ruleForm" |
| | | label-width="100px" |
| | | > |
| | | <el-form-item label="审核单位"> |
| | | <div> |
| | | <ul> |
| | | <li v-for="item in ruleForm.depid"> |
| | | {{ item.name }} |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item label="表名"> |
| | | <div> |
| | | <ul> |
| | | <li v-for="item in ruleForm.tabs"> |
| | | {{ item.tabDesc }} |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item label="条件"> |
| | | <el-input |
| | | :title="ruleForm.wkt" |
| | | v-model="ruleForm.wkt" |
| | | disabled |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="描述"> |
| | | <el-input |
| | | type="textarea" |
| | | placeholder="请输入内容" |
| | | v-model="ruleForm.descr" |
| | | maxlength="50" |
| | | show-word-limit |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button |
| | | class="primary" |
| | | size="small" |
| | | @click="getInsertDown" |
| | | >{{ |
| | | $t("common.confirm") |
| | | }}</el-button> |
| | | <el-button |
| | | type="info" |
| | | size="small" |
| | | @click="closeInsertDown" |
| | | >{{ |
| | | $t("common.cancel") |
| | | }}</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | </el-dialog> |
| | | <iframe |
| | | id="Iframe1" |
| | |
| | | dataQuerySelectWktById, |
| | | sign_getPublicKey, |
| | | dataLib_selectDownloadFile, |
| | | dataQuery_selectDbOverflowDep, |
| | | apply_insertApply, |
| | | decr, |
| | | encr, |
| | | dataLib_selectDepsByIds, |
| | | } from "../../api/api.js"; |
| | | import { getToken } from "@/utils/auth"; |
| | | import $ from "jquery"; |
| | |
| | | } |
| | | }; |
| | | return { |
| | | ruleForm: { |
| | | depname: [], |
| | | tabs: [], |
| | | pwd: null, |
| | | repwd: null, |
| | | wkt: null, |
| | | descr: null, |
| | | }, |
| | | dialogVisible: false, |
| | | dialogInsertVisible: false, |
| | | insertFlag: null, |
| | | codeForm: { |
| | | password: "", |
| | | repassword: "", |
| | |
| | | { required: true, message: "请输入确认密码", trigger: "blur" }, |
| | | { validator: repasswordValidator, trigger: "blur" }, |
| | | ], |
| | | }, |
| | | insertOption: { |
| | | ids: [], |
| | | pwd: null, |
| | | tabs: [], |
| | | entity: [], |
| | | wkt: null, |
| | | descr: null, |
| | | }, |
| | | listPage: { |
| | | pageSize: 10, |
| | |
| | | }; |
| | | }, |
| | | methods: { |
| | | getInsertDown() { |
| | | this.dialogInsertVisible = false; |
| | | this.dialogVisible = true; |
| | | }, |
| | | handleInsertClose() { |
| | | this.$confirm("确认关闭?") |
| | | .then((_) => { |
| | | this.closeInsertDown(); |
| | | }) |
| | | .catch((_) => { }); |
| | | }, |
| | | closeInsertDown() { |
| | | this.ruleForm = { |
| | | depname: [], |
| | | tabs: [], |
| | | pwd: null, |
| | | repwd: null, |
| | | wkt: null, |
| | | descr: null, |
| | | }; |
| | | this.dialogInsertVisible = false; |
| | | }, |
| | | async getDownloadDep() { |
| | | var std = []; |
| | | for (var i in this.option) { |
| | | std.push(this.option[i].entity); |
| | | } |
| | | var obj = { |
| | | entities: std, |
| | | wkt: this.listdata.wkt, |
| | | }; |
| | | const data = await dataQuery_selectDbOverflowDep(JSON.stringify(obj)); |
| | | if (data.code != 200) { |
| | | this.$message.error("数据请求失败"); |
| | | return; |
| | | } |
| | | |
| | | if (data.result.length == 0 || data.result == null) { |
| | | this.insertFlag = 1; |
| | | this.dialogVisible = true; |
| | | } else { |
| | | this.insertFlag = 2; |
| | | var std = []; |
| | | this.insertOption.ids = data.result; |
| | | var val = ""; |
| | | for (var i in data.result) { |
| | | if (val == "") { |
| | | val += "codes=" + data.result[i]; |
| | | } else { |
| | | val += "&codes=" + data.result[i]; |
| | | } |
| | | |
| | | std.push({ |
| | | name: data.result[i], |
| | | }); |
| | | } |
| | | const data1 = await dataLib_selectDepsByIds(val); |
| | | |
| | | this.ruleForm.depid = data1.result; |
| | | this.ruleForm.depname = std; |
| | | this.ruleForm.wkt = decr(this.listdata.wkt); |
| | | this.ruleForm.tabs = this.option; |
| | | this.dialogInsertVisible = true; |
| | | } |
| | | }, |
| | | async signGetPublicKey() { |
| | | const res = await sign_getPublicKey(); |
| | | if (res && res.code == 200) { |
| | |
| | | encrypt.setPublicKey(res.result); |
| | | } |
| | | }, |
| | | download() { |
| | | async download() { |
| | | if (this.codeForm.password == "") return; |
| | | var obj = { |
| | | pwd: encrypt.encrypt(this.codeForm.password), |
| | | entities: [], |
| | | wkt: this.listdata.wkt, |
| | | }; |
| | | for (var i in this.option) { |
| | | obj.entities.push(this.option[i].entity); |
| | | if (this.insertFlag == 1) { |
| | | var obj = { |
| | | pwd: encrypt.encrypt(this.codeForm.password), |
| | | entities: [], |
| | | wkt: this.listdata.wkt, |
| | | }; |
| | | for (var i in this.option) { |
| | | obj.entities.push(this.option[i].entity); |
| | | } |
| | | var token = getToken(); |
| | | var that = this; |
| | | $.ajax(BASE_URL + "/dataLib/downloadDbReq?token=" + token, { |
| | | type: "post", |
| | | data: JSON.stringify(obj), |
| | | async: true, |
| | | cache: false, |
| | | processData: false, |
| | | contentType: false, |
| | | success: (res) => { |
| | | if (res.code != 200) { |
| | | return; |
| | | } |
| | | this.selectDownloadFile(res.result, obj.pwd); |
| | | }, |
| | | }); |
| | | } else if (this.insertFlag == 2) { |
| | | var std = []; |
| | | var std1 = []; |
| | | for (var i in this.option) { |
| | | std.push(this.option[i].tabDesc); |
| | | std1.push(this.option[i].entity); |
| | | } |
| | | var obj = { |
| | | depcodes: this.insertOption.ids, |
| | | pwd: encr(this.codeForm.password), |
| | | tabs: std, |
| | | entities: std1, |
| | | wkt: this.listdata.wkt, |
| | | descr: this.ruleForm.descr, |
| | | }; |
| | | const data1 = await apply_insertApply(JSON.stringify(obj)); |
| | | if (data1.code != 200) { |
| | | this.$message.error("数据申请失败"); |
| | | return; |
| | | } |
| | | this.$message({ |
| | | message: "数据申请成功", |
| | | type: "success", |
| | | }); |
| | | |
| | | this.closeDown(); |
| | | } |
| | | var token = getToken(); |
| | | var that = this; |
| | | $.ajax(BASE_URL + "/dataLib/downloadDbReq?token=" + token, { |
| | | type: "post", |
| | | data: JSON.stringify(obj), |
| | | async: true, |
| | | cache: false, |
| | | processData: false, |
| | | contentType: false, |
| | | success: (res) => { |
| | | if (res.code != 200) { |
| | | return; |
| | | } |
| | | this.selectDownloadFile(res.result, obj.pwd); |
| | | }, |
| | | }); |
| | | }, |
| | | async selectDownloadFile(rsid, rspwd) { |
| | | var downObj = { |
| | |
| | | .then((_) => { |
| | | this.closeDown(); |
| | | }) |
| | | .catch((_) => {}); |
| | | .catch((_) => { }); |
| | | }, |
| | | closeDown() { |
| | | this.dialogVisible = false; |
| | | this.codeForm.password = ""; |
| | | this.codeForm.repassword = ""; |
| | | this.closeInsertDown(); |
| | | }, |
| | | startTableMssage() { |
| | | this.listdata.pageIndex = 1; |
| | |
| | | this.listdata.name = null; |
| | | this.option = []; |
| | | }, |
| | | clearQuerInfo() { |
| | | if (this.$store.state.queryInfo.length != 0) { |
| | | sgworld.Creator.SimpleGraphic.clear(); |
| | | for (var i in this.$store.state.queryInfo) { |
| | | sgworld.Viewer.entities.remove(this.$store.state.queryInfo[i]); |
| | | } |
| | | this.$store.state.queryInfo = []; |
| | | if (this.$store.state.primitLayer != null) { |
| | | sgworld.Viewer.entities.remove(this.$store.state.primitLayer); |
| | | sgworld.Creator.DeleteObject(this.$store.state.primitLayer); |
| | | this.$store.state.primitLayer = null; |
| | | } |
| | | } |
| | | }, |
| | | setTableAll() { |
| | | this.clearQuerInfo(); |
| | | this.signGetPublicKey(); |
| | | this.startTableMssage(); |
| | | this.listdata.wkt = this.$store.state.mapMenuShpFile; |
| | |
| | | this.imagePoint = null; |
| | | } |
| | | var wkt = this.$wkt.parse(val1); |
| | | this.setMapLoaction(wkt); |
| | | this.setMapLoaction(wkt, row); |
| | | } |
| | | }, |
| | | setMapLoaction(res) { |
| | |
| | | this.listdata.pageIndex = 1; |
| | | this.listdata.pageSize = 10; |
| | | this.listdata.name = res.entity; |
| | | this.$store.state.propertiesName = res; |
| | | this.getTableDateHidder(); |
| | | }, |
| | | handleSizeChange(val) { |
| | |
| | | this.showAllImage(data.result); |
| | | }, |
| | | async showAllImage(res) { |
| | | if (window.Viewer.scene.primitives.length != null) { |
| | | window.Viewer.scene.primitives.removeAll(); |
| | | } |
| | | if (this.$store.state.primitLayer != null) { |
| | | sgworld.Creator.DeleteObject(this.$store.state.primitLayer); |
| | | this.$store.state.primitLayer = null; |
| | | } |
| | | for (var i in res) { |
| | | let properties = res[i]; |
| | | var param = { |
| | | gid: res[i].gid, |
| | | name: this.listdata.name, |
| | |
| | | var val1 = decr(data.result); |
| | | if (val1) { |
| | | var wkt = this.$wkt.parse(val1); |
| | | this.getprimitiLayer(wkt); |
| | | this.primitivesAddLayer(wkt); |
| | | // this.getprimitiLayer(wkt); |
| | | this.primitivesAddLayer(wkt, properties); |
| | | } |
| | | } |
| | | }, |
| | |
| | | break; |
| | | } |
| | | }, |
| | | primitivesAddLayer(res) { |
| | | primitivesAddLayer(res, properties) { |
| | | switch (res.type) { |
| | | case "Point": |
| | | var val = Cesium.Cartesian3.fromDegrees( |
| | | res.coordinates[0], |
| | | res.coordinates[1], |
| | | 1000 |
| | | res.coordinates[1] |
| | | ); |
| | | this.$store.state.primitLayer.add({ |
| | | var point = Viewer.entities.add({ |
| | | position: val, |
| | | image: SmartEarthRootUrl + "Workers/image/mark.png", |
| | | properties: properties, |
| | | tag: "properties_point", |
| | | billboard: { |
| | | // 图像地址,URI或Canvas的属性 |
| | | image: SmartEarthRootUrl + "Workers/image/mark.png", |
| | | heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, |
| | | // 大小是否以米为单位 |
| | | sizeInMeters: false, |
| | | // 相对于坐标的垂直位置 |
| | | verticalOrigin: Cesium.VerticalOrigin.CENTER, |
| | | // 相对于坐标的水平位置 |
| | | horizontalOrigin: Cesium.HorizontalOrigin.LEFT, |
| | | // 应用于图像的统一比例。比例大于会1.0放大标签,而比例小于会1.0缩小标签。 |
| | | scale: 1.0, |
| | | // 是否显示 |
| | | show: true, |
| | | }, |
| | | }); |
| | | point.billboard.disableDepthTestDistance = Number.POSITIVE_INFINITY; |
| | | this.$store.state.queryInfo.push(point); |
| | | //点击事件 |
| | | window.propertieshandler = new Cesium.ScreenSpaceEventHandler( |
| | | sgworld.Viewer.scene.canvas |
| | | ); |
| | | window.propertieshandler.setInputAction(event => { |
| | | let pick = sgworld.Viewer.scene.pick(event.position); |
| | | // ; |
| | | if (pick && pick.id && pick.id.tag == "properties_point") { |
| | | this.$store.state.propertiesFlag = '1'; |
| | | let properties = pick.id.properties; |
| | | let propertyNames = pick.id.properties.propertyNames; |
| | | let obj = {}; |
| | | obj["eventid"] = properties['_eventid']._value; |
| | | this.attributeData.forEach(item => { |
| | | propertyNames.forEach(itemElement => { |
| | | if (itemElement == item.field) { |
| | | obj[item.alias] = properties[itemElement]._value |
| | | } |
| | | }) |
| | | }) |
| | | this.$store.state.propertiesInfo = obj; |
| | | } |
| | | }, Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | break; |
| | | case "LineString": |
| | | case "MultiLineString": |
| | | var line = res.coordinates[0]; |
| | | var std = []; |
| | | for (var i in line) { |
| | | std.push(line[i][0], line[i][1]); |
| | | } |
| | | var instance = new Cesium.GeometryInstance({ |
| | | geometry: new Cesium.GroundPolylineGeometry({ |
| | | var polyline = Viewer.entities.add({ |
| | | polyline: { |
| | | positions: Cesium.Cartesian3.fromDegreesArray(std), |
| | | width: 4.0, |
| | | }), |
| | | attributes: { |
| | | color: Cesium.ColorGeometryInstanceAttribute.fromColor( |
| | | new Cesium.Color(1.0, 0.0, 0.0, 0.3) |
| | | ), |
| | | width: 5, |
| | | material: new Cesium.Color(1.0, 0.0, 0.0, 0.3), |
| | | clampToGround: true, |
| | | }, |
| | | }); |
| | | window.Viewer.scene.primitives.add( |
| | | new Cesium.GroundPolylinePrimitive({ |
| | | geometryInstances: instance, |
| | | appearance: new Cesium.PolylineColorAppearance(), |
| | | }) |
| | | ); |
| | | this.$store.state.queryInfo.push(polyline); |
| | | break; |
| | | case "MultiPolygon": |
| | | var val = res.coordinates[0][0]; |
| | |
| | | for (var i in val) { |
| | | std.push(val[i][0], val[i][1]); |
| | | } |
| | | var primitive = new Cesium.GroundPrimitive({ |
| | | //贴地的primitive |
| | | geometryInstances: new Cesium.GeometryInstance({ |
| | | geometry: new Cesium.PolygonGeometry({ |
| | | //支持CircleGeometry,CorridorGeometry,EllipseGeometry,RectangleGeometry |
| | | polygonHierarchy: new Cesium.PolygonHierarchy( |
| | | Cesium.Cartesian3.fromDegreesArray(std) |
| | | ), |
| | | }), |
| | | attributes: { |
| | | color: Cesium.ColorGeometryInstanceAttribute.fromColor( |
| | | new Cesium.Color(1.0, 0.0, 0.0, 0.3) |
| | | ), |
| | | }, |
| | | }), |
| | | appearance: Cesium.EllipsoidSurfaceAppearance(), |
| | | var entity = Viewer.entities.add({ |
| | | polygon: { |
| | | hierarchy: Cesium.Cartesian3.fromDegreesArray(std), |
| | | //height : 100000, |
| | | material: new Cesium.Color(1.0, 0.0, 0.0, 0.3), |
| | | outline: true, |
| | | outlineColor: new Cesium.Color(1.0, 0.0, 0.0, 0.3), |
| | | }, |
| | | }); |
| | | window.Viewer.scene.primitives.add(primitive); |
| | | this.$store.state.queryInfo.push(entity); |
| | | break; |
| | | } |
| | | }, |
| | |
| | | } |
| | | }); |
| | | }, |
| | | destroyed() { |
| | | this.$store.state.propertiesFlag = null; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | |
| | | float: left; |
| | | border-right: 1px solid gray; |
| | | li { |
| | | color: white; |
| | | line-height: 20px; |
| | | border-bottom: 1px solid gray; |
| | | padding: 5px; |
| | |
| | | color: #409eff; |
| | | background: rgba(128, 128, 128, 0.2); |
| | | } |
| | | .leftDown { |
| | | width: 94%; |
| | | padding: 3%; |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | } |
| | | } |
| | | |
| | | .rightBox { |
| | |
| | | float: left; |
| | | .rightTitle { |
| | | padding: 5px; |
| | | color: white; |
| | | |
| | | width: 100%; |
| | | } |
| | | .tableBox { |
| | | height: 327px; |
| | | position: relative; |
| | | height: 89%; |
| | | } |
| | | .rightPage { |
| | | margin-left: 50px; |
| | | /*不可点击的*/ |
| | | } |
| | | .pagination_box { |
| | | position: absolute; |
| | | bottom: 10px; |
| | | /deep/.el-input__inner { |
| | | background-color: transparent !important; |
| | | border: 1px solid; |
| | | color: white; |
| | | } |
| | | /deep/.el-pagination__total { |
| | | color: white; |
| | | } |
| | | /deep/.el-pagination__jump { |
| | | color: white; |
| | | } |
| | | /deep/.el-pager li.active { |
| | | color: #409eff; |
| | | } |
| | | /deep/.el-pager li { |
| | | color: white; |
| | | background: transparent; |
| | | } |
| | | /deep/.el-pager li { |
| | | color: white; |
| | | } |
| | | /deep/.btn-prev { |
| | | background: transparent; |
| | | } |
| | | /deep/.btn-next { |
| | | background: transparent; |
| | | } |
| | | /deep/.btn-next i { |
| | | color: white; |
| | | } |
| | | /deep/.btn-prev i { |
| | | color: white; |
| | | } |
| | | } |
| | | |
| | | .boxClose { |
| | | float: right; |
| | | margin-right: 20px; |
| | | color: white; |
| | | } |
| | | } |
| | | /deep/ .el-table { |
| | | background-color: transparent; |
| | | |
| | | th, |
| | | td { |
| | | background-color: transparent; |
| | | } |
| | | .el-table__expanded-cell { |
| | | background-color: transparent !important; |
| | | } |
| | | |
| | | // 表头背景色 |
| | | th.el-table__cell { |
| | | background-color: #303030; |
| | | color: #fff; |
| | | } |
| | | tr > td { |
| | | background-color: #303030; |
| | | color: #fff; |
| | | } |
| | | |
| | | // hover效果 |
| | | tr:hover > td { |
| | | background-color: rgba(255, 255, 255, 0.3) !important; |
| | | } |
| | | |
| | | tbody tr:hover { |
| | | background-color: rgba(255, 255, 255, 0.3) !important; |
| | | // text-align: center; |
| | | } |
| | | |
| | | // 滚动条宽高 |
| | | .el-table__body-wrapper::-webkit-scrollbar { |
| | | width: 5px; |
| | | height: 5px; |
| | | } |
| | | |
| | | .el-table__body-wrapper::-webkit-scrollbar { |
| | | width: 5px; |
| | | /*滚动条宽度*/ |
| | | height: 5px; |
| | | /*滚动条高度*/ |
| | | } |
| | | /*定义滚动条轨道 内阴影+圆角*/ |
| | | .el-table__body-wrapper::-webkit-scrollbar-track { |
| | | box-shadow: 0px 1px 3px #216fe6 inset; |
| | | /*滚动条的背景区域的内阴影*/ |
| | | border-radius: 10px; |
| | | } |
| | | |
| | | /*定义滑块 内阴影+圆角*/ |
| | | .el-table__body-wrapper::-webkit-scrollbar-thumb { |
| | | box-shadow: 0px 1px 3px #216fe6 inset; |
| | | border-radius: 6px; |
| | | background-color: #216fe6; |
| | | } |
| | | } |
| | | } |
| | | |
| | | li { |
| | | line-height: 20px; |
| | | border-bottom: 1px solid gray; |
| | | padding: 5px; |
| | | } |
| | | </style> |
| | | <style lang="less"></style> |
| | | <style scoped lang="less"></style> |