ps-toolkit-ui 1.12.60 → 1.12.62
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/ps-toolkit-ui.umd.js +65 -29
- package/bundles/ps-toolkit-ui.umd.js.map +1 -1
- package/bundles/ps-toolkit-ui.umd.min.js +1 -1
- package/bundles/ps-toolkit-ui.umd.min.js.map +1 -1
- package/esm2015/lib/classes/helper.class.js +2 -2
- package/esm2015/lib/classes/steps.class.js +4 -2
- package/esm2015/lib/components/steps/steps.component.js +62 -29
- package/fesm2015/ps-toolkit-ui.js +62 -29
- package/fesm2015/ps-toolkit-ui.js.map +1 -1
- package/lib/classes/steps.class.d.ts +2 -1
- package/lib/components/steps/steps.component.d.ts +12 -6
- package/package.json +1 -1
- package/ps-toolkit-ui.metadata.json +1 -1
|
@@ -1148,7 +1148,7 @@
|
|
|
1148
1148
|
if (dt === null) {
|
|
1149
1149
|
return '';
|
|
1150
1150
|
}
|
|
1151
|
-
var d = parseInt(dt.substring(6, dt.length - 2), 10) + (
|
|
1151
|
+
var d = parseInt(dt.substring(6, dt.length - 2), 10) + (1 * 3600000);
|
|
1152
1152
|
return moment__namespace(d).locale('fa').format(format + 'z');
|
|
1153
1153
|
}
|
|
1154
1154
|
catch (e) {
|
|
@@ -2578,29 +2578,11 @@
|
|
|
2578
2578
|
};
|
|
2579
2579
|
|
|
2580
2580
|
var StepsComponent = /** @class */ (function () {
|
|
2581
|
-
function StepsComponent(
|
|
2582
|
-
this.router = router;
|
|
2581
|
+
function StepsComponent() {
|
|
2583
2582
|
}
|
|
2584
|
-
StepsComponent.prototype.
|
|
2585
|
-
|
|
2586
|
-
|
|
2587
|
-
StepsComponent.prototype.changeStep = function (i, s) {
|
|
2588
|
-
if (s.url != null) {
|
|
2589
|
-
if (this.getActive() !== 0 || this.steps.activeAll) {
|
|
2590
|
-
this.router.navigate([s.url]);
|
|
2591
|
-
}
|
|
2592
|
-
}
|
|
2593
|
-
else {
|
|
2594
|
-
if (s.onClick) {
|
|
2595
|
-
s.onClick(s);
|
|
2596
|
-
}
|
|
2597
|
-
else {
|
|
2598
|
-
var a = this.steps.items.findIndex(function (x) { return x.active; });
|
|
2599
|
-
if (a > i || this.steps.activeAll) {
|
|
2600
|
-
this.steps.items[a].active = false;
|
|
2601
|
-
this.steps.items[i].active = true;
|
|
2602
|
-
}
|
|
2603
|
-
}
|
|
2583
|
+
StepsComponent.prototype.changeStep = function (s) {
|
|
2584
|
+
if (this.steps.updateAccess) {
|
|
2585
|
+
this.steps.loadStep(s);
|
|
2604
2586
|
}
|
|
2605
2587
|
};
|
|
2606
2588
|
StepsComponent.prototype.onDelete = function (s) {
|
|
@@ -2611,18 +2593,70 @@
|
|
|
2611
2593
|
this.steps.items = this.steps.items.filter(function (x) { return x.name !== s.name; });
|
|
2612
2594
|
s.onDelete(s);
|
|
2613
2595
|
};
|
|
2596
|
+
StepsComponent.prototype.ngOnInit = function () {
|
|
2597
|
+
var _this = this;
|
|
2598
|
+
this.saveNext = new InputClass(this.steps.environment, this.steps.l, 'SaveNext', 'fa-duotone fa-arrow-left', exports.InputType.Button, 'f-l w-25 h-25 green left-icon');
|
|
2599
|
+
this.saveNext.loadingName = this.steps.l('LoadingText', this.steps.l('Processing'));
|
|
2600
|
+
this.saveNext.onClick = function () {
|
|
2601
|
+
_this.nextStep(_this.saveNext);
|
|
2602
|
+
};
|
|
2603
|
+
this.editNext = new InputClass(this.steps.environment, this.steps.l, 'EditNext', 'fa-duotone fa-arrow-left', exports.InputType.Button, 'f-l w-25 h-25 blue left-icon');
|
|
2604
|
+
this.editNext.loadingName = this.steps.l('LoadingText', this.steps.l('Processing'));
|
|
2605
|
+
this.editNext.onClick = function () {
|
|
2606
|
+
_this.nextStep(_this.editNext);
|
|
2607
|
+
};
|
|
2608
|
+
this.previous = new InputClass(this.steps.environment, this.steps.l, 'Previous', 'fa-duotone fa-arrow-right', exports.InputType.Button, 'f-r w-25 h-25 red');
|
|
2609
|
+
this.previous.onClick = function () {
|
|
2610
|
+
var activeStepIndex = _this.steps.items.findIndex(function (x) { return x.active; });
|
|
2611
|
+
var previousStepIndex = activeStepIndex - 1;
|
|
2612
|
+
var previous = _this.steps.items[previousStepIndex];
|
|
2613
|
+
_this.changeStep(previous);
|
|
2614
|
+
};
|
|
2615
|
+
this.saveDone = new InputClass(this.steps.environment, this.steps.l, 'SaveDone', 'fa-duotone fa-check', exports.InputType.Button, 'f-l w-25 h-25 green left-icon');
|
|
2616
|
+
this.saveDone.onClick = function () {
|
|
2617
|
+
_this.nextStep(_this.saveDone, true);
|
|
2618
|
+
};
|
|
2619
|
+
this.editDone = new InputClass(this.steps.environment, this.steps.l, 'EditDone', 'fa-duotone fa-check', exports.InputType.Button, 'f-l w-25 h-25 blue left-icon');
|
|
2620
|
+
this.editDone.onClick = function () {
|
|
2621
|
+
_this.nextStep(_this.editDone, true);
|
|
2622
|
+
};
|
|
2623
|
+
};
|
|
2624
|
+
StepsComponent.prototype.nextStep = function (btn, done) {
|
|
2625
|
+
var _this = this;
|
|
2626
|
+
if (done === void 0) { done = false; }
|
|
2627
|
+
var activeStepIndex = this.steps.items.findIndex(function (x) { return x.active; });
|
|
2628
|
+
var currentStepIndex = this.steps.items.findIndex(function (x) { return x.current; });
|
|
2629
|
+
var activeStep = this.steps.items[activeStepIndex];
|
|
2630
|
+
var currentStep = this.steps.items[currentStepIndex];
|
|
2631
|
+
if (!activeStep.form.check()) {
|
|
2632
|
+
return;
|
|
2633
|
+
}
|
|
2634
|
+
new RequestClass(this.steps.environment, this.steps.l).send(activeStep.form.url, exports.Method.Post, activeStep.form.data(), btn, function () {
|
|
2635
|
+
if (done) {
|
|
2636
|
+
_this.steps.onDone();
|
|
2637
|
+
}
|
|
2638
|
+
else {
|
|
2639
|
+
var nextStepIndex = activeStepIndex + 1;
|
|
2640
|
+
var next = _this.steps.items[nextStepIndex];
|
|
2641
|
+
activeStep.active = false;
|
|
2642
|
+
next.active = true;
|
|
2643
|
+
if (currentStepIndex === activeStepIndex) {
|
|
2644
|
+
currentStep.current = false;
|
|
2645
|
+
next.current = true;
|
|
2646
|
+
}
|
|
2647
|
+
}
|
|
2648
|
+
});
|
|
2649
|
+
};
|
|
2614
2650
|
return StepsComponent;
|
|
2615
2651
|
}());
|
|
2616
2652
|
StepsComponent.decorators = [
|
|
2617
2653
|
{ type: core.Component, args: [{
|
|
2618
2654
|
selector: 'lib-steps',
|
|
2619
|
-
template: "<div class=\"steps\">\r\n <div class=\"header\">\r\n <div *ngFor=\"let s of steps.items; let i = index\" [className]=\"(
|
|
2620
|
-
styles: [".steps{background-color:#fff;border-radius:var(--border-radius-base);padding:20px}.steps,.steps>.header{float:right;width:100%}.steps>.header{-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;
|
|
2655
|
+
template: "<div class=\"steps\">\r\n <div class=\"header\">\r\n <div *ngFor=\"let s of steps.items; let i = index\" [className]=\"(steps.getCurrent() > i || steps.isDone ? 'done ' : steps.getCurrent() === i ? 'process ' : steps.activeAll ? 'next ' : '') + (steps.getActive() === i ? 'active ' : '') + 'step-con'\">\r\n <div [className]=\"(s.description ? 'with-description ' : '') + (steps.updateAccess ? '' : 'disable ') + 'step'\" (click)=\"changeStep(s)\">\r\n <div *ngIf=\"s.icon != null\" [className]=\"s.icon + ' icon fa svg'\"></div>\r\n <div class=\"title\">{{s.title}}</div>\r\n <div *ngIf=\"s.description\" class=\"description o-h-d\">({{s.description}})</div>\r\n <i *ngIf=\"s.onDelete\" (click)=\"onDelete(s)\" class=\"delete fas fa-times\"></i>\r\n <i class=\"dot fa-duotone fa-dot-circle\"></i>\r\n <i class=\"dot dot-done fa-duotone fa-circle-check green\"></i>\r\n <i class=\"dot dot-process fa-duotone fa-circle-ellipsis\"></i>\r\n <div class=\"line-r\"></div>\r\n <div class=\"line-l\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"body\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"footer topline p-t-20 m-t-20\" *ngIf=\"steps.viewAccess\">\r\n <lib-form-button [inp]=\"saveNext\" *ngIf=\"steps.getActive() !== steps.items.length - 1 && steps.getCurrent() === steps.getActive()\"></lib-form-button>\r\n <lib-form-button [inp]=\"editNext\" *ngIf=\"steps.getActive() !== steps.items.length - 1 && steps.getCurrent() !== steps.getActive()\"></lib-form-button>\r\n <lib-form-button [inp]=\"previous\" *ngIf=\"steps.getActive() !== 0 && steps.updateAccess\"></lib-form-button>\r\n <lib-form-button [inp]=\"saveDone\" *ngIf=\"steps.getActive() === steps.items.length - 1 && !steps.isDone\"></lib-form-button>\r\n <lib-form-button [inp]=\"editDone\" *ngIf=\"steps.getActive() === steps.items.length - 1 && steps.isDone\"></lib-form-button>\r\n </div>\r\n</div>\r\n",
|
|
2656
|
+
styles: [".steps{background-color:#fff;border-radius:var(--border-radius-base);padding:20px}.steps,.steps>.header{float:right;width:100%}.steps>.header{-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;display:flex;justify-content:center}.steps>.header>.step-con{display:flex;float:right;padding:5px;position:relative;width:160px}.steps>.header>.step-con .step{align-items:center;border-radius:var(--border-radius-base);cursor:default;display:flex;flex-direction:column;float:right;justify-content:center;padding:10px 5px;pointer-events:none;position:relative;text-align:center;width:100%}.steps>.header>.step-con.done .step:not(.disable),.steps>.header>.step-con.next .step:not(.disable),.steps>.header>.step-con.process .step:not(.disable){cursor:pointer;pointer-events:unset}.steps>.header>.step-con.active .step,.steps>.header>.step-con.done .step:not(.disable):hover,.steps>.header>.step-con.next .step:not(.disable):hover,.steps>.header>.step-con.process .step:not(.disable):hover{background-color:var(--base-white)}.steps>.header>.step-con .step .icon{float:right;font-size:25px;height:40px;line-height:40px;margin-right:calc(50% - 20px);text-align:center;width:40px}.steps>.header>.step-con .step .icon i{line-height:35px}.steps>.header>.step-con .step .title{align-items:center;display:flex;float:right;font-size:10px;height:100%;justify-content:center;line-height:15px;margin-bottom:15px;text-align:center;width:100%}.steps>.header>.step-con .step.with-description .title{float:right;font-size:13px;height:25px;line-height:32px;text-align:center;width:100%}.steps>.header>.step-con .step .description{float:right;font-size:11px;height:25px;line-height:20px;text-align:center;width:100%}.steps>.header>.step-con .step .dot{border-radius:50%;float:right;font-size:20px;height:25px;line-height:25px;width:25px}.steps>.header>.step-con .step .delete{color:var(--red);cursor:pointer;display:none;font-size:25px;height:20px;line-height:20px;position:absolute;right:-10px;text-align:center;top:-10px;width:20px}.steps>.header>.step-con .step .delete:hover{color:var(--red-dark)}.steps>.header>.step-con.process .step .delete{display:block}.steps>.header>.step-con .step .dot.dot-done{color:var(--green);display:none}.steps>.header>.step-con .step .dot.dot-process{color:var(--primary);display:none}.steps>.header>.step-con.done .step .dot,.steps>.header>.step-con.process .step .dot{display:none}.steps>.header>.step-con.done .step .dot.dot-done,.steps>.header>.step-con.process .step .dot.dot-process{display:block}.steps>.header>.step-con .step .line-r{background-image:linear-gradient(90deg,rgba(51,51,51,0),rgba(51,51,51,.3));bottom:21px;height:2px;position:absolute;right:-5px;width:calc(50% + 5px)}.steps>.header>.step-con .step .line-l{background-image:linear-gradient(270deg,rgba(51,51,51,0),rgba(51,51,51,.3));bottom:21px;height:2px;left:-5px;position:absolute;width:calc(50% + 5px)}.steps>.header>.step-con:first-of-type .step .line-r,.steps>.header>.step-con:last-of-type .step .line-l{display:none}.steps>.body{float:right;min-height:calc(100vh - 400px);width:100%}.steps>.footer{float:right;position:relative;width:100%}@media (max-width:399.99px){.steps{margin:20px 2%;margin:0;padding:10px;width:96%;width:100%}.steps .steps{margin-right:0;width:100%}.steps>.header>.step-con .step .icon{font-size:18px;height:30px;margin-right:calc(50% - 15px);width:30px}.steps>.header>.step-con .step .icon i{line-height:25px}.steps>.header>.step-con .step .title{align-items:center;display:flex;font-size:10px;justify-content:center;line-height:13px}}@media (min-width:400px) and (max-width:499.99px){.steps{margin:20px 2%;margin:0;padding:10px;width:96%;width:100%}.steps .steps{margin-right:0;width:100%}.steps>.header>.step-con .step .icon{font-size:18px;height:30px;margin-right:calc(50% - 15px);width:30px}.steps>.header>.step-con .step .icon i{line-height:25px}.steps>.header>.step-con .step .title{align-items:center;display:flex;font-size:10px;justify-content:center;line-height:13px}}@media (min-width:500px) and (max-width:599.99px){.steps{margin:20px 2%;margin:0;width:96%;width:100%}.steps .steps{margin-right:0;width:100%}.steps>.header>.step-con .step .icon{font-size:20px;height:35px;margin-right:calc(50% - 17.5px);width:35px}.steps>.header>.step-con .step .icon i{line-height:30px}.steps>.header>.step-con .step .title{align-items:center;display:flex;font-size:11px;justify-content:center;line-height:13px}}@media (min-width:600px) and (max-width:699.99px){.steps{margin:20px 2%;margin:0;width:96%;width:100%}.steps .steps{margin-right:0;width:100%}.steps>.header>.step-con .step .icon{font-size:20px;height:35px;margin-right:calc(50% - 17.5px);width:35px}.steps>.header>.step-con .step .icon i{line-height:30px}.steps>.header>.step-con .step .title{font-size:11px}}@media (min-width:700px) and (max-width:799.99px){.steps{margin:20px 2%;margin:0;width:96%;width:100%}}@media (min-width:800px) and (max-width:899.99px){.steps{margin:0;width:100%}}@media (min-width:900px) and (max-width:999.99px){.steps{margin:0 5%;width:90%}}@media (min-width:1000px) and (max-width:1099.99px){.steps{margin:0 10%;width:80%}}@media (min-width:1100px) and (max-width:1199.99px){.steps{margin:0 15%;width:70%}}@media (min-width:1200px) and (max-width:1299.99px){.steps{margin:0 15%;width:70%}}"]
|
|
2621
2657
|
},] }
|
|
2622
2658
|
];
|
|
2623
|
-
StepsComponent.ctorParameters = function () { return [
|
|
2624
|
-
{ type: router.Router }
|
|
2625
|
-
]; };
|
|
2659
|
+
StepsComponent.ctorParameters = function () { return []; };
|
|
2626
2660
|
StepsComponent.propDecorators = {
|
|
2627
2661
|
steps: [{ type: core.Input }]
|
|
2628
2662
|
};
|
|
@@ -8422,7 +8456,8 @@
|
|
|
8422
8456
|
}());
|
|
8423
8457
|
|
|
8424
8458
|
var StepsClass = /** @class */ (function () {
|
|
8425
|
-
function StepsClass(l) {
|
|
8459
|
+
function StepsClass(environment, l) {
|
|
8460
|
+
this.environment = null;
|
|
8426
8461
|
this.items = [];
|
|
8427
8462
|
this.activeAll = false;
|
|
8428
8463
|
this.isDone = false;
|
|
@@ -8430,6 +8465,7 @@
|
|
|
8430
8465
|
this.viewAccess = true;
|
|
8431
8466
|
this.onDone = function () { };
|
|
8432
8467
|
this.onLoadStep = function () { };
|
|
8468
|
+
this.environment = environment;
|
|
8433
8469
|
this.l = l;
|
|
8434
8470
|
}
|
|
8435
8471
|
StepsClass.prototype.getCurrent = function () {
|