Joywork/templates/modals/antiznak_modals.php

<div id="antiznak_modals" class="hidden">
    <div class="full_modal-bg" v-show="is_modal_request_antiznak">
        <span class="pseudo-link closer" @click="close_modal_request"><i class="ti-close"></i></span>
            <div class="full_modal edit-modal" v-show="is_modal_request_antiznak">
                <div class="modal-inner">
                    <h2>Тарифы получения услуг очистки</h2>
                    <div class="form-block">
                        <div class="settings-block">
                            <template v-if="request_done">
                                <div v-html="request_message"></div>
                            </template>

                            <template v-else>    
                            <div style="padding-bottom: 15px; font-size: 16px;">
                                Здесь Вы можете выбрать подходящий пакет и заказать его. После заказа с Вами свяжется наш менеджер и расскажет дальнейшие действия.
                            </div>

                            <div class="jw__NB">
                                <div class="jw__NB__flat-list">
                                    <table style="width: 100%">
                                        <thead>
                                            <th>Кол-во объектов</th>
                                            <th>Стоимость</th>
                                            <th>&nbsp;</th>
                                        </thead>
                                        <tbody>
                                            <tr v-for="(tariff, index) in tariffs" :class="{'tr__color': index%2 == 0}">
            
                                                <td style="width: 45%" v-html="tariff.count"></td>
                                                <td style="width: 45%">{{ tariff.price }}<br/>
                                                    <span>({{ tariff.average }} руб за 1 объект)</span>
                                                </td>
                                                <td>
                                                    <div class="jw__object actionAdv">
                                                        <div class="jw__action-button with-check" style="width: 150px; text-align: center;">
                                                            <div style="padding-left: 8px;" class="action-button actionJW actionAdvButton" @click="request_aniznak(tariff.id)">
                                                                Заказать
                                                            </div>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>
                                        </tbody>    
                                    </table>
                                </div>
                            </div>
                            </template>
                        
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="modal-submit">
                    <button @click="close_modal_request" type="submit">Закрыть <i class="ti-angle-right"></i></button>
                </div>
            </div>
        </div>


        <div class="full_modal-bg" v-show="is_modal_photo_antiznak">
        <span class="pseudo-link closer" @click="close_modal_photo"><i class="ti-close"></i></span>
            <div class="full_modal edit-modal" v-show="is_modal_photo_antiznak">
                <div class="modal-inner">
                    <h2>Очистить фото</h2>
                    <div class="form-block">
                        <div class="settings-block">

                            <template v-if="load_photos_modal">
                                <div style="text-align:center; margin-top: 25px;">
                                    <img src="../images/rocket-spinner.svg" width="96px">
                                </div>
                            </template>
                            <template v-else>
                                <template v-if="result_photos.error">
                                    <div>
                                        <p v-for="error in result_photos.error">
                                            <i style="color:#EE6161;font-size: 23px;margin-right: 7px;" class="ti-face-sad"></i>
                                            <span>{{ error }}</span>
                                        </p>

                                    </div>
                                </template>
                                <template v-else>
                                    <div style="padding-bottom: 15px; font-size: 16px;">
                                        Для очистки фото необходимо время. Чем больше фото тем дольше обработка. Не закрывайте окно, пока обработка не закончится.
                                    </div>

                                    <div class="jw__NB">
                                        <template v-if="isEmpty(error_api) && isEmpty(result_api)">
                                            <div v-if="result_photos.photos>0" class="jw__NB__flat-list">
                                                <button type="button" @click="send_antiznak" class="old_req green_button">
                                                Отправить {{ result_photos.photos }} фотографий на обработку
                                                </button>
                                                <div style="margin-top: 20px" v-if="send_photos">
                                                    <p>Пожалуйста, подождите, фотографии обрабатываются.</p>
                                                    <vue-simple-progress bar-color="#388E3C" :val="progress" :text="progress + '%'"></vue-simple-progress>
                                                </div>
                                            </div>
                                        </template>
                                        <template v-else-if="!isEmpty(error_api)">
                                            <div>
                                                <p>
                                                    <i style="color:#EE6161;font-size: 23px;margin-right: 7px;" class="ti-face-sad"></i>
                                                    <span>{{ error_api }}</span>
                                                </p>

                                            </div>
                                        </template>
                                        <template v-else-if="!isEmpty(result_api)">
                                            <div>
                                                <p>
                                                    <i style="color:#4CAF50;font-size: 23px;margin-right: 7px;" class="ti-face-smile"></i>
                                                    <span>{{ result_api }}</span>
                                                </p>

                                            </div>
                                        </template>

                                    </div>
                                </template>
                            </template>
                        
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="modal-submit">
                    <button @click="close_modal_photo" type="submit">Закрыть <i class="ti-angle-right"></i></button>
                </div>
            </div>
        </div>
</div>  
<script type="text/javascript" src="/js/vue_scripts/antiznak_vue.js?<?=filemtime($_SERVER['DOCUMENT_ROOT'].'/js/vue_scripts/antiznak_vue.js')?>"></script>