Spiegel von
https://github.com/paviliondev/discourse-custom-wizard.git
synchronisiert 2024-11-22 09:20:29 +01:00
DEV: Use uppy in upload field (#167)
* Move from jquery uploads to uppy.js * Apply prettier and update version
Dieser Commit ist enthalten in:
Ursprung
b37f7dbdd5
Commit
517da30a4c
3 geänderte Dateien mit 19 neuen und 58 gelöschten Zeilen
|
@ -1,63 +1,24 @@
|
|||
import getUrl from "discourse-common/lib/get-url";
|
||||
import { getToken } from "wizard/lib/ajax";
|
||||
import WizardI18n from "../lib/wizard-i18n";
|
||||
import UppyUploadMixin from "discourse/mixins/uppy-upload";
|
||||
import Component from "@ember/component";
|
||||
import { computed } from "@ember/object";
|
||||
|
||||
export default Ember.Component.extend({
|
||||
export default Component.extend(UppyUploadMixin, {
|
||||
classNames: ["wizard-field-upload"],
|
||||
classNameBindings: ["isImage"],
|
||||
uploading: false,
|
||||
isImage: false,
|
||||
type: computed(function () {
|
||||
return `wizard_${this.field.id}`;
|
||||
}),
|
||||
isImage: computed("field.value.extension", function () {
|
||||
return (
|
||||
this.field.value &&
|
||||
this.siteSettings.wizard_recognised_image_upload_formats
|
||||
.split("|")
|
||||
.includes(this.field.value.extension)
|
||||
);
|
||||
}),
|
||||
|
||||
didInsertElement() {
|
||||
this._super();
|
||||
|
||||
const $upload = $(this.element);
|
||||
|
||||
const id = this.get("field.id");
|
||||
|
||||
$upload.fileupload({
|
||||
url: getUrl("/uploads.json"),
|
||||
formData: {
|
||||
synchronous: true,
|
||||
type: `wizard_${id}`,
|
||||
authenticity_token: getToken(),
|
||||
},
|
||||
dataType: "json",
|
||||
dropZone: $upload,
|
||||
});
|
||||
|
||||
$upload.on("fileuploadsubmit", () => this.set("uploading", true));
|
||||
|
||||
$upload.on("fileuploaddone", (e, response) => {
|
||||
this.setProperties({
|
||||
"field.value": response.result,
|
||||
uploading: false,
|
||||
});
|
||||
if (
|
||||
Discourse.SiteSettings.wizard_recognised_image_upload_formats
|
||||
.split("|")
|
||||
.includes(response.result.extension)
|
||||
) {
|
||||
this.setProperties({
|
||||
isImage: true,
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$upload.on("fileuploadfail", (e, response) => {
|
||||
let message = WizardI18n("wizard.upload_error");
|
||||
if (response.jqXHR.responseJSON && response.jqXHR.responseJSON.errors) {
|
||||
message = response.jqXHR.responseJSON.errors.join("\n");
|
||||
}
|
||||
|
||||
window.swal({
|
||||
customClass: "wizard-warning",
|
||||
title: "",
|
||||
text: message,
|
||||
type: "warning",
|
||||
confirmButtonColor: "#6699ff",
|
||||
});
|
||||
this.set("uploading", false);
|
||||
});
|
||||
uploadDone(upload) {
|
||||
this.set("field.value", upload);
|
||||
},
|
||||
});
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
{{d-icon "upload"}}
|
||||
{{/if}}
|
||||
|
||||
<input disabled={{uploading}} type="file" accept={{field.file_types}} style="visibility: hidden; position: absolute;" >
|
||||
<input disabled={{uploading}} class="hidden-upload-field" type="file" accept={{field.file_types}} style="visibility: hidden; position: absolute;" >
|
||||
</label>
|
||||
|
||||
{{#if field.value}}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
# frozen_string_literal: true
|
||||
# name: discourse-custom-wizard
|
||||
# about: Create custom wizards
|
||||
# version: 1.16.0
|
||||
# version: 1.16.1
|
||||
# authors: Angus McLeod
|
||||
# url: https://github.com/paviliondev/discourse-custom-wizard
|
||||
# contact emails: angus@thepavilion.io
|
||||
|
|
Laden …
In neuem Issue referenzieren