<!-- 免责声明修改 By_liucf -->
<template>
  <div>
    <crumbs :title="topInfo" :param="$route.params" linkTo="DisclaimerCDSS"></crumbs>
    <div class="contents">
      <el-form
        ref="form"
        :label-position="labelPosition"
        :model="form"
        :rules="rules"
        label-width="65px"
        class="add-discl-form"
      >
        <el-form-item label="标题：" prop="title" class="discl-title">
          <el-input v-model="form.title" placeholder="请输入标题" maxlength="30"></el-input>
        </el-form-item>
        <el-form-item label="内容：" prop="description" class="discDesc">
          <el-input
            type="textarea"
            :rows="3"
            placeholder="请输入内容述"
            v-model="form.description"
            maxlength="1024"
          ></el-input>
        </el-form-item>
        <el-form-item label="归属：" prop="disclaimerCode">
          <el-select v-model="form.disclaimerCode" clearable placeholder="请选择">
            <el-option v-for="item in options" :key="item.key" :label="item.name" :value="item.key"></el-option>
          </el-select>
        </el-form-item>
        <el-button
          class="disclButn"
          size="small"
          :disabled="saveDisable"
          type="primary"
          @click="addDiscl"
        >{{text}}</el-button>
      </el-form>
    </div>
  </div>
</template>

<script>
import api from '@api/cdss.js';
export default {
  name: 'AddDisclaimerCDSS',
  data() {
    const titleVaild = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('请输入标题'));
      }
      if (value.length >= 30) {
        this.form.name = value.substr(0, 30);
        this.$message({
          showClose: true,
          type: 'warning',
          message: '标题已超过最大字数限制'
        });
      }
      callback();
    };
    const descVaild = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('请输入内容'));
      }
      if (value.length >= 1024) {
        this.form.name = value.substr(0, 1024);
        this.$message({
          showClose: true,
          type: 'warning',
          message: '内容已超过最大字数限制'
        });
      }
      callback();
    };
    const disclVaild = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('请选择归属'));
      }
      callback();
    };
    return {
      id: null,
      labelPosition: 'right',
      options: [],
      form: {
        title: '',
        description: '', //内容
        disclaimerCode: '' //归属
      },
      rules: {
        title: [
          { required: true, validator: titleVaild, trigger: ['change'] },
          { required: true, message: '请输入标题', trigger: ['blur', 'change'] }
        ],
        description: [
          { required: true, validator: descVaild, trigger: ['change'] },
          { required: true, message: '请输入内容', trigger: ['blur', 'change'] }
        ],
        disclaimerCode: [
          {
            required: true,
            validator: disclVaild,
            trigger: ['blur', 'change']
          },
          { required: true, message: '请选择归属', trigger: ['blur', 'change'] }
        ]
      },
      text: '确定添加',
      topInfo: '免责声明维护-添加免责声明',
      toast: '添加成功',
      saveDisable: false
    };
  },
  created() {
    // const params = JSON.parse(localStorage.getItem('knowledgeEnumsData'));
    // this.options = params.disclaimerCodeEnum;
    // api.getKlmEnumsDataCDSS().then(res => {
    //   console.log(res, '===========');
    //   if (res.data.code === '0') {
    //     this.options = res.data.data.disclaimerCodeAllEnum;
    //   }
    // });
    // 修改
    // console.log(this.$route.params, 'this.$route.params');
    this.options = this.$route.params.options
    const data = this.$route.params.info;

    if (data) {
      this.id = data.id;
      this.text = '确定修改';
      this.topInfo = '免责声明维护-修改';
      this.toast = '修改成功';
      this.form.title = data.title;
      this.form.description = data.description;
      this.form.disclaimerCode = +data.disclaimerCode;
      
    }
  },
  methods: {
    addDiscl() {
      this.$refs.form.validate(valid => {
        if (valid) {
          // 过滤空格
          if (!this.form.title.trim() || !this.form.description.trim()) {
            this.$message({
              message: '必填项不能为空',
              type: 'warning'
            });
            return;
          }
          // 有id是修改，没有id是添加
          if (this.id) {
            let code = this.form.disclaimerCode;
            // 修改没有操作时 code为字符串，需转成code
            if (typeof code == 'string') {
              for (let i in this.options) {
                if (this.options[i].name == code) {
                  code = this.options[i].key;
                }
              }
            }
            let param = {
              id: this.id,
              title: this.form.title.trim(),
              description: this.form.description.trim(),
              disclaimerCode: code
            };
            this.saveDisable = true; //提交保存按钮不可点击，返回结果时才可点击，防止频繁发送请求
            api
              .updateDisclaimerInformationsCDSS(param)
              .then(res => {
                if (res.data.code == '0') {
                  this.$message({
                    showClose: true,
                    message: this.toast,
                    type: 'success'
                  });
                  this.$router.push({
                    name: 'DisclaimerCDSS',
                    params: Object.assign({}, this.$route.params, {
                      currentPage: 1
                    })
                  });
                } else {
                  this.$message({
                    showClose: true,
                    message: res.data.msg,
                    type: 'warning'
                  });
                }
                this.saveDisable = false;
              })
              .catch(error => {
                this.$message({
                  showClose: true,
                  message: '服务器正忙...',
                  type: 'warning'
                });
              });
          } else {
            let param = {
              title: this.form.title.trim(),
              description: this.form.description.trim(),
              disclaimerCode: this.form.disclaimerCode
            };
            this.saveDisable = true; //提交保存按钮不可点击，返回结果时才可点击，防止频繁发送请求
            api
              .addDisclaimerInfosCDSS(param)
              .then(res => {
                if (res.data.code == '0') {
                  this.$message({
                    showClose: true,
                    message: this.toast,
                    type: 'success'
                  });
                  this.$router.push({
                    name: 'DisclaimerCDSS',
                    params: Object.assign({}, this.$route.params, {
                      currentPage: 1
                    })
                  });
                } else {
                  this.$message({
                    showClose: true,
                    message: res.data.msg,
                    type: 'warning'
                  });
                }
                this.saveDisable = false;
              })
              .catch(error => {
                this.$message({
                  showClose: true,
                  message: '服务器正忙...',
                  type: 'warning'
                });
              });
          }
        }
      });
    },
    back() {
      this.$router.go(-1);
    }
  }
};
</script>

<style lang="less" >
@import '../../../less/admin.less';

.add-discl-form {
  background: #fff;
  padding: 20px 20px 30px;
  .discl-title {
    width: 500px;
  }
}

// .el-button{
.disclButn {
  margin: 30px 0 0 20px;
}

.discDesc {
  // .el-textarea{
  //   width: 97%;
  // }
  margin-top: 10px;
  margin-bottom: 25px;
  .el-form-item__error {
    top: 70px;
  }
}
</style>