<!-- 小儿跌倒风险评估 -->
<template>
    <div class="patient-container">
        <patient-sidebar :id="patient_id" defaultActive="5-2"></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>历史评分</el-button>
                        <el-button @click="dialogVisible=true">告知书</el-button>
                    </div>
                </div>

                <div>
                    <table class="table" border="1" style="width: 100%;">
                        <thead>
                            <tr>
                            <th style="width:10%;">项目</th>
                            <th style="width: 22.4%;">4分</th>
                            <th style="width: 22.4%;">3分</th>
                            <th style="width: 22.4%;">2分</th>
                            <th style="width: 22.4%;">1分</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr class="bg_color">
                                <td class="start">年龄</td>
                                <td>
                                    <div class="jiange">
                                        <label><input name="ball" type="checkbox" value="football" />&nbsp;>1岁~≤3岁</label>
                                    </div>
                                </td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;>3岁~≤7岁</label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;>7岁~≤13岁</label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;>13岁</label>
                                </div></td>
                            
                            </tr>
                            <tr>
                                <td style="border-right: none;">
                                    <div class="bing">性别</div> 
                                </td>
                                <td colspan="2" style="border-left: none;"></td>
                                <td>
                                    <div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;男</label>
                                    </div>
                                </td>
                                <td>
                                    <div class="jiange">
                                        <label><input name="ball" type="checkbox" value="football" />&nbsp;女</label>
                                    </div>
                                </td>
                            </tr>
                            <tr class="bg_color">
                                <td class="start">诊断</td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        神经系统疾病：骨骼、关节系统疾病；眼科疾病
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        氧合功能改变（呼吸系统疾病、心血管系统疾病、脱水、贫血、晕厥、头晕等）；电解质紊乱
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        心理/行为疾病
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        其他疾病；疾病导致不能活动或移动
                                    </label>
                                </div></td>
                            </tr>
                            <tr>
                                <td style="border-right: none;">
                                    <div class="bing">认知障碍</div> 
                                </td>
                                <td style="border-left: none;"></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        没有意识到不能自我行动
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        忘记有行动的限制
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        能自我辨识方位；昏迷、无反应
                                    </label>
                                </div></td> 
                            </tr>
                            <tr class="bg_color">
                                <td class="start">环境因素</td>
                                <td><div class="jiange">
                                    <label>
                                        <input name="ball" type="checkbox" value="football" />&nbsp;
                                      <span>
                                        住院期间有跌倒坠床史：患儿移动或活动时需要使用辅助工具（拐杖、助行器、转运床、轮椅等）；婴幼儿放置在无护栏的成人床
                                      </span>
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        近1个月有跌倒坠床史：婴幼儿放置在有护栏的成人床
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        近3个月有跌倒坠床史：婴幼儿放置在有护栏的婴儿床
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        >3个月有跌倒坠床史/无跌倒坠床史
                                    </label>
                                </div></td> 
                            </tr>
                            <tr>
                                <td style="border-right: none;">
                                    <div class="bing">药物使用</div>
                                </td> 
                                <td style="border-left: none;"></td>                            
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        联合用药：镇静剂、安眠药、巴比妥类药、吩噻嗪类药、抗抑郁药、利尿药、降压药、强心剂、麻醉药、化疗药、散瞳剂
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        以上其中一种药物
                                    </label>
                                </div></td>
                                <td><div class="jiange">
                                    <label><input name="ball" type="checkbox" value="football" />&nbsp;
                                        其他药物/没有
                                    </label>
                                </div></td> 
                            </tr>
                            <tr class="bg_color">
                            <td colspan="5" style="height: 30px;"></td>
                            
                            </tr>
                            <tr>
                            <td colspan="5">
                                <div class="content_top" >
                                    <div>
                                        <div class="bottoms">
                                        <span>总分:</span>
                                        <el-input v-model="input" placeholder="请输入内容" style="width: 100px;"></el-input>分
                                        </div>

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

                                        <div class="bottoms">
                                            <span>评估人:</span>
                                            <el-select v-model="value" placeholder="请选择" >
                                                <el-option
                                                v-for="item in options"
                                                :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">确认</el-button>
                                    </div>
                                </div>
                            </td>
                            </tr>
                        </tbody>
                    </table>

                </div>

            </div>
        </div>
        <div>
            <el-dialog
                title="内容详情"
                :visible.sync="dialogVisible"
                width="50%"
                
                class="status_change">
                <div>
                    <Falloutbedprint></Falloutbedprint>
                </div>
                
            </el-dialog>
            
        </div>
    </div>
</template>
<script>

import PatientSidebar from '../components/PatientSidebar.vue'
import Falloutbedprint from './Falloutbedprint.vue'
export default {
    components:{
      PatientSidebar,
      Falloutbedprint
    },
    data(){
        return{
            patient_id:0, 
            value1:'',
            value:'',
            options:[],
            input:'',
            age:['>1岁~≤3岁','>3岁~≤7岁','>7岁~≤13岁','>13岁'],
            checked:'',
            checkList:[],
            dialogVisible:false,
        }
    },
    methods:{
    //     arraySpanMethod({ row, column, rowIndex, columnIndex }) {
    //     if (rowIndex % 2 === 0) {
    //       if (columnIndex === 0) {
    //         return [1, 2];
    //       } else if (columnIndex === 1) {
    //         return [0, 0];
    //       }
    //     }
    //   },
    }
}
</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;
           padding: 5px;
           vertical-align: top;
        }
        .start{
            text-align: center;
        }
        .bing{
            // width: 150px;
            text-align: center;
        }
        .bg_color{
            background: rgb(243, 240, 240);
        }
        .bottoms{
            display: inline-block;
            margin-left: 10px;
            margin-top: 5px; 
        }
        .jiange{
            margin-left: 20px;
            color: black;
        }
        input{
            -webkit-appearance: checkbox;
        }
    }
    
</style>
<style lang="scss">
    .status_change{
        
        .el-dialog__header{
            background-color:#eff2f5;
            .el-dialog__title,.el-dialog__headerbtn i{
            color: #666666;
            }
        }
    }
    .el-dialog {
        left: 50% !important;
        position: fixed !important;
        top: 40% !important;
        transform: translate(-50%, -50%) !important;
        margin-top: 0 !important;

    }
</style>