function setOnClick(selector, change) {
function onClick({ target: t }) {
const el = t.closest('.style-item_count').querySelector('.style-count-number');
el.innerText = el.innerText.replace(/\d+/, m => Math.max(0, +m + change));
}
document.querySelectorAll(selector).forEach(n => n.addEventListener('click', onClick));
}
setOnClick('.style-count-plus', 1);
setOnClick('.style-count-minus', -1);
// или
function setOnClick(selector, change) {
$(selector).on('click', e => {
$(e.target)
.closest('.style-item_count')
.find('.style-count-number')
.text((i, text) => `${Math.max(0, parseInt(text) + change)} шт`);
});
}document.addEventListener('click', ({ target: t }) => {
const change =
t.classList.contains('style-count-plus') ? +1 :
t.classList.contains('style-count-minus') ? -1 :
0;
if (change) {
const el = t.closest('.style-item_count').querySelector('.style-count-number');
el.innerText = `${Math.max(0, parseInt(el.innerText) + change)} шт`;
}
});
// или
$(document).on('click', '.style-count-plus, .style-count-minus', e => {
const $target = $(e.target);
const change = $target.hasClass('style-count-plus') ? 1 : -1;
$target
.closest('.style-item_count')
.find('.style-count-number')
.text((i, text) => text.replace(/\d+/, m => Math.max(0, +m + change)));
});<div class="style-item_count">
<div class="style-count-minus" data-change="-1">-</div>
<div class="style-count-number"><span>1</span> шт</div>
<div class="style-count-plus" data-change="+1">+</div>
</div>document.addEventListener('click', ({ target: t }) => {
const change = +t.dataset.change;
if (change) {
const el = t.closest('.style-item_count').querySelector('.style-count-number span');
el.textContent = Math.max(0, +el.textContent + change);
}
});
// или
$(document).on('click', '[data-change]', function() {
$(this)
.closest('.style-item_count')
.find('.style-count-number span')
.text((i, text) => Math.max(0, +text + +this.dataset.change));
});const banners = [...document.querySelectorAll('.banner')];
for (let i = banners.length; --i > 0;) {
const j = Math.random() * (i + 1) | 0;
[ banners[i], banners[j] ] = [ banners[j], banners[i] ];
}
document.querySelectorAll('.products--container').forEach((n, i) => n.append(banners[i]));arr.map(n => Object
.entries(n)
.reduce((acc, [ k, v ]) => (
acc[k] = v
.flatMap(Object.entries)
.map(([ k, v ]) => ({ [k]: v })),
acc
), {})
)Как можно с помощью axios подставить данные в массив chart?
График строится библиотекой chartkick.js
есть запрос <...> необходимо подставить значения получаемых менеджеров в имена chartData. То есть в chartData:[{name:[сюда]}]
computed: {
chartData() {
const { names, data } = this;
return names && data && data.map((n, i) => ({
name: names[i],
data: n,
}));
},
},<line-chart v-if="chartData" :data="chartData"></line-chart>const isLinks = Array
.from(ul.querySelectorAll(':scope > li'))
.every(n => n.childNodes.length === 1 && n.childNodes[0] instanceof HTMLAnchorElement);const isLinks = Array.prototype.every.call(
ul.children,
({ childNodes: [ a, b ] }) => a.tagName === 'A' && !b,
);dataList.push({ key, title: key });dataList.push({ key, title: node.title });
$.fn.customSelect = function() {
return this.each(function() {
const $this = $(this).hide();
const $wrapper = $this.wrap('<div class="select_wrapper"></div>').parent();
$wrapper.append(`
<span>${$this.find(':selected').text()}</span>
<ul class="select_inner">${$this.children().get().map(n => `
<li data-value="${n.value}">${n.innerText}</li>`).join('')}
</ul>
`);
$wrapper.on('click', 'li', function() {
$wrapper.children('span').text(this.innerText);
$this.val(this.dataset.value).trigger('change');
});
$wrapper.on('click', function() {
$('ul', this).slideToggle('fast');
});
});
};
$('#materialColor, #kantcolor').customSelect().change(function() {
console.log(`#${this.id}: "${this.value}"`);
});$('.datepicker-input').datepicker({
minDate: 0,
onClose(dateText, inst) {
$(this).parent().next('.date').text([
inst.selectedDay,
inst.selectedMonth + 1,
inst.selectedYear
].join('-'));
}
});
$('.date').click(function() {
$(this).prev('div').find('.datepicker-input').focus();
});import './local_copies/xd_connection.js';
import './local_copies/rbadman-html5.min.js';
// ну и т.д.const context = require.context('./local_copies', false, /\.js$/);
context.keys().forEach(key => context(key));const ancestor = 'селектор элементов, которые надо получить';
const descendant = 'селектор вложенных элементов';Array.prototype.filter.call(
document.querySelectorAll(ancestor),
n => n.querySelector(descendant)
)Array.from(
document.querySelectorAll(`${ancestor} ${descendant}`),
n => n.closest(ancestor)
)[...document.querySelectorAll(descendant)].reduce(
(acc, n) => ((n = n.closest(ancestor)) && acc.push(n), acc),
[]
)document.querySelectorAll(`${ancestor}:has(${descendant})`)class App extends React.Component {
state = {
classes: [ 'bullshit' ],
}
onFocus = () => {
this.setState(({ classes }) => ({
classes: [ ...classes, 'focus' ],
}));
}
onBlur = () => {
this.setState(({ classes }) => ({
classes: classes.filter(n => n !== 'focus'),
}));
}
render() {
return (
<div className={this.state.classes.join(' ')}>
<input onFocus={this.onFocus} onBlur={this.onBlur} />
</div>
);
}
}[
[ 'region_id', 'regionName' ],
[ 'district_id', 'districtName' ],
[ 'area_id', 'areaName' ],
[ 'city_id', 'cityName' ],
[ 'place_id', 'cityName' ],
[ 'name', 'streetName' ],
].forEach(([ del, search ]) => {
if (this.tableParam[del]) {
delete this.tableParam[del];
this.searchForm.get(search).patchValue(null);
}
});