platformFront/src/components/recordManager/showRecord.vue

<template>
    <div>
        <crumbs :title="title" :param="$route.params" linkTo="RecordManager"></crumbs>
        <div class="contents">
            <div class="content">
                <el-form ref="form" :label-position="labelPosition" label-width="125px" class="add-record-form" :model="form">
                    <el-form-item label="性别：" prop="sexType">
                        <el-select v-model="form.brbaxb"
                                   :disabled="true"
                                   placeholder="请选择"
                                   size="small">
                            <el-option
                                    v-for="item in sexType"
                                    :key="String(item.key)"
                                    :label="item.name"
                                    :value="String(item.key)">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="血型：" prop="brbaxx">
                        <el-select v-model="form.brbaxx"
                                   :disabled="true"
                                   placeholder="请选择"
                                   size="small">
                            <el-option
                                    v-for="item in bloodType"
                                    :key="String(item.key)"
                                    :label="item.name"
                                    :value="String(item.key)">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="RH型：" prop="brbarh">
                        <el-select v-model="form.brbarh"
                                   :disabled="true"
                                   placeholder="请选择"
                                   size="small">
                            <el-option
                                    v-for="item in rhType"
                                    :key="String(item.key)"
                                    :label="item.name"
                                    :value="String(item.key)">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <p class="sub-title">门（急）诊诊断：</p>
                    <el-form-item label="主要诊断：">
                        <span v-for="i in form.mjzzyzdList" class="treatments">
                            {{i.zdjbmc}}({{i.jbdmid}}),
                        </span>
                    </el-form-item>
                    <el-form-item label="其他诊断：">
                        <span v-for="i in form.mjzqtzdList" class="treatments">
                            {{i.zdjbmc}}({{i.jbdmid}}),
                        </span>
                    </el-form-item>
                    <p class="sub-title">出院诊断：</p>
                    <el-form-item label="主要诊断：" prop="zyzyzdmc">
                        <span v-for="i in form.zyzyzdList" class="treatments">
                            {{i.zdjbmc}}({{i.jbdmid}})
                        </span>
                    </el-form-item>
                    <el-form-item label="其他诊断：" prop="zyqtzdmc">
                        <span v-for="i in form.zyqtzdList" class="treatments">
                            {{i.zdjbmc}}({{i.jbdmid}})
                        </span>
                        <!--<el-input v-model="form.zyqtzdmc" placeholder="请输入次要诊断"></el-input>-->
                    </el-form-item>
                    <el-form-item label="病例记录：">
                        <el-tabs tab-position="left">
                            <el-tab-pane :label="i.bljlmc" v-for="i in form.zybljlList">
                                {{i.bljlnr}}
                            </el-tab-pane>
                        </el-tabs>
                    </el-form-item>
                    <p class="oper">
                        <el-button size="small" @click="cancel">返回</el-button>
                    </p>
                </el-form>
            </div>
        </div>
    </div>
</template>
<script type="text/javascript">
  import api from '@api/records.js';
  export default {
    name:'AddRecord',
    data(){
      return{
        // data:{},
        labelPosition:'left',
        /*zybljlList:[
          {name:'aaa',content:'333333'},
          {name:'vvv',content:'333sa'}
        ],*/
        sexType:[],
        bloodType:[],
        rhType:[],
        title:'测试病例记录维护-修改测试病例记录',
        form:{
          brbaxb:'',
          brbaxx:'',
          brbarh:'',
          mjzzdmc:'',
          zyzyzdmc:'',
          zyqtzdmc:'',
          zybljlList:[]
        },
        id:null,
      }
    },
    created(){
      let info = this.$route.params;
      this.getTypes();
      if(Object.keys(info).length>0){
        this.basyid = info.basyid;
        this.brzyid = info.brzyid;
        this.title = "测试病例记录维护-查看测试病例记录";
        this.getDetail(info.basyid,info.brzyid);
      }
    },
    methods:{
      getTypes(){
        api.getTypes().then((res)=>{
          const result = res.data;
          if(result.code==0){
            this.sexType = result.data.sexEnum;
            this.bloodType = result.data.bloodTypeEnum;
            this.rhType = result.data.rhTypeEnum;
          }else{
            this.$message({
              message:result.msg,
              type:'warning'
            });
          }
        })
      },
      getDetail(syid,zyid){
        api.getRecordDetail({basyid:syid,brzyid:zyid}).then((res)=>{
          const result = res.data;
          if(result.code==0){
            this.form = result.data;
          }else{
            this.$message({
              message:result.msg,
              type:'warning'
            });
          }
        })
      },
      cancel(){
        this.$router.push({
          name: 'RecordManager',
          params: Object.assign({}, this.$route.params)
        });
      },
    }
  }
</script>
<style lang="less">
    @import "../../less/admin.less";
    .content{
        background: #fff;
        padding: 20px 20px 50px;
        color: #545455;
        min-width: 980px;
        position: relative;
    .short-inp{
        width: 200px;
    }
    .oper{
        text-align: right;
    }
    .treatments{
    .el-input{
        width:200px;
        display: inline-block;
    }
    .el-input:first-child{
        margin-right:20px;
        &:before{
             content: '诊断名称:';
         }
    }
    .el-input:last-child:before{
        content: '诊断编码:';
    }
    }
    }

</style>