<template>
  <div class="p20 pt30" v-loading="loading">
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" style="min-height:400px;">
      <el-form-item label="转赠扣库存" prop="transferReduceFlag">
        <el-switch :active-value="1" :inactive-value="0" v-model="ruleForm.transferReduceFlag"></el-switch>
        <div class="gray03 fz12" style="line-height:1.4;margin-top:10px">开启表示赠送领取成功后，该卡券库存将会从福利中心的可占用库存扣除数量，若福利中心卡券可占用库存为 0，该卡券不可被赠送。</div>
      </el-form-item>
      <el-form-item style="margin-top:50px">
        <el-button type="primary" @click="submitForm">保存</el-button>
        <span class="ml10 gray03 fz12" v-if="ruleForm.updateTime">最近修改：{{formatDateTimeByType(ruleForm.updateTime, 'yyyy-MM-dd HH:mm:ss')}}</span>
      </el-form-item>
    </el-form>

  </div>
</template>

<script>

import { formatDateTimeByType } from '@/utils/index';
import api from '@/api/card-package';
const { saveCustomSetting, checkCustomSetting } = api;

export default {
  name: 'SalesReturnSetting',
  data() {
    return {
      loading: false,
      ruleForm: {
        transferReduceFlag: 0, // 是否收货自动加库存 0否1是
        createTime: '',
        updateTime: ''
      },
      rules: {},
    };
  },
  created() {
    this.$emit('updateBread', [ { breadName: '福利中心', breadPath: '/index' }, { breadName: '通用设置' } ]);
  },
  mounted() {
    this.getDetail();
  },
  methods: {
    formatDateTimeByType,
    submitForm() {
      if (this.loading) {
        return;
      }
      this.loading = true;
      saveCustomSetting({
        transferReduceFlag: this.ruleForm.transferReduceFlag
      }).then(res => {
        this.loading = false;
        this.getDetail();
        this.$tips({ message: '保存成功', type: 'success' });
      }).finally(() => {
        this.loading = false;
      });
    },
    // 获取配置详情
    getDetail() {
      checkCustomSetting().then(res => {
        this.ruleForm = { ...this.ruleForm, ...res.result };
      });
    }
  },
};
</script>
