<template>
  <el-form
    ref="contactForm"
    label-position="right"
    label-width="100px"
    style=" margin-left:20px;"
  >
    <el-form-item label="渠道">
      <el-checkbox
        :indeterminate="isIndeterminate"
        v-model="checkAll"
        @change="handleCheckAllChange"
        >全选</el-checkbox
      >
      <div style="margin: 15px 0;"></div>
      <el-checkbox-group
        v-model="checkedDistributionChannel"
        @change="handleCheckedChannelChange"
      >
        <el-checkbox
          v-for="channel in distributionChannelOptionList"
          :label="channel.code"
          :key="channel.code"
          >{{ channel.name }}</el-checkbox
        >
      </el-checkbox-group>
    </el-form-item>

    <el-form-item>
      <el-button
        type="primary"
        v-has="'pimOrgDistributionChannel:save'"
        @click="handleChannelSave()"
        style="float: right"
        >确认</el-button
      >
    </el-form-item>
  </el-form>
</template>

<script>
import waves from "@/directive/waves"; // 水波纹指令
import {
  getOrgDistributionChannel,
  saveOrgDistributionChannel
} from "@/api/auth/org";
export default {
  name: "authChannelPane", //渠道授权
  directives: {
    waves
  },
  props: ["authOrgData"],
  data() {
    return {
      checkAll: false,
      distributionChannelOption: [],
      checkedDistributionChannel: [], //选中的渠道
      distributionChannelOptionList: [], //可分配的渠道
      isIndeterminate: true
    };
  },
  mounted() {
    getOrgDistributionChannel(this.authOrgData.orgId).then(response => {
      this.distributionChannelOption = response.data.distributionChannelOption;
      let checked = response.data.checkedDistributionChannel;
      if (checked != undefined && checked != null) {
        this.checkedDistributionChannel = checked;
      }
      this.distributionChannelOptionList =
        response.data.distributionChannelOptionList;
    });
  },
  methods: {
    handleCheckAllChange(val) {
      this.checkedDistributionChannel = val
        ? this.distributionChannelOption
        : [];
      this.isIndeterminate = false;
    },
    handleCheckedChannelChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.distributionChannelOption.length;
      this.isIndeterminate =
        checkedCount > 0 &&
        checkedCount < this.distributionChannelOption.length;
    },

    handleChannelSave() {
      var orgChannelData = {
        orgId: this.authOrgData.orgId,
        channelCode: this.checkedDistributionChannel
      };
      saveOrgDistributionChannel(orgChannelData).then(() => {
        this.$notify({
          title: "成功",
          message: "授权成功",
          type: "success",
          duration: 3000
        });
        //重新加载 -- 调用父节点
        this.$emit("retRefersh");
      });
    }
  }
};
</script>

<style scoped></style>
