<template>
|
<LoadingLayout>
|
<AppContainer>
|
<ProTabs v-model="state.tabType" hasBorder>
|
<ProTabPane lazy label="保单信息" :name="InsureOrderTabType.InsureOrderInfo">
|
<InsureOrderInfoView />
|
</ProTabPane>
|
<ProTabPane
|
v-if="detail?.status !== InsurancePolicyStatusEnum.WaitEffect"
|
lazy
|
label="批改记录"
|
:name="InsureOrderTabType.BatchOrder"
|
>
|
<BatchChangeRecordView />
|
</ProTabPane>
|
</ProTabs>
|
</AppContainer>
|
</LoadingLayout>
|
</template>
|
|
<script setup lang="ts">
|
import { AppScrollContainer, ProTabs, ProTabPane } from '@bole-core/components';
|
import InsureOrderInfoView from './components/InsureOrderInfoView.vue';
|
import BatchChangeRecordView from './components/BatchChangeRecordView.vue';
|
import * as insuranceOrderServices from '@/services/api/InsuranceOrder';
|
import { useQuery } from '@tanstack/vue-query';
|
import { InsurancePolicyStatusEnum } from '@/constants';
|
|
defineOptions({
|
name: 'InsuranceOrderDetail',
|
});
|
|
enum InsureOrderTabType {
|
InsureOrderInfo = 1,
|
BatchOrder = 2,
|
}
|
|
const state = reactive({
|
tabType: InsureOrderTabType.InsureOrderInfo,
|
});
|
|
const route = useRoute();
|
const id = route.params.id as string;
|
|
const { data: detail, isLoading } = useQuery({
|
queryKey: ['insuranceOrderServices/getInsurancePolicyHeadDto', id],
|
queryFn: async () => {
|
return await insuranceOrderServices.getInsurancePolicyHeadDto({ id: id });
|
},
|
placeholderData: () => ({} as API.GetInsurancePageOutput),
|
enabled: !!id,
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
@use '@/style/common.scss' as *;
|
</style>
|
