@topvisor/ui
Version:
Topvisor UI-kit Vue
992 lines (989 loc) • 36.5 kB
JavaScript
import { Core as _autoloadCSSCore } from '../core/app.js';
const fileNames = ['../assets/project.css'].map(fileName => import.meta.resolve(fileName));
_autoloadCSSCore.insertCSSLinkToPage(fileNames, true);
import { defineComponent as U, mergeModels as N, useModel as D, computed as E, createElementBlock as b, openBlock as k, createBlock as _, unref as y, withCtx as B, Fragment as Y, renderList as se, normalizeClass as X, createElementVNode as he, toDisplayString as K, createVNode as A, createTextVNode as G, toValue as de, ref as F, watch as w, createCommentVNode as q, isRef as ce, withModifiers as J, mergeProps as Se, withKeys as ge, nextTick as Be, resolveDirective as _e, withDirectives as be, resolveDynamicComponent as Ve, renderSlot as Ee, shallowRef as Me, createSlots as Ke, reactive as $e } from "vue";
import { u as R, C as j, c as H, o as re, d as we } from "../.chunks/forms-EIQ_3SBd.es.js";
import { _ as Ie, b as ue, a as Le } from "../.chunks/listItem.vue_vue_type_script_setup_true_lang-CmBz0A7l.es.js";
import { _ as Ae } from "../.chunks/menu.vue_vue_type_style_index_0_lang-Crg7yUFK.es.js";
import { u as Re } from "../.chunks/utils-CLxr2Yzo.es.js";
import { getSearcherGIcon as Oe, getLangLabel as Ne, getDeviceGIcon as De } from "../utils/searchers.js";
import { storage as W } from "../utils/dom.js";
import { TopPopupWorker as Fe } from "../popup/worker.js";
const qe = { class: "top-selectorCompetitors" }, Ue = { class: "top-ellipsis1" }, mt = /* @__PURE__ */ U({
__name: "selectorCompetitors",
props: /* @__PURE__ */ N({
modelValue: {},
items: {},
showSelectAllItem: { type: Boolean, default: !0 }
}, {
modelValue: {},
modelModifiers: {}
}),
emits: ["update:modelValue"],
setup(t) {
const l = t, n = D(t, "modelValue"), e = E(() => {
if (l.showSelectAllItem)
return {
icon: "",
title: R().Common.Select_all,
value: "all",
content: ""
};
});
return (i, a) => (k(), b("div", qe, [
y(j).state.isMobile ? (k(), _(Ie, { key: 0 }, {
opener: B(() => [
A(H, {
class: "top-selectorCompetitors_opener",
color: "theme",
icon: "",
icon2: ""
}, {
default: B(() => {
var o;
return [
G(K((o = i.items.find((u) => {
var f;
return u.value === ((f = n.value) == null ? void 0 : f[0]);
})) == null ? void 0 : o.content), 1)
];
}),
_: 1
})
]),
contentList: B(() => [
(k(!0), b(Y, null, se(i.items, (o) => {
var u;
return k(), _(ue, {
class: X({
"top-active": (u = n.value) == null ? void 0 : u.includes(o.value)
}),
"data-top-icon": o.icon,
title: o.title,
onClick: () => n.value = [o.value]
}, {
default: B(() => [
he("span", Ue, K(o.content), 1)
]),
_: 2
}, 1032, ["class", "data-top-icon", "title", "onClick"]);
}), 256))
]),
_: 1
})) : (k(), _(Ae, {
key: 1,
modelValue: n.value,
"onUpdate:modelValue": a[0] || (a[0] = (o) => n.value = o),
items: i.items,
isMultiple: !0,
styling: "bar",
canBeEmptyMultiple: !1,
selectAllItem: e.value
}, null, 8, ["modelValue", "items", "selectAllItem"]))
]));
}
}), ft = (t, l) => E(() => de(t).filter((i) => i.on >= 0 || i.id === l).map((i) => ({
value: i.id,
title: i.url + ` [${i.id}]`,
icon: i.id === de(l) ? "" : "",
content: i.name
}))), M = -1, p = -2, te = -1, Pe = {
0: "Yandex",
1: "Google",
4: "YouTube",
5: "Bing",
7: "Seznam",
8: "AppStore",
9: "GoogleStore",
20: "Yandex.com",
21: "Yandex.com.tr"
}, me = {
key: p,
name: "--",
index: p
}, xe = {
key: p,
name: "--",
regions: [me],
regionByIndex: /* @__PURE__ */ new Map([[p, me]])
}, le = {
key: p,
name: "Autoselect",
index: p
}, ne = {
key: p,
name: "Autoselect",
regions: [le],
regionByIndex: /* @__PURE__ */ new Map([[p, le]])
}, fe = {
countryCode: "00",
depth: 1,
device: 0,
key: te,
index: te,
lang: "ru",
name: "Without region"
}, ze = () => (le.name = R().Common.Autoselect, le), Je = () => (ze(), ne.name = R().Common.Autoselect, console.log(ne), ne), je = () => (fe.name = R().Keywords.Without_region, fe), ke = (t = !1, l = !1, n = []) => {
let e;
return t ? e = Ge(n) : e = Te(n), l && e.set(p, Je()), e.size || e.set(p, xe), e;
}, Te = (t, l = !0, n = [], e = !1) => {
const i = /* @__PURE__ */ new Map();
return t.forEach((a) => {
if (!a.enabled || e && typeof a.key == "number" && a.key > 1) return;
const o = { ...a };
o.regionByIndex = /* @__PURE__ */ new Map(), a.regions && a.regions.forEach((u) => {
if (l && !u.enabled) return;
const f = { ...u };
o.regionByIndex.set(f.index, f);
}), !o.regionByIndex.size && n.length, // режим вывода ПС без регионов
(!a.regions || // есть включенные регионы
o.regionByIndex.size || // запрошен вывод конкретных ПС
n.length) && typeof o.key == "number" && i.set(o.key, o);
}), n.forEach((a) => {
if (i.has(a)) return;
const o = {
key: a,
name: Pe[a],
regions: [],
regionByIndex: /* @__PURE__ */ new Map()
};
i.set(o.key, o);
}), i;
}, Ge = (t) => {
const l = Te(t, !1, [0, 1], !0);
if (l.has(2)) {
const n = l.get(2);
n && (n.regionByIndex = /* @__PURE__ */ new Map());
}
return l.forEach((n) => {
if (!n.regionByIndex) return;
const e = { ...je() };
n.regionByIndex.set(e.index, e);
}), l;
}, We = (t, l, n = []) => {
const e = ke(t, !1, n);
let i;
return e.forEach((a) => {
if (!(l.searcher_key !== void 0 && l.searcher_key != a.key) && a.regions && (a.regions.forEach((o) => {
if (!i && !(l.key !== void 0 && l.key != o.key) && !(l.index !== void 0 && l.index != o.index) && !(!t && (l.lang !== void 0 && l.lang != o.lang || l.device !== void 0 && l.device != o.device)))
return o.searcher_key = a.key, i = o, !1;
}), i))
return !1;
}), i;
}, Ye = Re(() => import("../.chunks/dialog_selectorRegions-BYuC3Yqz.es.js")), He = (t, l) => {
const n = R(), e = F(l.value.keys().next().value ?? p), i = E(() => {
const a = /* @__PURE__ */ new Map();
if (l.value.forEach((o) => {
let u = {
value: o.key,
title: o.name
};
t.addSearcherIcon && (u.icon = Oe(o.key)), a.set(o.key, u);
}), t.addCompare && !a.has(p)) {
const o = {
value: "",
title: "--------------------",
disabled: !0
};
a.set(o.value, o);
const u = {
value: M,
title: n.Common.Compare
};
a.set(u.value, u);
}
return a;
});
return {
searcherKey: e,
optionBySearcherKey: i
};
}, Qe = (t, l) => {
var a, o, u;
const n = R(), e = F(p);
t.modelValue.length === 1 && (e.value = t.modelValue[0]), e.value === p && (t.forFrequency ? e.value = ((o = (a = l.value) == null ? void 0 : a.regionByIndex.values().next().value) == null ? void 0 : o.key) ?? p : e.value = ((u = l.value) == null ? void 0 : u.regionByIndex.keys().next().value) ?? p);
const i = E(() => {
var h;
const f = /* @__PURE__ */ new Map();
return (h = l.value.regionByIndex) == null || h.forEach((S) => {
let r = S.name;
if (t.forFrequency) {
const x = {
value: S.key,
title: r
};
f.has(S.key) || f.set(S.key, x);
return;
}
S.device && (r += " (" + n.Common["Device_" + S.device] + ")");
const g = Ne(l.value.key || 0, S.lang ?? "");
g && (r += " / " + g);
const d = {
value: S.index,
title: r,
icon: S.device ? De(S.device) : void 0
};
f.set(S.index, d);
}), f;
});
return w(i, (f, h) => {
var d;
if (t.onlySearcher || e.value !== void 0 && f.get(e.value))
return;
let S = f.keys().next().value;
if (e.value === p || S === p) {
e.value = S;
return;
}
let r = ((d = h == null ? void 0 : h.get(e.value)) == null ? void 0 : d.title) || "", g = -1;
for (const [x, C] of f.entries()) {
const T = C.title;
if (typeof T != "string" || typeof x == "string")
break;
if (T === r) {
S = x;
break;
}
const V = new RegExp(` \\((${n.Common.Device_1}|${n.Common.Device_2})\\)`);
let m = r, s = 3;
T.indexOf(m) === -1 && (m = r.replace(/^[^a-zа-я]/i, "").replace(V, ""), s--), T.indexOf(m) === -1 && (m = r.replace(/ \/.*/, ""), s--), T.indexOf(m) === -1 && (m = r.replace(/ \/.*/, ""), m = m.replace(/^[^a-zа-я]/i, "").replace(V, ""), s--), T.indexOf(m) !== -1 && (s <= g || (g = s, S = x));
}
e.value = S;
}), {
regionIndex: e,
optionByRegionIndex: i
};
}, Xe = (t, l, n) => {
const e = F([]), i = () => {
if (t.onlySearcher && l.value) {
e.value = Array.from(l.value.keys());
return;
}
let o = [];
if (t.modelValue.length > 1)
o = [...t.modelValue];
else
try {
o = JSON.parse(
localStorage.getItem("ui:project:regionSelector" + t.projectId + ":regionsIndexes")
) ?? [];
} catch {
}
o.length && (o = o.filter((u) => n.value.has(u))), o.length || (o = Array.from(n.value)), e.value = [...o];
}, a = () => {
e.value.length ? localStorage.setItem("ui:project:regionSelector:" + t.projectId + ":regionsIndexes", JSON.stringify(e.value)) : localStorage.removeItem("ui:project:regionSelector:" + t.projectId + ":regionsIndexes");
};
return w(e, () => {
a();
}), t.addCompare && i(), {
regionsIndexes: e
};
}, Ze = (t) => {
const l = E(() => ke(t.forFrequency, t.autoRegion, t.searchers)), n = E(() => l.value.get(i.searcherKey.value) || xe), e = E(() => {
const r = /* @__PURE__ */ new Set();
return l.value.forEach((g) => {
g.regionByIndex.forEach((d) => {
d.index !== te && d.index !== p && r.add(d.index);
});
}), r;
}), i = He(t, l), a = Qe(t, n), o = Xe(t, l, e);
w(l, () => {
var g, d, x, C;
if (t.onlySearcher ? o.regionsIndexes.value = Array.from(l.value.keys()) : o.regionsIndexes.value = o.regionsIndexes.value.filter((T) => e.value.has(T)), i.searcherKey.value === M) return;
let r = l.value.keys().next().value;
l.value.forEach((T) => {
var V, m, s;
if (t.onlySearcher && T.key === i.searcherKey.value) {
r = i.searcherKey.value;
return;
}
if (a.regionIndex.value && ((V = T.regionByIndex) != null && V.has(a.regionIndex.value)) && (r = T.key), !t.onlySearcher) {
let c;
r !== void 0 && (c = (m = l.value.get(r)) == null ? void 0 : m.regionByIndex);
const v = (s = l.value.get(T.key)) == null ? void 0 : s.regionByIndex;
c != null && c.has(p) && !(v != null && v.has(p)) && (r = T.key);
}
}), r !== void 0 && (i.searcherKey.value = r), a.regionIndex.value !== void 0 && !((d = (g = n.value) == null ? void 0 : g.regionByIndex) != null && d.has(a.regionIndex.value)) && (a.regionIndex.value = (C = (x = n.value) == null ? void 0 : x.regions) == null ? void 0 : C.keys().next().value);
}, { immediate: !0 });
const u = () => {
if (!(i.searcherKey.value === M || i.searcherKey.value === p))
return i.searcherKey.value;
}, f = () => {
if (t.onlySearcher || a.regionIndex.value === p) return;
let r = a.regionIndex.value;
if (t.forFrequency) {
const g = a.regionIndex.value, d = We(t.forFrequency, { searcher_key: u(), key: g }, t.searchers);
r = d == null ? void 0 : d.index;
}
return r;
}, h = () => {
const r = u();
if (r !== void 0)
return l.value.get(r);
};
return {
selectSearcher: i,
selectRegion: a,
compare: o,
searcherByKey: l,
allRegionsIndexes: e,
getSearcher: h,
getRegion: () => {
var g, d;
const r = f();
if (r !== void 0)
return (d = (g = h()) == null ? void 0 : g.regionByIndex) == null ? void 0 : d.get(r);
}
};
}, vt = /* @__PURE__ */ U({
__name: "selectorRegion",
props: /* @__PURE__ */ N({
projectId: {},
searchers: { default: () => [] },
modelValue: {},
modelValueSingle: {},
addCompare: { type: Boolean },
forFrequency: { type: Boolean },
autoRegion: { type: Boolean },
onlySearcher: { type: Boolean },
addChanger: { type: Boolean, default: !0 },
addSearcherIcon: { type: Boolean, default: !0 },
addRegionIcon: { type: Boolean, default: !0 }
}, {
modelValue: { required: !0 },
modelModifiers: {},
modelValueSingle: {},
modelValueSingleModifiers: {}
}),
emits: ["update:modelValue", "update:modelValueSingle"],
setup(t, { expose: l }) {
const n = t, e = D(t, "modelValue"), i = D(t, "modelValueSingle"), {
selectSearcher: a,
selectRegion: o,
compare: u,
searcherByKey: f,
allRegionsIndexes: h,
getSearcher: S,
getRegion: r
} = Ze(n), g = () => {
const d = [];
f.value.forEach((x) => {
x.enabled && x.regions.forEach((C) => {
C.enabled && d.push(C);
});
}), Ye.open("selectorRegions", {
regions: d,
regionsIndexes: u.regionsIndexes.value,
"@update:regionsIndexes": (x) => u.regionsIndexes.value = x
});
};
return w([o.regionIndex, a.searcherKey, u.regionsIndexes], () => {
if (a.searcherKey.value === M && u.regionsIndexes.value.length) {
if (JSON.stringify(e.value) === JSON.stringify(u.regionsIndexes.value))
return;
e.value = [...u.regionsIndexes.value];
} else
n.onlySearcher ? (e.value = [a.searcherKey.value], a.searcherKey.value === p && !n.autoRegion && (e.value.length = 0)) : (e.value = [o.regionIndex.value], o.regionIndex.value === p && !n.autoRegion && (e.value.length = 0));
!n.onlySearcher && !h.value.size && (a.searcherKey.value = p);
}), i.value && w(i, () => {
i.value && (e.value = [i.value]);
}, { immediate: !0 }), w(e, () => {
var d, x, C, T, V;
if (e.value[0] && (i.value = e.value[0]), n.onlySearcher) {
if (!e.value.length || e.value.length === 1 && !f.value.has(e.value[0]) || e.value.length === 1 && e.value[0] === p && !n.autoRegion) {
let m = f.value.keys().next().value;
m === p && !n.autoRegion && (m = void 0, i.value = p), m !== void 0 ? e.value = [m] : e.value.length = 0;
return;
}
if (e.value.length > 1 && JSON.stringify(e.value) !== JSON.stringify(u.regionsIndexes.value)) {
e.value = [...u.regionsIndexes.value];
return;
}
} else {
let m = [...new Set(e.value)], s = (x = (d = f.value.values().next().value) == null ? void 0 : d.regionByIndex) == null ? void 0 : x.keys().next().value;
if (n.forFrequency && (s = (V = (T = (C = f.value.values().next().value) == null ? void 0 : C.regionByIndex) == null ? void 0 : T.values().next().value) == null ? void 0 : V.key), s === p && !n.autoRegion && (s = void 0, i.value = p), !m.length)
s !== void 0 && m.push(s);
else if (m.length === 1) {
let c = h.value;
n.forFrequency && (c = /* @__PURE__ */ new Set(), f.value.forEach((v) => {
v.regionByIndex.forEach((I) => {
I.index !== te && I.index !== p && c.add(I.key);
});
})), c.has(m[0]) || (m = [], s !== void 0 && m.push(s));
} else
m = m.filter((c) => h.value.has(c)), !m.length && s !== void 0 && m.push(s);
if (JSON.stringify(e.value) !== JSON.stringify(m)) {
e.value = m;
return;
}
}
if (!(e.value.length === 1 && e.value[0] === (n.onlySearcher ? a.searcherKey.value : o.regionIndex.value)))
if (n.onlySearcher) {
if (e.value.length === 1) {
a.searcherKey.value = e.value[0];
return;
}
a.searcherKey.value = M;
return;
} else {
if (!e.value.length)
return;
if (e.value.length === 1 && a.searcherKey.value !== M) {
o.regionIndex.value = e.value[0];
let m;
for (const s of f.value.values()) {
for (const c of s.regionByIndex.values())
if ((n.forFrequency ? c.key : c.index) === o.regionIndex.value) {
m = s.key;
break;
}
if (m !== void 0)
break;
}
m !== void 0 && (a.searcherKey.value = m);
} else
a.searcherKey.value = M, u.regionsIndexes.value = [...e.value];
}
}, { immediate: !0 }), l({
getSearcher: S,
getRegion: r
}), (d, x) => (k(), b("div", {
class: X({
"top-selectorRegion": !0,
"top-selectorRegion-onlySearcher": d.onlySearcher
})
}, [
A(re, {
options: y(a).optionBySearcherKey.value,
modelValue: y(a).searcherKey.value,
"onUpdate:modelValue": x[0] || (x[0] = (C) => y(a).searcherKey.value = C),
name: "searcher_key",
addChanger: d.addChanger
}, null, 8, ["options", "modelValue", "addChanger"]),
!d.onlySearcher && y(a).searcherKey.value !== y(M) ? (k(), _(re, {
key: 0,
class: "top-select-region",
options: y(o).optionByRegionIndex.value,
modelValue: y(o).regionIndex.value,
"onUpdate:modelValue": x[1] || (x[1] = (C) => y(o).regionIndex.value = C),
name: d.forFrequency ? "region_key" : "region_index",
addChanger: d.addChanger,
"data-top-icon": d.addRegionIcon ? "" : void 0
}, null, 8, ["options", "modelValue", "name", "addChanger", "data-top-icon"])) : q("", !0),
d.addCompare && !d.onlySearcher && y(a).searcherKey.value === y(M) ? (k(), _(H, {
key: 1,
name: "compare",
onClick: g,
"data-count-compare-regions-indexes": y(u).regionsIndexes.value.length
}, {
default: B(() => [
G(K(d.$i18n.Common.Selected_regions), 1)
]),
_: 1
}, 8, ["data-count-compare-regions-indexes"])) : q("", !0)
], 2));
}
}), ve = (t) => "-" + t, Q = (t) => t[0] === "-" ? t.substring(1) : t, ae = (t, l) => {
t = Q(t);
const n = l.find((e) => e.id === t);
if (n)
return n;
}, yt = (t, l, n) => {
l || (l = { id: t.id }), l.id = t.id, l.pos ??= "3", l.notch ??= !0, l.posBy ??= "fixed";
const e = Fe.genElPopupOpener("div", l);
return e.classList.add("top-tagSelector"), t.useTopButton && e.classList.add("top-tagSelector-useTopButton", "top-button", "top-color_theme", "top-as-selector"), t.useTopButton || e.classList.add("top-tagSelector-custom"), t.mode === "filter" && e.classList.add("top-tagSelector-filter"), t.mode === "setter" && !t.filters && e.classList.add("top-tagSelector-setter_single"), t.mode === "setter" && t.filters && e.classList.add("top-tagSelector-setter_several"), e.onclick = (i) => {
i.preventDefault(), i.stopPropagation(), e.onclick = null;
const a = F(t.modelValue), o = {
model: a,
mode: t.mode,
targetId: t.targetId,
filters: t.filters,
payload: t.payload
};
W(e, "topTagSelectorTarget", o), delete e.dataset.topPopupDisabled, ce(t.modelValue) || w(a, () => {
t.modelValue = a.value, ee(e, t, n);
}), e.click();
}, ce(t.modelValue) ? w(t.modelValue, () => ee(e, t, n)) : W(e, "topTagSelectorRender", (i) => {
t.modelValue = i;
const a = W(e, "topTagSelectorTarget");
a && (a.model.value = i), ee(e, t, n);
}), ee(e, t, n), e;
}, pt = (t, l) => {
var n;
(n = W(t, "topTagSelectorRender")) == null || n(l);
}, ee = (t, l, n) => {
var i;
const e = y(l.modelValue);
if (t.classList.toggle("top-tagSelector-selectedOne", !e.length || e.length === 1), t.classList.toggle("top-tagSelector-toTwoLine", e.length > 5), l.mode === "setter" && l.filters) {
t.innerHTML = `<div>${n}</div>`;
return;
}
if (t.innerHTML = "", !e.length && l.mode === "filter") {
const a = ye({
id: "all",
colorId: "",
name: ((i = R().Common) == null ? void 0 : i.All_tags) ?? "",
state: ""
});
t.append(a);
}
e.forEach((a) => {
var u, f;
const o = ye({
id: Q(a),
colorId: ((u = ae(a, l.tags)) == null ? void 0 : u.color_id) ?? "",
name: ((f = ae(a, l.tags)) == null ? void 0 : f.name) ?? "",
state: Q(a) === a ? "selected" : "excluded"
});
t.append(o);
});
}, ye = (t) => {
const l = document.createElement("div");
return l.classList.add("top-tagSelector_tagIcon"), l.classList.toggle("top-tagSelector-active", !!t.state), l.classList.toggle("top-tagSelector-excluded", t.state === "excluded"), l.dataset.tag_id = t.id, l.dataset.tag_color_id = t.colorId, l.title = t.name, l;
}, et = [
{
id: "1",
name: "Without Tag",
color_id: "1"
},
{
id: "2",
name: "Red",
color_id: "2"
},
{
id: "3",
name: "Orange",
color_id: "3"
},
{
id: "4",
name: "Yellow",
color_id: "4"
},
{
id: "5",
name: "Blue",
color_id: "5"
},
{
id: "6",
name: "Purple",
color_id: "6"
},
{
id: "7",
name: "Green",
color_id: "7"
},
{
id: "8",
name: "Magenta",
color_id: "8"
},
{
id: "9",
name: "Dark blue",
color_id: "9"
},
{
id: "10",
name: "Turquoise",
color_id: "10"
}
], tt = ["data-tag_id", "data-tag_color_id", "title"], ie = /* @__PURE__ */ U({
__name: "tagIcon",
props: {
id: {},
colorId: {},
name: {},
state: {}
},
setup(t) {
return (l, n) => (k(), b("div", {
class: X({
"top-tagSelector_tagIcon": !0,
"top-tagSelector-active": !!l.state,
"top-tagSelector-excluded": l.state === "excluded"
}),
"data-tag_id": l.id,
"data-tag_color_id": l.colorId,
title: l.name
}, null, 10, tt));
}
}), lt = ["contenteditable", "onKeydown"], pe = /* @__PURE__ */ U({
__name: "tagPopupListItem",
props: /* @__PURE__ */ N({
editable: { type: Boolean },
disabled: { type: Boolean },
canExclude: { type: Boolean },
id: {},
colorId: {},
name: {},
state: {}
}, {
name: {
required: !0
},
nameModifiers: {}
}),
emits: /* @__PURE__ */ N(["update:name", "unselect", "exclude", "select"], ["update:name"]),
setup(t, { emit: l }) {
const n = t, e = l, i = D(t, "name"), a = F(null), o = E(() => navigator.userAgent.indexOf("Firefox") != -1 ? {
contenteditable: u.value,
onpaste: (g) => g.preventDefault()
} : {}), u = F(!1), f = async () => {
var g;
u.value = !0, await Be(), (g = a.value) == null || g.focus();
}, h = () => {
var d;
const g = (d = a.value) == null ? void 0 : d.innerText;
if (!g) return S();
a.value && (a.value.innerText = g), u.value = !1, e("update:name", g);
}, S = async () => {
a.value && (a.value.innerText = n.name), u.value = !1;
}, r = (g) => {
if (u.value || n.disabled) return;
let d = "selected";
n.canExclude && (g.ctrlKey || g.metaKey) && (d = "excluded"), n.state == d && (d = ""), d === "" && e("unselect"), d === "selected" && e("select"), d === "excluded" && e("exclude");
};
return (g, d) => (k(), _(ue, {
class: X({
"top-tagSelector_tagListItem": !0,
"top-tagSelector_tagListItem-inEdit": u.value,
"top-tagSelector_tagListItem-disabled": g.disabled,
"top-tagSelector_tagListItem-canExclude": g.canExclude,
"top-tagSelector-active": !!g.state,
"top-tagSelector-excluded": g.state === "excluded"
}),
onClick: J(r, ["stop"])
}, {
default: B(() => [
A(ie, {
id: g.id,
name: i.value,
colorId: g.colorId,
state: g.state
}, null, 8, ["id", "name", "colorId", "state"]),
he("span", Se({
ref_key: "elName",
ref: a,
class: "top-tagSelector_tagListItemName",
contenteditable: u.value ? "plaintext-only" : !1
}, o.value, {
onKeydown: [
ge(J(h, ["stop"]), ["enter"]),
ge(J(S, ["stop"]), ["esc"])
]
}), K(i.value), 17, lt),
g.editable ? (k(), b(Y, { key: 0 }, [
u.value ? (k(), b("span", {
key: 1,
"data-top-icon": "",
class: "top-tagSelector_edit",
onClick: J(h, ["stop"])
})) : (k(), b("span", {
key: 0,
"data-top-icon": "",
class: "top-tagSelector_edit",
onClick: f
}))
], 64)) : q("", !0)
]),
_: 1
}, 8, ["class"]));
}
}), at = { key: 1 }, ot = /* @__PURE__ */ U({
inheritAttrs: !1,
__name: "popupOpener",
props: /* @__PURE__ */ N({
modelValue: {},
id: {},
tags: {},
mode: {},
targetId: {},
filters: {},
useTopButton: { type: Boolean },
payload: {},
styling: {}
}, {
modelValue: {
required: !0
},
modelModifiers: {}
}),
emits: ["update:modelValue"],
setup(t) {
const l = t, n = D(t, "modelValue"), e = l.useTopButton ? H : "div", i = l.useTopButton ? "html" : "default", a = {
model: n,
mode: l.mode,
targetId: l.targetId,
filters: l.filters,
payload: l.payload
};
return (o, u) => {
const f = _e("top-data");
return k(), _(Le, { id: o.id }, {
default: B(() => [
be((k(), _(Ve(y(e)), Se({
class: {
"top-tagSelector": !0,
"top-tagSelector-useTopButton": l.useTopButton,
"top-tagSelector-custom": !l.useTopButton,
"top-as-selector": l.useTopButton,
"top-tagSelector-filter": l.mode === "filter",
"top-tagSelector-setter_single": l.mode === "setter" && !o.filters,
"top-tagSelector-setter_several": l.mode === "setter" && o.filters,
"top-tagSelector-selectedOne": !n.value.length || n.value.length === 1,
"top-tagSelector-toTwoLine": n.value.length > 5
},
color: "theme",
styling: o.styling
}, o.$attrs), {
[y(i)]: B(() => [
!n.value.length && o.mode === "filter" ? (k(), _(ie, {
key: 0,
id: "all",
colorId: "",
name: o.$i18n.Common.All_tags ?? "",
state: ""
}, null, 8, ["name"])) : q("", !0),
o.mode === "setter" && o.filters ? (k(), b("div", at, [
Ee(o.$slots, "default")
])) : (k(!0), b(Y, { key: 2 }, se(n.value, (h) => {
var S, r;
return k(), _(ie, {
id: y(Q)(h),
colorId: ((S = y(ae)(h, o.tags)) == null ? void 0 : S.color_id) ?? "",
name: ((r = y(ae)(h, o.tags)) == null ? void 0 : r.name) ?? "",
state: y(Q)(h) === h ? "selected" : "excluded"
}, null, 8, ["id", "colorId", "name", "state"]);
}), 256))
]),
_: 2
}, 1040, ["class", "styling"])), [
[f, a, "topTagSelectorTarget"]
])
]),
_: 3
}, 8, ["id"]);
};
}
}), ht = /* @__PURE__ */ U({
__name: "tagSelector",
props: /* @__PURE__ */ N({
modelValue: {},
tags: {},
tagsEditable: { type: Boolean },
tagsMax: { default: 10 },
id: {},
singleMode: { type: Boolean },
requiredForSetter: { type: Boolean, default: !0 },
maxTagsForSetter: {},
emitDelay: { default: 500 },
useTopButton: { type: Boolean, default: !0 },
styling: {}
}, {
modelValue: {
required: !0
},
modelModifiers: {},
tags: {
default: $e(et)
},
tagsModifiers: {}
}),
emits: /* @__PURE__ */ N(["selector", "setter", "tagsChanged"], ["update:modelValue", "update:tags"]),
setup(t, { emit: l }) {
const n = R(), e = t, i = D(t, "modelValue"), a = D(t, "tags"), o = l, u = we((s, c) => {
o(s, c);
}, e.emitDelay);
e.singleMode && !i.value.length && (i.value = [a.value[0].id]);
const f = e.id ?? "top-popup-id-" + Math.random(), h = F("add"), S = () => {
var v;
const s = " " + ((v = n.Common.Tags) == null ? void 0 : v.toLowerCase()), c = /* @__PURE__ */ new Map();
return c.set("add", { value: "add", title: n.Common.Add + s }), c.set("replace", { value: "replace", title: n.Common.Replace + s }), c.set("delete", { value: "delete", title: n.Common.Delete + s }), c;
};
let r = Me({
model: i,
mode: "filter",
targetId: void 0,
filters: void 0,
payload: void 0
});
w(i, () => {
u("selector", i.value);
});
const g = E(() => {
if (r.value.mode === "setter" && e.maxTagsForSetter && !r.value.filters)
return r.value.model.value.length >= e.maxTagsForSetter;
}), d = (s) => {
if (s !== "all") {
if (r.value.model.value.includes(s)) return "selected";
if (r.value.model.value.includes(ve(s))) return "excluded";
}
return s === "all" && !r.value.model.value.length ? "selected" : "";
}, x = (s, c) => {
const v = ve(s);
let I = r.value.model.value.filter((L) => L !== s && L !== v);
c === "select" && I.push(s), c === "exclude" && I.push(v), r.value.mode === "setter" && r.value.targetId !== void 0 && e.requiredForSetter && (I.length || I.push("1"), I.length === 2 && r.value.model.value.length === 1 && r.value.model.value[0] === "1" && (I = I.filter((L) => L !== "1"))), e.singleMode && !r.value.filters && (I.length || (I = r.value.model.value), I.length > 1 && (I = [I[I.length - 1]])), I.sort((L, P) => {
if (!e.tags) return 0;
const Z = e.tags.findIndex((O) => O.id === L), z = e.tags.findIndex((O) => O.id === P);
return Z - z;
}), r.value.model.value = I, r.value.mode === "setter" && r.value.targetId !== void 0 && u("setter", {
tagsIds: I,
targetId: r.value.targetId,
payload: r.value.payload
});
}, C = E(() => {
let s = "top-tagSelector_popup";
return r.value.mode === "filter" && (s += " top-tagSelector_popup-filter"), r.value.mode === "setter" && (s += " top-tagSelector_popup-setter"), s;
}), T = () => {
const s = prompt("", "New tag");
if (!s || s === "New tag") return;
const c = a.value.length + 1;
a.value.push({
id: String(c),
name: s,
color_id: String((c - 1) % 10 + 1)
}), o("tagsChanged", a.value);
}, V = (s) => {
var c;
if (r.value = W(s.elPopupOpener, "topTagSelectorTarget"), !r.value) throw new Error("Open popup TopTagSelector required v-data:topTagSelectorTarget");
if (r.value.filters && (h.value = "add", r.value.model.value = []), !((c = j.$) != null && c.ui.sortable)) {
console.info("Для работы сортировки требуется глобальная загрузка jQuery UI Sortable");
return;
}
!j.state.isMobile && !j.state.isMobileUA && a.value && $(s.elPopup).sortable({
items: 'li:has([data-tag_id]:not([data-tag_id="all"]))',
/**
* @todo Удалить `[contenteditable="true"]` через пол года после выхода версии firefox с поддержкой contenteditable plaintext-only, включая бета версии
*/
cancel: '[contenteditable="plaintext-only"], [contenteditable="true"]',
distance: 10,
stop: function(v, I) {
if (!a.value) return;
const L = $(I.item).parent().find("[data-tag_id]"), P = [];
L.each((Z, z) => {
if (!a.value) return;
const O = $(z).attr("data-tag_id");
P.push(O);
}), a.value.sort((Z, z) => {
const O = P.findIndex((oe) => oe === Z.id), Ce = P.findIndex((oe) => oe === z.id);
return O - Ce;
}), u("tagsChanged", a.value);
}
});
}, m = (s) => {
var c;
(c = j.$) != null && c.ui.sortable && $(s.elPopup).data("ui-sortable") && $(s.elPopup).sortable("destroy");
};
return (s, c) => (k(), b(Y, null, [
A(ot, {
modelValue: i.value,
"onUpdate:modelValue": c[0] || (c[0] = (v) => i.value = v),
id: y(f),
tags: a.value,
styling: s.styling,
mode: "filter",
useTopButton: s.useTopButton
}, null, 8, ["modelValue", "id", "tags", "styling", "useTopButton"]),
A(Ie, {
id: y(f),
class: X(C.value),
onOpen: c[4] || (c[4] = (v) => V(v)),
onClose: c[5] || (c[5] = (v) => m(v)),
"transition-duration": 50
}, Ke({
contentList: B(() => [
y(r).mode === "filter" && !s.singleMode ? (k(), _(pe, {
key: 0,
id: "all",
colorId: "",
name: s.$i18n.Common.All_tags ?? "",
state: y(r).model.value.length ? "" : "selected",
onSelect: c[3] || (c[3] = (v) => y(r).model.value = [])
}, null, 8, ["name", "state"])) : q("", !0),
(k(!0), b(Y, null, se(a.value, (v) => (k(), _(pe, {
key: v.id,
id: v.id,
colorId: v.color_id,
name: v.name,
state: d(v.id),
canExclude: y(r).mode === "filter" && !s.singleMode,
editable: s.tagsEditable,
disabled: g.value && d(v.id) === "",
onUnselect: (I) => x(v.id, "unselect"),
onSelect: (I) => x(v.id, "select"),
onExclude: (I) => x(v.id, "exclude"),
"onUpdate:name": (I) => {
v.name = I, y(u)("tagsChanged", a.value);
}
}, null, 8, ["id", "colorId", "name", "state", "canExclude", "editable", "disabled", "onUnselect", "onSelect", "onExclude", "onUpdate:name"]))), 128)),
s.tagsEditable && a.value.length < s.tagsMax && a.value.length < 20 ? (k(), _(ue, {
key: 1,
"data-top-icon": "",
onClick: J(T, ["stop"])
}, {
default: B(() => [
G(K(s.$i18n.Common.Add), 1)
]),
_: 1
})) : q("", !0)
]),
_: 2
}, [
y(r).mode === "setter" && y(r).filters ? {
name: "header",
fn: B(() => [
A(re, {
modelValue: h.value,
"onUpdate:modelValue": c[1] || (c[1] = (v) => h.value = v),
options: S()
}, null, 8, ["modelValue", "options"])
]),
key: "0"
} : void 0,
y(r).mode === "setter" && y(r).filters ? {
name: "footer",
fn: B(() => [
A(H, { color: "theme" }, {
default: B(() => [
G(K(s.$i18n.Common.Cancel), 1)
]),
_: 1
}),
A(H, {
onClick: c[2] || (c[2] = (v) => y(u)("setter", {
tagsIds: y(r).model.value,
filters: y(r).filters,
filtersAction: h.value,
payload: y(r).payload
}))
}, {
default: B(() => [
G(K(h.value === "add" ? s.$i18n.Common.Add : "") + " " + K(h.value === "replace" ? s.$i18n.Common.Replace : "") + " " + K(h.value === "delete" ? s.$i18n.Common.Delete : ""), 1)
]),
_: 1
})
]),
key: "1"
} : void 0
]), 1032, ["id", "class"])
], 64));
}
});
export {
mt as TopSelectorCompetitors,
vt as TopSelectorRegion,
ht as TopTagSelector,
ot as TopTagSelectorPopupOpener,
ie as TopTagSelectorTagIcon,
Ye as dialogSelectorRegions,
We as findRegion,
yt as genElTopTagSelectorPopupOpener,
ke as genSearcherByKey,
pt as renderElTopTagSelectorPopupOpener,
ft as useItemsFromCompetitors
};
//# sourceMappingURL=project.js.map