<template>
    <z-paging ref="paging" v-model="dataList">
        <template #top>
            <z-tabs :list="tabList" @change="tabsChange" bar-width="80rpx" bg-color="#f7f8fa" />
        </template>
        <view class="list">
            <view class="item" v-for="item in 3" :key="item">
                <view class="item-title">
                    <view class="desc">
                        <view class="type">OPEN</view>
                        <view class="txt">190机型管控中心</view>
                        <view class="place">华北基地</view>
                    </view>
                    <score-details></score-details>
                </view>
                <view class="item-content">3月31日,天津航空6837/A320飞机执行天津=长春、天津=昆明航班，23:00落地，航后执行52A检工作，利用夜间8小时左右执行飞机检查和维修工</view>
            </view>
            <view class="item" v-for="item in 2" :key="item">
                <view class="item-title">
                    <view class="desc">
                        <view class="type">OPEN</view>
                        <view class="txt">190机型管控中心</view>
                        <view class="place">华北基地</view>
                    </view>
                    <score-details type="warning"></score-details>
                </view>
                <view class="item-content">3月31日,天津航空6837/A320飞机执行天津=长春、天津=昆明航班，23:00落地，航后执行52A检工作，利用夜间8小时左右执行飞机检查和维修工</view>
            </view>
        </view>
    </z-paging>
</template>

<script setup>
import { ref } from 'vue'
import ScoreDetails from '../components/score-details.vue'

const paging = ref()
const tabIndex = ref(0)
const tabList = ref(['OPEN', 'CLOSE', '全部'])
const dataList = ref([])
//导航切换
const tabsChange = (index) => {
    tabIndex.value = index
    paging.value.reload()
}
</script>
<style lang="scss" scoped>
@import './constants/index.scss';
</style>
