discourse/app/assets/javascripts/wizard/components/wizard-field-image.js.es6

61 lines
1.7 KiB
Plaintext
Raw Normal View History

import Component from "@ember/component";
2018-06-15 23:03:24 +08:00
import getUrl from "discourse-common/lib/get-url";
import computed from "ember-addons/ember-computed-decorators";
import { getToken } from "wizard/lib/ajax";
import { getOwner } from "discourse-common/lib/get-owner";
import { dasherize } from "@ember/string";
2016-09-09 04:58:07 +08:00
export default Component.extend({
2018-06-15 23:03:24 +08:00
classNames: ["wizard-image-row"],
2016-09-09 04:58:07 +08:00
uploading: false,
2018-06-15 23:03:24 +08:00
@computed("field.id")
previewComponent(id) {
const componentName = `image-preview-${dasherize(id)}`;
const exists = getOwner(this).lookup(`component:${componentName}`);
2018-06-15 23:03:24 +08:00
return exists ? componentName : "wizard-image-preview";
},
2016-09-09 04:58:07 +08:00
didInsertElement() {
this._super(...arguments);
2016-09-09 04:58:07 +08:00
const $upload = $(this.element);
2016-09-09 04:58:07 +08:00
2018-06-15 23:03:24 +08:00
const id = this.get("field.id");
2016-09-09 04:58:07 +08:00
$upload.fileupload({
url: getUrl("/uploads.json"),
2018-06-15 23:03:24 +08:00
formData: {
synchronous: true,
type: `wizard_${id}`,
authenticity_token: getToken()
},
dataType: "json",
dropZone: $upload
2016-09-09 04:58:07 +08:00
});
2018-06-15 23:03:24 +08:00
$upload.on("fileuploadsubmit", () => this.set("uploading", true));
2016-09-09 04:58:07 +08:00
2018-06-15 23:03:24 +08:00
$upload.on("fileuploaddone", (e, response) => {
this.set("field.value", response.result.url);
this.set("uploading", false);
2016-09-09 04:58:07 +08:00
});
$upload.on("fileuploadfail", (e, response) => {
2018-07-12 15:12:11 +08:00
let message = I18n.t("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);
});
2018-06-15 23:03:24 +08:00
}
2016-09-09 04:58:07 +08:00
});