feat: 删除前端工程中meterSphere组件

frontend/src/components/dataease/DeAsideContainer.vue

@@ -0,0 +1,84 @@
+<template>
+  <el-aside
+    :width="width"
+    class="ms-aside-container"
+    :style="{'margin-left': !asideHidden ? 0 : '-' + width}"
+  >
+    <!--<div v-if="enableAsideHidden" class="hiddenBottom" @click="asideHidden = !asideHidden">-->
+    <!--<i v-if="!asideHidden" class="el-icon-arrow-left"/>-->
+    <!--<i v-if="asideHidden" class="el-icon-arrow-right"/>-->
+    <!--</div>-->
+    <slot />
+    <de-horizontal-drag-bar />
+  </el-aside>
+</template>
+
+<script>
+import DeHorizontalDragBar from './dragbar/DeLeft2RightDragBar'
+export default {
+  name: 'DeAsideContainer',
+  components: { DeHorizontalDragBar },
+  props: {
+    width: {
+      type: String,
+      default: '300px'
+    },
+    enableAsideHidden: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data() {
+    return {
+      asideHidden: false
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+  .ms-aside-container {
+    border: 1px solid #E6E6E6;
+    padding: 10px;
+    border-radius: 2px;
+    box-sizing: border-box;
+    background-color: #FFF;
+    height: calc(100vh - 80px);
+    border-right: 0px;
+    position: relative;
+  }
+
+  .hiddenBottom {
+    width: 8px;
+    height: 50px;
+    top: calc((100vh - 80px)/3);
+    right: -10px;
+    /*top: 0;*/
+    line-height: 50px;
+    border-radius: 0 15px 15px 0;
+    background-color: #acb7c1;
+    display: inline-block;
+    position: absolute;
+    cursor: pointer;
+    opacity: 0.2;
+    font-size: 2px;
+    margin-left: 1px;
+  }
+
+  .hiddenBottom i {
+    margin-left: -2px;
+  }
+
+  .hiddenBottom:hover {
+    background-color: #783887;
+    opacity: 0.8;
+    width: 12px;
+  }
+
+  .hiddenBottom:hover i {
+    margin-left: 0;
+    color: white;
+  }
+
+</style>

frontend/src/components/dataease/DeContainer.vue

@@ -0,0 +1,27 @@
+<template>
+
+  <el-container class="ms-container">
+    <slot />
+  </el-container>
+
+</template>
+
+<script>
+export default {
+  name: 'DeContainer'
+}
+</script>
+
+<style scoped>
+
+  .ms-container >>> span.title {
+    font-size: 16px;
+    font-weight: 500;
+    margin-top: 0;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    word-wrap: break-word;
+    white-space: nowrap;
+  }
+
+</style>

frontend/src/components/dataease/DeMainContainer.vue

@@ -0,0 +1,20 @@
+<template>
+  <el-main class="ms-main-container">
+    <slot />
+  </el-main>
+</template>
+
+<script>
+export default {
+  name: 'DeMainContainer'
+}
+</script>
+
+<style scoped>
+
+  .ms-main-container {
+    padding: 15px;
+    height: calc(100vh - 80px);
+  }
+
+</style>

frontend/src/components/dataease/dragbar/DeBottom2TopDragBar.vue

@@ -0,0 +1,27 @@
+<template>
+  <div v-bottom-to-top-drag class="drag-bar" />
+</template>
+
+<script>
+export default {
+  name: 'DeBottom2TopDragBar'
+}
+</script>
+
+<style scoped>
+
+  .drag-bar {
+    height: 1px;
+    width: 100%;
+    z-index: 1000;
+    cursor: row-resize;
+    position: fixed;
+    background-color: #E6E6E6;
+    border: 0px;
+  }
+
+  .drag-bar:hover {
+    height: 3px;
+  }
+
+</style>

frontend/src/components/dataease/dragbar/DeLeft2RightDragBar.vue

@@ -0,0 +1,28 @@
+<template>
+  <div v-left-to-right-drag class="drag-bar" />
+</template>
+
+<script>
+export default {
+  name: 'DeLeft2RightDragBar'
+}
+</script>
+
+<style scoped>
+
+  .drag-bar {
+    height: 100%;
+    width: 1px;
+    position: absolute;
+    right: 0px;
+    top: 0;
+    cursor: col-resize;
+    background-color: #E6E6E6;
+    border: 0px;
+  }
+
+  .drag-bar:hover {
+    width: 3px;
+  }
+
+</style>

frontend/src/components/dataease/dragbar/DeRight2LeftDragBar.vue

@@ -0,0 +1,28 @@
+<template>
+  <div v-right-to-left-drag class="drag-bar" />
+</template>
+
+<script>
+export default {
+  name: 'DeRight2LeftDragBar'
+}
+</script>
+
+<style scoped>
+
+  .drag-bar {
+    height: 100%;
+    width: 1px;
+    position: absolute;
+    left: 0px;
+    top: 0;
+    cursor: col-resize;
+    background-color: #E6E6E6;
+    border: 0px;
+  }
+
+  .drag-bar:hover {
+    width: 3px;
+  }
+
+</style>