Vue_New/src/xt_pages/user/lapsoSummary.vue

<template>
    <div class="patient-container">
      <patient-sidebar :id="patientID" defaultActive="1-12" v-on:tran-patient="onTranPatient"></patient-sidebar>
      <div class="patient-app-container advice-container app-container">
        <div style="display:flex;justify-content: space-between;align-items: center;margin-bottom: 12px;">
           <span style="font-weight:bold;">转归记录列表</span>
           <el-button size="medium" type="primary" @click="dialogVisible =true">新增</el-button>
        </div>
        <el-table class="oictable" :data="tableData" border style="width:100%">
        <el-table-column prop="start_time" label="转出日期" align="center">
            <template slot-scope="scope">
              <span>{{ getTime(scope.row.record_date)}}</span>
            </template>
       </el-table-column>
        <el-table-column prop="blood_access_part_opera_id" label="转归类型" align="center">
          <template slot-scope="scope">
             <span v-if="scope.row.lapse_type == 1">转出</span>
             <span v-if="scope.row.lapse_type == 2">院内转诊</span>
          </template>
       </el-table-column>
       <el-table-column prop="blood_access_part_id" label="转归分类" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.lapse_class == 1">终止透析</span>
            <span v-if="scope.row.lapse_class == 2">转出院外</span>
            <span v-if="scope.row.lapse_class == 3">回居住地透析</span>
            <span v-if="scope.row.lapse_class == 4">临时透析</span>
            <span v-if="scope.row.lapse_class == 5">转腹膜透析</span>
            <span v-if="scope.row.lapse_class == 6">其他</span>
            <span v-if="scope.row.lapse_class == 7">变更透析医院</span>
          </template>
       </el-table-column>
        <el-table-column prop="inflow_pass" label="转归原因"  align="center">
           <template slot-scope="scope">
              {{ scope.row.lapse_reason }}
           </template>
        </el-table-column>
       
       
         <el-table-column prop="date" label="备注" align="center">
            <template slot-scope="scope">
              {{ scope.row.remark }}
            </template>
         </el-table-column>
        
         <el-table-column prop="date" label="操作" align="center">
            <template slot-scope="scope">
               <el-tooltip class="item" effect="dark" content="编辑" placement="top">
                 <el-button
                    type="primary"
                    size="small"
                    icon="el-icon-edit-outline"
                   
                    @click="handleUpdateAdviceTemplate(scope.row.id)"
                    >
                 </el-button>
               </el-tooltip>
                <el-tooltip class="item" effect="dark" content="删除" placement="top">
                   <el-button
                    size="small"
                    type="danger"
                    icon="el-icon-delete"
                    @click="handleDeleteAdviceTemplate(scope.row.id, scope.$index)"
                    >
                   </el-button>
                </el-tooltip>
             </template>
        </el-table-column>
        </el-table>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="[10,20,50,100]"
          :page-size="10"
          background
          style="margin-top:20px;"
          align="right"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"></el-pagination>
  
        <el-dialog
            title="新增"
            :visible.sync="dialogVisible"
            width="65%"
            center>
          <el-form label-width="150px" :model="form" ref="form" :rules="rules" >
            <el-row  :gutter="24">
              <el-col :span="24">
                <el-form-item label="透析号:" >
                    <el-input style="width:200px" v-model="dialysis_no" :disabled="true"></el-input>
                </el-form-item>
                
              </el-col>
            </el-row>
            <el-row  :gutter="24" >
              <el-col :span="24">
                 <el-form-item  label="姓名:">
                    <el-input style="width:200px" v-model="name" :disabled="true"></el-input>
                 </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转归类型:"> 
                        <el-radio-group style="padding: 10px;" v-model="lapse_type">
                            <el-radio  label="1">转出</el-radio>
                            <el-radio  label="2">院内转诊</el-radio>
                      </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转归分类:"> 
                        <el-radio-group style="padding: 10px;" v-model="lapse_class">
                            <el-radio  label="1">终止透析</el-radio>
                            <el-radio  label="2">转出院外</el-radio>
                            <el-radio  label="3">回居住地透析</el-radio>
                            <el-radio  label="4">临时透析</el-radio>
                            <el-radio  label="5">转腹膜透析</el-radio>
                            <el-radio  label="6">其他</el-radio>
                            <el-radio  label="7">变更透析医院</el-radio>
                      </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转出原因:"> 
                        <el-input style="width: 300px;height: 50px;"  type="textarea" v-model="lapse_reason"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转出日期:"> 
                        <el-date-picker
                            v-model="record_date"
                            type="date"
                             value-format="yyyy-MM-dd"
                            placeholder="选择日期">
                         </el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="操作人:"> 
                        <el-select v-model="admin_user_id" placeholder="请选择">
                            <el-option
                            v-for="item in adminUserList"
                            :key="item.admin_user_id"
                            :label="item.user_name"
                            :value="item.admin_user_id">
                            </el-option>
                         </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="备注:"> 
                        <el-input style="width: 300px;height: 50px;" type="textarea" v-model="remark"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
           
          </el-form>
  
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="savePatientLapse('form')">保存</el-button>
        </span>
        </el-dialog>



        <el-dialog
            title="编辑"
            :visible.sync="editDialogVisible"
            width="65%"
            center>
          <el-form label-width="150px" :model="form" ref="form" :rules="rules" >
            <el-row  :gutter="24">
              <el-col :span="24">
                <el-form-item label="透析号:" >
                    <el-input style="width:200px" v-model="dialysis_no" :disabled="true"></el-input>
                </el-form-item>
                
              </el-col>
            </el-row>
            <el-row  :gutter="24" >
              <el-col :span="24">
                 <el-form-item  label="姓名:">
                    <el-input style="width:200px" v-model="name" :disabled="true"></el-input>
                 </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转归类型:"> 
                        <el-radio-group style="padding: 10px;" v-model="lapse_type">
                            <el-radio  label="1">转出</el-radio>
                            <el-radio  label="2">院内转诊</el-radio>
                      </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转归分类:"> 
                        <el-radio-group style="padding: 10px;" v-model="lapse_class">
                            <el-radio  label="1">终止透析</el-radio>
                            <el-radio  label="2">转出院外</el-radio>
                            <el-radio  label="3">回居住地透析</el-radio>
                            <el-radio  label="4">临时透析</el-radio>
                            <el-radio  label="5">转腹膜透析</el-radio>
                            <el-radio  label="6">其他</el-radio>
                            <el-radio  label="7">变更透析医院</el-radio>
                      </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转出原因:"> 
                        <el-input style="width: 300px;height: 50px;"  type="textarea" v-model="lapse_reason"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="转出日期:"> 
                        <el-date-picker
                            v-model="record_date"
                            type="date"
                             value-format="yyyy-MM-dd"
                            placeholder="选择日期">
                         </el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="操作人:"> 
                        <el-select v-model="admin_user_id" placeholder="请选择">
                            <el-option
                            v-for="item in adminUserList"
                            :key="item.admin_user_id"
                            :label="item.user_name"
                            :value="item.admin_user_id">
                            </el-option>
                         </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="24">
                <el-col :span="24">
                    <el-form-item label="备注:"> 
                        <el-input style="width: 300px;height: 50px;" type="textarea" v-model="remark"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
           
          </el-form>
  
        <span slot="footer" class="dialog-footer">
            <el-button @click="editDialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="updatePatientLapse('form')">保存</el-button>
        </span>
        </el-dialog>
  
      </div>
      
    </div>
  </template>
  <script>
    const moment = require('moment')
    import PatientSidebar from './components/PatientSidebar'
    import { savePatientLapse,getAllDoctor,deletePatientLapsoRrecord,getPatientById,getPatientLapseRecord,getPatientLapsoSummary,updatePatientLapseRecord} from '@/api/patient'
  
    import { jsGetAge, uParseTime } from '@/utils/tools'
    import { getDataConfig } from '@/utils/data'
    import multiSelectBox from '../dialysis/details/dialog/MultiSelectBox'
    import sitemap from './Sitemap'
    export default {
      name: 'doctorAdvice',
      components: {
        PatientSidebar,
        multiSelectBox,
        sitemap
      },
      data() {
        return {
          tableData: [],
          nowtime: moment(new Date()).format('YYYY-MM-DD'),
          page: 1,
          limit: 10,
          total: 0,
          rules: {
            start_time: [{ required: true, message: '请输入建立日期' }],
            access_project: [{ required: true, message: '请选择通路项目' }],
            blood_access_part_opera_id:[{required:true,message:'请选择血管通路类型'}],
            blood_access_part_id:[{required:true,message:"请选择血管通路"}],
           //  first_start_time:[{required:true,message:"请选择首次启用日期"}],
            user_status:[{required:true,message:"请选择使用状态"}]
          },
          dialogVisible:false,
          editDialogVisible:false,

          form:{
           id:0,
           access_project:"1",
           blood_access_part_id:"",
           blood_access_part_opera_id:"",
           inflow_pass:"",
           start_time:moment(new Date()).format('YYYY-MM-DD'),
           first_start_time:moment(new Date()).format('YYYY-MM-DD'),
           stop_reason:"",
           user_status:1,
           remark:"",
           stop_time:"",
           other_vascular:"",
           ci_type:"",//导管感染转归
           blood_cultupe:"", //血培养检查结果
           sequelae_type:"",//患者导管转归类型
          },
          options:[
           {id:1,name:"启用"},
           {id:2,name:"停用"},
           {id:3,name:"备用"}
          ],
          optionsPass:[
            {id:1,name:"流入-动脉"},
            {id:2,name:"流出-静脉"},
          ],
  
          blood_access_part_opera:[],
          blood_access_part:[],
          show:false,
          doctorList:[],
          InnerDialogProps: {
            values: [],
            visibility: false,
            isShowTextArea: true,
            customContent: '',
            titles: '',
            type: '' // 不同弹框类型，用来匹配数据
          },
          new_blood_access_part_opera:[],
          new_blood_access_part:[],
         // 导管感染类型
          optionsOne:[
             {id:1,name:"局部感染"},
             {id:2,name:"静脉炎"},
             {id:3,name:"导管细菌定植"},
             {id:4,name:"导管相关血型感染"},
          ],
        //   导管转归类型
          optionsTwo:[
             {id:1,name:"拔管"},
             {id:2,name:"治愈"},
             {id:3,name:"死亡"},
             {id:4,name:"放弃"},
             {id:9,name:"其它"},
          ],
        //  血培养检查结果
          optionsThree:[
             {id:0,name:"阴性"},
             {id:1,name:"阳性"},
             {id:9,name:"未查"}
          ],
          showOne:false,
          name:"",
          dialysis_no:"",
          lapse_type:"1",
          lapse_class:"1",
          lapse_reason:"",
          record_date:"",
          remark:"",
          adminUserList:[],
          limit:10,
          page:1,
          total:0,
          id:0,
          admin_user_id:this.$store.getters.xt_user.user.id
        }
      },
      methods: {
        clickuseradvicecell(row, column, cell, event) {
        },
        onTranPatient: function(tranPatient) {
          this.currentPatient = tranPatient
        },
        CreateTime(time) {
          return uParseTime(time, '{y}-{m}-{d} {h}:{i}:{s}')
        },
        handleSizeChange(limit) {
          this.limit = limit
          this.getlist()
        },
        handleCurrentChange(page) {
          this.page = page
        
          this.getlist()
        },
        changeStatus(val){
          if(val == 1 ){
            this.show = false
          }
          if(val == 2){
            this.show = true
          }
        },
       getTime(val) {
           if(val < 0){
             return ""
           }
           if(val == ""){
            return ""
           }else {
            return uParseTime(val, '{y}-{m}-{d}')
           }
        },
     
       getDoctor(id){
         var name = ""
         for(let i=0;i<this.doctorList.length;i++){
            if(id == this.doctorList[i].admin_user_id){
               name = this.doctorList[i].user_name
            }
         }
         return name
       },
       getPatientById(id){
        getPatientById(id).then(response=>{
           if(response.data.state ==1){
             var patient = response.data.data.patients
            
             this.dialysis_no = patient.dialysis_no
             this.name = patient.name
             
           }
        })
       },
       getAllDoctor() {
        getAllDoctor().then(response => {
          if (response.data.state == 1) {
            var appRole = response.data.data.appRole
            this.adminUserList = appRole
          }
        })
      },
      savePatientLapse(){
          var params = {
            patient_id:this.patientID,
            lapse_type:parseInt(this.lapse_type),
            lapse_class:parseInt(this.lapse_class), 
            lapse_reason:this.lapse_reason,
            record_date:this.record_date,
            admin_user_id:this.admin_user_id,
            remark:this.remark,
          }
          console.log("params=====",params)
        savePatientLapse(params).then(response=>{
          if(response.data.state==1){
             var record = response.data.data.record
             this.$message.success("保存成功!")
             this.dialogVisible = false
             this.remark = ""
             this.lapse_reason = ""
             this.getlist()

          }
        })
      },
      getlist(){
         var params = {
          patient_id:this.patientID,
          limit:this.limit,
          page:this.page,
         }
        getPatientLapseRecord(params).then(response=>{
           if(response.data.state == 1){
             var total = response.data.data.total
             this.total = total
             var record =  response.data.data.record
             this.tableData = record
           }
        })
      },
      handleUpdateAdviceTemplate(id){
        getPatientLapsoSummary(id).then(response=>{
          if(response.data.state == 1){
             var lapsorecord = response.data.data.lapsorecord
             console.log("lapsorecord",lapsorecord)
             this.lapse_type = lapsorecord.lapse_type.toString()
             this.lapse_class = lapsorecord.lapse_class.toString()
             this.lapse_reason = lapsorecord.lapse_reason
             this.record_date = this.getTime(lapsorecord.record_date)
             this.remark = lapsorecord.remark
             this.admin_user_id = lapsorecord.admin_user_id
             this.id = lapsorecord.id
             this.editDialogVisible = true
           
          }
        })

      },
      updatePatientLapse(){
        var params = {
            patient_id:this.patientID,
            lapse_type:parseInt(this.lapse_type),
            lapse_class:parseInt(this.lapse_class), 
            lapse_reason:this.lapse_reason,
            record_date:this.record_date,
            admin_user_id:this.admin_user_id,
            remark:this.remark,
            id:this.id,
          }
        updatePatientLapseRecord(params).then(response=>{
           if(response.data.state== 1){
             var record = response.data.data.record
             this.editDialogVisible = false
             this.$message.success("保存成功!")
             this.getlist()
           }
        })
      },
      handleDeleteAdviceTemplate(id,index){
        deletePatientLapsoRrecord(id).then(response=>{
            if(response.data.state==1){
               var msg = response.data.data.msg
               this.$message.success("保存成功")
               this.tableData.splice(index,1)
            }
        })
      }
     
  
     
      },
      created() {
        this.record_date =  moment(new Date()).format('YYYY-MM-DD')
       
        const id = this.$route.params && this.$route.params.id
        console.log('id是设么', id)
         this.patientID = parseInt(id)
         this.getPatientById(id)
         this.getAllDoctor()
         this.getlist()
      },
     
    }
  </script>
  
  <style>
    .oictable ::-webkit-scrollbar {
      height: 15px;
    }
  </style>
  
  <style rel="stylesheet/scss" lang="scss">
     ::-webkit-scrollbar{
        height:15px;
     }
  
  </style>