diff options
| -rw-r--r-- | src/pages/UploadCreate.vue | 13 | ||||
| -rw-r--r-- | src/pages/UploadDetail.vue | 24 |
2 files changed, 24 insertions, 13 deletions
diff --git a/src/pages/UploadCreate.vue b/src/pages/UploadCreate.vue index c435a2f..6cdabcd 100644 --- a/src/pages/UploadCreate.vue +++ b/src/pages/UploadCreate.vue @@ -14,9 +14,12 @@ <div class="group"> <q-field :error="errors.title !== undefined" :error-label="errors.title" - icon="fa-pencil"> + icon="fa-edit"> <q-input v-model="title" float-label="Title" /> </q-field> + <q-field icon="fa-edit"> + <q-input v-model="version" float-label="Version" /> + </q-field> <q-field :error="errors.tags !== undefined" :error-label="errors.tags" icon="fa-tags"> @@ -105,7 +108,7 @@ </q-field> <q-stepper-navigation> <q-btn color="primary" flat @click="$refs.stepper.previous()">Back</q-btn> - <q-btn color="positive" icon="fa-save" @click="postUpload" :disabled="!uploadEnabled">Save mod</q-btn> + <q-btn color="positive" icon="fa-save" @click="postUpload" :disabled="!uploadEnabled"> Save mod</q-btn> </q-stepper-navigation> </q-step> <q-step name="done" title="Done"> @@ -146,6 +149,7 @@ files: [], tags: [], title: '', + version: '', description: '', slug: '', errors: {}, @@ -170,7 +174,7 @@ headers: { Authorization: `JWT ${this.$store.state.user.authToken}` }, acceptedFiles: '.ocs,.ocf,.ocd,.ocg,.ocr,.ocu,.c4d,.c4g,.c4f,.c4r,.c4s,.c4v,.c4l,.c4u', dictDefaultMessage: "<p><i class='fa fa-3x fa-cloud-upload'></i></p><p>Drop your mod files here or click to upload</p>", - maxFilesize: 30, // MB + maxFilesize: 100, // MB } }, picDropzoneOptions () { @@ -181,7 +185,6 @@ acceptedFiles: '.png,.jpg', dictDefaultMessage: "<p><i class='fa fa-3x fa-cloud-upload'></i></p><p>Drop your image here or click to upload</p>", maxFilesize: 3, // MB - maxFiles: 1, thumbnailWidth: null, thumbnailHeight: 300, createImageThumbnails: true, @@ -233,6 +236,7 @@ } let params = { title: this.title, + version: this.version, description: this.description, files: this.files.map(el => el.id), tags: this.tags, @@ -253,6 +257,7 @@ }, reset () { this.title = '' + this.version = '' this.description = '' this.savedScenario = '' this.errors = {} diff --git a/src/pages/UploadDetail.vue b/src/pages/UploadDetail.vue index ec75faa..d93c16d 100644 --- a/src/pages/UploadDetail.vue +++ b/src/pages/UploadDetail.vue @@ -2,27 +2,27 @@ <div> <div v-if="upload"> <q-card> - <q-card-media v-if="upload.pictures.length > 0" overlay-position="top"> + <q-card-media v-if="pictures.length > 0" overlay-position="top"> <q-card-title slot="overlay"> - {{ upload.title }} + {{ upload.title }} v{{ upload.version }} <span slot="subtitle"> - by {{ upload.author.name }}, + <span v-if="hasAuthor">by {{ upload.author.name }}</span>, updated {{ upload.updatedAt | moment("from") }} </span> <span slot="right" class="text-white" style="margin-left: 3rem"> <q-btn @click="$router.push({name: 'upload-list'})" flat round icon="fa-times" color="negative"/> </span> </q-card-title> - <q-carousel class="text-width" v-if="upload.pictures.length > 1" style="height: 300px;" arrows quick-nav infinite autoplay> - <q-carousel-slide v-for="picture in upload.pictures" :key="picture.id" :style="`background: url('${$http.defaults.baseURL}/media/${picture.id}') no-repeat; background-size: 100% auto;`"> + <q-carousel class="text-width" v-if="pictures.length > 1" style="height: 300px;" arrows quick-nav infinite autoplay> + <q-carousel-slide v-for="picture in pictures" :key="picture.id" :style="`background: url('${$http.defaults.baseURL}/media/${picture.id}') no-repeat; background-size: 100% auto;`"> </q-carousel-slide> </q-carousel> - <div v-else :style="`background: url('${$http.defaults.baseURL}/media/${upload.pictures[0].id}') no-repeat; background-size: 100% auto; height: 300px;`"> + <div v-else :style="`background: url('${$http.defaults.baseURL}/media/${pictures[0].id}') no-repeat; background-size: 100% auto; height: 300px;`"> </div> </q-card-media> <q-card-title class="bg-positive text-white" v-else> - {{ upload.title }} - <span slot="subtitle" class="text-white">by {{ upload.author.name }}</span> + {{ upload.title }} v{{ upload.version }} + <span slot="subtitle" class="text-white" v-if="hasAuthor">by {{ upload.author.name }}</span> <span slot="right" class="text-white" style="margin-left: 3rem">updated {{ upload.updatedAt | moment("from") }}</span> <span slot="right" class="text-white" style=""> <q-btn @click="$router.push({name: 'upload-list'})" flat round icon="fa-times" color="negative"/> @@ -284,8 +284,11 @@ routeId () { return this.$route.params.uploadId }, + hasAuthor() { + return this.upload && this.upload.author && this.upload.author.name !== "" + }, isAuthor () { - return this.upload && this.upload.author && this.upload.author.name === this.name + return this.hasAuthor && this.upload.author.name === this.name }, name () { return this.$store.state.user.decodedToken.name @@ -293,6 +296,9 @@ loggedIn () { return this.$store.getters['user/loggedIn'] }, + pictures() { + return this.upload ? this.upload.files.filter(file => file["content-type"].startsWith("image/")) : [] + }, filesDropzoneOptions () { return { url: `${this.$http.defaults.baseURL}/media`, |