<template>
  <div class="app-container">
    <el-card>
      <div slot="header" class="clearfix">
        <span>提现配置管理</span>
      </div>

      <el-form :model="configForm" label-width="150px" style="max-width: 600px">
        <el-form-item label="最低提现金额(元)">
          <el-input v-model="configForm.withdraw_min_amount" style="width: 200px" />
          <span class="config-tip">单次提现最低金额</span>
        </el-form-item>

        <el-form-item label="单次最大提现(元)">
          <el-input v-model="configForm.withdraw_max_amount" style="width: 200px" />
          <span class="config-tip">单次提现最高金额（默认200）</span>
        </el-form-item>

        <el-form-item label="每日提现限额(元)">
          <el-input v-model="configForm.withdraw_daily_limit" style="width: 200px" />
          <span class="config-tip">单用户每日提现总额限制（默认2000）</span>
        </el-form-item>

        <el-form-item label="提现手续费率(%)">
          <el-input v-model="configForm.withdraw_fee_rate" style="width: 200px" />
          <span class="config-tip">提现手续费比例</span>
        </el-form-item>

        <el-form-item label="提现开始时间">
          <el-time-picker
            v-model="withdrawTimeStart"
            format="HH:mm"
            placeholder="开始时间"
            style="width: 200px"
          />
        </el-form-item>

        <el-form-item label="提现结束时间">
          <el-time-picker
            v-model="withdrawTimeEnd"
            format="HH:mm"
            placeholder="结束时间"
            style="width: 200px"
          />
        </el-form-item>

        <el-form-item label="提现功能">
          <el-switch
            v-model="withdrawEnabled"
            active-text="启用"
            inactive-text="关闭"
          />
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="handleSave">保存配置</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
import { getWithdrawConfig, updateWithdrawConfig } from '@/api/shop/shopWithdrawRecord';

export default {
  name: 'ShopWithdrawConfig',
  data() {
    return {
      configForm: {
        withdraw_min_amount: '10',
        withdraw_max_amount: '200',
        withdraw_daily_limit: '2000',
        withdraw_fee_rate: '0',
        withdraw_time_start: '09:00',
        withdraw_time_end: '18:00',
        withdraw_enabled: '1'
      },
      withdrawTimeStart: new Date(2026, 0, 1, 9, 0),
      withdrawTimeEnd: new Date(2026, 0, 1, 18, 0),
      withdrawEnabled: true
    };
  },
  created() {
    this.getConfig();
  },
  methods: {
    async getConfig() {
      try {
        const res = await getWithdrawConfig();
        if (res.code === 200 && res.data) {
          this.configForm = { ...this.configForm, ...res.data };
          this.withdrawEnabled = this.configForm.withdraw_enabled === '1';
          
          // 解析时间
          if (this.configForm.withdraw_time_start) {
            const [sh, sm] = this.configForm.withdraw_time_start.split(':');
            this.withdrawTimeStart = new Date(2026, 0, 1, parseInt(sh), parseInt(sm));
          }
          if (this.configForm.withdraw_time_end) {
            const [eh, em] = this.configForm.withdraw_time_end.split(':');
            this.withdrawTimeEnd = new Date(2026, 0, 1, parseInt(eh), parseInt(em));
          }
        }
      } catch (error) {
        console.error('加载配置失败', error);
      }
    },
    async handleSave() {
      try {
        // 格式化时间
        const formatTime = (date) => {
          const h = date.getHours().toString().padStart(2, '0');
          const m = date.getMinutes().toString().padStart(2, '0');
          return `${h}:${m}`;
        };
        
        this.configForm.withdraw_time_start = formatTime(this.withdrawTimeStart);
        this.configForm.withdraw_time_end = formatTime(this.withdrawTimeEnd);
        this.configForm.withdraw_enabled = this.withdrawEnabled ? '1' : '0';
        
        await updateWithdrawConfig(this.configForm);
        this.$message.success('配置保存成功');
      } catch (error) {
        console.error('保存失败', error);
      }
    }
  }
};
</script>

<style scoped>
.config-tip {
  margin-left: 10px;
  color: #999;
  font-size: 12px;
}
</style>
