<template>
    <div class="relative -translate-y-2/4" style="margin-top: 10px;color: black;">
        <template v-if="imgSrcId==14">
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 95px;top: 110px;">{{ dataFlow.userName }}</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" v-if="dataFlow.sex==1" style="left: 446px;top: 110px;">√</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" v-else style="left: 474px;top: 110px;">√</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 96px;top: 135px;">√</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 96px;top: 135px;">√</h3>
            <h3 class="subpixel-antialiased  text-xl text-center absolute" style="left: 96px;top: 165px;">{{ dataFlow.idNumber }}</h3>
            <h3 class="subpixel-antialiased  text-xl text-center absolute" style="left: 340px;top: 230px;">{{ dataFlow.phone }}</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 76px;top: 250px;">√</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 169px;top: 432px;">√</h3>
        </template>
        <template v-else-if="imgSrcId==13 || imgSrcId==442 || imgSrcId==23 || imgSrcId==431">
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 90px;top: 78px;">姓名：{{ dataFlow.userName }}</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 90px;top: 150px;">性别：{{ dataFlow.sex==1? '男': '女' }}</h3>
            <!-- <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 270px;top: 115px;">汉</h3> -->
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 80px;top: 222px;">出生日期：{{ dataFlow.birthday }}</h3>
            <!-- <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 220px;top: 177px;">{{ dataFlow.birthday.split('-')[1] }}</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 290px;top: 177px;">{{ dataFlow.birthday.split('-')[2] }}</h3> -->
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 90px;top: 267px;">地址：{{ dataFlow.mailbox }}</h3>
            <h3 class="subpixel-antialiased  text-2xl text-center absolute" style="left: 90px;top: 338px;">身份证号码：{{ dataFlow.idNumber }}</h3>
        </template>
        <img :src="imgSrc" class="imgPop imgIndex min-w-full " :alt="imgSrcName" :title="imgSrcName">
        <slot />
    </div>
    
</template>

<script>
import { mapGetters } from 'vuex'
import { getOperation } from '@/api/http';

export default {
    props: {
        imgSrc: {
            type: String,
            require: true
        },
        imgSrcId: {
            require: true
        },
        imgSrcName: {
            require: true
        },
        // requireTalk: {
        //     type: String,
        //     default: ''
        // },
        // others: {
        //     type: Object,
        //     default: {
        //         left: '0px',
        //         top: '0px'
        //     }
        // }
    },
    mounted() {
        
    },
    watch: {
        // 盖章逻辑 挂着
        // imgSrc: {
        //     handler(newVal) {
        //         if(newVal) {
        //             getOperation({
        //                 parentId: '285,' + this.$store.state.system.businessSelect[this.$store.state.system.businessKey].id   +  ',287,8'
        //             }).then((data)=>{
        //                 const stampJudge = {
        //                     18: {add:[24, 21], delete: [14]},
        //                     452:{ add: [432, 433] },
        //                     458:{ add: [419, 418], delete: [426]},
        //                     459:{ add: [478, 477], delete: [407]},
        //                     460:{ add: [466,468,467], delete: [406]},
        //                     463:{ add: [480, 488], delete: [413]},
        //                     464:{ add: [482, 481], delete: [479]},
        //                     444:{ add: [420, 421], delete: [425]},
        //                     445:{ add: [422, 424], delete: [427]},
        //                     446:{ add: [419, 418], delete: [426]},
        //                     447:{ add: [269, 22], delete: [17]},
        //                     455:{ add: [487, 441], delete: [409]},
        //                     456:{ add: [473, 472], delete: [411]},
        //                     457:{ add: [476, 474], delete: [412]}
        //                 }

        //                 if(data.status == 200 && data.data.judgmentRuleReqs) {
        //                     // const list = data.data.judgmentRuleReqs.map(item => item.answerId)
        //                     console.log(data.data.judgmentRuleReqs)
        //                 }
        //             })
        //         }
        //     },
        //     immediate: true
        // }
    },
    computed: {
        ...mapGetters({
            dataFlow: 'system/dataFlow'
        })
    }
}
</script>

<style>

</style>