Merge pull request 'v2.0' (#7) from dev into master

Reviewed-on: #7

.gitea/workflows/build-image.yaml

@@ -7,7 +7,7 @@ jobs:
     env:
       IMAGE_NAME: tladle
       REGISTRY_NAME: gitea.sc0tt.org
-      GIT_TAG: 1.2.1 
+      GIT_TAG: 2.0
     runs-on: ubuntu-latest
     steps:
       - name: Checkout

app/Filament/Resources/TlaSuggestions/Pages/ManageTlaSuggestions.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Filament\Resources\TlaSuggestions\Pages;
+
+use App\Filament\Resources\TlaSuggestions\TlaSuggestionResource;
+use Filament\Actions\CreateAction;
+use Filament\Resources\Pages\ManageRecords;
+
+class ManageTlaSuggestions extends ManageRecords
+{
+    protected static string $resource = TlaSuggestionResource::class;
+
+    protected function getHeaderActions(): array
+    {
+        return [
+            CreateAction::make(),
+        ];
+    }
+}

app/Filament/Resources/TlaSuggestions/TlaSuggestionResource.php

@@ -0,0 +1,96 @@
+<?php
+
+namespace App\Filament\Resources\TlaSuggestions;
+
+use App\Filament\Resources\TlaSuggestions\Pages\ManageTlaSuggestions;
+use App\Models\TlaSuggestion;
+use BackedEnum;
+use Filament\Actions\BulkActionGroup;
+use Filament\Actions\DeleteAction;
+use Filament\Actions\DeleteBulkAction;
+use Filament\Actions\EditAction;
+use Filament\Forms\Components\Select;
+use Filament\Forms\Components\TextInput;
+use Filament\Forms\Components\Textarea;
+use Filament\Resources\Resource;
+use Filament\Schemas\Schema;
+use Filament\Support\Icons\Heroicon;
+use Filament\Tables\Columns\TextColumn;
+use Filament\Tables\Table;
+use Filament\Actions\Action;
+
+class TlaSuggestionResource extends Resource
+{
+    protected static ?string $model = TlaSuggestion::class;
+
+    protected static string|BackedEnum|null $navigationIcon = Heroicon::OutlinedRectangleStack;
+
+    protected static ?string $recordTitleAttribute = 'Suggestions';
+
+    public static function form(Schema $schema): Schema
+    {
+        return $schema
+            ->components([
+                TextInput::make('acronym')
+                    ->required(),
+                TextInput::make('hint')
+                    ->default(null),
+                Select::make('language')
+                    ->options(['hu' => 'Hu', 'en' => 'En'])
+                    ->required(),
+                Textarea::make('context')
+                    ->default(null)
+                    ->columnSpanFull(),
+                TextInput::make('submitter')
+                    ->default(null),
+            ]);
+    }
+
+    public static function table(Table $table): Table
+    {
+        return $table
+            ->recordTitleAttribute('Suggestions')
+            ->columns([
+                TextColumn::make('acronym')
+                    ->searchable(),
+                TextColumn::make('hint')
+                    ->searchable(),
+                TextColumn::make('language')
+                    ->badge(),
+                TextColumn::make('submitter')
+                    ->searchable(),
+                TextColumn::make('created_at')
+                    ->dateTime()
+                    ->sortable()
+                    ->toggleable(isToggledHiddenByDefault: true),
+                TextColumn::make('updated_at')
+                    ->dateTime()
+                    ->sortable()
+                    ->toggleable(isToggledHiddenByDefault: true),
+            ])
+            ->filters([
+                //
+            ])
+            ->recordActions([
+                EditAction::make(),
+                DeleteAction::make(),
+                Action::make('Approve')
+                    ->action(fn (TlaSuggestion $record) => TlaSuggestion::ApproveTla($record))
+                    ->requiresConfirmation()
+                    ->modalHeading('Approve TLA')
+                    ->modalDescription('Are you sure you want to approve this TLA?')
+            ])
+            ->toolbarActions([
+                BulkActionGroup::make([
+                    DeleteBulkAction::make(),
+                ]),
+            ]);
+    }
+
+    public static function getPages(): array
+    {
+        return [
+            'index' => ManageTlaSuggestions::route('/'),
+        ];
+    }
+}

app/Filament/Resources/Tlas/Tables/TlasTable.php

@@ -31,7 +31,7 @@ class TlasTable
                     ->dateTime()
                     ->sortable()
                     ->toggleable(isToggledHiddenByDefault: true),
-            ])
+            ])->defaultSort('used', direction: 'asc')
             ->filters([
                 //
             ])

app/Filament/Resources/Tlas/TlaResource.php

@@ -25,7 +25,7 @@ class TlaResource extends Resource
 
     protected static string|BackedEnum|null $navigationIcon = Heroicon::OutlinedRectangleStack;
 
-    protected static ?string $recordTitleAttribute = 'tla';
+    protected static ?string $recordTitleAttribute = 'Tla';
 
     public static function form(Schema $schema): Schema
     {
@@ -42,13 +42,23 @@ class TlaResource extends Resource
                 Textarea::make('context')
                     ->default(null)
                     ->columnSpanFull(),
+                TextInput::make('submitter')
+                    ->default(null),
+                TextInput::make('likes')
+                    ->required()
+                    ->numeric()
+                    ->default(0),
+                TextInput::make('dislikes')
+                    ->required()
+                    ->numeric()
+                    ->default(0),
             ]);
     }
 
     public static function table(Table $table): Table
     {
         return $table
-            ->recordTitleAttribute('tla')
+            ->recordTitleAttribute('Tla')
             ->columns([
                 TextColumn::make('acronym')
                     ->searchable(),
@@ -59,6 +69,14 @@ class TlaResource extends Resource
                 TextColumn::make('used')
                     ->date()
                     ->sortable(),
+                TextColumn::make('submitter')
+                    ->searchable(),
+                TextColumn::make('likes')
+                    ->numeric()
+                    ->sortable(),
+                TextColumn::make('dislikes')
+                    ->numeric()
+                    ->sortable(),
                 TextColumn::make('created_at')
                     ->dateTime()
                     ->sortable()
@@ -80,6 +98,7 @@ class TlaResource extends Resource
                     DeleteBulkAction::make(),
                 ]),
             ]);
+            
     }
 
     public static function getPages(): array

app/Http/Controllers/TlaController.php

@@ -17,6 +17,7 @@ class TlaController extends Controller
             $session->forget('tla-'.$language);
             $session->forget('correct-'.$language);
             $session->forget('review-'.$language);
+            $session->put('tla-array-'.$language, ['', '', '']);
             $session->put('date-'.$language, date('Y-m-d'));
         }
     }
@@ -27,6 +28,9 @@ class TlaController extends Controller
         if ( !in_array($language, $allowedLanguages) ) $language = 'en';
 
         $tla = Tla::GetCurrentTla($language);
+
+        if ($tla == NULL) return response()->json([ 'no_tla' => true ]);
+
         $this->session_flush($request, $language);
 
         $session = $request->session();
@@ -37,7 +41,9 @@ class TlaController extends Controller
             'date' => $session->get('date-'.$language),
             'tla' => $session->get('tla-'.$language) == $tla->acronym ? $tla->acronym : NULL,
             'context' => $session->get('tla-'.$language) == $tla->acronym ? $tla->context : NULL,
+            'submitter' => $tla->submitter,
             'correct' => $session->get('correct-'.$language),
+            'tla_array' => $session->get('tla-array-'.$language),
         ]);
     } 
 
@@ -95,6 +101,14 @@ class TlaController extends Controller
             if ($score == 12) $session->put('correct-'.$language, true);
         }
 
+        $tla_array = $session->get('tla-array-'.$language);
+
+        for ($i = 0; $i < 3; $i++) {
+            if ($tla_array[$i] == "" && $guess_array[$i + 3] == 2) $tla_array[$i] = $tla[$i];
+        }
+
+        $session->put('tla-array-'.$language, $tla_array);
+
         return response()->json([
             'guesses' => $guesses,
             'date' => $session->get('date'),
@@ -102,6 +116,7 @@ class TlaController extends Controller
             'context' => $session->get('tla-'.$language) == $tla_object->acronym ? $tla_object->context : NULL,
             'score' => $score,
             'correct' => $session->get('correct-'.$language),
+            'tla_array' => $tla_array,
         ]);
     }
 

app/Models/Tla.php

@@ -11,9 +11,9 @@ class Tla extends Model
 
     use HasFactory;
 
-    protected $fillable = ['acronym', 'hint', 'language', 'used', 'context', 'likes', 'dislikes'];
+    protected $fillable = ['acronym', 'hint', 'language', 'used', 'context', 'submitter', 'likes', 'dislikes'];
 
-    public static function GetCurrentTla( string $language ) : Tla {
+    public static function GetCurrentTla( string $language ) {
         $tla = Tla::where('used', date("Y-m-d"))
             ->where('language', $language)
             ->first();
@@ -24,6 +24,8 @@ class Tla extends Model
                 ->inRandomOrder()
                 ->first();
 
+            if ($tla == NULL) return NULL;
+
             $tla->used = date("Y-m-d");
             $tla->save();
         }

app/Models/TlaSuggestion.php

@@ -3,10 +3,18 @@
 namespace App\Models;
 
 use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
 
 class TlaSuggestion extends Model
 {
+    use HasFactory;
     protected $table = 'tla_suggestion';
 
     protected $fillable = ['acronym', 'hint', 'language', 'context', 'submitter'];
+
+    public static function ApproveTla(TlaSuggestion $record) {
+        $tla = new Tla($record->toArray());
+        $record->delete();
+        $tla->save();
+    }
 }

database/migrations/2026_08_21_065241_add_suggestion_submitter.php

@@ -12,7 +12,10 @@ return new class extends Migration
     public function up(): void
     {
         Schema::table('tla_suggestion', function (Blueprint $table){
-            $table->string('submitter')->default('Anonymus')->after('context');
+            $table->string('submitter')->nullable()->after('context');
+        });
+        Schema::table('tla', function (Blueprint $table){
+            $table->string('submitter')->nullable()->after('context');
         });
     }
 

resources/css/app.css

@@ -11,6 +11,11 @@
 
 :root {
   --ui-primary: rgb(255, 200, 0);
+
+  --correct-guess: rgb(0, 126, 2);
+  --partial-correct-guess: rgb(37, 43, 154);
+  --incorrect-guess:  rgb(79, 79, 79);
+  
 }
 
 .main {

resources/js/components/GuessWord.vue

@@ -1,20 +1,39 @@
 <template>
-    <Transition appear>
-        <div v-if="true" class="gw-div" :class="{ 'less': correctness==-3, 'more': correctness==-2, 'default': correctness==0, 'cw-cp': correctness==4, 'cw-ip': correctness==3, 'cf-cp': correctness==2, 'cf-ip': correctness==1 }">
+    <button v-if="true"
+            @click="onclick"
+            class="gw-div"
+            :class="{
+                'less': correctness==-3,
+                'more': correctness==-2,
+                'default': correctness==0,
+                'cw-cp': correctness==4,
+                'cw-ip': correctness==3,
+                'cf-cp': correctness==2,
+                'cf-ip': correctness==1
+            }">
         <slot></slot>
-        </div>
-    </Transition>
+    </button>
 </template>
 
 <script lang="ts">
-import { Transition } from 'vue';
     export default {
+        data() {
+            return {
+                modal_open: false,
+            }
+        },
         props: {
             correctness: {
                 type: Number,
                 default: 0,
             }, 
+        },
+        methods: {
+            onclick () {
+                if (this.correctness == 2) this.$emit('pressed_wordle');
             }
+        },
+        
     }
 </script>
 
@@ -22,8 +41,6 @@ import { Transition } from 'vue';
     .v-enter-active {
         transition: opacity 0.5s ease;
     }
-
-    
     .gw-div::first-letter {
         font-weight: bold;
     }
@@ -35,8 +52,11 @@ import { Transition } from 'vue';
         background-color: grey;
         color: white;
     }
+    .gw-button {
+    }
+    
     .default {
-        background-color: rgb(79, 79, 79);
+        background-color: var(--incorrect-guess)
     }
     .more {
         background-color: rgb(255, 0, 0);
@@ -45,13 +65,20 @@ import { Transition } from 'vue';
         background-color: rgb(129, 112, 0);
     }
     .cw-cp {
-        background-color: rgb(0, 126, 2);
+        background-color: var(--correct-guess)
     }
     .cw-ip {
         background-color: rgb(98, 175, 99);
     }
     .cf-cp {
-        background-color: rgb(37, 43, 154);
+        background-color: var(--partial-correct-guess);
+        border: solid white;
+    }
+    .cf-cp.hover {
+        background-color: #4CAF50; /* Green */
+    }
+    .cf-cp.focus {
+        background-color: red;
     }
     .cf-ip {
         background-color: rgb(106, 108, 160);

resources/js/components/HowToPlay.vue

@@ -35,8 +35,10 @@
             <GuessWord :correctness="4">Acronym</GuessWord>
           </div>
 
+          If you manage to figure out a letter in its correct position you unlock a mini wordle for that specific word. Press the word if it has a white outline to launch it!
+
           If you have any feedback, <a style="text-decoration: underline;" href="mailto:peter@sc0tt.org">
-          let me know in an email</a>, or create a <a style="text-decoration: underline;" href='https://gitea.sc0tt.org/Belupeti/TLA/pulls'>pull request</a>
+          let me know in an email</a>, or create an <a style="text-decoration: underline;" href='https://gitea.sc0tt.org/Belupeti/TLA/pulls'>issue</a>
           
       </template>
     </UModal>

resources/js/components/Wordle.vue

@@ -0,0 +1,91 @@
+<template>
+    <Modal v-model:open="open">
+        
+        <h1>Wordle for word {{ index }}</h1>
+        <br>
+        <div class="flex-container-a gap-1.5">
+            <template v-for="i in max_guesses">
+                <WordleRow v-if="guesses.length > i" :guess="guesses[i]" :length="correct.length" :correct="correct"/>
+
+                <UForm @submit="onsubmit" v-if="guesses.length == i">
+                    <UPinInput v-if="guesses[guesses.length-1].toString().replace(/\,/gi, '') != correct" default class="mb-2" autofocus v-model="guess" color="neutral" :length="correct.length" size="md" :correct="correct" />
+
+                    <WordleRow v-else :length="correct.length"/>
+
+                    <UButton type="submit" style="display: none;">
+                        Submit
+                    </UButton>
+                </UForm>
+
+                <WordleRow v-if="guesses.length < i" :length="correct.length"/>
+            </template>
+
+            <template v-if="guesses[guesses.length-1].toString().replace(/\,/gi, '') == correct">
+                You guessed word #{{ index }}! It was '{{ correct }}'
+            </template>
+        </div>
+
+        <UButton @click="onsubmit" class="m-3" v-if="guesses[guesses.length-1].toString().replace(/\,/gi, '') != correct">
+            Submit
+        </UButton>
+    </Modal>
+
+</template>
+
+<script setup lang="ts">
+    import Modal from './Modal.vue';
+    import WordleRow from './WordleRow.vue';
+</script>
+<script lang="ts">
+    export default {
+        data() {
+            return {
+                max_guesses: 10,
+                open: true,
+                guess: '',
+                guesses: [''],
+            }
+        },
+        props: {
+            correct: {
+                type: String,
+                default: 'nagyonhosszezugyselesz'
+            },
+            index: {
+                type: Number,
+                default: 0,
+            }, 
+            date: {
+                type: String,
+                default: '1970-01-01',
+            }
+            
+        },
+        mounted() {
+            if (localStorage.date) {
+                if (localStorage.date === this.date) this.guesses = JSON.parse(localStorage.getItem('guesses-' + this.index) || '[""]'); console.log(this.guesses);
+            } else localStorage.date = this.date;
+
+            this.max_guesses = this.correct.length > 5 ? this.correct.length : 6
+        },
+        methods: {
+            onsubmit () {
+                if (this.guess.length == this.correct.length) {
+                    this.guesses.push(this.guess);
+                    this.guess = '';
+
+                    localStorage.setItem('guesses-' + this.index, JSON.stringify(this.guesses));
+                }
+            },
+        },
+    }
+</script>
+
+<style scoped>
+    .flex-container-a {
+        display: flex;
+        flex-direction: column;
+        flex-wrap: wrap;
+        justify-content: center;
+    }
+</style>

resources/js/components/WordleRow.vue

@@ -0,0 +1,85 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+    <div class="flex-container gap-1.5">
+        <div v-for="i in length" class="border border-default wr-div" :class="{'correct' : getCorrectness[i-1]==2, 'wrong-place' : getCorrectness[i-1]==1, 'incorrect' : getCorrectness[i-1]==0}" >
+            {{ guess[i-1] }}
+        </div>
+    </div>
+</template> 
+
+<script lang="ts">
+    export default {
+        data() {
+            return {
+            }
+        },
+        props: {
+            correct: {
+                type: String,
+                default: 'testword',
+            },
+            guess: {
+                type: String,
+                default: '',
+            },
+            index: Number,
+            empty: {
+                type: Boolean,
+                default: false,
+            },
+            length: Number,
+        },
+
+        computed: {
+            getCorrectness() : number[] {
+                let correctness_alt = [];
+                let correctness = [];
+                for (let i = 0; i < this.guess.length; i++) {
+                    if (this.guess[i] == this.correct[i]) {
+                        correctness.push(2);
+                    } else correctness.push(0);
+                }
+                correctness_alt = correctness.slice();
+
+                for (let i = 0; i < this.guess.length; i++) {
+                    for (let j = 0; j < this.correct.length; j++) {
+                        if (this.guess[i] == this.correct[j] && correctness[i] == 0 && correctness_alt[j] == 0) {
+                            correctness[i] = 1;
+                            correctness_alt[j] = 1;
+                        }
+                    }
+                }
+
+                return correctness;
+            }
+        },
+    }
+</script>
+
+<style scoped>
+    .wr-div {
+        justify-content: center;
+        border-radius: 6px;
+        width: 32px;
+        height: 32px;
+        line-height: 32px;
+        background-color: transparent;
+        text-transform: uppercase;
+        font-weight: bold;
+    }
+    .correct {
+        background-color: rgb(0, 126, 2);
+    }
+    .incorrect {
+        background-color: var(--incorrect-guess);
+    }
+    .wrong-place {
+        background-color: var(--partial-correct-guess);
+    }
+    .empty {
+        background-color: var(--incorrect-guess);
+    }
+</style>

resources/js/pages/HomeView.vue

@@ -3,6 +3,7 @@
   import GuessWord from '../components/GuessWord.vue';
   import Modal from '../components/Modal.vue';
   import Review from '../components/Review.vue';
+import Wordle from '../components/Wordle.vue';
 </script>
 
 <script lang="ts">
@@ -12,13 +13,20 @@
         hint: ' ',
         guesses: [''],
         words: [''],
+        correct_words: [''],
         guess: '',
         tla: '', 
         context: '',
+        submitter: '',
+        date: '',
         victory: false,
         loss: false,
         maxGuesses: 10,
         correct: false,
+        no_tla: false,
+        wordle_open: [false, false, false],
+        wordle_dontshow: false,
+        wordle_hint: false,
       };
     },
     
@@ -26,12 +34,22 @@
       axios
         .get('/api/fetch_tla/en')
         .then(response => {
+          if (response.data.no_tla) this.no_tla = true;
+          else {
             this.hint = response.data.hint;
+            this.submitter = response.data.submitter;
             this.guesses = response.data.guesses;
             this.tla = response.data.tla;
             this.context = response.data.context;
             this.correct = response.data.correct;
+            this.correct_words = response.data.tla_array;
+            this.date = response.data.date;
+          }
         });
+
+        if (localStorage.wordle_dontshow) {
+          this.wordle_dontshow = localStorage.wordle_dontshow;
+        }
     },
     
     methods: {
@@ -46,6 +64,7 @@
             this.guesses = response.data.guesses;
             this.guess = '';
             this.words = [];
+            this.correct_words = response.data.tla_array;
 
             let current_guess = response.data.guesses[response.data.guesses.length-1]
             if (Number(current_guess[3]) + Number(current_guess[4]) + Number(current_guess[5]) == 12) {
@@ -65,6 +84,10 @@
       },
       onkeyup() {
         this.words = this.guess.trim().split(/\s+/);
+      },
+      wordle_disable() {
+        this.wordle_dontshow = true;
+        localStorage.wordle_dontshow = true;
       }
     }
   }
@@ -82,20 +105,18 @@
     
     </template>
 
-      <template v-for="guess in guesses">
+      <template v-for="guess in guesses" v-if="guesses.length>0">
         <div class="flex-container">
           <template v-for="i in 3">
-            <GuessWord :correctness="Number(guess[i+2])">
+            <GuessWord @pressed_wordle="wordle_open[i-1] = true" :correctness="Number(guess[i+2])" :index="i-1">
               {{ guess[i-1] }}
             </GuessWord>
+            <Wordle v-model:open="wordle_open[i-1]" :correct="correct_words[i-1]" :index="i" :date="date"/>
           </template>
         </div>
       </template> 
       
-      
-    <template #footer>
-      
-      <template v-if="guesses.length < maxGuesses && !correct">
+      <template v-if="guesses.length < maxGuesses && !correct && !no_tla">
         <div class="flex-container" v-if="guess.length > 0">
           <template v-for="word in words">
             <GuessWord :correctness="words.length == 3 ? -1 : (words.length > 3 ? -2 : -3)">
@@ -113,6 +134,10 @@
           </UButton>
         </UForm>
       </template>
+      <template v-if="no_tla">
+        <h2>No TLA for today, please shoot me an email to <a style="text-decoration: underline;" href="mailto:peter@sc0tt.org">
+          peter@sc0tt.org</a></h2>
+      </template>
       <template v-if="!correct && guesses.length >= maxGuesses">
         You ran out of guesses. Todays TLA was <b>{{ tla }}</b>
         <Review/>
@@ -121,10 +146,16 @@
         You completed todays TLAdle! Todays TLA was <b>{{ tla }}</b>
         <Review/>
       </template>
-      <h3>Guesses left: {{ maxGuesses - guesses.length }}</h3>
-
-    </template>
+      <h3 v-if="!no_tla">Guesses left: {{ maxGuesses - guesses.length }}</h3>
     </UCard>
+    <br>
+    <template v-if="submitter != null">
+      Todays TLA was submitted by <b>{{ submitter }}</b>
+      <br><br>
+    </template>
+    <UButton to="/suggestion" color="neutral" variant="subtle">
+      Suggest a TLA!
+    </UButton>
 
     <Modal v-model:open="victory">
           <h1>Congratulations!</h1>
@@ -139,6 +170,27 @@
           {{ context }}
     </Modal>
 
+    <br>
+
+    <UForm @submit="wordle_disable" v-if="!wordle_dontshow">
+      <UAlert
+        title="Press the word if the starting letter is correct to launch a mini wordle!"
+        color="success"
+        style="text-align: left; margin-top: 10px;"
+        variant="subtle"
+        orientation="horizontal"
+        :actions="[
+          {
+            label: 'Don\'t show again',
+            color: 'warning',
+            type: 'submit',
+            variant: 'subtle'
+          }
+        ]"
+      />
+    </UForm>
+
+
 </template>
 
 <style>

resources/js/pages/SuggestionView.vue

@@ -1,6 +1,11 @@
+<script setup lang="ts">
+import Modal from '../components/Modal.vue';
+</script>
+
 <template>
     <h1>TLA suggestion form</h1>
-    <UCard class="w-140 align-center">
+    <br>
+        <UCard class="align-center">
 
         <UForm @submit="onSubmit" class="space-y-4" action="/api/suggestion" method="post"> 
             <UFormField class="form-field" label="Acronym" required>
@@ -31,6 +36,9 @@
         If you wish, you can submit adnother TLA by exiting this alert. <br><br>
        <UButton to="/">Main page</UButton> 
     </Modal>
+    <Modal v-model:open="missing_fields">
+        <b>Please fill out all required fields (marked with *)</b>
+    </Modal>
     
 </template>
 
@@ -45,7 +53,6 @@
 
 <script lang="ts">
 import axios from 'axios';
-
     export default {
         data() {
             return {
@@ -56,13 +63,16 @@ import axios from 'axios';
                     language: '', 
                     submitter: '',
                 },
+                missing_fields: false,
                 submited: false,
 
             };
         },
         methods: {
             onSubmit() {
-                axios.post('/api/suggestion/en', this.form);
+                axios.post('/api/suggestion/en', this.form).then( response => {
+                    if (response.status == 200)
+                    {
                         this.form.acronym = '';
                         this.form.hint = '';
                         this.form.context = '';
@@ -70,6 +80,8 @@ import axios from 'axios';
                         this.form.language = 'en';
                         this.submited = true;
                     }
+                });
+            }
         }
     }
 

routes/web.php

@@ -2,6 +2,6 @@
 
 use Illuminate\Support\Facades\Route;
 
-Route::any('{all}',function(){
+Route::get('{all}',function(){
     return view('vue');
 })->where(['all' => '.*'])->name("vue");