<template>
    <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer @hide="close" :width="width" :z-index="1002">
        <template #default>
            <div>
                <div v-if="info" ref="codeImgRef" style="width: 400px; margin: 0 auto;">
                    <div class="mb-6 f-w-6 f-s-16 c-333">报名信息</div>
                    <div class="mb-6">企业名称:{{ info?.company || '-' }}</div>
                    <div class="mb-6">姓名:{{ info?.name || '-' }}</div>
                    <div class="mb-6">职务：{{ info?.position || '-' }}</div>
                    <div class="mb-6">联系电话：{{ info?.contact || '-' }}</div>
                    <div v-for="item, index in info.questionAnswer" :key="index" class="d-flex" :style="['6', '8', '9', '10'].includes(item.type) ? { 'flex-direction': 'column' } : {}">
                        <div class="d-flex mb-6">
                            <div class=" f-s-14" v-if="item.type !== '10' && item.type !== '9'">{{ item.label }}:</div>
                        </div>
                        <div class="ov-hd mb-6  f-s-14" v-if="!['5', '6', '8', '9', '10'].includes(item.type)">
                            {{item?.value || '-' }}
                        </div>
                        <div class="ov-hd mb-6  f-s-14" v-if="item.type == '5'">
                            {{item?.value.join(',') || '-' }}
                        </div>
                        <div class="ov-hd mb-6  f-s-14" v-if="item.type == '6'">
                            <FileLook v-model="item.value" :span="24"></FileLook>
                        </div>
                        <div class=" mb-6  f-s-14 d-flex flex-wrap" v-if="item.type == '8'">
                            <template v-for="(items, index) in item.value" :key="index">
                                <div class="mr-10 mb-10">
                                    <ImagePreview :src="items" :width="100" :height="100"></ImagePreview>
                                </div>
                            </template>
                        </div>
                        <!-- <div class="ov-hd mb-6  f-s-14 pt-10 pb-10 d-flex flex-wrap" v-if="item.type == '9'">
                            <template v-for="(items, index) in item.defValue.split(',')" :key="index">
                                <div class="mr-10 mb-10">
                                    <ImagePreview :src="items" :width="100" :height="100"></ImagePreview>
                                </div>
                            </template>
                        </div> -->
                        <!-- <div class="ov-hd mb-6  f-s-14 pt-10 pb-10" v-if="item.type == '10'">
                            {{ item?.defValue }}
                        </div> -->
                    </div>
                </div>
            </div>
            <div class="d-flex j-c"></div>
        </template>
    </vxe-modal>
</template>

<script setup name="SignInCode" lang="ts">
import { propTypes } from '@/utils/propTypes';
import { FileLook } from '@/views/models';
const emit = defineEmits(['update:show', 'close', 'success']);
const props = defineProps({
    show: propTypes.bool.def(false),
    title: propTypes.string.def(' '),
    width: propTypes.number.def(500),
    info: propTypes.any.def(null),
    dict: propTypes.object.def({})
});

const dialogVisible = ref(false);
const close = () => {
    emit('update:show', false);
    emit('close', false);
};
const codeImgRef = ref<HTMLElement | null>(null);
watch(
    () => props.show,
    (val) => {
        dialogVisible.value = val;
    },
    { immediate: true }
);
</script>
