From eff42e5897b5f0935aa5b93c1bd9acb8bb39b8f0 Mon Sep 17 00:00:00 2001
From: WX <1377869194@qq.com>
Date: 星期五, 09 六月 2023 18:02:12 +0800
Subject: [PATCH] ui页面补充添加，功能按钮调整
---
src/assets/img/dw.png | 0
src/assets/img/sc.png | 0
src/assets/js/Map/index.js | 10
src/views/baseMapSwitching/baseMapSwitching.vue | 124 +++++
src/assets/img/x.png | 0
public/index.html | 1
src/assets/img/layer.png | 0
public/CIMSDK/Assets/Textures/SkyBox/skyBox_pz.jpg | 0
src/views/menus.vue | 38 +
src/views/search/search.vue | 218 +++++++++
src/views/Index.vue | 7
src/assets/img/dl.png | 0
src/assets/img/m.png | 0
src/assets/css/global.css | 3
src/assets/img/DBX.png | 0
src/assets/js/Map/menuData.js | 359 +++++++-------
src/assets/js/Map/menuTool.js | 259 +++++-----
src/views/plotting/plotting.vue | 203 ++++++++
public/CIMSDK/Assets/Textures/SkyBox/skyBox_py.jpg | 0
src/assets/img/ml.png | 0
src/assets/img/xl.png | 0
src/views/layer/layerManage.vue | 199 +++++++-
src/assets/img/d.png | 0
23 files changed, 1,073 insertions(+), 348 deletions(-)
diff --git a/public/CIMSDK/Assets/Textures/SkyBox/skyBox_py.jpg b/public/CIMSDK/Assets/Textures/SkyBox/skyBox_py.jpg
index efb478f..f88416b 100644
--- a/public/CIMSDK/Assets/Textures/SkyBox/skyBox_py.jpg
+++ b/public/CIMSDK/Assets/Textures/SkyBox/skyBox_py.jpg
Binary files differ
diff --git a/public/CIMSDK/Assets/Textures/SkyBox/skyBox_pz.jpg b/public/CIMSDK/Assets/Textures/SkyBox/skyBox_pz.jpg
index cae4f52..d3377f0 100644
--- a/public/CIMSDK/Assets/Textures/SkyBox/skyBox_pz.jpg
+++ b/public/CIMSDK/Assets/Textures/SkyBox/skyBox_pz.jpg
Binary files differ
diff --git a/public/index.html b/public/index.html
index 277d186..0538b25 100644
--- a/public/index.html
+++ b/public/index.html
@@ -23,6 +23,7 @@
</head>
<body>
+
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
Please enable it to continue.</strong>
diff --git a/src/assets/css/global.css b/src/assets/css/global.css
index f8a823e..a15c476 100644
--- a/src/assets/css/global.css
+++ b/src/assets/css/global.css
@@ -90,4 +90,7 @@
/* border: 1px solid #D6E4FF;
box-shadow:none; */
box-shadow:0 0 0 1px #D6E4FF;
+}
+.el-input__inner{
+ color: #D6E4FF;
}
\ No newline at end of file
diff --git a/src/assets/img/DBX.png b/src/assets/img/DBX.png
new file mode 100644
index 0000000..ad98a73
--- /dev/null
+++ b/src/assets/img/DBX.png
Binary files differ
diff --git a/src/assets/img/d.png b/src/assets/img/d.png
new file mode 100644
index 0000000..54458ca
--- /dev/null
+++ b/src/assets/img/d.png
Binary files differ
diff --git a/src/assets/img/dl.png b/src/assets/img/dl.png
new file mode 100644
index 0000000..2d81a55
--- /dev/null
+++ b/src/assets/img/dl.png
Binary files differ
diff --git a/src/assets/img/dw.png b/src/assets/img/dw.png
new file mode 100644
index 0000000..926ed51
--- /dev/null
+++ b/src/assets/img/dw.png
Binary files differ
diff --git a/src/assets/img/layer.png b/src/assets/img/layer.png
new file mode 100644
index 0000000..51f30bb
--- /dev/null
+++ b/src/assets/img/layer.png
Binary files differ
diff --git a/src/assets/img/m.png b/src/assets/img/m.png
new file mode 100644
index 0000000..d3b0961
--- /dev/null
+++ b/src/assets/img/m.png
Binary files differ
diff --git a/src/assets/img/ml.png b/src/assets/img/ml.png
new file mode 100644
index 0000000..dfe05c7
--- /dev/null
+++ b/src/assets/img/ml.png
Binary files differ
diff --git a/src/assets/img/sc.png b/src/assets/img/sc.png
new file mode 100644
index 0000000..a6762c3
--- /dev/null
+++ b/src/assets/img/sc.png
Binary files differ
diff --git a/src/assets/img/x.png b/src/assets/img/x.png
new file mode 100644
index 0000000..aa22e89
--- /dev/null
+++ b/src/assets/img/x.png
Binary files differ
diff --git a/src/assets/img/xl.png b/src/assets/img/xl.png
new file mode 100644
index 0000000..13c4b8c
--- /dev/null
+++ b/src/assets/img/xl.png
Binary files differ
diff --git a/src/assets/js/Map/index.js b/src/assets/js/Map/index.js
index 985855d..86aade2 100644
--- a/src/assets/js/Map/index.js
+++ b/src/assets/js/Map/index.js
@@ -23,6 +23,10 @@
this.Viewer = this.earthCtrl._Viewer;
this.Viewer.scene.skyAtmosphere.show = false;
+ this.Viewer.scene.globe.depthTestAgainstTerrain = true;
+ console.log(this.earthCtrl);
+ console.log(SmartEarth.EarthCtrl);
+
window.earthCtrl = this.earthCtrl;
window.Viewer = this.earthCtrl._Viewer;
@@ -30,6 +34,12 @@
Viewer.scene.globe.showGroundAtmosphere = false;
+ // let colorAll = {
+ // point: SmartEarth.Cesium.Color.fromCssColorString("#ff0000"),
+ // polyline: SmartEarth.Cesium.Color.fromCssColorString("#ffff0050"),
+ // polygon: SmartEarth.Cesium.Color.fromCssColorString("#ffff0050"),
+ // };
+ // this.earthCtrl.Analysis.spaceDistance(colorAll, () => {});
// var terrain = new SmartEarth.Cesium.CesiumTerrainProvider({
// url: config.moonTerrain,
// tilingScheme: new SmartEarth.Cesium.GeographicTilingScheme({
diff --git a/src/assets/js/Map/menuData.js b/src/assets/js/Map/menuData.js
index 89236d3..e8b3fb6 100644
--- a/src/assets/js/Map/menuData.js
+++ b/src/assets/js/Map/menuData.js
@@ -1,186 +1,197 @@
const menuData = {
- topMenu: [
+ topMenu: [
+ {
+ id: "a1",
+ name: "婕父",
+ imgUrl: "鍥惧眰 8 鎷疯礉 2.png",
+ level: 1,
+ children: [
{
- id: 'a1',
- name: "婕父",
- imgUrl: '鍥惧眰 8 鎷疯礉 2.png',
- level: 1,
- children: [
- {
- id: 'a2',
- name: "鐐规极娓�",
- imgUrl: '妞渾 6.png',
- level: 2,
- },
- {
- id: 'a3',
- name: "绾胯矾婕父",
- imgUrl: '妞渾 7 鎷疯礉 2.png',
- level: 2,
- }
- ],
+ id: "a2",
+ name: "鐐规极娓�",
+ imgUrl: "妞渾 6.png",
+ level: 2,
},
{
- id: 'b1',
- name: "閲忔祴",
- imgUrl: '鍥惧眰 5 鎷疯礉 6.png',
- level: 1,
- children: [
- {
- id: 'b2',
- name: "琛ㄩ潰璺濈",
- imgUrl: '鍥惧眰 31.png',
- level: 2,
- },
- {
- id: 'b3',
- name: "骞抽潰闈㈢Н",
- imgUrl: '鐭╁舰 13 鎷疯礉.png',
- level: 2,
- }, {
- id: 'b4',
- name: "楂樼▼娴嬮噺",
- imgUrl: '楂樼▼娴嬮噺.png',
- level: 2,
- },
- {
- id: 'b5',
- name: "鍨傜洿楂樺害",
- imgUrl: '鍥惧眰 31 鎷疯礉.png',
- level: 2,
- }
- ],
+ id: "a3",
+ name: "绾胯矾婕父",
+ imgUrl: "妞渾 7 鎷疯礉 2.png",
+ level: 2,
+ },
+ ],
+ },
+ {
+ id: "b1",
+ name: "閲忔祴",
+ imgUrl: "鍥惧眰 5 鎷疯礉 6.png",
+ level: 1,
+ children: [
+ {
+ id: "b2",
+ name: "琛ㄩ潰璺濈",
+ imgUrl: "鍥惧眰 31.png",
+ level: 2,
},
{
- id: 'c1',
- name: "鏍囩粯",
- imgUrl: '鐭╁舰 8 鎷疯礉 11.png',
- level: 1,
- children: [{
- id: 'c2',
- name: "鐐�",
- imgUrl: '妞渾 5 鎷疯礉 3.png',
- level: 2,
- },
- {
- id: 'c3',
- name: "鏂囧瓧",
- imgUrl: '鏂囧瓧鏍囨敞.png',
- level: 2,
- }, {
- id: 'c4',
- name: "绾�",
- imgUrl: '妞渾 3 鎷疯礉 16.png',
- level: 2,
- },
- {
- id: 'c5',
- name: "鐭╁舰",
- imgUrl: '妞渾 3 鎷疯礉 20.png',
- level: 2,
- }, {
- id: 'c6',
- name: "澶氳竟褰�",
- imgUrl: '妞渾 3 鎷疯礉 23.png',
- level: 2,
- }],
+ id: "b3",
+ name: "骞抽潰闈㈢Н",
+ imgUrl: "鐭╁舰 13 鎷疯礉.png",
+ level: 2,
},
{
- id: 'd1',
- name: "鍒嗘瀽",
- imgUrl: '鐭㈤噺鏅鸿兘瀵硅薄 鎷疯礉 3.png',
- level: 1,
- children: [{
- id: 'd2',
- name: "绛夐珮绾垮垎鏋�",
- imgUrl: '妞渾 8 鎷疯礉 8.png',
- level: 2,
- },
- {
- id: 'd3',
- name: "鍧″害鍒嗘瀽",
- imgUrl: '鍦嗚鐭╁舰 12 鎷疯礉 5.png',
- level: 2,
- }, {
- id: 'd4',
- name: "鍦熸柟閲忚绠�",
- imgUrl: '鍥惧眰 14 鎷疯礉 3.png',
- level: 2,
- },
- {
- id: 'd5',
- name: "褰卞儚瀵规瘮",
- imgUrl: '鍦嗚鐭╁舰 12 鎷疯礉 6.png',
+ id: "b4",
+ name: "楂樼▼娴嬮噺",
+ imgUrl: "楂樼▼娴嬮噺.png",
+ level: 2,
+ },
+ {
+ id: "b5",
+ name: "鍨傜洿楂樺害",
+ imgUrl: "鍥惧眰 31 鎷疯礉.png",
+ level: 2,
+ },
+ ],
+ },
+ {
+ id: "c1",
+ name: "鏍囩粯",
+ imgUrl: "鐭╁舰 8 鎷疯礉 11.png",
+ level: 1,
+ children: [
+ {
+ id: "c2",
+ name: "鐐�",
+ imgUrl: "妞渾 5 鎷疯礉 3.png",
+ level: 2,
+ },
+ {
+ id: "c3",
+ name: "鏂囧瓧",
+ imgUrl: "鏂囧瓧鏍囨敞.png",
+ level: 2,
+ },
+ {
+ id: "c4",
+ name: "绾�",
+ imgUrl: "妞渾 3 鎷疯礉 16.png",
+ level: 2,
+ },
+ {
+ id: "c5",
+ name: "鐭╁舰",
+ imgUrl: "妞渾 3 鎷疯礉 20.png",
+ level: 2,
+ },
+ {
+ id: "c6",
+ name: "澶氳竟褰�",
+ imgUrl: "妞渾 3 鎷疯礉 23.png",
+ level: 2,
+ },
+ ],
+ },
+ {
+ id: "d1",
+ name: "鍒嗘瀽",
+ imgUrl: "鐭㈤噺鏅鸿兘瀵硅薄 鎷疯礉 3.png",
+ level: 1,
+ children: [
+ {
+ id: "d2",
+ name: "绛夐珮绾垮垎鏋�",
+ imgUrl: "妞渾 8 鎷疯礉 8.png",
+ level: 2,
+ },
+ {
+ id: "d3",
+ name: "鍧″害鍒嗘瀽",
+ imgUrl: "鍦嗚鐭╁舰 12 鎷疯礉 5.png",
+ level: 2,
+ },
+ {
+ id: "d4",
+ name: "鍦熸柟閲忚绠�",
+ imgUrl: "鍥惧眰 14 鎷疯礉 3.png",
+ level: 2,
+ },
+ {
+ id: "d5",
+ name: "褰卞儚瀵规瘮",
+ imgUrl: "鍦嗚鐭╁舰 12 鎷疯礉 6.png",
- level: 2,
- }, {
- id: 'd6',
- name: "闃村奖鍒嗘瀽",
- imgUrl: '鍥惧眰 8.png',
- level: 2,
- }],
+ level: 2,
},
{
- id: 'e1',
- imgUrl: '褰㈢姸 5.png',
- name: "蹇収",
- level: 1,
+ id: "d6",
+ name: "闃村奖鍒嗘瀽",
+ imgUrl: "鍥惧眰 8.png",
+ level: 2,
},
- {
- id: 'f1',
- name: "绌洪棿鏌ヨ",
- imgUrl: '褰㈢姸 3.png',
- level: 1,
- children: [],
- },
- {
- id: 'g1',
- imgUrl: '鍥惧眰 7 鎷疯礉 5.png',
- name: "鍧愭爣瀹氫綅",
- level: 1,
- },
- {
- id: 'k1',
- imgUrl: '娓呴櫎.png',
- level: 1,
- name: "娓呴櫎",
- },
- ],
- leftMenu: [
- {
- id: 'l1',
- name: '鍥惧眰绠＄悊',
- imgUrl: '鍥惧眰1 (1).png',
- checkImgUrl: '鍥惧眰1 (1) 鎷疯礉.png'
- },
- {
- id: 'l2',
- name: '鏍囩粯鏌ヨ',
- imgUrl: '褰㈢姸 4.png',
- checkImgUrl: '褰㈢姸 4 鎷疯礉.png'
- }, {
- id: 'l3',
- name: '涓撻鍥惧埗浣�',
- imgUrl: '褰㈢姸 2.png',
- checkImgUrl: '褰㈢姸 2 鎷疯礉.png'
- }, {
- id: 'l4',
- name: '宸ュ叿绠�',
- imgUrl: '褰㈢姸 1.png',
- checkImgUrl: '褰㈢姸 1 鎷疯礉.png'
- }, {
- id: 'l5',
- name: '鍏ㄥ睆',
- imgUrl: '褰㈢姸 8.png',
- checkImgUrl: '褰㈢姸 8 鎷疯礉.png'
- }, {
- id: 'l6',
- name: '搴曞浘鍒囨崲',
- imgUrl: '褰㈢姸 3.png',
- checkImgUrl: '褰㈢姸 3 鎷疯礉.png'
- }
- ]
-
-
-}
-export default menuData;
\ No newline at end of file
+ ],
+ },
+ {
+ id: "e1",
+ imgUrl: "褰㈢姸 5.png",
+ name: "蹇収",
+ level: 1,
+ },
+ {
+ id: "f1",
+ name: "绌洪棿鏌ヨ",
+ imgUrl: "褰㈢姸 3.png",
+ level: 1,
+ children: [],
+ },
+ {
+ id: "g1",
+ imgUrl: "鍥惧眰 7 鎷疯礉 5.png",
+ name: "鍧愭爣瀹氫綅",
+ level: 1,
+ },
+ {
+ id: "k1",
+ imgUrl: "娓呴櫎.png",
+ level: 1,
+ name: "娓呴櫎",
+ },
+ ],
+ leftMenu: [
+ {
+ id: "l1",
+ name: "鍥惧眰绠＄悊",
+ imgUrl: "鍥惧眰1 (1).png",
+ checkImgUrl: "鍥惧眰1 (1) 鎷疯礉.png",
+ },
+ {
+ id: "l2",
+ name: "鏍囩粯鏌ヨ",
+ imgUrl: "褰㈢姸 4.png",
+ checkImgUrl: "褰㈢姸 4 鎷疯礉.png",
+ },
+ {
+ id: "l3",
+ name: "涓撻鍥惧埗浣�",
+ imgUrl: "褰㈢姸 2.png",
+ checkImgUrl: "褰㈢姸 2 鎷疯礉.png",
+ },
+ // {
+ // id: "l4",
+ // name: "宸ュ叿绠�",
+ // imgUrl: "褰㈢姸 1.png",
+ // checkImgUrl: "褰㈢姸 1 鎷疯礉.png",
+ // },
+ {
+ id: "l5",
+ name: "搴曞浘鍒囨崲",
+ imgUrl: "褰㈢姸 8.png",
+ checkImgUrl: "褰㈢姸 8 鎷疯礉.png",
+ },
+ {
+ id: "l6",
+ name: "鍏ㄥ睆",
+ imgUrl: "褰㈢姸 3.png",
+ checkImgUrl: "褰㈢姸 3 鎷疯礉.png",
+ },
+ ],
+};
+export default menuData;
diff --git a/src/assets/js/Map/menuTool.js b/src/assets/js/Map/menuTool.js
index 642b8f4..187f20c 100644
--- a/src/assets/js/Map/menuTool.js
+++ b/src/assets/js/Map/menuTool.js
@@ -1,140 +1,127 @@
const menuTool = {
- toolMenu: null,
- toolFlag: null,
- colorAll: {
- },
- topTools(res) {
- this.clearTopTools();
- if (res.id == this.toolFlag) {
- this.toolFlag = null;
- return
- }
- this.toolFlag = res.id;
- switch (res.id) {
- case 'a2'://鐐规极娓�
- this.pointRoam();
- break;
- case 'a3'://绾挎极娓�
- this.lineRoam();
- break;
- case 'b2'://琛ㄩ潰璺濈
- this.surfaceDistance();
- break;
- case 'b3'://骞抽潰闈㈢Н
- this.planeDistance();
- break;
- case 'b4'://楂樼▼娴嬮噺
- this.heightMeasure();
- break;
- case 'b5'://鍨傜洿楂樺害
- this.verticalHeight();
- break;
- case 'd4'://鍦熸柟閲忚绠�
- this.Volumetric();
- break;
- case 'd5'://褰卞儚瀵规瘮
- this.CurtainContrast();
- break;
- case 'g1'://鍧愭爣瀹氫綅
- this.Coordposition();
- break;
- }
- },
- leftTools(res) {
- this.clearLeftTools()
- switch (res.id) {
- case 'l1':
- break;
- case 'l2':
- break;
- case 'l3'://鍦ㄧ嚎鍒跺浘
- this.setThematicMap();
- break;
- case 'l4':
- break;
- case 'l5':
- break;
- case 'l6':
- break;
- }
- },
+ toolMenu: null,
+ toolFlag: null,
+ colorAll: {},
+ topTools(res) {
+ this.clearTopTools();
+ if (res.id == this.toolFlag) {
+ this.toolFlag = null;
+ return;
+ }
+ this.toolFlag = res.id;
+ switch (res.id) {
+ case "a2": //鐐规极娓�
+ this.pointRoam();
+ break;
+ case "a3": //绾挎极娓�
+ this.lineRoam();
+ break;
+ case "b2": //琛ㄩ潰璺濈
+ this.surfaceDistance();
+ break;
+ case "b3": //骞抽潰闈㈢Н
+ this.planeDistance();
+ break;
+ case "b4": //楂樼▼娴嬮噺
+ this.heightMeasure();
+ break;
+ case "b5": //鍨傜洿楂樺害
+ this.verticalHeight();
+ break;
+ case "d4": //鍦熸柟閲忚绠�
+ this.Volumetric();
+ break;
+ case "d5": //褰卞儚瀵规瘮
+ this.CurtainContrast();
+ break;
+ case "g1": //鍧愭爣瀹氫綅
+ this.Coordposition();
+ break;
+ }
+ },
+ leftTools(res) {
+ this.clearLeftTools();
+ switch (res.id) {
+ case "l1":
+ break;
+ case "l2":
+ break;
+ case "l3": //鍦ㄧ嚎鍒跺浘
+ this.setThematicMap();
+ break;
+ case "l4":
+ break;
+ case "l5":
+ break;
+ case "l6":
+ break;
+ }
+ },
- //鍦ㄧ嚎鍒跺浘
- setThematicMap() {
- // earthCtrl.coreMap.scene.mode = SmartEarth.Cesium.SceneMode.SCENE2D;
- // var handle = new SmartEarth.Cesium.ScreenSpaceEventHandler(earthCtrl.viewer.scene.canvas);
+ //鍦ㄧ嚎鍒跺浘
+ setThematicMap() {
+ // earthCtrl.coreMap.scene.mode = SmartEarth.Cesium.SceneMode.SCENE2D;
+ // var handle = new SmartEarth.Cesium.ScreenSpaceEventHandler(earthCtrl.viewer.scene.canvas);
+ },
- },
+ //鍧愭爣瀹氫綅
+ Coordposition() {},
+ //褰卞儚瀵规瘮
+ CurtainContrast() {
+ this.toolMenu = earthCtrl.analysis.createCurtainContrast({
+ leftIndex: 0,
+ rightIndex: 1,
+ });
+ },
+ //鍦熸柟閲忚绠�
+ Volumetric() {
+ const Volumetric = earthCtrl.analysis.createVolumetricMeasure({});
+ Volumetric.startDrawing();
+ },
+ //鍨傜洿楂樺害
+ verticalHeight() {
+ earthCtrl.measure.measureHeight(function (e) {});
+ },
+ //楂樼▼娴嬮噺
+ heightMeasure() {},
+ //骞抽潰闈㈢Н
+ planeDistance() {
+ earthCtrl.analysis.getPlaneArea(function (e) {});
+ },
+ //琛ㄩ潰璺濈
+ surfaceDistance() {
+ earthCtrl.measure.lineLength(function (e) {});
+ },
+ //鐐规极娓�
+ pointRoam() {},
+ //绾挎极娓�
+ lineRoam() {},
- //鍧愭爣瀹氫綅
- Coordposition() {
-
- },
- //褰卞儚瀵规瘮
- CurtainContrast() {
- this.toolMenu = earthCtrl.analysis.createCurtainContrast({ leftIndex: 0, rightIndex: 1 })
- },
- //鍦熸柟閲忚绠�
- Volumetric() {
- const Volumetric = earthCtrl.analysis.createVolumetricMeasure({});
- Volumetric.startDrawing();
- },
- //鍨傜洿楂樺害
- verticalHeight() {
- earthCtrl.measure.measureHeight(function (e) {
- })
- },
- //楂樼▼娴嬮噺
- heightMeasure() {
- },
- //骞抽潰闈㈢Н
- planeDistance() {
- earthCtrl.analysis.getPlaneArea(function (e) {
- })
- },
- //琛ㄩ潰璺濈
- surfaceDistance() {
- earthCtrl.measure.lineLength(function (e) {
- })
- },
- //鐐规极娓�
- pointRoam() {
-
- },
- //绾挎极娓�
- lineRoam() {
-
-
- },
-
- //娓呴櫎鏂规硶
- clearTopTools() {
- if (this.toolFlag) {
- switch (this.toolFlag) {
- case 'a2':
-
- break;
- case 'a3':
-
- break;
- case 'b2':
- case 'b3':
- case 'b4':
- case 'b5':
-
- break;
- case 'd5':
- debugger
- this.toolMenu.removeFromMap()
- break;
- }
- // this.toolFlag = null;
- this.toolMenu = null;
- }
- },
- clearLeftTools() {
-
- },
-
-}
-export default menuTool;
\ No newline at end of file
+ //娓呴櫎鏂规硶
+ clearTopTools() {
+ if (this.toolFlag) {
+ switch (this.toolFlag) {
+ case "a2":
+ break;
+ case "a3":
+ break;
+ case "b2":
+ earthCtrl.tools.browse();
+ break;
+ case "b3":
+ case "b4":
+ case "b5":
+ earthCtrl.tools.browse();
+ break;
+ case "d5":
+ debugger;
+ this.toolMenu.removeFromMap();
+ break;
+ }
+ // this.toolFlag = null;
+ this.toolMenu = null;
+ }
+ },
+ clearLeftTools() {},
+};
+export default menuTool;
diff --git a/src/views/Index.vue b/src/views/Index.vue
index 936ea97..218394c 100644
--- a/src/views/Index.vue
+++ b/src/views/Index.vue
@@ -7,7 +7,6 @@
<menus></menus>
<bottom-btn></bottom-btn>
- <top-btn></top-btn>
</div>
</template>
@@ -24,11 +23,10 @@
import menus from "@/views/menus.vue";
//搴曢儴鑿滃崟
import bottomBtn from "@/components/bottomBtn.vue";
-//椤堕儴鑿滃崟
-import topBtn from "@/components/topBtn.vue";
import InitMap from "@/assets/js/Map/index.js";
-
+// import * as SmartEarth from "../../public/CIMSDK/index.js";
+// import * as SmartEarth from "../assets/js/CIMSDK/index.js";
let map;
var viewer;
const init = () => {
@@ -37,6 +35,7 @@
};
onMounted(() => {
+ // console.log(SmartEarth);
InitMap.init3DMap();
init();
});
diff --git a/src/views/baseMapSwitching/baseMapSwitching.vue b/src/views/baseMapSwitching/baseMapSwitching.vue
new file mode 100644
index 0000000..abd98ff
--- /dev/null
+++ b/src/views/baseMapSwitching/baseMapSwitching.vue
@@ -0,0 +1,124 @@
+<template>
+ <div v-drag class="baseMapSwitching">
+ <div class="baseMapSwitchingTitle">
+ <div class="tileLeft">
+ <div class="titleImg">
+ <ArrowLeft />
+ </div>
+ <div class="titleLable"></div>
+ </div>
+ </div>
+ <div class="baseMapSwitching_content">
+ <div class="baseMapSwitching_list">
+ <div
+ class="baseMapSwitching_list_tr"
+ v-for="(item, i) in list"
+ :key="i"
+ >
+ <div class="baseMapSwitching_list_tr_name">
+ <span>{{ item.name }}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script lang="ts" setup>
+import {
+ ref,
+ onMounted,
+ onBeforeUnmount,
+ reactive,
+ defineProps,
+ defineEmits,
+} from "vue";
+let list = ref([
+ {
+ name: "绛夎窛绂绘煴鎶曞奖 ( <75)",
+ type: "poi",
+ icon: "d.png",
+ },
+ {
+ name: "鍖楁瀬骞抽潰鎶曞奖",
+ type: "line",
+ icon: "x.png",
+ },
+ {
+ name: "鍗楁瀬骞抽潰鎶曞奖",
+ type: "cover",
+ icon: "m.png",
+ },
+]);
+</script>
+
+<style lang="less" scoped>
+.baseMapSwitching {
+ width: 359px;
+ height: 680px;
+ background: rgba(7, 8, 14, 0.8);
+ .baseMapSwitchingTitle {
+ width: calc(100% - 27px);
+ height: 42px;
+ background: #0e151f;
+ box-shadow: 0px 0px 6px 0px #080c13,
+ 0px 14px 16px 0px rgba(38, 47, 71, 0.68);
+ display: flex;
+ justify-content: space-between;
+ padding-left: 7px;
+ padding-right: 20px;
+ color: white;
+ .tileLeft {
+ height: 100%;
+ display: flex;
+ align-items: center;
+
+ .titleLable {
+ font-size: 24px;
+ font-family: Source Han Sans CN;
+ font-weight: 400;
+ color: #ffffff;
+ }
+ }
+ .titleImg {
+ width: 20px;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ color: rgba(104, 156, 255, 1);
+ }
+ }
+ .baseMapSwitching_content {
+ margin-top: 3px;
+
+ .baseMapSwitching_content_title {
+ font-size: 20px;
+ font-weight: 300;
+ color: #ffffff;
+ }
+
+ .baseMapSwitching_list_tr {
+ cursor: pointer;
+ height: 42px;
+ margin-top: 10px;
+ background: #0d131d;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 0 25px;
+ .baseMapSwitching_list_tr_name {
+ // display: flex;
+ // align-items: center;
+ // justify-content: space-between;
+
+ span {
+ font-size: 16px;
+ font-weight: 300;
+ color: #ffffff;
+ margin-left: 10px;
+ }
+ }
+ }
+ }
+}
+</style>
diff --git a/src/views/layer/layerManage.vue b/src/views/layer/layerManage.vue
index 92b0bef..bb1a15b 100644
--- a/src/views/layer/layerManage.vue
+++ b/src/views/layer/layerManage.vue
@@ -1,47 +1,71 @@
<template>
- <div
- v-drag
- class="layerBox"
- >
+ <div v-drag class="layerBox">
<div class="layerTitle">
<div class="tileLeft">
<div class="titleImg">
<ArrowLeft />
</div>
- <div class="titleLable">
- 鍥惧眰绠＄悊
- </div>
+ <div class="titleLable">鍥惧眰绠＄悊</div>
</div>
<div class="titleImg">
<Setting />
</div>
</div>
- <div>
- <div
- class="contentBox"
- v-for="(item,i) in menuOption"
- >
+ <div class="layerContent">
+ <div class="contentBox" v-for="(item, i) in menuOption" :key="i">
<div class="contentTile">
<div class="contentLeft">
<div class="contentImg"></div>
<div class="contentLabel">{{ item.name }}</div>
</div>
<div class="contentRight">
- <div class="contentCheck"><el-checkbox
+ <div class="contentCheck">
+ <el-checkbox
@change="handlCheckAllChange(item)"
v-model="item.checkedAll"
- >鍏ㄩ儴閫変腑</el-checkbox></div>
+ >鍏ㄩ儴閫変腑</el-checkbox
+ >
+ </div>
<div>
<div
- @click="handlIsShow(item,1)"
- v-show="item.isShow"
+ @click="handlIsShow(item.name)"
class="contentUP"
+ :class="{ accordion: item.isShow }"
></div>
- <div
- @click="handlIsShow(item,2)"
- v-show="!item.isShow"
- class="contentDown"
- ></div>
+ </div>
+ </div>
+ </div>
+
+ <div class="content" v-show="item.isShow">
+ <div class="layer_box" v-for="(v, k) in item.children" :key="k">
+ <div class="check_box">
+ <el-checkbox
+ @change="handlCheckAllChange(item)"
+ v-model="v.layerState"
+ >{{ v.layerName }}</el-checkbox
+ >
+ <img src="../../assets/img/layer.png" alt="" />
+ </div>
+ <div class="slider-demo-block">
+ <div class="demonstration">閫忔槑搴�</div>
+ <el-slider v-model="transparence" />
+ <div class="demonstration">{{ transparence }}%</div>
+ </div>
+ <div class="selectBox">
+ <div class="selectTile demonstration">鎷変几鏂瑰紡</div>
+ <el-select
+ v-model="stretchValue"
+ class="m-2"
+ placeholder="Select"
+ size="small"
+ >
+ <el-option
+ v-for="item in stretchOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
</div>
</div>
</div>
@@ -59,27 +83,67 @@
defineProps,
defineEmits,
} from "vue";
-const menuOption = [
+const stretchValue = ref("");
+
+const stretchOptions = [
+ {
+ value: "Option1",
+ label: "Option1",
+ },
+ {
+ value: "Option2",
+ label: "Option2",
+ },
+ {
+ value: "Option3",
+ label: "Option3",
+ },
+ {
+ value: "Option4",
+ label: "Option4",
+ },
+ {
+ value: "Option5",
+ label: "Option5",
+ },
+];
+const transparence = ref(0);
+let menuOption = reactive([
{
name: "娴嬭瘯",
- isShow: true,
+ isShow: false,
checkedAll: false,
+ children: [
+ {
+ layerState: false,
+ layerName: "鍥惧眰鍚嶇О",
+ layerUrl: "",
+ },
+ ],
},
{
name: "娴嬭瘯1",
- isShow: true,
+ isShow: false,
checkedAll: true,
+ layerState: false,
},
-];
+]);
+const activeNames = ref(false);
+const handleChange = (val: string[]) => {
+ console.log(val);
+};
const handlCheckAllChange = (res) => {};
-const handlIsShow = (res, boolean) => {};
+const handlIsShow = (res: string) => {
+ menuOption.forEach((e) => {
+ if (e.name == res) {
+ e.isShow = !e.isShow;
+ }
+ });
+};
</script>
<style lang="less" scoped>
.layerBox {
- position: absolute;
- top: 135px;
- left: 100px;
width: 359px;
height: 680px;
background: rgba(7, 8, 14, 0.8);
@@ -111,10 +175,16 @@
height: 100%;
display: flex;
align-items: center;
+ color: rgba(104, 156, 255, 1);
}
+ }
+ .layerContent {
+ padding: 0 8px;
}
.contentBox {
margin-top: 3px;
+ .content {
+ }
}
.contentTile {
width: 100%;
@@ -152,7 +222,14 @@
.contentUP {
width: 18px;
height: 11px;
- background: url("../../assets/img/leftBtn/绠ご-宸� 鎷疯礉.png");
+ background: url("../../assets/img/leftBtn/绠ご-宸� 鎷疯礉.png") no-repeat
+ center;
+ background-size: 100% 100%;
+
+ cursor: pointer;
+ }
+ .accordion {
+ transform: rotate(180deg);
}
.contentDown {
width: 18px;
@@ -161,5 +238,65 @@
}
}
}
+ .content {
+ background: #1e2a3d;
+ padding: 10px;
+ }
+ .check_box {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding-right: 50px;
+ img {
+ width: 22px;
+ height: 19px;
+ }
+ }
+ .check_box .el-checkbox {
+ font-size: 16px;
+ color: #ffffff;
+ }
+ .check_box /deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
+ background-color: rgba(13, 255, 0, 1);
+ border-color: rgba(41, 109, 255, 1);
+ }
+ .check_box /deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
+ color: #fff;
+ }
+ .slider-demo-block {
+ margin-top: 22px;
+ }
+ .demonstration {
+ font-size: 12px;
+ font-weight: 300;
+ color: #d6e4ff;
+ }
+ /deep/ .el-slider__runway {
+ height: 2px;
+
+ background: #73a1fa;
+ }
+ /deep/ .el-slider__bar {
+ height: 2px;
+
+ background: #73a1fa;
+ }
+ /deep/ .el-slider__button {
+ width: 17px;
+ height: 18px;
+ border: 0;
+ background: url("../../assets/img/DBX.png") no-repeat center;
+ background-size: 100% 100%;
+ border-radius: 0;
+ }
+ .selectBox {
+ margin-top: 24px;
+ .selectTile {
+ padding-bottom: 6px;
+ }
+ .el-select {
+ width: 100%;
+ }
+ }
}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/menus.vue b/src/views/menus.vue
index 7e2f774..2b8766e 100644
--- a/src/views/menus.vue
+++ b/src/views/menus.vue
@@ -1,5 +1,5 @@
<template>
- <div class="menus">
+ <div class="menus" v-show="fullScreen">
<div class="logo_box">
<img src="../assets/img/logo.png" alt="" class="logo" />
<div class="logo_name">
@@ -11,6 +11,7 @@
<div
class="imgBox"
v-for="(item, i) in menuOptions"
+ :key="i"
@click="setMenuClick(item)"
>
<img
@@ -26,7 +27,14 @@
</div>
</div>
</div>
- <layer-manage> </layer-manage>
+ <div class="content_box" v-show="fullScreen">
+ <layer-manage v-show="checkMenuFlag == 'l1'"> </layer-manage>
+ <plotting v-show="checkMenuFlag == 'l2'"> </plotting>
+ <baseMapSwitching v-show="checkMenuFlag == 'l5'"> </baseMapSwitching>
+ <search> </search>
+ </div>
+ <top-btn v-show="fullScreen"></top-btn>
+ <div class="fullScreen_btn"></div>
</template>
<script lang="ts" setup>
@@ -40,12 +48,23 @@
} from "vue";
import menuData from "@/assets/js/Map/menuData";
import menuTool from "@/assets/js/Map/menuTool";
+//椤堕儴鑿滃崟
+import topBtn from "@/components/topBtn.vue";
//鍥惧眰绠＄悊椤甸潰
import layerManage from "@/views/layer/layerManage.vue";
+//鍦扮悊缂栫爜鎼滅储
+import search from "@/views/search/search.vue";
+//鏍囩粯鏌ヨ
+import plotting from "@/views/plotting/plotting.vue";
+//搴曞浘鍒囨崲
+import baseMapSwitching from "@/views/baseMapSwitching/baseMapSwitching.vue";
const menuOptions = ref([]);
const checkMenuFlag = ref("");
+let fullScreen = ref(true);
const setMenuClick = (res) => {
- console.log(res);
+ if (res.id == "l6") {
+ fullScreen.value = !fullScreen.value;
+ }
if (checkMenuFlag.value && checkMenuFlag.value == res.id) {
checkMenuFlag.value = null;
} else {
@@ -99,6 +118,7 @@
display: flex;
justify-content: center;
margin-bottom: 52px;
+ cursor: pointer;
img {
width: 30px;
height: 30px;
@@ -106,4 +126,16 @@
}
}
}
+.content_box {
+ position: absolute;
+ top: 135px;
+ left: 100px;
+ display: flex;
+}
+.fullScreen_btn {
+ // background: url("../assets/img/褰㈢姸 3.png") no-repeat center;
+ // background-size: 100% 100%;
+ width: 30px;
+ height: 30px;
+}
</style>
diff --git a/src/views/plotting/plotting.vue b/src/views/plotting/plotting.vue
new file mode 100644
index 0000000..7559be6
--- /dev/null
+++ b/src/views/plotting/plotting.vue
@@ -0,0 +1,203 @@
+<template>
+ <div v-drag class="plottingBox">
+ <div class="plottingTitle">
+ <div class="tileLeft">
+ <div class="titleImg">
+ <ArrowLeft />
+ </div>
+ <div class="titleLable">鏍囩粯鏌ヨ</div>
+ </div>
+ </div>
+ <div class="plotting_content">
+ <div class="plotting_content_btn">
+ <span class="plotting_content_title">鏍囩粯宸ュ叿</span>
+ <div class="plotting_btn">
+ <div class="btn_box_d btn_box"></div>
+ <div class="btn_box_x btn_box"></div>
+ <div class="btn_box_m btn_box"></div>
+ </div>
+ </div>
+ <div class="plotting_list">
+ <div class="plotting_list_tr" v-for="(item, i) in list" :key="i">
+ <div class="plotting_list_tr_name">
+ <img
+ :src="require(`../../assets/img/${item.icon}`)"
+ class="ico"
+ alt=""
+ /><span>{{ item.name }}</span>
+ </div>
+ <div class="plotting_list_tr_btn">
+ <div class="tr_btn dw"></div>
+ <div class="tr_btn sc"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script lang="ts" setup>
+import {
+ ref,
+ onMounted,
+ onBeforeUnmount,
+ reactive,
+ defineProps,
+ defineEmits,
+} from "vue";
+let list = ref([
+ {
+ name: "Path #9",
+ type: "poi",
+ icon: "d.png",
+ },
+ {
+ name: "璺緞 #1",
+ type: "line",
+ icon: "x.png",
+ },
+ {
+ name: "澶氳竟褰� #5",
+ type: "cover",
+ icon: "m.png",
+ },
+]);
+</script>
+
+<style lang="less" scoped>
+.plottingBox {
+ width: 359px;
+ height: 680px;
+ background: rgba(7, 8, 14, 0.8);
+ .plottingTitle {
+ width: calc(100% - 27px);
+ height: 42px;
+ background: #0e151f;
+ box-shadow: 0px 0px 6px 0px #080c13,
+ 0px 14px 16px 0px rgba(38, 47, 71, 0.68);
+ display: flex;
+ justify-content: space-between;
+ padding-left: 7px;
+ padding-right: 20px;
+ color: white;
+ .tileLeft {
+ height: 100%;
+ display: flex;
+ align-items: center;
+
+ .titleLable {
+ font-size: 24px;
+ font-family: Source Han Sans CN;
+ font-weight: 400;
+ color: #ffffff;
+ }
+ }
+ .titleImg {
+ width: 20px;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ color: rgba(104, 156, 255, 1);
+ }
+ }
+ .plotting_content {
+ margin-top: 3px;
+
+ .plotting_content_title {
+ font-size: 20px;
+ font-weight: 300;
+ color: #ffffff;
+ }
+ .plotting_content_btn {
+ height: 42px;
+ background: #0d131d;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 25px;
+ .plotting_btn {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ .btn_box {
+ cursor: pointer;
+ margin-right: 18px;
+ }
+ .btn_box_d {
+ width: 17px;
+ height: 18px;
+ background: url("../../assets/img/d.png") no-repeat center;
+ background-size: 100% 100%;
+ }
+ .btn_box_d:hover {
+ background: url("../../assets/img/dl.png") no-repeat center;
+ background-size: 100% 100%;
+ }
+ .btn_box_x {
+ width: 26px;
+ height: 27px;
+ background: url("../../assets/img/x.png") no-repeat center;
+ background-size: 100% 100%;
+ }
+ .btn_box_x:hover {
+ background: url("../../assets/img/xl.png") no-repeat center;
+ background-size: 100% 100%;
+ }
+ .btn_box_m {
+ width: 22px;
+ height: 20px;
+ background: url("../../assets/img/m.png") no-repeat center;
+ background-size: 100% 100%;
+ margin-right: 0;
+ }
+ .btn_box_m:hover {
+ background: url("../../assets/img/ml.png") no-repeat center;
+ background-size: 100% 100%;
+ }
+ }
+ }
+ .plotting_list_tr {
+ height: 42px;
+ margin-top: 10px;
+ background: #0d131d;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 25px;
+ .plotting_list_tr_name {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ .ico {
+ width: 26px;
+ height: 27px;
+ }
+ span {
+ font-size: 16px;
+ font-weight: 300;
+ color: #ffffff;
+ margin-left: 10px;
+ }
+ }
+ .plotting_list_tr_btn {
+ display: flex;
+ align-items: center;
+ .tr_btn {
+ width: 16px;
+ height: 15px;
+ cursor: pointer;
+ }
+ .dw {
+ background: url("../../assets/img/dw.png") no-repeat center;
+ background-size: 100% 100%;
+ margin-right: 18px;
+ }
+ .sc {
+ background: url("../../assets/img/sc.png") no-repeat center;
+ background-size: 100% 100%;
+ }
+ }
+ }
+ }
+}
+</style>
diff --git a/src/views/search/search.vue b/src/views/search/search.vue
new file mode 100644
index 0000000..40c7f0b
--- /dev/null
+++ b/src/views/search/search.vue
@@ -0,0 +1,218 @@
+<template>
+ <div class="searchBox">
+ <div>
+ <el-input
+ v-model="searchValue"
+ class="searchInput"
+ placeholder="璇疯緭鍏ュ湴鍚�"
+ :prefix-icon="Search"
+ :clearable="true"
+ />
+ </div>
+ <div class="search_content">
+ <el-collapse v-model="activeNames" @change="handleChange">
+ <el-collapse-item title="鏌ヨ缁撴灉" name="1">
+ <div class="search_content_text">鎬绘煡璇㈢粨鏋�:448</div>
+ <div class="search_content_text paging">
+ 鎬婚〉鏁帮細45
+ <el-button size="small" text :icon="DArrowLeft" class="pagingBtn" />
+ <el-button size="small" text :icon="ArrowLeft" class="pagingBtn1" />
+ <el-input class="numInput" v-model="num" />
+ <el-button
+ size="small"
+ text
+ :icon="ArrowRight"
+ class="pagingBtn1"
+ />
+ <el-button
+ size="small"
+ text
+ :icon="DArrowRight"
+ class="pagingBtn"
+ />
+ </div>
+ <div class="table_box">
+ <div class="table_header">
+ <div class="table_th_x">搴忓彿</div>
+ <div class="table_th">鍦板悕</div>
+ </div>
+ <div class="table_childer">
+ <div class="table_tr">
+ <div class="table_th_x"></div>
+ <div class="table_th"></div>
+ </div>
+ <div class="table_tr">
+ <div class="table_th_x"></div>
+ <div class="table_th"></div>
+ </div>
+ <div class="table_tr">
+ <div class="table_th_x"></div>
+ <div class="table_th"></div>
+ </div>
+ </div>
+ </div>
+ </el-collapse-item>
+ </el-collapse>
+ </div>
+ </div>
+</template>
+
+<script lang="ts" setup>
+import {
+ ref,
+ onMounted,
+ onBeforeUnmount,
+ reactive,
+ defineProps,
+ defineEmits,
+} from "vue";
+import {
+ Search,
+ DArrowLeft,
+ ArrowLeft,
+ ArrowRight,
+ DArrowRight,
+} from "@element-plus/icons-vue";
+
+let searchValue = ref("");
+
+const activeNames = ref(["1"]);
+const num = ref(1);
+const NumhandleChange = (value: number) => {
+ console.log(value);
+};
+const handleChange = (val: string[]) => {
+ console.log(val);
+};
+const tableData = reactive([
+ {
+ date: "1",
+ name: "Tom",
+ },
+ {
+ date: "2",
+ name: "Tom",
+ },
+ {
+ date: "3",
+ name: "Tom",
+ },
+ {
+ date: "4",
+ name: "Tom",
+ },
+]);
+onMounted(() => {});
+</script>
+<style lang="less" scoped>
+.searchBox {
+ margin-left: 34px;
+}
+.searchInput {
+ width: 222px;
+ height: 35px;
+}
+.search_content {
+ margin-top: 8px;
+ width: 222px;
+ // background: rgba(7, 8, 14, 0.8);
+ border-radius: 4px;
+ .el-collapse,
+ /deep/ .el-collapse-item__wrap {
+ border: 0;
+ background-color: transparent;
+ }
+ /deep/ .el-collapse-item__header {
+ border-radius: 4px 4px 0px 0px;
+ height: 35px;
+ background: #0e151f;
+ box-shadow: 0px 0px 6px 0px #080c13,
+ 0px 14px 16px 0px rgba(38, 47, 71, 0.68);
+ padding: 10px 20px;
+ box-sizing: border-box;
+ color: #d6e4ff;
+ border: 0;
+ }
+ /deep/ .el-collapse-item__content {
+ background: rgba(7, 8, 14, 0.8);
+ padding: 14px;
+ }
+
+ .search_content_text {
+ font-size: 12px;
+ color: #d6e4ff;
+ }
+ .numInput {
+ width: 49px;
+ height: 23px;
+ padding: 0 5px;
+ }
+ .paging {
+ margin-top: 14px;
+ }
+ .pagingBtn {
+ width: 15px;
+ height: 12px;
+ margin: 0;
+ font-size: 16px;
+ color: RGBA(186, 199, 223, 1);
+ }
+ .pagingBtn1 {
+ width: 8px;
+ height: 12px;
+ margin: 0;
+ padding: 0;
+ font-size: 16px;
+ color: RGBA(186, 199, 223, 1);
+ }
+ .pagingBtn:hover,
+ .pagingBtn1:hover {
+ background: transparent;
+ }
+ .pagingBtn1.is-text:not(.is-disabled):focus,
+ .pagingBtn1.is-text:not(.is-disabled):hover,
+ .pagingBtn.is-text:not(.is-disabled):focus,
+ .pagingBtn.is-text:not(.is-disabled):hover {
+ background: transparent;
+ }
+ .table_box {
+ margin-top: 17px;
+ border-radius: 4px;
+ border: 1px solid #d6e4ff;
+ .table_header {
+ height: 27px;
+ background: #0e151f;
+ box-shadow: 0px 0px 6px 0px #080c13,
+ 0px 14px 16px 0px rgba(38, 47, 71, 0.68);
+ display: flex;
+ }
+ .table_th_x {
+ width: 50px;
+ border-right: 1px solid rgba(214, 228, 255, 0.4);
+ font-size: 14px;
+
+ color: #d6e4ff;
+ display: flex;
+ align-items: center;
+ padding-left: 10px;
+ box-sizing: border-box;
+ }
+ .table_th {
+ font-size: 14px;
+ color: #d6e4ff;
+ display: flex;
+ align-items: center;
+ padding-left: 10px;
+ overflow: hidden;
+ }
+ .table_tr {
+ height: 27px;
+ display: flex;
+ background: #000000;
+ }
+ .table_tr:nth-child(2n) {
+ background: #0e151f;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3