feat: updated memo

This commit is contained in:
Corentin Thomasset 2021-03-15 12:26:20 +01:00
parent 0a4abde23d
commit 29c221a8f5
No known key found for this signature in database
GPG key ID: DBD997E935996158
6 changed files with 63 additions and 44 deletions

View file

@ -13,27 +13,32 @@
<v-progress-circular
indeterminate
color="primary"
/>
</div>
<div v-else>
<p>Drag & drop a file here</p>
<p class="or">or</p>
<v-btn depressed @click="manualUploadClicked">select a file</v-btn>
<p class="or">
or
</p>
<v-btn depressed @click="manualUploadClicked">
select a file
</v-btn>
<input ref="uploadInput" type="file" hidden @change="(e) => handleFiles(e.target.files[0])">
<div v-if="allowUrl">
<p class="or">or</p>
<p class="or">
or
</p>
<v-text-field
ref="urlInput"
@click:append="urlFilled(url)"
@keypress.enter="urlFilled(url)"
v-model="url"
append-icon="fa-arrow-right"
dense
label="Paste the file url"
outlined
:error-messages="urlErrors"
@click:append="urlFilled(url)"
@keypress.enter="urlFilled(url)"
/>
</div>
</div>
@ -41,9 +46,9 @@
</template>
<script>
import * as axios from "axios";
import * as axios from 'axios'
export default {
name: "FileUploader",
name: 'FileUploader',
props: {
allowUrl: {
type: Boolean,
@ -61,50 +66,50 @@ export default {
},
methods: {
imageDropped(e) {
this.dragging = false;
this.dragging = false
if (e.dataTransfer.items.length > 0) {
const item = e.dataTransfer.items[0];
const item = e.dataTransfer.items[0]
switch (item.kind) {
case 'string':
item.getAsString(url => this.urlFilled(url));
break;
item.getAsString(url => this.urlFilled(url))
break
case 'file':
this.handleFiles(item.getAsFile());
break;
this.handleFiles(item.getAsFile())
break
}
}
},
dragEnter() {
this.dragEnterCounter++;
this.dragging = true;
this.dragEnterCounter++
this.dragging = true
},
dragLeave() {
if (--this.dragEnterCounter <= 0) {
this.dragging = false;
this.dragging = false
}
},
async urlFilled(url) {
if (url && url.length > 0) {
this.loading = true;
this.loading = true
try {
const {data, headers} = await axios.get(url);
const name = url.split('/').pop();
const {data, headers} = await axios.get(url)
const name = url.split('/').pop()
const file = new File([data], name, {type: headers['content-type']})
this.handleFiles(file);
this.handleFiles(file)
} catch (ignored) {
this.urlErrors = 'Incorrect url'
}
this.loading = false;
this.loading = false
}
},
dragEnd() {
this.dragging = false;
this.dragging = false
},
dragExit() {
this.dragging = false;
this.dragging = false
},
handleFiles(file) {
if (!file) return;
if (!file) { return }
this.$emit('input', file)
},
manualUploadClicked() {

View file

@ -5,7 +5,15 @@
Warning: le style/aspect est toujours en wip, so focus on content <br><br>
<v-row>
<v-col cols="12" sm="12" md="6" lg="4" v-for="item in items" :key="item.section" class="memo-section">
<v-col
v-for="item in items"
:key="item.section"
cols="12"
sm="12"
md="6"
lg="4"
class="memo-section"
>
<v-card class="mb-5">
<v-card-title>{{ item.section }}</v-card-title>
<v-card-text>

36
package-lock.json generated
View file

@ -6457,9 +6457,9 @@
}
},
"eslint": {
"version": "7.21.0",
"resolved": "https://registry.npmjs.org/eslint/-/eslint-7.21.0.tgz",
"integrity": "sha512-W2aJbXpMNofUp0ztQaF40fveSsJBjlSCSWpy//gzfTvwC+USs/nceBrKmlJOiM8r1bLwP2EuYkCqArn/6QTIgg==",
"version": "7.22.0",
"resolved": "https://registry.npmjs.org/eslint/-/eslint-7.22.0.tgz",
"integrity": "sha512-3VawOtjSJUQiiqac8MQc+w457iGLfuNGLFn8JmF051tTKbh5/x/0vlcEj8OgDCaw7Ysa2Jn8paGshV7x2abKXg==",
"dev": true,
"requires": {
"@babel/code-frame": "7.12.11",
@ -6479,7 +6479,7 @@
"file-entry-cache": "^6.0.1",
"functional-red-black-tree": "^1.0.1",
"glob-parent": "^5.0.0",
"globals": "^12.1.0",
"globals": "^13.6.0",
"ignore": "^4.0.6",
"import-fresh": "^3.0.0",
"imurmurhash": "^0.1.4",
@ -6487,7 +6487,7 @@
"js-yaml": "^3.13.1",
"json-stable-stringify-without-jsonify": "^1.0.1",
"levn": "^0.4.1",
"lodash": "^4.17.20",
"lodash": "^4.17.21",
"minimatch": "^3.0.4",
"natural-compare": "^1.4.0",
"optionator": "^0.9.1",
@ -6610,12 +6610,12 @@
}
},
"globals": {
"version": "12.4.0",
"resolved": "https://registry.npmjs.org/globals/-/globals-12.4.0.tgz",
"integrity": "sha512-BWICuzzDvDoH54NHKCseDanAhE3CeDorgDL5MT6LMXXj2WCnd9UC2szdk4AWLfjdgNBCXLUanXYcpBBKOSWGwg==",
"version": "13.6.0",
"resolved": "https://registry.npmjs.org/globals/-/globals-13.6.0.tgz",
"integrity": "sha512-YFKCX0SiPg7l5oKYCJ2zZGxcXprVXHcSnVuvzrT3oSENQonVLqM5pf9fN5dLGZGyCjhw8TN8Btwe/jKnZ0pjvQ==",
"dev": true,
"requires": {
"type-fest": "^0.8.1"
"type-fest": "^0.20.2"
}
},
"has-flag": {
@ -6678,6 +6678,12 @@
"requires": {
"has-flag": "^4.0.0"
}
},
"type-fest": {
"version": "0.20.2",
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
"integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
"dev": true
}
}
},
@ -15043,9 +15049,9 @@
},
"dependencies": {
"ajv": {
"version": "7.1.1",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-7.1.1.tgz",
"integrity": "sha512-ga/aqDYnUy/o7vbsRTFhhTsNeXiYb5JWDIcRIeZfwRNCefwjNTVYCGdGSUrEmiu3yDK3vFvNbgJxvrQW4JXrYQ==",
"version": "7.2.1",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-7.2.1.tgz",
"integrity": "sha512-+nu0HDv7kNSOua9apAVc979qd932rrZeb3WOvoiD31A/p1mIE5/9bN2027pE2rOPYEdS3UHzsvof4hY+lM9/WQ==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.1",
@ -15940,9 +15946,9 @@
"optional": true
},
"v8-compile-cache": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.2.0.tgz",
"integrity": "sha512-gTpR5XQNKFwOd4clxfnhaqvfqMpqEwr4tOtCyz4MtYZX2JYhfr1JvBFKdS+7K/9rfpZR3VLX+YWBbKoxCgS43Q==",
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz",
"integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==",
"dev": true
},
"v8-to-istanbul": {

View file

@ -36,7 +36,7 @@
"babel-core": "7.0.0-bridge.0",
"babel-eslint": "^10.1.0",
"babel-jest": "^26.5.0",
"eslint": "^7.20.0",
"eslint": "^7.22.0",
"eslint-config-prettier": "^6.12.0",
"eslint-plugin-nuxt": "^1.0.0",
"eslint-plugin-prettier": "^3.1.4",

View file

@ -1,6 +1,6 @@
<template>
<ToolWrapper :config="config()" no-card="true">
<FileUploader v-model="file"/>
<FileUploader v-model="file" />
<div v-if="base64 || loading" class="mt-10">
<v-card>

View file

@ -37,6 +37,7 @@ en:
- text: Tip n°3 (avec du code !)
code: rm -rf / --no-preserve-root
- text: Tip n°4
code: "multiline\ncode sample"
- section: Titre de la section 3
items:
@ -49,7 +50,6 @@ en:
code: rm -rf / --no-preserve-root
subtitle: Un super sous titre, yeah
- section: Titre de la section 4
items:
- text: Tip n°1