<template>
    <z-paging ref="paging" bgColor="#f7f7f7" safe-area-inset-bottom paging-class="paging-btm-shadow" refresher-only @onRefresh="onRefresh" scroll-with-animation>
        <template #top>
            <ut-navbar title="往来单位详情" :fixed="false" border></ut-navbar>
        </template>

        <template>
            <view class="pd-24 bg-#fff mb-10">
                <!-- 往来单位类型 -->
                <view class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">往来单位类型：</span>
                    <span class="c-#333 f-w-600">
                        {{ (form?.cpyType && form.cpyType.length) ? selectDictLabels(pt_cpy_type, form.cpyType, ',') : '-' }}
                    </span>
                </view>
                <!-- 往来单位性质 -->
                <view class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">往来单位性质：</span>
                    <span class="c-#333 f-w-600">{{ selectDictLabel(pt_cus_type, form?.cusType) || '-' }}</span>
                </view>

                <!-- 个人 / 单位 信息 -->
                <template v-if="form?.cusType == '1'">
                    <view class="f-s-30 pd2-16-0 info-border-bottom">
                        <span class="c-#666">姓名：</span>
                        <span class="c-#333 f-w-600">{{ form?.cusName || '-' }}</span>
                    </view>
                    <view class="f-s-30 pd2-16-0 info-border-bottom">
                        <span class="c-#666">身份证号：</span>
                        <span class="c-#333 f-w-600">{{ form?.cusCode || '-' }}</span>
                    </view>
                </template>
                <template v-else>
                    <view class="f-s-30 pd2-16-0 info-border-bottom">
                        <span class="c-#666">往来单位名称：</span>
                        <span class="c-#333 f-w-600">{{ form?.cusName || '-' }}</span>
                    </view>
                    <view class="f-s-30 pd2-16-0 info-border-bottom">
                        <span class="c-#666">统一社会信用代码/组织机构代码：</span>
                        <span class="c-#333 f-w-600">{{ form?.cusCode || '-' }}</span>
                    </view>
                </template>

                <!-- 细分类型 -->
                <view class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">细分类型：</span>
                    <span class="c-#333 f-w-600">{{ selectDictLabel(pt_subdivision_type, form?.subdivisionType) || '-' }}</span>
                </view>

                <!-- 联系人 -->
                <view v-if="form?.contact" class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">联系人：</span>
                    <span class="c-#333 f-w-600">{{ form?.contact }}</span>
                </view>

                <!-- 联系电话 -->
                <view v-if="form?.contactTel" class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">联系电话：</span>
                    <span class="c-#333 f-w-600">{{ form?.contactTel }}</span>
                </view>

                <!-- 所在地区 -->
                <view class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">往来单位所在地区：</span>
                    <span class="c-#333 f-w-600">{{ form?.adcdCodeName || '-' }}</span>
                </view>

                <!-- 详细地址 -->
                <view class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">往来单位具体地址：</span>
                    <span class="c-#333 f-w-600">{{ form?.address || '-' }}</span>
                </view>

                <!-- 邮编，仅在特定往来单位类型下展示 -->
                <view v-if="form?.cpyType && form.cpyType.includes('3') && form.postcode" class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">邮编：</span>
                    <span class="c-#333 f-w-600">{{ form?.postcode }}</span>
                </view>

                <!-- 备注 -->
                <view v-if="form?.remark" class="f-s-30 pd2-16-0 info-border-bottom">
                    <span class="c-#666">备注：</span>
                    <span class="c-#333 f-w-600">{{ form?.remark }}</span>
                </view>
            </view>
        </template>

        <template #empty>
            <ut-empty class="mg-at" size="28rpx" color="#999" padding="10rpx">暂无往来单位详情</ut-empty>
        </template>
        <template #bottom>
            <view class="pd3-10-24-24">
                <view class="f-s-24 c-#ccc pd-12">
                    <span class="mr-30">最新修改人: {{ form?.operatorName || '-' }}</span>
                    <span>最新修改时间: {{ form?.operateTime || '-' }}</span>
                </view>
                <up-button type="primary" @click="clickEdit">修改</up-button>
            </view>
        </template>
    </z-paging>
</template>

<script setup lang="ts">
import { useClientRequest } from '@/utils/request';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { pt_cus_type, pt_cpy_type, pt_subdivision_type } = toRefs<any>(
    proxy?.useDict('pt_cus_type', 'pt_cpy_type', 'pt_subdivision_type')
);

const paging = ref<any>(null);
const form = ref<any>({});
const did = ref('');

// 获取详情（往来单位信息）
const getDetailById = async (id: string) => {
    if (!id) return;
    const res = await useClientRequest.get(`/plt-api/app/customer/getInfo/${id}`);
    if (res && res.code === 200) {
        form.value = res.data || {};
    }
};

const onRefresh = () => {
    getDetailById(did.value);
    paging.value?.complete();
};

const clickEdit = () => {
    uni.$on('contact-unit-detail-refresh', () => {
        getDetailById(did.value);
        uni.$off('contact-unit-detail-refresh');
    });
    uni.$u.route({
        type: 'navigateTo',
        url: '/plant/contact-unit/unit-edit/index',
        params: {
            id: did.value,
        },
    });
};

// 页面入参解析并加载
onLoad((options: any) => {
    did.value = options?.id || '';
    getDetailById(did.value);

});
onMounted(() => {
    uni.$on('refreshContactUnitDetail', () => {
        getDetailById(did.value);
    });
});
</script>

<style lang="scss" scoped>
.z-paging-wrap {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
}
.startline-title {
    font-size: 32rpx;
    font-weight: 600;
    color: #333;
}
</style>