mirror of
https://github.com/frappe/books.git
synced 2025-01-25 16:18:33 +00:00
[setup] use the new create()
This commit is contained in:
parent
fa3a274df9
commit
605f89ffd9
137
setup/index.js
137
setup/index.js
@ -8,90 +8,87 @@ module.exports = class SetupWizard {
|
|||||||
constructor({postSetup = () => {}}) {
|
constructor({postSetup = () => {}}) {
|
||||||
this.slideList = [];
|
this.slideList = [];
|
||||||
this.indicatorList = [];
|
this.indicatorList = [];
|
||||||
this.currentIndex = 0;
|
|
||||||
this.footerLinks = {};
|
this.footerLinks = {};
|
||||||
|
|
||||||
|
this.currentIndex = 0;
|
||||||
this.data = {};
|
this.data = {};
|
||||||
|
|
||||||
this.postSetup = postSetup;
|
this.postSetup = postSetup;
|
||||||
|
this.make();
|
||||||
|
|
||||||
|
this.showSlide(this.currentIndex);
|
||||||
|
}
|
||||||
|
|
||||||
|
make() {
|
||||||
let body = document.querySelector('body');
|
let body = document.querySelector('body');
|
||||||
|
|
||||||
// container
|
|
||||||
this.container = frappe.ui.add('form', 'setup-container container', body);
|
this.container = frappe.ui.add('form', 'setup-container container', body);
|
||||||
|
|
||||||
// dots
|
|
||||||
this.$indicators = frappe.ui.add('div', 'indicators vertical-margin align-center', this.container);
|
this.$indicators = frappe.ui.add('div', 'indicators vertical-margin align-center', this.container);
|
||||||
|
|
||||||
// make form
|
this.makeSlides();
|
||||||
|
this.makeLinks();
|
||||||
|
}
|
||||||
|
|
||||||
|
makeSlides() {
|
||||||
slideConfigs.forEach(config => {
|
slideConfigs.forEach(config => {
|
||||||
this.formLayout = new FormLayout(config);
|
this.formLayout = new FormLayout(config);
|
||||||
this.slideList.push(this.formLayout);
|
this.slideList.push(this.formLayout);
|
||||||
let form = this.formLayout.form;
|
let form = this.formLayout.form;
|
||||||
|
|
||||||
let title = document.createElement('h3');
|
|
||||||
title.innerHTML = config.title;
|
|
||||||
title.classList.add('text-extra-muted');
|
|
||||||
form.insertBefore(title, form.firstChild);
|
|
||||||
this.container.appendChild(form);
|
this.container.appendChild(form);
|
||||||
|
|
||||||
let indicator = document.createElement('span');
|
let title = frappe.ui.create('h3', {
|
||||||
indicator.classList.add('indicator', 'gray');
|
className: 'text-extra-muted',
|
||||||
this.indicatorList.push(indicator);
|
innerHTML: config.title
|
||||||
this.$indicators.appendChild(indicator);
|
})
|
||||||
});
|
form.insertBefore(title, form.firstChild);
|
||||||
|
|
||||||
// make links
|
let indicator = frappe.ui.create('span', {
|
||||||
|
inside: this.$indicators,
|
||||||
|
className: 'indicator gray'
|
||||||
|
})
|
||||||
|
this.indicatorList.push(indicator);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
makeLinks() {
|
||||||
this.linkArea = frappe.ui.add('div', 'setup-link-area align-right', this.container);
|
this.linkArea = frappe.ui.add('div', 'setup-link-area align-right', this.container);
|
||||||
let links = [
|
|
||||||
{
|
|
||||||
label: 'Prev',
|
|
||||||
name: 'prev',
|
|
||||||
action: () => {
|
|
||||||
this.prevSlide();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Next',
|
|
||||||
name: 'next',
|
|
||||||
action: () => {
|
|
||||||
this.nextSlide();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Complete',
|
|
||||||
name: 'complete',
|
|
||||||
action: (data) => {
|
|
||||||
this.postSetup();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
// this.formLayout.on('change', () => {
|
// this.formLayout.on('change', () => {
|
||||||
// const show = this.doc._dirty && !this.doc.submitted;
|
// const show = this.doc._dirty && !this.doc.submitted;
|
||||||
// this.saveButton.classList.toggle('hide', !show);
|
// this.saveButton.classList.toggle('hide', !show);
|
||||||
// });
|
// });
|
||||||
|
|
||||||
links.map(link => {
|
this.getFooterLinks().map(link => {
|
||||||
let $link = utils.addLink(link.label, this.linkArea, () => {
|
let $link = utils.addLink(link.label, this.linkArea, () => {
|
||||||
|
this.buildData();
|
||||||
link.action(this.data);
|
link.action(this.data);
|
||||||
});
|
});
|
||||||
this.footerLinks[link.name] = $link;
|
this.footerLinks[link.name] = $link;
|
||||||
})
|
})
|
||||||
|
|
||||||
this.showSlide(this.currentIndex);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
make() {
|
buildData() {
|
||||||
//
|
this.data = {};
|
||||||
|
this.slideList.forEach(slide => {
|
||||||
|
Object.assign(this.data, slide.doc);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
showSlide(index) {
|
showSlide(index) {
|
||||||
utils.activate(this.container, this.slideList[index].form, 'form-body', 'active');
|
utils.activate(this.container, this.slideList[index].form, 'form-body', 'active');
|
||||||
this.slideList[index].controlList[0].input.blur();
|
this.slideList[index].controlList[0].input.blur();
|
||||||
this.activateIndicator(index);
|
this.activateIndicator(index);
|
||||||
this.setFooterLinks(index);
|
this.showFooterLinks(index);
|
||||||
this.currentIndex = index;
|
this.currentIndex = index;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
prevSlide() {
|
||||||
|
this.showSlide(this.currentIndex - 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
nextSlide() {
|
||||||
|
this.showSlide(this.currentIndex + 1);
|
||||||
|
}
|
||||||
|
|
||||||
activateIndicator(index) {
|
activateIndicator(index) {
|
||||||
this.indicatorList.forEach(indicator => {indicator.classList.add('gray')});
|
this.indicatorList.forEach(indicator => {indicator.classList.add('gray')});
|
||||||
let indicator = this.indicatorList[index];
|
let indicator = this.indicatorList[index];
|
||||||
@ -101,28 +98,38 @@ module.exports = class SetupWizard {
|
|||||||
indicator.classList.remove('gray');
|
indicator.classList.remove('gray');
|
||||||
}
|
}
|
||||||
|
|
||||||
prevSlide() {
|
showFooterLinks(index) {
|
||||||
this.showSlide(this.currentIndex - 1);
|
let mat = [1, 1, 0]
|
||||||
}
|
|
||||||
|
|
||||||
nextSlide() {
|
|
||||||
this.showSlide(this.currentIndex + 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
setFooterLinks(index) {
|
|
||||||
if(index === 0) {
|
if(index === 0) {
|
||||||
this.footerLinks.prev.classList.add('hide');
|
mat = [0, 1, 0];
|
||||||
this.footerLinks.next.classList.remove('hide');
|
|
||||||
this.footerLinks.complete.classList.add('hide');
|
|
||||||
} else if (index === this.slideList.length - 1) {
|
} else if (index === this.slideList.length - 1) {
|
||||||
this.footerLinks.prev.classList.remove('hide');
|
mat = [1, 0, 1];
|
||||||
this.footerLinks.next.classList.add('hide');
|
|
||||||
this.footerLinks.complete.classList.remove('hide');
|
|
||||||
} else {
|
|
||||||
this.footerLinks.prev.classList.remove('hide');
|
|
||||||
this.footerLinks.next.classList.remove('hide');
|
|
||||||
this.footerLinks.complete.classList.add('hide');
|
|
||||||
}
|
}
|
||||||
|
this.showHideLinks(mat);
|
||||||
|
}
|
||||||
|
|
||||||
|
showHideLinks(matrix = [1, 1, 0]) {
|
||||||
|
let linkNames = this.getFooterLinks().map(link => link.name);
|
||||||
|
matrix.forEach((value, i) => {
|
||||||
|
const fn = value ? 'remove' : 'add';
|
||||||
|
this.footerLinks[linkNames[i]].classList[fn]('hide');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
getFooterLinks() {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: 'Prev', name: 'prev',
|
||||||
|
action: this.prevSlide.bind(this)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Next', name: 'next',
|
||||||
|
action: this.nextSlide.bind(this)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Complete', name: 'complete',
|
||||||
|
action: this.postSetup.bind(this)
|
||||||
|
}
|
||||||
|
];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
420
www/dist/js/bundle.js
vendored
420
www/dist/js/bundle.js
vendored
@ -4575,7 +4575,7 @@ if (typeof undefined === 'function' && undefined.amd) {
|
|||||||
}
|
}
|
||||||
}).call(commonjsGlobal);
|
}).call(commonjsGlobal);
|
||||||
|
|
||||||
|
//# sourceMappingURL=showdown.js.map
|
||||||
});
|
});
|
||||||
|
|
||||||
var moment = createCommonjsModule(function (module, exports) {
|
var moment = createCommonjsModule(function (module, exports) {
|
||||||
@ -23066,7 +23066,7 @@ Popper.placements = placements;
|
|||||||
Popper.Defaults = Defaults;
|
Popper.Defaults = Defaults;
|
||||||
|
|
||||||
|
|
||||||
|
//# sourceMappingURL=popper.js.map
|
||||||
|
|
||||||
|
|
||||||
var popper = Object.freeze({
|
var popper = Object.freeze({
|
||||||
@ -26965,7 +26965,7 @@ exports.Tooltip = Tooltip;
|
|||||||
Object.defineProperty(exports, '__esModule', { value: true });
|
Object.defineProperty(exports, '__esModule', { value: true });
|
||||||
|
|
||||||
})));
|
})));
|
||||||
|
//# sourceMappingURL=bootstrap.js.map
|
||||||
});
|
});
|
||||||
|
|
||||||
unwrapExports(bootstrap);
|
unwrapExports(bootstrap);
|
||||||
@ -27022,6 +27022,43 @@ Dropdown.instances = 0;
|
|||||||
var dropdown = Dropdown;
|
var dropdown = Dropdown;
|
||||||
|
|
||||||
var ui = {
|
var ui = {
|
||||||
|
create(tag, o) {
|
||||||
|
let element = document.createElement(tag);
|
||||||
|
|
||||||
|
let $ = (expr, con) => {
|
||||||
|
return typeof expr === "string"
|
||||||
|
? (con || document).querySelector(expr)
|
||||||
|
: expr || null;
|
||||||
|
};
|
||||||
|
|
||||||
|
for (var i in o) {
|
||||||
|
let val = o[i];
|
||||||
|
|
||||||
|
if (i === "inside") {
|
||||||
|
$(val).appendChild(element);
|
||||||
|
}
|
||||||
|
else if (i === "around") {
|
||||||
|
let ref = $(val);
|
||||||
|
ref.parentNode.insertBefore(element, ref);
|
||||||
|
element.appendChild(ref);
|
||||||
|
|
||||||
|
} else if (i === "styles") {
|
||||||
|
if(typeof val === "object") {
|
||||||
|
Object.keys(val).map(prop => {
|
||||||
|
element.style[prop] = val[prop];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else if (i in element ) {
|
||||||
|
element[i] = val;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
element.setAttribute(i, val);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return element;
|
||||||
|
},
|
||||||
|
|
||||||
add(tag, className, parent, textContent) {
|
add(tag, className, parent, textContent) {
|
||||||
let element = document.createElement(tag);
|
let element = document.createElement(tag);
|
||||||
if (className) {
|
if (className) {
|
||||||
@ -39817,11 +39854,6 @@ var htmlmixed = createCommonjsModule(function (module, exports) {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// const frappe = require('frappejs');
|
|
||||||
|
|
||||||
// eslint-disable-line
|
|
||||||
// eslint-disable-line
|
|
||||||
|
|
||||||
class CodeControl extends base {
|
class CodeControl extends base {
|
||||||
makeInput() {
|
makeInput() {
|
||||||
if (!this.options) {
|
if (!this.options) {
|
||||||
@ -48152,9 +48184,6 @@ DataTable.__version__ = packageJson.version;
|
|||||||
module.exports = DataTable;
|
module.exports = DataTable;
|
||||||
});
|
});
|
||||||
|
|
||||||
// eslint-disable-line
|
|
||||||
|
|
||||||
|
|
||||||
var modal = class Modal extends observable {
|
var modal = class Modal extends observable {
|
||||||
constructor({ title, body, primary, secondary }) {
|
constructor({ title, body, primary, secondary }) {
|
||||||
super();
|
super();
|
||||||
@ -48607,9 +48636,6 @@ var formLayout = class FormLayout extends observable {
|
|||||||
makeControls(fields, parent) {
|
makeControls(fields, parent) {
|
||||||
for(let field of fields) {
|
for(let field of fields) {
|
||||||
if (!field.hidden && controls$1.getControlClass(field.fieldtype)) {
|
if (!field.hidden && controls$1.getControlClass(field.fieldtype)) {
|
||||||
if (this.inline) {
|
|
||||||
field.inline = true;
|
|
||||||
}
|
|
||||||
let control = controls$1.makeControl({field: field, form: this, parent: parent});
|
let control = controls$1.makeControl({field: field, form: this, parent: parent});
|
||||||
this.controlList.push(control);
|
this.controlList.push(control);
|
||||||
this.controls[field.fieldname] = control;
|
this.controls[field.fieldname] = control;
|
||||||
@ -56784,7 +56810,7 @@ module.exports = installCompat;
|
|||||||
/***/ })
|
/***/ })
|
||||||
/******/ ]);
|
/******/ ]);
|
||||||
});
|
});
|
||||||
|
//# sourceMappingURL=nunjucks.js.map
|
||||||
});
|
});
|
||||||
|
|
||||||
unwrapExports(nunjucks);
|
unwrapExports(nunjucks);
|
||||||
@ -56985,10 +57011,6 @@ var menu = class DeskMenu {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// const Search = require('./search');
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const views = {};
|
const views = {};
|
||||||
views.Form = formpage;
|
views.Form = formpage;
|
||||||
views.List = listpage;
|
views.List = listpage;
|
||||||
@ -57731,10 +57753,6 @@ var client = {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// baseclass for report
|
|
||||||
// `url` url for report
|
|
||||||
// `getColumns` return columns
|
|
||||||
|
|
||||||
var reportpage = class ReportPage extends page {
|
var reportpage = class ReportPage extends page {
|
||||||
constructor({title, filterFields}) {
|
constructor({title, filterFields}) {
|
||||||
super({title: title, hasRoute: true});
|
super({title: title, hasRoute: true});
|
||||||
@ -58633,6 +58651,215 @@ var TaxSummary = {
|
|||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var Address = {
|
||||||
|
"name": "Address",
|
||||||
|
"doctype": "DocType",
|
||||||
|
"isSingle": 0,
|
||||||
|
"titleField": "addressTitle",
|
||||||
|
"keywordFields": [
|
||||||
|
"addressTitle"
|
||||||
|
],
|
||||||
|
pageSettings: {
|
||||||
|
hideTitle: true
|
||||||
|
},
|
||||||
|
"naming": "autoincrement",
|
||||||
|
"fields": [
|
||||||
|
{
|
||||||
|
"fieldname": "addressTitle",
|
||||||
|
"label": "Address Title",
|
||||||
|
"fieldtype": "Data",
|
||||||
|
"required": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "addressType",
|
||||||
|
"label": "Address Type",
|
||||||
|
"fieldtype": "Select",
|
||||||
|
"options": [
|
||||||
|
"Billing", "Shipping", "Office",
|
||||||
|
"Personal", "Plant", "Postal",
|
||||||
|
"Shop", "Subsidary", "Warehouse",
|
||||||
|
"Current", "Permanent", "Other"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "addressLine1",
|
||||||
|
"label": "Address Line 1",
|
||||||
|
"fieldtype": "Data",
|
||||||
|
"required": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "addressLine2",
|
||||||
|
"label": "Address Line 2",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "city",
|
||||||
|
"label": "City / Town",
|
||||||
|
"fieldtype": "Data",
|
||||||
|
"required": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "county",
|
||||||
|
"label": "County",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "state",
|
||||||
|
"label": "State",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "country",
|
||||||
|
"label": "Country",
|
||||||
|
"fieldtype": "Data",
|
||||||
|
"required": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "postalCode",
|
||||||
|
"label": "Postal Code",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "emailAddress",
|
||||||
|
"label": "Email Address",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "phone",
|
||||||
|
"label": "Phone",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "fax",
|
||||||
|
"label": "Fax",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "isPreferredBilling",
|
||||||
|
"label": "Preferred Billing Address",
|
||||||
|
"fieldtype": "Check"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "isShippingBilling",
|
||||||
|
"label": "Preferred Shipping Address",
|
||||||
|
"fieldtype": "Check"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
events: {
|
||||||
|
validate: (doc) => {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
listSettings: {
|
||||||
|
getFields(list) {
|
||||||
|
return ['addressTitle', 'addressType'];
|
||||||
|
},
|
||||||
|
getRowHTML(list, data) {
|
||||||
|
console.log(list, data);
|
||||||
|
return `<div class="col-11">${list.getNameHTML(data)} (${data.addressType})</div>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
layout: [
|
||||||
|
// section 1
|
||||||
|
{
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
fields: [ "addressTitle", "addressType", "addressLine1",
|
||||||
|
"addressLine2", "city", "county", "state", "country",
|
||||||
|
"postalCode"]
|
||||||
|
},
|
||||||
|
{ fields: [ "emailAddress", "phone", "fax", "isPreferredBilling", "isShippingBilling" ] }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
var Contact = {
|
||||||
|
"name": "Contact",
|
||||||
|
"doctype": "DocType",
|
||||||
|
"isSingle": 0,
|
||||||
|
"naming": "autoincrement",
|
||||||
|
"pageSettings": {
|
||||||
|
"hideTitle": true
|
||||||
|
},
|
||||||
|
"titleField": "fullName",
|
||||||
|
"keywordFields": [
|
||||||
|
"fullName"
|
||||||
|
],
|
||||||
|
"titleField": "fullName",
|
||||||
|
"fields": [
|
||||||
|
{
|
||||||
|
"fieldname": "fullName",
|
||||||
|
"label": "Full Name",
|
||||||
|
"fieldtype": "Data",
|
||||||
|
"required": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "emailAddress",
|
||||||
|
"label": "Email Address",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "userId",
|
||||||
|
"label": "User ID",
|
||||||
|
"fieldtype": "Link",
|
||||||
|
"target": "User",
|
||||||
|
"hidden": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "status",
|
||||||
|
"label": "Status",
|
||||||
|
"fieldtype": "Select",
|
||||||
|
"options": ["Passive", "Open", "Replied"]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "gender",
|
||||||
|
"label": "Gender",
|
||||||
|
"fieldtype": "Select",
|
||||||
|
"options": ["Male", "Female", "Gender"]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "mobileNumber",
|
||||||
|
"label": "Mobile Number",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"fieldname": "phone",
|
||||||
|
"label": "Phone",
|
||||||
|
"fieldtype": "Data"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
events: {
|
||||||
|
validate: (doc) => {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
listSettings: {
|
||||||
|
getFields(list) {
|
||||||
|
return ['fullName'];
|
||||||
|
},
|
||||||
|
getRowHTML(list, data) {
|
||||||
|
console.log(list, data);
|
||||||
|
return `<div class="col-11">${list.getNameHTML(data)}</div>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
layout: [
|
||||||
|
// section 1
|
||||||
|
{
|
||||||
|
columns: [
|
||||||
|
{ fields: [ "fullName", "emailAddress", "userId", "status" ] },
|
||||||
|
{ fields: [ "postalCode", "gender", "phone", "mobileNumber" ] }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
var models$2 = {
|
var models$2 = {
|
||||||
models: {
|
models: {
|
||||||
Account: Account,
|
Account: Account,
|
||||||
@ -58651,7 +58878,9 @@ var models$2 = {
|
|||||||
|
|
||||||
Tax: Tax,
|
Tax: Tax,
|
||||||
TaxDetail: TaxDetail,
|
TaxDetail: TaxDetail,
|
||||||
TaxSummary: TaxSummary
|
TaxSummary: TaxSummary,
|
||||||
|
Address: Address,
|
||||||
|
Contact: Contact
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -58706,6 +58935,8 @@ var client$2 = {
|
|||||||
frappejs.desk.menu.addItem('Items', '#list/Item');
|
frappejs.desk.menu.addItem('Items', '#list/Item');
|
||||||
frappejs.desk.menu.addItem('Customers', '#list/Customer');
|
frappejs.desk.menu.addItem('Customers', '#list/Customer');
|
||||||
frappejs.desk.menu.addItem('Invoice', '#list/Invoice');
|
frappejs.desk.menu.addItem('Invoice', '#list/Invoice');
|
||||||
|
frappejs.desk.menu.addItem('Address', "#list/Address");
|
||||||
|
frappejs.desk.menu.addItem('Contact', "#list/Contact");
|
||||||
frappejs.desk.menu.addItem('Settings', () => frappejs.desk.showFormModal('SystemSettings'));
|
frappejs.desk.menu.addItem('Settings', () => frappejs.desk.showFormModal('SystemSettings'));
|
||||||
|
|
||||||
frappejs.router.default = '#list/ToDo';
|
frappejs.router.default = '#list/ToDo';
|
||||||
@ -59154,7 +59385,6 @@ object-assign
|
|||||||
@license MIT
|
@license MIT
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* eslint-disable no-unused-vars */
|
|
||||||
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
|
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
|
||||||
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
||||||
var propIsEnumerable = Object.prototype.propertyIsEnumerable;
|
var propIsEnumerable = Object.prototype.propertyIsEnumerable;
|
||||||
@ -59304,95 +59534,93 @@ var octicons = data$4;
|
|||||||
const triangleRight = octicons["triangle-right"].toSVG({ "width": 5});
|
const triangleRight = octicons["triangle-right"].toSVG({ "width": 5});
|
||||||
const triangleDown = octicons["triangle-down"].toSVG({ "width": 10});
|
const triangleDown = octicons["triangle-down"].toSVG({ "width": 10});
|
||||||
const triangleLeft = octicons["triangle-left"].toSVG({ "width": 5});
|
const triangleLeft = octicons["triangle-left"].toSVG({ "width": 5});
|
||||||
|
// const octiconPrimitiveDot = octicons["octicon-primitive-dot"].toSVG({ "width": 7});
|
||||||
|
|
||||||
var setup = class SetupWizard {
|
var setup = class SetupWizard {
|
||||||
constructor({postSetup = () => {}}) {
|
constructor({postSetup = () => {}}) {
|
||||||
this.slideList = [];
|
this.slideList = [];
|
||||||
this.indicatorList = [];
|
this.indicatorList = [];
|
||||||
this.currentIndex = 0;
|
|
||||||
this.footerLinks = {};
|
this.footerLinks = {};
|
||||||
|
|
||||||
|
this.currentIndex = 0;
|
||||||
this.data = {};
|
this.data = {};
|
||||||
|
|
||||||
this.postSetup = postSetup;
|
this.postSetup = postSetup;
|
||||||
|
this.make();
|
||||||
|
|
||||||
|
this.showSlide(this.currentIndex);
|
||||||
|
}
|
||||||
|
|
||||||
|
make() {
|
||||||
let body = document.querySelector('body');
|
let body = document.querySelector('body');
|
||||||
|
|
||||||
// container
|
|
||||||
this.container = frappejs.ui.add('form', 'setup-container container', body);
|
this.container = frappejs.ui.add('form', 'setup-container container', body);
|
||||||
|
|
||||||
// dots
|
|
||||||
this.$indicators = frappejs.ui.add('div', 'indicators vertical-margin align-center', this.container);
|
this.$indicators = frappejs.ui.add('div', 'indicators vertical-margin align-center', this.container);
|
||||||
|
|
||||||
// make form
|
this.makeSlides();
|
||||||
|
this.makeLinks();
|
||||||
|
}
|
||||||
|
|
||||||
|
makeSlides() {
|
||||||
config.forEach(config$$1 => {
|
config.forEach(config$$1 => {
|
||||||
this.formLayout = new formLayout(config$$1);
|
this.formLayout = new formLayout(config$$1);
|
||||||
this.slideList.push(this.formLayout);
|
this.slideList.push(this.formLayout);
|
||||||
let form = this.formLayout.form;
|
let form = this.formLayout.form;
|
||||||
|
|
||||||
let title = document.createElement('h3');
|
|
||||||
title.innerHTML = config$$1.title;
|
|
||||||
title.classList.add('text-extra-muted');
|
|
||||||
form.insertBefore(title, form.firstChild);
|
|
||||||
this.container.appendChild(form);
|
this.container.appendChild(form);
|
||||||
|
|
||||||
let indicator = document.createElement('span');
|
let title = frappejs.ui.create('h3', {
|
||||||
indicator.classList.add('indicator', 'gray');
|
className: 'text-extra-muted',
|
||||||
this.indicatorList.push(indicator);
|
innerHTML: config$$1.title
|
||||||
this.$indicators.appendChild(indicator);
|
});
|
||||||
});
|
form.insertBefore(title, form.firstChild);
|
||||||
|
|
||||||
// make links
|
let indicator = frappejs.ui.create('span', {
|
||||||
|
inside: this.$indicators,
|
||||||
|
className: 'indicator gray'
|
||||||
|
});
|
||||||
|
this.indicatorList.push(indicator);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
makeLinks() {
|
||||||
this.linkArea = frappejs.ui.add('div', 'setup-link-area align-right', this.container);
|
this.linkArea = frappejs.ui.add('div', 'setup-link-area align-right', this.container);
|
||||||
let links = [
|
|
||||||
{
|
|
||||||
label: 'Prev',
|
|
||||||
name: 'prev',
|
|
||||||
action: () => {
|
|
||||||
this.prevSlide();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Next',
|
|
||||||
name: 'next',
|
|
||||||
action: () => {
|
|
||||||
this.nextSlide();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Complete',
|
|
||||||
name: 'complete',
|
|
||||||
action: (data) => {
|
|
||||||
this.postSetup();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
// this.formLayout.on('change', () => {
|
// this.formLayout.on('change', () => {
|
||||||
// const show = this.doc._dirty && !this.doc.submitted;
|
// const show = this.doc._dirty && !this.doc.submitted;
|
||||||
// this.saveButton.classList.toggle('hide', !show);
|
// this.saveButton.classList.toggle('hide', !show);
|
||||||
// });
|
// });
|
||||||
|
|
||||||
links.map(link => {
|
this.getFooterLinks().map(link => {
|
||||||
let $link = utils$3.addLink(link.label, this.linkArea, () => {
|
let $link = utils$3.addLink(link.label, this.linkArea, () => {
|
||||||
|
this.buildData();
|
||||||
link.action(this.data);
|
link.action(this.data);
|
||||||
});
|
});
|
||||||
this.footerLinks[link.name] = $link;
|
this.footerLinks[link.name] = $link;
|
||||||
});
|
});
|
||||||
|
|
||||||
this.showSlide(this.currentIndex);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
make() {
|
buildData() {
|
||||||
//
|
this.data = {};
|
||||||
|
this.slideList.forEach(slide => {
|
||||||
|
Object.assign(this.data, slide.doc);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
showSlide(index) {
|
showSlide(index) {
|
||||||
utils$3.activate(this.container, this.slideList[index].form, 'form-body', 'active');
|
utils$3.activate(this.container, this.slideList[index].form, 'form-body', 'active');
|
||||||
this.slideList[index].controlList[0].input.blur();
|
this.slideList[index].controlList[0].input.blur();
|
||||||
this.activateIndicator(index);
|
this.activateIndicator(index);
|
||||||
this.setFooterLinks(index);
|
this.showFooterLinks(index);
|
||||||
this.currentIndex = index;
|
this.currentIndex = index;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
prevSlide() {
|
||||||
|
this.showSlide(this.currentIndex - 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
nextSlide() {
|
||||||
|
this.showSlide(this.currentIndex + 1);
|
||||||
|
}
|
||||||
|
|
||||||
activateIndicator(index) {
|
activateIndicator(index) {
|
||||||
this.indicatorList.forEach(indicator => {indicator.classList.add('gray');});
|
this.indicatorList.forEach(indicator => {indicator.classList.add('gray');});
|
||||||
let indicator = this.indicatorList[index];
|
let indicator = this.indicatorList[index];
|
||||||
@ -59402,39 +59630,49 @@ var setup = class SetupWizard {
|
|||||||
indicator.classList.remove('gray');
|
indicator.classList.remove('gray');
|
||||||
}
|
}
|
||||||
|
|
||||||
prevSlide() {
|
showFooterLinks(index) {
|
||||||
this.showSlide(this.currentIndex - 1);
|
let mat = [1, 1, 0];
|
||||||
}
|
|
||||||
|
|
||||||
nextSlide() {
|
|
||||||
this.showSlide(this.currentIndex + 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
setFooterLinks(index) {
|
|
||||||
if(index === 0) {
|
if(index === 0) {
|
||||||
this.footerLinks.prev.classList.add('hide');
|
mat = [0, 1, 0];
|
||||||
this.footerLinks.next.classList.remove('hide');
|
|
||||||
this.footerLinks.complete.classList.add('hide');
|
|
||||||
} else if (index === this.slideList.length - 1) {
|
} else if (index === this.slideList.length - 1) {
|
||||||
this.footerLinks.prev.classList.remove('hide');
|
mat = [1, 0, 1];
|
||||||
this.footerLinks.next.classList.add('hide');
|
|
||||||
this.footerLinks.complete.classList.remove('hide');
|
|
||||||
} else {
|
|
||||||
this.footerLinks.prev.classList.remove('hide');
|
|
||||||
this.footerLinks.next.classList.remove('hide');
|
|
||||||
this.footerLinks.complete.classList.add('hide');
|
|
||||||
}
|
}
|
||||||
|
this.showHideLinks(mat);
|
||||||
|
}
|
||||||
|
|
||||||
|
showHideLinks(matrix = [1, 1, 0]) {
|
||||||
|
let linkNames = this.getFooterLinks().map(link => link.name);
|
||||||
|
matrix.forEach((value, i) => {
|
||||||
|
const fn = value ? 'remove' : 'add';
|
||||||
|
this.footerLinks[linkNames[i]].classList[fn]('hide');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
getFooterLinks() {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: 'Prev', name: 'prev',
|
||||||
|
action: this.prevSlide.bind(this)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Next', name: 'next',
|
||||||
|
action: this.nextSlide.bind(this)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Complete', name: 'complete',
|
||||||
|
action: this.postSetup.bind(this)
|
||||||
|
}
|
||||||
|
];
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// start server
|
|
||||||
client.start({
|
client.start({
|
||||||
server: 'localhost:8000',
|
server: 'localhost:8000',
|
||||||
makeDesk: 0
|
makeDesk: 0
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
new setup({
|
new setup({
|
||||||
postSetup: async (data) => {
|
postSetup: async (data) => {
|
||||||
|
console.log(data);
|
||||||
client.makeDesk(3);
|
client.makeDesk(3);
|
||||||
client$2.start();
|
client$2.start();
|
||||||
|
|
||||||
|
@ -9,6 +9,7 @@ client.start({
|
|||||||
}).then(() => {
|
}).then(() => {
|
||||||
new SetupWizard({
|
new SetupWizard({
|
||||||
postSetup: async (data) => {
|
postSetup: async (data) => {
|
||||||
|
console.log(data);
|
||||||
client.makeDesk(3);
|
client.makeDesk(3);
|
||||||
appClient.start();
|
appClient.start();
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user