get computers added.
This commit is contained in:
alfredojl
@@ -0,0 +1,232 @@
|
||||
<template>
|
||||
<div class="container mt-5 justify-content-center">
|
||||
|
||||
<div class="d-flex flex-column">
|
||||
<h1 class="text-center">Agregar impresora</h1>
|
||||
|
||||
<h3 class="text-left mt-4">Datos generales:</h3>
|
||||
|
||||
<form
|
||||
class="mb-5 form-add-user pl-0"
|
||||
enctype="multipart/form-data"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
class="pb-2 my-4"
|
||||
placeholder="Número de inventario:"
|
||||
/>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
class="pb-2 my-4"
|
||||
placeholder="Número de resguardo:"
|
||||
/>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
class="pb-2 my-4"
|
||||
placeholder="Nombre del responsable:"
|
||||
/>
|
||||
|
||||
<select class="py-2 my-4 sel-form-add" required>
|
||||
<option value="" hidden>Unidad responsable:</option>
|
||||
<option value="">Opcion 1</option>
|
||||
</select>
|
||||
|
||||
<select class="py-2 my-4 sel-form-add">
|
||||
<option value="" hidden>Ubicación</option>
|
||||
<option value="">Opcion 1</option>
|
||||
</select>
|
||||
|
||||
<select class="py-2 my-4 sel-form-add">
|
||||
<option value="" hidden>Uso</option>
|
||||
<option value="">Opcion 1</option>
|
||||
</select>
|
||||
</form>
|
||||
|
||||
<div>
|
||||
<h3>Impresora</h3>
|
||||
|
||||
|
||||
|
||||
<form
|
||||
class="mb-5 form-add-user pl-0"
|
||||
enctype="multipart/form-data"
|
||||
>
|
||||
|
||||
<select class="py-2 my-4 sel-form-add">
|
||||
<option value="" hidden>Tipo de impresora:</option>
|
||||
<option value="">Opcion 1</option>
|
||||
</select>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
class="pb-2 my-4"
|
||||
placeholder="Modelo:"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
class="pb-2 my-4"
|
||||
placeholder="Marca:"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
class="pb-2 my-4"
|
||||
placeholder="Número de serie:"
|
||||
/>
|
||||
|
||||
</form>
|
||||
|
||||
</div>
|
||||
<div class="">
|
||||
<button
|
||||
class="btn btn-lg btn-primary mr-4"
|
||||
@click="$router.push('./user')"
|
||||
>
|
||||
Regresar
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-lg btn-success"
|
||||
@click.prevent="addEquip()"
|
||||
>
|
||||
Añadir
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
style="margin-top:200px; left: 0px; position: absolute;"
|
||||
class="container-fluid px-0"
|
||||
>
|
||||
<footer id="footer" style="left: 0px;" class="text-center">
|
||||
<div class="separador"></div>
|
||||
<div class="contenedor-footer p-3">
|
||||
<div class="text-white mt-3" style="font-size: 11px;">
|
||||
<p>
|
||||
Hecho en México, todos los derechos reservados 2020.
|
||||
<br />
|
||||
Esta página puede ser reproducida con fines no
|
||||
lucrativos, siempre y cuando no se mutile, se cite
|
||||
la fuente
|
||||
<br />
|
||||
completa y su dirección electrónica. De otra forma,
|
||||
requiere permiso previo por escrito de la
|
||||
institución.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Swal from 'sweetalert2'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addEquip() {
|
||||
Swal.fire({
|
||||
title: '¿Está seguro de querer añadir este equipo?',
|
||||
icon: 'warning',
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: '#3085d6',
|
||||
cancelButtonColor: '#d33',
|
||||
confirmButtonText: 'Sí, estoy seguro',
|
||||
cancelButtonText: 'Cancelar'
|
||||
}).then((result) => {
|
||||
if (result.value) {
|
||||
Swal.fire({
|
||||
title: '¡Equipo añadido!',
|
||||
icon: 'success'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
select {
|
||||
padding: 10px;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
-o-appearance: none;
|
||||
-moz-appearance: none;
|
||||
-ms-appearance: none;
|
||||
appearance: none;
|
||||
display: block;
|
||||
margin: 30px 0;
|
||||
padding: 10px 50px 10px 10px;
|
||||
background: url('../img/select-triangle.png') no-repeat 97% center !important;
|
||||
background-color: #5c9cd8 !important;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
border-radius: 2px;
|
||||
border: none;
|
||||
background-size: 12px !important;
|
||||
}
|
||||
|
||||
.form-add-user input[type='text'],
|
||||
.form-add-user input[type='email'],
|
||||
.form-add-user input[type='date'] {
|
||||
text-align: left;
|
||||
width: 60%;
|
||||
border: none;
|
||||
border-bottom: 1.5px solid #000;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.form-add-user input[type='text']:focus {
|
||||
outline-color: transparent;
|
||||
}
|
||||
|
||||
.sel-form-add {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
#footer {
|
||||
bottom: 0px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
.separador {
|
||||
width: 100%;
|
||||
background: #2e5795;
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
.contenedor-footer {
|
||||
width: 100%;
|
||||
}
|
||||
.cont-text-foo {
|
||||
font-size: 12px;
|
||||
}
|
||||
footer {
|
||||
background: #1b3d70;
|
||||
}
|
||||
@media (max-width: 577px) {
|
||||
.form-add-user input[type='text'],
|
||||
.form-add-user input[type='email'],
|
||||
.form-add-user input[type='date'],
|
||||
.sel-form-add{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 578px) and (max-width: 980px) {
|
||||
.form-add-user input[type='text'],
|
||||
.form-add-user input[type='email'],
|
||||
.form-add-user input[type='date'],
|
||||
.sel-form-add{
|
||||
width: 75%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user