![]() System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64 User : www-data ( 33) PHP Version : 7.4.33 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, Directory : /var/www/html/libs/absol-full/dist/js/ |
Upload File : |
/*** module: node_modules/absol-vchart/src/SalaryScaleChart.js ***/ "use strict"; var _VCore = _interopRequireDefault(require("./VCore")); var _salaryimgchart = _interopRequireDefault(require("../template/salaryimgchart.svg")); var _helper = require("./helper"); var _BChart = require("./BChart"); var _SvgCanvas = _interopRequireDefault(require("absol-svg/js/svg/SvgCanvas")); var _ = _VCore.default._; var $ = _VCore.default.$; /** * * @constructor */ function SalaryScaleChart() { this.resizeCtrl = new _BChart.ChartResizeController(this); } SalaryScaleChart.tag = 'SalaryScaleChart'.toLowerCase(); SalaryScaleChart.render = function () { var svg = _(_salaryimgchart.default.replace(/(.|[\r\n])+<svg/, '<svg')).addClass('image-chart').addClass('vc-image-chart').addClass('vc-chart'); svg.$attachhook = _('sattachhook').addTo(svg); return _({ tag: _SvgCanvas.default.tag, elt: svg }); }; // SalaryScaleChart.prototype.updateSize = function () { // // this.attr({ // // width: this.canvasWidth, // // height: this.canvasHeight, // // viewBox: [0, 0, this.canvasWidth, this.canvasHeight].join(' ') // // }) // }; SalaryScaleChart.prototype.updateSize = function () { _SvgCanvas.default.prototype.updateSize.call(this); this.update(); }; SalaryScaleChart.prototype.initComp = function () { this.$colTexts = this.colTexts.map(function () { return (0, _helper.text)('', 100, 100).attr('text-anchor', 'middle').addTo(this); }.bind(this)); this.$bases = this.colTexts.map(function () { return _('rect.image-chart-base').addTo(this); }.bind(this)); this.$bonuses = this.colTexts.map(function () { return _('rect.image-chart-bonus').addTo(this); }.bind(this)); this.$oxLine = _('shape.image-chart-ox').addTo(this); this.$oxDash = _('shape.image-chart-ox[stroke-dasharray="4, 2"]').addTo(this); this.$sizeTexts = this.sizeTexts.map(function () { return (0, _helper.text)('', 100, 100).addTo(this); }.bind(this)); this.$ranges = this.sizeTexts.map(function () { return _('shape.image-chart-range[marker-end="url(#Arrow2Mend)"][marker-start="url(#Arrow2Mstart)"]', 100, 100).addTo(this); }.bind(this)); this.$hLine = Array(5).fill(0).map(function () { return _('shape.image-chart-range-limit[stroke-dasharray="2, 1"]').addTo(this); }.bind(this)); }; SalaryScaleChart.prototype.updateText = function () { var self = this; this.$colTexts.forEach(function (elt, i) { var text = self.colTexts[i]; elt.innerHTML = text; elt.attr('y', self.oy); }); this.oy -= _helper.getMaxHeightBox.apply(null, this.$colTexts); this.oy -= this.textMargin; this.$sizeTexts.forEach(function (elt, i) { var text = self.sizeTexts[i]; elt.innerHTML = text; }); this.oxLength -= (0, _helper.getMaxWidthBox)(this.$sizeTexts[0], this.$sizeTexts[1]); this.oxLength -= this.textMargin; }; SalaryScaleChart.prototype.updateAxis = function () { var self = this; var leftCol = this.ox + this.axisPadding; var rightCol = this.ox + this.oxLength - this.axisPadding - this.rangeMargin - this.colWidth; this.colXs = [leftCol, leftCol / 3 + rightCol * 2 / 3, rightCol]; this.$oxLine.begin().moveTo(this.ox, this.oy).lineTo(this.ox + this.oxLength / 4, this.oy).moveTo(this.ox + this.oxLength / 2, this.oy).lineTo(this.ox + this.oxLength, this.oy).end(); this.$oxDash.begin().moveTo(this.ox + this.oxLength / 4, this.oy).lineTo(this.ox + this.oxLength / 2, this.oy).end(); this.$colTexts.forEach(function (elt, i) { elt.attr('x', self.colXs[i] + self.colWidth / 2); }); this.maxColHeight = this.oy - this.paddingContent; }; SalaryScaleChart.prototype.updateCols = function () { var self = this; this.heightCols = [this.maxColHeight / (1 + this.distance / 100), this.maxColHeight / (1 + this.minDistance / 100), this.maxColHeight]; if (this.bonus < 0) { this.heightCols = this.heightCols.map(function (x) { return x * (100 + self.bonus) / 100; }); } if (this.bonus < 0) { this.addClass('as-bonus-under-100-percent'); } else { this.removeClass('as-bonus-under-100-percent'); } this.baseHeight = this.heightCols.map(function (h) { return h / (100 + self.bonus) * 100; }); this.bonusHeight = this.heightCols.map(function (h) { return h / (100 + self.bonus) * self.bonus; }); this.$bases.forEach(function (e, i) { var height = self.baseHeight[i]; e.attr({ x: self.colXs[i], y: self.oy - height, width: self.colWidth, height: height }); }); if (this.bonus >= 0) { this.$bonuses.forEach(function (e, i) { var height = self.bonusHeight[i]; e.attr({ x: self.colXs[i], y: self.oy - self.heightCols[i], width: self.colWidth, height: height }); }); } else { this.$bonuses.forEach(function (e, i) { var height = self.bonusHeight[i]; e.attr({ x: self.colXs[i], y: self.oy - self.heightCols[i] + height, width: self.colWidth, height: -height }); }); } }; SalaryScaleChart.prototype.updateRange = function () { var self = this; var rangeX = this.colXs.map(function (x) { return x + self.colWidth + self.rangeMargin; }); this.$ranges[0].begin().moveTo(rangeX[2], this.oy - this.baseHeight[2] + this.arrowPadding).lineTo(rangeX[2], this.oy - this.baseHeight[0] - this.arrowPadding).end(); this.$ranges[1].begin().moveTo(rangeX[2], this.oy - this.baseHeight[0] + this.arrowPadding).lineTo(rangeX[2], this.oy - this.arrowPadding).end(); this.$ranges[2].begin().moveTo(rangeX[1], this.oy - this.baseHeight[2] + this.arrowPadding).lineTo(rangeX[1], this.oy - this.baseHeight[1] - this.arrowPadding).end(); this.$ranges[3].begin().moveTo(rangeX[1], this.oy - this.baseHeight[1] + this.arrowPadding).lineTo(rangeX[1], this.oy - this.arrowPadding).end(); this.$ranges[4].begin().moveTo(rangeX[0], this.oy - this.heightCols[0] + this.arrowPadding).lineTo(rangeX[0], this.oy - this.arrowPadding).end(); this.$hLine[0].begin().moveTo(this.colXs[2] + this.colWidth, this.oy - this.baseHeight[2]).lineTo(rangeX[2], this.oy - this.baseHeight[2]).end(); this.$hLine[1].begin().moveTo(this.colXs[2], this.oy - this.baseHeight[2]).lineTo(rangeX[1], this.oy - this.baseHeight[2]).end(); this.$hLine[2].begin().moveTo(this.colXs[1] + this.colWidth, this.oy - this.baseHeight[1]).lineTo(rangeX[1], this.oy - this.baseHeight[1]).end(); this.$hLine[3].begin().moveTo(this.colXs[0] + this.colWidth, this.oy - this.heightCols[0]).lineTo(rangeX[0], this.oy - this.heightCols[0]).end(); this.$hLine[4].begin().moveTo(this.colXs[0] + this.colWidth, this.oy - this.baseHeight[0]).lineTo(rangeX[2], this.oy - this.baseHeight[0]).end(); //a this.$sizeTexts[0].attr({ x: rangeX[2] + this.textMargin, y: this.oy - (this.baseHeight[2] + this.baseHeight[0]) / 2 + 4 }); //b this.$sizeTexts[1].attr({ x: rangeX[2] + this.textMargin, y: this.oy - this.baseHeight[0] / 2 + 4 }); //c this.$sizeTexts[2].attr({ x: rangeX[1] + this.textMargin, y: this.oy - (this.baseHeight[2] + this.baseHeight[1]) / 2 + 4 }); //d this.$sizeTexts[3].attr({ x: rangeX[1] + this.textMargin, y: this.oy - this.baseHeight[1] / 2 + 4 }); //e this.$sizeTexts[4].attr({ x: rangeX[0] + this.textMargin, y: this.oy - this.heightCols[0] / 2 + 4 }); }; SalaryScaleChart.prototype.update = function () { this.oy = this.canvasHeight - this.paddingContent; this.oxLength = this.canvasWidth - 2 * this.paddingContent; this.ox = this.paddingContent; this.updateText(); this.updateAxis(); this.updateCols(); this.updateRange(); }; SalaryScaleChart.prototype.preInit = function () { this.canvasWidth = 560; this.canvasHeight = 320; this.paddingContent = 10; this.colTexts = ['Bậc 1', 'Bậc n -1', 'Bậc n']; this.sizeTexts = ['a', 'b', 'c', 'd', 'e']; this.bonus = 20; this.distance = 80; this.minDistance = 10; // this.sizeTexts = ['Lương tối đa', 'b', 'c', 'd', 'e']; this.colWidth = 40; this.textMargin = 5; this.axisPadding = 30; this.rangeMargin = 20; this.arrowPadding = 2.5; }; SalaryScaleChart.prototype.init = function (props) { this.preInit(); this.super(props); this.initComp(); this.$attachhook.once('attached', this.update.bind(this)); }; SalaryScaleChart.property = {}; SalaryScaleChart.property.canvasHeight = { set: function (value) { this.addStyle('height', value + 'px'); this.box.height = value; }, get: function () { return this.box.height; } }; SalaryScaleChart.property.canvasWidth = { set: function (value) { this.addStyle('width', value + 'px'); this.box.width = value; }, get: function () { return this.box.width; } }; _VCore.default.install('SalaryScaleChart'.toLowerCase(), SalaryScaleChart);