@extends('layouts.app')
@section('title', 'ISIPP')

@section('css')
<style>
    .contador {
        margin-top: 10px;
        font-weight: bold;
    }
</style>
@endsection

@section('content')
<section id="recent-blog-posts" class="recent-blog-posts section">
    <div class="container section-title" data-aos="fade-up">
        <h2 style="color: #e43d30;">Anuncio</h2>
        <p class="text-justify">@{{infomsj}}</p>
    </div>
    <div class="container">
        <div class="form-floating mb-3">
            <input type="text" v-model="txtnombre" id="txtnombre" class="form-control" autocomplete="off" placeholder="Apellido y Nombre">
            <label for="txtnombre">Apellido y Nombre</label>
            <span class="invalid-feedback" role="alert">
                <strong> @{{msjnom}}</strong>
            </span>
        </div>
        <div class="form-floating mb-3">
            <input type="text" v-model="txtnumero" id="txtnumero" class="form-control" autocomplete="off" placeholder="Celular">
            <label for="txtnumero">Celular</label>
            <span class="invalid-feedback" role="alert">
                <strong> @{{msjcel}}</strong>
            </span>
        </div>
        <div class="form-floating mb-3">
            <textarea v-model="txtdesc" id="txtdesc" class="form-control" autocomplete="off" placeholder="Descripción..." style="height: 150px"></textarea>
            <label for="txtdesc">Descripción</label>
            <span class="invalid-feedback" role="alert">
                <strong> @{{msjdesc}}</strong>
            </span>
        </div>
        <div class="mb-3">
            <button class="btn btn-success" @click="guardar()">Guardar</button>
        </div>
    </div>
</section>
@endsection

@section('script')
@vite(['resources/js/header.js'])
@vite(['resources/js/footer.js'])
@vite(['resources/js/paganuncio.js'])
@endsection