gs-bim-air 3.0.3 → 3.0.5

package/src/components/gs-button-select.vue

@@ -1,168 +0,0 @@
-<!--点击可下拉选择列表-->
-<template>
-  <div class="gs-button-select">
-    <a
-      href="javascript:void(0)"
-      @click="buttonClick"
-      @mouseover="hintVisible = true"
-      @mouseleave="hintVisible = false"
-      @blur="handleBlur"
-    >
-      <div class="icon-wrapper">
-        <div class="button-father dx-icon" :class="icon" v-if="icon"></div>
-        <div style="">
-          <slot></slot>
-        </div>
-      </div>
-    </a>
-
-    <transition name="el-fade-in-linear">
-      <div class="hint" v-show="hint && hintVisible">
-        {{ hint }}
-      </div>
-    </transition>
-    <el-collapse-transition>
-      <div class="button-children" v-if="selectData" v-show="visible">
-        <div
-          class="button-wrapper"
-          v-for="(button, index) in selectData"
-          @click="selectClick(index)"
-        >
-          <a href="javascript:void (0)">
-            <div
-              class=""
-              :class="button.buttonIcon"
-              v-if="button.buttonIcon"
-            ></div>
-            <div class="text">{{ button.buttonName }}</div>
-          </a>
-        </div>
-      </div>
-    </el-collapse-transition>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
-
-@Component
-export default class GsButtonSelect extends Vue {
-  @Prop() icon: string | undefined;
-  @Prop() hint: string | undefined;
-  @Prop() selectData: any;
-
-  visible = false;
-  hintVisible = false;
-
-  buttonClick() {
-    this.hintVisible = false;
-    if (this.selectData) {
-      this.visible = !this.visible;
-    } else {
-      this.$emit("click");
-    }
-  }
-
-  handleBlur() {
-    setTimeout(() => {
-      this.visible = false;
-    }, 100);
-  }
-
-  selectClick(index: number) {
-    this.visible = false;
-    this.$emit("selectClick", index);
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.gs-button-select {
-  position: relative;
-  width: auto;
-  display: inline-block;
-}
-
-a {
-  text-decoration: none;
-  color: black;
-
-  &:active {
-    color: black;
-  }
-}
-
-.icon-wrapper {
-  display: inline-block;
-  border-radius: 5px;
-  padding: 5px;
-  transition: 0.1s;
-  color: #6d6d6d;
-  font-weight: bold;
-
-  &:hover {
-    /*background-color: #88b4d1;*/
-    background-color: rgba(0, 127, 127, 0.51);
-    color: black;
-  }
-
-  &:active {
-    background-color: #607e97;
-  }
-}
-
-.hint {
-  position: absolute;
-  /*display: inline;*/
-  bottom: -20px;
-  left: 35px;
-  background-color: white;
-  box-shadow: 0 0 10px #666666;
-  /*padding: 10px;*/
-  border-radius: 2px;
-  border: 1px solid #2c3e50;
-  font-size: 10px;
-  white-space: nowrap;
-  padding: 2px 4px;
-}
-
-.button-children {
-  position: absolute;
-  /*width: auto;*/
-  /*height: 100px;*/
-  top: 32px;
-  left: -5px;
-  background-color: white;
-  /*box-shadow: 0 0 10px #666666;*/
-  border: 1px solid #eee;
-  /*padding: 10px;*/
-  border-radius: 5px;
-}
-
-.button-wrapper {
-  /*width: 100%;*/
-  padding: 5px 10px;
-  transition: 0.1s;
-  /*border-radius: 5px;*/
-  border: 1px solid #eee;
-  white-space: nowrap;
-  text-align: left;
-
-  &:hover {
-    background-color: #e3e3e3;
-  }
-
-  &:active {
-    background-color: #607e97;
-  }
-
-  div {
-    display: inline-block;
-    vertical-align: top;
-  }
-
-  .text {
-    line-height: 32px;
-  }
-}
-</style>

package/src/components/gs-button-small.vue

@@ -1,180 +0,0 @@
-<!---->
-<template>
-  <div class="button-wrapper">
-    <el-button class="gs-button" @click="handleClick">
-      <i v-if="icon" :class="iconfont" />
-      <!-- <img v-if="icon" :src="icon" height="16" width="16" /> -->
-      <div
-        v-if="bgPosition"
-        :style="{
-          'background-position': bgPosition,
-          'background-image': backgroundImage,
-        }"
-        class="bg"
-      ></div>
-      <div class="text" ref="father">
-        <slot />
-      </div>
-
-      <div class="icon-wrapper" v-if="selectData" @click.stop="dropdownClick">
-        <i class="el-icon-caret-bottom" />
-      </div>
-      <transition name="el-zoom-in-top">
-        <div
-          class="button-children"
-          ref="option"
-          id="option"
-          :style="{ left: left + 'px', top: top + 'px' }"
-          v-if="selectData"
-          v-show="visible"
-        >
-          <a
-            href="javascript:void (0)"
-            v-for="(item, index) in selectData"
-            :key="index"
-            @click.stop="selectClick(index)"
-          >
-            <div class="children-wrapper">
-              <div style="font-size: 12px">{{ item }}</div>
-            </div>
-          </a>
-        </div>
-      </transition>
-    </el-button>
-    <div v-if="$slots.default" class="text"></div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
-
-@Component
-export default class GsButton extends Vue {
-  @Prop() size: string | undefined;
-  @Prop() icon: string | undefined;
-  @Prop() bgPosition: string | undefined;
-  @Prop() bgImage: string | undefined;
-  @Prop() iconfont: string;
-  @Prop() selectData: any[];
-
-  visible = false;
-  left = 0;
-  top = 0;
-
-  //   get selectData
-
-  get backgroundImage() {
-    return `url(${this.bgImage})`;
-  }
-
-  handleClick(evt: any) {
-    this.$emit("click", evt);
-  }
-
-  selectClick(index: number) {
-    this.visible = false;
-    this.$emit("selectClick", index);
-  }
-
-  dropdownClick() {
-    this.visible = !this.visible;
-    let option = this.$refs.option as Element;
-    let father = this.$refs.father as Element;
-    this.left = father.getBoundingClientRect().left - 20;
-    this.top = father.getBoundingClientRect().top + 18;
-
-    document.body.appendChild(option as Element);
-    document.addEventListener("click", (e) => {
-      if (!option.contains(e.target as Element)) {
-        this.visible = false;
-      }
-    });
-  }
-
-  mounted() {}
-}
-</script>
-
-<style lang="scss" scoped>
-a {
-  text-decoration: none;
-  color: black;
-
-  &:active {
-    color: black;
-  }
-}
-
-.gs-button {
-  /*border-radius: 5px;*/
-  height: auto;
-  width: auto;
-  padding: 3px 5px;
-  margin: 0 3px;
-  border: 1px solid transparent;
-  background-color: transparent;
-
-  &:hover {
-    background-color: rgba(0, 128, 128, 0.26);
-  }
-
-  &:active {
-    background-color: teal;
-    color: #a7a7a7;
-  }
-
-  .iconfontBimAir {
-    font-size: 16px;
-  }
-
-  .bg {
-    background: no-repeat;
-    height: 16px;
-    width: 16px;
-    display: inline-block;
-  }
-
-  .text {
-    font-size: 8px;
-    display: inline-block;
-  }
-
-  .icon-wrapper {
-    display: inline-block;
-    border: 1px solid transparent;
-
-    &:hover {
-      border: 1px solid teal;
-    }
-  }
-}
-
-.button-children {
-  position: absolute;
-  /*top: 70px;*/
-  /*left: 0;*/
-  background-color: white;
-  z-index: 3002;
-  box-shadow: #b7b7b7 0 0 3px;
-}
-
-.children-wrapper {
-  padding: 2px 20px;
-  /*transition: 0.1s;*/
-  white-space: nowrap;
-  text-align: left;
-
-  &:hover {
-    background-color: #e3e3e3;
-  }
-
-  &:active {
-    background-color: #607e97;
-  }
-
-  div {
-    display: inline-block;
-    vertical-align: top;
-  }
-}
-</style>

package/src/components/gs-button-underline.vue

@@ -1,66 +0,0 @@
-<!--icon带文字 hover过去会有下划线-->
-<template>
-  <el-button class="gs-button" @click="handleClick">
-    <i :class="icon" v-if="icon" />
-    <div v-if="$slots.default" class="text">
-      <slot />
-    </div>
-  </el-button>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
-
-@Component
-export default class GsButtonUnderline extends Vue {
-  @Prop() size: string | undefined;
-  @Prop() icon:
-    | {
-        type: string;
-        default: string;
-      }
-    | undefined;
-
-  handleClick(evt: any) {
-    this.$emit("click", evt);
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.gs-button {
-  border-radius: unset;
-  height: auto;
-  width: auto;
-  border: none;
-
-  padding: 6px 10px 0px 10px;
-  margin: 5px 8px;
-  background-color: transparent;
-  color: #828282;
-
-  &:hover {
-    /*background-color: #006060;*/
-    color: teal;
-    border-bottom: 3px solid teal;
-  }
-
-  &:active {
-    /*background-color: #003c3c;*/
-    color: #a7a7a7;
-    border-bottom: 3px solid #a7a7a7;
-  }
-
-  i {
-    font-size: 20px;
-    color: teal;
-  }
-
-  .text {
-    justify-content: center;
-    line-height: 20px;
-    font-size: 11px;
-    vertical-align: top;
-  }
-}
-</style>

package/src/components/gs-button-wrapper.vue

@@ -1,62 +0,0 @@
-<!--放置button的布局-->
-<template>
-  <div class="gs-button-wrapper">
-    <div class="slot-wrapper">
-      <slot />
-      <div class="slot">
-        <slot name="left" />
-      </div>
-      <div class="slot">
-        <slot name="center" />
-      </div>
-      <div class="slot">
-        <slot name="right" />
-      </div>
-    </div>
-    <div class="name">{{ name }}</div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
-
-@Component
-export default class GsButtonWrapper extends Vue {
-  @Prop() name:
-    | {
-        type: string;
-        default: "";
-      }
-    | undefined;
-}
-</script>
-
-<style scoped>
-.gs-button-wrapper {
-  border-right: 1px solid #cacbcc;
-  display: flex;
-  flex-direction: column;
-  vertical-align: top;
-  height: 100%;
-  /* height: 90px; */
-}
-
-.name {
-  font-size: 12px;
-  text-align: center;
-  height: 15px;
-  /* border-top: 1px solid #ddd; */
-  color: #000;
-  background-color: rgb(241, 241, 241);
-}
-.slot-wrapper {
-  flex: 1;
-  min-height: 80px;
-}
-
-.slot {
-  height: 58px;
-  vertical-align: top;
-  display: inline-block;
-}
-</style>

package/src/components/gs-button.vue

@@ -1,201 +0,0 @@
-<!---->
-<template>
-  <div class="button-wrapper">
-    <div
-      class="gs-button"
-      ref="button"
-      :style="{ backgroundColor }"
-      @click="handleClick"
-    >
-      <i v-if="icon" :class="icon" class="icon" />
-      <img v-if="iconImg" :src="iconImg" height="32" width="32" />
-      <div
-        v-if="bgPosition"
-        :style="{
-          'background-position': bgPosition,
-          'background-image': backgroundImage,
-        }"
-        class="bg"
-      ></div>
-
-      <div class="text">
-        <slot />
-        <div
-          class="icon-wrapper"
-          v-if="selectData"
-          @click.stop="dropdownClick($event)"
-        >
-          <i class="el-icon-caret-bottom" />
-        </div>
-        <transition name="el-zoom-in-top">
-          <div
-            class="button-children"
-            id="option"
-            :style="{ left: left + 'px', top: top + 'px' }"
-            v-show="visible"
-            ref="option"
-          >
-            <a
-              href="javascript:void (0)"
-              v-for="(item, index) in selectData"
-              :key="index"
-              @click.stop="selectClick(index)"
-            >
-              <div class="children-wrapper">
-                <div style="font-size: 12px">{{ item }}</div>
-              </div>
-            </a>
-          </div>
-        </transition>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
-
-@Component({ components: {} })
-export default class GsButton extends Vue {
-  @Prop() size: string | undefined;
-  @Prop() iconImg: string | undefined;
-  @Prop() bgPosition: string | undefined;
-  @Prop() bgImage: string | undefined;
-  @Prop() icon?: string;
-  @Prop() selectData?: string[];
-
-  visible = false;
-  left = 0;
-  top = 0;
-  backgroundColor = "";
-
-  get backgroundImage() {
-    return `url(${this.bgImage})`;
-  }
-
-  handleClick(evt: any) {
-    // this.backgroundColor = this.backgroundColor ? "" : "rgba(0, 128, 128, 0.26)";
-    this.$emit("click", evt);
-  }
-
-  selectClick(index: number) {
-    this.visible = false;
-    this.$emit("selectClick", index);
-  }
-
-  dropdownClick(e) {
-    this.visible = !this.visible;
-    let option = this.$refs.option as Element;
-    this.left = e.currentTarget.getBoundingClientRect().left - 5;
-    this.top = e.currentTarget.getBoundingClientRect().top + 18;
-
-    document.body.appendChild(option as Element);
-    document.addEventListener("click", (e2) => {
-      if (!option.contains(e2.target as Element)) {
-        this.visible = false;
-      }
-    });
-  }
-
-  mounted() {}
-}
-</script>
-
-<style lang="scss" scoped>
-.button-wrapper {
-  display: inline-block;
-  // position: relative;
-  // vertical-align: middle;
-  // float: left;
-  font-size: 12px;
-}
-
-a {
-  text-decoration: none;
-  color: black;
-
-  &:active {
-    color: black;
-  }
-}
-
-.gs-button {
-  height: auto;
-  width: auto;
-  padding: 5px 6px;
-  margin: 5px 8px;
-  border: 1px solid transparent;
-  font-size: 8px;
-  background-color: transparent;
-  cursor: pointer;
-  text-align: center;
-  transition: 0.1s;
-  border-radius: 5px;
-
-  &:hover {
-    background-color: #ddd;
-  }
-
-  &:active {
-    // border: 1px solid teal;
-    color: #a7a7a7;
-  }
-
-  .icon {
-    font-size: 25px;
-  }
-
-  .iconfontBimAir {
-    // font-weight: bold;
-    // font-size: 20px;
-  }
-
-  .bg {
-    background: no-repeat;
-    height: 32px;
-    width: 32px;
-    display: inline-block;
-  }
-
-  .icon-wrapper {
-    border: 1px solid transparent;
-    transition: 0.3s;
-
-    &:hover {
-      border: 1px solid teal;
-    }
-  }
-}
-
-.button-children {
-  position: absolute;
-  background-color: white;
-  z-index: 3002;
-  box-shadow: #b7b7b7 0 0 3px;
-}
-
-.children-wrapper {
-  padding: 5px 20px;
-  /*transition: 0.1s;*/
-  white-space: nowrap;
-  text-align: left;
-
-  &:hover {
-    background-color: #e3e3e3;
-  }
-
-  &:active {
-    background-color: #607e97;
-  }
-
-  div {
-    display: inline-block;
-    vertical-align: top;
-  }
-
-  .text {
-    padding: 5px;
-    line-height: 32px;
-  }
-}
-</style>