admin/probody
1
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Исправили ошибки на которые указал тестировщик

Browse Source
This commit is contained in:
alisagerasimova
2026-03-16 14:59:27 +03:00
parent f7ae74dd9b
commit b43057e750
4 changed files with 92 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+28 -24
View File
@@ -1,7 +1,7 @@
<script setup>
import {ref, onMounted, h} from "vue";
import { ref, onMounted, h } from "vue";
import izitoast from "@/shared/izitoast";
import {useEventListener} from "@vueuse/core";
import { useEventListener } from "@vueuse/core";
import MyDialog from "@/components/MyDialog.vue";
import MyDropMenu from "@/components/MyDropMenu.vue";
import copyToclipboard from "@/shared/copyToclipboard";
@@ -112,7 +112,7 @@ function cancel() {
function cleanResult() {
clickCount.value = 1;
listOfTrips.value.forEach(item => {
numbers.value.forEach(item => {
item.isPlatform = false;
item.isQR = false;
item.variable = [];
@@ -142,7 +142,7 @@ function copyAndToast(text) {
function handleDownloadBtn() {
// Создание файла
const downloadUrl = ref('');
const blob = new Blob([finallyText.value], {type: 'text/plain'});
const blob = new Blob([finallyText.value], { type: 'text/plain' });
downloadUrl.value = URL.createObjectURL(blob);
// Задержка для избежания ошибок в некоторых браузерах
setTimeout(() => {
@@ -174,8 +174,10 @@ function createPlatform(item, color) {
}
function deletePlatform(item) {
item.BgImg = 'images/ArUco-marker.jpg'
item.isPlatform = false
if (item.isPlatform) {
item.BgImg = 'images/ArUco-marker.jpg'
item.isPlatform = false
}
}
function createQR(item) {
@@ -190,8 +192,10 @@ function createQR(item) {
}
function deleteQR(item) {
item.BgImg = 'images/ArUco-marker.jpg'
item.isQR = true
if (item.isQR) {
item.BgImg = 'images/ArUco-marker.jpg'
item.isQR = false
}
}
function deletePointMap(item) {
@@ -288,9 +292,8 @@ function onContextMenu(e, item) {
<template>
<div class="wraper">
<div class="grid">
<div class="square" v-for="(item, index) in numbers" :data-key="index" :key="index"
@click="setNumber(item)" @contextmenu.prevent="onContextMenu($event, item)"
:style="{backgroundImage: `url(${item.BgImg})`}">
<div class="square" v-for="(item, index) in numbers" :data-key="index" :key="index" @click="setNumber(item)"
@contextmenu.prevent="onContextMenu($event, item)" :style="{ backgroundImage: `url(${item.BgImg})` }">
{{ numbers[index].variable.join(", ") }}
</div>
</div>
@@ -300,15 +303,11 @@ function onContextMenu(e, item) {
<custom-button class="actions__btn" @click="cleanResult">Очистить</custom-button>
<custom-button class="actions__btn" @click="cancel">Отменить</custom-button>
</div>
<MyDropMenu/>
<MyDropMenu />
</div>
<MyDialog
v-model:show="isModalVisible"
class="dialogWindow"
:is-success=Boolean(listOfTrips.length)
>
<MyDialog v-model:show="isModalVisible" class="dialogWindow" :is-success=Boolean(listOfTrips.length)>
<template #header>
<strong v-if="listOfTrips.length">Код готов!</strong>
<strong v-else>Код не готов!</strong>
@@ -328,13 +327,17 @@ function onContextMenu(e, item) {
</template>
<style>
* {
font-family: 'Courier New', Courier, monospace;
}
html {
background-image: radial-gradient(#383838e2, #222222);
background-image: radial-gradient(#23aae3e2, #222222);
font-size: 18px;
}
:root {
--side: 70px;
--side: 75px;
}
.wraper {
@@ -346,7 +349,7 @@ html {
display: grid;
padding: 3px;
grid-template-columns: repeat(10, var(--side));
gap: 10px;
gap: 5px;
user-select: none;
}
@@ -364,9 +367,10 @@ html {
color: white;
text-shadow: -1px -1px 0 black,
1px -1px 0 black,
-1px 1px 0 black,
1px 1px 0 black;
1px -1px 0 black,
-1px 1px 0 black,
1px 1px 0 black;
box-sizing: border-box;
}
.square:hover {
@@ -396,6 +400,6 @@ html {
.actions button {
padding: 20px 35px;
/* background-color: red; */
/* background-color: red; */
}
</style>
src/components/MyDialog.vue
+12 -7
View File
@@ -2,19 +2,19 @@
<transition name="modal-fade">
<div class="modal-backdrop" v-if="show" @click.stop="$emit('update:show', false)">
<div class="modal" @click.stop>
<header :class="['modal-header', isSuccess ? 'modal-header-success': 'modal-header-error']">
<header :class="['modal-header', isSuccess ? 'modal-header-success' : 'modal-header-error']">
<slot name="header">
<strong>Заголовок по умолчанию</strong>
</slot>
<button class="modal-btn-close" @click.stop="$emit('update:show', false)"
aria-label="Закрыть модальное окно">
aria-label="Закрыть модальное окно">
×
</button>
</header>
<section class="modal-body">
<slot>Тело по умолчанию</slot>
</section>
<footer :class="['modal-footer', isSuccess ? 'modal-footer-success': 'modal-footer-error']">
<footer :class="['modal-footer', isSuccess ? 'modal-footer-success' : 'modal-footer-error']">
<slot name="footer">
<button @click.stop="$emit('update:show', false)">Закрыть</button>
</slot>
@@ -38,6 +38,10 @@ const props = defineProps({
</script>
<style>
:root {
--successColor: #4ee882
}
.modal-backdrop {
position: fixed;
top: 0;
@@ -74,7 +78,7 @@ const props = defineProps({
}
.modal-header-success {
color: #4AAE9B;
color: var(--successColor);
}
.modal-header-error {
@@ -89,17 +93,18 @@ const props = defineProps({
.modal-footer {
justify-content: flex-end;
border-top: 1px solid white;
}
.modal-footer button {
justify-content: flex-end;
border-top: 1px solid white;
padding: 5px;
color: white;
color: rgb(0, 0, 0);
}
.modal-footer-success button {
background-color: #4AAE9B;
background-color: var(--successColor);
border: none;
margin: 3px;
}
@@ -124,4 +129,4 @@ const props = defineProps({
color: red;
background: transparent;
}
</style>
</style>
src/components/MyDropMenu.vue
+43 -26
View File
@@ -1,12 +1,7 @@
<template>
<div class="navigation-wrapper">
<!-- Кнопка Бургер -->
<button
class="burger-btn"
@click="toggleMenu"
:class="{ 'is-active': isOpen }"
aria-label="Menu"
>
<button class="burger-btn" @click="toggleMenu" :class="{ 'is-active': isOpen }" aria-label="Menu">
<span class="line"></span>
<span class="line"></span>
<span class="line"></span>
@@ -29,10 +24,7 @@
</nav>
</aside>
</transition>
<MyDialog
isSuccess
v-model:show="isModalVisible"
>
<MyDialog isSuccess v-model:show="isModalVisible">
<template #header>
<strong>{{ infoCard.title }}</strong>
</template>
@@ -40,16 +32,18 @@
<p>{{ infoCard.body }}</p>
</main>
<template #footer>
<custom-button title="Посмотреть на stepike">Курс</custom-button>
<custom-button title="Посмотреть в официальной документации">Документация</custom-button>
<custom-button>ОК</custom-button>
<div class="navigation-wrapper__footer">
<custom-button :to="infoCard.hrefToCourse" title="Посмотреть на Stepik">Курс</custom-button>
<custom-button :to="infoCard.hrefToDoc" title="Посмотреть в официальной документации">Документация</custom-button>
<custom-button @click="isModalVisible = false">ОК</custom-button>
</div>
</template>
</MyDialog>
</div>
</template>
<script setup>
import {ref} from 'vue';
import { ref } from 'vue';
import MyDialog from "@/components/MyDialog.vue";
import CustomButton from '@/components/UI/CustomButton.vue'
@@ -73,9 +67,9 @@ function openInfoCard(obj) {
const links = [
{
title: 'Что такое ROS?',
body: 'ROS — переводится как robot operation system',
hrefToDoc: 'https://clover.coex.tech/ru/simple_offboard.html',
hrefToCourse: 'https://stepic.org'
body: 'ROS (Robot Operating System) — экосистема для программирования роботов с открытым исходным кодом',
hrefToDoc: 'https://www.ros.org/',
hrefToCourse: 'https://stepik.org/lesson/2260739/step/1?unit=2294748'
},
{
title: '2',
@@ -134,15 +128,17 @@ const links = [
]
// Экспортируем методы, если захотим управлять меню извне
defineExpose({open: () => (isOpen.value = true), close: closeMenu});
defineExpose({ open: () => (isOpen.value = true), close: closeMenu });
</script>
<style scoped>
.burger-btn {
position: fixed; /* Она всегда на одном месте при скролле */
position: fixed;
/* Она всегда на одном месте при скролле */
top: 20px;
left: 20px;
z-index: 9999; /* Максимальный приоритет, чтобы быть ПОВЕРХ всего */
z-index: 9999;
/* Максимальный приоритет, чтобы быть ПОВЕРХ всего */
display: flex;
flex-direction: column;
justify-content: space-around;
@@ -158,10 +154,17 @@ h1 {
text-align: center;
}
.menu-content {
display: flex;
flex-direction: column;
gap: 10px;
}
.line {
width: 100%;
height: 4px;
background-color: #383838; /* Ярко-красный цвет для теста */
background-color: #383838;
/* Ярко-красный цвет для теста */
transition: all 0.3s ease;
}
@@ -185,7 +188,8 @@ h1 {
left: 0;
width: 240px;
height: 100%;
background: white;
background-image: radial-gradient(#23aae3e2, #222222);
color: white;
z-index: 1000;
padding: 0 20px 20px;
overflow-y: scroll;
@@ -199,22 +203,35 @@ h1 {
width: 100vw;
height: 100vh;
z-index: 2;
background-color: #333333;
opacity: 90%;
display: flex;
}
.navigation-wrapper__footer {
display: flex;
gap: 10px;
width: 100%;
}
/* Анимации появления */
.slide-enter-active, .slide-leave-active {
.slide-enter-active,
.slide-leave-active {
transition: transform 0.3s ease;
}
.slide-enter-from, .slide-leave-to {
.slide-enter-from,
.slide-leave-to {
transform: translateX(-100%);
}
.fade-enter-active, .fade-leave-active {
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.3s ease;
}
.fade-enter-from, .fade-leave-to {
.fade-enter-from,
.fade-leave-to {
opacity: 0;
}
</style>
src/components/UI/CustomButton.vue
+9 -3
View File
@@ -13,11 +13,11 @@ const props = defineProps({
</script>
<template>
<a v-if="to" :href="props.to" class="btn">
<slot/>
<a v-if="to" :href="props.to" target="_blank" class="btn">
<slot />
</a>
<button v-else class="btn">
<slot/>
<slot />
</button>
</template>
@@ -31,5 +31,11 @@ const props = defineProps({
color: white;
width: 100%;
font-size: 17px;
text-decoration: none;
box-sizing: border-box;
text-align: center;
font-family: 'Courier New', Courier, monospace;
margin: 0;
}
</style>