mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-09 08:08:24 -05:00
updated URL import page with tab interface
This commit is contained in:
@@ -8,7 +8,6 @@
|
|||||||
|
|
||||||
{% include 'include/vue_base.html' %}
|
{% include 'include/vue_base.html' %}
|
||||||
<script src="{% static 'js/jquery-3.5.1.min.js' %}"></script>
|
<script src="{% static 'js/jquery-3.5.1.min.js' %}"></script>
|
||||||
<script src="{% static 'js/vue-jstree.js' %}"></script>
|
|
||||||
<script src="{% static 'js/vue-multiselect.min.js' %}"></script>
|
<script src="{% static 'js/vue-multiselect.min.js' %}"></script>
|
||||||
<link rel="stylesheet" href="{% static 'css/vue-multiselect.min.css' %}">
|
<link rel="stylesheet" href="{% static 'css/vue-multiselect.min.css' %}">
|
||||||
<style>
|
<style>
|
||||||
@@ -24,77 +23,21 @@
|
|||||||
<div id="app">
|
<div id="app">
|
||||||
<h2> {% trans 'Import' %} </h2>
|
<h2> {% trans 'Import' %} </h2>
|
||||||
<nav class="nav nav-pills flex-sm-row" style="margin-bottom:10px">
|
<nav class="nav nav-pills flex-sm-row" style="margin-bottom:10px">
|
||||||
<a class="nav-link active" href="#nav-url" data-toggle="tab" role="tab" aria-controls="nav-url" aria-selected="true" @click="mode='url'">URL</a>
|
<a class="nav-link active" href="#nav-url" data-toggle="tab" role="tab" aria-controls="nav-url" aria-selected="true">URL</a>
|
||||||
<a class="nav-link" href="#nav-app" data-toggle="tab" role="tab" aria-controls="nav-app" @click="mode='app'">App</a>
|
<a class="nav-link" href="#nav-ldjson" data-toggle="tab" role="tab" aria-controls="nav-ldjson">ld+json</a>
|
||||||
<a class="nav-link" href="#nav-source" data-toggle="tab" role="tab" aria-controls="nav-source" @click="mode='source'">Source</a>
|
<a class="nav-link disabled" href="#nav-json" data-toggle="tab" role="tab" aria-controls="nav-json">json</a>
|
||||||
<a class="nav-link disabled" href="#nav-text" data-toggle="tab" role="tab" aria-controls="nav-text" @click="mode='text'">Text</a>
|
<a class="nav-link disabled" href="#nav-html" data-toggle="tab" role="tab" aria-controls="nav-html">HTML</a>
|
||||||
<a class="nav-link disabled" href="#nav-file" data-toggle="tab" role="tab" aria-controls="nav-file" @click="mode='file'">File</a>
|
<a class="nav-link disabled" href="#nav-text" data-toggle="tab" role="tab" aria-controls="nav-text">text</a>
|
||||||
|
<a class="nav-link disabled" href="#nav-pdf" data-toggle="tab" role="tab" aria-controls="nav-pdf">PDF</a>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
<div class="tab-content" id="nav-tabContent">
|
<div class="tab-content" id="nav-tabContent">
|
||||||
<!-- Import URL -->
|
<div class="row tab-pane fade show active" id="nav-url" role="tabpanel">
|
||||||
<div class="tab-pane fade show active" id="nav-url" role="tabpanel">
|
|
||||||
<div class="btn-group btn-group-toggle" data-toggle="buttons">
|
|
||||||
<label class="btn btn-outline-info btn-sm active" @click="automatic=true">
|
|
||||||
<input type="radio" autocomplete="off" checked> Automatic
|
|
||||||
</label>
|
|
||||||
|
|
||||||
<label class="btn btn-outline-info btn-sm" @click="automatic=false">
|
|
||||||
<input type="radio" autocomplete="off"> Manual
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-group my-2">
|
|
||||||
<input class="form-control" v-model="remote_url" placeholder="{% trans 'Enter website URL' %}">
|
|
||||||
<div class="input-group-append">
|
|
||||||
<button @click="loadRecipe()" class="btn btn-primary shadow-none" type="button"
|
|
||||||
id="id_btn_search"><i class="fas fa-search"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Import from Recipe Application -->
|
|
||||||
<div class=" tab-pane fade show" id="nav-app" role="tabpanel">
|
|
||||||
<div class="btn-group btn-group-toggle" data-toggle="buttons">
|
|
||||||
<label class="btn btn-outline-info btn-sm active" @click="recipe_app='DEFAULT'">
|
|
||||||
<input type="radio" autocomplete="off" checked> Tandoor
|
|
||||||
</label>
|
|
||||||
<label class="btn btn-outline-info btn-sm" @click="recipe_app='PAPRIKA'">
|
|
||||||
<input type="radio" autocomplete="off"> Paprika
|
|
||||||
</label>
|
|
||||||
<label class="btn btn-outline-info btn-sm" @click="recipe_app='NEXTCLOUD'">
|
|
||||||
<input type="radio" autocomplete="off"> Nextcloud Cookbook
|
|
||||||
</label>
|
|
||||||
<label class="btn btn-outline-info btn-sm" @click="recipe_app='MEALIE'">
|
|
||||||
<input type="radio" autocomplete="off"> Mealie
|
|
||||||
</label>
|
|
||||||
<label class="btn btn-outline-info btn-sm" @click="recipe_app='CHOWDOWN'">
|
|
||||||
<input type="radio" autocomplete="off"> Chowdown
|
|
||||||
</label>
|
|
||||||
<label class="btn btn-outline-info btn-sm" @click="recipe_app='SAFRON'">
|
|
||||||
<input type="radio" autocomplete="off"> Safron
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<b-form-file
|
|
||||||
class="my-2"
|
|
||||||
accept=".zip"
|
|
||||||
multiple
|
|
||||||
v-model="recipe_files"
|
|
||||||
placeholder="{% trans 'Select recipe files to import or drop them here...' %}"
|
|
||||||
drop-placeholder="Drop recipe files here...">
|
|
||||||
</b-form-file>
|
|
||||||
<button @click="importAppRecipe()" class="btn btn-primary shadow-none" type="button"
|
|
||||||
id="id_btn_app"><i class="fas fa-file-archive"></i> {% trans 'Import' %}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12">
|
<div class="col-md-12">
|
||||||
<div class="input-group mb-3">
|
<div class="input-group mb-3">
|
||||||
<input class="form-control" v-model="json_data" placeholder="{% trans 'Enter json directly' %}">
|
<input class="form-control" v-model="remote_url" placeholder="{% trans 'Enter website URL' %}">
|
||||||
<div class="input-group-append">
|
<div class="input-group-append">
|
||||||
<button @click="loadRecipeJson()" class="btn btn-primary shadow-none" type="button"
|
<button @click="loadRecipe()" class="btn btn-primary shadow-none" type="button"
|
||||||
id="id_btn_search"><i class="fas fa-search"></i>
|
id="id_btn_search"><i class="fas fa-search"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -102,25 +45,32 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Import JSON or HTML -->
|
<div class="row tab-pane fade show" id="nav-ldjson" role="tabpanel">
|
||||||
<div class=" tab-pane fade show" id="nav-source" role="tabpanel">
|
<div class="col-md-12">
|
||||||
<div class="btn-group btn-group-toggle" data-toggle="buttons">
|
<div class="input-group input-group-lg">
|
||||||
<label class="btn btn-outline-info btn-sm active" @click="automatic=true">
|
<textarea class="form-control input-group-append" v-model="json_data" rows=10; placeholder="{% trans 'Paste ld+json here' %}">
|
||||||
<input type="radio" autocomplete="off" checked> Automatic
|
</textarea>
|
||||||
</label>
|
</div>
|
||||||
|
<br>
|
||||||
<label class="btn btn-outline-info btn-sm" @click="automatic=false">
|
<button @click="loadRecipeJson()" class="btn btn-primary shadow-none" type="button"
|
||||||
<input type="radio" autocomplete="off"> Manual
|
id="id_btn_json"><i class="fas fa-code"></i> {% trans 'Import' %}
|
||||||
</label>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="input-group my-2">
|
|
||||||
<textarea class="form-control input-group-append" v-model="source_data" rows=10 placeholder="{% trans 'Paste json or html source here to load recipe.' %}" style="font-size: 12px">
|
|
||||||
</textarea>
|
|
||||||
</div>
|
|
||||||
<button @click="loadRecipe()" class="btn btn-primary shadow-none" type="button"
|
|
||||||
id="id_btn_app"><i class="fas fa-code"></i> {% trans 'Import' %}
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="row tab-pane fade show" id="nav-html" role="tabpanel">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="input-group input-group-lg">
|
||||||
|
<textarea class="form-control input-group-append" v-model="html_data" rows=10; placeholder="{% trans 'Paste html source here' %}">
|
||||||
|
</textarea>
|
||||||
|
</div>
|
||||||
|
<br>
|
||||||
|
<button @click="loadRecipeJson()" class="btn btn-primary shadow-none" type="button"
|
||||||
|
id="id_btn_html"><i class="fas fa-code"></i> {% trans 'Import' %}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<br/>
|
<br/>
|
||||||
@@ -622,7 +572,7 @@
|
|||||||
el: '#app',
|
el: '#app',
|
||||||
data: {
|
data: {
|
||||||
remote_url: '',
|
remote_url: '',
|
||||||
source_data: undefined,
|
json_data: undefined,
|
||||||
keywords: [],
|
keywords: [],
|
||||||
keywords_loading: false,
|
keywords_loading: false,
|
||||||
units: [],
|
units: [],
|
||||||
|
|||||||
Reference in New Issue
Block a user