<template>
    <div>
        <crumbs :title="title" :param="$route.params" linkTo="StandardRecord"></crumbs>
        <div class="contents">
            <div class="content">
            <el-form ref="form" :label-position="labelPosition" label-width="125px" :model="form" :rules="rules">
                <el-form-item label="所属医院：" prop="hospitalId">
                    <el-select v-model="form.hospitalId"
                               placeholder="请选择"
                               size="small">
                        <el-option
                                v-for="item in hisTypes"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="病人住院序号：" prop="behospitalCode">
                    <el-input size="mini" v-model.trim="form.behospitalCode" placeholder="病人住院序号" clearable style="width: 200px;"></el-input>
                    <el-button size="mini" @click="searchList" style="margin-left: 20px;height: 30px;">搜索</el-button>
                </el-form-item>
                <div>
                    <el-table
                    :data="medicalRecordlist"
                    border
                    style="width: 100%">
                <!--<el-table-column
                        :resizable = "false"
                        label="所属医院"
                        prop="hospitalName"
                        >
                </el-table-column>-->
                <el-table-column
                        :resizable = "false"
                        prop="behospitalCode"
                        label="病人住院序号"
                        width="180">
                </el-table-column>
                <el-table-column
                        :resizable = "false"
                        prop="name"
                        label="病人姓名">
                </el-table-column>
                <el-table-column
                        :resizable = "false"
                        prop="sex"
                        label="性别">
                </el-table-column>
                </el-table-column>
                <el-table-column
                        :resizable = "false"
                        prop="behospitalDate"
                        :formatter="dateFormatter"
                        label="入院日期">
                </el-table-column>
                <el-table-column
                        :resizable = "false"
                        prop="leaveHospitalDate"
                        :formatter="dateFormatter"
                        label="出院日期">
                </el-table-column>
                <!--<el-table-column
                        :resizable = "false"
                        prop="gmtModified"
                        :formatter="dateFormatter"
                        label="加入时间">
                </el-table-column>-->
            </el-table>
                </div>
                <el-button class="disclButn" size="small" type="primary" :disabled = 'saveDisable' @click="comfirn">确定</el-button>
            </el-form>
        </div>
        </div>
    </div>
</template>
<script type="text/javascript">
  import api from '@api/qualityControl.js';
  export default {
    name:'AddStandardRecord',
    data(){
      return{
        // data:{},
        list:[],
        medicalRecordlist:[],
        labelPosition:'left',
        isFirst:true,
        title:'标准病历-新增',
        casesEIds:'',
        form:{
          hospitalId:"",
          behospitalCode:"", //病人住院序号
        },
        id:null,
        rules:{
          hospitalId:{ required: true, message: '请选择所属医院', trigger: ['blur', 'change']},
          behospitalCode:{ required: true, message: '请输入病人住院序号', trigger: ['blur', 'change']},
          /*name:[{ required: true, message: '请输入显示名称',trigger: ['blur', 'change'] }],*/
        },
        copy:null,
        saveDisable: true,  //保存按钮禁止点击
        flawList:[],
        hisTypes:[],
      }
    },
    created(){
      let {hisTypes} = this.$route.params;
      if(!hisTypes){
        this.getHisTypes();
        return;
      }
      this.hisTypes = hisTypes;
    },
    watch:{
    },
    methods:{
      getHisTypes(){
        api.getRecordHopitalList().then((res)=>{
          if(res.data.code==="0"){
            const data = res.data.data;
            this.hisTypes =data;
          }else{
            this.warning("获取医院列表失败");
          }
        });
      },
      dateFormatter(item,prop,it){
        return it.substr(0,10);
      },
      searchList(){
        const { hospitalId, behospitalCode } = this.form;
        if(!hospitalId){
          this.warning("请选择所属医院");
          return
        }
        if(!behospitalCode){
          this.warning("请输入病人住院序号");
          return
        }
        const param={ hospitalId, behospitalCode };
        api.findStdRecord(param).then((res)=>{
          if(res.data.code==="0") {
            const data = res.data.data;
            this.medicalRecordlist = [data];
            if(data.status===1){
              this.saveDisable=true;
              this.warning("病历此前已被添加");
            }else{
              this.saveDisable=false;
            }
          }else{
            this.medicalRecordlist = [];
            this.saveDisable=true;
            this.warning(res.data.msg);
          }
        });
      },
      comfirn(){
        const {hospitalId,behospitalCode} = this.form;
        const params = Object.assign({},this.form);
        this.saveDisable = true;  //提交保存按钮不可点击，返回结果时才可点击，防止频繁发送请求
        api.updateStdRecord(params).then((res)=>{
          if(res.data.code==0){
            this.$message({
              message:"添加成功",
              type:'success'
            });
            this.$router.push({name: 'StandardRecord'});
          }else{
            this.$message({
              message:res.data.msg,
              type:'warning'
            });
          }
          this.saveDisable = false;
        })
      },
      warning(msg, type,time) {
          this.$message({
              showClose: true,
              message: msg,
              type: type || 'warning',
              duration:time || '3000'
          })
      },
    }
  }
</script>
<style>
    .content .el-form-item.is-success .el-input__inner{
        border-color: #ccc;
    }
    .content .el-form-item.is-success .el-input__inner:focus{
        border-color: #48C5D7;
    }
</style>
<style lang="less" scoped>
    .content {
        background: #fff;
        padding: 20px 20px 80px;
        color: #545455;
        min-width: 980px;
        position: relative;
        .el-checkbox{
            display: inline-block;
        }
    }
    /deep/.el-input{
              .el-input__inner{
                    height: 30px;
                    line-height: 30px;
                  width: 200px;
              }
            }
    .el-form-item{
        width: 600px;
    }
    .el-select.big-select{
        width: 360px;
    }
    .disclButn{
        left: 49%;
        bottom: 20px;
    }
    .el-button.is-disabled, .el-button.is-disabled:focus, .el-button.is-disabled:hover{
        color: #fff;
    }
</style>