fix: Signature form (#18477)

Co-authored-by: Ankush Menat <ankush@frappe.io>
Co-authored-by: Shariq Ansari <sharique.rik@gmail.com>
Co-authored-by: Shariq Ansari <30859809+shariquerik@users.noreply.github.com>
This commit is contained in:
DrZoidberg09 2022-10-31 15:15:46 +01:00 committed by GitHub
parent cd9ee5b98c
commit 0bc2f16772
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 29 deletions

View file

@ -5,19 +5,26 @@ frappe.ui.form.ControlSignature = class ControlSignature extends frappe.ui.form.
this.loading = false;
super.make();
this.load_lib().then(() => {
// make jSignature field
this.body = $('<div class="signature-field"></div>').appendTo(me.wrapper);
if (this.df.label) {
$(this.wrapper).find("label").text(__(this.df.label));
}
if (this.body.is(":visible")) {
this.make_pad();
} else {
$(document).on("frappe.ui.Dialog:shown", () => {
this.make_pad();
});
}
frappe.require("/assets/frappe/js/lib/jSignature.min.js").then(() => {
// make jSignature field
me.body = $('<div class="signature-field"></div>').prependTo(me.$input_wrapper);
new ResizeObserver(() => me.make_pad()).observe(me.body[0]);
});
this.img_wrapper = $(`<div class="signature-display">
<div class="missing-image attach-missing-image">
${frappe.utils.icon("restriction", "md")}</i>
</div></div>`).prependTo(this.$input_wrapper);
this.img = $("<img class='img-responsive attach-image-display'>")
.appendTo(this.img_wrapper)
.toggle(false);
}
make_pad() {
let width = this.body.width();
if (width > 0 && !this.$pad) {
@ -25,9 +32,10 @@ frappe.ui.form.ControlSignature = class ControlSignature extends frappe.ui.form.
.jSignature({
height: 200,
color: "var(--text-color)",
width: this.body.width(),
decorColor: "black",
width,
lineWidth: 2,
"background-color": "var(--control-bg)",
backgroundColor: "var(--control-bg)",
})
.on("change", this.on_save_sign.bind(this));
this.load_pad();
@ -43,15 +51,8 @@ frappe.ui.form.ControlSignature = class ControlSignature extends frappe.ui.form.
this.on_reset_sign();
return false;
});
this.refresh_input();
}
this.img_wrapper = $(`<div class="signature-display">
<div class="missing-image attach-missing-image">
${frappe.utils.icon("restriction", "md")}</i>
</div></div>`).appendTo(this.wrapper);
this.img = $("<img class='img-responsive attach-image-display'>")
.appendTo(this.img_wrapper)
.toggle(false);
}
refresh_input() {
// signature dom is not ready
@ -131,11 +132,4 @@ frappe.ui.form.ControlSignature = class ControlSignature extends frappe.ui.form.
this.set_my_value(base64_img);
this.set_image(this.get_value());
}
load_lib() {
if (!this.load_lib_promise) {
this.load_lib_promise = frappe.require("/assets/frappe/js/lib/jSignature.min.js");
}
return this.load_lib_promise;
}
};

View file

@ -423,12 +423,11 @@ textarea.form-control {
border: 1px solid var(--border-color);
border-radius: var(--border-radius);
position: relative;
margin-top: -10px;
}
.signature-display {
margin: 7px 0px;
background: var(--control-bg);
border-radius: var(--border-radius);
.attach-missing-image,
.attach-image-display {
cursor: pointer;