elizebeth/src/xt_pages/dialysis/components/callingConfigure.vue

<template>
    <div class="page_callingConfigure">
        <div class="cell clearfix">
            就诊状态显示屏幕切换屏幕时长配置(秒) : 
            <div class="time ">
                <el-input-number v-model="num" @change="handleChange" :min="1"></el-input-number>
            </div>
        </div>
        <div style="display:flex;">
            <div class="configureBox">
                <div class="configureBoxTitle">接诊叫号</div>
                <div class="configureBoxMain">
                    <div style="margin-bottom:10px;">单次叫号语音播报次数：<el-input-number v-model="num" @change="handleChange" :min="1"></el-input-number></div>
                    <div style="margin-bottom:10px;">叫号语音内容设置：</div>
                    <div style="margin-bottom:10px;">
                        <p style="width:50px;display: inline-block;">请</p>
                        <el-select style="width:140px;" v-model="type" placeholder="请选择">
                            <el-option
                            v-for="item in typeOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div style="margin-bottom:10px;">
                        <p style="width:50px;display: inline-block;">到</p>
                        <el-select style="width:140px;" v-model="state" placeholder="请选择">
                            <el-option
                            v-for="item in stateOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div style="margin-bottom:10px;" v-if="state == 2">
                        <p style="width:50px;display: inline-block;"></p>
                        <el-input style="width:200px;" v-model="input" placeholder="请输入内容"></el-input>
                    </div>
                    <div>就诊</div>
                </div>
                
            </div>
            <div class="configureBox" style="border-left:none;">
                <div class="configureBoxTitle">上机叫号</div>
                <div class="configureBoxMain">
                    <div style="margin-bottom:10px;">单次叫号语音播报次数：<el-input-number v-model="num" @change="handleChange" :min="1"></el-input-number></div>
                    <div style="margin-bottom:10px;">叫号语音内容设置：</div>
                    <div style="margin-bottom:10px;">
                        <p style="width:50px;display: inline-block;">请</p>
                        <el-select style="width:140px;" v-model="type" placeholder="请选择">
                            <el-option
                            v-for="item in typeOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div style="margin-bottom:10px;">
                        <p style="width:50px;display: inline-block;">到</p>
                        <el-select style="width:140px;" v-model="state" placeholder="请选择">
                            <el-option
                            v-for="item in stateOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div style="margin-bottom:10px;" v-if="state == 2">
                        <p style="width:50px;display: inline-block;"></p>
                        <el-input style="width:200px;" v-model="input" placeholder="请输入内容"></el-input>
                    </div>
                    <div>上机</div>
                </div>
                
            </div>
        </div>
        <div style="display:flex;margin-top:10px;">
            <div style="width:480px;">
                语音播报声音：
                <el-radio-group v-model="radio">
                    <el-radio :label="1">男生</el-radio>
                    <el-radio :label="2">女生</el-radio>
                </el-radio-group>
            </div>
            <div style="width:480px;">
                隐藏接诊叫号区域：
                <el-radio-group v-model="radio">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="2">否</el-radio>
                </el-radio-group>
            </div>
        </div>
        <div style="display:flex;margin-top:10px;">
            <div style="width:480px;">
                隐藏上机叫号区域：
                <el-radio-group v-model="radio">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="2">否</el-radio>
                </el-radio-group>
            </div>
            <div style="width:480px;">
                是否在透析管理页面显示排队叫号：
                <el-radio-group v-model="radio">
                    <el-radio :label="1">显示</el-radio>
                    <el-radio :label="2">不显示</el-radio>
                </el-radio-group>
            </div>
        </div>
        <div style="display:flex;margin-top:10px;">
            <div style="width:480px;">
                是否在透析记录详情页面显示排队叫号：
                <el-radio-group v-model="radio">
                    <el-radio :label="1">显示</el-radio>
                    <el-radio :label="2">不显示</el-radio>
                </el-radio-group>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return{
            num:3,
            typeOptions:[{ value: 1, label: '姓名'},{ value: 2, label: '透析号'}],
            type: 1,
            stateOptions:[{ value: 1, label: '智能匹配诊台'},{ value: 2, label: '自定义内容'}],
            state: 1,
            input:'',
            radio:1
        }
    }
}
</script>


<style lang="scss" scoped>
.configureBox{
    width:480px;
    height: 300px;
    border: 1px solid #e5e5e5;
    .configureBoxTitle{
        height: 40px;
        text-align: center;
        line-height: 40px;
        background: rgb(245, 247, 250);
        color:rgb(96, 98, 102);
        font-weight: 600;
        border-bottom: 1px solid #e5e5e5;
    }
    .configureBoxMain{
        padding: 10px;
    }
}
</style>