paramSet.vue 2.71 KB
<template>
  <div>
    <el-dialog
      ref="dialog"
      title="提示"
      :visible.sync="visible"
      width="50%"
      :before-close="handleClose"
    >
      <div>
        <div class="leftCon">
          <div class="searchBox">
            <el-input placeholder="输入关键字进行过滤" v-model="filterText">
            </el-input>
          </div>
          <el-tree
            :data="data"
            :props="defaultProps"
            default-expand-all
            :filter-node-method="filterNode"
            ref="tree"
          >
          </el-tree>
        </div>
        <div class="rightCon">
          <el-table height="522" :data="tableData" stripe border>
            <el-table-column align="center" prop="num" label="参数名">
            </el-table-column>
            <el-table-column align="center" prop="set" label="预设位配置">
              <template slot-scope="scope">
                <span>{{ scope.row.num }}</span>
              </template>
            </el-table-column>
            <el-table-column align="center" prop="type" label="说明">
              <template slot-scope="scope">
                <span>{{ scope.row.num }}</span>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div style="clear: both;"></div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="visiblehide">取 消</el-button>
        <el-button type="primary" @click="visiblehide">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      defaultProps: {
        children: "children",
        label: "label"
      }
    };
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    handleClose(done) {
      this.$emit("update:visible", false);
    },
    visiblehide() {
      this.$emit("update:visible", false);
    },
    getTypes() {
      let params = {
        offset: 0,
        limit: ""
      };
      this.$api.task.getConftypes(params).then(res => {
        this.types = res.list_data;
      });
    }
  },
  created() {
    this.getTypes();
  }
};
</script>

<style scoped="scoped" lang="scss">
.rightCon {
  width: 608px;
  margin-left: 12px;
  float: left;
}
.leftCon {
  float: left;
  width: 250px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 10px;
  min-height: 500px;
}
.titles {
  height: 30px;
  background: rgba(59, 183, 255, 1);
  color: $white-font-color;
  font-size: 14px;
  padding-left: 13px;
  line-height: 30px;
}
.searchBox {
  padding: 10px;
}
</style>