<template>
  <el-form
    ref="emailForm"
    v-loading="loading"
    :model="form"
    label-width="180px"
    size="small"
    :rules="rules"
  >
    <el-form-item label="Code: " prop="Code">
      <el-input v-model="form.Code" />
    </el-form-item>
    <el-form-item label="邮件主题（CN）" prop="EmailTopicCN">
      <el-input v-model="form.EmailTopicCN" />
    </el-form-item>
    <el-form-item label="邮件主题（EN）" prop="EmailTopic">
      <el-input v-model="form.EmailTopic" />
    </el-form-item>
    <el-form-item label="业务层级" prop="BusinessLevelEnum">
      <el-input v-model="form.BusinessLevelEnum" />
    </el-form-item>
    <el-form-item label="业务模块" prop="BusinessModuleEnum">
      <el-input v-model="form.BusinessModuleEnum" />
    </el-form-item>
    <el-form-item label="流程" prop="BusinessModuleEnum">
      <el-input v-model="form.BusinessModuleEnum" />
    </el-form-item>
    <el-form-item label="收件人" prop="BusinessModuleEnum">
      <el-input v-model="form.BusinessModuleEnum" />
    </el-form-item>
    <el-form-item label="抄送人" prop="BusinessModuleEnum">
      <el-input v-model="form.BusinessModuleEnum" />
    </el-form-item>
    <el-form-item label="加急状态" prop="BusinessModuleEnum">
      <el-input v-model="form.BusinessModuleEnum" />
    </el-form-item>
    <el-form-item label="发送周期和时间" prop="BusinessModuleEnum">
      <el-input v-model="form.BusinessModuleEnum" />
    </el-form-item>
    <el-form-item label="是否需要回执" prop="IsReturnRequired">
      <el-radio-group v-model="form.IsReturnRequired">
        <el-radio :label="true">是</el-radio>
        <el-radio :label="false">否</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="是否自动发送" prop="IsAutoSend">
      <el-radio-group v-model="form.IsAutoSend">
        <el-radio :label="true">是</el-radio>
        <el-radio :label="false">否</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="是否区分标准" prop="IsDistinguishCriteria">
      <el-radio-group v-model="form.IsDistinguishCriteria">
        <el-radio :label="true">是</el-radio>
        <el-radio :label="false">否</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="是否启用" prop="IsEnable">
      <el-radio-group v-model="form.IsEnable">
        <el-radio :label="true">是</el-radio>
        <el-radio :label="false">否</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="附件（CN）" prop="IsEnable">
      <el-upload
        class="upload-demo"
        action
        :before-upload="beforeUploadCN"
        :http-request="handleUploadFileCN"
        :on-preview="handlePreviewCN"
        :on-remove="handleRemoveFileCN"
        :show-file-list="true"
        :limit="1"
        :file-list="fileListCN"
      >
        <el-button size="small" type="primary" :disabled="fileListCN.length > 0">{{$t('common:button:upload')}}</el-button>
      </el-upload>
    </el-form-item>
    <el-form-item label="附件（EN）" prop="IsEnable">
      <el-upload
        class="upload-demo"
        action
        :before-upload="beforeUploadEN"
        :http-request="handleUploadFileEN"
        :on-preview="handlePreviewEN"
        :on-remove="handleRemoveFileEN"
        :show-file-list="true"
        :limit="1"
        :file-list="fileListEN"
      >
        <el-button size="small" type="primary" :disabled="fileListEN.length > 0">{{$t('common:button:upload')}}</el-button>
      </el-upload>
    </el-form-item>
    <el-form-item label="邮件内容模版（CN）" prop="EmailHtmlContentCN">
      <el-input
        v-model="EmailHtmlContentCN"
        type="textarea"
        :autosize="{ minRows: 1, maxRows: 4}"
      />
    </el-form-item>
    <el-form-item label="邮件内容模版（EN）" prop="EmailHtmlContentCN">
      <el-input
        v-model="EmailHtmlContentCN"
        type="textarea"
        :autosize="{ minRows: 1, maxRows: 4}"
      />
    </el-form-item>
    <div class="base-dialog-footer" style="text-align:right;margin-top:10px;">
      <el-form-item style="text-align:right;">
        <el-button size="small" type="primary" @click="handleSave">Save</el-button>
      </el-form-item>
    </div>
  </el-form>
</template>
<script>
import { Upload } from '@/api/dictionary'
export default {
  props: {
    data: {
      type: Object,
      default() { return {} }
    }
  },

  data() {
    return {
      form: {
        Id: '',
        Code: '',
        // AuthorizationCode: '',
        BusinessScenarioEnum: null,
        IsDistinguishCriteria: true,
        // Title: '',
        // Body: '',
        // FromEmail: '',
        // ReceiveEmail: '',
        // CopyEmail: '',
        IsReturnRequired: true,
        IsUrgent: true,
        IsEnable: true,
        IsAutoSend: true
      },
      rules: {
        Code: [{ required: true, message: 'Please select', trigger: ['blur'] }],
        BusinessScenarioEnum: [{ required: true, message: 'Please select', trigger: ['blur'] }]
      },
      scenarioOption: [],
      fileListCN: [],
      fileListEN: [],
      loading: false
    }
  },
  mounted() {
    this.initForm()
  },
  methods: {
    handleRemoveFileCN() {
      this.form.FileName = null
      this.form.Path = null
      this.fileList = []
    },
    beforeUploadCN() {
      if (this.fileList.length > 0) {
        this.$alert('最多只能传一个附件')
        return
      }
    },
    handlePreviewCN(row, r2) {
      if (row.fullPath) {
        window.open(row.fullPath, '_blank')
      }
    },
    handleUploadFileCN(param) {
      this.btnLoading = true
      const formData = new FormData()
      formData.append('file', param.file)
      this.form.FileName = param.file.name
      Upload(formData, 3).then(res => {
        this.form.Path = res.Result.FilePath
        this.btnLoading = false
        this.fileList[0] = { name: param.file.name, path: res.Result.FilePath, fullPath: res.Result.FullFilePath }
      })
    },
    async initForm() {
      this.loading = true
      // await this.getScenarios()
      for (const k in this.form) {
        if (this.data.hasOwnProperty(k)) {
          this.form[k] = this.data[k]
        }
      }
      this.loading = false
    },

    // 保存
    handleSave() {
      this.$refs.emailForm.validate(valid => {
        if (!valid) return
        this.loading = true
        addOrUpdateEmailNoticeConfigList(this.form).then(res => {
          this.loading = false
          this.$emit('closeDialog')
          this.$emit('getList')
          this.$message.success('Saved successfully')
        }).catch(() => {
          this.loading = false
        })
      })
    }
  }
}
</script>
