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

if (!defined('ABSPATH'))
{
    exit;
}
?>
<template v-if="modal.type == 'saveDesign'">
    <div class="modal-body">
        <div class="pdapp-savedesign d-flex flex-column gap-2">
            <div class="w-100">
                <label class="form-label">{{ langs.topbar.design_name }}</label>
                <input type="text" class="form-control" v-model="modal.data.title" :class="modal.data.title == '' ? 'is-invalid' : ''" :placeholder="langs.topbar.title_desc">
            </div>
            <div class="w-100" v-if="customerMail == ''">
                <label class="form-label">{{ langs.topbar.your_email }}</label>
                <div class="input-group input-group-merge">
                    <span class="input-group-text bg-white ps-2 pe-1">
                        <i class="material-icons material-symbols-outlined">mail</i>
                    </span>
                    <input type="email" class="form-control" :class="checkEmail(modal.data.email) != '' ? 'is-invalid' : ''" v-model="modal.data.email" :placeholder="langs.topbar.your_email_desc">
                    <span class="invalid-feedback" v-if="checkEmail(modal.data.email) != ''">{{ checkEmail(modal.data.email) }}</span>
                </div>
            </div>
        </div>
    </div>

    <div class="modal-footer pb-1 pt-1">
        <button type="button" class="btn btn-light" @click="modal.show = false">{{ langs.cancel }}</button>
        <button type="button" class="btn btn-primary" :disabled="modal.data.title == '' || checkEmail(modal.data.email) != '' || modal.data.loading || modal.data.render" @click="saveDesign('')" v-if="modal.type == 'saveDesign'">
            <span v-if="modal.data.loading" class="spinner-border spinner-border-sm me-1" role="status" aria-hidden="true"></span>
            <template v-if="modal.data.render">{{ langs.topbar.rendering }}</template>
            <template v-else>{{ langs.topbar.save_design }}</template>
        </button>
    </div>
</template>