mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
Add nuxt-dropzone, Upload component
This commit is contained in:
Matt Rider
parent
74109256b2
commit
24a6ec88ad
45
webapp/components/Upload.vue
Normal file
45
webapp/components/Upload.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div>
|
||||
<vue-dropzone
|
||||
ref="el"
|
||||
id="dropzone"
|
||||
:include-styling="false"
|
||||
:options="dropzoneOptions"
|
||||
>
|
||||
<!-- <ds-icon name="image" size="xxx-large"/> -->
|
||||
</vue-dropzone>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import vueDropzone from 'nuxt-dropzone'
|
||||
import 'nuxt-dropzone/dropzone.css'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
vueDropzone
|
||||
},
|
||||
props: {
|
||||
user: { type: Object, default: null }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dropzoneOptions: {
|
||||
url: 'https://httpbin.org/post',
|
||||
thumbnailWidth: 150,
|
||||
maxFilesize: 0.5,
|
||||
dictDefaultMessage: "<img src='https://s3.amazonaws.com/uifaces/faces/twitter/envex/128.jpg' />"
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// Everything is mounted and you can access the dropzone instance
|
||||
const instance = this.$refs.el.dropzone
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
img {
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
@ -66,6 +66,7 @@
|
||||
"jsonwebtoken": "~8.5.1",
|
||||
"linkify-it": "~2.1.0",
|
||||
"nuxt": "~2.6.3",
|
||||
"nuxt-dropzone": "^1.0.2",
|
||||
"nuxt-env": "~0.1.0",
|
||||
"stack-utils": "^1.0.2",
|
||||
"string-hash": "^1.1.3",
|
||||
@ -75,6 +76,7 @@
|
||||
"vue-count-to": "~1.0.13",
|
||||
"vue-izitoast": "1.1.2",
|
||||
"vue-sweetalert-icons": "~3.2.0",
|
||||
"vue2-dropzone": "^3.5.9",
|
||||
"vuex-i18n": "~1.11.0",
|
||||
"zxcvbn": "^4.4.2"
|
||||
},
|
||||
@ -104,4 +106,4 @@
|
||||
"vue-jest": "~3.0.4",
|
||||
"vue-svg-loader": "~0.12.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -14,12 +14,13 @@
|
||||
:class="{'disabled-content': user.disabled}"
|
||||
style="position: relative; height: auto;"
|
||||
>
|
||||
<ds-avatar
|
||||
<hc-upload :user="user"/>
|
||||
<!-- <ds-avatar
|
||||
:image="user.avatar"
|
||||
:name="userName"
|
||||
class="profile-avatar"
|
||||
size="120px"
|
||||
/>
|
||||
size="x-large"
|
||||
/> -->
|
||||
<no-ssr>
|
||||
<content-menu
|
||||
placement="bottom-end"
|
||||
@ -327,6 +328,7 @@ import HcBadges from '~/components/Badges.vue'
|
||||
import HcLoadMore from '~/components/LoadMore.vue'
|
||||
import HcEmpty from '~/components/Empty.vue'
|
||||
import ContentMenu from '~/components/ContentMenu'
|
||||
import HcUpload from '~/components/Upload'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@ -337,7 +339,8 @@ export default {
|
||||
HcBadges,
|
||||
HcLoadMore,
|
||||
HcEmpty,
|
||||
ContentMenu
|
||||
ContentMenu,
|
||||
HcUpload
|
||||
},
|
||||
transition: {
|
||||
name: 'slide-up',
|
||||
|
||||
@ -3928,6 +3928,11 @@ dotenv@^6.0.0:
|
||||
resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-6.2.0.tgz#941c0410535d942c8becf28d3f357dbd9d476064"
|
||||
integrity sha512-HygQCKUBSFl8wKQZBSemMywRWcEDNidvNbjGVyZu3nbZ8qq9ubiPoGLMdRDpfSrpkkm9BXYFkpKxxFX38o/76w==
|
||||
|
||||
dropzone@^5.5.1:
|
||||
version "5.5.1"
|
||||
resolved "https://registry.yarnpkg.com/dropzone/-/dropzone-5.5.1.tgz#06e2f513e61d6aa363d4b556f18574f47cf7ba26"
|
||||
integrity sha512-3VduRWLxx9hbVr42QieQN25mx/I61/mRdUSuxAmDGdDqZIN8qtP7tcKMa3KfpJjuGjOJGYYUzzeq6eGDnkzesA==
|
||||
|
||||
duplexer3@^0.1.4:
|
||||
version "0.1.4"
|
||||
resolved "https://registry.yarnpkg.com/duplexer3/-/duplexer3-0.1.4.tgz#ee01dd1cac0ed3cbc7fdbea37dc0a8f1ce002ce2"
|
||||
@ -7418,6 +7423,13 @@ number-is-nan@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
|
||||
integrity sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=
|
||||
|
||||
nuxt-dropzone@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/nuxt-dropzone/-/nuxt-dropzone-1.0.2.tgz#7b39014ebf4c2084ea5c976f8d9f7b3cead2c7af"
|
||||
integrity sha512-Oj6YrQxNH5KhCyFSFz2O809u23+cFAevBTdcld88qakbR2l5stTQjrv8VJ9beaqfenT9kKEkhYQT0mXc3nUdKw==
|
||||
dependencies:
|
||||
vue2-dropzone "3.5.8"
|
||||
|
||||
nuxt-env@~0.1.0:
|
||||
version "0.1.0"
|
||||
resolved "https://registry.yarnpkg.com/nuxt-env/-/nuxt-env-0.1.0.tgz#8ac50b9ff45391ad3044ea932cbd05f06a585f87"
|
||||
@ -10996,6 +11008,20 @@ vue-template-es2015-compiler@^1.6.0, vue-template-es2015-compiler@^1.9.0:
|
||||
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
|
||||
integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
|
||||
|
||||
vue2-dropzone@3.5.8:
|
||||
version "3.5.8"
|
||||
resolved "https://registry.yarnpkg.com/vue2-dropzone/-/vue2-dropzone-3.5.8.tgz#cbe92d5424b5cc62c4d4ad62814d0cf6f3bb6cda"
|
||||
integrity sha512-32rLGSx+mLKhyzxRz4CdeNT9JmbO6NsYX8m83WYqrf2ilRbm6KSZmUqZ8EIT+2dwq8EzY9jdrWlWuZJRBFPUGw==
|
||||
dependencies:
|
||||
dropzone "^5.5.1"
|
||||
|
||||
vue2-dropzone@^3.5.9:
|
||||
version "3.5.9"
|
||||
resolved "https://registry.yarnpkg.com/vue2-dropzone/-/vue2-dropzone-3.5.9.tgz#a63999a45a7aad24d4c21e3d35be409b4e6bdce8"
|
||||
integrity sha512-nJz6teulVKlZIAeKgvPU7wBI/gzfIgqDOrEp1okSkQIkdprDVCoM0U7XWM0NOM4AAVX+4XGRtMoocYWdTYb3bQ==
|
||||
dependencies:
|
||||
dropzone "^5.5.1"
|
||||
|
||||
vue@^2.6.10, vue@^2.6.6:
|
||||
version "2.6.10"
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.10.tgz#a72b1a42a4d82a721ea438d1b6bf55e66195c637"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user