Перейти к содержанию
Авторизация  
Grek

Всплывающие окно

Рекомендуемые сообщения

Не могу понять сделал всплывающие окно, но кнопка "ПОНЯТНО" не работает просто жму и не чего не происходит, как понимаю надо подключить скрипт, но не могу понять как именно подскажите как правильно подключить кусок скрипта. 

Этот кусок отвечает за закрытие окна надо его вставить в другой кусок смотрите ниже

Спойлер

<script>
    import axios from 'axios';

    export default {
        data() {
            return {
                user: [],
                activeTab: 'items',
                type: '',
                trade_link: '',
                items: [],
                contracts: [],
                page: 0,
                morePage: false,
                loadingMore: false,
                withdraw_price: 0,
                modalError: {
                    active: false
                },
                modalSuccess: {
                    active: false
                }
            }
        },
        methods: {
            async get() {
                const request = await axios.post('/api/users/get', {id: this.$route.params.id});

                if (request.data.success) {
                    this.type = request.data.type;
                    this.user = request.data.user;
                    this.trade_link = this.user.trade_link;

                    this.loadItems();

                    this.$root.hideLoading();
                } else {
                    this.$router.go(-1);
                }
            },
            async saveLink() {
                const request = await axios.post('/api/users/saveLink', {trade_link: this.trade_link});
                const data = request.data;

                $.wnoty({
                    type: data.type,
                    message: data.message
                });
            },
            async loadItems() {
                this.loadingMore = true;
                const request = await axios.post('/api/users/items', {id: this.$route.params.id, page: this.page += 1});

                const array = this.items;
                Array.prototype.push.apply(array, request.data.items);

                this.items = array;
                this.morePage = request.data.more;
                this.loadingMore = false;
            },
            async loadContracts() {
                this.loadingMore = true;
            },
            async sellItem(id, i) {
                const request = await axios.post('/api/users/sell', {id: id});
                const data = request.data;

                this.$root.getBalance();

                if (data.type === 'success') {
                    if (this.user.allPrice[0].myBet !== null) this.user.allPrice[0].myBet = parseInt(this.user.allPrice[0].myBet) - parseInt(this.items.item.price);
                    this.items.status = 1;
                    this.$forceUpdate();
                }

                $.wnoty({
                    type: data.type,
                    message: data.message
                });
            },
            async buyItem(id, i) {
                const request = await axios.post('/api/users/buy', {id: id});
                const data = request.data;

                if (data.type === 'success') {
                    this.items.status = data.status;
                    this.$forceUpdate();
                }

                if (data.type === 'min') {
                    this.withdraw_price = data.withdraw_price;
                    this.openErrorModal();
                } else if (data.type === 'success') {
                    this.openSuccessModal();
                } else {
                    $.wnoty({
                        type: data.type,
                        message: data.message
                    });
                }
            },
            async loadTab(tab) {
                switch (tab) {
                    case 'items':
                        this.loadItems();
                        this.activeTab = 'items';
                        break;
                    case 'contracts':
                        this.loadContracts();
                        this.activeTab = 'contracts';
                        break;
                }
            },
            async sellAll() {
                $.wnoty({
                    type: 'info',
                    message: 'Продаем предметы'
                });

                const request = await axios.post('/api/users/sellAll');
                const data = request.data;

                if (data.type === 'success') {
                    for (let i in this.items) {
                        this.items.status = 1;
                    }
                    this.$root.getBalance();
                    this.user.allPrice[0].myBet = 0;
                    this.$forceUpdate();
                }

                $.wnoty({
                    type: data.type,
                    message: data.message
                });
            },
            openErrorModal() {
                const vm = this;

                this.modalError.active = true;

                setTimeout(() => {
                    $('body').click(function (event) {
                        if ($(event.target).is('.styles_overlayCenter__YHoO7')) {
                            vm.modalError.active = false;
                        }
                    });

                    $('.modal__close').click(function (event) {
                        vm.modalError.active = false;
                    });
                }, 100);
            },
            openSuccessModal() {
                const vm = this;

                this.modalSuccess.active = true;

                setTimeout(() => {
                    $('body').click(function (event) {
                        if ($(event.target).is('.styles_overlayCenter__YHoO7')) {
                            vm.modalSuccess.active = false;
                        }
                    });

                    $('.modal__close').click(function (event) {
                        vm.modalSuccess.active = false;
                    });
                }, 100);
            }
        },
        mounted() {
            this.$root.showLoading();
            this.get();
        },
        sockets: {
            setItemStatus: function (drop) {
                if (this.$root.user !== null && parseInt(drop.user_id) === parseInt(this.$root.user.id)) {
                    for (let [key, value] in this.items) {
                        if (this.items[key].id === drop.id) {
                            this.items[key].status = drop.status;
                            if (drop.status === 5) this.items[key].trade_id = drop.trade_id;
                            if (drop.status === 6) this.items[key].hover = 'item--hover';
                            this.$forceUpdate();
                        }
                    }
                }
            }
        }
    }
</script>

Вот кусок кода который отвечает за всплывающие окно 

                <div class="styles_overlay__CLSq- styles_overlayCenter__YHoO7">
                    <div class="styles_modal__gNwvD modal">
                        <div class="modal__title">текст</div>
                        <div class="modal-body pb-1 pt-0 text-center py-4"><i
                                class="fad fa-check-circle mb-4 fa-4x" style="color: #48cb64;"></i>
                                    <br>текст<br/>

                                    <span style="color: red;">
                                        Внимание! текст.
                                    </span>
                                    <br><span style="color: green;">
                                        Внимание! текст.
                                    </span><br/>
                            <div class="modal__form-wrapper">
                                <button class="modal__balance-btn" @click="modalSuccess.active = false">Понятно</button>
                            </div>
                        </div>
                        <button class="styles_closeButton__20ID4 modal__close">
                            <svg class="styles_closeIcon__1QwbI" xmlns="http://www.w3.org/2000/svg" width="28" height="28"
                                 viewBox="0 0 36 36">
                                <path d="M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z"></path>
                            </svg>
                        </button>
                    </div>
                </div>
            </div>

подскажите какой кусок того скрипта надо вставить в этот кусок что бы кнопки закрыть и "ПОНЯТНО" заработали. За помощь тыкну плюсик

Изменено пользователем Grek

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

КТО ПОМОЖЕТ СДЕЛАТЬ ЗАПЛАЧУ ПИШИТЕ В ЛС

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Сам скрипт прописывать в scripts
css не забываем..

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти
Авторизация  

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×
×
  • Создать...