<template>
  <div class="app-container">
    <el-card v-loading="loading" shadow="never">
      <div slot="header">
        <span>呼叫频率配置</span>
      </div>
      <el-form ref="form" :model="form" label-width="200px">
        <el-card shadow="never" class="section-card">
          <div slot="header"><span>频率限制配置</span></div>
          <el-form-item label="是否启用频率限制" prop="enabled">
            <el-switch v-model="form.enabled"></el-switch>
          </el-form-item>
          <template v-if="form.enabled">
            <el-form-item label="每分钟最大呼叫次数" prop="maxCallsPerMinute">
              <el-input-number v-model="form.maxCallsPerMinute" :min="1" :max="1000" :step="1" :precision="0" placeholder="请输入每分钟最大呼叫次数"></el-input-number>
              <span class="tip-text">（限制每分钟内允许的最大呼叫次数）</span>
            </el-form-item>
            <el-form-item label="每天最大呼叫次数" prop="maxCallsPerDay">
              <el-input-number v-model="form.maxCallsPerDay" :min="1" :max="100000" :step="1" :precision="0" placeholder="请输入每天最大呼叫次数"></el-input-number>
              <span class="tip-text">（限制每天允许的最大呼叫次数）</span>
            </el-form-item>
            <el-form-item label="两次呼叫间隔（秒）" prop="callIntervalSeconds">
              <el-input-number v-model="form.callIntervalSeconds" :min="0" :max="3600" :step="1" :precision="0" placeholder="请输入两次呼叫间隔秒数"></el-input-number>
              <span class="tip-text">（同一号码两次呼叫之间的最小间隔时间）</span>
            </el-form-item>
          </template>
        </el-card>

        <div class="footer">
          <el-button type="primary" :loading="submitLoading" @click="submitForm">保 存</el-button>
        </div>
      </el-form>
    </el-card>
  </div>
</template>

<script>
import { getConfigByKey, updateConfigByKey } from '@/api/system/config'

export default {
  name: 'AdminVoiceFrequency',
  data() {
    return {
      loading: false,
      submitLoading: false,
      configId: null,
      configKey: 'voice.frequency.config',
      form: {
        enabled: false,
        maxCallsPerMinute: 60,
        maxCallsPerDay: 1000,
        callIntervalSeconds: 10
      }
    }
  },
  created() {
    this.loadConfig()
  },
  methods: {
    loadConfig() {
      this.loading = true
      getConfigByKey(this.configKey).then(response => {
        if (response.data) {
          this.configId = response.data.configId
          try {
            const parsed = JSON.parse(response.data.configValue)
            this.form = { ...this.form, ...parsed }
          } catch (e) {
            // 使用默认值
          }
        } else {
          this.configId = null
        }
      }).finally(() => {
        this.loading = false
      })
    },
    submitForm() {
      if (this.form.enabled) {
        if (!this.form.maxCallsPerMinute || this.form.maxCallsPerMinute < 1) {
          this.msgError('每分钟最大呼叫次数不能为空且不能小于1')
          return false
        }
        if (!this.form.maxCallsPerDay || this.form.maxCallsPerDay < 1) {
          this.msgError('每天最大呼叫次数不能为空且不能小于1')
          return false
        }
        if (this.form.callIntervalSeconds == null || this.form.callIntervalSeconds < 0) {
          this.msgError('两次呼叫间隔不能为空且不能小于0')
          return false
        }
      }
      this.submitLoading = true
      const param = {
        configId: this.configId,
        configKey: this.configKey,
        configValue: JSON.stringify(this.form)
      }
      updateConfigByKey(param).then(response => {
        if (response.code === 200) {
          this.msgSuccess('保存成功')
        }
      }).finally(() => {
        this.submitLoading = false
      })
    }
  }
}
</script>

<style scoped>
.section-card {
  margin-bottom: 20px;
}
.tip-text {
  color: #909399;
  font-size: 12px;
  margin-left: 8px;
}
.footer {
  width: 100%;
  display: flex;
  margin-top: 30px;
  align-items: flex-end;
  justify-content: flex-end;
}
</style>
