Vue_New/src/xt_pages/user/evaluationtool/Cathetershedding.vue

<template>
    <div class="patient-container">
        <patient-sidebar :id="patientID" defaultActive="5-6"></patient-sidebar>
        <div>
            <div class="patient-app-container advice-container app-container">
                <div class='content_top' style="width: 100%;margin-bottom: 20px;">
                    <div style="font-size: 20px;"> 住院患者导管脱落危险因素评估记录表</div>
                    <div>
                        <el-button @click="daoguanhistory">历史评分</el-button>
                    </div>
                </div>

                <div>
                  <table class="table" border="1" style="width: 100%;">
                    <thead>
                      <tr>
                          <th style="width: 15%;">项目</th>
                          <th style="width: 50%;">分值</th>
                          <th>护理措施</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr>
                        <td class="start">A.脱管后风险程度</td>
                        <td>
                          <div class="jiange">
                            <el-radio-group v-model="radio" @change="handleCheckedCitiesChange">
                              <el-radio v-for="(item,index ) in tuoguan" :label="item.value" :key="index" style="">{{ item.label }}</el-radio>
                            </el-radio-group>
                          </div>
                        </td>
                        <td rowspan="3">
                          <div style="vertical-align: top; color: black; padding: 5px;">
                            <span v-for="item in hulicuoshi">
                              <label><input name="ball" type="checkbox" v-model="item.is_check" @click="cuoshi(item)"/>&nbsp;{{item.label}}</label> <br/>
                            </span>
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="start">B.患者意识程度</td>
                        <td>
                          <div class="jiange">
                              <el-radio-group v-model="radio1"  @change="handleCheckedCitiesChange">
                                <el-radio v-for="(item,index ) in yishi" :label="item.value" :key="index" style="">{{ item.label }}</el-radio>
                                  <!-- <el-radio v-for="(item,index ) in yishi" :label="item" :key="index">{{ item }}</el-radio> -->
                              </el-radio-group>
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="start">C.患者配合程度</td>
                        <td>
                          <div  class="jiange">
                              <el-radio-group v-model="radio2" @change="handleCheckedCitiesChange">
                                <el-radio v-for="(item,index ) in peihe" :label="item.value" :key="index" style="">{{ item.label }}</el-radio>
                                <!-- <el-radio v-for="(item,index ) in peihe" :label="item" :key="index">{{ item }}</el-radio> -->
                              </el-radio-group>
                          </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>

                <div class="content_top" style="margin: 10px 0px;">
                  <div>
                      <div class="bottoms">
                      <span>总分:</span>
                      <el-input v-model="duct_Totalpoints" style="width: 100px;"></el-input>分
                      </div>

                      <div class="bottoms">
                          <span>评估日期:</span>
                          <el-date-picker
                              v-model="date"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="选择日期"
                              :clearable="false"
                              style="width: 150px;">
                          </el-date-picker>
                      </div>

                      <div class="bottoms">
                          <span>责任护士:</span>
                          <el-select v-model="Dutynurse" placeholder="请选择" >
                              <el-option
                              v-for="item in Dutynursearr"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                              style="width:150px;">
                              </el-option>
                          </el-select>
                      </div>

                  </div>
                  <div style="margin:5px 10px;">
                    <el-button type="primary" @click="daoguanclick">确认</el-button>
                  </div>
                </div>
                <hr style="border:none;height:1px;background:#DCDFE6;"/><!--水平线-->
                <div style="margin-top: 20px;">
                    <p>患者知情同意书：我对住院期间发生导管脱落的风险及预防措施已知晓，并给予配合。</p>
                    <div class="zhuangui">
                        <p style="display: inline-block; margin-right: 70px;">患者/家属签字: <span style="display: inline-block;border-bottom:1px solid #DCDFE6;width: 60px;"></span></p>
                        <p style="display: inline-block;">
                            日期：
                            <el-date-picker
                                v-model="jiashu_date"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="选择日期"
                                style="width: 150px;">
                            </el-date-picker>
                        </p>
                    </div>
                    <div class="zhuangui">
                        <span>转归：</span>
                        <el-radio v-model="zhuanggui" label="1">脱落</el-radio>
                        <el-radio v-model="zhuanggui" label="2">未脱落</el-radio>
                    </div>
                    <div class="zhuangui">
                        <p style="display: inline-block; margin-right: 30px;">
                            评估人签字:
                            <el-select v-model="appraiser" placeholder="请选择" style="width: 120px;">
                                <el-option
                                v-for="item in optionsarr"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </p>
                        <p style="display: inline-block;">
                            日期：
                            <el-date-picker
                                v-model="date"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="选择日期"
                                style="width: 150px;">
                            </el-date-picker>
                        </p>
                    </div>
                    <div class="zhuangui">
                        <p style="display: inline-block; margin-right: 30px;">
                            护士长签字:
                            <el-select v-model="hushi" placeholder="请选择" style="width: 120px;">
                                <el-option
                                v-for="item in hushiarr"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </p>
                        <p style="display: inline-block;">
                            日期：
                            <el-date-picker
                                v-model="hushi_date"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="选择日期"
                                style="width: 150px;">
                            </el-date-picker>
                        </p>
                    </div>
                </div>
                <hr style="margin: 10px 0px;border:none;height:1px;background:#DCDFE6;"/><!--水平线-->
                <div class="shuoming">
                    <p>说明：</p>
                    <p>1.＜5分为正常，5~8分为危险，≥9分为高度危险。</p>
                    <p>2.导管脱落危险因素≥5分，需填写该表。</p>
                    <p>3.常规情况下，评分5~8分，至少每天评估一次；评分≥9，至少每班评估一次，紧急与特殊情况，应随时评估。</p>
                </div>
            </div>
        </div>

    </div>
</template>
<script>
import { uParseTime } from '@/utils/tools'
import PatientSidebar from '../components/PatientSidebar.vue'
export default {
  components:{
    PatientSidebar
  },
  data(){
    return{
      patientID:0,
      value1:'',
      radio:'',
      radio1:'',
      radio2:'',
      radio_val:null,
      radio1_val:null,
      radio2_val:null,
      // duct_Totalpoints:0,
      options:[],
      input:'',
      value:'',
      date:this.getTime(new Date()),
      Dutynurse:'',//责任护士
      Dutynursearr:[],//责任护士数组
      appraiser:'',
      optionsarr:[],
      jiashu_date:this.getTime(new Date()),//家属时间
      zhuanggui:'',//转归
      hushi:'',//护理
      hushiarr:'',//护理
      hushi_date:this.getTime(new Date()),//护理时间
      cuoshi_show:[],
      tuoguan:[{value:1,label:'低危导管 (1分)',is_check:false,check:0},
              {value:2,label:'中危导管 (2分)',is_check:false,check:0},
              {value:3,label:'高危导管 (3分)',is_check:false,check:0}
            ],
      yishi:[{value:0,label:'意识清醒 (0分)',is_check:false,check:0},
            {value:1,label:'中昏迷、深昏迷 (1分)',is_check:false,check:0},
            {value:2,label:'嗜睡、昏睡 (2分)',is_check:false,check:0},
            {value:3,label:'浅昏迷 (3分)',is_check:false,check:0},
            {value:4,label:'意识模糊 (4分)',is_check:false,check:0},
            ],
      peihe:[{value:1,label:'完全配合 (1分)',is_check:false,check:0},
            {value:2,label:'部分配合 (2分)',is_check:false,check:0},
            {value:3,label:'不配合 (3分)',is_check:false,check:0},
            ],
      hulicuoshi:[{id:1,label:'1.管道维护，导管脱落严重后果及预防措施的健康教育；',is_check:false,check:0},
      {id:2,label:'2.床边悬挂警示标识（＞9分悬挂）；',is_check:false,check:0},{id:3,label:'3.正确妥善固定；',is_check:false,check:0},
      {id:4,label:'4.正确卧位及床上活动方式， 病人带管下床活动时， 将引流管固定在病人的衣服或裤子上；',is_check:false,check:0},
      {id:5,label:'5.加强巡视，及时发现满足患者需要；',is_check:false,check:0},{id:6,label:'6.严格交接班，各班重点交接，观察外露长度，必要时记录；',is_check:false,check:0},
      {id:7,label:'7.昏迷、暴躁、不合作病人，根据医嘱使用镇静剂和约束带；',is_check:false,check:0},
      {id:8,label:'8.进行诊疗护理需要移动患者时，根据医嘱使用镇静剂和约束带；',is_check:false,check:0},
      {id:9,label:'9.对于气管插管清醒患者，进行心理疏导和安全教育。',is_check:false,check:0},]
      // tuoguan:['低危导管 (1分)','中危导管 (2分)','高危导管 (3分)'],
      // yishi:['意识清醒 (0分)','中昏迷、深昏迷 (1分)','嗜睡、昏睡 (2分)','浅昏迷 (3分)','意识模糊 (4分)'],
      // peihe:['完全配合 (1分)','部分配合 (2分)','不配合 (3分)']
    }
  },
  methods:{
    handleCheckedCitiesChange(e){
      if(e == this.radio){
        this.radio_val = e
      }
      if(e == this.radio1){
        this.radio1_val = e
      }
      if(e == this.radio2){
        this.radio2_val = e
      }
    },
    daoguanhistory(){
      this.$router.push({path: '/patients/daoguan_history'})
    },
    // 确认
    daoguanclick(){
      var params={
        radio:this.radio,
        radio1:this.radio1,
        radio2:this.radio2,
        duct_Totalpoints:this.duct_Totalpoints,
        hulicuoshi:this.cuoshi_show,
        date:this.date,//评估时间
        Dutynurse:this.Dutynurse,//责任护士
        appraiser:this.appraiser,//评估人
        jiashu_date:this.jiashu_date,
        zhuanggui:this.zhuanggui,
        hushi:this.hushi,
        hushi_date:this.hushi_date,
        patientID:this.patientID
      }
      console.log('params====',params);
    },
    // 点击护理措施
    cuoshi(item){
      for(let i in this.hulicuoshi){
        if(item.label==this.hulicuoshi[i].label ){
          if(item.is_check==false){
            this.hulicuoshi[i].check= 1
            this.hulicuoshi[i].is_check = true
            this.cuoshi_show.push(item.id)
          }else{
            this.hulicuoshi[i].check= 0
            this.hulicuoshi[i].is_check = false
            if(this.cuoshi_show.length>0){
              for(let j in this.cuoshi_show){
                if(item.id == this.cuoshi_show[j]){
                  let index = this.cuoshi_show.indexOf(this.cuoshi_show[j]);
                  this.cuoshi_show.splice(index,1)
                }
              }
            }
          }
        }
      }
      console.log('qqqqq',this.cuoshi_show);
    },
    // 转换时间
    getTime(val) {
        if(val < 0){
          return ""
        }
        if(val == ""){
        return ""
        }else {
        return uParseTime(val, '{y}-{m}-{d}')
        }
    },
  },
  computed:{
    duct_Totalpoints(){
      return this.radio_val + this.radio1_val + this.radio2_val
    }
  }
}
</script>
<style lang="scss" scoped>
    .content_top{
      display: flex;
      justify-content: space-between;
    }
    .table{
        border: 1px solid #DCDFE6;
        border-collapse:collapse;
        border-spacing: 0;
        thead th{
            background: #0077ff9f;
            color: white;
            text-align: center;
            height: 40px;
        }
        tbody td{
           height: 40px;
           .el-radio {
              color: #101010;
              cursor: pointer;
              margin-right: 30px;
              font-size: 15px !important;
            }
        }
        .start{
            text-align: center;
        }
        .bing{
            width: 150px;
            text-align: center;
        }
        .bg_color{
            background: rgb(243, 240, 240);
        }
        .jiange{
            // margin-left: 20px;
            padding-left: 10px;
            color: black;
        }
        input{
            -webkit-appearance: checkbox;
        }
    }
    .bottoms{
        display: inline-block;
        margin-left: 10px;
        margin-top: 5px;
    }
    .shuoming p{
      margin-top: 5px;
      color: rgb(167, 165, 165);
    }
    .zhuangui{
        margin-top: 10px;
    }

</style>