<template>
    <global-page title="航班详情" navBarBackground="#0e42d2" :titleStyle="{color: '#fff'}">
        <view class="flightSupportDetails">
            <view class="details_header">
                <view class="header_no flex">
                    <image
                        class="flight-no-image"
                        :src="HnaPic"
                        mode="widthFix" />
                    <text>B9999</text>
                </view>

                <view class="header_info flex">
                    <text class="margin-r-32">机型：A999</text>
                    <text>机位：HG99</text>
                </view>
            </view>

            <view class="details_swiper">
                <detailsSwiper :currentAllRelatedFlights />
            </view>

            <view class="details_tab flex">
                <global-button
                    v-for="(item, index) of tabList"
                    :key="index"
                    @click="tabCurrent = index"
                    :type="tabCurrent == index ? 'primary' : 'info'" size="large" :radius="10"
                    class="f-flex-1" :class="index == 0 ? 'btn_lf' : ''">
                    {{ item }}--{{ tabCurrent }}
                </global-button>
            </view>

        </view>

    </global-page>
</template>

<script setup>
import { ref, reactive } from 'vue'
import { storeToRefs } from 'pinia'
import { cloneDeep } from 'lodash'
import useBaseStore from 'mocp/store/base'
import useFlightSupportStore from 'mocp/store/flight-support'
import { onUnload } from '@dcloudio/uni-app'
import HnaPic from 'mocpStatic/image/air-company/hnhk.png'
import detailsSwiper from '../components/DetailsSwiper.vue'

const currentAllRelatedFlights = reactive([
    {
        flightNo: 'B5555'
    },
    {
        flightNo: 'B6666'
    },
    {
        flightNo: 'B7777'
    },
    {
        flightNo: 'B8888'
    },
    {
        flightNo: 'B9999'
    }
])
const tabList = ['航班信息', '其他信息']
const tabCurrent = ref(0)


</script>
<style lang="scss" scoped>
@import "../constants/details";
</style>
