add: faqs added

This commit is contained in:
Alexandro Uc Santos
2024-01-27 19:56:19 -06:00
parent 57fa36be4d
commit c0e9b12bae
10 changed files with 298 additions and 92 deletions

View File

@@ -0,0 +1,73 @@
<script setup>
import { ref } from 'vue';
defineProps({
question: {
type: String,
required: true
},
answer: {
type: String,
required: true
}
})
const open = ref(false);
const toggle = () => {
open.value = !open.value;
}
</script>
<template>
<div class="card-faq">
<div class="question-box" @click="toggle">
<h3 class="question">{{ question }}</h3>
<i v-if="!open" class="fa-solid fa-chevron-down icon-indicator"></i>
<i v-else class="fa-solid fa-chevron-up icon-indicator"></i>
</div>
<p
v-if="open"
class="answer">{{ answer }}</p>
</div>
</template>
<style scoped>
.card-faq {
width: 100%;
padding: 12px 20px;
background-color: white;
/* background-color: rgb(184, 236, 234); */
margin-bottom: 15px;
filter: drop-shadow(0px 4px 4px rgba(0, 255, 255,0.3));
border-radius: 13px;
}
.question-box {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
cursor: pointer;
}
.card-faq:hover {
background-color: aqua;
}
.icon-indicator {
font-size: 20px;
color: #FBBA33;
}
.question {
font-size: 1.3rem;
font-weight: 500;
color: #323030;
}
.answer {
margin-top: 1rem;
font-size: 1.1rem;
font-weight: normal;
color: #323030;
}
</style>

View File

@@ -134,7 +134,7 @@
<p><span>Fecha de descarga: </span> {{getDateMonthDay(load.est_unloading_date) }}</p> <p><span>Fecha de descarga: </span> {{getDateMonthDay(load.est_unloading_date) }}</p>
</div> </div>
<div class="col-lg-4 col-sm-12"> <div class="col-lg-4 col-sm-12">
<p><span>Segmento: </span> {{ load._categories }}</p> <p><span>Segmento: </span> {{ load.categories?.map((e) => e.name).join(', ') }}</p>
<p><span>Código de carga: </span> {{ load.shipment_code }} <p><span>Código de carga: </span> {{ load.shipment_code }}
<span v-if="load.load_status !== 'Draft' && !readOnly" class="tracking-icon" @click="handleTracking"> <span v-if="load.load_status !== 'Draft' && !readOnly" class="tracking-icon" @click="handleTracking">
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-geo-alt-fill" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-geo-alt-fill" viewBox="0 0 16 16">

View File

@@ -19,8 +19,9 @@
</div> </div>
</div> </div>
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<a class="btn-links mb-1" href="">Aviso de privacidad</a> <RouterLink class="btn-links mb-1" :to="{name: 'notice-privacy'}" target="_blank">Aviso de privaciadad</RouterLink>
<a class="btn-links" href="">Terminos y condiciones</a> <RouterLink class="btn-links" :to="{name: 'terms-conditions'}" target="_blank">Términos y condiciones</RouterLink>
<RouterLink class="btn-links" :to="{name: 'faqs'}" target="_blank">Faqs</RouterLink>
</div> </div>
</div> </div>
<h4 class="copy"><i class="fa fa-copyright" aria-hidden="true"></i> 2023 ETA VIAPORTE | TODOS LOS DERECHOS RESERVADOS</h4> <h4 class="copy"><i class="fa fa-copyright" aria-hidden="true"></i> 2023 ETA VIAPORTE | TODOS LOS DERECHOS RESERVADOS</h4>

View File

@@ -39,7 +39,6 @@
const errors = ref({ const errors = ref({
segment: null, segment: null,
product: null,
truckType: null, truckType: null,
cityOrigin: null, cityOrigin: null,
stateOrigin: null, stateOrigin: null,
@@ -78,9 +77,12 @@
//origin_formatted_address //origin_formatted_address
if(loadStore.currentLoad){ if(loadStore.currentLoad){
formLoad.price = loadStore.currentLoad.actual_cost; formLoad.price = loadStore.currentLoad.actual_cost;
formLoad.segment = loadStore.currentLoad.categories.map(m =>{ formLoad.segment = loadStore.currentLoad.categories?.length <= 0 ? [] : loadStore.currentLoad.categories.map(m =>{
return m; return m;
}); });
// formLoad.segment = loadStore.currentLoad.categories?.length <= 0 ? null : loadStore.currentLoad.categories.map(m =>{
// return m;
// });
startLocation.value = loadStore.currentLoad.origin_formatted_address; startLocation.value = loadStore.currentLoad.origin_formatted_address;
endLocation.value = loadStore.currentLoad.destination_formatted_address; endLocation.value = loadStore.currentLoad.destination_formatted_address;
formLoad.terms = loadStore.currentLoad.product; formLoad.terms = loadStore.currentLoad.product;
@@ -89,20 +91,20 @@
formLoad.weight = loadStore.currentLoad.weight; formLoad.weight = loadStore.currentLoad.weight;
formLoad.dateLoad = loadStore.currentLoad.est_loading_date?.substring(0, 10); formLoad.dateLoad = loadStore.currentLoad.est_loading_date?.substring(0, 10);
formLoad.dateDownload = loadStore.currentLoad.est_unloading_date?.substring(0, 10); formLoad.dateDownload = loadStore.currentLoad.est_unloading_date?.substring(0, 10);
formLoad.truckType = {meta_value: loadStore.currentLoad.truck_type}; formLoad.truckType = loadStore.currentLoad.truck_type ? {meta_value: loadStore.currentLoad.truck_type} : null;
origin.locationName = loadStore.currentLoad.origin.company_name; origin.locationName = loadStore.currentLoad.origin.company_name;
origin.address = loadStore.currentLoad.origin.street_address1; origin.address = loadStore.currentLoad.origin.street_address1;
origin.state = { state_name: loadStore.currentLoad.origin.state }; origin.state = loadStore.currentLoad.origin?.state ? { state_name: loadStore.currentLoad.origin.state } : null;
origin.city = { city_name: loadStore.currentLoad.origin.city }; origin.city = loadStore.currentLoad.origin?.city ? { city_name: loadStore.currentLoad.origin.city } : null;
origin.country = loadStore.currentLoad.origin.country; origin.country = loadStore.currentLoad.origin.country;
origin.postalCode = loadStore.currentLoad.origin.zipcode; origin.postalCode = loadStore.currentLoad.origin.zipcode;
origin.ref = loadStore.currentLoad.origin.landmark; origin.ref = loadStore.currentLoad.origin.landmark;
destination.locationName = loadStore.currentLoad.destination.company_name; destination.locationName = loadStore.currentLoad.destination.company_name;
destination.address = loadStore.currentLoad.destination.street_address1; destination.address = loadStore.currentLoad.destination.street_address1;
destination.state = { state_name: loadStore.currentLoad.destination.state }; destination.state = loadStore.currentLoad.destination?.state ? { state_name: loadStore.currentLoad.destination.state } : null;
destination.city = { city_name: loadStore.currentLoad.destination.city }; destination.city = loadStore.currentLoad.destination?.city ? { city_name: loadStore.currentLoad.destination.city } : null;
destination.country = loadStore.currentLoad.destination.country; destination.country = loadStore.currentLoad.destination.country;
destination.postalCode = loadStore.currentLoad.destination.zipcode; destination.postalCode = loadStore.currentLoad.destination.zipcode;
destination.ref = loadStore.currentLoad.destination.landmark; destination.ref = loadStore.currentLoad.destination.landmark;
@@ -110,27 +112,21 @@
} }
watch(origin, async() => { watch(origin, async() => {
// console.log(origin); if(origin.city && origin.state) {
if(origin.address && origin.city && origin.state) {
startLocation.value = origin.address + ', ' + origin.city.city_name + ', ' + origin.state.state_name + ', ' + origin.country + ', ' +origin.postalCode; startLocation.value = origin.address + ', ' + origin.city.city_name + ', ' + origin.state.state_name + ', ' + origin.country + ', ' +origin.postalCode;
originCoords.value = await geocodeAddress(startLocation.value); originCoords.value = await geocodeAddress(startLocation.value);
// console.log('Origin:')
// console.log(originCoords.value)
} }
}) })
watch(destination, async() => { watch(destination, async() => {
if(destination.address && destination.city && destination.state) { if(destination.city && destination.state) {
endLocation.value = destination.address + ', ' + destination.city.city_name + ', ' + destination.state.state_name + ', ' + destination.country + ', ' +destination.postalCode; endLocation.value = destination.address + ', ' + destination.city.city_name + ', ' + destination.state.state_name + ', ' + destination.country + ', ' +destination.postalCode;
destinationCoords.value = await geocodeAddress(endLocation.value); destinationCoords.value = await geocodeAddress(endLocation.value);
// console.log('Destination:')
// console.log(destinationCoords.value);
} }
}) })
}) })
watch(locationLoadSelected, () => { watch(locationLoadSelected, () => {
console.log(locationLoadSelected);
origin.locationName = locationLoadSelected.value.branch_name; origin.locationName = locationLoadSelected.value.branch_name;
origin.address = locationLoadSelected.value.address; origin.address = locationLoadSelected.value.address;
origin.state = { state_name: locationLoadSelected.value.state }; origin.state = { state_name: locationLoadSelected.value.state };
@@ -167,8 +163,8 @@
dateLoad: '', dateLoad: '',
dateDownload: '', dateDownload: '',
segment: [], segment: [],
truckType: [], truckType: '',
terms: [], terms: '',
price: 0, price: 0,
weight: 0, weight: 0,
notes: '', notes: '',
@@ -198,32 +194,32 @@
const setLoadData = () => { const setLoadData = () => {
let loadData = { let loadData = {
actual_cost: formLoad.price, actual_cost: formLoad.price,
truck_type: formLoad.truckType.meta_value || null, truck_type: formLoad.truckType?.meta_value || null,
est_loading_date : formLoad.dateLoad, est_loading_date : formLoad.dateLoad,
est_unloading_date : formLoad.dateDownload, est_unloading_date : formLoad.dateDownload,
notes : formLoad.notes, notes : formLoad.notes,
weight : formLoad.weight, weight : formLoad.weight,
product: formLoad.terms.length <= 0 ? null : formLoad.terms, product: formLoad.terms?.length <= 0 ? null : formLoad.terms,
categories: formLoad.segment || null, categories: formLoad.segment || null,
origin:{ origin:{
company_name : origin.locationName, company_name : origin?.locationName,
street_address1 : origin.address, street_address1 : origin?.address,
state : origin.state.state_name, state : origin.state?.state_name,
city : origin.city.city_name, city : origin.city?.city_name,
country : origin.country, country : origin?.country,
landmark : origin.ref, landmark : origin?.ref,
zipcode : origin.postalCode, zipcode : origin?.postalCode,
lat : originCoords.value?.lat, lat : originCoords.value?.lat,
lng : originCoords.value?.lng lng : originCoords.value?.lng
}, },
destination:{ destination:{
company_name : destination.locationName, company_name : destination?.locationName,
street_address1 : destination.address, street_address1 : destination?.address,
state : destination.state.state_name, state : destination.state?.state_name,
city : destination.city.city_name, city : destination.city?.city_name,
country : destination.country, country : destination?.country,
landmark : destination.ref, landmark : destination?.ref,
zipcode : destination.postalCode, zipcode : destination?.postalCode,
lat : destinationCoords.value?.lat, lat : destinationCoords.value?.lat,
lng : destinationCoords.value?.lng lng : destinationCoords.value?.lng
}, },
@@ -232,6 +228,7 @@
posted_by_name: formLoad.owner posted_by_name: formLoad.owner
}; };
return loadData; return loadData;
} }
@@ -246,6 +243,7 @@
...loadStore.loads[index], ...loadStore.loads[index],
...resp ...resp
}; };
return 'success'; return 'success';
} else { } else {
return 'error'; return 'error';
@@ -254,10 +252,12 @@
const resp = await loadStore.saveLoad(loadData); const resp = await loadStore.saveLoad(loadData);
isLoading.value = false; isLoading.value = false;
if(resp) { if(resp) {
loadStore.loads.push({ const load = {
...resp, ...resp,
...loadData ...loadData,
}); categories: [loadData.categories]
}
loadStore.loads.push(load);
return 'success'; return 'success';
} else { } else {
return 'error'; return 'error';
@@ -284,35 +284,31 @@
const validations = () => { const validations = () => {
errors.value = { errors.value = {
segment: formLoad.segment.length <= 0 ? 'Seleccione segmento' : null, segment: (!formLoad.segment || formLoad.segment?.length <= 0) ? 'Seleccione segmento' : null,
product: formLoad.terms.length <= 0 ? 'Seleccione producto' : null, truckType: formLoad.truckType ? null : 'Seleccione tipo de transporte',
truckType: formLoad.truckType.length <= 0 ? 'Seleccione tipo de transporte' : null, cityOrigin: origin.city ? null : 'Seleccione ciudad',
cityOrigin: origin.city.length <= 0 ? 'Seleccione ciudad' : null, stateOrigin: origin.state ? null : 'Seleccione estado',
stateOrigin: origin.state.length <= 0 ? 'Seleccione estado' : null, cityDestination: destination.city ? null : 'Seleccione ciudad',
cityDestination: destination.city.length <= 0 ? 'Seleccione ciudad' : null, stateDestination: destination.state ? null : 'Seleccione estado',
stateDestination: destination.state.length <= 0 ? 'Seleccione estado' : null,
}; };
}
}
const handlePostLoad = async() => { const handlePostLoad = async() => {
submited.value = true; submited.value = true;
let loadData = setLoadData();
loadData = {
...loadData,
status: "Published",
load_status: "Published"
}
setTimeout(async() => { setTimeout(async() => {
const formValid = formRef.value.checkValidity(); const formValid = formRef.value.checkValidity();
validations() validations()
console.log(formValid);
if(formValid){ if(formValid){
const hasError = Object.values(errors.value).some(val => val != null); const hasError = Object.values(errors.value).some(val => val != null);
console.log(hasError);
if(!hasError) { if(!hasError) {
let loadData = setLoadData();
loadData = {
...loadData,
status: "Published",
load_status: "Published"
}
const resp = await updateLoad(loadData); const resp = await updateLoad(loadData);
if(resp === 'success') { if(resp === 'success') {
notyStore.show = 'true'; notyStore.show = 'true';
@@ -325,8 +321,6 @@
icon: "error" icon: "error"
}); });
} }
} else {
console.log('Hay errores');
} }
} }
}, 200) }, 200)
@@ -398,20 +392,17 @@
</div> </div>
<div class="form-section"> <div class="form-section">
<div class="mb-4 mt-3"> <div class="mb-4 mt-3">
<label class="custom-label">Terminos*</label> <label class="custom-label">Terminos</label>
<Products <Products
v-model="formLoad.terms" v-model="formLoad.terms"
/> />
<span class="error-msg" v-if="submited && errors.product">{{ errors.product }}</span>
</div> </div>
<Custominput <Custominput
label="Precio*" label="Precio"
type="Number" type="Number"
:filled="false" :filled="false"
name="price" name="price"
v-model:field="formLoad.price" v-model:field="formLoad.price"
:required="submited ? true : false"
:error="(submited && !formLoad.price) ? 'Ingrese precio en MXN' : null"
/> />
<Custominput <Custominput
label="Notas" label="Notas"
@@ -421,7 +412,7 @@
v-model:field="formLoad.notes" v-model:field="formLoad.notes"
/> />
<Custominput <Custominput
label="Publicación hecha por*" label="Publicación hecha por"
type="text" type="text"
:filled="false" :filled="false"
:readonly="true" :readonly="true"
@@ -453,22 +444,18 @@
</select> </select>
</div> </div>
<Custominput <Custominput
label="Nombre locación de carga*" label="Nombre locación de carga"
type="text" type="text"
:filled="false" :filled="false"
name="name-location-origin" name="name-location-origin"
v-model:field="origin.locationName" v-model:field="origin.locationName"
:required="submited ? true : false"
:error="(submited && !origin.locationName) ? 'Ingrese nombre' : null"
/> />
<Custominput <Custominput
label="Dirección*" label="Dirección"
type="text" type="text"
:filled="false" :filled="false"
name="address-origin" name="address-origin"
v-model:field="origin.address" v-model:field="origin.address"
:required="submited ? true : false"
:error="(submited && !origin.address) ? 'Ingrese dirección' : null"
/> />
<div class="mb-4 mt-3"> <div class="mb-4 mt-3">
<label class="custom-label">Ciudad*</label> <label class="custom-label">Ciudad*</label>
@@ -485,22 +472,18 @@
<span class="error-msg" v-if="submited && errors.stateOrigin">{{ errors.stateOrigin }}</span> <span class="error-msg" v-if="submited && errors.stateOrigin">{{ errors.stateOrigin }}</span>
</div> </div>
<Custominput <Custominput
label="País*" label="País"
type="text" type="text"
:filled="false" :filled="false"
name="country-origin" name="country-origin"
v-model:field="origin.country" v-model:field="origin.country"
:required="submited ? true : false"
:error="(submited && !origin.country) ? 'Ingrese país' : null"
/> />
<Custominput <Custominput
label="Código Postal*" label="Código Postal"
type="text" type="text"
:filled="false" :filled="false"
name="postalCode-origin" name="postalCode-origin"
v-model:field="origin.postalCode" v-model:field="origin.postalCode"
:required="submited ? true : false"
:error="(submited && !origin.postalCode) ? 'Ingrese Código postal' : null"
/> />
<Custominput <Custominput
label="Punto de referencia" label="Punto de referencia"
@@ -531,13 +514,11 @@
</select> </select>
</div> </div>
<Custominput <Custominput
label="Nombre locación de descarga*" label="Nombre locación de descarga"
type="text" type="text"
:filled="false" :filled="false"
name="name-location-destination" name="name-location-destination"
v-model:field="destination.locationName" v-model:field="destination.locationName"
:required="submited ? true : false"
:error="(submited && !destination.locationName) ? 'Ingrese nombre' : null"
/> />
<Custominput <Custominput
label="Dirección" label="Dirección"
@@ -545,8 +526,6 @@
:filled="false" :filled="false"
name="address-destination" name="address-destination"
v-model:field="destination.address" v-model:field="destination.address"
:required="submited ? true : false"
:error="(submited && !destination.address) ? 'Ingrese dirección' : null"
/> />
<div class="mb-4 mt-3"> <div class="mb-4 mt-3">
<label class="custom-label">Ciudad*</label> <label class="custom-label">Ciudad*</label>
@@ -563,22 +542,18 @@
<span class="error-msg" v-if="submited && errors.stateDestination">{{ errors.stateDestination }}</span> <span class="error-msg" v-if="submited && errors.stateDestination">{{ errors.stateDestination }}</span>
</div> </div>
<Custominput <Custominput
label="País*" label="País"
type="text" type="text"
:filled="false" :filled="false"
name="country-destination" name="country-destination"
v-model:field="destination.country" v-model:field="destination.country"
:required="submited ? true : false"
:error="(submited && !destination.country) ? 'Ingrese país' : null"
/> />
<Custominput <Custominput
label="Código Postal*" label="Código Postal"
type="text" type="text"
:filled="false" :filled="false"
name="postalCode-destination" name="postalCode-destination"
v-model:field="destination.postalCode" v-model:field="destination.postalCode"
:required="submited ? true : false"
:error="(submited && !destination.postalCode) ? 'Ingrese código postal' : null"
/> />
<Custominput <Custominput
label="Punto de referencia" label="Punto de referencia"

View File

@@ -116,10 +116,8 @@
</ul> </ul>
<div class="eta-info"> <div class="eta-info">
<div class="divider"></div> <div class="divider"></div>
<!-- <a class="link-eta" href="">Aviso de privaciadad</a> -->
<!-- <a class="link-eta" href="">Terminos y condiciones</a> -->
<RouterLink class="link-eta" :to="{name: 'notice-privacy'}" target="_blank">Aviso de privaciadad</RouterLink> <RouterLink class="link-eta" :to="{name: 'notice-privacy'}" target="_blank">Aviso de privaciadad</RouterLink>
<RouterLink class="link-eta" :to="{name: 'terms-conditions'}" target="_blank">Terminos y condiciones</RouterLink> <RouterLink class="link-eta" :to="{name: 'terms-conditions'}" target="_blank">Términos y condiciones</RouterLink>
<a class="link-eta" href="">FAQS</a> <a class="link-eta" href="">FAQS</a>
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<i class="fa-solid fa-right-from-bracket"></i> <i class="fa-solid fa-right-from-bracket"></i>

86
src/data/faqs.json Normal file
View File

@@ -0,0 +1,86 @@
[
{
"section": "Cuenta",
"items": [
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
}
]
},
{
"section": "Precios y planes",
"items": [
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
}
]
},
{
"section": "Publicaciones de cargas",
"items": [
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
}
]
},
{
"section": "Publicaciones de vehiculos",
"items": [
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
},
{
"question": "¿lorem losks sld dkkd sjjs sjksks?",
"answer": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi."
}
]
}
]

View File

@@ -0,0 +1,28 @@
<script setup>
import Header from '../components/Header.vue';
</script>
<template>
<Header/>
<div class="auth-layout">
<RouterView/>
</div>
</template>
<style scoped>
.auth-layout {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-content: center;
/* background-color: red; */
width: 100%;
margin: 0px auto !important;
padding: 0px 5px !important;
overflow: hidden;
min-height: 700px;
}
</style>

View File

@@ -1,5 +1,6 @@
import { createRouter, createWebHistory } from 'vue-router' import { createRouter, createWebHistory } from 'vue-router'
import AuthLayout from '../layouts/AuthLayout.vue' import AuthLayout from '../layouts/AuthLayout.vue'
import PublicLayout from '../layouts/PublicLayout.vue'
// import {useAuthStore} from '../stores/auth'; // import {useAuthStore} from '../stores/auth';
// const authStore = useAuthStore(); // const authStore = useAuthStore();
@@ -37,6 +38,7 @@ const router = createRouter({
{ {
path: '/publico', path: '/publico',
name: 'public', name: 'public',
component: PublicLayout,
children: [ children: [
{ {
path: 'terminos-y-condiciones', path: 'terminos-y-condiciones',
@@ -47,6 +49,11 @@ const router = createRouter({
path: 'eviso-de-privacidad', path: 'eviso-de-privacidad',
name: 'notice-privacy', name: 'notice-privacy',
component: () => import('../views/NoticeOfPrivacyView.vue') component: () => import('../views/NoticeOfPrivacyView.vue')
},
{
path: 'faqs',
name: 'faqs',
component: () => import('../views/FaqsView.vue')
} }
] ]
}, },

27
src/views/FaqsView.vue Normal file
View File

@@ -0,0 +1,27 @@
<script setup>
import CardFaq from '../components/CardFaq.vue';
import faqs from '../data/faqs.json';
console.log(faqs)
</script>
<template>
<div class="container">
<h1 class="title mt-5">Preguntas frecuentes</h1>
<div v-for="section in faqs">
<h2 class="title-section mt-4">{{ section.section }}</h2>
<CardFaq
v-for="faq in section.items"
:question="faq.question"
:answer="faq.answer"
/>
</div>
</div>
</template>
<style lang="scss" scoped>
.title-section {
font-size: 1.4rem;
font-weight: 600;
}
</style>

View File

@@ -174,7 +174,18 @@
type="submit" type="submit"
class="btn-primary-lg btn-lg-block radius-1 mt-5" value="Continuar"> class="btn-primary-lg btn-lg-block radius-1 mt-5" value="Continuar">
<p class="mt-5 fs-6 text-center">Al registrarte aceptas nuestros <RouterLink class="btn-text" :to="{name: 'login'}">términos y cóndiciones</RouterLink></p> <p class="mt-5 fs-6 text-center">
Al registrarte aceptas nuestros
<RouterLink
class="btn-text me-1"
:to="{name: 'terms-conditions'}"
target="_blank">términos y condiciones</RouterLink>
y
<RouterLink
class="btn-text ms-1"
:to="{name: 'notice-privacy'}"
target="_blank"> Aviso de privaciadad</RouterLink>
</p>
<p class="mt-5 fs-6 text-center">¿Ya tienes una cuenta? <RouterLink class="btn-text" :to="{name: 'login'}">Ingresa aqui</RouterLink></p> <p class="mt-5 fs-6 text-center">¿Ya tienes una cuenta? <RouterLink class="btn-text" :to="{name: 'login'}">Ingresa aqui</RouterLink></p>
</form> </form>