<template>
    <div class="main-contain outpatientChargesManagement">
        <div class="position">
            <bread-crumb :crumbs='crumbs'></bread-crumb>
        </div>
        <div class="app-container">
            <div class="dateBox">
                <el-date-picker v-model="selected_date" prefix-icon="el-icon-date" @change="handleScheduleDateChange" :editable="false" :clearable="false" style="width: 196px;" type="date" placeholder="选择日期时间" align="right" ></el-date-picker>
            </div>
            <el-tabs v-model="activeName">
                <el-tab-pane label="未收费" name="first">
                    <no-charge></no-charge>
                </el-tab-pane>
                <el-tab-pane label="已收费" name="second">
                    <charged></charged>
                </el-tab-pane>
                <el-tab-pane label="医保退处方" name="third">
                    <medical-insurance-refund></medical-insurance-refund>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>


<script>
import BreadCrumb from '@/xt_pages/components/bread-crumb'
import noCharge from './components/noCharge'
import charged from './components/charged'
import medicalInsuranceRefund from './components/medicalInsuranceRefund'
export default {
    components:{
        BreadCrumb,
        noCharge,
        charged,
        medicalInsuranceRefund
    },
    data(){
        return{
            crumbs: [
                { path: false, name: '门诊收费' },
                { path: false, name: '门诊收费管理' }
            ],
            activeName:'first'
        }
    }
}
</script>

<style lang="scss" scoped>
.outpatientChargesManagement{
    .el-tabs{
        position: relative;
    }
    .el-tabs__nav-wrap{
        padding-left:200px;
    }
    .dateBox{
        position: absolute;
        z-index:99;
    }
}
</style>

<style lang="scss">
.outpatientChargesManagement{
    .el-tabs__nav-wrap{
        padding-left:220px;
    }
}
</style>
