<template>
  <el-form ref="form" :model="form" label-width="140px" style="margin-top:40px;">
    <el-form-item label="同步模式">
      <el-select v-model="form.pattern" placeholder="请选择同步模式"  style="width :600px;">
        <el-option v-for="item in patterns" :key="item.value" :label="item.label" :value="item.value"> </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="数据库地址" v-if="form.pattern == 1 || form.pattern == 0" >
      <el-input v-model.trim="form.dbhost" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="用户名" v-if="form.pattern == 1 || form.pattern == 0" >
      <el-input v-model.trim="form.dbuser" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="密码" v-if="form.pattern == 1 || form.pattern == 0" >
      <el-input v-model.trim="form.dbpassword" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="数据库名" v-if="form.pattern == 1 || form.pattern == 0" >
      <el-input v-model.trim="form.dbname" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="接口地址" v-if="form.pattern == 2" >
      <el-input v-model.trim="form.interface_url" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="密钥" v-if="form.pattern == 2" >
      <el-input v-model.trim="form.interface_token" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="可访问IP" v-if="form.pattern == 3" >
      <el-input v-model.trim="form.allow_ip" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="密钥" v-if="form.pattern == 3" >
      <el-input v-model.trim="form.allow_token" maxlength="200" style="width :600px;"></el-input>
    </el-form-item>
    <el-form-item label="同步频率">
      <el-select v-model="form.sync_frequency" placeholder="请选择同步频率" style="width :600px;">
        <el-option v-for="item in sync_frequencys" :key="item.value" :label="item.label" :value="item.value"> </el-option>
      </el-select>
    </el-form-item>

    <el-form-item label="Tips" v-if="form.pattern == 3" >
      <div style="width :600px;">本接口方位地址为：https://api.kuyicloud.com/api/sync?org_id=xx?str=xxx?timestamp=xxx?titck=xxx
需要传递的参数有，org_id（机构id），str（随机字符串），timestamp（当前时间戳），和titck（签名）
签名生成规则：org_id+str+timestamp,以md5加密钥的方式生成字符串</div>
    </el-form-item>
  
    <el-form-item>
      <el-button type="primary" @click="onSubmit">保存</el-button>
      <el-button>重置</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { getInterface, saveInterface } from '@/api/integration'
export default {
  name: 'interfaceConfig',

  created() {
    this.getInterface()
  },
  data() {
    return {
      sync_frequencys: [{
        value: 1,
        label: '1分钟/次'
      }, {
        value: 2,
        label: '10分钟/次'
      }, {
        value: 3,
        label: '30分钟/次'
      }, {
        value: 4,
        label: '1小时/次'
      }, {
        value: 5,
        label: '6小时/次'
      }, {
        value: 6,
        label: '12小时/次'
      }, {
        value: 7,
        label: '1天/次'
      }],
      patterns: [{
        value: 1,
        label: '访问数据库模式'
      }, {
        value: 2,
        label: '调用接口模式'
      }, {
        value: 3,
        label: '数据接收模式'
      }],
      form: {
        id: 0,
        pattern: '',
        dbhost: '',
        dbuser: '',
        dbpassword: '',
        dbname: '',
        interface_url: '',
        interface_token: '',
        allow_ip: '',
        allow_token: '',
        sync_frequency: ''
      }
    }
  },
  methods: {
    getInterface: function() {
      getInterface().then(response => {
        if (response.data.state == 0) {
          this.$message.error(response.data.msg)
          return false
        } else {
          var interfaceinfo = response.data.data.interfaceinfo
          if (interfaceinfo != null) {
            this.form.id = interfaceinfo.id
            this.form.pattern = interfaceinfo.pattern
            this.form.dbhost = interfaceinfo.dbhost
            this.form.dbuser = interfaceinfo.dbuser
            this.form.dbpassword = interfaceinfo.dbpassword
            this.form.dbname = interfaceinfo.dbname
            this.form.interface_url = interfaceinfo.interface_url
            this.form.interface_token = interfaceinfo.interface_token
            this.form.allow_ip = interfaceinfo.allow_ip
            this.form.allow_token = interfaceinfo.allow_token
            this.form.sync_frequency = interfaceinfo.sync_frequency
          }
        }
      })
    },
    onSubmit() {
      if (this.form.pattern === '') {
        this.$message.error('请选择同步模式')
        return false
      }
      if (this.form.pattern == 1) {
        if (this.form.dbhost.length <= 0) {
          this.$message.error('请输入数据库地址')
          return false
        }
        if (this.form.dbuser.length <= 0) {
          this.$message.error('请输入数据库用户名')
          return false
        }
        if (this.form.dbpassword.length <= 0) {
          this.$message.error('请输入数据库密码')
          return false
        }
        if (this.form.dbname.length <= 0) {
          this.$message.error('请输入数据库名')
          return false
        }
      }
      if (this.form.pattern == 2) {
        if (this.form.interface_url.length <= 0) {
          this.$message.error('请输入接口地址')
          return false
        }
        if (this.form.interface_token.length <= 0) {
          this.$message.error('请输入密钥')
          return false
        }
      }
      if (this.form.pattern == 3) {
        if (this.form.allow_ip.length <= 0) {
          this.$message.error('请输入可访问IP地址')
          return false
        }
        if (this.form.allow_token.length <= 0) {
          this.$message.error('请输入密钥')
          return false
        }
      }
      if (this.form.sync_frequency === '') {
        this.$message.error('请选择同步频率')
        return false
      }

      saveInterface(this.form).then(response => {
        if (response.data.state == 0) {
          this.$message.error(response.data.msg)
          return false
        } else {
          var interfaceinfo = response.data.data.interfaceinfo
          if (interfaceinfo != null && interfaceinfo.length > 0) {
            this.form.id = interfaceinfo.id
            this.form.pattern = interfaceinfo.pattern
            this.form.dbhost = interfaceinfo.dbhost
            this.form.dbuser = interfaceinfo.dbuser
            this.form.dbpassword = interfaceinfo.dbpassword
            this.form.dbname = interfaceinfo.dbname
            this.form.interface_url = interfaceinfo.interface_url
            this.form.interface_token = interfaceinfo.interface_token
            this.form.allow_ip = interfaceinfo.allow_ip
            this.form.allow_token = interfaceinfo.allow_token
            this.form.sync_frequency = interfaceinfo.sync_frequency
          }
          this.$message({ message: '提交成功', type: 'success' })
        }
      })
    }
  }
}
</script>

<style rel="stylesheet/css" lang="scss" scoped>
.information {
  border: 1px #dcdfe6 solid;
  padding: 30px 20px 30px 20px;

  .border {
    border-bottom: 1px #dcdfe6 solid;
    margin: 0px 0 20px 0;
  }
}

.edit_separater {
  border-top: 1px solid rgb(233, 233, 233);
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>

<style>
.sign-and-weigh-box .sign-and-weigh-box-patients .cell {
  font-size: 12px;
}

.sign-and-weigh-box .sign-and-weigh-box-patients .current-row > td {
  background: #6fb5fa;
}

.count {
  color: #bd2c00;
}

.el-table td,
.el-table th.is-leaf,
.el-table--border,
.el-table--group {
  border-color: #d0d3da;
}

.el-table--border::after,
.el-table--group::after,
.el-table::before {
  background-color: #d0d3da;
}
</style>
