<?php
/*
* Plugin-Name: Product Designer App
* Plugin-URI: https://productdesignerapp.com
* Author: productdesignerapp
* Page: Orders
*/

if (!defined('ABSPATH'))
{
    exit;
}
$totals = pdapp_get_total_info();
$isDownload = isset($totals['orders']) && (int) $totals['orders'] > 10 ? false : true;
?>
<div class="modal-body" v-if="modal.type == 'download'">
    <div class="row" v-if="modal.data.designs.length > 0">
        <div class="pdapp-dowload-item" v-for="(design, did) in modal.data.designs" :class="modal.clss" :key="did">
            <template v-if="!design.loading">
                <div class="d-flex flex-column align-items-center position-relative gap-1" v-if="design.png != ''">
                    <img :src="design.png" class="img-thumbnail" alt=""/>
                    <div class="btn-group">
                        <?php if($isDownload){ ?>
                            <button class="btn btn-sm btn-primary tooltip-top" :data-tooltip="langs.order.click_to_download" @click="startDownload(design, 'svg', did)">SVG</button>
                        <?php }else{ ?>
                            <a class="btn btn-sm btn-warning tooltip-top" :data-tooltip="langs.order.click_to_download" href="<?php echo esc_url(PDAPP_HOME_URL. '/shop/woocommerce');?>" target="_blank">{{ langs.upgrade_basic }}</a>
                        <?php } ?>
                    </div>
                </div>
            </template>
            <div class="pdapp-download-design placeholder-glow" v-else><span class="placeholder w-100"></span></div>
        </div>
    </div>

    <hr v-if="modal.data.designs > 0 && modal.data.team.length" class="p-0 m-0 w-100">

    <template v-if="modal.data.team.length">
        <div class="fw-bold">{{ langs.order.team_members }}</div>
        <div class="row">
            <template v-for="(team, tid) in modal.data.teams">
                <div :key="tid" v-if="team.loading" class="placeholder-glow"><span class="placeholder"></span></div>
                <div class="pdapp-dowload-item col-12 col-sm-6 col-lg-4 col-xl-3" v-for="(teamdt, sid) in team.team" :key="sid">
                    <div class="card card-inverse mb-2 border d-flex flex-column justify-content-center align-items-center bg-light">
                        <img :src="teamdt.png" class="card-img img-fluid" alt=""/>
                        <div class="card-img-overlay p-1">
                            <div class="d-flex flex-column justify-content-between h-100">
                                <h5 class="header-title fs-6 m-0 p-0 d-flex flex-column" v-if="team.name != 'undefined' || team.number != 'undefined'">
                                    <small v-if="team.name != 'undefined'">{{ team.name }}</small>
                                    <small v-if="team.number != 'undefined'">{{ team.number }}</small>
                                </h5>
                                <div class="btn-group">
                                    <?php if($isDownload){ ?>
                                        <button type="button" class="btn btn-sm btn-primary tooltip-top" :data-tooltip="langs.order.click_to_download" @click="startDownload(teamdt, 'svg', tid)">SVG</button>
                                    <?php }else{ ?>
                                        <a class="btn btn-sm btn-warning tooltip-top" :data-tooltip="langs.order.click_to_download" href="<?php echo esc_url(PDAPP_HOME_URL. '/shop/woocommerce');?>" target="_blank">{{ langs.upgrade_basic }}</a>
                                    <?php } ?>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </template>
        </div>
    </template>
    
    <div class="pdapp-loading-mask pdapp-loading-page" v-if="modal.loading">
        <div class="pdapp-spinner"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    </div>
</div>