<template>
  <div class="app-container">
    <el-form :model="form40" label-width="200px" v-loading="loading">
      <el-form-item label="是否开启手机号配置" prop="enablePhoneConfig">
        <el-switch v-model="form40.enablePhoneConfig"></el-switch>
      </el-form-item>

      <template v-if="form40.enablePhoneConfig">
        <el-form-item label="生成条数" prop="generateCount">
          <el-input-number v-model="form40.generateCount" :min="1" :step="1" :precision="0" placeholder="请输入生成条数"></el-input-number>
        </el-form-item>

        <el-form-item label="开始位置" prop="startIndex">
          <el-input-number v-model="form40.startIndex" :min="1" :step="1" :precision="0" placeholder="例如: 1"></el-input-number>
          <span class="tip-text">（从第几位开始生成）</span>
        </el-form-item>

        <el-form-item label="结束位置" prop="endIndex">
          <el-input-number v-model="form40.endIndex" :min="1" :step="1" :precision="0" placeholder="例如: 11"></el-input-number>
          <span class="tip-text">（到第几位结束）</span>
        </el-form-item>
      </template>

      <el-form-item label="是否开手机号拨打次数限制" prop="enablePhoneLimitConfig">
        <el-switch v-model="form40.enablePhoneLimitConfig"></el-switch>
      </el-form-item>
      <template v-if="form40.enablePhoneLimitConfig">
        <el-form-item label="拨打次数限制" prop="startIndex">
          <el-input-number v-model="form40.numberCalls" :min="1" :step="1" :precision="0" placeholder="例如: 1"></el-input-number>
        </el-form-item>
      </template>
      <el-form-item label="DeepSeekChat模型并发数" prop="DeepSeekChatConcurrency">
        <el-input v-model="form40.concurrency" placeholder="请输入DeepSeekChat模型并发数"></el-input>
      </el-form-item>
      <el-form-item label="DeepSeekChat服务地址" prop="DeepSeekChatServerAddress">
        <el-input v-model="form40.serverAddress" placeholder="请输入DeepSeekChat服务地址"></el-input>
      </el-form-item>
      <el-form-item label="DeepSeekChat_apiKey" prop="DeepSeekChatApiKey">
        <el-input v-model="form40.apiKey" placeholder="请输入DeepSeekChat_apiKey"></el-input>
      </el-form-item>
      <el-form-item label="DeepSeekChat模型名称" prop="DeepSeekChatModelName">
        <el-input v-model="form40.modelName" placeholder="请输入DeepSeekChat模型名称"></el-input>
      </el-form-item>
      <el-form-item label="是否限制外呼网关" prop="enableGateWayLimit">
        <el-switch v-model="form40.enableGateWayLimit"></el-switch>
      </el-form-item>
      <el-form-item label="系统可见外呼网关" prop="showGatewayIds" v-if="!!form40.enableGateWayLimit">
        <!-- <el-input v-model="" placeholder="请输入DeepSeekChat模型名称"></el-input> -->
        <el-select v-model="form40.showGatewayIds" multiple filterable placeholder="请选择系统可见外呼网关">
          <el-option
            v-for="item in gatewayList"
            :key="item.id"
            :label="item.gwDesc"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>

      <div style="display: flex; justify-content: flex-end;">
        <el-button type="primary" :disabled="saveLoading" :loading="saveLoading" @click="submitForm40">提  交</el-button>
      </div>
    </el-form>
  </div>
</template>

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

export default {
  name: "cidConfig",
  data() {
    return {
      loading: true,
      gatewayList: [],
      form40: {
        enablePhoneConfig: false,
        enablePhoneLimitConfig:false,
        generateCount: 1,
        startIndex: 1,
        endIndex: 11,
        numberCalls:1,
        serverAddress: null,
        modelName: null,
        enableGateWayLimit: false,
        showGatewayIds: null,
      },
      saveLoading: false,
    }
  },
  created() {
    this.getConfigByKey("cid.config");
    this.initGateway();
  },
  methods: {
    getConfigByKey(key){
      getConfigByKey(key).then(response => {
        this.configId = response.data.configId;
        this.configKey = response.data.configKey;
        this.form40 = JSON.parse(response.data.configValue);
        this.loading = false
      });
    },
    initGateway() {
      getGatewayList().then(response => {
        this.gatewayList = response.data;
      })
    },
    submitForm40(){
      this.saveLoading = true

      if (this.form40.enablePhoneConfig) {
        if (!this.form40.generateCount || this.form40.generateCount < 1) {
          this.msgError('生成条数不能为空且不能小于1');
          return false;
        }

        // if (!this.form40.generateCount || this.form40.generateCount > 10) {
        //   this.msgError('单个手机号生成条数不能大于10条');
        //   return false;
        // }

        if (!this.form40.startIndex || this.form40.startIndex < 1 || this.form40.startIndex > 11) {
          this.msgError('开始位置不能为空，且必须在1到11之间');
          return false;
        }

        if (!this.form40.endIndex || this.form40.endIndex < 1 || this.form40.endIndex > 11) {
          this.msgError('结束位置不能为空，且必须在1到11之间');
          return false;
        }

        if (this.form40.startIndex > this.form40.endIndex) {
          this.msgError('开始位置不能大于结束位置');
          return false;
        }

        if (this.form40.endIndex < this.form40.startIndex) {
          this.msgError('结束位置不能小于开始位置');
          return false;
        }
        if (this.form40.startIndex === this.form40.endIndex) {
          this.msgError('开始位置不能等于结束位置');
          return false;
        }

        let num = this.form40.endIndex - this.form40.startIndex
        if(num < 4){
          this.msgError('开始和结束位置不能小于4位');
          return false;
        }
      }

      if(this.form40.enablePhoneLimitConfig){
        if(this.form40.numberCalls == null || this.form40.numberCalls === 0){
          this.msgError('限制次数不能为空或者大于0！');
          return false;
        }
        if(this.form40.numberCalls > 100000){
          this.msgError('限制次数不能超过10万次！');
          return false;
        }
      }

      const param={configId:this.configId,configValue:JSON.stringify(this.form40)}
      updateConfigByKey(param).then(response => {
        const {code} = response
        if (code === 200) {
          this.msgSuccess("修改成功");
        }
        this.saveLoading = false
      });
    },
  }
}
</script>

<style scoped>

</style>
