<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="backStockFlag">
        <el-switch :active-value="1" :inactive-value="0" v-model="ruleForm.backStockFlag"></el-switch>
        <div class="gray03 fz12">开启表示在退货单同意收货后，福利中心可占库存将会增加</div>
      </el-form-item>
      <el-form-item class="mt50">
        <el-button type="primary" @click="submitForm">保存</el-button>
        <span class="ml10 gray02" 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/gift';
const { updateConfig, getConfigDetail } = api;

export default {
  name: 'SalesReturnSetting',
  data() {
    return {
      loading: false,
      ruleForm: {
        configId: '',
        backStockFlag: 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;
      updateConfig({
        configId: this.ruleForm.configId, // 新建不需要传
        backStockFlag: this.ruleForm.backStockFlag
      }).then(res => {
        this.loading = false;
        this.getDetail();
        this.$tips({ message: '保存成功', type: 'success' });
      }).finally(() => {
        this.loading = false;
      });
    },
    // 获取配置详情
    getDetail() {
      getConfigDetail().then(res => {
        this.ruleForm = { ...this.ruleForm, ...res.result };
      });
    }
  },
};
</script>
