
    <div class="tx-dw-page-types">
        
        <event-list
            inline-template
            id="108"
            get-items-url="/api/?tx_dwpagetypes_event%5Baction%5D=jsonList&amp;tx_dwpagetypes_event%5Bcontroller%5D=Event&amp;cHash=ebe844b72a6f4cc73934005881b98f6b"
            get-items-content-url="/api/?tx_dwpagetypes_event%5Baction%5D=getEventItems&amp;tx_dwpagetypes_event%5Bcontroller%5D=Event&amp;cHash=79b4602e83ca394508f09bc21582ed05"
            :categories="{&quot;theme&quot;:[],&quot;region&quot;:[],&quot;campusDepartment&quot;:[],&quot;campusPosition&quot;:[],&quot;campusTheme&quot;:[],&quot;campusType&quot;:[],&quot;memberEventTypes&quot;:[]}"
            :items-per-page="10"
        >
            <div class="container">
                
    <div class="d-flex justify-content-between align-items-center mb-half">
        <h2 class="sr-only">
            Veranstaltungen
        </h2>
        <span class="h6 mb-0">
            Filtern nach
        </span>
        <button
            type="button"
            id="event-filter-reset-btn"
            class="btn event-filter-reset-btn"
            v-show="filterIsActive"
            v-on:click="deleteFilter"
        >
            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-reset" viewBox="0 0 16 16" width="16" height="16" aria-label="Reset icon">	<path d="M.38.13A.36.36,0,0,0,.11.24.37.37,0,0,0,0,.51V6.6a.37.37,0,0,0,.11.27A.36.36,0,0,0,.38,7h6.1a.36.36,0,0,0,.27-.11.37.37,0,0,0,.11-.27V5.71a.38.38,0,0,0-.38-.38l-4,.1A6.2,6.2,0,0,1,4.73,2.78a6,6,0,0,1,3.4-1,6,6,0,0,1,3.11.84,6.33,6.33,0,0,1,2.27,2.27A6,6,0,0,1,14.35,8a6,6,0,0,1-.84,3.11,6.33,6.33,0,0,1-2.27,2.27,6,6,0,0,1-3.11.84,6.23,6.23,0,0,1-2.24-.41A6,6,0,0,1,4,12.63a.37.37,0,0,0-.29-.07.36.36,0,0,0-.25.11l-.63.63a.36.36,0,0,0-.1.27.3.3,0,0,0,.13.27,7.87,7.87,0,0,0,5.27,2,7.6,7.6,0,0,0,3.93-1.06A8,8,0,0,0,14.94,12,7.55,7.55,0,0,0,16,8a7.77,7.77,0,0,0-1.05-4A7.92,7.92,0,0,0,12.1,1.19,7.64,7.64,0,0,0,8.16.13a7.69,7.69,0,0,0-3.78,1A7.83,7.83,0,0,0,1.56,3.65L1.65.51A.37.37,0,0,0,1.54.24.33.33,0,0,0,1.27.13Z" /></svg>
            <span class="ml-quarter ml-lg-half">
                Zurücksetzen
            </span>
        </button>
    </div>

    <form class="mb-4 mb-lg-2-half event-filter">
        
                
                
        
    
            
        
        
    
        
        <div class="event-filter-tab event-filter-tab--date event-filter-tab--date-dateFrom">
            <label for="event-filter-dateFrom">
                Von
            </label>
            <el-datepicker
                type="date"
                name="event[dateFrom][]"
                id="event-filter-dateFrom"
                format="dd.MM.yyyy"
                align="right"
                :editable="false"
                :clearable="false"
                :picker-options="dateFromPickerOptions"
                v-model="filter.dateFrom"
                v-on:change="updateSecondPicker"
            />
        </div>
    
        
        <div class="event-filter-tab event-filter-tab--date event-filter-tab--date-dateTo">
            <label for="event-filter-dateTo">
                Bis
            </label>
            <el-datepicker
                type="date"
                name="event[dateTo][]"
                id="event-filter-dateTo"
                format="dd.MM.yyyy"
                align="right"
                :editable="false"
                :clearable="false"
                :picker-options="dateToPickerOptions"
                v-model="filter.dateTo"
                v-on:change="updateSecondPicker"
            />
        </div>
    
    </form>

    

    


                <transition name="fade">
                    <div
                        class="spinner-loader"
                        role="status"
                        v-show="isLoading"
                    >
                        <span class="sr-only">
                            Laden ...
                        </span>
                    </div>
                </transition>
                <p class="font-size-sm font-size-lg-base mb-1">
                    Es wurden
                    <strong>
                        <% filteredItems.length %>&nbsp;
                        <span v-if="filteredItems.length > 1">
                            Termine
                        </span>
                        <span v-else>
                            Termin
                        </span>
                    </strong>
                    gefunden
                </p>
                <div>
                    <transition-group
                        name="arrange"
                        tag="div"
                        id="news-list-108"
                        ref="list"
                    >
                        <div
                            class=" arrange-item"
                            v-for="(item, indexValue) in filteredItems"
                            :key="item.uid"
                            v-if="item.content && isItemVisible(indexValue)"
                            v-html="item.content"
                        ></div>
                    </transition-group>
                </div>
                <el-pagination
                    class="oehv-event-event-border mb-5"
                    layout="prev, pager, next"
                    v-if="filteredItems.length"
                    :current-page.sync="currentPage"
                    :page-size="itemsPerPage"
                    :total="filteredItems.length"
                    @current-change="handlePaginationClick"
                />
            </div>
        </event-list>
    
    </div>

