<template>
  <div class="app-container">
    <el-tabs v-model="activeName" @tab-click="handleClick">

      <!-- ==================== CID配置 ==================== -->
      <el-tab-pane label="CID配置" name="cId.config">
        <el-form :model="form40" label-width="200px">
          <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-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 class="footer">
            <el-button type="primary" @click="submitForm40">提 交</el-button>
          </div>
        </el-form>
      </el-tab-pane>

      <!-- ==================== 个微配置 ==================== -->
      <el-tab-pane label="个微配置" name="wx.config">
        <el-form :model="form30" label-width="200px">
          <el-form-item label="新账号判断时间" prop="newAccountTime">
            <el-input v-model="form30.newAccountTime" placeholder="请输入天" style="width: 150px">
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
          <el-form-item label="新账号每天添加数量" prop="newAccountAddNum">
            <el-input v-model="form30.newAccountAddNum" placeholder="请输入个" style="width: 150px">
              <template slot="append">个</template>
            </el-input>
          </el-form-item>
          <el-form-item label="普通账号每天添加数量" prop="accountAddNum">
            <el-input v-model="form30.accountAddMin" placeholder="请输入个" style="width: 150px">
              <template slot="append">个</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.accountAddMax" placeholder="请输入个" style="width: 150px">
              <template slot="append">个</template>
            </el-input>
          </el-form-item>
          <el-form-item label="文字消息（条/分）" prop="txtMsg">
            <el-input v-model="form30.txtMsgMinNum" placeholder="请输入条" style="width: 150px">
              <template slot="append">条</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.txtMsgMaxNum" placeholder="请输入条" style="width: 150px">
              <template slot="append">条</template>
            </el-input>
          </el-form-item>
          <el-form-item label="图片消息（条/分）" prop="imgMsg">
            <el-input v-model="form30.imgMsgMinNum" placeholder="请输入条" style="width: 150px">
              <template slot="append">条</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.imgMsgMaxNum" placeholder="请输入条" style="width: 150px">
              <template slot="append">条</template>
            </el-input>
          </el-form-item>
          <el-form-item label="新号添加好友频率(条/分)" prop="newAccountAddWx">
            <el-input v-model="form30.newAccountAddWxMin" placeholder="请输入分" style="width: 150px">
              <template slot="append">分</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.newAccountAddWxMax" placeholder="请输入分" style="width: 150px">
              <template slot="append">分</template>
            </el-input>
          </el-form-item>
          <el-form-item label="新号消息发送频率(条/秒)" prop="newAccountSendMsg">
            <el-input v-model="form30.newAccountSendMsgMin" placeholder="请输入秒" style="width: 150px">
              <template slot="append">秒</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.newAccountSendMsgMax" placeholder="请输入秒" style="width: 150px">
              <template slot="append">秒</template>
            </el-input>
          </el-form-item>
          <el-form-item label="添加好友频率(条/分)" prop="accountAddWx">
            <el-input v-model="form30.accountAddWxMin" placeholder="请输入分" style="width: 150px">
              <template slot="append">分</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.accountAddWxMax" placeholder="请输入分" style="width: 150px">
              <template slot="append">分</template>
            </el-input>
          </el-form-item>
          <el-form-item label="消息发送频率(条/秒)" prop="accountSendMsg">
            <el-input v-model="form30.accountSendMsgMin" placeholder="请输入秒" style="width: 150px">
              <template slot="append">秒</template>
            </el-input>
            <span> 到 </span>
            <el-input v-model="form30.accountSendMsgMax" placeholder="请输入秒" style="width: 150px">
              <template slot="append">秒</template>
            </el-input>
          </el-form-item>
          <div class="footer">
            <el-button type="primary" @click="submitForm30">提 交</el-button>
          </div>
        </el-form>
      </el-tab-pane>

      <!-- ==================== OSS配置 ==================== -->
      <el-tab-pane label="OSS配置" name="sys.oss.cloudStorage">
        <el-form ref="form1" :model="form1" :rules="rules1" label-width="160px">
          <el-form-item label="类型" prop="type">
            <el-radio-group v-model="form1.type">
              <el-radio :label="1">七牛云</el-radio>
              <el-radio :label="2">阿里云</el-radio>
              <el-radio :label="3">腾讯云</el-radio>
              <el-radio :label="4">华为云</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="form1.type==1" label="七牛绑定的域名" prop="qiniuDomain">
            <el-input v-model="form1.qiniuDomain" label="请输入七牛绑定的域名"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==1" label="七牛路径前缀" prop="qiniuPrefix">
            <el-input v-model="form1.qiniuPrefix" label="请输入七牛路径前缀"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==1" label="七牛ACCESS_KEY" prop="qiniuAccessKey">
            <el-input v-model="form1.qiniuAccessKey" label="请输入七牛ACCESS_KEY"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==1" label="七牛SecretKey" prop="qiniuSecretKey">
            <el-input v-model="form1.qiniuSecretKey" label="七牛SecretKey不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==1" label="七牛空间名" prop="qiniuBucketName">
            <el-input v-model="form1.qiniuBucketName" label="七牛空间名不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==2" label="阿里云绑定的域名" prop="aliyunDomain">
            <el-input v-model="form1.aliyunDomain" label="阿里云绑定的域名不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==2" label="阿里云路径前缀" prop="aliyunPrefix">
            <el-input v-model="form1.aliyunPrefix" label="阿里云路径前缀不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==2" label="阿里云EndPoint" prop="aliyunEndPoint">
            <el-input v-model="form1.aliyunEndPoint" label="阿里云EndPoint不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==2" label="阿里云AccessKeyId" prop="aliyunAccessKeyId">
            <el-input v-model="form1.aliyunAccessKeyId" label="阿里云AccessKeyId不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==2" label="阿里云AccessKeySecret" prop="aliyunAccessKeySecret">
            <el-input v-model="form1.aliyunAccessKeySecret" label="阿里云AccessKeySecret不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==2" label="阿里云BucketName" prop="aliyunBucketName">
            <el-input v-model="form1.aliyunBucketName" label="阿里云BucketName不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==3" label="腾讯云绑定的域名" prop="qcloudDomain">
            <el-input v-model="form1.qcloudDomain" label="腾讯云绑定的域名格式不正确"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==3" label="腾讯云前缀" prop="qcloudPrefix">
            <el-input v-model="form1.qcloudPrefix" label="腾讯云前缀不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==3" label="腾讯云SecretId" prop="qcloudSecretId">
            <el-input v-model="form1.qcloudSecretId" label="腾讯云SecretId不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==3" label="腾讯云SecretKey" prop="qcloudSecretKey">
            <el-input v-model="form1.qcloudSecretKey" label="腾讯云SecretKey不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==3" label="腾讯云BucketName" prop="qcloudBucketName">
            <el-input v-model="form1.qcloudBucketName" label="腾讯云BucketName不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==3" label="所属地区" prop="qcloudRegion">
            <el-input v-model="form1.qcloudRegion" label="所属地区不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==4" label="华为云绑定的域名" prop="huaweiDomain">
            <el-input v-model="form1.huaweiDomain" label="华为云绑定的域名格式不正确"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==4" label="华为云Endpoint" prop="huaweiBucketName">
            <el-input v-model="form1.huaweiEndpoint" label="华为云Endpoint不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==4" label="华为云AK" prop="huaweiAK">
            <el-input v-model="form1.huaweiAK" label="华为云AK不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==4" label="华为云SK" prop="huaweiSK">
            <el-input v-model="form1.huaweiSK" label="华为云SK不能为空"></el-input>
          </el-form-item>
          <el-form-item v-if="form1.type==4" label="华为云BucketName" prop="huaweiBucketName">
            <el-input v-model="form1.huaweiBucketName" label="华为云BucketName不能为空"></el-input>
          </el-form-item>
          <div class="footer">
            <el-button type="primary" @click="submitForm1">提 交</el-button>
          </div>
        </el-form>
      </el-tab-pane>

      <!-- ==================== 前端配置 ==================== -->
      <el-tab-pane label="前端配置" name="his.adminUi.config">
        <el-form ref="form33" :model="form33" label-width="180px">
          <!-- 存储桶配置 -->
          <el-divider content-position="left">存储桶配置</el-divider>
          <el-row>
            <el-col :span="12">
              <el-form-item label="OBS Access Key ID" prop="obsAccessKeyId">
                <el-input v-model="form33.obsAccessKeyId" type="password" show-password placeholder="请输入Access Key ID" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="OBS Secret Access Key" prop="obsSecretAccessKey">
                <el-input v-model="form33.obsSecretAccessKey" type="password" show-password placeholder="请输入Secret Access Key" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="OBS服务器地址" prop="obsServer">
                <el-input v-model="form33.obsServer" placeholder="请输入OBS服务器地址">
                  <template slot="prepend">https://</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="OBS存储桶" prop="obsBucket">
                <el-input v-model="form33.obsBucket" placeholder="请输入OBS存储桶名称" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="COS存储桶" prop="cosBucket">
                <el-input v-model="form33.cosBucket" placeholder="请输入COS存储桶名称" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="COS存储区域" prop="cosRegion">
                <el-input v-model="form33.cosRegion" placeholder="请输入COS存储区域" />
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 视频线路配置 -->
          <el-divider content-position="left">视频线路配置</el-divider>
          <el-row>
            <el-col :span="12">
              <el-form-item label="线路一地址" prop="videoLinePrimary">
                <el-input v-model="form33.videoLinePrimary" placeholder="请输入线路一地址">
                  <template slot="prepend">https://</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="线路二地址" prop="videoLineSecondary">
                <el-input v-model="form33.videoLineSecondary" placeholder="请输入线路二地址">
                  <template slot="prepend">https://</template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="直播解码路径" prop="livePath">
                <el-input v-model="form33.livePath" placeholder="请输入直播解码路径">
                  <template slot="prepend">/</template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 火山云配置 -->
          <el-divider content-position="left">火山云配置</el-divider>
          <el-row>
            <el-col :span="12">
              <el-form-item label="火山云视频地址" prop="volcanoVideoDomain">
                <el-input v-model="form33.volcanoVideoDomain" placeholder="请输入火山云视频地址">
                  <template slot="prepend">https://</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="点播空间名称" prop="volcanoVodSpace">
                <el-input v-model="form33.volcanoVodSpace" placeholder="请输入点播空间名称" />
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 直播配置 -->
          <el-divider content-position="left">直播配置</el-divider>
          <el-row>
            <el-col :span="12">
              <el-form-item label="WebSocket地址" prop="liveWebSocketUrl">
                <el-input v-model="form33.liveWebSocketUrl" placeholder="请输入WebSocket地址">
                  <template slot="prepend">wss://</template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 业务配置 -->
          <el-divider content-position="left">业务配置</el-divider>
          <el-row>
            <el-col :span="12">
              <el-form-item label="默认课程类型" prop="courseDefaultType">
                <el-radio-group v-model="form33.courseDefaultType">
                  <el-radio label="1">会员</el-radio>
                  <el-radio label="2">企微</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 提交按钮 -->
          <div class="footer">
            <el-button type="primary" @click="submitForm33">提交</el-button>
          </div>
        </el-form>
      </el-tab-pane>

    </el-tabs>
  </div>
</template>

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

export default {
  name: 'Config',
  data() {
    return {
      gatewayList: [],
      activeName: 'sys.oss.cloudStorage',
      configId: null,
      configKey: null,
      // OSS配置
      form1: {},
      rules1: {},
      // 个微配置
      form30: {},
      // 前端配置
      form33: {},
      rules33: {},
      // CID配置
      form40: {
        enablePhoneConfig: false,
        enablePhoneLimitConfig: false,
        generateCount: 1,
        startIndex: 1,
        endIndex: 11,
        numberCalls: 1,
      },
    }
  },
  created() {
    this.getConfigByKey(this.activeName)
  },
  methods: {
    handleClick(tab) {
      this.getConfigByKey(tab.name)
    },
    safeParseConfig(configValue, fallback = {}) {
      if (configValue === null || configValue === undefined || configValue === '' || configValue === 'null') {
        return fallback
      }
      try {
        const parsed = JSON.parse(configValue)
        if (parsed === null || parsed === undefined) {
          return fallback
        }
        return parsed
      } catch (e) {
        return fallback
      }
    },
    getConfigByKey(key) {
      getConfigByKey(key).then(response => {
        const configValue = response && response.data ? response.data.configValue : null
        if (!!response.data) {
          this.configId = response.data.configId
          this.configKey = response.data.configKey
          if (key == 'cId.config') {
            this.form40 = JSON.parse(response.data.configValue)
          }
        } else {
          this.configId = null
          this.configKey = key
          if (key == 'cId.config') {
            this.form40 = { enablePhoneConfig: false, generateCount: 1 }
          }
        }
        if (key == 'sys.oss.cloudStorage') {
          this.form1 = this.safeParseConfig(configValue, { ...this.form1 })
        }
        if (key == 'wx.config') {
          if (!!response.data) {
            this.configId = response.data.configId
            this.configKey = response.data.configKey
            this.form30 = { ...this.form30, ...this.safeParseConfig(configValue, {}) }
          }
        }
        if (key == 'his.adminUi.config') {
          if (!!response.data) {
            this.configId = response.data.configId
            this.configKey = response.data.configKey
            this.form33 = { ...this.form33, ...this.safeParseConfig(configValue, {}) }
          }
        }
        if (key == 'cId.config' && !!this.form40.enableGateWayLimit) {
          getGatewayList().then(res => {
            this.gatewayList = res.data
          })
        }
      })
    },
    submitForm1() {
      this.$refs['form1'].validate(valid => {
        if (valid) {
          var param = { configId: this.configId, configValue: JSON.stringify(this.form1) }
          updateConfigByKey(param).then(response => {
            if (response.code === 200) {
              this.msgSuccess('修改成功')
            }
          })
        }
      })
    },
    submitForm30() {
      const param = { configId: this.configId, configKey: this.configKey, configValue: JSON.stringify(this.form30) }
      updateConfigByKey(param).then(response => {
        if (response.code === 200) {
          this.msgSuccess('修改成功')
        }
      })
    },
    submitForm33() {
      const param = { configId: this.configId, configName: '前端配置', configKey: this.configKey, configValue: JSON.stringify(this.form33) }
      updateConfigByKey(param).then(response => {
        if (response.code === 200) {
          this.msgSuccess('修改成功')
        }
      })
    },
    submitForm40() {
      if (this.form40.enablePhoneConfig) {
        if (!this.form40.generateCount || this.form40.generateCount < 1) {
          this.msgError('生成条数不能为空且不能小于1')
          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.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
        }
      }
      this.saveConfig40()
    },
    saveConfig40() {
      const param = {
        configId: this.configId,
        configKey: this.configKey,
        configValue: JSON.stringify(this.form40)
      }
      updateConfigByKey(param).then(response => {
        if (response.code === 200) {
          this.msgSuccess('修改成功')
        }
      })
    },
  }
}
</script>
<style scoped>
.footer {
  width: 100%;
  display: flex;
  margin-top: 50px;
  align-items: flex-end;
  justify-content: flex-end;
}
</style>
