<!--
  @description: 新增短信配置/编辑短信配置
  @Modifier: 苏志刚
  @routerPath:
  @date: 2020/8/18-15:50
-->
<template>
  <el-dialog
    v-dialogDrag
    :visible.sync="dialogData.dialog"
    :close-on-click-modal="false"
    :title="title"
    custom-class="el-dialog__body-p0"
    top="calc((100vh - 611px) / 2)"
  >
    <section class="main">
      <!-- 表单 -->
      <el-form ref="formData" :model="formData" :rules="rules" style="margin-right:50px;" label-width="150px" class="demo-ruleForm">
        <el-row>
          <el-col :span="24">
            <!-- 分类 -->
            <el-form-item label="分类" prop="category">
              <el-select v-model="formData.category" placeholder="请选择">
                <el-option
                  v-for="(item,index) in categoryList"
                  :key="index"
                  :label="item.typename"
                  :value="item.typecode"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 使用状态 -->
            <el-form-item label="使用状态" prop="useStatus">
              <el-radio-group v-model="formData.useStatus">
                <el-radio v-for="(item,index) in useStatusList" :key="index" :label="item.typecode">
                  {{ item.typename }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 资源编号 -->
            <el-form-item label="资源编号" prop="smsCode">
              <el-input v-model="formData.smsCode" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 资源地址 -->
            <el-form-item label="资源地址" prop="resourceAddress">
              <el-input v-model="formData.resourceAddress" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 短信签名 -->
            <el-form-item label="短信签名" prop="signName">
              <el-input v-model="formData.signName" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 通道组编号 -->
            <el-form-item label="通道组编号" prop="accessKey">
              <el-input v-model="formData.accessKey" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 接口密匙 -->
            <el-form-item label="接口密匙" prop="secretKey">
              <el-input v-model="formData.secretKey" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 版本号 -->
            <el-form-item label="模板ID" prop="template">
              <el-input v-model="formData.template" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 备注 -->
            <el-form-item label="备注" prop="remark">
              <el-input
                v-model="formData.remark"
                :autosize="{ minRows: 4, maxRows: 4 }"
                type="textarea"
                maxlength="1000"
                show-word-limit
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </section>
    <!--底部操作按钮-->
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="ensure('formData')">提 交</el-button>
      <el-button @click="dialogData.dialog = false">取 消</el-button>
    </span>
  </el-dialog>
</template>

<script>
/* 公共参数mixin*/
import { procurementSmsMaintainGrounpMixins } from '../mixins/procurementSmsMaintainGrounpMixins'
/* 接口 */
import { addSmsConfig, querySmsConfigById } from '@/api/procurement/procurementCommonTools.js'

export default {
  name: 'SmsAddDialog',
  mixins: [procurementSmsMaintainGrounpMixins],
  props: {
    // 弹框展示状态
    dialogData: {
      type: Object,
      default: function() {

      }
    }
  },
  data() {
    return {
      title: '新增短信配置', // 弹框标题
      formData: {
        id: '', // 主键id
        useStatus: '00', // 使用状态 00停用；01启用
        remark: '', // 备注
        accessKey: '', // 通道组编号
        category: '00', // 分类 配置字典表 00启瑞云 01阿里云 02七牛云 03腾讯云 04云片 （目前只对接了启瑞云）
        resourceAddress: '', // 资源地址
        secretKey: '', // 接口密匙
        signName: '', // 短信签名
        smsCode: '', // 资源编号
        template: '' // 模板ID(启瑞云这里是短信内容发送信息)
      },
      rules: {
        useStatus: [{ required: true, message: '必填', trigger: 'blur' }], // 使用状态
        category: [{ required: true, message: '必填', trigger: 'blur' }], // 分类
        accessKey: [{ required: true, message: '不能为空', trigger: 'blur' }], // 通道组编号
        signName: [{ required: true, message: '不能为空', trigger: 'blur' }], // 短信签名
        secretKey: [{ required: true, message: '不能为空', trigger: 'blur' }], // 接口密匙
        resourceAddress: [{ required: true, message: '不能为空', trigger: 'blur' }], // 资源地址
        template: [{ required: true, message: '不能为空', trigger: 'blur' }], // 模板ID
        smsCode: [{ required: true, message: '不能为空', trigger: 'blur' }] // 资源编号
      }
    }
  },
  mounted() {
    this.watchDialog()
  },
  methods: {
    // 获取详情
    getTemplateLibraryById(id) {
      querySmsConfigById(id).then(res => {
        if (res.header.ret === '0') {
          this.formData = { ...res.data }
        }
      })
    },
    // 提交
    ensure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          addSmsConfig(this.formData).then(res => {
            if (res.header.ret === '0') {
              this.dialogData.dialog = false
              this.$emit('watchChild', true)
            }
          })
        } else {
          return false
        }
      })
    },
    // 监听dialog
    watchDialog() {
      if (this.dialogData.dialog) {
        // 弹框已打开
        if (this.dialogData.type === '01') { // 01编辑；00新增
          this.title = '编辑短信配置'
          this.getTemplateLibraryById(this.dialogData.id)
        } else {
          this.title = '新增短信配置'
        }
      }
    }
  }
}
</script>

<style scoped lang="less">

</style>

