tianheng-ui 0.1.63 → 0.1.65

package/packages/TableMaking/index.vue

@@ -22,6 +22,7 @@
         ref="configRef"
       ></widget-config>
     </div>
+    <!-- <widget-guide :visible="true"></widget-guide> -->
   </div>
 </template>
 
@@ -29,11 +30,12 @@
 import WidgetTools from "./WidgetTools.vue";
 import WidgetTable from "./widgetTable.vue";
 import WidgetConfig from "./widgetConfig.vue";
+import WidgetGuide from "./widgetGuide.vue";
 import { deepClone } from "./util/index";
 import { baseConfig } from "./custom/config";
 export default {
   name: "ThTableMaking",
-  components: { WidgetTools, WidgetTable, WidgetConfig },
+  components: { WidgetTools, WidgetTable, WidgetConfig, WidgetGuide },
   props: {
     config: Object,
 
@@ -175,6 +177,7 @@ export default {
 
 <style lang="scss" scoped>
 .th-tableMaking {
+  position: relative;
   height: 100%;
   background-color: white;
   border: 1px solid #dcdfe6;

package/packages/TableMaking/widgetGuide.vue

@@ -0,0 +1,96 @@
+<template>
+  <div v-show="show" class="widgetGuide">
+    <div class="box">
+      <div class="header"></div>
+      <div class="content">
+        <div>你好</div>
+        <div>让我们来了解一些基本信息</div>
+      </div>
+      <div class="footer th-is_border_top">
+        <div></div>
+        <div class="stepView">
+          <el-button
+            :disabled="step === 0"
+            type="primary"
+            icon="el-icon-back"
+            size="small"
+            @click="handleBack"
+            >上一步</el-button
+          >
+          <el-button type="primary" size="small" @click="handleNext"
+            >下一步<i class="el-icon-right el-icon--right"></i
+          ></el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: { visible: { type: Boolean, default: true } },
+  data() {
+    return {
+      show: this.visible,
+      step: 0
+    };
+  },
+  watch: {
+    visible(val) {
+      this.show = val;
+    },
+    show(val) {
+      this.$emit("update:visible", val);
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    handleBack() {
+      this.step--;
+    },
+    handleNext() {
+      this.step++;
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.widgetGuide {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: rgba($color: #000000, $alpha: 0.6);
+  z-index: 999;
+
+  .box {
+    position: relative;
+    width: calc(100% - 200px);
+    height: calc(100% - 200px);
+    background-color: white;
+    border-radius: 4px;
+
+    .header {
+      height: 50px;
+    }
+    .content {
+      height: calc(100% - 100px);
+    }
+    .footer {
+      padding: 10px 20px;
+      height: 50px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      box-sizing: border-box;
+
+      .stepView {
+      }
+    }
+  }
+}
+</style>

package/packages/TableMaking/widgetTable.vue

@@ -325,12 +325,5 @@ export default {
     padding: 10px 0;
     height: 52px;
   }
-
-  // .table-content:hover::-webkit-scrollbar-thumb {
-  //   background-color: rgba(69, 90, 100, 0.2);
-  // }
-  // .table-content:hover::-webkit-scrollbar-thumb {
-  //   background-color: rgba(69, 90, 100, 0.2);
-  // }
 }
 </style>

package/packages/Workflow/index.vue

@@ -365,35 +365,4 @@ export default {
   color: #fafafa;
 }
 
-// body,
-// body * {
-//   /* 滚动条 */
-//   &::-webkit-scrollbar-track-piece {
-//     background-color: #fff; /*滚动条的背景颜色*/
-//     -webkit-border-radius: 0; /*滚动条的圆角宽度*/
-//   }
-//   &::-webkit-scrollbar {
-//     width: 10px; /*滚动条的宽度*/
-//     height: 8px; /*滚动条的高度*/
-//   }
-//   &::-webkit-scrollbar-thumb:vertical {
-//     /*垂直滚动条的样式*/
-//     height: 50px;
-//     background-color: rgba(153, 153, 153, 0.5);
-//     -webkit-border-radius: 4px;
-//     outline: 2px solid #fff;
-//     outline-offset: -2px;
-//     border: 2px solid #fff;
-//   }
-//   &::-webkit-scrollbar-thumb {
-//     /*滚动条的hover样式*/
-//     background-color: rgba(159, 159, 159, 0.3);
-//     -webkit-border-radius: 4px;
-//   }
-//   &::-webkit-scrollbar-thumb:hover {
-//     /*滚动条的hover样式*/
-//     background-color: rgba(159, 159, 159, 0.5);
-//     -webkit-border-radius: 4px;
-//   }
-// }
 </style>