<template>
  <div v-if="pageStatus == 0">配置加载中...</div>
  <div v-else-if="pageStatus == 1">此页面不对此账号开放</div>
  <div v-else-if="pageStatus == 2">没有此页内容的配置权限，请检查集团上的配置</div>
  <div v-else-if="pageStatus == 3">加载发生错误</div>
  <div v-else-if="pageStatus == 4">
    <el-form ref="form" :model="form" :rules="rules" label-width="160px">
      <el-form-item label="集团内共享积分" prop="integralRuleFlag">
        <el-radio-group v-model="form.integralRuleFlag" :disabled="disabled">
          <el-radio label="0">不共享</el-radio>
          <el-radio label="1">共享</el-radio>
        </el-radio-group>
        <div style="color: red; font-size: 12px">
          不共享：每个站点单独设置积分规则，集团下每个站点的积分不通用
        </div>
        <div style="color: red; font-size: 12px">
          共享：集团站点统一设置积分规则，集团下的每个站点积分通用，每个站点下的商品需要站点单独配置
        </div>
      </el-form-item>
      <el-form-item label="集团内共享电子卡" prop="cardRuleFlag">
        <el-radio-group v-model="form.cardRuleFlag" :disabled="disabled">
          <el-radio label="0">不共享</el-radio>
          <el-radio label="1">共享</el-radio>
        </el-radio-group>
        <div style="color: red; font-size: 12px">
          不共享：每个站点单独设置电子卡规则，每个集团下电子卡不通用
        </div>
        <div style="color: red; font-size: 12px">
          共享：集团站点统一设置电子卡规则，每个集团下的站点电子卡通用
        </div>
      </el-form-item>
      <el-form-item label="集团内共享优惠劵" prop="couponFlag">
        <el-radio-group v-model="form.couponFlag" :disabled="true">
          <el-radio label="0">不共享</el-radio>
          <el-radio label="1">共享</el-radio>
        </el-radio-group>
        <div style="color: red; font-size: 12px">
          此功能暂未开放，不支持设置
        </div>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-row>
        <el-col :span="4" :offset="1">
          <el-button
            type="warning"
            icon="el-icon-edit"
            size="mini"
            @click="edit"
            >{{ this.disabled ? "修改配置" : "取消修改" }}</el-button
          >
        </el-col>
        <el-col :span="4" :offset="4">
          <el-button
            type="cyan"
            icon="el-icon-success"
            size="mini"
            @click="submitForm"
            :disabled="disabled"
            >确认设置</el-button
          >
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import { getGroupInfo, updateDept } from "@/api/system/dept";
export default {
  name: "Station_Group",
  data() {
    return {
      // 表单参数
      form: {},
      disabled: true,
      rules: {
        integralRuleFlag: [
          { required: true, message: "请选择是否", trigger: "change" },
        ],
        cardRuleFlag: [
          { required: true, message: "请选择是否开启积分", trigger: "change" },
        ],
        couponFlag: [
          { required: true, message: "请选择是否开启积分", trigger: "change" },
        ],
      },
      pageStatus: 0
    };
  },
  created() {
    this.init();
    this.setPageStatus();
  },
  methods: {
    init() {
      this.getGroupInfo();
    },
    setPageStatus() {
      this.queryPageStatus([1]).then((res) => {
        this.pageStatus = res;
      });
    },
    edit() {
      this.disabled = !this.disabled;
    },
    /** 修改按钮操作 */
    getGroupInfo() {
      getGroupInfo().then((response) => {
        this.form = response.data;
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.deptId != null) {
            updateDept(this.form).then((response) => {
              this.msgSuccess("修改成功");
              this.disabled = true;
            });
          }
        }
      });
    },
  },
};
</script>
