<!--资质管理新增弹窗-->
<template>
  <el-dialog
    :title="title"
    width="440px"
    :visible.sync="isShowInfo"
    append-to-body
    @close="close"
  >
    <el-form :inline="true" :model="cerInfo" class="demo-form-inline" :rules="rules" label-width="115px">
      <div class="item">
        <el-form-item label="资质要求名称:" prop="qualifyName">
          <el-input v-model="cerInfo.qualifyName" style="width:250px" />
        </el-form-item>
      </div>
      <div class="item">
        <el-form-item label="资质要求描述:" prop="qualifyDesc">
          <el-input v-model="cerInfo.qualifyDesc" style="width:250px" />
        </el-form-item>
      </div>
      <div class="item">
        <el-form-item label="资质要求证明材料要求:" prop="proveMaterialDesc">
          <el-input v-model="cerInfo.proveMaterialDesc" style="width:250px;" />
        </el-form-item>
      </div>
      <div class="item">
        <el-form-item label="备注:">
          <el-input
            v-model="cerInfo.remark"
            style="width:250px"
            type="textarea"
            :rows="3"
            placeholder="请输入内容"
          />
        </el-form-item>
      </div>
      <div class="item">
        <el-form-item class="btnBOX">
          <el-button type="primary" @click="save">
            保存
          </el-button>
          <el-button type="info" style="margin-left:100px" @click="close">
            取消
          </el-button>
        </el-form-item>
      </div>
    </el-form>
  </el-dialog>
</template>

<script>
// import dialogHeader from "./dialogHeader.vue";
// import inputVue from "../input/inputVue.vue";
// import InputNumber from "../input/inputNumber.vue";
// import RedStar from "../redStar.vue";
// import { Message } from 'element-ui'
// import { C_add,C_list,C_update,detail } from "../../../api/product/category"
// import { getCertification } from '../../../api/systemNew/systemNew'
import { add, update } from '../../../../api/system/certification'
export default {
  components: {
    // inputVue,
    // dialogHeader,
    // InputNumber,
    // RedStar,
    // Message
  },
  props: {
    isShowInfo: {
      type: Boolean,
      default: true
    },
    dataInfo: {
      type: Object
    },
    title: ''
  },
  data() {
    return {
      // 品类信息
      cerInfo: {
        qualifyName: '',
        qualifyDesc: '',
        proveMaterialDesc: '',
        remark: ''
      },
      categoryList: [],
      // 资质列表
      certificationList: [],

      rules: {
        empty: [
          { required: true, message: '此内容不能为空', trigger: 'blur' }
        ],
        qualifyDesc: [
          { required: true, message: '此内容不能为空', trigger: 'blur' }
        ],
        proveMaterialDesc: [
          { required: true, message: '此内容不能为空', trigger: 'blur' }
        ]
      }
    }
  },
  watch: {
    dataInfo: {
      handler(vla) {
        if (vla != '') {
          // 编辑操作
          if (!vla.id) return
          this.cerInfo.id = vla.id
          this.cerInfo.qualifyName = vla.qualifyName
          this.cerInfo.qualifyDesc = vla.qualifyDesc
          this.cerInfo.proveMaterialDesc = vla.proveMaterialDesc
          this.cerInfo.remark = vla.remark
        } else {
          this.resetData()
        }
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
    // C_list().then((res) => {
    //   this.categoryList = res;
    // });
    // getCertification().then((res) => {
    //   console.log(res);
    //   this.certificationList = res;
    // });
  },
  methods: {
    close() {
      this.$emit('close')
      // 重置数据
      // this.resetData()
    },
    // 数据处理
    save() {
      if (this.title == '新增资质要求') {
        add(this.cerInfo).then((res) => {
          console.log(res, res != '')
          if (res != '') {
            this.$message({
              message: '保存成功',
              type: 'success'
            })
            this.close()
            // 保存后刷新数据
            this.$emit('refresh')
          }
        })
      } else {
        update(this.cerInfo).then((res) => {
          if (res != '') {
            this.$message({
              message: '更新成功',
              type: 'success'
            })
            this.close()
            // 保存后刷新数据
            this.$emit('refresh')
          }
        })
      }
    },
    resetData() {
      this.cerInfo = {
        qualifyName: '',
        qualifyDesc: '',
        proveMaterialDesc: '',
        remark: ''
      }
    }
  }
}
</script>

<style lang="scss" scoped>

.btnBOX{
    display: flex;
    justify-content: space-between;
}
.categoryDialog {
  width: 800px;
  box-sizing: border-box;
  .content {
    padding: 10px;
    display: flex;
    justify-content: space-between;

    .inputContent {
      flex: 1;
      padding: 0 10px;
      box-sizing: border-box;
      .inputbox {
        margin-bottom: 15px;
        display: flex;
        align-items: center;
      }
    }
  }

  .AddContent {
    max-height: 180px;
    overflow: auto;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid #999;
    padding: 10px;

    .addBtn {
      margin-bottom: 10px;
    }

    .addItem {
      display: flex;

      .item {
        padding-right: 10px;
        display: flex;
        align-items: center;

         .label,.el-form-item.el-form-item__label{
             line-height: 21px !important;
                line-height:NONE
        }
      }
    }
  }

  .btnBox {
    padding: 30px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-evenly;

    .save,
    .close {
      width: 100px;
    }
  }
}
</style>