<template>
    <el-container class="flex-column">
        <el-main class="nopadding">
            <div class="table-container">
                <el-skeleton :rows="5" v-if="loading" />
                <sc-title :title="dataInfo.truename" v-if="!loading"></sc-title>
                <el-descriptions title="" direction="vertical" :column="1" border style="margin-bottom:10px;" v-if="!loading">
                    <el-descriptions-item label="店铺编码"> {{dataInfo.store_code}} </el-descriptions-item>
                    <el-descriptions-item label="负责人姓名">{{dataInfo.store_mch}}</el-descriptions-item>
                    <el-descriptions-item label="联系电话">{{dataInfo.mobile}}</el-descriptions-item>
                    <el-descriptions-item label="门店地址">{{dataInfo.store_address}}</el-descriptions-item>
                    <el-descriptions-item label="门店类型"> {{dataInfo.type_name}} </el-descriptions-item>
                    <el-descriptions-item label="创建时间"> {{dataInfo.create_at}} </el-descriptions-item>
                    <el-descriptions-item label="营业执照"> 
                        <el-image style="width: 100px; height: 100px" 
                        :src="dataInfo.license" 
                        fit="cover" 
                        :preview-src-list="[dataInfo.license]" 
                        :zoom-rate="1.2" 
                        :max-scale="7"
                        :min-scale="0.2"></el-image>
                    </el-descriptions-item>
                </el-descriptions>
            </div>
        </el-main>
    </el-container>
</template>

<script>
export default {
    data(){
        return {
            dataInfo:{},
            loading:false
        }
    },
    mounted(){
        this.getDetail()
    },
    methods:{
        async getDetail(){
            this.loading = true;
            var resp = await this.$API.storeDetail.data.get();
            this.loading = false;
            if (resp.code == 0) {
                return this.$message.warning(resp.msg)
            }
            this.dataInfo = resp.data;
        }
    }
}
</script>