<template>
    <div class='g-main'>
        <div class="top">
            <div class="left">
                <div class="card">
                    <div class="title">
                        <div><img src="../../../assets/images/index/title-icon-sqzl.png" alt="">居民档案</div>
                        <span class="title f-font14 gray" style="cursor: pointer;" @click="handlerUserInfo">详情 ></span>
                    </div>
                    <div class="f-top12">
                        <img src="../../../assets/images/index/resi.png" alt="" width="56px"> {{userInfo.name}}
                    </div>
                    <section class="bgC">
                       <left-top :resiId="userInfo.resiId"></left-top>
                    </section>
                </div>
            </div>
            <div class="right">
                <div class="card">
                    <div class="title"></div>
                </div>
            </div>
        </div>
        <div class="bottom">
            <div class="left">
                <div class="card">
                    <div class="title">
                        <div><img src="../../../assets/images/index/title-icon-jtgx.png" alt="">家庭关系</div>
                    </div>
                    <section class="bgC" style="padding: 0;">
                        <left-bto :userInfo="userInfo" ></left-bto>
                    </section>
                </div>
            </div>
            <div class="right">
                <div class="card">
                    <div class="title"></div>
                </div>
            </div>
        </div>
        <resi-info
      v-if="showedResiInfo && userInfo.resiId"
      :resi-id="userInfo.resiId"
      @close="showedResiInfo = false"
    />
    </div>
</template>
<script>
import { requestPost, requestGet } from '@/js/dai/request'
import leftTop from "./cpts/leftTop";
import leftBto from "./cpts/leftBto";
import resiInfo from "@/views/modules/cpts/resi/info";
import nextTick from "dai-js/tools/nextTick";
export default {
    //数据
    data() {
        return {
            userInfo:{},
            showedResiInfo: false,
        };
    },
    //创建前
    created() {
        this.getFamilyRelationshipList()
        this.userInfo = this.$store.state.huaXiang.userInfo
    },
    //方法
    methods: {
        async getFamilyRelationshipList() {
            let url = `/actual/base/peopleRoomOverview/getFamilyRelationshipList?type=0&resid=` + this.userInfo.resiId
            let {code,data,msg} = await requestPost(url)
            if(code == 0){
                this.familyList = data
            }else{
                this.$message.error(msg)
            }
        },
       async handlerUserInfo(){
           await nextTick();
      this.showedResiInfo = true;
        },

    },
    //子组件注册
    components: {leftTop,leftBto,resiInfo},
    //计算
    computed: {},
    //监听
    watch: {},
}
</script>

<style lang="scss" scoped>
@import "@/assets/scss/pages/huaxiang";
@import "@/assets/scss/modules/management/list-main.scss";
</style>
