<template>
  <div>

    <div class="panel-fieldset">
      <h4 class="panel-legend">会员设置</h4>
      <el-form-item label="会员头像宽度：">
        <el-input-number v-model="extend.memberLogoWidth" :min="1" :max="10000" :step="5" :disabled="disabled"></el-input-number>
      </el-form-item>
      <el-form-item label="会员头像高度：">
        <el-input-number v-model="extend.memberLogoHeight" :min="1" :max="10000" :step="5" :disabled="disabled"></el-input-number>
      </el-form-item>
      <el-form-item label="会员登录验证类型：">
        <el-select v-model="extend.loginAuthType" clearable class="form-item" :disabled="disabled">
          <template v-for="item in loginAuthTypeSelection">
            <el-option :label="item.name" :value="item.ID" :key="item.ID"></el-option>
          </template>
        </el-select>
      </el-form-item>
      <el-form-item label="会员扩展模型：">
        <el-select v-model="extend.memberModelCode" clearable class="form-item" :disabled="disabled">
          <template v-for="item in memberModelCodeSelection">
            <el-option :label="item.name" :value="item.code" :key="item.code"></el-option>
          </template>
        </el-select>
      </el-form-item>
      <el-form-item label="会员注册是否审核：">
        <el-switch v-model="extend.memberRegistrationReview" :disabled="disabled" active-value="Y" inactive-value="N"></el-switch>
      </el-form-item>
      <el-form-item label="是否发送激活邮件：" v-if="extend.memberRegistrationReview === 'Y'">
        <el-switch v-model="extend.memberSendActiveEmail" :disabled="disabled" active-value="Y" inactive-value="N"></el-switch>
      </el-form-item>
      <el-form-item label="是否启用会员阅读记录：">
        <el-switch v-model="extend.memberReaderRecordEnable" :disabled="disabled" active-value="Y" inactive-value="N"></el-switch>
      </el-form-item>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loginAuthTypeSelection: [], // 会员登录验证类型selection
      memberModelCodeSelection: [] // 会员扩展模型selection
    }
  },
  computed: {
    extend: {
      get() {
        return this.extends
      },
      set(val) {
        this.$emit('update:extends', val)
      }
    }
  },
  async created() {
    let res = await axios.get('/ui/memberloginauthtype')
    this.loginAuthTypeSelection = res.data.data
  },
  watch: {
    async siteID() {
      let res = await axios.get(`/ui/sites/${this.siteID}/membermodels`)
      this.memberModelCodeSelection = res.data.data
    }
  },
  methods: {
  },
  props: {
    extends: {
      type: Object,
      default: function () {
        return {
          memberLogoWidth: '', // 会员头像宽度
          memberLogoHeight: '', // 会员头像高度
          loginAuthType: '', // 会员登录验证类型
          memberModelCode: '', // 会员扩展模型
          memberRegistrationReview: 'N', // 会员注册是否审核
          memberSendActiveEmail: 'Y', // 是否发送激活邮件
          memberReaderRecordEnable: 'Y' // 是否启用会员阅读记录
        }
      }
    },
    siteID: {
      type: [String, Number]
    },
    disabled: {
      type: Boolean
    }
  }
}
</script>
