/
keller1
/
KellerAPI
Обзор
Документация
Войти
/
keller1
/
KellerAPI
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
main
frontend/src/components/AddTask.vue
66 строк
1 KB
keller1
todolist
16 апр 2026, 16:35
16 апр 2026, 16:35
93b5b4e
Код
Авторство
О чём код?
<script setup> import { ref } from 'vue' const emit = defineEmits(['add']) const taskTitle = ref('') const addTaskAction = () => { if (!taskTitle.value.trim()) { alert('Поле пустое') return } emit('add', { title: taskTitle.value.trim() }) taskTitle.value = '' } </script> <template> <div class="add-task"> <input v-model="taskTitle" type="text" placeholder="Введите название задачи" @keyup.enter="addTaskAction" /> <button class="add-btn" @click="addTaskAction"> + </button> </div> </template> <style scoped> .add-task { display: flex; gap: 8px; margin-bottom: 16px; } .add-task input { flex: 1; border-radius: 8px; border: none; background: #f4f4f4; padding: 10px 12px; font-size: 14px; outline: none; } .add-btn { width: 40px; border-radius: 8px; border: none; background: #00a2ff; color: #fff; font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; } .add-btn:hover { background: #0086d4; } </style>