Forráskód Böngészése

feat:更新代码

1、新增数据集UI界面 。引入elementUI库(未实例化)
2、调整样式
jinx 4 éve
szülő
commit
1e93e9e108

+ 126 - 0
components/upload-Pointclound/index.js

@@ -0,0 +1,126 @@
+(() => {
+    Vue.component('uploadPointclound', {
+        props: [],
+        name: 'uploadPointclound',
+        template: `<div id="uploadBox" >
+                    <h4>添加数据集 </h4>
+                    <div class="selectBox">
+                        <el-select v-model="value" filterable :filter-method="searchScene" placeholder="请选择">
+                            <el-option v-for="item in options" :key="item.code" :label="item.code" :value="item.code">
+                                <div class="sceneName">
+                                    <p class="code">{{item.code}}</p>
+                                    <span class="name">来自场景:{{item.name}}</span>
+                                </div>
+
+                            </el-option>
+                        </el-select>
+
+                    </div>
+                    <div class="uploadBtn" @click="openUpload" :class="{disabled:value==''}">
+                        <i class="fa fa-plus ng-scope"></i>&nbsp;&nbsp;添加到场景
+                    </div>
+
+                    <p class="itemTitle">已添加的数据集 </p>
+                    <div class="listBox">
+                        <ul class="sceneList">
+                            <li class="sceneItem" v-for="i in 10">
+                                <div class="sceneName">
+                                    <p class="code">t-iksBApb</p>
+                                    <span class="name">来自场景:港2</span>
+                                </div>
+                                <div class="scene_control">
+                                   
+
+                                    <el-popconfirm placement="top" title="是否要删除该数据集?" :hide-icon="true" @confirm="delConfirm">
+                                        <el-button class="delBtn" title="删除" slot="reference"></el-button>
+                                    </el-popconfirm>
+                                    <!-- <div class="delBtn" title="删除"></div> -->
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                </div>`,
+        data() {
+            return {
+                options: [{
+                    id: 1,
+                    name: "港2",
+                    code: 't-iksBApb'
+                }, {
+                    id: 2,
+                    name: "港2",
+                    code: 't-iksBA2pb'
+                }, {
+                    id: 3,
+                    name: "港2",
+                    code: 't-iksBA3pb'
+                }, {
+                    id: 4,
+                    name: "港2",
+                    code: 't-iksBA4pb'
+                }, {
+                    id: 5,
+                    name: "港2",
+                    code: 't-iksBA5pb'
+                }, {
+                    id: 6,
+                    name: "港2",
+                    code: 't-iksBA6pb'
+                }],
+                value: '',
+            }
+        },
+        methods: {
+            searchScene() {
+                let t = setTimeout(() => {
+                    console.log(1)
+
+                    clearTimeout(t)
+                }, 3000);
+            },
+            openUpload() {
+                this.$parent.showLoading()
+                setTimeout(() => {
+                    this.value = ''
+                    this.$parent.hideLoading()
+                    this.$message({
+                        message: '恭喜你,这是一条成功消息',
+                        type: 'success',
+                        duration: 2000,
+                    });
+                    IV.api.AuthenticationService.sendAuthenticationChanged()
+                        // IV.SidebarMenuService.goToItem(IV.SidebarMenuService.items[1])
+
+                }, 2000);
+                // this.$confirm('此操作将永久删除该文件, 是否继续?', {
+                //     confirmButtonText: '确定',
+                //     cancelButtonText: '取消',
+                //     center: true
+                // }).then(() => {
+                //     // this.$message({
+                //     //     type: 'success',
+                //     //     message: '删除成功!'
+                //     // });
+                // }).catch(() => {
+                //     // this.$message({
+                //     //     type: 'info',
+                //     //     message: '已取消删除'
+                //     // });
+                // });
+            },
+            delConfirm() {
+                console.log(1)
+            }
+        },
+        computed: {
+
+        },
+        destroyed() {
+
+        },
+        mounted() {
+
+        },
+    })
+})();

A különbségek nem kerülnek megjelenítésre, a fájl túl nagy
+ 15704 - 0
css/element.css


BIN
css/fonts/element-icons.ttf


BIN
css/fonts/element-icons.woff


+ 33 - 5
css/style.css

@@ -104,6 +104,7 @@ sidebar-menu-items-collection>.panel-autoscroll>ul {
 }
 
 sidebar-menu .copyright-area {
+    display: none;
     color: #fff;
     background-color: transparent !important;
 }
@@ -687,6 +688,8 @@ input {
     background: transparent !important;
     border: 1px solid rgba(255, 255, 255, 0.4) !important;
     color: #fff !important;
+    width: 100%;
+    height: 100%;
 }
 
 .ui-widget-content {
@@ -980,7 +983,7 @@ form[class="ng-pristine ng-valid"] .panel .panel-body .add-building:hover {
     color: #fff;
 }
 
-form[class="ng-pristine ng-valid"] .panel .panel-body .btn-block:nth-of-type(n+2) {
+form[class="ng-pristine ng-valid"] .panel .panel-body .btn-block:nth-of-type(2) {
     display: none;
 }
 
@@ -1031,19 +1034,26 @@ form[role="form"] .panel .panel-heading {
     border-color: rgba(255, 255, 255, .2);
 }
 
-form[role="form"] .panel .panel-body .add-building {
+form[role="form"] .panel .panel-body button.btn-block {
     background: #15BEC8;
     color: #fff;
     border-color: #15BEC8;
 }
 
-form[role="form"] .panel .panel-body .add-building:hover {
+form[role="form"] .panel .panel-body button.btn-block:hover {
     background: #15BEC8;
     color: #fff;
 }
 
-form[role="form"] .panel .panel-body .btn-block:nth-of-type(n+2) {
-    display: none;
+form[role="form"] .panel .panel-body .add-building {
+    background: #15BEC8;
+    color: #fff;
+    border-color: #15BEC8;
+}
+
+form[role="form"] .panel .panel-body .add-building:hover {
+    background: #15BEC8;
+    color: #fff;
 }
 
 form[role="form"] .panel .panel-body label.btn-block {
@@ -2047,4 +2057,22 @@ translate-panel .translate-icon {
 
 rotate-panel .rotate-icon {
     color: #15BEC8 !important;
+}
+
+.autoscroll::-webkit-scrollbar {
+    width: 8px;
+}
+
+.autoscroll::-webkit-scrollbar-track {
+    background-color: #000;
+    -webkit-border-radius: 1em;
+    -moz-border-radius: 1em;
+    border-radius: 1em;
+}
+
+.autoscroll::-webkit-scrollbar-thumb {
+    background-color: rgba(255, 255, 255, .2);
+    -webkit-border-radius: 1em;
+    -moz-border-radius: 1em;
+    border-radius: 1em;
 }

BIN
font/element-icons.ttf


BIN
font/element-icons.woff


A különbségek nem kerülnek megjelenítésre, a fájl túl nagy
+ 1 - 0
js/element.js


+ 65 - 106
locat/addDataSet.html

@@ -3,7 +3,7 @@
 
 <head>
     <!-- <link rel="stylesheet" href="./ol.css" type="text/css"> -->
-    <link rel="stylesheet" href="./style.css" type="text/css">
+    <link rel="stylesheet" href="../style.css" type="text/css">
 
     <!-- <script src="./ol.js"></script> -->
     <style>
@@ -21,6 +21,7 @@
 
 <body>
     <div id="app" v-cloak>
+
         <div class="content">
 
             <!-- <div class="rightBox">
@@ -32,97 +33,28 @@
             </div> -->
             <div id="plane">
 
-                <div class="main" v-if="!isEdit">
+                <div class="main" v-if="!isEdit && !isUpload">
                     <!-- <div class="title">定位</div> -->
-                    <p class="desc">通过两个控制点坐标确定点云在地图上的位置</p>
+                    <p class="desc">提示:当前控制点坐标为系统提供的默认值,请将控制点坐标调整为真实的地理坐标。</p>
                     <div class="editBtn" @click="openEdit">修改控制点</div>
-                    <p v-if="status!=1" style="color: #999;margin: 10px 0 ; ">提示:当前控制点坐标为系统提供的默认值,请点击按钮输入真实的控制点坐标
-                    </p>
-                    <div class="main_item">
-                        <p class="main_item_title">控制点1</p>
-                        <div class="dataBox">
-                            <p>本地坐标</p>
-                            <div>
-                                <span>X:{{showData.ax}}</span><br/>
-                                <span>Y:{{showData.ay}}</span><br/>
-                                <!-- <span>Z:{{showData.az}}</span><br/> -->
-                            </div>
 
-                            <p>地理坐标</p>
-                            <div>
-                                <span>经度:{{showData.alon}}</span><br/>
-                                <span>纬度:{{showData.alat}}</span><br/>
-                                <!-- <span>高程:{{showData.aalt}}</span><br/> -->
-                            </div>
-                        </div>
-                    </div>
-                    <div class="main_item">
-                        <p class="main_item_title">控制点2</p>
-                        <div class="dataBox">
-                            <p>本地坐标</p>
-                            <div>
-                                <span>X:{{showData.bx}}</span><br/>
-                                <span>Y:{{showData.by}}</span><br/>
-                                <!-- <span>Z:{{showData.bz}}</span><br/> -->
-                            </div>
 
-                            <p>地理坐标</p>
-                            <div>
-                                <span>经度:{{showData.blon}}</span><br/>
-                                <span>纬度:{{showData.blat}}</span><br/>
-                                <!-- <span>高程:{{showData.balt}}</span><br/> -->
-                            </div>
-                        </div>
+                    <div class="editBtn pointClound" @click="isUpload=true">
+                        添加数据集
+                        <!-- <input id="file" multiple="multiple" accept=".e57, .pts, .ptx, .ply, .xyz, .las" @change="upLoadPointClound" type="file"> -->
+                        <!-- <input id="file" multiple="multiple" accept=".las" @change="upLoadPointClound($event)" type="file"> -->
                     </div>
 
-                    <!-- <div class="main_item">
-                        <div class="Setting">
-                            <div class="msgBox">
-                                <p class="title">
-                                    地理坐标</p>
-                                <p class="desc">确定点云在世界地图上的位置</p>
-                            </div>
-                            <div class="btnton" @click="isEdit = true">
-                                修改
-                            </div>
-                        </div>
-                    </div> -->
-                    <!-- <div class="main_item" v-if="false">
-                        <div class="Setting">
-                            <div class="msgBox">
-                                <p class="title">
-                                    平面图</p>
-                                <p class="desc">添加建筑物平面图,方便预览</p>
-                            </div>
-                            <div class="btnton" @click="readyUpload">
-                                上传
-                            </div>
-                        </div>
-                        <div class="mapList">
-                            <div class="mapItem">
-                                <div class="fileName">
-                                    思维展厅.PNG
-                                </div>
-                                <div class="fileBtn">
 
-                                    <div class="fileBtnicon fileHide" @click="showImageTranform1 = !showImageTranform1"></div>
-                                    <div class="fileBtnicon fileSave" @click="getImageTransform"></div>
-                                    <div class="fileBtnicon fileSave" @click="getImageTiled"></div>
-                                    <div class="fileBtnicon fileDel"></div>
 
-                                </div>
-                            </div>
-                        </div>
-                    </div> -->
 
 
 
                 </div>
                 <div v-if="isEdit" class="scrollBox">
-                    <!-- <button id="location1">定位1</button>
-                    <button id="location2">定位2</button> -->
-                    <!-- <p class="title">定位</p> -->
-                    <!-- <p class="desc">通过两个控制点坐标确定点云在地图上的位置</p> -->
+
+                    <h4>修改控制点 </h4>
+                    <p class="desc">通过两个控制点坐标确定点云在地图上的位置</p>
                     <p class="itemTitle">EPSG 坐标系 </p>
                     <div class="formItem">
                         <div class="allIpt">
@@ -140,47 +72,33 @@
                             <div class="inputItem">
                                 <div class="name"> X</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="ax" name="ax" id="ax" />
+                                    <input @input="limtInput('ax')" type="text" v-model="ax" name="ax" id="ax" />
                                 </div>
                                 <span class="unit">m</span>
                             </div>
                             <div class="inputItem">
                                 <div class="name"> Y</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="ay" name="ay" id="ay" />
+                                    <input @input="limtInput('ay')" type="text" v-model="ay" name="ay" id="ay" />
                                 </div>
                                 <span class="unit">m</span>
                             </div>
 
-                            <!-- <div class="inputItem">
-                                <div class="name"> Z</div>
-                                <div class="ipt">
-                                    <input type="text" v-model="az" name="az" id="az" />
-                                </div>
-                                <span class="unit">m</span>
-                            </div> -->
                         </div>
                         <div class="formItem">
                             <p class="itemTitle">地理坐标:</p>
                             <div class="inputItem">
                                 <div class="name">经度</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="alon" name="alon" id="alon" value="120" />
+                                    <input type="text" @input="limtInput('alon')" v-model="alon" name="alon" id="alon" value="120" />
                                 </div>
                             </div>
                             <div class="inputItem">
                                 <div class="name">纬度</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="alat" name="alat" id="alat" value="22" />
+                                    <input type="text" @input="limtInput('alat')" v-model="alat" name="alat" id="alat" value="22" />
                                 </div>
                             </div>
-                            <!-- <div class="inputItem">
-                                <div class="name">高程</div>
-                                <div class="ipt">
-                                    <input type="text" v-model="aalt" name="aalt" id="aalt" value="0" />
-                                </div>
-                            </div> -->
-
 
 
                         </div>
@@ -194,14 +112,14 @@
                             <div class="inputItem">
                                 <div class="name"> X</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="bx" name="bx" id="bx" />
+                                    <input type="text" @input="limtInput('bx')" v-model="bx" name="bx" id="bx" />
                                 </div>
                                 <span class="unit">m</span>
                             </div>
                             <div class="inputItem">
                                 <div class="name"> Y</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="by" name="by" id="by" />
+                                    <input type="text" @input="limtInput('by')" v-model="by" name="by" id="by" />
                                 </div>
                                 <span class="unit">m</span>
                             </div>
@@ -221,13 +139,13 @@
                             <div class="inputItem">
                                 <div class="name">经度</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="blon" name="blon" id="blon" value="123" />
+                                    <input type="text" @input="limtInput('blon')" v-model="blon" name="blon" id="blon" value="123" />
                                 </div>
                             </div>
                             <div class="inputItem">
                                 <div class="name">纬度</div>
                                 <div class="ipt">
-                                    <input type="text" v-model="blat" name="blat" id="blat" value="22" />
+                                    <input type="text" @input="limtInput('blat')" v-model="blat" name="blat" id="blat" value="22" />
                                 </div>
                             </div>
                             <!-- <div class="inputItem">
@@ -256,16 +174,25 @@
                     </div>
 
                 </div>
+
+                <upload-pointClound v-if="isUpload" />
+                <!-- <image-tranform ref="imageTranform" /> -->
             </div>
 
         </div>
+
+
     </div>
 
     <script src="./js/vue.js"></script>
+    <script src="./js/element.js"></script>
+
     <script src="./js/axios.min.js"></script>
+
     <!-- <script src="./js/proj4.js"></script>
     <script src="./js/three.js"></script> -->
-    <!-- <script src="./components/image-transform/index.js"></script> -->
+    <script src="./components/image-transform/index.js"></script>
+    <script src="./components/upload-pointClound/index.js"></script>
     <script type="text/javascript">
         //输入经纬度就可以定位
     </script>
@@ -296,12 +223,14 @@
 
         new Vue({
             el: '#app',
+
             data() {
                 return {
                     status: 0,
                     showImageTranform: true,
                     showImageTranform1: true,
                     isEdit: false,
+                    isUpload: false,
                     pointLayerArray: [],
                     map: null,
                     gaodeMapLayer: {},
@@ -358,13 +287,14 @@
                         blon: '123',
                         blat: '22',
                         balt: ''
-                    }
+                    },
 
                 }
             },
             created() {
 
             },
+
             mounted() {
                 // alert(sceneNum)
 
@@ -512,7 +442,7 @@
                             // id: 1
                         })
                         .catch(function(error) {
-                            alert('数据集位置上传失败')
+                            alert('控制点上传失败')
                         }),
 
                         // this.getImageTransform()
@@ -521,7 +451,7 @@
                         // })
                     ]).then(() => {
                         this.getContorlPoint()
-                        alert('成功')
+                        alert('控制点上传成功')
                     })
 
                 },
@@ -597,6 +527,32 @@
                     this.blon = this.showData.blon
                     this.blat = this.showData.blat
                 },
+                showLoading() {
+                    $('body').append(' <div id="upload-loading"><img class="icon" src="../img/icon/loading.png" alt=""><span class="text">上传中...</span></div>');
+                },
+                hideLoading() {
+                    $('#upload-loading').remove()
+                },
+                upLoadPointClound(e) {
+                    const files = e.target.files[0];
+                    console.log(files)
+                    var formData = new FormData();
+                    formData.append("file", files);
+
+                    axios.post('/indoor/' + sceneNum + '/api/controlPoint/test', formData).catch(err => {
+                        // alert(1)
+                        this.showLoading()
+                        setTimeout(() => {
+                            this.hideLoading()
+                            IV.api.AuthenticationService.sendAuthenticationChanged()
+                                // IV.SidebarMenuService.goToItem(IV.SidebarMenuService.items[1])
+
+                        }, 2000);
+                    })
+                },
+                limtInput(value) {
+                    this[value] = this[value].replace(/[^\-?\d.]/g, '')
+                },
                 moveEnd(e) {
                     let obj = e.currentTarget
                     obj.focus();
@@ -610,7 +566,10 @@
                         typeof obj.selectionEnd == 'number') {
                         obj.selectionStart = obj.selectionEnd = len;
                     }
-                }
+                },
+
+
+
 
 
             }

+ 126 - 0
locat/components/upload-Pointclound/index.js

@@ -0,0 +1,126 @@
+(() => {
+    Vue.component('uploadPointclound', {
+        props: [],
+        name: 'uploadPointclound',
+        template: `<div id="uploadBox" >
+                    <h4>添加数据集 </h4>
+                    <div class="selectBox">
+                        <el-select v-model="value" filterable :filter-method="searchScene" placeholder="请选择">
+                            <el-option v-for="item in options" :key="item.code" :label="item.code" :value="item.code">
+                                <div class="sceneName">
+                                    <p class="code">{{item.code}}</p>
+                                    <span class="name">来自场景:{{item.name}}</span>
+                                </div>
+
+                            </el-option>
+                        </el-select>
+
+                    </div>
+                    <div class="uploadBtn" @click="openUpload" :class="{disabled:value==''}">
+                        <i class="fa fa-plus ng-scope"></i>&nbsp;&nbsp;添加到场景
+                    </div>
+
+                    <p class="itemTitle">已添加的数据集 </p>
+                    <div class="listBox">
+                        <ul class="sceneList">
+                            <li class="sceneItem" v-for="i in 10">
+                                <div class="sceneName">
+                                    <p class="code">t-iksBApb</p>
+                                    <span class="name">来自场景:港2</span>
+                                </div>
+                                <div class="scene_control">
+                                   
+
+                                    <el-popconfirm placement="top" title="是否要删除该数据集?" :hide-icon="true" @confirm="delConfirm">
+                                        <el-button class="delBtn" title="删除" slot="reference"></el-button>
+                                    </el-popconfirm>
+                                    <!-- <div class="delBtn" title="删除"></div> -->
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                </div>`,
+        data() {
+            return {
+                options: [{
+                    id: 1,
+                    name: "港2",
+                    code: 't-iksBApb'
+                }, {
+                    id: 2,
+                    name: "港2",
+                    code: 't-iksBA2pb'
+                }, {
+                    id: 3,
+                    name: "港2",
+                    code: 't-iksBA3pb'
+                }, {
+                    id: 4,
+                    name: "港2",
+                    code: 't-iksBA4pb'
+                }, {
+                    id: 5,
+                    name: "港2",
+                    code: 't-iksBA5pb'
+                }, {
+                    id: 6,
+                    name: "港2",
+                    code: 't-iksBA6pb'
+                }],
+                value: '',
+            }
+        },
+        methods: {
+            searchScene() {
+                let t = setTimeout(() => {
+                    console.log(1)
+
+                    clearTimeout(t)
+                }, 3000);
+            },
+            openUpload() {
+                this.$parent.showLoading()
+                setTimeout(() => {
+                    this.value = ''
+                    this.$parent.hideLoading()
+                    this.$message({
+                        message: '恭喜你,这是一条成功消息',
+                        type: 'success',
+                        duration: 2000,
+                    });
+                    IV.api.AuthenticationService.sendAuthenticationChanged()
+                        // IV.SidebarMenuService.goToItem(IV.SidebarMenuService.items[1])
+
+                }, 2000);
+                // this.$confirm('此操作将永久删除该文件, 是否继续?', {
+                //     confirmButtonText: '确定',
+                //     cancelButtonText: '取消',
+                //     center: true
+                // }).then(() => {
+                //     // this.$message({
+                //     //     type: 'success',
+                //     //     message: '删除成功!'
+                //     // });
+                // }).catch(() => {
+                //     // this.$message({
+                //     //     type: 'info',
+                //     //     message: '已取消删除'
+                //     // });
+                // });
+            },
+            delConfirm() {
+                console.log(1)
+            }
+        },
+        computed: {
+
+        },
+        destroyed() {
+
+        },
+        mounted() {
+
+        },
+    })
+})();

A különbségek nem kerülnek megjelenítésre, a fájl túl nagy
+ 1 - 0
locat/js/element.js


+ 19 - 1
locat/style.css

@@ -65,7 +65,7 @@ body {
     height: 100%;
     overflow-y: scroll;
     box-sizing: border-box;
-    padding: 30px 57px 80px;
+    padding: 20px 57px 80px;
 }
 
 
@@ -518,4 +518,22 @@ input::-webkit-input-placeholder {
     100% {
         transform: translate(-50%, -50%)rotate(360deg);
     }
+}
+
+#uploadBox {
+    width: 100%;
+    height: 100%;
+    overflow-y: scroll;
+    box-sizing: border-box;
+    padding: 20px 57px 80px;
+}
+
+#uploadBox .selectBox {
+    width: 100%;
+    height: auto;
+}
+
+#uploadBox .selectBox select {
+    width: 100%;
+    height: 88px;
 }

+ 6 - 0
main.js

@@ -89517,6 +89517,12 @@ and limitations under the License.
            return this.updateDatasets(),
            this.saveAlignment().then((function() {
                t.AlignmentService.stateDirty = !1
+			    $.ajax({
+					url: `/indoor/${sceneNum}/api/repose`,
+					success: function(res) {
+						console.log('/api/repose',res)
+					}
+				});
            }
            ))
        }

+ 211 - 0
style.css

@@ -518,4 +518,215 @@ input::-webkit-input-placeholder {
     100% {
         transform: translate(-50%, -50%)rotate(360deg);
     }
+}
+
+#uploadBox {
+    width: 100%;
+    height: 100%;
+    overflow-y: scroll;
+    box-sizing: border-box;
+    padding: 20px 57px 20px;
+}
+
+#uploadBox .selectBox {
+    width: 100%;
+    height: auto;
+    /* border-bottom: 1px solid rgba(255, 255, 255, .2); */
+    margin-bottom: 20px;
+}
+
+#uploadBox .selectBox .el-select {
+    width: 100% !important;
+}
+
+.el-select-dropdown {
+    border: 1px solid rgba(255, 255, 255, 0.4) !important;
+    background-color: #141414!important;
+    color: #fff !important;
+}
+
+.el-select-dropdown .el-select-dropdown__item {
+    color: #fff !important;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: auto !important;
+    line-height: normal !important;
+    padding: 5px 10px !important;
+    border-bottom: 1px solid rgba(255, 255, 255, .2);
+}
+
+.el-popper[x-placement^=bottom] .popper__arrow {
+    border-bottom-color: rgba(255, 255, 255, 0.4) !important;
+}
+
+.el-popper[x-placement^=bottom] .popper__arrow::after {
+    border-bottom-color: rgba(255, 255, 255, 0.4) !important;
+}
+
+.el-select-dropdown .el-select-dropdown__item:hover {
+    background: #143537 !important
+}
+
+#uploadBox .selectBox .el-input__inner {
+    color: #fff !important;
+}
+
+.el-select-dropdown__item.selected {
+    color: #15BEC8 !important;
+}
+
+.el-select-dropdown__item.hover {
+    background: #143537 !important
+}
+
+.el-scrollbar__wrap {
+    margin-bottom: -4px !important;
+    margin-right: -4px !important;
+}
+
+#uploadBox .uploadBtn {
+    width: 100%;
+    height: 40px;
+    color: #fff;
+    background: #15BEC8;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    margin-bottom: 30px;
+    cursor: pointer;
+}
+
+#uploadBox .uploadBtn.disabled {
+    cursor: no-drop;
+}
+
+
+/* #uploadBox .selectBox select {
+    width: 100%;
+    height: 30px;
+    line-height: 30px;
+}
+
+#uploadBox .selectBox option {
+    width: 100%;
+} */
+
+.listBox {
+    width: 100%;
+    height: auto;
+}
+
+.sceneList {
+    width: 100%;
+    height: auto;
+    /* border: 1px solid rgba(255, 255, 255, .2); */
+}
+
+.sceneItem {
+    width: 100%;
+    /* height: 40px; */
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    color: #fff;
+    border-bottom: 1px solid rgba(255, 255, 255, .2);
+    padding: 10px 0;
+    box-sizing: border-box;
+}
+
+.sceneItem:last-of-type {
+    border-bottom: none;
+}
+
+.sceneName {
+    font-size: 12px;
+}
+
+.sceneName>span {
+    display: block;
+}
+
+.sceneName .code {
+    color: #fff !important;
+    margin-bottom: 3px;
+    font-size: 14px;
+}
+
+.sceneName .name {
+    color: #999;
+}
+
+.scene_control {}
+
+.scene_control .delBtn {
+    background: url(../img/icon/icon_del.png?4)no-repeat;
+    background-size: 100% 100%;
+    width: 14px;
+    height: 14px;
+    color: transparent !important;
+    cursor: pointer;
+    padding: 0!important;
+    border: none !important;
+}
+
+.el-message-box {
+    background: #141414!important;
+    border: none !important;
+}
+
+.el-message-box__content {
+    color: #fff !important;
+}
+
+.el-message-box .el-button {
+    color: #fff !important;
+    background: transparent !important;
+}
+
+.el-message-box .el-button:hover {
+    background: transparent !important;
+}
+
+.el-message-box .el-button--primary {
+    color: #fff !important;
+    background: #15BEC8 !important;
+    border-color: #15BEC8 !important;
+}
+
+.el-message-box .el-button--primary:hover {
+    color: #fff !important;
+    background: #15BEC8 !important;
+}
+
+.el-message-box .el-icon-close:before {
+    color: #fff !important;
+}
+
+.el-popover {
+    border: 1px solid rgba(255, 255, 255, 0.4) !important;
+    background-color: #141414!important;
+    color: #fff !important;
+}
+
+.el-popper[x-placement^=top] .popper__arrow {
+    border-top-color: rgba(255, 255, 255, 0.4) !important;
+}
+
+.el-popper[x-placement^=top] .popper__arrow::after {
+    border-top-color: rgba(255, 255, 255, 0.4) !important;
+}
+
+.el-button--primary {
+    background: #15BEC8 !important;
+}
+
+.el-button--primary:hover {
+    background: #15BEC8 !important;
+}
+
+.el-popconfirm__action button.el-button--text {
+    color: #fff !important;
 }