gs-bim-air 3.0.3 → 3.0.5

package/src/viewerWrapper/panels/collision/interfaceCollisionPanel.vue

@@ -1,816 +0,0 @@
-<template>
-  <div class="showCollision">
-    <div class="content">
-      <div
-        style="text-align: left; padding: 10px 0; margin: 0 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.15)">
-        <el-button type="primary" round @click="addCollisionClick">
-          <i class="el-icon-plus"></i>
-          添加碰撞
-        </el-button>
-      </div>
-
-      <div class="el-scrollbar collision-list-wrapper" style="overflow: auto">
-        <div
-          class="item"
-          v-for="(item, index) in collisionList"
-          :key="index"
-          @click="showCollisionListClick(index)"
-          :class="activeCollisionIndex === index ? 'isActive' : 'notActive'">
-          <div class="text">
-            <div class="name">
-              <!-- <i :title="item.name">{{ item.name }}</i> -->
-              {{ item.name }}
-            </div>
-            <div class="node-names" v-if="item.collisionNodeNames">
-              碰撞节点：{{ item.collisionNodeNames.join(",") }}
-            </div>
-            <div class="collision-type" v-if="item.collisionType">
-              碰撞参数：{{ (item.collisionType & 1) === 1 ? "硬碰撞" : "" }}
-              {{ (item.collisionType & 2) === 2 ? "接触碰撞" : "" }}
-              {{ (item.collisionType & 8) === 8 ? "软碰撞" + item.softCollisionDistance + "m" : "" }}
-            </div>
-          </div>
-
-          <div class="button-wrapper">
-            <i class="el-icon-delete" @click.stop="deleteCollisionClick(index, item)"></i>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <gs-dialog
-      title="模型碰撞检测"
-      v-model="collisionDialogVisible"
-      @confirm="addCollisionConfirm()"
-      @cancel="addCollisionCancel()"
-      width="750px"
-      top="8vh"
-      type="dark">
-      <div class="collision-wrapper">
-        <div class="top">
-          <el-form label-position="right" label-width="100px" class="collision-form">
-            <el-form-item label="碰撞名称：" class="collision-name">
-              <el-input size="small" v-model="collisionName" class="setting-input" style="width: 224px"></el-input>
-            </el-form-item>
-            <el-form-item label="碰撞类型：">
-              <div style="display: flex; align-items: center">
-                <el-checkbox v-model="calcHardCollisionChecked" class="setting-checkbox">硬碰撞</el-checkbox>
-                <el-checkbox v-model="calcTouchCollisionChecked" class="setting-checkbox">接触碰撞</el-checkbox>
-                <el-checkbox v-model="calcSoftCollisionChecked" class="setting-checkbox">软碰撞</el-checkbox>
-                <el-input
-                  v-show="calcSoftCollisionChecked"
-                  size="small"
-                  class="setting-input"
-                  v-model="softCollisionValue"
-                  style="margin-left: 15px"
-                  @change="softCollisionValueChange">
-                  <template slot="append">m</template>
-                </el-input>
-              </div>
-            </el-form-item>
-          </el-form>
-        </div>
-
-        <div class="bottom">
-          <div class="left">
-            <div style="padding: 5px 0 10px 0; font-size: 16px; color: #aaa">点击选择需要碰撞的模型构件</div>
-            <div class="el-scrollbar tree-scrollbar" style="overflow: auto">
-              <el-tree
-                ref="structureTree"
-                id="structureTree"
-                :load="loadNode"
-                lazy
-                :default-expanded-keys="expandedKeys"
-                :expand-on-click-node="false"
-                :props="treeProps"
-                highlight-current
-                @node-click="treeNodeClick"
-                node-key="id">
-                <div slot-scope="{ data }" class="custom-tree-node" :style="{ color: data.disabled ? '#aaa' : '' }">
-                  {{ data.name }}
-                </div>
-              </el-tree>
-            </div>
-          </div>
-          <div class="right">
-            <div style="padding: 5px 10px 10px 10px; font-size: 16px; color: #aaa">已选的模型构件</div>
-            <div class="check-item" v-for="(item, index) in checkedNodes" :key="index">
-              <span>{{ item.name }}</span>
-              <i class="el-icon-close" @click="deleteCheckItemClick(index)"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-    </gs-dialog>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Inject, Prop, Vue } from "vue-property-decorator";
-// import CommandShowCollision from "../../commands/showCollision/commandShowCollision";
-import GsDialog from "../../../components/gs/gsDialog/gs-dialog.vue";
-import { Button, Input, Form, FormItem, Checkbox, Message, MessageBox } from "element-ui";
-import { Viewer } from "gs-bim-air-core/gsDevFx/viewer";
-import { CollisionObject } from "gs-bim-air-core/gsDevFx/objects/collisionObject";
-import { CollisionType } from "gs-longan";
-import Tree from "../../../components/el/tree/index";
-import { TreeNodeObject } from "gs-bim-air-core/gsDevFx/objects/treeNodeObject";
-import CollisionItemPanel from "./collisionItemPanel";
-import CollisionPanel from "./collisionPanel";
-
-Vue.use(Button);
-Vue.use(Input);
-Vue.use(Form);
-Vue.use(FormItem);
-Vue.use(Checkbox);
-Vue.use(Tree as any);
-
-interface TreeNode {
-  name: string;
-  key: number;
-  childNodes: TreeNode[];
-}
-
-@Component({
-  components: { GsDialog },
-})
-export default class InterfaceCollisionPanel extends Vue {
-  @Prop() componentData;
-  @Inject() getViewer;
-  activeName = "first";
-  collisionDialogVisible = false;
-  collisionName = "";
-  collisionImageList = [];
-  // collisionList = [];
-
-  calcHardCollisionChecked = false;
-  calcSoftCollisionChecked = false;
-  calcTouchCollisionChecked = false;
-  // touchCollisionValue = null;
-  softCollisionValue = 0.1;
-
-  expandedKeys = [];
-  checkKeys = [];
-  treeCheckedNos = [];
-  modelObjects = [];
-  treeProps = {
-    label: "name",
-    children: "childNodes",
-    isLeaf: "isLeaf",
-    expaned: "expaned",
-  };
-
-  // commandShowCollision = new CommandShowCollision();
-  activeCollisionIndex = null;
-  checkedNodes = [];
-  chooseNode;
-  levelOneData = [];
-
-  currentTreeNodeData: TreeNodeObject;
-  level0Node;
-  level0NodeResolve;
-
-  currentNode;
-  currentNodeResolve;
-
-  get viewer(): Viewer {
-    return this.getViewer();
-  }
-
-  get collisionList(): CollisionObject[] {
-    return this.componentData || [];
-  }
-
-  addCollisionClick() {
-    this.collisionDialogVisible = true;
-    this.checkedNodes = [];
-    // this.setDisabled(this.modelObjects[0], false);
-
-    // // this.viewer.selectionManager.clearAllSelectionAndHighlight();
-    // this.viewer.updateDisplay();
-    // setTimeout(() => {
-    //   this.showLevel(4);
-    // }, 10);
-  }
-
-  addCollisionConfirm() {
-    let checkedNodes = this.checkedNodes;
-
-    if (checkedNodes.length === 0) {
-      Message.warning("请先选择碰撞节点");
-      return;
-    }
-    if (!this.collisionName) {
-      Message.warning("碰撞名字不能为空");
-      return;
-    }
-
-    // if (!this.viewer.isSharedArrayBuffer) {
-    //   Message.warning("单线程计算碰撞，碰撞过程请勿操作界面");
-    // }
-
-    for (let i = 0; i < checkedNodes.length; i++) {
-      const item = checkedNodes[i];
-      let treeNode = this.viewer.structureTreeManager.getTreeNodeById(item.id);
-      let coms = this.viewer.structureTreeManager.getComponents(treeNode);
-      if (coms.length === 0) {
-        Message.warning(`“${item.name}”不存在构件，无法进行碰撞`);
-        return;
-      } else if (checkedNodes.length === 1 && coms.length === 1) {
-        Message.warning(`“${item.name}”只有一个构件，无法进行碰撞`);
-        return;
-      } else {
-        console.log("构件：", coms);
-      }
-    }
-
-    // let currentCommand = this.viewer.process.commandManager.currentCommand as CommandShowCollision;
-
-    // if (currentCommand.typeName !== "CommandShowCollision") {
-    //   this.viewer.process.commandManager.execute(this.commandShowCollision);
-    // }
-
-    let collisionType = CollisionType.None;
-    if (this.calcTouchCollisionChecked) {
-      collisionType = collisionType | CollisionType.Touch;
-      // this.viewer.collisionTolerance = Number(this.touchCollisionValue);
-    } else {
-      this.viewer.collisionTolerance = 0.001;
-    }
-    if (this.calcHardCollisionChecked) {
-      collisionType = collisionType | CollisionType.Intersect;
-    }
-    if (this.calcSoftCollisionChecked) {
-      collisionType = collisionType | CollisionType.Soft;
-      this.viewer.softCollisionDistance = Number(this.softCollisionValue);
-    } else {
-      this.viewer.softCollisionDistance = 0.1;
-    }
-
-    if (collisionType === 0) {
-      Message.warning(`请选择碰撞类型`);
-    }
-    // this.viewer.panelManager.getPanelByName<CollisionPanel>("CollisionPanel").computeObjectCollisions(
-    //   this.collisionName,
-    //   [this.viewer.structureTreeManager.getTreeNodeById(checkedNodes[0].id)],
-    //   [this.viewer.structureTreeManager.getTreeNodeById(checkedNodes[1].id)],
-    //   collisionType,
-    //   Number(this.softCollisionValue)
-    // );
-    this.viewer.panelManager
-      .getPanelByName<CollisionItemPanel>("CollisionItemPanel")
-      .computeCollision(
-        {
-          name: this.collisionName,
-          isCompute: true,
-          data: "",
-        },
-        checkedNodes.map((item) => this.viewer.structureTreeManager.getTreeNodeById(item.id)),
-        collisionType,
-        Number(this.softCollisionValue)
-      )
-      .then(() => {
-        this.viewer.panelManager.getPanelByName<CollisionPanel>("CollisionPanel").hide();
-        this.viewer.panelManager.getPanelByName<CollisionItemPanel>("CollisionItemPanel").show();
-        let collisionData = this.viewer.panelManager.getPanelByName<CollisionPanel>("CollisionPanel").collisions;
-        this.viewer.panelManager.getPanelByName<CollisionItemPanel>("CollisionItemPanel").switchCollisionListData({
-          name: collisionData[collisionData.length - 1].name,
-          isCompute: false,
-          // data: this.collisionList[index].data,
-          data: collisionData[collisionData.length - 1],
-        });
-        // store.commit("toolbar/setShowLeftComponent", true);
-        // store.commit("toolbar/setLeftToolbarCurrentSelectedMenu", "viewPoint");
-      });
-    this.collisionDialogVisible = false;
-
-    // this.viewer.isSharedArrayBuffer ? 0 : 100
-
-    console.log("checkedNodes", checkedNodes);
-    this.activeCollisionIndex = this.collisionList.length;
-
-    this.checkedNodes.forEach((item) => {
-      this.setDisabled(item, false);
-    });
-    this.checkedNodes = [];
-  }
-
-  addCollisionCancel() {
-    this.checkedNodes.forEach((item) => {
-      this.setDisabled(item, false);
-    });
-    this.checkedNodes = [];
-  }
-
-  deleteCollisionClick(index, item) {
-    MessageBox.confirm(`确定删除碰撞记录${item.name}？`).then(() => {
-      this.viewer.panelManager.getPanelByName<CollisionPanel>("CollisionPanel").deleteCollision(item.id);
-      if (this.activeCollisionIndex > 0) {
-        this.activeCollisionIndex = this.activeCollisionIndex - 1;
-      }
-    });
-  }
-
-  showCollisionListClick(index) {
-    this.activeCollisionIndex = index;
-    // let currentCommand = this.viewer.process.commandManager.currentCommand as CommandShowCollision;
-
-    // if (currentCommand.typeName !== "CommandShowCollision") {
-    //   this.viewer.process.commandManager.execute(this.commandShowCollision);
-    // }
-    this.viewer.panelManager.getPanelByName<CollisionItemPanel>("CollisionItemPanel").show();
-    this.viewer.panelManager.getPanelByName<CollisionItemPanel>("CollisionItemPanel").switchCollisionListData({
-      name: this.collisionList[index].name,
-      isCompute: false,
-      // data: this.collisionList[index].data,
-      data: this.collisionList[index],
-    });
-  }
-
-  touchCollisionValueChange() {}
-
-  softCollisionValueChange(val) {
-    if (val < 0.001) {
-      this.softCollisionValue = 0.001;
-      this.$message.warning("此值须大于等于0.001");
-    }
-  }
-
-  findRoVisible(insObj: any, checkedNos: number[]) {
-    if (insObj.renderObject.visible) {
-      checkedNos.push(insObj.no);
-    }
-    for (let i = 0; i < insObj.childObjects.length; i++) {
-      this.findRoVisible(insObj.childObjects[i], checkedNos);
-    }
-  }
-
-  // getModelObjects() {
-  //   if (this.viewer && this.viewer.instanceObject) {
-  //     let insObj = this.viewer.instanceObject;
-  //     let treeCheckedNos = [];
-  //     this.findRoVisible(insObj, treeCheckedNos);
-  //     this.treeCheckedNos = treeCheckedNos;
-
-  //     // if (this.viewer.renderObject.showTreeNode) {
-  //     //   this.modelObjects = [this.viewer.structureTreeManager.rootNode];
-  //     // } else {
-  //     //   this.modelObjects =
-  //     //     this.viewer.structureTreeManager.rootNode.childNodes;
-  //     // }
-
-  //     // 默认展开第二层
-  //     this.showLevel(4);
-  //   } else {
-  //     this.treeCheckedNos = [];
-  //     this.modelObjects = [];
-  //   }
-  // }
-
-  treeNodeClick(data) {
-    if (data.disabled) {
-      Message.warning("节点不可选择");
-      return;
-    }
-
-    this.checkedNodes.push(data);
-    this.setDisabled(data, true);
-    console.log("this.checkedNodes", this.checkedNodes);
-  }
-
-  setDisabled(data, disabled) {
-    Vue.set(data, "disabled", disabled);
-    if (data.childNodes) {
-      for (let i = 0; i < data.childNodes.length; i++) {
-        const element = data.childNodes[i];
-        this.setDisabled(element, disabled);
-      }
-    }
-
-    while (data) {
-      Vue.set(data, "disabled", disabled);
-      data = data.parent;
-    }
-  }
-
-  loadNode(node, resolve) {
-    if (!this.viewer) {
-      resolve([]);
-    }
-    // this.checkStrictly = true;
-    if (this.viewer?.structureTreeManager?.treeNodeObjects) {
-      this.$nextTick(() => {
-        this.currentNode = node;
-        this.currentTreeNodeData = node.data;
-
-        this.currentNodeResolve = resolve;
-        if (node.level === 0) {
-          let result;
-          this.level0Node = node; //这里是关键！在data里面定义一个变量，将node.level == 0的node存起来
-          this.level0NodeResolve = resolve; //同
-          // if (
-          //   this.viewer.renderObject
-          // ) {
-          //   result = this.getNodes([this.viewer.structureTreeManager.rootNode]);
-          //   if (this.invisibleKeys.indexOf(result[0].id) === -1) {
-          //     this.checkKeys.push(result[0].id);
-          //   }
-          // } else {
-          //   result = this.getNodes(
-          //     this.viewer.structureTreeManager.rootNode.childNodes
-          //   );
-          //   result.forEach((item) => {
-          //     if (this.invisibleKeys.indexOf(item.id) === -1) {
-          //       this.checkKeys.push(item.id);
-          //     }
-          //   });
-          // }
-
-          result = this.getNodes(this.viewer.structureTreeManager.treeNodeObjects);
-
-          // result.forEach((item) => {
-          //   if (this.invisibleKeys.indexOf(item.id) === -1) {
-          //     this.checkKeys.push(item.id);
-          //   }
-          // });
-
-          resolve(result);
-        } else {
-          let treeNode = this.viewer.structureTreeManager?.treeNodeObjectHash[node.data.id];
-          if (treeNode) {
-            let childNodes = treeNode.childNodes;
-            // 过滤main节点
-            // if (childNodes.length === 1 && childNodes[0].name === "main") {
-            //   childNodes = childNodes[0].childNodes;
-            // }
-            let result = this.getNodes(childNodes);
-            // result.forEach((item) => {
-            //   if (this.invisibleKeys.indexOf(item.id) === -1) {
-            //     this.checkKeys.push(item.id);
-            //   }
-            // });
-            return resolve(result);
-          } else {
-            return resolve([]);
-          }
-        }
-      });
-
-      // setTimeout(() => {
-      //   this.checkStrictly = false;
-      //   // console.log("树结构父子节点重新关联");
-      // }, 20);
-    }
-  }
-
-  getNodes(treeNodeObjects: TreeNodeObject[]): {
-    name: string;
-    id: string;
-    isShow: boolean;
-    isLeaf: boolean;
-    expaned: boolean;
-  }[] {
-    let result = [];
-    treeNodeObjects.forEach((item) => {
-      result.push({
-        name: item.name,
-        id: item.id,
-        isShow: item.isShow,
-        isLeaf: item.childNodes.length === 0,
-        expaned: this.expandedKeys.indexOf(item.id) !== -1,
-      });
-    });
-    return result;
-  }
-
-  showLevel(level: number) {
-    setTimeout(() => {
-      // this.expandedKeys = [];
-      let node = this.currentTreeNodeData;
-      this.expandLevel(node, level);
-    }, 10);
-  }
-
-  expandLevel(node, level: number) {
-    // node.expanded = true;
-    if (node) {
-      node.loaded = false;
-
-      let nodeDom = (this.$refs.structureTree as any)?.getNode(node.id);
-      if (nodeDom) {
-        nodeDom.expand();
-      }
-    }
-    setTimeout(() => {
-      let currentLevel = level - 1;
-      if (currentLevel > 0) {
-        for (let i = 0; i < node.childNodes.length; i++) {
-          const item = node.childNodes[i];
-          if (item.childNodes && item.childNodes.length > 0) {
-            this.expandLevel(item, currentLevel);
-          }
-        }
-      }
-    }, 10);
-    // this.expandedKeys.push(node.key);
-  }
-
-  deleteCheckItemClick(index) {
-    this.setDisabled(this.checkedNodes[index], false);
-    this.checkedNodes.splice(index, 1);
-
-    for (let i = 0; i < this.checkedNodes.length; i++) {
-      this.setDisabled(this.checkedNodes[i], true);
-    }
-  }
-
-  setData() {
-    this.$emit("setData", {
-      icon: "a-pengzhuang",
-      title: "模型碰撞记录",
-      top: "10px",
-      left: "80px",
-      height: "400px",
-      width: "300px",
-    });
-  }
-
-  mounted() {
-    this.setData();
-    // this.getModelObjects();
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import "../../../assets/scss/site";
-@import "../../../assets/theme/handle.scss";
-
-.showCollision {
-  color: $gs-primary-fontColor;
-  // background-color: $gs-primary-background;
-  // min-width: 250px;
-  height: auto;
-  // min-height: 50px;
-}
-
-.content {
-  display: flex;
-  flex-direction: column;
-  max-height: 700px;
-  // background: $gs-primary-background;
-}
-
-.add-icon-wrapper {
-  width: 40px;
-  margin: auto;
-
-  i {
-    margin: auto;
-    cursor: pointer;
-    font-size: 25px;
-    padding: 10px 0;
-  }
-}
-
-.collision-list-wrapper {
-  position: absolute;
-  top: 60px;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  // max-width: 350px;
-
-  .item {
-    padding: 10px;
-    position: relative;
-    // height: 36px;
-    // transition: 0.2s;
-    text-align: left;
-    cursor: pointer;
-    display: flex;
-    justify-content: space-between;
-    font-size: 14px;
-
-    &:hover {
-      background: $gs-primary-background;
-      // background: #333640;
-    }
-
-    .text {
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-
-      .name {
-        // line-height: 36px;
-        font-weight: bold;
-      }
-      .node-names {
-        padding-top: 5px;
-        font-size: 12px;
-        color: $gs-primary-fontColor;
-        opacity: 0.8;
-      }
-      .collision-type {
-        font-size: 12px;
-        color: $gs-primary-fontColor;
-        opacity: 0.8;
-      }
-      i {
-        font-style: normal;
-      }
-    }
-
-    img {
-      width: 230px;
-      height: 140px;
-      mask-image: linear-gradient(0deg, transparent, #a5a5a5 50%);
-    }
-
-    span {
-      left: 20px;
-    }
-
-    .button-wrapper {
-      // display: inline-block;
-      // position: absolute;
-      // background: #292b36;
-      // bottom: 10px;
-      // right: 20px;
-      border-radius: 18px;
-
-      i {
-        cursor: pointer;
-        padding: 10px;
-        &:hover {
-          color: $gs-primary-active;
-        }
-      }
-    }
-  }
-  .isActive {
-    background: $gs-primary-background;
-  }
-  .notActive {
-    background: transparent;
-  }
-}
-
-.collision-wrapper {
-  display: flex;
-  flex-direction: column;
-  ::v-deep .el-tree {
-    background: transparent;
-    color: $gs-primary-fontColor;
-
-    .el-tree-node:focus > .el-tree-node__content {
-      // background: $gs-primary-background;
-    }
-
-    .el-tree-node:focus > .el-tree-node__content {
-      // background: $gs-primary-background;
-    }
-
-    .el-tree-node__content:hover {
-      // background: $gs-primary-background;
-    }
-  }
-  ::v-deep .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
-    // background-color: $gs-primary-background;
-  }
-  ::v-deep .el-checkbox__label {
-    color: $gs-primary-fontColor;
-  }
-  ::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
-    background: $gs-primary-active;
-    border-color: $gs-primary-active;
-  }
-  ::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
-    color: $gs-primary-active;
-  }
-  .left,
-  .right {
-    flex: 1;
-  }
-  .left {
-    border-right: 1px solid rgba(255, 255, 255, 0.15);
-  }
-
-  .top,
-  .bottom {
-    display: flex;
-  }
-  .top {
-    height: 100px;
-  }
-
-  .bottom {
-    border-top: 1px solid rgba(255, 255, 255, 0.15);
-    margin-top: 25px;
-    padding-top: 25px;
-  }
-
-  .right {
-    height: 400px;
-    overflow: auto;
-
-    .check-item {
-      margin: 2px 10px;
-      padding: 0px 10px;
-      background: $model-theme-light;
-      color: white;
-      justify-content: space-between;
-      display: flex;
-      align-items: center;
-      span {
-        line-height: 35px;
-      }
-      i {
-        cursor: pointer;
-      }
-    }
-  }
-
-  .tree-scrollbar {
-    height: 400px;
-    display: inline-block;
-    width: 350px;
-    .custom-tree-node {
-      height: 35px;
-      line-height: 35px;
-      font-size: 15px;
-    }
-  }
-  :deep(.el-tree-node__content) {
-    height: 35px;
-    line-height: 35px;
-  }
-  .collision-form {
-    width: 100%;
-    display: inline-block;
-    vertical-align: top;
-    padding: 0 20px 20px 0;
-
-    :deep(.el-form-item) {
-      .el-form-item__label {
-        text-align: left;
-        // color: $gs-primary-el-inputColor;
-      }
-
-      .el-input__inner {
-        background: transparent;
-        border: 1px solid #aaa;
-        border-radius: 4px 0 0 4px;
-        color: $gs-primary-fontColor;
-      }
-      .el-input.is-disabled .el-input__inner {
-        background: transparent;
-        border: 1px solid #aaa;
-        border-radius: 4px 0 0 4px;
-      }
-      .el-input-group__append,
-      .el-input-group__prepend {
-        background: transparent;
-        border: 1px solid #aaa;
-        border-radius: 0 4px 4px 0;
-        border-left: none;
-      }
-    }
-    :deep(.collision-name) {
-      .el-input__inner {
-        background: transparent;
-        border: 1px solid #aaa;
-        border-radius: 4px;
-        color: $gs-primary-fontColor;
-      }
-    }
-  }
-
-  .setting-checkbox {
-    padding-right: 10px;
-    // color: $gs-primary-el-inputColor;
-  }
-
-  .setting-input {
-    width: 200px;
-  }
-}
-.el-button--text {
-  color: $gs-primary-checkboxColor;
-}
-:deep(.el-checkbox) {
-  .el-checkbox__inner {
-    background: transparent;
-    border: 1px solid #aaa;
-  }
-  .el-checkbox__input.is-checked .el-checkbox__inner {
-    background: $gs-primary-checkboxColor;
-    border-color: $gs-primary-checkboxColor;
-  }
-}
-
-:deep(.el-tree) {
-  background: transparent;
-}
-</style>