<template>
  <el-col :span="24 / column" class="el-item" v-show="this.collapseNode ? collapse : true">
    <el-form-item v-bind="$attrs">
      <slot></slot>
    </el-form-item>
  </el-col>
</template>

<script>
export default {
  name: "CmsQueryItem",
  props: {
    column: {
      type: [ Number ],
      default: () => {
        return 3;
      },
    },
    collapse: {
      type: Boolean,
      default: false,
    },
    folding: {
      type: [ Boolean ],
      default: () => {
        return true;
      },
    },
    collapseNode: {
      type: [ Boolean ],
      default: () => {
        return false;
      },
    },
  },
  data() {
    return {
      isCollapse: false,
    };
  },
  computed: {
    openCollapse: {
      get() {
        if (this.collapseNode) {
          // eslint-disable-next-line vue/no-side-effects-in-computed-properties
          this.folding = this.$store.state.app.collapse;
        } else {
          return true;
        }
        return this.folding;
      },
      set(val) {
        this.$emit("update:folding", val);
      },
    },
  },
};
</script>

<style scoped></style>
