<template>
|
<div class="mapBox">
|
<div id="mapdiv">
|
<div class="menu_Top" v-if="$store.state.mapMenuBoolean">
|
<map-menu-top v-if="$store.state.mapMenuBoxFlag == '1'" />
|
<map-space-top v-if="$store.state.mapMenuBoxFlag == '2'" />
|
</div>
|
<div class="menu_Popup" v-if="$store.state.mapPopBoolean">
|
<map-menu-pop v-if="$store.state.mapPopBoxFlag == '1'" />
|
<map-space-pop v-if="$store.state.mapPopBoxFlag == '2'" />
|
</div>
|
<div class="bufferBox" v-if="showBufferBoxDialog">
|
<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(1)"></i>
|
</div>
|
</div>
|
<div class="box-body">
|
<el-form ref="form" :model="bufFrom" label-width="100px">
|
<el-form-item label="缓冲半径(米):">
|
<el-input v-model="bufFrom.val"></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button @click="addBuffer(1)" type="info">点</el-button>
|
<el-button @click="addBuffer(2)" type="info">线</el-button>
|
<el-button @click="addBuffer(3)" type="info">面</el-button>
|
<el-button @click="clearBuffer" type="info">清除</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</el-card>
|
</div>
|
<div class="coordLocalBox" v-if="showCoordLocalBoxDialog">
|
<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(2)"></i>
|
</div>
|
</div>
|
<div class="box-body">
|
<el-form ref="form" :model="coordFrom" label-width="50px">
|
<el-form-item label="经度:">
|
<el-input v-model="coordFrom.lon"></el-input>
|
</el-form-item>
|
<el-form-item label="纬度:">
|
<el-input v-model="coordFrom.lat"></el-input>
|
</el-form-item>
|
<el-form-item label="高度:">
|
<el-input v-model="coordFrom.height"></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button @click="setCoordLocal" type="info">定位</el-button>
|
</el-form-item>
|
</el-form>
|
</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 class="pathAnalysisBox" v-if="showPathAnalysisBoxDialog">
|
<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(4)"></i>
|
</div>
|
</div>
|
<div class="box-body">
|
<el-form ref="form" :model="pathFrom" label-width="50px">
|
<el-form-item label="经度:">
|
<el-input
|
style="width: 300px"
|
v-model="pathFrom.lon"
|
></el-input>
|
<el-link
|
:underline="false"
|
@click="showMouseLeftClick(1)"
|
style="margin-left: 10px"
|
><i style="color: white" class="el-icon-plus"></i
|
></el-link>
|
</el-form-item>
|
<el-form-item label="纬度:">
|
<el-input
|
style="width: 300px"
|
v-model="pathFrom.lat"
|
></el-input>
|
<el-link
|
:underline="false"
|
@click="showMouseLeftClick(2)"
|
style="margin-left: 10px"
|
><i style="color: white" class="el-icon-plus"></i
|
></el-link>
|
</el-form-item>
|
<el-form-item>
|
<el-button @click="showMouseLeftClick(3)" type="info"
|
>查询</el-button
|
>
|
</el-form-item>
|
</el-form>
|
</div>
|
</el-card>
|
</div>
|
<div
|
@click="changeMenulayer"
|
class="center CenDiv"
|
:class="{ center1: centerFlag }"
|
>
|
<div
|
id="cenBg"
|
v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
|
></div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import $ from 'jquery';
|
import mapMenuTop from './MapView/mapMenuTop.vue';
|
import mapMenuPop from './MapView/mapMenuPop.vue';
|
import mapSpaceTop from './MapView/mapSpaceTop.vue';
|
import mapSpacePop from './MapView/mapSpacePop.vue';
|
import {
|
select_Comprehensive_ByPageAndCount,
|
select_Comprehensive_SelectWktById,
|
} from '../api/api';
|
export default {
|
name: '',
|
components: {
|
mapMenuTop,
|
mapMenuPop,
|
mapSpaceTop,
|
mapSpacePop,
|
},
|
data() {
|
return {
|
centerFlag: false,
|
buffer: null,
|
showBufferBoxDialog: false,
|
showCoordLocalBoxDialog: false,
|
showToponymicLocalBoxDialog: false,
|
showPathAnalysisBoxDialog: false,
|
comprehensive: {},
|
pathFrom: {
|
lon: '116.086746,39.937314',
|
lat: '116.086000,39.936289',
|
},
|
bufFrom: {
|
val: 50,
|
},
|
coordFrom: {
|
lon: 110,
|
lat: 32,
|
height: 8000000,
|
},
|
listData: {
|
name: null,
|
pageIndex: 1,
|
pageSize: 10,
|
},
|
count: 0,
|
selFrom: {},
|
tableData: [],
|
imagePoint: null,
|
handler: null,
|
pathStart: null,
|
pathEnd: null,
|
pathData: null,
|
|
isActive: false,
|
isMenuLayer: true,
|
selFrom: {},
|
selectTree: null,
|
|
menuList: [
|
{
|
id: 1,
|
label: '一级 1',
|
children: [
|
{
|
id: 4,
|
label: '二级 1-1',
|
children: [
|
{
|
id: 9,
|
label: '三级 1-1-1',
|
},
|
{
|
id: 10,
|
label: '三级 1-1-2',
|
},
|
],
|
},
|
],
|
},
|
{
|
id: 2,
|
label: '一级 2',
|
children: [
|
{
|
id: 5,
|
label: '二级 2-1',
|
},
|
{
|
id: 6,
|
label: '二级 2-2',
|
},
|
],
|
},
|
{
|
id: 3,
|
label: '一级 3',
|
children: [
|
{
|
id: 7,
|
label: '二级 3-1',
|
},
|
{
|
id: 8,
|
label: '二级 3-2',
|
},
|
],
|
},
|
],
|
defaultProps: {
|
children: 'children',
|
label: 'label',
|
}, //树绑定对象
|
};
|
},
|
mounted() {
|
this.init3DMap();
|
this.$bus.$on('mapChangeBox', (res) => {
|
this.showChangeBox(res);
|
});
|
},
|
methods: {
|
init3DMap() {
|
var webKey = '94a34772eb88317fcbf8428e10448561';
|
|
//地图初始化
|
window.sgworld = new SmartEarth.SGWorld('mapdiv', {
|
licenseServer: window.sceneConfig.licenseServer,
|
});
|
|
window.Viewer = window.sgworld._Viewer;
|
|
//定位
|
sgworld.Navigate.jumpTo({
|
//跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
116.055913,
|
39.937685,
|
8000
|
),
|
});
|
Viewer.imageryLayers.addImageryProvider(
|
new Cesium.WebMapTileServiceImageryProvider({
|
url: 'http://t0.tianditu.com/vec_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=vec&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=94a34772eb88317fcbf8428e10448561',
|
layer: 'tdtVecBasicLayer',
|
style: 'default',
|
format: 'image/jpeg',
|
tileMatrixSetID: 'GoogleMapsCompatible',
|
show: false,
|
})
|
);
|
|
Viewer.imageryLayers.addImageryProvider(
|
new Cesium.WebMapTileServiceImageryProvider({
|
url: 'http://t0.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=94a34772eb88317fcbf8428e10448561',
|
layer: 'tdtBasicLayer',
|
style: 'default',
|
format: 'image/jpeg',
|
tileMatrixSetID: 'GoogleMapsCompatible',
|
show: false,
|
})
|
);
|
Viewer.imageryLayers.addImageryProvider(
|
new Cesium.WebMapTileServiceImageryProvider({
|
url: 'http://t0.tianditu.com/cva_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=cva&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default.jpg&tk=94a34772eb88317fcbf8428e10448561',
|
layer: 'tdtAnnoLayer',
|
style: 'default',
|
format: 'image/jpeg',
|
tileMatrixSetID: 'GoogleMapsCompatible',
|
})
|
);
|
|
// sgworld.Navigate.jumpTo({
|
// //跳转视角
|
// destination: {
|
// x: 311837.3471863137,
|
// y: 5628280.936629815,
|
// z: 2992581.921482893,
|
// },
|
// orientation: {
|
// heading: 2.5028896264234364,
|
// pitch: -0.2201285642360813,
|
// roll: 0.0,
|
// },
|
// });
|
|
// Viewer.scene.globe.depthTestAgainstTerrain = true;
|
Viewer._enableInfoOrSelection = false;
|
//显示fps
|
Viewer.scene.debugShowFramesPerSecond = false;
|
//导航控件
|
window.sgworld.navControl('nav', false);
|
//比例尺
|
window.sgworld.navControl('scale', false);
|
|
//影像对比设置
|
var base = {
|
url: 'https://a.tile.openstreetmap.org/',
|
};
|
window.openStreetMap = sgworld.Creator.createImageryProvider(
|
'OpenStreetMap',
|
'OpenStreetMap',
|
base,
|
'0',
|
undefined,
|
true,
|
''
|
);
|
openStreetMap.item.show = false;
|
//mpt加载
|
var option = {
|
url: window.sceneConfig.mpt.url,
|
layerName: window.sceneConfig.mpt.name,
|
requestVertexNormals: true,
|
};
|
// sgworld.Creator.sfsterrainprovider('mpt', option, '', true, '');
|
window.elevationTool = new SmartEarth.ElevationTool(window.sgworld);
|
},
|
|
changeMenulayer() {
|
this.isActive = !this.isActive;
|
this.isMenuLayer = !this.isMenuLayer;
|
this.setLayerVisible();
|
},
|
setLayerVisible() {
|
if (this.isActive == true) {
|
Viewer.imageryLayers.get(1).show = true;
|
Viewer.imageryLayers.get(2).show = false;
|
} else {
|
Viewer.imageryLayers.get(1).show = false;
|
Viewer.imageryLayers.get(2).show = true;
|
}
|
},
|
//显示弹窗
|
showChangeBox(res) {
|
if (res.name == 'Query') {
|
if (res.id == '6') {
|
} else if (res.id == '7') {
|
} else {
|
this.showBufferBoxDialog = true;
|
}
|
} else if (res.name == 'Coord') {
|
if (res.id == '1') {
|
this.showCoordLocalBoxDialog = true;
|
} else if (res.id == '2') {
|
this.showToponymicLocalBoxDialog = true;
|
this.getToponymicData();
|
}
|
} else if (res.name == 'Analysis') {
|
if (res.id == '3') {
|
this.showPathAnalysisBoxDialog = true;
|
}
|
}
|
},
|
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) {
|
case 1:
|
this.showBufferBoxDialog = false;
|
this.clearBuffer();
|
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;
|
case 4:
|
this.showPathAnalysisBoxDialog = false;
|
this.clearPathAll(3);
|
|
break;
|
}
|
},
|
//定位
|
setCoordLocal() {
|
var lon = parseFloat(this.coordFrom.lon);
|
var lat = parseFloat(this.coordFrom.lat);
|
var height = parseFloat(this.coordFrom.height);
|
sgworld.Navigate.jumpTo({
|
//跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(lon, lat, height),
|
});
|
},
|
//缓冲区分析
|
clearBuffer() {
|
if (this.buffer == null) return;
|
this.buffer && this.buffer.clearBuff();
|
this.buffer = null;
|
},
|
getBufferTable(type) {
|
const points =
|
this.buffer.this_buff.buff.polygon.hierarchy.getValue().positions;
|
let geometrys = '';
|
let firstPoint;
|
let degrees = '';
|
points.forEach((p, i) => {
|
degrees = window.sgworld.Core.toDegrees(p);
|
geometrys += '[' + degrees.lon + ',' + degrees.lat + '],';
|
i === 0 && (firstPoint = '[' + degrees.lon + ',' + degrees.lat + ']');
|
});
|
geometrys += firstPoint;
|
if (geometrys.length != 0) geometrys.trimEnd(',');
|
geometrys = '{rings:[[' + geometrys + ']]}';
|
},
|
addBuffer(res) {
|
this.clearBuffer();
|
var buffRadius = this.bufFrom.val;
|
switch (res) {
|
case 1:
|
this.buffer = sgworld.Analysis.DrawPointBuffer(
|
buffRadius,
|
(event) => {
|
this.getBufferTable('point');
|
}
|
);
|
break;
|
case 2:
|
this.buffer = sgworld.Analysis.DrawPolylineBuffer(
|
buffRadius,
|
(event) => {
|
this.getBufferTable('line');
|
}
|
);
|
break;
|
case 3:
|
this.buffer = sgworld.Analysis.DrawPolygonBuffer(
|
buffRadius,
|
(event) => {
|
this.getBufferTable('polygon');
|
}
|
);
|
break;
|
}
|
},
|
showMouseLeftClick(res) {
|
if (res == 3) {
|
if (this.linePath != null) {
|
this.clearPathAll(3);
|
}
|
|
var jsonurl =
|
'http://192.168.20.39:9055/gisserver/wnsserver/beijingdaohang_wns?start=' +
|
this.pathFrom.lon +
|
'&end=' +
|
this.pathFrom.lat +
|
'&propertyName=Shape&tolerance=500&request=FindPath&format=json';
|
$.ajax({
|
url: jsonurl,
|
async: false,
|
type: 'GET',
|
dataType: 'json',
|
contentType: 'application/json;charset=utf-8',
|
success: (data) => {
|
this.executeFly3D(data);
|
},
|
});
|
} else {
|
var that = this;
|
if (this.handler != null) {
|
this.clearLeftClick();
|
}
|
this.handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas);
|
this.handler.setInputAction(function (event) {
|
let cartesian = Viewer.camera.pickEllipsoid(event.position);
|
let cartographic = Cesium.Cartographic.fromCartesian(cartesian);
|
let lng = parseFloat(
|
Cesium.Math.toDegrees(cartographic.longitude)
|
).toFixed(6); // 经度
|
let lat = parseFloat(
|
Cesium.Math.toDegrees(cartographic.latitude)
|
).toFixed(6); // 纬度
|
if (that.linePath != null) {
|
that.clearPathAll(3);
|
}
|
if (lng != null && lat != null) {
|
let val = lng + ',' + lat;
|
var position = sgworld.Creator.CreatePosition(lng, lat, 0);
|
if (res == 1) {
|
if (that.pathStart != null) {
|
that.clearPathAll(1);
|
}
|
|
that.pathStart = sgworld.Creator.CreateLabel(
|
position,
|
'',
|
SmartEarthRootUrl + 'Workers/image/start.png',
|
{
|
// 文本偏移量
|
pixelOffset: {
|
x: 0,
|
y: -50,
|
}, // 无视遮挡
|
disableDepthTestDistance: Infinity,
|
scale: 0.8,
|
},
|
0,
|
'起始点'
|
);
|
|
that.pathFrom.lon = val;
|
} else if (res == 2) {
|
if (that.pathEnd != null) {
|
that.clearPathAll(2);
|
}
|
|
that.pathEnd = sgworld.Creator.CreateLabel(
|
position,
|
'',
|
SmartEarthRootUrl + 'Workers/image/end.png',
|
{
|
// 文本偏移量
|
pixelOffset: {
|
x: 0,
|
y: -50,
|
}, // 无视遮挡
|
disableDepthTestDistance: Infinity,
|
scale: 0.8,
|
},
|
0,
|
'结束点'
|
);
|
that.pathFrom.lat = val;
|
}
|
that.clearLeftClick();
|
}
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
}
|
},
|
clearPathAll(res) {
|
switch (res) {
|
case 1:
|
if (this.pathStart != null) {
|
sgworld.Creator.DeleteObject(this.pathStart);
|
this.pathStart = null;
|
}
|
break;
|
case 2:
|
if (this.pathEnd != null) {
|
sgworld.Creator.DeleteObject(this.pathEnd);
|
this.pathEnd = null;
|
}
|
break;
|
case 3:
|
if (this.pathStart != null) {
|
sgworld.Creator.DeleteObject(this.pathStart);
|
this.pathStart = null;
|
}
|
|
if (this.pathEnd != null) {
|
sgworld.Creator.DeleteObject(this.pathEnd);
|
this.pathEnd = null;
|
}
|
if (this.linePath != null) {
|
sgworld.Creator.DeleteObject(this.linePath);
|
this.linePath = null;
|
}
|
break;
|
case 4:
|
if (this.linePath != null) {
|
sgworld.Creator.DeleteObject(this.linePath);
|
this.linePath = null;
|
}
|
break;
|
}
|
},
|
clearLeftClick() {
|
this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); //移除事件
|
this.handler = null;
|
},
|
executeFly3D(res) {
|
var position = [];
|
if (res) {
|
var positionA = res.features;
|
if (positionA.length > 0) {
|
for (var i = 0; i < positionA.length; i++) {
|
var val = positionA[i];
|
if (val.geometry.type == 'LineString') {
|
var val_data = val.geometry.coordinates;
|
for (var j = 0; j < val_data.length; j++) {
|
position.push({ x: val_data[j][0], y: val_data[j][1] });
|
}
|
}
|
}
|
this.linePath = sgworld.Creator.createPolyline(
|
position,
|
'#ffff00',
|
1,
|
0,
|
'线'
|
);
|
sgworld.Navigate.flyToObj(this.linePath);
|
} else {
|
return;
|
}
|
}
|
},
|
},
|
};
|
</script>
|
|
<style scoped lang="less">
|
.mapBox {
|
width: 100%;
|
height: 100%;
|
|
position: relative;
|
#mapdiv {
|
width: 100%;
|
height: 100%;
|
overflow: hidden;
|
position: relative;
|
.toponymicLocalBox {
|
width: 750px;
|
height: 450x;
|
z-index: 40;
|
position: absolute;
|
right: 1%;
|
bottom: 1%;
|
}
|
.bufferBox {
|
width: 412px;
|
height: 230px;
|
z-index: 40;
|
position: absolute;
|
right: 1%;
|
bottom: 1%;
|
}
|
.coordLocalBox {
|
width: 350px;
|
height: 370px;
|
z-index: 40;
|
position: absolute;
|
right: 1%;
|
bottom: 1%;
|
}
|
.pathAnalysisBox {
|
width: 412px;
|
|
z-index: 40;
|
position: absolute;
|
right: 1%;
|
bottom: 1%;
|
}
|
.box-body {
|
padding: 18px;
|
/deep/ .el-form-item__label {
|
color: white !important;
|
}
|
/deep/ .el-input__inner {
|
background: rgba(255, 255, 255, 0.2) !important;
|
color: white !important;
|
}
|
|
/deep/.el-table,
|
.el-table__expanded-cell {
|
background-color: transparent;
|
color: white;
|
}
|
|
/deep/ .el-table tr {
|
background-color: transparent !important;
|
}
|
/deep/ .el-table tbody tr:hover > td {
|
background-color: rgba(255, 255, 255, 0.2) !important;
|
}
|
/deep/.el-table–enable-row-transition .el-table__body td,
|
.el-table .cell {
|
background-color: transparent !important;
|
}
|
/deep/ .el-table th.el-table__cell {
|
background-color: transparent !important;
|
color: white;
|
}
|
/deep/.el-pager li {
|
background-color: transparent !important;
|
color: white;
|
}
|
/deep/ .btn-prev {
|
background-color: transparent !important;
|
}
|
/deep/ .btn-next {
|
background-color: transparent !important;
|
color: white !important;
|
}
|
/deep/ .el-pagination__total {
|
color: white;
|
}
|
/deep/ .el-pagination__jump {
|
color: white;
|
}
|
}
|
|
.box-card {
|
background-color: rgba(0, 0, 0, 0.6);
|
border: 1px solid rgba(32, 160, 255, 0.6);
|
color: white;
|
}
|
.menu_Top {
|
background: rgba(0, 0, 0, 0.5);
|
width: 100%;
|
height: 6%;
|
padding: 1%;
|
position: absolute;
|
z-index: 40;
|
}
|
.menu_Popup {
|
background: rgba(0, 0, 0, 0.6);
|
width: 60%;
|
height: 45%;
|
|
left: 20%;
|
bottom: 5%;
|
position: absolute;
|
z-index: 40;
|
}
|
}
|
}
|
|
// /deep/
|
// /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–enable-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;
|
// }
|
// .center {
|
// left: 1%;
|
// }
|
// .CenDiv {
|
// position: absolute;
|
// bottom: 1%;
|
// height: 40px;
|
// width: 60px;
|
// z-index: 101;
|
// display: flex;
|
// flex-direction: column;
|
// justify-content: space-between;
|
// box-shadow: 3px 3px 6px #666;
|
// border: 1px solid rgba(204, 204, 204, 0.76);
|
// border-radius: 5px;
|
// cursor: pointer;
|
// }
|
// .center1 {
|
// right: 1%;
|
// }
|
// .right {
|
// position: absolute;
|
// top: 50px;
|
// right: 0;
|
// width: 20%;
|
// height: calc(100% - 50px);
|
|
// display: flex;
|
// flex-direction: column;
|
// justify-content: space-between;
|
// }
|
// .CenDiv:hover {
|
// border: 1px solid #409eff;
|
// }
|
// .active {
|
// width: 100%;
|
// height: 100%;
|
// background: url('../assets/img/Layer/imgLayer2.png') no-repeat center;
|
// position: absolute;
|
// background-size: 100% 100%;
|
// border-radius: 5px;
|
// }
|
// .menuLayer {
|
// width: 100%;
|
// height: 100%;
|
// background: url('../assets/img/Layer/imgLayer1.png') no-repeat center;
|
// position: absolute;
|
// background-size: 100% 100%;
|
// border-radius: 5px;
|
// }
|
|
// .menuSelect .el-input__inner {
|
// background: rgba(255, 255, 255, 0.2) !important;
|
// color: white !important;
|
// border: 1px solid rgba(255, 255, 255, 0.2) !important;
|
// }
|
</style>
|