浏览代码

部门树样式问题

wang_xy 2 年之前
父节点
当前提交
7583b73c2a
共有 1 个文件被更改,包括 60 次插入72 次删除
  1. 60 72
      src/views/monitor.vue

+ 60 - 72
src/views/monitor.vue

@@ -58,9 +58,35 @@
                 </el-collapse>
               </div>
 
-              <!-- 横向柱状 echart -->
-              <div class="overflow-y" style="height: 33vh;">
-                <div id="camera-chart" style="width: 100%;height:33vh;"></div>
+              <!--&lt;!&ndash; 横向柱状 echart &ndash;&gt;-->
+              <!--<div class="overflow-y" style="height: 33vh;">-->
+                <!--<div id="camera-chart" style="width: 100%;height:33vh;"></div>-->
+              <!--</div>-->
+              <div  class="overflow-y" style="height: 33vh;">
+                  <div class="i-list-con h-43">
+                    <div class="head-container">
+                      <el-input
+                        v-model="deptName"
+                        placeholder="请输入部门名称"
+                        clearable
+                        size="small"
+                        prefix-icon="el-icon-search"
+                        style="margin-bottom: 20px"
+                      />
+                    </div>
+                    <div class="head-container tree-scrollbar" style="height: 700px;overflow-y:auto;">
+                      <el-tree
+                        :data="deptOptions"
+                        :props="defaultProps"
+                        :expand-on-click-node="false"
+                        :filter-node-method="filterNode"
+                        ref="tree"
+                        node-key="id"
+                        :default-expanded-keys="[100]"
+                        @node-click="handleNodeClick"
+                      />
+                    </div>
+                  </div>
               </div>
             </div>
           </dv-border-box-13>
@@ -71,81 +97,43 @@
                 :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false" @preview="preview">
       </supermap>
       <!-- 右侧 -->
-      <div class="rightbar rightbar-index" ref="right">
-        <div class="right-item1">
-          <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
-              <div class="this-title">
-                <span>部门</span>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
-              </div>
-              <div class="i-list-con h-43">
-                <div class="head-container">
-                  <el-input
-                    v-model="deptName"
-                    placeholder="请输入部门名称"
-                    clearable
-                    size="small"
-                    prefix-icon="el-icon-search"
-                    style="margin-bottom: 20px"
-                  />
-                </div>
-                <div class="head-container tree-scrollbar" style="height: 700px;overflow-y:auto;">
-                  <el-tree
-                    :data="deptOptions"
-                    :props="defaultProps"
-                    :expand-on-click-node="false"
-                    :filter-node-method="filterNode"
-                    ref="tree"
-                    node-key="id"
-                    :default-expanded-keys="[100]"
-                    @node-click="handleNodeClick"
-                  />
+      <div class="rightbar" :class="indentright" ref="right">
+        <div class="forthis">
+          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" style="padding-bottom: 1rem;">
+            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+            <div class="this-title">
+              <span>列表</span>
+              <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+            </div>
+            <div class="i-list-con h-43">
+              <div class="d-l-con" v-for="(item,index) in visuForestCloudCameraBOList"
+                   :class="{on:listCurrentIndex2 == index}"
+                   v-on:click="dropLocation(item.latitude,item.longitude,index)">
+                <div class="d-l-l-text">
+                  <i class="iconfont sj-icon-jkzx icon-sxt"></i>
+                  <h4>{{ item.cameraName }}</h4>
                 </div>
               </div>
-            </dv-border-box-13>
-          </div>
+            </div>
+          </dv-border-box-13>
         </div>
-        <div class="right-item2">
-          <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
-              <div class="this-title">
-                <span>列表</span>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
-              </div>
-              <div class="i-list-con h-43">
-                <div class="d-l-con" v-for="(item,index) in visuForestCloudCameraBOList"
-                     :class="{on:listCurrentIndex2 == index}"
-                     v-on:click="dropLocation(item.latitude,item.longitude,index)">
-                  <div class="d-l-l-text">
-                    <i class="iconfont sj-icon-jkzx icon-sxt"></i>
-                    <h4>{{ item.cameraName }}</h4>
-                  </div>
-                </div>
-              </div>
-            </dv-border-box-13>
-          </div>
-          <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
-              <div class="this-title">
-                <span>重点区域</span>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
-              </div>
-              <div class="i-list-con h-25">
-                <div class="d-l-con" v-for="(item,index) in keyAreaList" :class="{on:listCurrentIndex3 == index}" @click="getRegionalFlag(item.id)">
-                  <div class="d-l-l-text">
-                    <i class="i-small"></i>
-                    <h4>{{ item.areaName }}</h4>
-                  </div>
+        <div class="forthis">
+          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" style="padding-bottom: 1rem;">
+            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+            <div class="this-title">
+              <span>重点区域</span>
+              <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+            </div>
+            <div class="i-list-con h-25">
+              <div class="d-l-con" v-for="(item,index) in keyAreaList" :class="{on:listCurrentIndex3 == index}" @click="getRegionalFlag(item.id)">
+                <div class="d-l-l-text">
+                  <i class="i-small"></i>
+                  <h4>{{ item.areaName }}</h4>
                 </div>
               </div>
-            </dv-border-box-13>
-          </div>
+            </div>
+          </dv-border-box-13>
         </div>
-
       </div>
       <vBottomMenu ref="bottomMenu"></vBottomMenu>
 <!--        <div class="mascot" ref="mascot" :class="indentStyle" @click="indent"><img-->