<template>
    <div class="fix-height-subpage column no-wrap q-pa-md">
        <q-tabs
            v-model="tab"
            dense
            class="text-grey"
            active-color="primary"
            indicator-color="primary"
            align="left">
            <q-tab :name="0" :label="$t('v102.vehicle.tabtitle0')"></q-tab>
            <q-tab :name="1" :label="$t('v102.vehicle.tabtitle1')"></q-tab>
            <q-tab :name="2" :label="$t('v102.vehicle.tabtitle2')"></q-tab>
            <q-tab :name="3" :label="$t('v102.vehicle.tabtitle3')"></q-tab>
      </q-tabs>
      <teamOrder v-if="tab==0" :OrderId="OrderId"></teamOrder>
      <CharteredBusOrder :type="tab" :OrderId="OrderId" v-if="tab!=0"></CharteredBusOrder>
    </div>
</template>
<script lang="ts">
import { defineComponent, ref, reactive, toRefs, provide, onMounted, inject,watch } from 'vue'
import useMetaModule from '../../module/meta/metaModule'
import { useI18n } from 'vue-i18n'
import teamOrder from './teamOrder.vue'
import CharteredBusOrder from '../CharteredBus//CharteredBusOrder.vue'
import { DirtionmaryHelper } from '../../config/dictionary'
import { currentRouter } from 'src/router'
export default defineComponent({
    components: { teamOrder,CharteredBusOrder },
    setup() {
        const { t } = useI18n()
        let { setTitle } = useMetaModule()
        const pageTitle = inject(DirtionmaryHelper.PAGE_TITLE_KEY) as any
        pageTitle.value = t('v102.vehicle.pageTitle')
        setTitle(pageTitle.value)
        const data = reactive({
            tab: 0,
            OrderId: null as any,
        })
        watch(()=>data.tab,(o,n)=>{

        })
        if(currentRouter.currentRoute){
            if(currentRouter.currentRoute.value.params.OrderId){
                data.OrderId = currentRouter.currentRoute.value.params.OrderId
            }
            if(currentRouter.currentRoute.value.params.pages<4){
                data.tab = Number(currentRouter.currentRoute.value.params.pages)
            }else{
                data.tab = 0
            }
        }
        const menu = inject(DirtionmaryHelper.MENU_KEYS) as any
        menu.value = 6
        const methods = {
           
        }
        onMounted(() => {
            
        })
        return { ...toRefs(data), ...methods }
    },
})
</script>
<style scoped>
.date-box :deep(.q-field__control) {
    height: 20px;
}

.add {
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.shou {
    cursor: pointer;
}

.driver {
    font-size: 14px;
    font-weight: 400;
    border-bottom: 1px solid;
    margin-left: 50px;
}

.title {
    display: flex;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 10px;
}

.flex {
    display: flex;
    align-items: center;
}

th {
    padding: 10px 10px;
    font-size: 14px;
}

.table-title {
    font-size: 14px;
}

.sticky-rightrowspan-column-table2 th:last-child,
.sticky-rightrowspan-column-table2 tbody tr td {
    position: sticky !important;
    right: 0 !important;
    z-index: 1 !important;
    box-shadow: rgba(0, 0, 0, 0.05) -2px 0px 0px !important;
}
</style>
