<template>
  <el-form ref="authForm" label-position="right" label-width="90px">
    <el-form-item label="目录">
      <el-checkbox
        :indeterminate="isCategoryAll"
        v-model="categoryCheckAll"
        @change="handleCheckAllCategory"
        >全选</el-checkbox
      >
      <div style="margin: 15px 0;"></div>
      <el-checkbox-group
        v-model="checkedCategorys"
        @change="handleCheckedCategory"
      >
        <el-checkbox
          v-for="category in topCategoryList"
          :label="category.categoryId"
          :key="category.categoryId"
          >{{ category.name }}</el-checkbox
        >
      </el-checkbox-group>
    </el-form-item>

    <el-form-item>
      <el-button type="primary" style="float: right" @click="saveAuthCategory"
        >确认</el-button
      >
    </el-form-item>
  </el-form>
</template>

<script>
import waves from "@/directive/waves"; // 水波纹指令
// import {
//   queryCategoryAuth,
//   saveCategoryAuth
// } from "@/api/product/categoryAuth";

export default {
  name: "authCategoryPane", //目录授权
  directives: {
    waves
  },
  props: ["authOrgData"],
  data() {
    return {
      topCategoryList: [], //待分配的目录[对象]
      topCategoryIdsList: [], //顶级目录
      checkedCategorys: [], //选中的目录
      categoryCheckAll: false, //是否全选
      isCategoryAll: false // ture 上面的是false 半选 ，两个都是false 不选， 上面是true，这边是false 全选
    };
  },

  mounted() {
    let query = {
      authOrgId: this.authOrgData.orgId
    };

    // queryCategoryAuth(query).then(response => {
    //   //选中
    //   this.checkedCategorys = response.data.checked;
    //   //全部
    //   this.topCategoryList = response.data.all;
    //   //
    //   this.topCategoryIdsList = response.data.allIds;

    //   if (this.checkedCategorys.length <= 0) {
    //     //没有选中的值
    //     this.isCategoryAll = false;
    //     this.categoryCheckAll = false;
    //   } else if (this.checkedCategorys.length == this.topCategoryList.length) {
    //     //全选
    //     this.isCategoryAll = false;
    //     this.categoryCheckAll = true;
    //   } else {
    //     //半选
    //     this.isCategoryAll = true;
    //     this.categoryCheckAll = false;
    //   }
    // });
  },
  methods: {
    handleCheckAllCategory(val) {
      //是否全选
      //目录全部选中
      this.checkedCategorys = val ? this.topCategoryIdsList : [];
      this.isCategoryAll = false;
    },
    handleCheckedCategory() {
      //点击某一个
      let checkedCount = this.checkedCategorys.length;
      this.categoryCheckAll = checkedCount === this.topCategoryIdsList.length;
      this.isCategoryAll =
        checkedCount > 0 && checkedCount < this.topCategoryIdsList.length;
    },
    saveAuthCategory() {
      let data = {
        categoryIds: this.checkedCategorys,
        orgId: this.authOrgData.orgId,
        orgName: this.authOrgData.orgName
      };
      // saveCategoryAuth(data).then(response => {
      //   this.dialogOrgConfVisible = false;
      //   this.$notify({
      //     title: "成功",
      //     message: "授权成功",
      //     type: "success",
      //     duration: 3000
      //   });
      //   this.$emit("retRefersh");
      // });
    }
  }
};
</script>

<style scoped></style>
