<div class=" content">
    <div class="row">
        <div class="col-sm-12">
            <div class="card">
                <div class="card-body">
                    <div class="row">
                        <div class="col-6 mb-3">
                            <label for="exampleFormControlSelect1">วันที่เริ่มใช้</label>
                            <input type="date" class="form-control" value="">
                        </div>
                        <div class="col-6 mb-3">
                            <label for="exampleFormControlSelect1">วันที่สิ้นสุด</label>
                            <input type="date" class="form-control" value="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-12">
            <div class="card">
                <div class="card-body">
                    <p>
                        <br />
                        <button type="button" class="btn btn-primary" (click)="collapse.toggle()"
                            [attr.aria-expanded]="!gfg" aria-controls="multicollapseExample" value="calendar">
                            Click to collapse1
                        </button>
                        <button type="button" class="btn btn-primary" (click)="collapse.toggle()"
                            [attr.aria-expanded]="!gfg" aria-controls="multicollapseExample multicollapseExample1"
                            value="calendar1">
                            Click to collapse2
                        </button>
                        <button type="button" class="btn btn-primary" (click)="collapse.toggle()"
                            [attr.aria-expanded]="!gfg"
                            aria-controls="multicollapseExample multicollapseExample1 multicollapseExample2"
                            value="calendar2">
                            Click to collapse3
                        </button>
                    </p>

                    <div #collapse="ngbCollapse" [(ngbCollapse)]="gfg" class="multicollapseExample">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="card">
                                    <div class="card-body">
                                        <full-calendar [options]="calendarOptions"></full-calendar>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div #collapse="ngbCollapse" [(ngbCollapse)]="gfg" class="multicollapseExample1">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="card">
                                    <div class="card-body">
                                        1
                                        <full-calendar [options]="calendarOptions"></full-calendar>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div #collapse="ngbCollapse" [(ngbCollapse)]="gfg" class="multicollapseExample2">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="card">
                                    <div class="card-body">
                                        2
                                        <full-calendar [options]="calendarOptions"></full-calendar>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>



</div>