Skip to content

Instantly share code, notes, and snippets.

@VitorLuizC
Forked from ingliths/Formuario Wordpress
Created March 14, 2019 18:43
Show Gist options
  • Save VitorLuizC/07f4651425fac43ca532c410eba88bf3 to your computer and use it in GitHub Desktop.
Save VitorLuizC/07f4651425fac43ca532c410eba88bf3 to your computer and use it in GitHub Desktop.
<?php
get_header();
$estrutura = get_estrutura_pesquisa();
?>
<script type="text/javascript">
var _estrutura = <?php echo json_encode($estrutura); ?>;
var can_publish = <?php echo json_encode(posso_publicar()); ?>;
</script>
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
# Conteudo
$conteudo = get_the_content();
?>
<div id="page-default" class="mb-5 mt-5">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="mb-5">
<?php get_template_part('template-parts/breadcrumbs') ?>
</div>
<div class="box-border">
<?php if(!empty($conteudo)): ?>
<div>
<?php the_content(); ?>
</div>
<?php endif ?>
<div id="form-produtos" class="mt-4">
<form ref="formulario" action="" v-on:submit.prevent="saveClassificado">
<div v-if="can_publish || edit || editLoading">
<?php wp_nonce_field( 'criar_classificado' ); ?>
<h3>Faça agora o cadastro do seus classificados</h3>
<div class="espaco-laterais">
<div v-if="loading">
<p class="alert alert-info mt-4">
<i class="fa fa-refresh fa-spin"></i> Carregando ....
</p>
</div>
<div v-else>
<div class="opcoes-terms mt-4 form-group">
<template v-for="term in terms">
<label class="pr-4 orange">
<input
required="required"
name="tipo-classificado"
v-model="termSelected"
:data-id="term.term_id"
:data-slug="term.slug"
:value="term.term_id"
type="radio"> {{ term.name }}
</label>
</template>
</div>
<div class="row" v-if="termObject.slug == 'veiculos'">
<div class="col-md-3 form-group">
<label class="orange">Marca</label>
<select required="required" v-model="form.veiculo.marca" class="form-control">
<option value="">Selecione</option>
<option v-for="item in estrutura.veiculos" :value="item.term_id">
{{ item.name }}
</option>
</select>
</div>
<div class="col-md-3 form-group">
<label class="orange">Modelo</label>
<select required="required" :disabled="form.veiculo.marca === ''" v-model="form.veiculo.modelo" class="form-control">
<option value="">Selecione</option>
<template v-if="!!form.veiculo.marca">
<option v-for="child in estrutura.veiculos[form.veiculo.marca].childs" :value="child.term_id">
{{ child.name }}
</option>
</template>
</select>
</div>
<div class="col-md-2 form-group">
<label class="orange">Ano</label>
<select required="required" class="form-control" v-model="form.veiculo.ano">
<option value="">Selecione o Ano</option>
<option v-for="ano in anos">
{{ ano}}
</option>
</select>
</div>
<!--div class="col-md-3 form-group">
<label class="orange">Versão</label>
<input v-model="form.veiculo.versao" type="text" class="form-control">
</div-->
<div class="col-md-2 form-group">
<label class="orange">KM</label>
<input required="required" v-model="form.veiculo.km" type="text" class="form-control">
</div>
<div class="col-md-2 form-group">
<label class="orange">Horas de Uso</label>
<input v-model="form.veiculo.horas_de_uso" type="text" class="form-control">
</div>
<!--div class="col-md-3 form-group">
<label class="orange">Motor Cilindradas</label>
<input v-model="form.veiculo.motor_cilindradas" type="text" class="form-control">
</div-->
<!--div class="col-md-3 mb-5 form-group">
<label class="orange">Potência</label>
<input v-model="form.veiculo.potencia" type="text" class="form-control">
</div-->
</div>
<div class="row">
<div class="form-group col-md-8">
<!-- {{ termObject.description }} -->
<label class="red">Título do Classificado</label>
<input required="required" v-model="form.titulo" type="text" class="form-control">
</div>
<div class="form-group col-md-4">
<label class="red">Valor</label>
<input required="required" placeholder="0,00" v-model="form.valor" type="text" class="form-control dinheiro"> <h8 style="font-size:80%; margin-top:5px; color:red;">OBS:</h8>
<h8 style="font-size:80%; margin-top:5px;"> Colocar a Vírgula no Valor
</h8>
</div>
</div>
<div class="form-group mb-5">
<label class="red">Descrição {{ termObject.description }}</label>
<textarea rows="5" v-model="form.descricao" class="form-control"></textarea>
</div>
<div class="opcoes-complementos form-group mb-5" v-if="complementos[termSelected]">
<template v-if="complementos[termSelected].itens.length">
<template v-for="item in complementos[termSelected].itens">
<label class="pr-4 orange">
<input
required="required"
name="tipo-item"
v-model="itemSelected"
:data-id="item.term_id"
:data-slug="item.slug"
:value="item.term_id"
type="radio"> {{ item.name }}
</label>
</template>
</template>
</div>
<div class="row" v-if="termObject.slug == 'veiculos'">
<div class="col-md-12 form-group">
<div class="mb-3">
<label class="orange">Aceita troca pelo veículo</label>
</div>
<div class="mb-5">
<label class="pr-4 orange">
<input required="required" v-model="form.veiculo.aceita_troca" :value="1" name="veiculo.aceita-troca" type="radio"> Sim
</label>
<label class="pr-4 orange">
<input required="required" v-model="form.veiculo.aceita_troca" :value="0" name="veiculo.aceita-troca" type="radio"> Não
</label>
</div>
</div>
</div>
<div class="row" v-if="termObject.slug == 'servicos'">
<div class="col-md-3 form-group">
<label class="orange">Tipo de Serviço</label>
<select required="required" v-model="form.servicos.tipo_do_servico" class="form-control">
<option value="">Selecione</option>
<option v-for="item in estrutura.servicos" :value="item.term_id">
{{ item.name }}
</option>
</select>
</div>
</div>
<div class="row" v-if="termObject.slug == 'acessorios'">
<div class="col-md-3 form-group">
<label class="orange">Marca</label>
<select required="required" v-model="form.acessorios.marca" class="form-control">
<option value="">Selecione</option>
<option v-for="item in estrutura.acessorios" :value="item.term_id">
{{ item.name }}
</option>
</select>
</div>
<div class="col-md-3 form-group">
<label class="orange">Ano</label>
<select required="required" class="form-control" v-model="form.acessorios.ano">
<option value="">Selecione o Ano</option>
<option v-for="ano in anos">
{{ ano}}
</option>
</select>
</div>
</div>
<div class="row opcoes-complementos form-group" v-if="complementos[termSelected]">
<div class="col-md-12" v-if="complementos[termSelected].acessorios.length">
<div class="mb-3"><label class="orange">Acessórios originais do veículo</label></div>
<div class="mb-5">
<div class="row m-0">
<div class="col-md-3" v-for="item in complementos[termSelected].acessorios">
<label class="pr-4 black">
<input
name="tipo-acessorio[]"
v-model="itemAcessorios[item.term_id]"
:data-id="item.term_id"
:data-slug="item.slug"
:value="item.term_id"
type="checkbox"> {{ item.name }}
</label>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 form-group">
<div class="mb-3">
<label class="orange">Contato</label>
</div>
<div class="mb-5">
<div class="row">
<div class="col-lg-3 form-group">
<label class="orange normalText">Tel 1 (com DDD)</label>
<input required="required" placeholder="DDD + Telefone" type="text" class="form-control telefone" v-model="form.telefone_01">
</div>
<div class="col-lg-3 form-group">
<label class="orange normalText">Tel 2 (com DDD)</label>
<input placeholder="DDD + Telefone" type="text" class="form-control telefone" v-model="form.telefone_02">
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="orange">Fotos</label>
<div class="row">
<div class="col-md-3">
<p class="instrucao mb-3 b u pl-10">Instruções</p>
<p class="pl-10">Use fotos que mostrem bem seu produto, configure seu aparelho para tirar fotos no padrão web. O sistema só faz o up-load de imagens com máximo 1Mb. Caso necessite reduzir, use estes sites gratuitos <a class="bold" target="_blank" href="https://tinypng.com">www.tinypng.com</a> ou <a class="bold" target="_blank" href="https://www.iloveimg.com/pt/comprimir-imagem">www.iloveimg.com</a></p>
</div>
<div class="col-md-9">
<div class="row">
<div class="col-md-5">
<div v-if="filesUploaded.length">Imagens já cadastradas:</div>
<div class="row mb-3" v-if="filesUploaded.length">
<div class="col-md-4 relative" v-for="(file, key) in filesUploaded">
<img v-on:click="removerImageUploaded(key)" class="img-thumbnail" :src="file.url">
</div>
</div>
<div class="row mb-3" v-if="files.length">
<div class="col-md-12" v-if="filesUploaded.length">Estas serão suas novas imagens:</div>
<div class="col-md-4 relative" v-for="(file, key) in files">
<img v-on:click="removerImage(key)" class="img-thumbnail" :src="file.blob" :alt="file.name">
<span title="remover-imagem" v-on:click="removerImage(key)" class="remover-imagem">x</span>
</div>
</div>
<div>
<file-upload
:maximum="9"
class="arraste"
:drop="true"
:multiple="true"
ref="upload"
v-model="files"
@input-filter="inputFilter"
>
Arraste e solte imagens aqui
</file-upload>
</div>
</div>
<div class="col-md-1 d-flex">
<div class="w-100 align-self-center">
<div class="text-center">
OU
</div>
</div>
</div>
<div class="col-md-4 d-flex">
<label for="file" class="btn btn-block btn-laranja align-self-center">Carregar imagens</label>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="orange">Vídeo</label>
<div class="row">
<div class="col-md-3">
<p class="instrucao mb-3 b u pl-10">Instruções</p>
<p class="pl-10">O arquivo de vídeo tem que estar ou no Youtube / Vimeo, copie a URL e cole aqui, lembre-se de não usar nada sem autorização!</p>
</div>
<div class="col-md-9">
<p class="instrucao mb-3 b">Escreva ou cole a URL do vídeo</p>
<input v-model="form.videoUrl" type="text" class="form-control">
</div>
</div>
</div>
<div class="form-group">
<label class="red">Informações adicionais</label>
<textarea rows="5" v-model="form.informacoes" class="form-control"></textarea>
</div>
<div class="form-group text-right">
<!--div class="form-check form-check-inline pr-5">
<label>
<input v-model="form.rascunho" type="checkbox"> Rascunho
</label>
</div-->
<button :disabled="enviandoForm" type="submit" class="btn btn-salvar btn-laranja">
<template v-if="enviandoForm">
<i class="fa fa-spin fa-refresh"></i> Enviando ...
</template>
<template v-else>
Salvar classificado
</template>
</button>
</div>
</div>
</div>
</div>
<div v-else class="espaco-laterais alert alert-danger">
Você alcançou o limite de produtos. Contrate nosso plano para publicar mais produtos.
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<?php
endwhile;
endif;
?>
<?php get_footer();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment