<template>
    <global-page :padding="24" title="信息通报详情">
        <view class="mocp-cell">
            <up-cell-group v-if="details">
                <up-cell title="机号" :value="details.machineNumber || '-'" />
                <up-cell title="航站" :value="details.termin || '-'" />
                <up-cell title="机型" :value="details.planeModel || '-'" />
                <up-cell title="航司" :value="details.aviation || '-'" />
                <up-cell title="保障阶段" :value="details.tags[1]?.text || '-'" />
                <up-cell title="运行阶段" :value="details.tags[2]?.text || '-'" />
                <up-cell title="故障报告人" :value="details.reporterValue || '-'" />
                <view class="detailFaultDes">
                    <view class="title">故障描述</view>
                    <view class="content">{{ details.faultDescription }}</view>
                </view>
                <up-cell title="专业类别" :value="details.professionalValue || '-'" />
                <up-cell title="放行状态" :value="details.tags[3]?.text || '-'" />
                <template v-if="details?.releaseBasisList?.length">
                    <view
                        v-for="item of details.releaseBasisList"
                        :key="item.id"
                        @tap="toReleaseBasisDetails(item)"
                        class="detailReleaseBasis"
                    >
                        <view class="basisLf">
                            <global-icon icon="saixuan-01" /><!--wallet-->
                            <view>
                                <view>保留依据</view>
                                <view class="releaseBasis u-line-1">
                                    {{ item.releaseBasis }}
                                </view>
                            </view>
                        </view>
                        <view class="basisRt">
                            <view>故障状态(
                                <text>
                                    <custom-state size="28" :value="failureStateVal(item.failureState)" />
                                </text>
                                )
                            </view>
                            <up-icon name="arrow-right" size="18" />
                        </view>
                    </view>
                </template>

            </up-cell-group>
        </view>

        <template #bottom v-if="false">
            <view class="footer-btn">
                <up-row gutter="10">
                    <up-col span="6">
                        <global-button
                            type="primary"
                            plain
                            size="large"
                            :radius="5"
                            @tap="handleRightClick"
                        >
                            <view class="detailsFooterBtn">
                                <text>状态 （{{ details.status.toUpperCase() }}）</text>
                                <up-icon name="arrow-up" size="16" :color="$mocp-primary-7" />
                            </view>
                        </global-button>
                    </up-col>
                    <up-col span="6">
                        <global-button
                            type="primary"
                            size="large"
                            :radius="5"
                        >
                            追加
                        </global-button>
                    </up-col>
                </up-row>
            </view>
        </template>
    </global-page>

    <!--作废-->
    <StatusPopup ref="statusPopupRef" />
</template>

<script setup>
import useInforDisclosureStore from 'mocp/store/inforDisclosure'
import { storeToRefs } from 'pinia'
import { formData } from '../support-application/constants/add.compositions'
import StatusPopup from './components/status-popup.vue'
import { computed, ref } from 'vue'
import { getParamsByType } from 'mocp/hooks/use-params/useParams'

const inforDisclosureStore = useInforDisclosureStore()
const {details} = storeToRefs(inforDisclosureStore)
const statusPopupRef = ref()

const handleRightClick = () => {
    statusPopupRef.value?.open()
}

console.log(details.value)
const failureStateVal = (value) => {
    // 事件状态EventStatus
    const selectObj = getParamsByType('RetentionBasis').find(typeItem => typeItem.value == value)
    return selectObj?.label || getParamsByType('RetentionBasis')[0].label
}

const toReleaseBasisDetails = (data) => {
    uni.$mocpJump.navigateTo('/panel/inforDisclosure/releaseBasisDetails', {id: data.id}).then(() => {
        inforDisclosureStore.setState('releaseBasisDetails', data)
    })
}

</script>
<style lang="scss" scoped>
@import '../work-assignment/constants/details.scss';
@import './constants/inforDisclosure.scss';
</style>
