@pitcher/canvas-ui 2025.12.9-104839-beta → 2025.12.9-123000-beta
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/canvas-ui.css +2 -25
- package/canvas-ui.js +512 -1295
- package/canvas-ui.js.map +1 -1
- package/lib/apps/canvas-builder/components/ui/DataCharts/DataCharts.raw.vue.d.ts +0 -4
- package/lib/apps/canvas-builder/components/ui/DataCharts/types.d.ts +8 -73
- package/lib/apps/canvas-builder/composables/useCanvas.d.ts +5 -0
- package/lib/types/instanceSettings.types.d.ts +1 -0
- package/locale/de.json +2 -22
- package/locale/el.json +2 -22
- package/locale/en.json +2 -22
- package/locale/es.json +2 -22
- package/locale/fr.json +3 -23
- package/locale/it.json +41 -61
- package/locale/ja.json +38 -58
- package/locale/nl.json +41 -61
- package/locale/pl.json +2 -22
- package/locale/pt-br.json +13 -33
- package/locale/pt.json +2 -22
- package/locale/th.json +6 -26
- package/locale/tr.json +2 -22
- package/locale/zh.json +38 -58
- package/package.json +1 -1
package/canvas-ui.js
CHANGED
|
@@ -79026,7 +79026,7 @@ const _hoisted_1$55 = {
|
|
|
79026
79026
|
class: "flex flex-col gap-4"
|
|
79027
79027
|
};
|
|
79028
79028
|
const _hoisted_2$3I = { key: 0 };
|
|
79029
|
-
const _hoisted_3$
|
|
79029
|
+
const _hoisted_3$2Z = { class: "flex flex-wrap gap-1" };
|
|
79030
79030
|
const _sfc_main$6C = /* @__PURE__ */ defineComponent({
|
|
79031
79031
|
__name: "CTags",
|
|
79032
79032
|
props: {
|
|
@@ -79212,7 +79212,7 @@ const _sfc_main$6C = /* @__PURE__ */ defineComponent({
|
|
|
79212
79212
|
}, 8, ["disabled", "max", "value"]),
|
|
79213
79213
|
_ctx.showSuggestedTags ? (openBlock(), createElementBlock("div", _hoisted_1$55, [
|
|
79214
79214
|
_ctx.suggestedTagsTitle ? (openBlock(), createElementBlock("div", _hoisted_2$3I, toDisplayString(_ctx.suggestedTagsTitle), 1)) : createCommentVNode("", true),
|
|
79215
|
-
createElementVNode("div", _hoisted_3$
|
|
79215
|
+
createElementVNode("div", _hoisted_3$2Z, [
|
|
79216
79216
|
(openBlock(true), createElementBlock(Fragment, null, renderList(options.value, (option) => {
|
|
79217
79217
|
return openBlock(), createBlock(_sfc_main$6D, {
|
|
79218
79218
|
key: option.value,
|
|
@@ -79718,6 +79718,10 @@ var UserRoleEnum = /* @__PURE__ */ ((UserRoleEnum2) => {
|
|
|
79718
79718
|
|
|
79719
79719
|
const _hoisted_1$54 = { class: "flex flex-col gap-2 w-full" };
|
|
79720
79720
|
const _hoisted_2$3H = {
|
|
79721
|
+
key: 0,
|
|
79722
|
+
class: "color-error"
|
|
79723
|
+
};
|
|
79724
|
+
const _hoisted_3$2Y = {
|
|
79721
79725
|
key: 1,
|
|
79722
79726
|
class: "flex gap-4 w-full"
|
|
79723
79727
|
};
|
|
@@ -79741,6 +79745,10 @@ const _sfc_main$6A = /* @__PURE__ */ defineComponent({
|
|
|
79741
79745
|
});
|
|
79742
79746
|
const { t } = useI18n();
|
|
79743
79747
|
const { fetchSuggestedInstanceTags } = useSuggestedTags();
|
|
79748
|
+
const pitcherSettings = inject(
|
|
79749
|
+
"pitcherSettings",
|
|
79750
|
+
computed(() => ({}))
|
|
79751
|
+
);
|
|
79744
79752
|
const editingField = ref(null);
|
|
79745
79753
|
const showTagsComponent = ref(!props.showKeepAsIsPlaceholder);
|
|
79746
79754
|
const labels = {
|
|
@@ -79756,11 +79764,21 @@ const _sfc_main$6A = /* @__PURE__ */ defineComponent({
|
|
|
79756
79764
|
const datePickerShortcuts = {
|
|
79757
79765
|
[t("canvasUI.browserApp.uploadFilesModal.expiresAt.today")]: dayjs().endOf("day").valueOf()
|
|
79758
79766
|
};
|
|
79759
|
-
const
|
|
79760
|
-
|
|
79761
|
-
|
|
79762
|
-
|
|
79763
|
-
|
|
79767
|
+
const isFileExpirationMandatory = computed(() => pitcherSettings.value?.is_file_expiration_mandatory);
|
|
79768
|
+
const expiresAtOptions = computed(() => {
|
|
79769
|
+
const allOptions = [
|
|
79770
|
+
{ value: "never" /* Never */, label: t("canvasUI.browserApp.uploadFilesModal.expiresAt.options.never") },
|
|
79771
|
+
{ value: "at" /* At */, label: t("canvasUI.browserApp.uploadFilesModal.expiresAt.options.at") },
|
|
79772
|
+
{ value: "expired" /* Expired */, label: t("canvasUI.browserApp.uploadFilesModal.expiresAt.options.expired") }
|
|
79773
|
+
];
|
|
79774
|
+
if (isFileExpirationMandatory.value) {
|
|
79775
|
+
return allOptions.filter((option) => option.value !== "never" /* Never */);
|
|
79776
|
+
}
|
|
79777
|
+
return allOptions;
|
|
79778
|
+
});
|
|
79779
|
+
const datePickerActions = computed(
|
|
79780
|
+
() => isFileExpirationMandatory.value ? ["confirm"] : ["clear", "confirm"]
|
|
79781
|
+
);
|
|
79764
79782
|
async function updateForm(updates) {
|
|
79765
79783
|
emit("update:modelValue", { ...form.value, ...updates });
|
|
79766
79784
|
}
|
|
@@ -79783,14 +79801,24 @@ const _sfc_main$6A = /* @__PURE__ */ defineComponent({
|
|
|
79783
79801
|
updates.expiresAtDateTime = dayjs().add(7, "day").endOf("day").valueOf();
|
|
79784
79802
|
}
|
|
79785
79803
|
} else {
|
|
79786
|
-
|
|
79804
|
+
if (isFileExpirationMandatory.value) {
|
|
79805
|
+
updates.expiresAtDateTime = dayjs().add(7, "day").endOf("day").valueOf();
|
|
79806
|
+
updates.expiresAtOption = "at" /* At */;
|
|
79807
|
+
} else {
|
|
79808
|
+
updates.expiresAtDateTime = null;
|
|
79809
|
+
}
|
|
79787
79810
|
}
|
|
79788
79811
|
updateForm(updates);
|
|
79789
79812
|
}
|
|
79790
79813
|
function onChangeExpiresAtDateTime(value) {
|
|
79791
79814
|
const updates = { expiresAtDateTime: value };
|
|
79792
79815
|
if (value === null) {
|
|
79793
|
-
|
|
79816
|
+
if (isFileExpirationMandatory.value) {
|
|
79817
|
+
updates.expiresAtDateTime = dayjs().add(7, "day").endOf("day").valueOf();
|
|
79818
|
+
updates.expiresAtOption = "at" /* At */;
|
|
79819
|
+
} else {
|
|
79820
|
+
updates.expiresAtOption = "never" /* Never */;
|
|
79821
|
+
}
|
|
79794
79822
|
} else if (value < dayjs().valueOf()) {
|
|
79795
79823
|
updates.expiresAtOption = "expired" /* Expired */;
|
|
79796
79824
|
} else {
|
|
@@ -79992,14 +80020,19 @@ const _sfc_main$6A = /* @__PURE__ */ defineComponent({
|
|
|
79992
80020
|
}, 8, ["label"])) : createCommentVNode("", true),
|
|
79993
80021
|
_ctx.showExpirationSettings ? (openBlock(), createBlock(unref(NFormItemGridItem), {
|
|
79994
80022
|
key: 2,
|
|
79995
|
-
label: labels.expiresAtDateTime,
|
|
79996
80023
|
span: 2
|
|
79997
80024
|
}, {
|
|
80025
|
+
label: withCtx(() => [
|
|
80026
|
+
createElementVNode("span", null, [
|
|
80027
|
+
createTextVNode(toDisplayString(unref(t)("canvasUI.browserApp.uploadFilesModal.expiresAt.label")) + " ", 1),
|
|
80028
|
+
isFileExpirationMandatory.value ? (openBlock(), createElementBlock("span", _hoisted_2$3H, "*")) : createCommentVNode("", true)
|
|
80029
|
+
])
|
|
80030
|
+
]),
|
|
79998
80031
|
default: withCtx(() => [
|
|
79999
80032
|
_ctx.showKeepAsIsPlaceholder && !isEditingFieldOrNonEmpty("expiresAtOption") ? (openBlock(), createBlock(CInputPlaceholder, {
|
|
80000
80033
|
key: 0,
|
|
80001
80034
|
onClick: _cache[6] || (_cache[6] = ($event) => enableEditing("expiresAtOption", unref(MetadataTemplateFieldTypeEnum).SELECT))
|
|
80002
|
-
})) : (openBlock(), createElementBlock("div",
|
|
80035
|
+
})) : (openBlock(), createElementBlock("div", _hoisted_3$2Y, [
|
|
80003
80036
|
createVNode(CSelect, {
|
|
80004
80037
|
bordered: "",
|
|
80005
80038
|
class: "w-50",
|
|
@@ -80011,14 +80044,14 @@ const _sfc_main$6A = /* @__PURE__ */ defineComponent({
|
|
|
80011
80044
|
handleBlur("expiresAtOption");
|
|
80012
80045
|
},
|
|
80013
80046
|
"on-update:value": onChangeExpiresAtOption,
|
|
80014
|
-
options: expiresAtOptions,
|
|
80047
|
+
options: expiresAtOptions.value,
|
|
80015
80048
|
value: form.value.expiresAtOption,
|
|
80016
80049
|
onBlur: _cache[7] || (_cache[7] = ($event) => handleBlur("expiresAtOption"))
|
|
80017
|
-
}, null, 8, ["clearable", "filterable", "on-clear", "value"]),
|
|
80050
|
+
}, null, 8, ["clearable", "filterable", "on-clear", "options", "value"]),
|
|
80018
80051
|
createVNode(unref(NDatePicker), {
|
|
80019
|
-
actions:
|
|
80052
|
+
actions: datePickerActions.value,
|
|
80020
80053
|
class: "w-50",
|
|
80021
|
-
clearable:
|
|
80054
|
+
clearable: !isFileExpirationMandatory.value,
|
|
80022
80055
|
"data-field": "expiresAtDateTime",
|
|
80023
80056
|
disabled: form.value.expiresAtOption !== "at" /* At */,
|
|
80024
80057
|
"on-clear": async () => {
|
|
@@ -80030,11 +80063,11 @@ const _sfc_main$6A = /* @__PURE__ */ defineComponent({
|
|
|
80030
80063
|
type: "datetime",
|
|
80031
80064
|
value: form.value.expiresAtDateTime,
|
|
80032
80065
|
onBlur: _cache[8] || (_cache[8] = ($event) => handleBlur("expiresAtDateTime"))
|
|
80033
|
-
}, null, 8, ["disabled", "on-clear", "value"])
|
|
80066
|
+
}, null, 8, ["actions", "clearable", "disabled", "on-clear", "value"])
|
|
80034
80067
|
]))
|
|
80035
80068
|
]),
|
|
80036
80069
|
_: 1
|
|
80037
|
-
}
|
|
80070
|
+
})) : createCommentVNode("", true)
|
|
80038
80071
|
]),
|
|
80039
80072
|
_: 1
|
|
80040
80073
|
})
|
|
@@ -94586,38 +94619,38 @@ const _hoisted_47$4 = ["data-result-selected", "onClick"];
|
|
|
94586
94619
|
const _hoisted_48$4 = { class: "w-18 h-14 border-rounded-1 mr-4 flex-shrink-0 bg-gray-200 flex items-center justify-center" };
|
|
94587
94620
|
const _hoisted_49$4 = { class: "flex-1 min-w-0" };
|
|
94588
94621
|
const _hoisted_50$4 = { class: "text-sm font-bold text-gray-900 truncate mb-1" };
|
|
94589
|
-
const _hoisted_51$
|
|
94590
|
-
const _hoisted_52$
|
|
94591
|
-
const _hoisted_53$
|
|
94622
|
+
const _hoisted_51$2 = { class: "text-xs text-gray-500" };
|
|
94623
|
+
const _hoisted_52$2 = { class: "text-xs text-gray-400" };
|
|
94624
|
+
const _hoisted_53$2 = {
|
|
94592
94625
|
key: 0,
|
|
94593
94626
|
class: "px-0 py-0"
|
|
94594
94627
|
};
|
|
94595
|
-
const _hoisted_54$
|
|
94628
|
+
const _hoisted_54$1 = {
|
|
94596
94629
|
key: 0,
|
|
94597
94630
|
class: "flex flex-col items-center justify-center text-center p-8 gap-4"
|
|
94598
94631
|
};
|
|
94599
|
-
const _hoisted_55$
|
|
94632
|
+
const _hoisted_55$1 = {
|
|
94600
94633
|
key: 2,
|
|
94601
94634
|
class: "flex-1 overflow-y-auto bg-white w-full"
|
|
94602
94635
|
};
|
|
94603
|
-
const _hoisted_56$
|
|
94604
|
-
const _hoisted_57$
|
|
94605
|
-
const _hoisted_58$
|
|
94606
|
-
const _hoisted_59$
|
|
94607
|
-
const _hoisted_60$
|
|
94608
|
-
const _hoisted_61$
|
|
94636
|
+
const _hoisted_56$1 = { class: "w-full px-0" };
|
|
94637
|
+
const _hoisted_57$1 = { class: "flex items-center px-0 pt-2 pb-1" };
|
|
94638
|
+
const _hoisted_58$1 = { class: "text-m font-semibold text-gray-900" };
|
|
94639
|
+
const _hoisted_59$1 = { class: "ml-2 text-sm text-gray-500" };
|
|
94640
|
+
const _hoisted_60$1 = ["data-result-selected", "onClick"];
|
|
94641
|
+
const _hoisted_61$1 = {
|
|
94609
94642
|
key: 1,
|
|
94610
94643
|
class: "w-18 h-14 border-rounded-1 mr-4 flex-shrink-0 bg-gray-200 flex items-center justify-center"
|
|
94611
94644
|
};
|
|
94612
|
-
const _hoisted_62$
|
|
94613
|
-
const _hoisted_63$
|
|
94614
|
-
const _hoisted_64$
|
|
94615
|
-
const _hoisted_65$
|
|
94616
|
-
const _hoisted_66$
|
|
94645
|
+
const _hoisted_62$1 = { class: "flex-1 min-w-0" };
|
|
94646
|
+
const _hoisted_63$1 = { class: "text-sm font-bold text-gray-900 truncate mb-1" };
|
|
94647
|
+
const _hoisted_64$1 = { class: "text-xs text-gray-500" };
|
|
94648
|
+
const _hoisted_65$1 = { class: "text-xs text-gray-400" };
|
|
94649
|
+
const _hoisted_66$1 = {
|
|
94617
94650
|
key: 0,
|
|
94618
94651
|
class: "flex flex-col items-center justify-center text-center p-8 gap-4"
|
|
94619
94652
|
};
|
|
94620
|
-
const _hoisted_67$
|
|
94653
|
+
const _hoisted_67$1 = {
|
|
94621
94654
|
key: 0,
|
|
94622
94655
|
class: "flex flex-wrap line-height-6 pt-4 pb-2 px-6 border-t border-gray-200 gap-y-4 gap-x-4"
|
|
94623
94656
|
};
|
|
@@ -95779,13 +95812,13 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95779
95812
|
]),
|
|
95780
95813
|
createElementVNode("div", _hoisted_49$4, [
|
|
95781
95814
|
createElementVNode("h3", _hoisted_50$4, toDisplayString(item.name), 1),
|
|
95782
|
-
createElementVNode("p", _hoisted_51$
|
|
95815
|
+
createElementVNode("p", _hoisted_51$2, toDisplayString(formatCanvasType(item.content_type)), 1)
|
|
95783
95816
|
]),
|
|
95784
|
-
createElementVNode("div", _hoisted_52$
|
|
95817
|
+
createElementVNode("div", _hoisted_52$2, toDisplayString(item.folder?.name || ""), 1)
|
|
95785
95818
|
], 10, _hoisted_47$4);
|
|
95786
95819
|
}), 128))
|
|
95787
95820
|
]),
|
|
95788
|
-
filteredCanvasFiles.value.length > 5 ? (openBlock(), createElementBlock("div", _hoisted_53$
|
|
95821
|
+
filteredCanvasFiles.value.length > 5 ? (openBlock(), createElementBlock("div", _hoisted_53$2, [
|
|
95789
95822
|
createElementVNode("span", {
|
|
95790
95823
|
class: "text-sm text-gray-600 hover:text-gray-800 font-bold flex items-center cursor-pointer",
|
|
95791
95824
|
onClick: _cache[14] || (_cache[14] = ($event) => searchType.value = "canvases")
|
|
@@ -95800,7 +95833,7 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95800
95833
|
])) : createCommentVNode("", true)
|
|
95801
95834
|
])) : createCommentVNode("", true)
|
|
95802
95835
|
]),
|
|
95803
|
-
searchError.value || shouldShowNoResults.value ? (openBlock(), createElementBlock("div", _hoisted_54$
|
|
95836
|
+
searchError.value || shouldShowNoResults.value ? (openBlock(), createElementBlock("div", _hoisted_54$1, [
|
|
95804
95837
|
createVNode(CIcon, {
|
|
95805
95838
|
class: "text-6xl",
|
|
95806
95839
|
color: searchError.value ? "var(--p-error)" : "var(--p-text3)",
|
|
@@ -95811,9 +95844,9 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95811
95844
|
class: normalizeClass(searchError.value ? "text-error font-semibold" : "text-text2")
|
|
95812
95845
|
}, toDisplayString(searchError.value || unref(t)("canvasUI.CGlobalSearch.noResults")), 3)
|
|
95813
95846
|
])) : createCommentVNode("", true)
|
|
95814
|
-
])) : (openBlock(), createElementBlock("div", _hoisted_55$
|
|
95815
|
-
createElementVNode("div", _hoisted_56$
|
|
95816
|
-
createElementVNode("div", _hoisted_57$
|
|
95847
|
+
])) : (openBlock(), createElementBlock("div", _hoisted_55$1, [
|
|
95848
|
+
createElementVNode("div", _hoisted_56$1, [
|
|
95849
|
+
createElementVNode("div", _hoisted_57$1, [
|
|
95817
95850
|
searchType.value === "content" ? (openBlock(), createBlock(CIcon, {
|
|
95818
95851
|
key: 0,
|
|
95819
95852
|
class: "mr-2",
|
|
@@ -95827,8 +95860,8 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95827
95860
|
icon: "presentation",
|
|
95828
95861
|
size: "16"
|
|
95829
95862
|
})),
|
|
95830
|
-
createElementVNode("span", _hoisted_58$
|
|
95831
|
-
createElementVNode("span", _hoisted_59$
|
|
95863
|
+
createElementVNode("span", _hoisted_58$1, toDisplayString(searchType.value === "content" ? unref(t)("canvasUI.CAlgoliaSearch.sections.content") : unref(t)("canvasUI.CAlgoliaSearch.sections.pitchDecks")), 1),
|
|
95864
|
+
createElementVNode("span", _hoisted_59$1, " (" + toDisplayString(searchType.value === "content" ? filteredContentFiles.value.length : filteredCanvasFiles.value.length) + ") ", 1)
|
|
95832
95865
|
]),
|
|
95833
95866
|
createElementVNode("div", null, [
|
|
95834
95867
|
(openBlock(true), createElementBlock(Fragment, null, renderList(searchType.value === "content" ? filteredContentFiles.value : filteredCanvasFiles.value, (item) => {
|
|
@@ -95853,7 +95886,7 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95853
95886
|
"object-fit": "cover",
|
|
95854
95887
|
src: item.picture_url || "",
|
|
95855
95888
|
width: "72"
|
|
95856
|
-
}, null, 8, ["file-data", "src"])) : (openBlock(), createElementBlock("div", _hoisted_61$
|
|
95889
|
+
}, null, 8, ["file-data", "src"])) : (openBlock(), createElementBlock("div", _hoisted_61$1, [
|
|
95857
95890
|
searchType.value === "content" ? (openBlock(), createBlock(CIcon, {
|
|
95858
95891
|
key: 0,
|
|
95859
95892
|
color: "var(--p-text2)",
|
|
@@ -95866,15 +95899,15 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95866
95899
|
size: "32"
|
|
95867
95900
|
}))
|
|
95868
95901
|
])),
|
|
95869
|
-
createElementVNode("div", _hoisted_62$
|
|
95870
|
-
createElementVNode("h3", _hoisted_63$
|
|
95871
|
-
createElementVNode("p", _hoisted_64$
|
|
95902
|
+
createElementVNode("div", _hoisted_62$1, [
|
|
95903
|
+
createElementVNode("h3", _hoisted_63$1, toDisplayString(item.name), 1),
|
|
95904
|
+
createElementVNode("p", _hoisted_64$1, toDisplayString(searchType.value === "content" ? item.type === "folder" ? "Folder" : item.content_type || "PDF" : formatCanvasType(item.content_type)), 1)
|
|
95872
95905
|
]),
|
|
95873
|
-
createElementVNode("div", _hoisted_65$
|
|
95874
|
-
], 10, _hoisted_60$
|
|
95906
|
+
createElementVNode("div", _hoisted_65$1, toDisplayString(searchType.value === "content" && item.type === "folder" ? item.parent_folder?.name || "" : item.folder?.name || ""), 1)
|
|
95907
|
+
], 10, _hoisted_60$1);
|
|
95875
95908
|
}), 128))
|
|
95876
95909
|
]),
|
|
95877
|
-
searchError.value || shouldShowNoResults.value ? (openBlock(), createElementBlock("div", _hoisted_66$
|
|
95910
|
+
searchError.value || shouldShowNoResults.value ? (openBlock(), createElementBlock("div", _hoisted_66$1, [
|
|
95878
95911
|
createVNode(CIcon, {
|
|
95879
95912
|
class: "text-6xl",
|
|
95880
95913
|
color: searchError.value ? "var(--p-error)" : "var(--p-text3)",
|
|
@@ -95888,7 +95921,7 @@ const _sfc_main$5I = /* @__PURE__ */ defineComponent({
|
|
|
95888
95921
|
])
|
|
95889
95922
|
]))
|
|
95890
95923
|
]),
|
|
95891
|
-
!showRecentView.value ? (openBlock(), createElementBlock("div", _hoisted_67$
|
|
95924
|
+
!showRecentView.value ? (openBlock(), createElementBlock("div", _hoisted_67$1, [
|
|
95892
95925
|
createVNode(CShortcut, null, {
|
|
95893
95926
|
default: withCtx(() => [
|
|
95894
95927
|
createVNode(CShortcutIcon, { icon: "arrow-up" }),
|
|
@@ -140765,84 +140798,17 @@ const _sfc_main$2G = /* @__PURE__ */ defineComponent({
|
|
|
140765
140798
|
}
|
|
140766
140799
|
});
|
|
140767
140800
|
|
|
140768
|
-
const _hoisted_1$24 = {
|
|
140769
|
-
key: 0,
|
|
140770
|
-
class: "cb-data-charts-raw__controls"
|
|
140771
|
-
};
|
|
140801
|
+
const _hoisted_1$24 = { class: "cb-data-charts-raw" };
|
|
140772
140802
|
const _sfc_main$2F = /* @__PURE__ */ defineComponent({
|
|
140773
140803
|
__name: "DataCharts.raw",
|
|
140774
140804
|
props: {
|
|
140775
|
-
data: {}
|
|
140776
|
-
isPreview: { type: Boolean },
|
|
140777
|
-
isEditMode: { type: Boolean }
|
|
140805
|
+
data: {}
|
|
140778
140806
|
},
|
|
140779
140807
|
setup(__props) {
|
|
140780
|
-
const { t } = useI18n();
|
|
140781
140808
|
const chartRef = ref(null);
|
|
140782
|
-
const containerRef = ref(null);
|
|
140783
140809
|
let chart = null;
|
|
140784
140810
|
const isChartLoaded = ref(false);
|
|
140785
|
-
const isFullscreen = ref(false);
|
|
140786
|
-
const currentChartType = ref("");
|
|
140787
140811
|
const props = __props;
|
|
140788
|
-
const showViewControls = computed(() => {
|
|
140789
|
-
if (props.isPreview || props.isEditMode) return false;
|
|
140790
|
-
return props.data?.view_controls?.enable_fullscreen_btn || props.data?.view_controls?.enable_chart_type_switcher;
|
|
140791
|
-
});
|
|
140792
|
-
const containerStyle = computed(() => {
|
|
140793
|
-
if (isFullscreen.value || props.isPreview) {
|
|
140794
|
-
return {};
|
|
140795
|
-
}
|
|
140796
|
-
return {
|
|
140797
|
-
height: props.data?.chart_height ? `${props.data.chart_height}px` : void 0,
|
|
140798
|
-
width: props.data?.chart_width ? `${props.data.chart_width}%` : void 0,
|
|
140799
|
-
minHeight: props.data?.chart_height ? `${props.data.chart_height}px` : void 0,
|
|
140800
|
-
maxHeight: props.data?.chart_height ? `${props.data.chart_height}px` : void 0
|
|
140801
|
-
};
|
|
140802
|
-
});
|
|
140803
|
-
const chartTypeSwitcherOptions = computed(() => [
|
|
140804
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.bar"), key: "bar" },
|
|
140805
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.line"), key: "line" },
|
|
140806
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.pie"), key: "pie" },
|
|
140807
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.doughnut"), key: "doughnut" },
|
|
140808
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.polarArea"), key: "polarArea" },
|
|
140809
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.radar"), key: "radar" },
|
|
140810
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.scatter"), key: "scatter" }
|
|
140811
|
-
]);
|
|
140812
|
-
function toggleFullscreen() {
|
|
140813
|
-
if (!containerRef.value) return;
|
|
140814
|
-
if (!isFullscreen.value) {
|
|
140815
|
-
isFullscreen.value = true;
|
|
140816
|
-
} else {
|
|
140817
|
-
isFullscreen.value = false;
|
|
140818
|
-
}
|
|
140819
|
-
nextTick(() => {
|
|
140820
|
-
if (chart) {
|
|
140821
|
-
chart.resize();
|
|
140822
|
-
}
|
|
140823
|
-
});
|
|
140824
|
-
}
|
|
140825
|
-
function handleChartTypeChange(newType) {
|
|
140826
|
-
if (!chart || !props.data) return;
|
|
140827
|
-
currentChartType.value = newType;
|
|
140828
|
-
initChart(newType);
|
|
140829
|
-
}
|
|
140830
|
-
function handleKeydown(e) {
|
|
140831
|
-
if (e.key === "Escape" && isFullscreen.value) {
|
|
140832
|
-
isFullscreen.value = false;
|
|
140833
|
-
nextTick(() => {
|
|
140834
|
-
if (chart) {
|
|
140835
|
-
chart.resize();
|
|
140836
|
-
}
|
|
140837
|
-
});
|
|
140838
|
-
}
|
|
140839
|
-
}
|
|
140840
|
-
onMounted(() => {
|
|
140841
|
-
window.addEventListener("keydown", handleKeydown);
|
|
140842
|
-
});
|
|
140843
|
-
onUnmounted(() => {
|
|
140844
|
-
window.removeEventListener("keydown", handleKeydown);
|
|
140845
|
-
});
|
|
140846
140812
|
const sectionListSectionInfo = inject(
|
|
140847
140813
|
"sectionListSectionInfo",
|
|
140848
140814
|
computed(() => null)
|
|
@@ -140873,151 +140839,41 @@ const _sfc_main$2F = /* @__PURE__ */ defineComponent({
|
|
|
140873
140839
|
}
|
|
140874
140840
|
return window._chartJsPromise;
|
|
140875
140841
|
}
|
|
140876
|
-
function
|
|
140877
|
-
const isXYChart = ["scatter", "bubble"].includes(chartType);
|
|
140842
|
+
function processChartData(chartData, context) {
|
|
140878
140843
|
const processedData = {
|
|
140879
140844
|
labels: [],
|
|
140880
140845
|
values: []
|
|
140881
140846
|
};
|
|
140882
|
-
|
|
140847
|
+
chartData.data_points?.forEach((point) => {
|
|
140883
140848
|
let label = point.label;
|
|
140849
|
+
let value = point.value;
|
|
140884
140850
|
try {
|
|
140885
140851
|
if (typeof label === "string") {
|
|
140886
140852
|
label = renderTemplate(label, context);
|
|
140887
140853
|
}
|
|
140888
|
-
if (
|
|
140889
|
-
|
|
140890
|
-
|
|
140891
|
-
|
|
140892
|
-
|
|
140893
|
-
|
|
140894
|
-
|
|
140895
|
-
|
|
140896
|
-
|
|
140897
|
-
if (typeof label === "string" && label.includes(",") && typeof xValue === "string" && xValue.includes(",") && typeof yValue === "string" && yValue.includes(",")) {
|
|
140898
|
-
const labels = label.split(",");
|
|
140899
|
-
const xValues = xValue.split(",");
|
|
140900
|
-
const yValues = yValue.split(",");
|
|
140901
|
-
labels.forEach((l, idx) => {
|
|
140902
|
-
const x = Number(xValues[idx]) || 0;
|
|
140903
|
-
const y = Number(yValues[idx]) || 0;
|
|
140854
|
+
if (typeof value === "string") {
|
|
140855
|
+
value = renderTemplate(value, context);
|
|
140856
|
+
}
|
|
140857
|
+
if (typeof label === "string" && label.includes(",") && typeof value === "string" && value.includes(",")) {
|
|
140858
|
+
const labels = label.split(",");
|
|
140859
|
+
const values = value.split(",");
|
|
140860
|
+
labels.forEach((l, idx) => {
|
|
140861
|
+
const v = values[idx];
|
|
140862
|
+
if (v !== void 0) {
|
|
140904
140863
|
processedData.labels.push(l);
|
|
140905
|
-
|
|
140906
|
-
processedData.values.push({ x, y, r: Math.max(5, Math.abs(y) / 2) });
|
|
140907
|
-
} else {
|
|
140908
|
-
processedData.values.push({ x, y });
|
|
140909
|
-
}
|
|
140910
|
-
});
|
|
140911
|
-
} else {
|
|
140912
|
-
const x = Number(xValue) || 0;
|
|
140913
|
-
const y = Number(yValue) || 0;
|
|
140914
|
-
processedData.labels.push(label);
|
|
140915
|
-
if (chartType === "bubble") {
|
|
140916
|
-
processedData.values.push({ x, y, r: Math.max(5, Math.abs(y) / 2) });
|
|
140917
|
-
} else {
|
|
140918
|
-
processedData.values.push({ x, y });
|
|
140864
|
+
processedData.values.push(Number(v) || 0);
|
|
140919
140865
|
}
|
|
140920
|
-
}
|
|
140866
|
+
});
|
|
140921
140867
|
} else {
|
|
140922
|
-
|
|
140923
|
-
|
|
140924
|
-
value = renderTemplate(value, context);
|
|
140925
|
-
}
|
|
140926
|
-
if (typeof label === "string" && label.includes(",") && typeof value === "string" && value.includes(",")) {
|
|
140927
|
-
const labels = label.split(",");
|
|
140928
|
-
const values = value.split(",");
|
|
140929
|
-
labels.forEach((l, idx) => {
|
|
140930
|
-
const v = values[idx];
|
|
140931
|
-
if (v !== void 0) {
|
|
140932
|
-
processedData.labels.push(l);
|
|
140933
|
-
processedData.values.push(Number(v) || 0);
|
|
140934
|
-
}
|
|
140935
|
-
});
|
|
140936
|
-
} else {
|
|
140937
|
-
processedData.labels.push(label);
|
|
140938
|
-
processedData.values.push(Number(value) || 0);
|
|
140939
|
-
}
|
|
140868
|
+
processedData.labels.push(label);
|
|
140869
|
+
processedData.values.push(Number(value) || 0);
|
|
140940
140870
|
}
|
|
140941
140871
|
} catch (err) {
|
|
140942
140872
|
console.warn("Error processing chart data point:", err);
|
|
140943
140873
|
processedData.labels.push(label);
|
|
140944
|
-
|
|
140945
|
-
processedData.values.push({ x: 0, y: 0 });
|
|
140946
|
-
} else {
|
|
140947
|
-
processedData.values.push(0);
|
|
140948
|
-
}
|
|
140874
|
+
processedData.values.push(Number(value) || 0);
|
|
140949
140875
|
}
|
|
140950
140876
|
});
|
|
140951
|
-
return processedData;
|
|
140952
|
-
}
|
|
140953
|
-
function processChartData(chartData, context) {
|
|
140954
|
-
if (chartData.series && Array.isArray(chartData.series) && chartData.series.length > 0) {
|
|
140955
|
-
const datasets = [];
|
|
140956
|
-
let allLabels = [];
|
|
140957
|
-
const isSingleSeries = chartData.series.length === 1;
|
|
140958
|
-
chartData.series.forEach((series, index) => {
|
|
140959
|
-
const seriesChartType = series.chart_type || chartData.type || "bar";
|
|
140960
|
-
const processedData2 = processSeriesDataPoints(series.data_points || [], seriesChartType, context);
|
|
140961
|
-
if (processedData2.labels.length > allLabels.length) {
|
|
140962
|
-
allLabels = processedData2.labels;
|
|
140963
|
-
}
|
|
140964
|
-
const preBuiltDataset = chartData.data?.datasets?.[index];
|
|
140965
|
-
let backgroundColor2 = preBuiltDataset?.background_color || preBuiltDataset?.backgroundColor;
|
|
140966
|
-
let borderColor2 = preBuiltDataset?.border_color || preBuiltDataset?.borderColor;
|
|
140967
|
-
if (isSingleSeries && Array.isArray(backgroundColor2)) {
|
|
140968
|
-
const resolvedColors = backgroundColor2.map((color, i) => {
|
|
140969
|
-
if (typeof color === "string" && color.startsWith("palette")) {
|
|
140970
|
-
const paletteIndex = parseInt(color.replace("palette", ""));
|
|
140971
|
-
const validIndex = paletteIndex >= 0 ? paletteIndex % palette.value.length : i;
|
|
140972
|
-
return palette.value[validIndex];
|
|
140973
|
-
}
|
|
140974
|
-
return color;
|
|
140975
|
-
});
|
|
140976
|
-
const dataPointsCount = processedData2.values.length;
|
|
140977
|
-
backgroundColor2 = Array.from({ length: dataPointsCount }, (_, i) => resolvedColors[i % resolvedColors.length]);
|
|
140978
|
-
borderColor2 = [...backgroundColor2];
|
|
140979
|
-
} else if (typeof backgroundColor2 === "string" && backgroundColor2.startsWith("palette")) {
|
|
140980
|
-
const paletteIndex = parseInt(backgroundColor2.replace("palette", ""));
|
|
140981
|
-
const validIndex = paletteIndex >= 0 ? paletteIndex % palette.value.length : index;
|
|
140982
|
-
backgroundColor2 = palette.value[validIndex];
|
|
140983
|
-
borderColor2 = backgroundColor2;
|
|
140984
|
-
}
|
|
140985
|
-
const datasetOptions = {
|
|
140986
|
-
label: series.name,
|
|
140987
|
-
data: processedData2.values,
|
|
140988
|
-
backgroundColor: backgroundColor2 || palette.value[index % palette.value.length],
|
|
140989
|
-
borderColor: borderColor2 || palette.value[index % palette.value.length],
|
|
140990
|
-
borderWidth: 1
|
|
140991
|
-
};
|
|
140992
|
-
if (!isSingleSeries) {
|
|
140993
|
-
if (series.chart_type === "area") {
|
|
140994
|
-
datasetOptions.type = "line";
|
|
140995
|
-
datasetOptions.fill = true;
|
|
140996
|
-
datasetOptions.tension = 0.4;
|
|
140997
|
-
} else {
|
|
140998
|
-
datasetOptions.type = series.chart_type;
|
|
140999
|
-
}
|
|
141000
|
-
}
|
|
141001
|
-
if (series.chart_type === "area") {
|
|
141002
|
-
datasetOptions.fill = true;
|
|
141003
|
-
datasetOptions.tension = 0.4;
|
|
141004
|
-
}
|
|
141005
|
-
if (["line", "area"].includes(series.chart_type)) {
|
|
141006
|
-
datasetOptions.tension = 0.4;
|
|
141007
|
-
}
|
|
141008
|
-
datasets.push(datasetOptions);
|
|
141009
|
-
});
|
|
141010
|
-
return {
|
|
141011
|
-
...chartData,
|
|
141012
|
-
type: chartData.type || chartData._primary_chart_type || "bar",
|
|
141013
|
-
data: {
|
|
141014
|
-
...chartData.data,
|
|
141015
|
-
labels: allLabels,
|
|
141016
|
-
datasets
|
|
141017
|
-
}
|
|
141018
|
-
};
|
|
141019
|
-
}
|
|
141020
|
-
const processedData = processSeriesDataPoints(chartData.data_points || [], chartData.type, context);
|
|
141021
140877
|
let backgroundColor = chartData.data?.datasets?.[0]?.background_color || [];
|
|
141022
140878
|
let borderColor = chartData.data?.datasets?.[0]?.border_color || [];
|
|
141023
140879
|
if (chartData.color_scheme_type === "theme" && Array.isArray(backgroundColor)) {
|
|
@@ -141063,7 +140919,7 @@ const _sfc_main$2F = /* @__PURE__ */ defineComponent({
|
|
|
141063
140919
|
}
|
|
141064
140920
|
};
|
|
141065
140921
|
}
|
|
141066
|
-
function initChart(
|
|
140922
|
+
function initChart() {
|
|
141067
140923
|
if (!props.data || !chartRef.value || !isChartLoaded.value) {
|
|
141068
140924
|
return;
|
|
141069
140925
|
}
|
|
@@ -141072,73 +140928,24 @@ const _sfc_main$2F = /* @__PURE__ */ defineComponent({
|
|
|
141072
140928
|
}
|
|
141073
140929
|
const context = props.data.context ?? (!isEmpty(activeCanvas.value?.context) || isCanvas.value ? { ...crmShape.value, ...activeCanvas.value?.context } : crmShape.value);
|
|
141074
140930
|
const processedChartData = processChartData(props.data, context);
|
|
141075
|
-
const chartType = overrideType || currentChartType.value || processedChartData.type || "bar";
|
|
141076
140931
|
if (processedChartData.data?.datasets) {
|
|
141077
140932
|
processedChartData.data.datasets = processedChartData.data.datasets.map((dataset) => {
|
|
141078
|
-
const { background_color, border_color, point_style,
|
|
140933
|
+
const { background_color, border_color, point_style, ...rest } = dataset;
|
|
141079
140934
|
return {
|
|
141080
140935
|
...rest,
|
|
141081
140936
|
backgroundColor: dataset.backgroundColor || background_color || ["#000000"],
|
|
141082
140937
|
borderColor: dataset.borderColor || border_color || ["#000000"],
|
|
141083
|
-
pointStyle: point_style
|
|
141084
|
-
fill,
|
|
141085
|
-
tension,
|
|
141086
|
-
showLine: show_line
|
|
140938
|
+
pointStyle: point_style
|
|
141087
140939
|
};
|
|
141088
140940
|
});
|
|
141089
140941
|
}
|
|
141090
|
-
let scales = processedChartData.options?.scales;
|
|
141091
|
-
if (scales) {
|
|
141092
|
-
const convertedScales = {};
|
|
141093
|
-
if (scales.x) {
|
|
141094
|
-
convertedScales.x = { ...scales.x };
|
|
141095
|
-
}
|
|
141096
|
-
if (scales.y) {
|
|
141097
|
-
convertedScales.y = {
|
|
141098
|
-
...scales.y,
|
|
141099
|
-
beginAtZero: scales.y.begin_at_zero
|
|
141100
|
-
};
|
|
141101
|
-
delete convertedScales.y.begin_at_zero;
|
|
141102
|
-
}
|
|
141103
|
-
if (scales.r) {
|
|
141104
|
-
convertedScales.r = {
|
|
141105
|
-
...scales.r,
|
|
141106
|
-
beginAtZero: scales.r.begin_at_zero,
|
|
141107
|
-
ticks: scales.r.ticks ? {
|
|
141108
|
-
stepSize: scales.r.ticks.step_size
|
|
141109
|
-
} : void 0
|
|
141110
|
-
};
|
|
141111
|
-
}
|
|
141112
|
-
scales = convertedScales;
|
|
141113
|
-
}
|
|
141114
|
-
if (["pie", "doughnut", "polarArea"].includes(chartType)) {
|
|
141115
|
-
scales = void 0;
|
|
141116
|
-
}
|
|
141117
|
-
const tooltipCallbacks = {};
|
|
141118
|
-
if (props.data.percent_display) {
|
|
141119
|
-
tooltipCallbacks.label = function(context2) {
|
|
141120
|
-
const label = context2.dataset.label || "";
|
|
141121
|
-
const value = context2.raw;
|
|
141122
|
-
if (typeof value === "number" && value >= 0 && value <= 1) {
|
|
141123
|
-
return `${label}${label ? ": " : ""}${(value * 100).toFixed(2)}%`;
|
|
141124
|
-
}
|
|
141125
|
-
return `${label}${label ? ": " : ""}${value}`;
|
|
141126
|
-
};
|
|
141127
|
-
}
|
|
141128
140942
|
const chartConfig = {
|
|
141129
140943
|
...processedChartData,
|
|
141130
|
-
type:
|
|
140944
|
+
type: processedChartData.type,
|
|
141131
140945
|
options: merge$1({}, processedChartData.options, {
|
|
141132
140946
|
responsive: true,
|
|
141133
140947
|
maintainAspectRatio: false,
|
|
141134
|
-
indexAxis: processedChartData.options?.index_axis
|
|
141135
|
-
scales,
|
|
141136
|
-
plugins: {
|
|
141137
|
-
...processedChartData.options?.plugins,
|
|
141138
|
-
tooltip: props.data.percent_display ? {
|
|
141139
|
-
callbacks: tooltipCallbacks
|
|
141140
|
-
} : void 0
|
|
141141
|
-
}
|
|
140948
|
+
indexAxis: processedChartData.options?.index_axis
|
|
141142
140949
|
})
|
|
141143
140950
|
};
|
|
141144
140951
|
chart = new window.Chart(chartRef.value, chartConfig);
|
|
@@ -141158,164 +140965,84 @@ const _sfc_main$2F = /* @__PURE__ */ defineComponent({
|
|
|
141158
140965
|
isChartLoaded.value = true;
|
|
141159
140966
|
});
|
|
141160
140967
|
return (_ctx, _cache) => {
|
|
141161
|
-
return openBlock(), createElementBlock("div",
|
|
141162
|
-
ref_key: "containerRef",
|
|
141163
|
-
ref: containerRef,
|
|
141164
|
-
class: normalizeClass(["cb-data-charts-raw", { "is-fullscreen": isFullscreen.value }]),
|
|
141165
|
-
style: normalizeStyle(containerStyle.value)
|
|
141166
|
-
}, [
|
|
141167
|
-
showViewControls.value ? (openBlock(), createElementBlock("div", _hoisted_1$24, [
|
|
141168
|
-
props.data?.view_controls?.enable_chart_type_switcher ? (openBlock(), createBlock(unref(NDropdown), {
|
|
141169
|
-
key: 0,
|
|
141170
|
-
options: chartTypeSwitcherOptions.value,
|
|
141171
|
-
trigger: "click",
|
|
141172
|
-
onSelect: handleChartTypeChange
|
|
141173
|
-
}, {
|
|
141174
|
-
default: withCtx(() => [
|
|
141175
|
-
createVNode(CButton, {
|
|
141176
|
-
quaternary: "",
|
|
141177
|
-
size: "small"
|
|
141178
|
-
}, {
|
|
141179
|
-
icon: withCtx(() => [
|
|
141180
|
-
createVNode(CIcon, { icon: "chart-bar" })
|
|
141181
|
-
]),
|
|
141182
|
-
_: 1
|
|
141183
|
-
})
|
|
141184
|
-
]),
|
|
141185
|
-
_: 1
|
|
141186
|
-
}, 8, ["options"])) : createCommentVNode("", true),
|
|
141187
|
-
props.data?.view_controls?.enable_fullscreen_btn ? (openBlock(), createBlock(CButton, {
|
|
141188
|
-
key: 1,
|
|
141189
|
-
quaternary: "",
|
|
141190
|
-
size: "small",
|
|
141191
|
-
onClick: toggleFullscreen
|
|
141192
|
-
}, {
|
|
141193
|
-
icon: withCtx(() => [
|
|
141194
|
-
createVNode(CIcon, {
|
|
141195
|
-
icon: isFullscreen.value ? "compress" : "expand"
|
|
141196
|
-
}, null, 8, ["icon"])
|
|
141197
|
-
]),
|
|
141198
|
-
_: 1
|
|
141199
|
-
})) : createCommentVNode("", true)
|
|
141200
|
-
])) : createCommentVNode("", true),
|
|
140968
|
+
return openBlock(), createElementBlock("div", _hoisted_1$24, [
|
|
141201
140969
|
createElementVNode("canvas", {
|
|
141202
140970
|
ref_key: "chartRef",
|
|
141203
140971
|
ref: chartRef,
|
|
141204
140972
|
class: "w-full h-full"
|
|
141205
140973
|
}, null, 512)
|
|
141206
|
-
]
|
|
140974
|
+
]);
|
|
141207
140975
|
};
|
|
141208
140976
|
}
|
|
141209
140977
|
});
|
|
141210
140978
|
|
|
141211
|
-
const RawDataCharts = /* @__PURE__ */ _export_sfc(_sfc_main$2F, [["__scopeId", "data-v-
|
|
141212
|
-
|
|
141213
|
-
const STANDALONE_CHART_TYPES = ["pie", "doughnut", "radar", "polarArea"];
|
|
141214
|
-
const MIXABLE_CHART_TYPES = ["bar", "line", "scatter", "bubble", "area"];
|
|
141215
|
-
const XY_CHART_TYPES = ["scatter", "bubble"];
|
|
140979
|
+
const RawDataCharts = /* @__PURE__ */ _export_sfc(_sfc_main$2F, [["__scopeId", "data-v-e71330a8"]]);
|
|
141216
140980
|
|
|
141217
140981
|
const _hoisted_1$23 = { class: "flex gap-4 h-[calc(80vh-120px)] w-full" };
|
|
141218
140982
|
const _hoisted_2$1t = { class: "cb-data-charts-settings__card overflow-auto flex-1" };
|
|
141219
140983
|
const _hoisted_3$17 = { class: "flex flex-col h-full" };
|
|
141220
140984
|
const _hoisted_4$X = { class: "flex-grow overflow-y-auto overflow-x-hidden" };
|
|
141221
|
-
const _hoisted_5$O = { class: "
|
|
141222
|
-
const _hoisted_6$H = { class: "
|
|
141223
|
-
const _hoisted_7$v =
|
|
141224
|
-
const _hoisted_8$q = { class: "
|
|
141225
|
-
const _hoisted_9$m =
|
|
141226
|
-
const _hoisted_10$h =
|
|
141227
|
-
const _hoisted_11$f = {
|
|
140985
|
+
const _hoisted_5$O = { class: "mb-4" };
|
|
140986
|
+
const _hoisted_6$H = { class: "block mb-2" };
|
|
140987
|
+
const _hoisted_7$v = { class: "mb-4" };
|
|
140988
|
+
const _hoisted_8$q = { class: "block mb-2" };
|
|
140989
|
+
const _hoisted_9$m = { class: "mb-4" };
|
|
140990
|
+
const _hoisted_10$h = { class: "block mb-2" };
|
|
140991
|
+
const _hoisted_11$f = { class: "mb-4" };
|
|
140992
|
+
const _hoisted_12$b = { class: "block mb-2" };
|
|
140993
|
+
const _hoisted_13$a = {
|
|
141228
140994
|
key: 0,
|
|
141229
140995
|
class: "mb-4"
|
|
141230
140996
|
};
|
|
141231
|
-
const _hoisted_12$b = { class: "block mb-2" };
|
|
141232
|
-
const _hoisted_13$a = { class: "mb-4" };
|
|
141233
140997
|
const _hoisted_14$9 = { class: "block mb-2" };
|
|
141234
140998
|
const _hoisted_15$8 = { class: "mb-4" };
|
|
141235
|
-
const _hoisted_16$8 = { class: "
|
|
141236
|
-
const _hoisted_17$7 = {
|
|
141237
|
-
|
|
141238
|
-
|
|
141239
|
-
|
|
141240
|
-
const
|
|
141241
|
-
const
|
|
141242
|
-
const
|
|
141243
|
-
const
|
|
140999
|
+
const _hoisted_16$8 = { class: "block mb-2" };
|
|
141000
|
+
const _hoisted_17$7 = {
|
|
141001
|
+
key: 1,
|
|
141002
|
+
class: "mb-4"
|
|
141003
|
+
};
|
|
141004
|
+
const _hoisted_18$6 = { class: "block mb-2" };
|
|
141005
|
+
const _hoisted_19$6 = { class: "mb-4" };
|
|
141006
|
+
const _hoisted_20$5 = { class: "flex justify-between items-center mb-2" };
|
|
141007
|
+
const _hoisted_21$5 = { class: "block" };
|
|
141008
|
+
const _hoisted_22$3 = { class: "flex gap-2 flex-1" };
|
|
141009
|
+
const _hoisted_23$3 = ["onClick"];
|
|
141010
|
+
const _hoisted_24$3 = { class: "p-4 min-w-[400px] max-h-[400px]" };
|
|
141011
|
+
const _hoisted_25$3 = { class: "flex gap-4 h-full" };
|
|
141012
|
+
const _hoisted_26$3 = { class: "flex-1 flex flex-col" };
|
|
141013
|
+
const _hoisted_27$3 = { class: "text-sm mb-2" };
|
|
141014
|
+
const _hoisted_28$3 = { class: "overflow-auto" };
|
|
141015
|
+
const _hoisted_29$3 = {
|
|
141244
141016
|
key: 0,
|
|
141245
141017
|
class: "flex-1 border-l pl-4"
|
|
141246
141018
|
};
|
|
141247
|
-
const
|
|
141248
|
-
const
|
|
141249
|
-
const
|
|
141250
|
-
const
|
|
141251
|
-
const
|
|
141252
|
-
const
|
|
141253
|
-
const
|
|
141254
|
-
const
|
|
141255
|
-
const
|
|
141256
|
-
const
|
|
141257
|
-
const
|
|
141019
|
+
const _hoisted_30$3 = { class: "text-sm font-medium mb-2" };
|
|
141020
|
+
const _hoisted_31$3 = { class: "flex flex-col gap-2" };
|
|
141021
|
+
const _hoisted_32$3 = { class: "block mb-1 text-sm" };
|
|
141022
|
+
const _hoisted_33$3 = { class: "block mb-1 text-sm" };
|
|
141023
|
+
const _hoisted_34$3 = ["onClick"];
|
|
141024
|
+
const _hoisted_35$3 = { class: "p-4 min-w-[400px] max-h-[400px]" };
|
|
141025
|
+
const _hoisted_36$3 = { class: "flex gap-4 h-full" };
|
|
141026
|
+
const _hoisted_37$3 = { class: "flex-1 flex flex-col" };
|
|
141027
|
+
const _hoisted_38$3 = { class: "text-sm mb-2" };
|
|
141028
|
+
const _hoisted_39$3 = { class: "overflow-auto" };
|
|
141029
|
+
const _hoisted_40$3 = {
|
|
141258
141030
|
key: 0,
|
|
141259
141031
|
class: "flex-1 border-l pl-4"
|
|
141260
141032
|
};
|
|
141261
|
-
const
|
|
141262
|
-
const
|
|
141263
|
-
const
|
|
141264
|
-
const
|
|
141265
|
-
const
|
|
141266
|
-
const
|
|
141267
|
-
const
|
|
141268
|
-
const
|
|
141269
|
-
const
|
|
141270
|
-
const _hoisted_45$3 = { class: "text-sm font-semibold mb-3 mt-6 text-gray-600 dark:text-gray-400 uppercase tracking-wide border-t border-gray-200 dark:border-gray-700 pt-6" };
|
|
141271
|
-
const _hoisted_46$3 = { class: "mb-4" };
|
|
141272
|
-
const _hoisted_47$3 = { class: "block mb-2" };
|
|
141273
|
-
const _hoisted_48$3 = { class: "mb-4" };
|
|
141274
|
-
const _hoisted_49$3 = { class: "block mb-2" };
|
|
141275
|
-
const _hoisted_50$3 = { class: "mb-4" };
|
|
141276
|
-
const _hoisted_51$2 = { class: "block mb-2" };
|
|
141277
|
-
const _hoisted_52$2 = { class: "mb-4" };
|
|
141278
|
-
const _hoisted_53$2 = { class: "block mb-2" };
|
|
141279
|
-
const _hoisted_54$1 = {
|
|
141280
|
-
key: 2,
|
|
141281
|
-
class: "mb-4"
|
|
141282
|
-
};
|
|
141283
|
-
const _hoisted_55$1 = { class: "block mb-2" };
|
|
141284
|
-
const _hoisted_56$1 = {
|
|
141285
|
-
key: 3,
|
|
141286
|
-
class: "mb-4"
|
|
141287
|
-
};
|
|
141288
|
-
const _hoisted_57$1 = { class: "block mb-2" };
|
|
141289
|
-
const _hoisted_58$1 = { class: "mb-4" };
|
|
141290
|
-
const _hoisted_59$1 = { class: "block mb-2" };
|
|
141291
|
-
const _hoisted_60$1 = { class: "mb-4" };
|
|
141292
|
-
const _hoisted_61$1 = { class: "block mb-2" };
|
|
141293
|
-
const _hoisted_62$1 = { class: "mb-4" };
|
|
141294
|
-
const _hoisted_63$1 = { class: "block mb-2" };
|
|
141295
|
-
const _hoisted_64$1 = { class: "flex items-center gap-2" };
|
|
141296
|
-
const _hoisted_65$1 = { class: "text-sm text-gray-500" };
|
|
141297
|
-
const _hoisted_66$1 = { class: "mb-4" };
|
|
141298
|
-
const _hoisted_67$1 = { class: "block mb-2" };
|
|
141299
|
-
const _hoisted_68$1 = { class: "flex flex-col gap-2" };
|
|
141300
|
-
const _hoisted_69 = { class: "flex items-center gap-2" };
|
|
141301
|
-
const _hoisted_70 = { class: "text-sm" };
|
|
141302
|
-
const _hoisted_71 = { class: "text-sm" };
|
|
141303
|
-
const _hoisted_72 = { class: "flex items-center gap-2" };
|
|
141304
|
-
const _hoisted_73 = { class: "text-sm" };
|
|
141305
|
-
const _hoisted_74 = { class: "mb-4" };
|
|
141306
|
-
const _hoisted_75 = { class: "block mb-2" };
|
|
141307
|
-
const _hoisted_76 = { class: "flex flex-col gap-3" };
|
|
141308
|
-
const _hoisted_77 = { class: "flex items-center gap-2" };
|
|
141309
|
-
const _hoisted_78 = { class: "text-sm w-16" };
|
|
141310
|
-
const _hoisted_79 = { class: "flex items-center gap-2" };
|
|
141311
|
-
const _hoisted_80 = { class: "text-sm w-16" };
|
|
141312
|
-
const _hoisted_81 = { class: "cb-data-charts-settings__preview flex-1 border-l border-[#eee] pl-4" };
|
|
141313
|
-
const _hoisted_82 = { class: "text-sm font-medium mb-4" };
|
|
141314
|
-
const _hoisted_83 = {
|
|
141033
|
+
const _hoisted_41$3 = { class: "flex flex-col gap-2" };
|
|
141034
|
+
const _hoisted_42$3 = { class: "flex justify-center mt-2" };
|
|
141035
|
+
const _hoisted_43$3 = { class: "mb-4" };
|
|
141036
|
+
const _hoisted_44$3 = { class: "block mb-2" };
|
|
141037
|
+
const _hoisted_45$3 = { class: "mb-4" };
|
|
141038
|
+
const _hoisted_46$3 = { class: "block mb-2" };
|
|
141039
|
+
const _hoisted_47$3 = { class: "cb-data-charts-settings__preview flex-1 border-l border-[#eee] pl-4" };
|
|
141040
|
+
const _hoisted_48$3 = { class: "text-sm font-medium mb-4" };
|
|
141041
|
+
const _hoisted_49$3 = {
|
|
141315
141042
|
class: "preview-container",
|
|
141316
141043
|
style: { "height": "300px" }
|
|
141317
141044
|
};
|
|
141318
|
-
const
|
|
141045
|
+
const _hoisted_50$3 = { class: "flex justify-between gap-4" };
|
|
141319
141046
|
const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
141320
141047
|
__name: "DataCharts.settings",
|
|
141321
141048
|
props: {
|
|
@@ -141329,84 +141056,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141329
141056
|
const { setComponentEditMode, updateNodeDataById } = useCanvas$1();
|
|
141330
141057
|
const { crmShape } = useCrmShape();
|
|
141331
141058
|
const { palette } = useCanvasTheme$1();
|
|
141332
|
-
|
|
141333
|
-
function generateSeriesId() {
|
|
141334
|
-
return `series_${Date.now()}_${seriesIdCounter++}`;
|
|
141335
|
-
}
|
|
141336
|
-
function convertSavedSeriesToRuntime(savedSeries) {
|
|
141337
|
-
return {
|
|
141338
|
-
id: savedSeries.id || generateSeriesId(),
|
|
141339
|
-
name: savedSeries.name || "Series 1",
|
|
141340
|
-
chartType: savedSeries.chart_type || "bar",
|
|
141341
|
-
dataPoints: (savedSeries.data_points || []).map((dp) => ({
|
|
141342
|
-
label: dp.label || "",
|
|
141343
|
-
value: dp.value || "",
|
|
141344
|
-
xValue: dp.x_value ?? "",
|
|
141345
|
-
yValue: dp.y_value ?? "",
|
|
141346
|
-
dynamicValue: dp.dynamic_value,
|
|
141347
|
-
dynamicXValue: dp.dynamic_x_value,
|
|
141348
|
-
dynamicYValue: dp.dynamic_y_value,
|
|
141349
|
-
arrayConfig: dp.array_config
|
|
141350
|
-
}))
|
|
141351
|
-
};
|
|
141352
|
-
}
|
|
141353
|
-
function convertLegacyToSeries() {
|
|
141354
|
-
const chartTypeValue = props.data?.type ?? props.data?._primary_chart_type ?? "bar";
|
|
141355
|
-
const dataPoints = props.data?.data_points && Array.isArray(props.data.data_points) ? props.data.data_points.map((dp) => ({
|
|
141356
|
-
label: dp.label,
|
|
141357
|
-
value: dp.value,
|
|
141358
|
-
xValue: dp.x_value ?? "",
|
|
141359
|
-
yValue: dp.y_value ?? "",
|
|
141360
|
-
dynamicValue: dp.dynamic_value,
|
|
141361
|
-
dynamicXValue: dp.dynamic_x_value,
|
|
141362
|
-
dynamicYValue: dp.dynamic_y_value,
|
|
141363
|
-
arrayConfig: dp.array_config
|
|
141364
|
-
})) : props.data?.data?.labels ? props.data.data.labels.map((label, index) => ({
|
|
141365
|
-
label: String(label),
|
|
141366
|
-
value: String(props.data?.data?.datasets?.[0]?.data?.[index] ?? 0),
|
|
141367
|
-
xValue: "",
|
|
141368
|
-
yValue: ""
|
|
141369
|
-
})) : [];
|
|
141370
|
-
return [
|
|
141371
|
-
{
|
|
141372
|
-
id: generateSeriesId(),
|
|
141373
|
-
name: t("canvasUI.canvasBuilder.dataCharts.series") + " 1",
|
|
141374
|
-
chartType: chartTypeValue,
|
|
141375
|
-
dataPoints
|
|
141376
|
-
}
|
|
141377
|
-
];
|
|
141378
|
-
}
|
|
141379
|
-
const seriesList = ref(
|
|
141380
|
-
props.data?.series && Array.isArray(props.data.series) && props.data.series.length > 0 ? props.data.series.map((s) => convertSavedSeriesToRuntime(s)) : convertLegacyToSeries()
|
|
141381
|
-
);
|
|
141382
|
-
const activeSeriesIndex = ref(0);
|
|
141383
|
-
const activeSeries = computed(() => seriesList.value[activeSeriesIndex.value]);
|
|
141384
|
-
const isActiveSeriesXYChart = computed(() => XY_CHART_TYPES.includes(activeSeries.value?.chartType));
|
|
141385
|
-
const isPrimaryStandalone = computed(() => STANDALONE_CHART_TYPES.includes(seriesList.value[0]?.chartType));
|
|
141386
|
-
const isMultiSeries = computed(() => seriesList.value.length > 1);
|
|
141387
|
-
const canAddSeries = computed(() => !isPrimaryStandalone.value);
|
|
141388
|
-
const availableChartTypeOptions = computed(() => {
|
|
141389
|
-
const allOptions = [
|
|
141390
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.bar"), value: "bar" },
|
|
141391
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.line"), value: "line" },
|
|
141392
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.pie"), value: "pie" },
|
|
141393
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.doughnut"), value: "doughnut" },
|
|
141394
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.polarArea"), value: "polarArea" },
|
|
141395
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.radar"), value: "radar" },
|
|
141396
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.scatter"), value: "scatter" },
|
|
141397
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.bubble"), value: "bubble" },
|
|
141398
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.types.area"), value: "area" }
|
|
141399
|
-
];
|
|
141400
|
-
if (activeSeriesIndex.value === 0 && seriesList.value.length > 1) {
|
|
141401
|
-
return allOptions.filter((opt) => MIXABLE_CHART_TYPES.includes(opt.value));
|
|
141402
|
-
}
|
|
141403
|
-
if (activeSeriesIndex.value > 0) {
|
|
141404
|
-
return allOptions.filter((opt) => MIXABLE_CHART_TYPES.includes(opt.value));
|
|
141405
|
-
}
|
|
141406
|
-
return allOptions;
|
|
141407
|
-
});
|
|
141408
|
-
const chartType = computed(() => seriesList.value[0]?.chartType ?? "bar");
|
|
141409
|
-
const primaryChartType = computed(() => seriesList.value[0]?.chartType ?? "bar");
|
|
141059
|
+
const chartType = ref(props.data?.type ?? "bar");
|
|
141410
141060
|
const backgroundColor = props.data?.data?.datasets?.[0]?.background_color;
|
|
141411
141061
|
const colorSchemeType = ref(props.data?.color_scheme_type ?? "theme");
|
|
141412
141062
|
const chartColors = ref([]);
|
|
@@ -141435,16 +141085,24 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141435
141085
|
const chartTitle = ref(props.data?.options?.plugins?.title?.text ?? "");
|
|
141436
141086
|
const legendPosition = ref(props.data?.options?.plugins?.legend?.position ?? "top");
|
|
141437
141087
|
const enableAnimation = ref((props.data?.options?.animation?.duration ?? 0) > 0);
|
|
141088
|
+
const dataPoints = ref(
|
|
141089
|
+
props.data?.data_points && Array.isArray(props.data.data_points) ? [...props.data.data_points] : props.data?.data?.labels ? props.data.data.labels.map((label, index) => ({
|
|
141090
|
+
label: String(label),
|
|
141091
|
+
value: String(props.data?.data?.datasets?.[0]?.data?.[index] ?? 0)
|
|
141092
|
+
})) : []
|
|
141093
|
+
);
|
|
141438
141094
|
const xAxisLabel = ref(props.data?.options?.scales?.x?.title?.text ?? "");
|
|
141439
141095
|
const yAxisLabel = ref(props.data?.options?.scales?.y?.title?.text ?? "");
|
|
141440
141096
|
const orientation = ref(props.data?.options?.index_axis ?? "x");
|
|
141441
141097
|
const pointStyle = ref(props.data?.data?.datasets?.[0]?.point_style ?? "circle");
|
|
141442
|
-
const
|
|
141443
|
-
|
|
141444
|
-
|
|
141445
|
-
|
|
141446
|
-
|
|
141447
|
-
|
|
141098
|
+
const chartTypeOptions = [
|
|
141099
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.types.bar"), value: "bar" },
|
|
141100
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.types.line"), value: "line" },
|
|
141101
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.types.pie"), value: "pie" },
|
|
141102
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.types.doughnut"), value: "doughnut" },
|
|
141103
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.types.polarArea"), value: "polarArea" },
|
|
141104
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.types.radar"), value: "radar" }
|
|
141105
|
+
];
|
|
141448
141106
|
const legendPositionOptions = [
|
|
141449
141107
|
{ label: t("canvasUI.canvasBuilder.dataCharts.legendPositions.none"), value: "none" },
|
|
141450
141108
|
{ label: t("canvasUI.canvasBuilder.dataCharts.legendPositions.top"), value: "top" },
|
|
@@ -141453,8 +141111,8 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141453
141111
|
{ label: t("canvasUI.canvasBuilder.dataCharts.legendPositions.right"), value: "right" }
|
|
141454
141112
|
];
|
|
141455
141113
|
const orientationOptions = [
|
|
141456
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.orientations.horizontal"), value: "
|
|
141457
|
-
{ label: t("canvasUI.canvasBuilder.dataCharts.orientations.vertical"), value: "
|
|
141114
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.orientations.horizontal"), value: "x" },
|
|
141115
|
+
{ label: t("canvasUI.canvasBuilder.dataCharts.orientations.vertical"), value: "y" }
|
|
141458
141116
|
];
|
|
141459
141117
|
const pointStyleOptions = [
|
|
141460
141118
|
{ label: t("canvasUI.canvasBuilder.dataCharts.pointStyles.circle"), value: "circle" },
|
|
@@ -141464,18 +141122,12 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141464
141122
|
{ label: t("canvasUI.canvasBuilder.dataCharts.pointStyles.star"), value: "star" },
|
|
141465
141123
|
{ label: t("canvasUI.canvasBuilder.dataCharts.pointStyles.triangle"), value: "triangle" }
|
|
141466
141124
|
];
|
|
141467
|
-
|
|
141468
|
-
|
|
141469
|
-
|
|
141470
|
-
|
|
141471
|
-
|
|
141472
|
-
|
|
141473
|
-
"--n-color-focus": themeVars.value.error2,
|
|
141474
|
-
"--n-color-hover": themeVars.value.error2,
|
|
141475
|
-
"--n-color-disabled": themeVars.value.error2,
|
|
141476
|
-
"--n-color-pressed": themeVars.value.error2
|
|
141477
|
-
}));
|
|
141478
|
-
const activePopoverField = ref(null);
|
|
141125
|
+
function getColors() {
|
|
141126
|
+
if (colorSchemeType.value === "theme") {
|
|
141127
|
+
return chartColors.value.map((index) => `palette${index}`);
|
|
141128
|
+
}
|
|
141129
|
+
return chartColors.value;
|
|
141130
|
+
}
|
|
141479
141131
|
function updateChartColors(newColors) {
|
|
141480
141132
|
if (colorSchemeType.value === "theme") {
|
|
141481
141133
|
chartColors.value = newColors.map((color, i) => {
|
|
@@ -141503,54 +141155,17 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141503
141155
|
}
|
|
141504
141156
|
}
|
|
141505
141157
|
);
|
|
141506
|
-
function closePopover() {
|
|
141507
|
-
activePopoverPoint.value = null;
|
|
141508
|
-
activePopoverField.value = null;
|
|
141509
|
-
}
|
|
141510
|
-
function addSeries() {
|
|
141511
|
-
if (!canAddSeries.value) return;
|
|
141512
|
-
const newIndex = seriesList.value.length;
|
|
141513
|
-
const newSeries = {
|
|
141514
|
-
id: generateSeriesId(),
|
|
141515
|
-
name: `${t("canvasUI.canvasBuilder.dataCharts.series")} ${newIndex + 1}`,
|
|
141516
|
-
chartType: seriesList.value[0].chartType,
|
|
141517
|
-
// Default to same type as first series
|
|
141518
|
-
dataPoints: []
|
|
141519
|
-
};
|
|
141520
|
-
seriesList.value.push(newSeries);
|
|
141521
|
-
activeSeriesIndex.value = newIndex;
|
|
141522
|
-
updatePreview();
|
|
141523
|
-
}
|
|
141524
|
-
function removeSeries(index) {
|
|
141525
|
-
if (index === 0 || index >= seriesList.value.length) return;
|
|
141526
|
-
seriesList.value.splice(index, 1);
|
|
141527
|
-
if (activeSeriesIndex.value >= seriesList.value.length) {
|
|
141528
|
-
activeSeriesIndex.value = seriesList.value.length - 1;
|
|
141529
|
-
}
|
|
141530
|
-
updatePreview();
|
|
141531
|
-
}
|
|
141532
|
-
function onChartTypeChange(newType) {
|
|
141533
|
-
if (activeSeriesIndex.value === 0 && STANDALONE_CHART_TYPES.includes(newType)) {
|
|
141534
|
-
seriesList.value = [seriesList.value[0]];
|
|
141535
|
-
}
|
|
141536
|
-
updatePreview();
|
|
141537
|
-
}
|
|
141538
141158
|
function addDataPoint() {
|
|
141539
|
-
|
|
141159
|
+
dataPoints.value.push({
|
|
141540
141160
|
label: "",
|
|
141541
|
-
xValue: "",
|
|
141542
|
-
yValue: "",
|
|
141543
141161
|
value: ""
|
|
141544
141162
|
});
|
|
141545
141163
|
}
|
|
141546
141164
|
function removeDataPoint(index) {
|
|
141547
|
-
|
|
141165
|
+
dataPoints.value.splice(index, 1);
|
|
141548
141166
|
}
|
|
141549
141167
|
function removeAllDataPoints() {
|
|
141550
|
-
|
|
141551
|
-
}
|
|
141552
|
-
function isArrayOrObject(value) {
|
|
141553
|
-
return Array.isArray(value) || typeof value === "object" && value !== null;
|
|
141168
|
+
dataPoints.value = [];
|
|
141554
141169
|
}
|
|
141555
141170
|
function getFieldOptions(data) {
|
|
141556
141171
|
if (!data || typeof data !== "object") return [];
|
|
@@ -141561,43 +141176,6 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141561
141176
|
value: field
|
|
141562
141177
|
}));
|
|
141563
141178
|
}
|
|
141564
|
-
function updateDynamicValueExpression(point) {
|
|
141565
|
-
if (!point.selectedValue || !point.arrayConfig?.labelField || !point.arrayConfig?.valueField) {
|
|
141566
|
-
return;
|
|
141567
|
-
}
|
|
141568
|
-
const path = point.dynamicValue?.path;
|
|
141569
|
-
if (!path) {
|
|
141570
|
-
return;
|
|
141571
|
-
}
|
|
141572
|
-
point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141573
|
-
point.value = `{{#each ${path}}}{{lookup this "${point.arrayConfig.valueField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141574
|
-
point.dynamicValue = {
|
|
141575
|
-
path,
|
|
141576
|
-
value: point.value
|
|
141577
|
-
};
|
|
141578
|
-
closePopover();
|
|
141579
|
-
}
|
|
141580
|
-
function updateXYDynamicValueExpression(point) {
|
|
141581
|
-
if (!point.selectedXValue || !point.arrayConfig?.labelField || !point.arrayConfig?.xField || !point.arrayConfig?.yField) {
|
|
141582
|
-
return;
|
|
141583
|
-
}
|
|
141584
|
-
const path = point.dynamicXValue?.path;
|
|
141585
|
-
if (!path) {
|
|
141586
|
-
return;
|
|
141587
|
-
}
|
|
141588
|
-
point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141589
|
-
point.xValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.xField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141590
|
-
point.yValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.yField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141591
|
-
point.dynamicXValue = {
|
|
141592
|
-
path,
|
|
141593
|
-
value: point.xValue
|
|
141594
|
-
};
|
|
141595
|
-
point.dynamicYValue = {
|
|
141596
|
-
path,
|
|
141597
|
-
value: point.yValue
|
|
141598
|
-
};
|
|
141599
|
-
closePopover();
|
|
141600
|
-
}
|
|
141601
141179
|
const dynamicValueTreeData = computed(() => {
|
|
141602
141180
|
function processObject(obj, path = []) {
|
|
141603
141181
|
const result = [];
|
|
@@ -141648,49 +141226,24 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141648
141226
|
return h("span", { class: "text-sm" }, { default: () => info.option.label || "" });
|
|
141649
141227
|
}
|
|
141650
141228
|
const activePopoverPoint = ref(null);
|
|
141651
|
-
function handleDynamicValueClick(point
|
|
141652
|
-
if (activePopoverPoint.value === point
|
|
141653
|
-
|
|
141229
|
+
function handleDynamicValueClick(point) {
|
|
141230
|
+
if (activePopoverPoint.value === point) {
|
|
141231
|
+
activePopoverPoint.value = null;
|
|
141654
141232
|
} else {
|
|
141655
|
-
|
|
141656
|
-
|
|
141657
|
-
|
|
141658
|
-
|
|
141659
|
-
point.value = "";
|
|
141660
|
-
} else if (field === "x") {
|
|
141661
|
-
point.selectedXValue = void 0;
|
|
141662
|
-
point.dynamicXValue = void 0;
|
|
141663
|
-
point.dynamicYValue = void 0;
|
|
141664
|
-
point.arrayConfig = void 0;
|
|
141665
|
-
point.xValue = "";
|
|
141666
|
-
point.yValue = "";
|
|
141667
|
-
point.label = "";
|
|
141668
|
-
} else if (field === "y") {
|
|
141669
|
-
point.selectedYValue = void 0;
|
|
141670
|
-
point.dynamicYValue = void 0;
|
|
141671
|
-
point.yValue = "";
|
|
141672
|
-
}
|
|
141233
|
+
point.selectedValue = void 0;
|
|
141234
|
+
point.dynamicValue = void 0;
|
|
141235
|
+
point.arrayConfig = void 0;
|
|
141236
|
+
point.value = "";
|
|
141673
141237
|
activePopoverPoint.value = point;
|
|
141674
|
-
activePopoverField.value = field;
|
|
141675
141238
|
}
|
|
141676
141239
|
}
|
|
141677
|
-
function handleDynamicValueSelect(keys, point
|
|
141240
|
+
function handleDynamicValueSelect(keys, point) {
|
|
141678
141241
|
const selectedKey = keys[0];
|
|
141679
141242
|
if (!selectedKey) {
|
|
141680
|
-
|
|
141681
|
-
|
|
141682
|
-
|
|
141683
|
-
|
|
141684
|
-
} else if (field === "x") {
|
|
141685
|
-
point.dynamicXValue = void 0;
|
|
141686
|
-
point.selectedXValue = void 0;
|
|
141687
|
-
point.xValue = "";
|
|
141688
|
-
} else if (field === "y") {
|
|
141689
|
-
point.dynamicYValue = void 0;
|
|
141690
|
-
point.selectedYValue = void 0;
|
|
141691
|
-
point.yValue = "";
|
|
141692
|
-
}
|
|
141693
|
-
closePopover();
|
|
141243
|
+
point.dynamicValue = void 0;
|
|
141244
|
+
point.selectedValue = void 0;
|
|
141245
|
+
point.value = "";
|
|
141246
|
+
activePopoverPoint.value = null;
|
|
141694
141247
|
return;
|
|
141695
141248
|
}
|
|
141696
141249
|
const pathParts = selectedKey.split(/\.(?![^[]*])/) || [];
|
|
@@ -141705,59 +141258,6 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141705
141258
|
currentValue = currentValue?.[part];
|
|
141706
141259
|
}
|
|
141707
141260
|
}
|
|
141708
|
-
if (field === "x") {
|
|
141709
|
-
point.selectedXValue = currentValue;
|
|
141710
|
-
if (Array.isArray(currentValue) || typeof currentValue === "object" && currentValue !== null) {
|
|
141711
|
-
point.arrayConfig = {
|
|
141712
|
-
labelField: "",
|
|
141713
|
-
valueField: "",
|
|
141714
|
-
xField: "",
|
|
141715
|
-
yField: ""
|
|
141716
|
-
};
|
|
141717
|
-
point.dynamicXValue = {
|
|
141718
|
-
path: selectedKey,
|
|
141719
|
-
value: ""
|
|
141720
|
-
};
|
|
141721
|
-
return;
|
|
141722
|
-
}
|
|
141723
|
-
const rootPart = pathParts[0];
|
|
141724
|
-
let expression = "";
|
|
141725
|
-
if (pathParts.length === 1) {
|
|
141726
|
-
expression = `{{${rootPart}}}`;
|
|
141727
|
-
} else {
|
|
141728
|
-
const restOfPath = pathParts.slice(1).map((part) => {
|
|
141729
|
-
if (part.includes("[") && part.includes("]")) {
|
|
141730
|
-
return part.split("[")[1].split("]")[0];
|
|
141731
|
-
}
|
|
141732
|
-
return part;
|
|
141733
|
-
});
|
|
141734
|
-
expression = `{{lookup (lookup ${rootPart} ${restOfPath[0]}) "${restOfPath[1]}"}}`;
|
|
141735
|
-
}
|
|
141736
|
-
point.dynamicXValue = { path: selectedKey, value: expression };
|
|
141737
|
-
point.xValue = expression;
|
|
141738
|
-
closePopover();
|
|
141739
|
-
return;
|
|
141740
|
-
}
|
|
141741
|
-
if (field === "y") {
|
|
141742
|
-
point.selectedYValue = currentValue;
|
|
141743
|
-
const rootPart = pathParts[0];
|
|
141744
|
-
let expression = "";
|
|
141745
|
-
if (pathParts.length === 1) {
|
|
141746
|
-
expression = `{{${rootPart}}}`;
|
|
141747
|
-
} else {
|
|
141748
|
-
const restOfPath = pathParts.slice(1).map((part) => {
|
|
141749
|
-
if (part.includes("[") && part.includes("]")) {
|
|
141750
|
-
return part.split("[")[1].split("]")[0];
|
|
141751
|
-
}
|
|
141752
|
-
return part;
|
|
141753
|
-
});
|
|
141754
|
-
expression = `{{lookup (lookup ${rootPart} ${restOfPath[0]}) "${restOfPath[1]}"}}`;
|
|
141755
|
-
}
|
|
141756
|
-
point.dynamicYValue = { path: selectedKey, value: expression };
|
|
141757
|
-
point.yValue = expression;
|
|
141758
|
-
closePopover();
|
|
141759
|
-
return;
|
|
141760
|
-
}
|
|
141761
141261
|
point.selectedValue = currentValue;
|
|
141762
141262
|
if (Array.isArray(currentValue) || typeof currentValue === "object" && currentValue !== null) {
|
|
141763
141263
|
point.arrayConfig = {
|
|
@@ -141787,160 +141287,79 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141787
141287
|
value: expression
|
|
141788
141288
|
};
|
|
141789
141289
|
point.value = expression;
|
|
141790
|
-
|
|
141290
|
+
activePopoverPoint.value = null;
|
|
141791
141291
|
}
|
|
141792
141292
|
}
|
|
141793
|
-
function
|
|
141794
|
-
|
|
141795
|
-
|
|
141796
|
-
|
|
141797
|
-
|
|
141798
|
-
|
|
141799
|
-
|
|
141800
|
-
series.dataPoints.forEach((point) => {
|
|
141801
|
-
const x = !isNaN(Number(point.xValue)) ? Number(point.xValue) : 0;
|
|
141802
|
-
const y = !isNaN(Number(point.yValue)) ? Number(point.yValue) : 0;
|
|
141803
|
-
processedData2.labels.push(point.label);
|
|
141804
|
-
if (series.chartType === "bubble") {
|
|
141805
|
-
processedData2.values.push({ x, y, r: Math.max(5, Math.abs(y) / 2) });
|
|
141806
|
-
} else {
|
|
141807
|
-
processedData2.values.push({ x, y });
|
|
141808
|
-
}
|
|
141809
|
-
});
|
|
141810
|
-
return processedData2;
|
|
141293
|
+
function updateDynamicValueExpression(point) {
|
|
141294
|
+
if (!point.selectedValue || !point.arrayConfig?.labelField || !point.arrayConfig?.valueField) {
|
|
141295
|
+
return;
|
|
141296
|
+
}
|
|
141297
|
+
const path = point.dynamicValue?.path;
|
|
141298
|
+
if (!path) {
|
|
141299
|
+
return;
|
|
141811
141300
|
}
|
|
141301
|
+
point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141302
|
+
point.value = `{{#each ${path}}}{{lookup this "${point.arrayConfig.valueField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
|
|
141303
|
+
point.dynamicValue = {
|
|
141304
|
+
path,
|
|
141305
|
+
value: point.value
|
|
141306
|
+
};
|
|
141307
|
+
activePopoverPoint.value = null;
|
|
141308
|
+
}
|
|
141309
|
+
function processChartData() {
|
|
141812
141310
|
const processedData = {
|
|
141813
141311
|
labels: [],
|
|
141814
141312
|
values: []
|
|
141815
141313
|
};
|
|
141816
|
-
|
|
141314
|
+
dataPoints.value.forEach((point) => {
|
|
141817
141315
|
processedData.labels.push(point.label);
|
|
141818
141316
|
processedData.values.push(!isNaN(Number(point.value)) ? Number(point.value) : 0);
|
|
141819
141317
|
});
|
|
141820
141318
|
return processedData;
|
|
141821
141319
|
}
|
|
141822
|
-
function getSeriesColors(forStorage = false) {
|
|
141823
|
-
if (colorSchemeType.value === "theme") {
|
|
141824
|
-
if (forStorage) {
|
|
141825
|
-
return chartColors.value.map((index) => `palette${index}`);
|
|
141826
|
-
}
|
|
141827
|
-
return chartColors.value.map((index) => {
|
|
141828
|
-
const idx = parseInt(index);
|
|
141829
|
-
return palette.value[idx % palette.value.length];
|
|
141830
|
-
});
|
|
141831
|
-
}
|
|
141832
|
-
return chartColors.value;
|
|
141833
|
-
}
|
|
141834
141320
|
function createChartConfig() {
|
|
141835
|
-
const datasets = [];
|
|
141836
|
-
let allLabels = [];
|
|
141837
|
-
const colorsForStorage = getSeriesColors(true);
|
|
141838
|
-
const isSingleSeries = seriesList.value.length === 1;
|
|
141839
|
-
seriesList.value.forEach((series, index) => {
|
|
141840
|
-
const processedData = processSeriesData(series);
|
|
141841
|
-
let backgroundColor2;
|
|
141842
|
-
let borderColor;
|
|
141843
|
-
if (isSingleSeries) {
|
|
141844
|
-
backgroundColor2 = colorsForStorage;
|
|
141845
|
-
borderColor = [...colorsForStorage];
|
|
141846
|
-
} else {
|
|
141847
|
-
const seriesColor = colorsForStorage[index % colorsForStorage.length];
|
|
141848
|
-
backgroundColor2 = seriesColor;
|
|
141849
|
-
borderColor = seriesColor;
|
|
141850
|
-
}
|
|
141851
|
-
const datasetOptions = {
|
|
141852
|
-
label: series.name,
|
|
141853
|
-
data: processedData.values,
|
|
141854
|
-
background_color: backgroundColor2,
|
|
141855
|
-
border_color: borderColor,
|
|
141856
|
-
borderWidth: 1
|
|
141857
|
-
};
|
|
141858
|
-
if (!isSingleSeries) {
|
|
141859
|
-
if (series.chartType === "area") {
|
|
141860
|
-
datasetOptions.type = "line";
|
|
141861
|
-
datasetOptions.fill = true;
|
|
141862
|
-
datasetOptions.tension = 0.4;
|
|
141863
|
-
} else {
|
|
141864
|
-
datasetOptions.type = series.chartType;
|
|
141865
|
-
}
|
|
141866
|
-
}
|
|
141867
|
-
if (series.chartType === "area") {
|
|
141868
|
-
datasetOptions.fill = true;
|
|
141869
|
-
datasetOptions.tension = 0.4;
|
|
141870
|
-
}
|
|
141871
|
-
if (["line", "scatter", "area"].includes(series.chartType)) {
|
|
141872
|
-
datasetOptions.pointStyle = pointStyle.value;
|
|
141873
|
-
}
|
|
141874
|
-
if (["line", "area"].includes(series.chartType)) {
|
|
141875
|
-
datasetOptions.tension = 0.4;
|
|
141876
|
-
}
|
|
141877
|
-
if (processedData.labels.length > allLabels.length) {
|
|
141878
|
-
allLabels = processedData.labels;
|
|
141879
|
-
}
|
|
141880
|
-
datasets.push(datasetOptions);
|
|
141881
|
-
});
|
|
141882
|
-
const primaryType = seriesList.value[0].chartType;
|
|
141883
|
-
let actualPrimaryType = primaryType;
|
|
141884
|
-
if (primaryType === "area") {
|
|
141885
|
-
actualPrimaryType = "line";
|
|
141886
|
-
}
|
|
141887
|
-
let scales = void 0;
|
|
141888
|
-
const chartTypesWithScales = ["bar", "line", "scatter", "bubble", "area"];
|
|
141889
|
-
if (chartTypesWithScales.includes(primaryType)) {
|
|
141890
|
-
scales = {
|
|
141891
|
-
x: {
|
|
141892
|
-
title: {
|
|
141893
|
-
display: !!xAxisLabel.value,
|
|
141894
|
-
text: xAxisLabel.value
|
|
141895
|
-
}
|
|
141896
|
-
},
|
|
141897
|
-
y: {
|
|
141898
|
-
title: {
|
|
141899
|
-
display: !!yAxisLabel.value,
|
|
141900
|
-
text: yAxisLabel.value
|
|
141901
|
-
},
|
|
141902
|
-
begin_at_zero: true
|
|
141903
|
-
}
|
|
141904
|
-
};
|
|
141905
|
-
} else if (["radar", "polarArea"].includes(primaryType)) {
|
|
141906
|
-
scales = {
|
|
141907
|
-
r: {
|
|
141908
|
-
begin_at_zero: true,
|
|
141909
|
-
ticks: {
|
|
141910
|
-
step_size: 1
|
|
141911
|
-
}
|
|
141912
|
-
}
|
|
141913
|
-
};
|
|
141914
|
-
}
|
|
141915
|
-
const showLegend = seriesList.value.length > 1 || legendPosition.value !== "none";
|
|
141916
141321
|
const config = {
|
|
141917
|
-
type:
|
|
141322
|
+
type: chartType.value,
|
|
141918
141323
|
color_scheme_type: colorSchemeType.value,
|
|
141919
|
-
percent_display: percentDisplay.value,
|
|
141920
|
-
chart_height: chartHeight.value,
|
|
141921
|
-
chart_width: chartWidth.value,
|
|
141922
|
-
view_controls: {
|
|
141923
|
-
enable_fullscreen_btn: enableFullscreenBtn.value,
|
|
141924
|
-
enable_chart_type_switcher: enableChartTypeSwitcher.value,
|
|
141925
|
-
enable_data_entry: enableDataEntry.value
|
|
141926
|
-
},
|
|
141927
141324
|
data: {
|
|
141928
|
-
labels:
|
|
141929
|
-
datasets
|
|
141325
|
+
labels: [],
|
|
141326
|
+
datasets: [
|
|
141327
|
+
{
|
|
141328
|
+
label: "Data Series",
|
|
141329
|
+
data: [],
|
|
141330
|
+
background_color: getColors(),
|
|
141331
|
+
border_color: getColors(),
|
|
141332
|
+
border_width: 1,
|
|
141333
|
+
point_style: ["line"].includes(chartType.value) ? pointStyle.value : void 0
|
|
141334
|
+
}
|
|
141335
|
+
]
|
|
141930
141336
|
},
|
|
141931
141337
|
options: {
|
|
141932
141338
|
responsive: true,
|
|
141933
141339
|
maintainAspectRatio: false,
|
|
141934
|
-
index_axis: ["bar", "line"].includes(
|
|
141935
|
-
scales,
|
|
141340
|
+
index_axis: ["bar", "line"].includes(chartType.value) ? orientation.value : void 0,
|
|
141341
|
+
scales: ["bar", "line"].includes(chartType.value) ? {
|
|
141342
|
+
x: {
|
|
141343
|
+
title: {
|
|
141344
|
+
display: !!xAxisLabel.value,
|
|
141345
|
+
text: xAxisLabel.value
|
|
141346
|
+
}
|
|
141347
|
+
},
|
|
141348
|
+
y: {
|
|
141349
|
+
title: {
|
|
141350
|
+
display: !!yAxisLabel.value,
|
|
141351
|
+
text: yAxisLabel.value
|
|
141352
|
+
}
|
|
141353
|
+
}
|
|
141354
|
+
} : void 0,
|
|
141936
141355
|
plugins: {
|
|
141937
141356
|
title: {
|
|
141938
141357
|
display: !!chartTitle.value,
|
|
141939
141358
|
text: chartTitle.value
|
|
141940
141359
|
},
|
|
141941
141360
|
legend: {
|
|
141942
|
-
display:
|
|
141943
|
-
position: legendPosition.value
|
|
141361
|
+
display: legendPosition.value !== "none",
|
|
141362
|
+
position: legendPosition.value,
|
|
141944
141363
|
labels: {
|
|
141945
141364
|
usePointStyle: true
|
|
141946
141365
|
}
|
|
@@ -141950,25 +141369,14 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141950
141369
|
duration: enableAnimation.value ? 1e3 : 0
|
|
141951
141370
|
}
|
|
141952
141371
|
},
|
|
141953
|
-
|
|
141954
|
-
|
|
141955
|
-
|
|
141956
|
-
|
|
141957
|
-
chart_type: series.chartType,
|
|
141958
|
-
data_points: series.dataPoints.map((point) => ({
|
|
141959
|
-
label: point.label,
|
|
141960
|
-
value: point.value,
|
|
141961
|
-
x_value: point.xValue,
|
|
141962
|
-
y_value: point.yValue,
|
|
141963
|
-
dynamic_value: point.dynamicValue,
|
|
141964
|
-
dynamic_x_value: point.dynamicXValue,
|
|
141965
|
-
dynamic_y_value: point.dynamicYValue,
|
|
141966
|
-
array_config: point.arrayConfig
|
|
141967
|
-
}))
|
|
141968
|
-
})),
|
|
141969
|
-
// Store the primary chart type for reference
|
|
141970
|
-
_primary_chart_type: primaryType
|
|
141372
|
+
data_points: dataPoints.value.map((point) => ({
|
|
141373
|
+
label: point.label,
|
|
141374
|
+
value: point.value
|
|
141375
|
+
}))
|
|
141971
141376
|
};
|
|
141377
|
+
const processedData = processChartData();
|
|
141378
|
+
config.data.labels = processedData.labels;
|
|
141379
|
+
config.data.datasets[0].data = processedData.values;
|
|
141972
141380
|
return config;
|
|
141973
141381
|
}
|
|
141974
141382
|
function onCancel() {
|
|
@@ -141996,14 +141404,9 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
141996
141404
|
},
|
|
141997
141405
|
{ immediate: true }
|
|
141998
141406
|
);
|
|
141999
|
-
watch(isMultiSeries, (multiSeries) => {
|
|
142000
|
-
if (multiSeries) {
|
|
142001
|
-
enableChartTypeSwitcher.value = false;
|
|
142002
|
-
}
|
|
142003
|
-
});
|
|
142004
141407
|
watch(
|
|
142005
141408
|
[
|
|
142006
|
-
|
|
141409
|
+
chartType,
|
|
142007
141410
|
chartColors,
|
|
142008
141411
|
colorSchemeType,
|
|
142009
141412
|
chartTitle,
|
|
@@ -142012,13 +141415,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142012
141415
|
yAxisLabel,
|
|
142013
141416
|
orientation,
|
|
142014
141417
|
pointStyle,
|
|
142015
|
-
|
|
142016
|
-
enableAnimation,
|
|
142017
|
-
enableFullscreenBtn,
|
|
142018
|
-
enableChartTypeSwitcher,
|
|
142019
|
-
enableDataEntry,
|
|
142020
|
-
chartHeight,
|
|
142021
|
-
chartWidth
|
|
141418
|
+
dataPoints
|
|
142022
141419
|
],
|
|
142023
141420
|
() => {
|
|
142024
141421
|
updatePreview();
|
|
@@ -142044,10 +141441,10 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142044
141441
|
"--n-padding-left": "16px"
|
|
142045
141442
|
}]),
|
|
142046
141443
|
title: unref(t)("canvasUI.canvasBuilder.dataCharts.editDataChartsComponent"),
|
|
142047
|
-
onClose: _cache[
|
|
141444
|
+
onClose: _cache[11] || (_cache[11] = ($event) => unref(setComponentEditMode)(false))
|
|
142048
141445
|
}, {
|
|
142049
141446
|
footer: withCtx(() => [
|
|
142050
|
-
createElementVNode("div",
|
|
141447
|
+
createElementVNode("div", _hoisted_50$3, [
|
|
142051
141448
|
createVNode(CButton, { onClick: onCancel }, {
|
|
142052
141449
|
default: withCtx(() => [
|
|
142053
141450
|
createTextVNode(toDisplayString(unref(t)("canvasUI.common.cancel")), 1)
|
|
@@ -142085,66 +141482,69 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142085
141482
|
createElementVNode("div", _hoisted_2$1t, [
|
|
142086
141483
|
createElementVNode("div", _hoisted_3$17, [
|
|
142087
141484
|
createElementVNode("div", _hoisted_4$X, [
|
|
142088
|
-
createElementVNode("div", _hoisted_5$O,
|
|
142089
|
-
|
|
142090
|
-
(
|
|
142091
|
-
|
|
142092
|
-
|
|
142093
|
-
|
|
142094
|
-
|
|
142095
|
-
]]),
|
|
142096
|
-
onClick: ($event) => activeSeriesIndex.value = index
|
|
142097
|
-
}, [
|
|
142098
|
-
createElementVNode("span", _hoisted_8$q, toDisplayString(series.name), 1),
|
|
142099
|
-
index > 0 ? (openBlock(), createElementBlock("div", {
|
|
142100
|
-
key: 0,
|
|
142101
|
-
class: "ml-1 p-0.5 rounded hover:bg-gray-300 dark:hover:bg-gray-600",
|
|
142102
|
-
onClick: withModifiers(($event) => removeSeries(index), ["stop"])
|
|
142103
|
-
}, [
|
|
142104
|
-
createVNode(CIcon, {
|
|
142105
|
-
class: "text-gray-500",
|
|
142106
|
-
icon: "times",
|
|
142107
|
-
size: 10
|
|
142108
|
-
})
|
|
142109
|
-
], 8, _hoisted_9$m)) : createCommentVNode("", true)
|
|
142110
|
-
], 10, _hoisted_7$v);
|
|
142111
|
-
}), 128)),
|
|
142112
|
-
canAddSeries.value ? (openBlock(), createElementBlock("button", {
|
|
142113
|
-
key: 0,
|
|
142114
|
-
class: "flex items-center justify-center w-8 h-8 mb-1 rounded bg-transparent border-none hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors cursor-pointer",
|
|
142115
|
-
title: unref(t)("canvasUI.canvasBuilder.dataCharts.addSeries"),
|
|
142116
|
-
onClick: addSeries
|
|
142117
|
-
}, [
|
|
142118
|
-
createVNode(CIcon, {
|
|
142119
|
-
icon: "plus",
|
|
142120
|
-
size: 14
|
|
142121
|
-
})
|
|
142122
|
-
], 8, _hoisted_10$h)) : createCommentVNode("", true)
|
|
141485
|
+
createElementVNode("div", _hoisted_5$O, [
|
|
141486
|
+
createElementVNode("label", _hoisted_6$H, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartType")), 1),
|
|
141487
|
+
createVNode(unref(NSelect), {
|
|
141488
|
+
value: chartType.value,
|
|
141489
|
+
"onUpdate:value": _cache[0] || (_cache[0] = ($event) => chartType.value = $event),
|
|
141490
|
+
options: chartTypeOptions
|
|
141491
|
+
}, null, 8, ["value"])
|
|
142123
141492
|
]),
|
|
142124
|
-
|
|
142125
|
-
createElementVNode("
|
|
141493
|
+
["bar", "line"].includes(chartType.value) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
141494
|
+
createElementVNode("div", _hoisted_7$v, [
|
|
141495
|
+
createElementVNode("label", _hoisted_8$q, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.xAxisLabel")), 1),
|
|
141496
|
+
createVNode(unref(NInput), {
|
|
141497
|
+
value: xAxisLabel.value,
|
|
141498
|
+
"onUpdate:value": _cache[1] || (_cache[1] = ($event) => xAxisLabel.value = $event),
|
|
141499
|
+
type: "text"
|
|
141500
|
+
}, null, 8, ["value"])
|
|
141501
|
+
]),
|
|
141502
|
+
createElementVNode("div", _hoisted_9$m, [
|
|
141503
|
+
createElementVNode("label", _hoisted_10$h, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yAxisLabel")), 1),
|
|
141504
|
+
createVNode(unref(NInput), {
|
|
141505
|
+
value: yAxisLabel.value,
|
|
141506
|
+
"onUpdate:value": _cache[2] || (_cache[2] = ($event) => yAxisLabel.value = $event),
|
|
141507
|
+
type: "text"
|
|
141508
|
+
}, null, 8, ["value"])
|
|
141509
|
+
]),
|
|
141510
|
+
createElementVNode("div", _hoisted_11$f, [
|
|
141511
|
+
createElementVNode("label", _hoisted_12$b, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.orientation")), 1),
|
|
141512
|
+
createVNode(unref(NSelect), {
|
|
141513
|
+
value: orientation.value,
|
|
141514
|
+
"onUpdate:value": _cache[3] || (_cache[3] = ($event) => orientation.value = $event),
|
|
141515
|
+
options: orientationOptions
|
|
141516
|
+
}, null, 8, ["value"])
|
|
141517
|
+
]),
|
|
141518
|
+
["line", "radar"].includes(chartType.value) ? (openBlock(), createElementBlock("div", _hoisted_13$a, [
|
|
141519
|
+
createElementVNode("label", _hoisted_14$9, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.pointStyle")), 1),
|
|
141520
|
+
createVNode(unref(NSelect), {
|
|
141521
|
+
value: pointStyle.value,
|
|
141522
|
+
"onUpdate:value": _cache[4] || (_cache[4] = ($event) => pointStyle.value = $event),
|
|
141523
|
+
options: pointStyleOptions
|
|
141524
|
+
}, null, 8, ["value"])
|
|
141525
|
+
])) : createCommentVNode("", true)
|
|
141526
|
+
], 64)) : createCommentVNode("", true),
|
|
141527
|
+
createElementVNode("div", _hoisted_15$8, [
|
|
141528
|
+
createElementVNode("label", _hoisted_16$8, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartTitle")), 1),
|
|
142126
141529
|
createVNode(unref(NInput), {
|
|
142127
|
-
value:
|
|
142128
|
-
"onUpdate:value": _cache[
|
|
141530
|
+
value: chartTitle.value,
|
|
141531
|
+
"onUpdate:value": _cache[5] || (_cache[5] = ($event) => chartTitle.value = $event),
|
|
142129
141532
|
type: "text"
|
|
142130
141533
|
}, null, 8, ["value"])
|
|
142131
|
-
])) : createCommentVNode("", true),
|
|
142132
|
-
createElementVNode("div", _hoisted_13$a, [
|
|
142133
|
-
createElementVNode("label", _hoisted_14$9, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartType")), 1),
|
|
142134
|
-
createVNode(unref(NSelect), {
|
|
142135
|
-
value: activeSeries.value.chartType,
|
|
142136
|
-
"onUpdate:value": [
|
|
142137
|
-
_cache[1] || (_cache[1] = ($event) => activeSeries.value.chartType = $event),
|
|
142138
|
-
onChartTypeChange
|
|
142139
|
-
],
|
|
142140
|
-
options: availableChartTypeOptions.value
|
|
142141
|
-
}, null, 8, ["value", "options"])
|
|
142142
141534
|
]),
|
|
142143
|
-
|
|
142144
|
-
createElementVNode("
|
|
142145
|
-
|
|
141535
|
+
["pie", "doughnut", "polarArea"].includes(chartType.value) ? (openBlock(), createElementBlock("div", _hoisted_17$7, [
|
|
141536
|
+
createElementVNode("label", _hoisted_18$6, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.legendPosition")), 1),
|
|
141537
|
+
createVNode(unref(NSelect), {
|
|
141538
|
+
value: legendPosition.value,
|
|
141539
|
+
"onUpdate:value": _cache[6] || (_cache[6] = ($event) => legendPosition.value = $event),
|
|
141540
|
+
options: legendPositionOptions
|
|
141541
|
+
}, null, 8, ["value"])
|
|
141542
|
+
])) : createCommentVNode("", true),
|
|
141543
|
+
createElementVNode("div", _hoisted_19$6, [
|
|
141544
|
+
createElementVNode("div", _hoisted_20$5, [
|
|
141545
|
+
createElementVNode("label", _hoisted_21$5, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.dataPoints")), 1),
|
|
142146
141546
|
createVNode(unref(Button), {
|
|
142147
|
-
disabled: !
|
|
141547
|
+
disabled: !dataPoints.value.length,
|
|
142148
141548
|
size: "small",
|
|
142149
141549
|
onClick: removeAllDataPoints
|
|
142150
141550
|
}, {
|
|
@@ -142154,248 +141554,205 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142154
141554
|
_: 1
|
|
142155
141555
|
}, 8, ["disabled"])
|
|
142156
141556
|
]),
|
|
142157
|
-
|
|
141557
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(dataPoints.value, (point, index) => {
|
|
142158
141558
|
return openBlock(), createElementBlock("div", {
|
|
142159
141559
|
key: index,
|
|
142160
141560
|
class: "flex gap-2 mb-2"
|
|
142161
141561
|
}, [
|
|
142162
|
-
|
|
142163
|
-
|
|
142164
|
-
|
|
142165
|
-
class: "flex-1",
|
|
142166
|
-
disabled: !!point.arrayConfig,
|
|
142167
|
-
placeholder: "Label"
|
|
142168
|
-
}, null, 8, ["value", "onUpdate:value", "disabled"]),
|
|
142169
|
-
createVNode(unref(NInput), {
|
|
142170
|
-
value: point.value,
|
|
142171
|
-
"onUpdate:value": ($event) => point.value = $event,
|
|
142172
|
-
class: "flex-1",
|
|
142173
|
-
disabled: !!point.dynamicValue,
|
|
142174
|
-
placeholder: "Value",
|
|
142175
|
-
type: "text"
|
|
141562
|
+
point.selectedValue && (Array.isArray(point.selectedValue) || typeof point.selectedValue === "object" && point.selectedValue !== null) ? (openBlock(), createBlock(unref(NTooltip), {
|
|
141563
|
+
key: 0,
|
|
141564
|
+
trigger: "hover"
|
|
142176
141565
|
}, {
|
|
142177
|
-
|
|
142178
|
-
createVNode(unref(
|
|
142179
|
-
|
|
142180
|
-
|
|
142181
|
-
|
|
142182
|
-
|
|
142183
|
-
|
|
142184
|
-
|
|
142185
|
-
createElementVNode("div", {
|
|
142186
|
-
class: "cursor-pointer flex items-center",
|
|
142187
|
-
onClick: ($event) => handleDynamicValueClick(point, "value")
|
|
142188
|
-
}, [
|
|
142189
|
-
createVNode(CIcon, {
|
|
142190
|
-
class: normalizeClass(point.dynamicValue ? "text-blue-500" : ""),
|
|
142191
|
-
icon: "caret-down"
|
|
142192
|
-
}, null, 8, ["class"])
|
|
142193
|
-
], 8, _hoisted_18$6)
|
|
142194
|
-
]),
|
|
142195
|
-
default: withCtx(() => [
|
|
142196
|
-
createElementVNode("div", _hoisted_19$6, [
|
|
142197
|
-
createElementVNode("div", _hoisted_20$5, [
|
|
142198
|
-
createElementVNode("div", _hoisted_21$5, [
|
|
142199
|
-
createElementVNode("div", _hoisted_22$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
|
|
142200
|
-
createElementVNode("div", _hoisted_23$3, [
|
|
142201
|
-
createVNode(unref(NTree), {
|
|
142202
|
-
"block-line": "",
|
|
142203
|
-
class: "max-h-[300px]",
|
|
142204
|
-
data: dynamicValueTreeData.value,
|
|
142205
|
-
"render-label": renderDynamicValueTreeLabel,
|
|
142206
|
-
"selected-keys": [point.dynamicValue?.path ?? ""],
|
|
142207
|
-
"onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point, "value")
|
|
142208
|
-
}, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
|
|
142209
|
-
])
|
|
142210
|
-
]),
|
|
142211
|
-
point.selectedValue && point.arrayConfig && isArrayOrObject(point.selectedValue) ? (openBlock(), createElementBlock("div", _hoisted_24$3, [
|
|
142212
|
-
createElementVNode("div", _hoisted_25$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.configureArrayObjectFields")), 1),
|
|
142213
|
-
createElementVNode("div", _hoisted_26$3, [
|
|
142214
|
-
createElementVNode("div", null, [
|
|
142215
|
-
createElementVNode("label", _hoisted_27$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.labelField")), 1),
|
|
142216
|
-
createVNode(unref(NSelect), {
|
|
142217
|
-
value: point.arrayConfig.labelField,
|
|
142218
|
-
"onUpdate:value": [($event) => point.arrayConfig.labelField = $event, ($event) => updateDynamicValueExpression(point)],
|
|
142219
|
-
options: getFieldOptions(point.selectedValue)
|
|
142220
|
-
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
142221
|
-
]),
|
|
142222
|
-
createElementVNode("div", null, [
|
|
142223
|
-
createElementVNode("label", _hoisted_28$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.valueField")), 1),
|
|
142224
|
-
createVNode(unref(NSelect), {
|
|
142225
|
-
value: point.arrayConfig.valueField,
|
|
142226
|
-
"onUpdate:value": [($event) => point.arrayConfig.valueField = $event, ($event) => updateDynamicValueExpression(point)],
|
|
142227
|
-
options: getFieldOptions(point.selectedValue)
|
|
142228
|
-
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
142229
|
-
])
|
|
142230
|
-
])
|
|
142231
|
-
])) : createCommentVNode("", true)
|
|
142232
|
-
])
|
|
142233
|
-
])
|
|
142234
|
-
]),
|
|
142235
|
-
_: 2
|
|
142236
|
-
}, 1032, ["show"])
|
|
141566
|
+
trigger: withCtx(() => [
|
|
141567
|
+
createVNode(unref(NInput), {
|
|
141568
|
+
value: point.label,
|
|
141569
|
+
"onUpdate:value": ($event) => point.label = $event,
|
|
141570
|
+
class: "flex-1",
|
|
141571
|
+
disabled: true,
|
|
141572
|
+
placeholder: "Label"
|
|
141573
|
+
}, null, 8, ["value", "onUpdate:value"])
|
|
142237
141574
|
]),
|
|
142238
|
-
|
|
142239
|
-
|
|
142240
|
-
createVNode(CButton, {
|
|
142241
|
-
circle: "",
|
|
142242
|
-
class: "bg-error2 self-center",
|
|
142243
|
-
size: "small",
|
|
142244
|
-
style: normalizeStyle(deleteButtonStyle.value),
|
|
142245
|
-
type: "error",
|
|
142246
|
-
onClick: ($event) => removeDataPoint(index)
|
|
142247
|
-
}, {
|
|
142248
|
-
icon: withCtx(() => [
|
|
142249
|
-
createVNode(CIcon, {
|
|
142250
|
-
class: "color-error",
|
|
142251
|
-
"fa-type": "far",
|
|
142252
|
-
icon: "trash",
|
|
142253
|
-
size: 12
|
|
142254
|
-
})
|
|
141575
|
+
default: withCtx(() => [
|
|
141576
|
+
createTextVNode(" " + toDisplayString(point.label), 1)
|
|
142255
141577
|
]),
|
|
142256
141578
|
_: 2
|
|
142257
|
-
},
|
|
142258
|
-
|
|
142259
|
-
}), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(activeSeries.value.dataPoints, (point, index) => {
|
|
142260
|
-
return openBlock(), createElementBlock("div", {
|
|
142261
|
-
key: index,
|
|
142262
|
-
class: "flex gap-2 mb-2"
|
|
142263
|
-
}, [
|
|
142264
|
-
createVNode(unref(NInput), {
|
|
141579
|
+
}, 1024)) : (openBlock(), createBlock(unref(NInput), {
|
|
141580
|
+
key: 1,
|
|
142265
141581
|
value: point.label,
|
|
142266
141582
|
"onUpdate:value": ($event) => point.label = $event,
|
|
142267
141583
|
class: "flex-1",
|
|
142268
|
-
disabled: !!point.arrayConfig,
|
|
142269
141584
|
placeholder: "Label"
|
|
142270
|
-
}, null, 8, ["value", "onUpdate:value"
|
|
142271
|
-
|
|
142272
|
-
|
|
142273
|
-
|
|
142274
|
-
|
|
142275
|
-
|
|
142276
|
-
|
|
142277
|
-
|
|
142278
|
-
|
|
142279
|
-
|
|
142280
|
-
|
|
142281
|
-
|
|
142282
|
-
|
|
142283
|
-
|
|
142284
|
-
|
|
142285
|
-
|
|
142286
|
-
|
|
142287
|
-
|
|
142288
|
-
|
|
142289
|
-
|
|
142290
|
-
|
|
142291
|
-
|
|
142292
|
-
|
|
142293
|
-
|
|
142294
|
-
|
|
142295
|
-
|
|
142296
|
-
|
|
142297
|
-
|
|
142298
|
-
|
|
142299
|
-
|
|
142300
|
-
|
|
142301
|
-
|
|
142302
|
-
|
|
142303
|
-
|
|
142304
|
-
|
|
142305
|
-
|
|
142306
|
-
|
|
142307
|
-
|
|
142308
|
-
|
|
142309
|
-
|
|
142310
|
-
|
|
141585
|
+
}, null, 8, ["value", "onUpdate:value"])),
|
|
141586
|
+
createElementVNode("div", _hoisted_22$3, [
|
|
141587
|
+
point.dynamicValue ? (openBlock(), createBlock(unref(NTooltip), {
|
|
141588
|
+
key: 0,
|
|
141589
|
+
trigger: "hover"
|
|
141590
|
+
}, {
|
|
141591
|
+
trigger: withCtx(() => [
|
|
141592
|
+
createVNode(unref(NInput), {
|
|
141593
|
+
value: point.value,
|
|
141594
|
+
"onUpdate:value": ($event) => point.value = $event,
|
|
141595
|
+
class: "flex-1",
|
|
141596
|
+
disabled: !!point.dynamicValue,
|
|
141597
|
+
placeholder: "Value",
|
|
141598
|
+
type: "text"
|
|
141599
|
+
}, {
|
|
141600
|
+
suffix: withCtx(() => [
|
|
141601
|
+
createVNode(unref(NPopover), {
|
|
141602
|
+
placement: "bottom",
|
|
141603
|
+
show: activePopoverPoint.value === point,
|
|
141604
|
+
trigger: "manual",
|
|
141605
|
+
onClickoutside: _cache[7] || (_cache[7] = ($event) => activePopoverPoint.value = null)
|
|
141606
|
+
}, {
|
|
141607
|
+
trigger: withCtx(() => [
|
|
141608
|
+
createElementVNode("div", {
|
|
141609
|
+
class: "cursor-pointer flex items-center",
|
|
141610
|
+
onClick: ($event) => handleDynamicValueClick(point)
|
|
141611
|
+
}, [
|
|
141612
|
+
createVNode(CIcon, {
|
|
141613
|
+
class: normalizeClass(point.dynamicValue ? "text-blue-500" : ""),
|
|
141614
|
+
icon: "caret-down"
|
|
141615
|
+
}, null, 8, ["class"])
|
|
141616
|
+
], 8, _hoisted_23$3)
|
|
141617
|
+
]),
|
|
141618
|
+
default: withCtx(() => [
|
|
141619
|
+
createElementVNode("div", _hoisted_24$3, [
|
|
141620
|
+
createElementVNode("div", _hoisted_25$3, [
|
|
141621
|
+
createElementVNode("div", _hoisted_26$3, [
|
|
141622
|
+
createElementVNode("div", _hoisted_27$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
|
|
141623
|
+
createElementVNode("div", _hoisted_28$3, [
|
|
141624
|
+
createVNode(unref(NTree), {
|
|
141625
|
+
"block-line": "",
|
|
141626
|
+
class: "max-h-[300px]",
|
|
141627
|
+
data: dynamicValueTreeData.value,
|
|
141628
|
+
"render-label": renderDynamicValueTreeLabel,
|
|
141629
|
+
"selected-keys": [point.dynamicValue?.path ?? ""],
|
|
141630
|
+
"onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point)
|
|
141631
|
+
}, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
|
|
141632
|
+
])
|
|
141633
|
+
]),
|
|
141634
|
+
point.selectedValue && point.arrayConfig && (Array.isArray(point.selectedValue) || typeof point.selectedValue === "object" && point.selectedValue !== null) ? (openBlock(), createElementBlock("div", _hoisted_29$3, [
|
|
141635
|
+
createElementVNode("div", _hoisted_30$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.configureArrayObjectFields")), 1),
|
|
141636
|
+
createElementVNode("div", _hoisted_31$3, [
|
|
141637
|
+
createElementVNode("div", null, [
|
|
141638
|
+
createElementVNode("label", _hoisted_32$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.labelField")), 1),
|
|
141639
|
+
createVNode(unref(NSelect), {
|
|
141640
|
+
value: point.arrayConfig.labelField,
|
|
141641
|
+
"onUpdate:value": [($event) => point.arrayConfig.labelField = $event, ($event) => updateDynamicValueExpression(point)],
|
|
141642
|
+
options: getFieldOptions(point.selectedValue)
|
|
141643
|
+
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
141644
|
+
]),
|
|
141645
|
+
createElementVNode("div", null, [
|
|
141646
|
+
createElementVNode("label", _hoisted_33$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.valueField")), 1),
|
|
141647
|
+
createVNode(unref(NSelect), {
|
|
141648
|
+
value: point.arrayConfig.valueField,
|
|
141649
|
+
"onUpdate:value": [($event) => point.arrayConfig.valueField = $event, ($event) => updateDynamicValueExpression(point)],
|
|
141650
|
+
options: getFieldOptions(point.selectedValue)
|
|
141651
|
+
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
141652
|
+
])
|
|
141653
|
+
])
|
|
141654
|
+
])) : createCommentVNode("", true)
|
|
141655
|
+
])
|
|
142311
141656
|
])
|
|
142312
141657
|
]),
|
|
142313
|
-
|
|
142314
|
-
|
|
141658
|
+
_: 2
|
|
141659
|
+
}, 1032, ["show"])
|
|
141660
|
+
]),
|
|
141661
|
+
_: 2
|
|
141662
|
+
}, 1032, ["value", "onUpdate:value", "disabled"])
|
|
141663
|
+
]),
|
|
141664
|
+
default: withCtx(() => [
|
|
141665
|
+
createTextVNode(" " + toDisplayString(point.value), 1)
|
|
141666
|
+
]),
|
|
141667
|
+
_: 2
|
|
141668
|
+
}, 1024)) : (openBlock(), createBlock(unref(NInput), {
|
|
141669
|
+
key: 1,
|
|
141670
|
+
value: point.value,
|
|
141671
|
+
"onUpdate:value": ($event) => point.value = $event,
|
|
141672
|
+
class: "flex-1",
|
|
141673
|
+
disabled: !!point.dynamicValue,
|
|
141674
|
+
placeholder: "Value",
|
|
141675
|
+
type: "text"
|
|
141676
|
+
}, {
|
|
141677
|
+
suffix: withCtx(() => [
|
|
141678
|
+
createVNode(unref(NPopover), {
|
|
141679
|
+
placement: "bottom",
|
|
141680
|
+
show: activePopoverPoint.value === point,
|
|
141681
|
+
trigger: "manual",
|
|
141682
|
+
onClickoutside: _cache[8] || (_cache[8] = ($event) => activePopoverPoint.value = null)
|
|
141683
|
+
}, {
|
|
141684
|
+
trigger: withCtx(() => [
|
|
141685
|
+
createElementVNode("div", {
|
|
141686
|
+
class: "cursor-pointer flex items-center",
|
|
141687
|
+
onClick: ($event) => handleDynamicValueClick(point)
|
|
141688
|
+
}, [
|
|
141689
|
+
createVNode(CIcon, {
|
|
141690
|
+
class: normalizeClass(point.dynamicValue ? "text-blue-500" : ""),
|
|
141691
|
+
icon: "caret-down"
|
|
141692
|
+
}, null, 8, ["class"])
|
|
141693
|
+
], 8, _hoisted_34$3)
|
|
141694
|
+
]),
|
|
141695
|
+
default: withCtx(() => [
|
|
141696
|
+
createElementVNode("div", _hoisted_35$3, [
|
|
141697
|
+
createElementVNode("div", _hoisted_36$3, [
|
|
142315
141698
|
createElementVNode("div", _hoisted_37$3, [
|
|
142316
|
-
createElementVNode("div",
|
|
142317
|
-
|
|
142318
|
-
createVNode(unref(
|
|
142319
|
-
|
|
142320
|
-
|
|
142321
|
-
|
|
142322
|
-
|
|
142323
|
-
|
|
142324
|
-
|
|
142325
|
-
|
|
142326
|
-
createVNode(unref(NSelect), {
|
|
142327
|
-
value: point.arrayConfig.xField,
|
|
142328
|
-
"onUpdate:value": [($event) => point.arrayConfig.xField = $event, ($event) => updateXYDynamicValueExpression(point)],
|
|
142329
|
-
options: getFieldOptions(point.selectedXValue)
|
|
142330
|
-
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
142331
|
-
]),
|
|
142332
|
-
createElementVNode("div", null, [
|
|
142333
|
-
createElementVNode("label", _hoisted_40$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yValueField")), 1),
|
|
142334
|
-
createVNode(unref(NSelect), {
|
|
142335
|
-
value: point.arrayConfig.yField,
|
|
142336
|
-
"onUpdate:value": [($event) => point.arrayConfig.yField = $event, ($event) => updateXYDynamicValueExpression(point)],
|
|
142337
|
-
options: getFieldOptions(point.selectedXValue)
|
|
142338
|
-
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
141699
|
+
createElementVNode("div", _hoisted_38$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
|
|
141700
|
+
createElementVNode("div", _hoisted_39$3, [
|
|
141701
|
+
createVNode(unref(NTree), {
|
|
141702
|
+
"block-line": "",
|
|
141703
|
+
class: "max-h-[300px]",
|
|
141704
|
+
data: dynamicValueTreeData.value,
|
|
141705
|
+
"render-label": renderDynamicValueTreeLabel,
|
|
141706
|
+
"selected-keys": [point.dynamicValue?.path ?? ""],
|
|
141707
|
+
"onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point)
|
|
141708
|
+
}, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
|
|
142339
141709
|
])
|
|
142340
|
-
])
|
|
142341
|
-
|
|
141710
|
+
]),
|
|
141711
|
+
point.selectedValue && point.arrayConfig && (Array.isArray(point.selectedValue) || typeof point.selectedValue === "object" && point.selectedValue !== null) ? (openBlock(), createElementBlock("div", _hoisted_40$3, [
|
|
141712
|
+
_cache[14] || (_cache[14] = createElementVNode("div", { class: "text-sm font-medium mb-2" }, "Configure Array/Object Fields", -1)),
|
|
141713
|
+
createElementVNode("div", _hoisted_41$3, [
|
|
141714
|
+
createElementVNode("div", null, [
|
|
141715
|
+
_cache[12] || (_cache[12] = createElementVNode("label", { class: "block mb-1 text-sm" }, "Label Field", -1)),
|
|
141716
|
+
createVNode(unref(NSelect), {
|
|
141717
|
+
value: point.arrayConfig.labelField,
|
|
141718
|
+
"onUpdate:value": [($event) => point.arrayConfig.labelField = $event, ($event) => updateDynamicValueExpression(point)],
|
|
141719
|
+
options: getFieldOptions(point.selectedValue)
|
|
141720
|
+
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
141721
|
+
]),
|
|
141722
|
+
createElementVNode("div", null, [
|
|
141723
|
+
_cache[13] || (_cache[13] = createElementVNode("label", { class: "block mb-1 text-sm" }, "Value Field", -1)),
|
|
141724
|
+
createVNode(unref(NSelect), {
|
|
141725
|
+
value: point.arrayConfig.valueField,
|
|
141726
|
+
"onUpdate:value": [($event) => point.arrayConfig.valueField = $event, ($event) => updateDynamicValueExpression(point)],
|
|
141727
|
+
options: getFieldOptions(point.selectedValue)
|
|
141728
|
+
}, null, 8, ["value", "onUpdate:value", "options"])
|
|
141729
|
+
])
|
|
141730
|
+
])
|
|
141731
|
+
])) : createCommentVNode("", true)
|
|
141732
|
+
])
|
|
142342
141733
|
])
|
|
142343
|
-
])
|
|
142344
|
-
|
|
142345
|
-
|
|
142346
|
-
|
|
142347
|
-
|
|
142348
|
-
|
|
142349
|
-
|
|
142350
|
-
createVNode(unref(NInput), {
|
|
142351
|
-
value: point.yValue,
|
|
142352
|
-
"onUpdate:value": ($event) => point.yValue = $event,
|
|
142353
|
-
class: "flex-1",
|
|
142354
|
-
disabled: !!point.dynamicYValue,
|
|
142355
|
-
placeholder: "Y Value",
|
|
142356
|
-
type: "text"
|
|
142357
|
-
}, {
|
|
142358
|
-
suffix: withCtx(() => [
|
|
142359
|
-
createVNode(unref(NPopover), {
|
|
142360
|
-
placement: "bottom",
|
|
142361
|
-
show: activePopoverPoint.value === point && activePopoverField.value === "y",
|
|
142362
|
-
trigger: "manual",
|
|
142363
|
-
onClickoutside: closePopover
|
|
142364
|
-
}, {
|
|
142365
|
-
trigger: withCtx(() => [
|
|
142366
|
-
createElementVNode("div", {
|
|
142367
|
-
class: "cursor-pointer flex items-center",
|
|
142368
|
-
onClick: ($event) => handleDynamicValueClick(point, "y")
|
|
142369
|
-
}, [
|
|
142370
|
-
createVNode(CIcon, {
|
|
142371
|
-
class: normalizeClass(point.dynamicYValue ? "text-blue-500" : ""),
|
|
142372
|
-
icon: "caret-down"
|
|
142373
|
-
}, null, 8, ["class"])
|
|
142374
|
-
], 8, _hoisted_41$3)
|
|
142375
|
-
]),
|
|
142376
|
-
default: withCtx(() => [
|
|
142377
|
-
createElementVNode("div", _hoisted_42$3, [
|
|
142378
|
-
createElementVNode("div", _hoisted_43$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
|
|
142379
|
-
createVNode(unref(NTree), {
|
|
142380
|
-
"block-line": "",
|
|
142381
|
-
class: "max-h-[300px]",
|
|
142382
|
-
data: dynamicValueTreeData.value,
|
|
142383
|
-
"render-label": renderDynamicValueTreeLabel,
|
|
142384
|
-
"selected-keys": [point.dynamicYValue?.path ?? ""],
|
|
142385
|
-
"onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point, "y")
|
|
142386
|
-
}, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
|
|
142387
|
-
])
|
|
142388
|
-
]),
|
|
142389
|
-
_: 2
|
|
142390
|
-
}, 1032, ["show"])
|
|
142391
|
-
]),
|
|
142392
|
-
_: 2
|
|
142393
|
-
}, 1032, ["value", "onUpdate:value", "disabled"]),
|
|
141734
|
+
]),
|
|
141735
|
+
_: 2
|
|
141736
|
+
}, 1032, ["show"])
|
|
141737
|
+
]),
|
|
141738
|
+
_: 2
|
|
141739
|
+
}, 1032, ["value", "onUpdate:value", "disabled"]))
|
|
141740
|
+
]),
|
|
142394
141741
|
createVNode(CButton, {
|
|
142395
141742
|
circle: "",
|
|
142396
141743
|
class: "bg-error2 self-center",
|
|
142397
141744
|
size: "small",
|
|
142398
|
-
style: normalizeStyle(
|
|
141745
|
+
style: normalizeStyle({
|
|
141746
|
+
"--n-border": "1px solid transparent",
|
|
141747
|
+
"--n-border-disabled": "1px solid transparent",
|
|
141748
|
+
"--n-border-focus": "1px solid transparent",
|
|
141749
|
+
"--n-border-hover": "1px solid transparent",
|
|
141750
|
+
"--n-border-pressed": "1px solid transparent",
|
|
141751
|
+
"--n-color-focus": unref(themeVars).error2,
|
|
141752
|
+
"--n-color-hover": unref(themeVars).error2,
|
|
141753
|
+
"--n-color-disabled": unref(themeVars).error2,
|
|
141754
|
+
"--n-color-pressed": unref(themeVars).error2
|
|
141755
|
+
}),
|
|
142399
141756
|
type: "error",
|
|
142400
141757
|
onClick: ($event) => removeDataPoint(index)
|
|
142401
141758
|
}, {
|
|
@@ -142411,7 +141768,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142411
141768
|
}, 1032, ["style", "onClick"])
|
|
142412
141769
|
]);
|
|
142413
141770
|
}), 128)),
|
|
142414
|
-
createElementVNode("div",
|
|
141771
|
+
createElementVNode("div", _hoisted_42$3, [
|
|
142415
141772
|
createVNode(CButton, {
|
|
142416
141773
|
class: "mt-2",
|
|
142417
141774
|
"icon-placement": "left",
|
|
@@ -142431,62 +141788,11 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142431
141788
|
})
|
|
142432
141789
|
])
|
|
142433
141790
|
]),
|
|
142434
|
-
createElementVNode("div",
|
|
142435
|
-
|
|
142436
|
-
createElementVNode("label", _hoisted_47$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartTitle")), 1),
|
|
142437
|
-
createVNode(unref(NInput), {
|
|
142438
|
-
value: chartTitle.value,
|
|
142439
|
-
"onUpdate:value": _cache[2] || (_cache[2] = ($event) => chartTitle.value = $event),
|
|
142440
|
-
type: "text"
|
|
142441
|
-
}, null, 8, ["value"])
|
|
142442
|
-
]),
|
|
142443
|
-
["bar", "line"].includes(primaryChartType.value) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
142444
|
-
createElementVNode("div", _hoisted_48$3, [
|
|
142445
|
-
createElementVNode("label", _hoisted_49$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.xAxisLabel")), 1),
|
|
142446
|
-
createVNode(unref(NInput), {
|
|
142447
|
-
value: xAxisLabel.value,
|
|
142448
|
-
"onUpdate:value": _cache[3] || (_cache[3] = ($event) => xAxisLabel.value = $event),
|
|
142449
|
-
type: "text"
|
|
142450
|
-
}, null, 8, ["value"])
|
|
142451
|
-
]),
|
|
142452
|
-
createElementVNode("div", _hoisted_50$3, [
|
|
142453
|
-
createElementVNode("label", _hoisted_51$2, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yAxisLabel")), 1),
|
|
142454
|
-
createVNode(unref(NInput), {
|
|
142455
|
-
value: yAxisLabel.value,
|
|
142456
|
-
"onUpdate:value": _cache[4] || (_cache[4] = ($event) => yAxisLabel.value = $event),
|
|
142457
|
-
type: "text"
|
|
142458
|
-
}, null, 8, ["value"])
|
|
142459
|
-
]),
|
|
142460
|
-
createElementVNode("div", _hoisted_52$2, [
|
|
142461
|
-
createElementVNode("label", _hoisted_53$2, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.orientation")), 1),
|
|
142462
|
-
createVNode(unref(NSelect), {
|
|
142463
|
-
value: orientation.value,
|
|
142464
|
-
"onUpdate:value": _cache[5] || (_cache[5] = ($event) => orientation.value = $event),
|
|
142465
|
-
options: orientationOptions
|
|
142466
|
-
}, null, 8, ["value"])
|
|
142467
|
-
])
|
|
142468
|
-
], 64)) : createCommentVNode("", true),
|
|
142469
|
-
["pie", "doughnut", "polarArea"].includes(primaryChartType.value) ? (openBlock(), createElementBlock("div", _hoisted_54$1, [
|
|
142470
|
-
createElementVNode("label", _hoisted_55$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.legendPosition")), 1),
|
|
142471
|
-
createVNode(unref(NSelect), {
|
|
142472
|
-
value: legendPosition.value,
|
|
142473
|
-
"onUpdate:value": _cache[6] || (_cache[6] = ($event) => legendPosition.value = $event),
|
|
142474
|
-
options: legendPositionOptions
|
|
142475
|
-
}, null, 8, ["value"])
|
|
142476
|
-
])) : createCommentVNode("", true),
|
|
142477
|
-
["line", "scatter", "area"].includes(primaryChartType.value) ? (openBlock(), createElementBlock("div", _hoisted_56$1, [
|
|
142478
|
-
createElementVNode("label", _hoisted_57$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.pointStyle")), 1),
|
|
142479
|
-
createVNode(unref(NSelect), {
|
|
142480
|
-
value: pointStyle.value,
|
|
142481
|
-
"onUpdate:value": _cache[7] || (_cache[7] = ($event) => pointStyle.value = $event),
|
|
142482
|
-
options: pointStyleOptions
|
|
142483
|
-
}, null, 8, ["value"])
|
|
142484
|
-
])) : createCommentVNode("", true),
|
|
142485
|
-
createElementVNode("div", _hoisted_58$1, [
|
|
142486
|
-
createElementVNode("label", _hoisted_59$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.colorScheme")), 1),
|
|
141791
|
+
createElementVNode("div", _hoisted_43$3, [
|
|
141792
|
+
createElementVNode("label", _hoisted_44$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.colorScheme")), 1),
|
|
142487
141793
|
createVNode(unref(NSelect), {
|
|
142488
141794
|
value: colorSchemeType.value,
|
|
142489
|
-
"onUpdate:value": _cache[
|
|
141795
|
+
"onUpdate:value": _cache[9] || (_cache[9] = ($event) => colorSchemeType.value = $event),
|
|
142490
141796
|
class: "mb-2",
|
|
142491
141797
|
options: [
|
|
142492
141798
|
{ label: unref(t)("canvasUI.canvasBuilder.dataCharts.useThemeColors"), value: "theme" },
|
|
@@ -142503,106 +141809,19 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142503
141809
|
"onUpdate:palette": updateChartColors
|
|
142504
141810
|
}, null, 8, ["allow-add", "allow-delete", "allow-edit", "initial-palette"]))
|
|
142505
141811
|
]),
|
|
142506
|
-
createElementVNode("div",
|
|
142507
|
-
createElementVNode("label",
|
|
141812
|
+
createElementVNode("div", _hoisted_45$3, [
|
|
141813
|
+
createElementVNode("label", _hoisted_46$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.animation")), 1),
|
|
142508
141814
|
createVNode(unref(NSwitch), {
|
|
142509
141815
|
value: enableAnimation.value,
|
|
142510
|
-
"onUpdate:value": _cache[
|
|
141816
|
+
"onUpdate:value": _cache[10] || (_cache[10] = ($event) => enableAnimation.value = $event)
|
|
142511
141817
|
}, null, 8, ["value"])
|
|
142512
|
-
]),
|
|
142513
|
-
createElementVNode("div", _hoisted_62$1, [
|
|
142514
|
-
createElementVNode("label", _hoisted_63$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.percentDisplay")), 1),
|
|
142515
|
-
createElementVNode("div", _hoisted_64$1, [
|
|
142516
|
-
createVNode(unref(NSwitch), {
|
|
142517
|
-
value: percentDisplay.value,
|
|
142518
|
-
"onUpdate:value": _cache[10] || (_cache[10] = ($event) => percentDisplay.value = $event)
|
|
142519
|
-
}, null, 8, ["value"]),
|
|
142520
|
-
createElementVNode("span", _hoisted_65$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.percentDisplayHint")), 1)
|
|
142521
|
-
])
|
|
142522
|
-
]),
|
|
142523
|
-
createElementVNode("div", _hoisted_66$1, [
|
|
142524
|
-
createElementVNode("label", _hoisted_67$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.viewModeControls")), 1),
|
|
142525
|
-
createElementVNode("div", _hoisted_68$1, [
|
|
142526
|
-
createElementVNode("div", _hoisted_69, [
|
|
142527
|
-
createVNode(unref(NSwitch), {
|
|
142528
|
-
value: enableFullscreenBtn.value,
|
|
142529
|
-
"onUpdate:value": _cache[11] || (_cache[11] = ($event) => enableFullscreenBtn.value = $event)
|
|
142530
|
-
}, null, 8, ["value"]),
|
|
142531
|
-
createElementVNode("span", _hoisted_70, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableFullscreenBtn")), 1)
|
|
142532
|
-
]),
|
|
142533
|
-
createVNode(unref(NTooltip), {
|
|
142534
|
-
disabled: !isMultiSeries.value,
|
|
142535
|
-
trigger: "hover"
|
|
142536
|
-
}, {
|
|
142537
|
-
trigger: withCtx(() => [
|
|
142538
|
-
createElementVNode("div", {
|
|
142539
|
-
class: normalizeClass(["flex items-center gap-2", { "opacity-50 cursor-not-allowed": isMultiSeries.value }])
|
|
142540
|
-
}, [
|
|
142541
|
-
createVNode(unref(NSwitch), {
|
|
142542
|
-
value: enableChartTypeSwitcher.value,
|
|
142543
|
-
"onUpdate:value": _cache[12] || (_cache[12] = ($event) => enableChartTypeSwitcher.value = $event),
|
|
142544
|
-
disabled: isMultiSeries.value
|
|
142545
|
-
}, null, 8, ["value", "disabled"]),
|
|
142546
|
-
createElementVNode("span", _hoisted_71, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableChartTypeSwitcher")), 1)
|
|
142547
|
-
], 2)
|
|
142548
|
-
]),
|
|
142549
|
-
default: withCtx(() => [
|
|
142550
|
-
createTextVNode(" " + toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartTypeSwitcherMultiSeriesDisabled")), 1)
|
|
142551
|
-
]),
|
|
142552
|
-
_: 1
|
|
142553
|
-
}, 8, ["disabled"]),
|
|
142554
|
-
createElementVNode("div", _hoisted_72, [
|
|
142555
|
-
createVNode(unref(NSwitch), {
|
|
142556
|
-
value: enableDataEntry.value,
|
|
142557
|
-
"onUpdate:value": _cache[13] || (_cache[13] = ($event) => enableDataEntry.value = $event)
|
|
142558
|
-
}, null, 8, ["value"]),
|
|
142559
|
-
createElementVNode("span", _hoisted_73, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableDataEntry")), 1)
|
|
142560
|
-
])
|
|
142561
|
-
])
|
|
142562
|
-
]),
|
|
142563
|
-
createElementVNode("div", _hoisted_74, [
|
|
142564
|
-
createElementVNode("label", _hoisted_75, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartSize")), 1),
|
|
142565
|
-
createElementVNode("div", _hoisted_76, [
|
|
142566
|
-
createElementVNode("div", _hoisted_77, [
|
|
142567
|
-
createElementVNode("label", _hoisted_78, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.height")), 1),
|
|
142568
|
-
createVNode(unref(NInputNumber), {
|
|
142569
|
-
value: chartHeight.value,
|
|
142570
|
-
"onUpdate:value": _cache[14] || (_cache[14] = ($event) => chartHeight.value = $event),
|
|
142571
|
-
class: "flex-1",
|
|
142572
|
-
max: 1e3,
|
|
142573
|
-
min: 100,
|
|
142574
|
-
step: 10
|
|
142575
|
-
}, {
|
|
142576
|
-
suffix: withCtx(() => _cache[17] || (_cache[17] = [
|
|
142577
|
-
createTextVNode("px")
|
|
142578
|
-
])),
|
|
142579
|
-
_: 1
|
|
142580
|
-
}, 8, ["value"])
|
|
142581
|
-
]),
|
|
142582
|
-
createElementVNode("div", _hoisted_79, [
|
|
142583
|
-
createElementVNode("label", _hoisted_80, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.width")), 1),
|
|
142584
|
-
createVNode(unref(NInputNumber), {
|
|
142585
|
-
value: chartWidth.value,
|
|
142586
|
-
"onUpdate:value": _cache[15] || (_cache[15] = ($event) => chartWidth.value = $event),
|
|
142587
|
-
class: "flex-1",
|
|
142588
|
-
max: 100,
|
|
142589
|
-
min: 10,
|
|
142590
|
-
step: 5
|
|
142591
|
-
}, {
|
|
142592
|
-
suffix: withCtx(() => _cache[18] || (_cache[18] = [
|
|
142593
|
-
createTextVNode("%")
|
|
142594
|
-
])),
|
|
142595
|
-
_: 1
|
|
142596
|
-
}, 8, ["value"])
|
|
142597
|
-
])
|
|
142598
|
-
])
|
|
142599
141818
|
])
|
|
142600
141819
|
])
|
|
142601
141820
|
])
|
|
142602
141821
|
]),
|
|
142603
|
-
createElementVNode("div",
|
|
142604
|
-
createElementVNode("div",
|
|
142605
|
-
createElementVNode("div",
|
|
141822
|
+
createElementVNode("div", _hoisted_47$3, [
|
|
141823
|
+
createElementVNode("div", _hoisted_48$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.preview")), 1),
|
|
141824
|
+
createElementVNode("div", _hoisted_49$3, [
|
|
142606
141825
|
createVNode(unref(NCard), { bordered: false }, {
|
|
142607
141826
|
default: withCtx(() => [
|
|
142608
141827
|
(openBlock(), createBlock(RawDataCharts, {
|
|
@@ -142610,8 +141829,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
|
|
|
142610
141829
|
data: {
|
|
142611
141830
|
...previewData.value,
|
|
142612
141831
|
context: unref(crmShape)
|
|
142613
|
-
}
|
|
142614
|
-
"is-preview": ""
|
|
141832
|
+
}
|
|
142615
141833
|
}, null, 8, ["data"]))
|
|
142616
141834
|
]),
|
|
142617
141835
|
_: 1
|
|
@@ -142668,12 +141886,6 @@ const _sfc_main$2D = /* @__PURE__ */ defineComponent({
|
|
|
142668
141886
|
usedInSectionId,
|
|
142669
141887
|
when_used_in_section
|
|
142670
141888
|
});
|
|
142671
|
-
const canEditChart = computed(() => {
|
|
142672
|
-
if (mode.value === CanvasBuilderMode.ADMIN) {
|
|
142673
|
-
return true;
|
|
142674
|
-
}
|
|
142675
|
-
return props.data?.view_controls?.enable_data_entry ?? false;
|
|
142676
|
-
});
|
|
142677
141889
|
onMounted(() => {
|
|
142678
141890
|
if (justAddedComponentId.value === props.id) {
|
|
142679
141891
|
setComponentEditMode(ComponentTypes.DataCharts, props.id);
|
|
@@ -142685,7 +141897,7 @@ const _sfc_main$2D = /* @__PURE__ */ defineComponent({
|
|
|
142685
141897
|
unref(shouldDisplayPlaceholderComponent)(unref(isEditMode), unref(mode), _ctx.visible) ? (openBlock(), createBlock(PlaceholderComponent, {
|
|
142686
141898
|
key: 0,
|
|
142687
141899
|
name: _ctx.tracking_id
|
|
142688
|
-
}, null, 8, ["name"])) : unref(isEditMode) && !unref(isViewOnlyMode) && unref(componentPermissions).hasSomethingEditable
|
|
141900
|
+
}, null, 8, ["name"])) : unref(isEditMode) && !unref(isViewOnlyMode) && unref(componentPermissions).hasSomethingEditable ? (openBlock(), createBlock(_sfc_main$34, {
|
|
142689
141901
|
key: 1,
|
|
142690
141902
|
id: unref(id),
|
|
142691
141903
|
active: unref(componentEditMode) && unref(componentEditMode)?.id === unref(id),
|
|
@@ -142707,7 +141919,6 @@ const _sfc_main$2D = /* @__PURE__ */ defineComponent({
|
|
|
142707
141919
|
key: key.value,
|
|
142708
141920
|
class: "ma-1",
|
|
142709
141921
|
data: _ctx.data,
|
|
142710
|
-
"is-edit-mode": "",
|
|
142711
141922
|
style: normalizeStyle(_ctx.style)
|
|
142712
141923
|
}, null, 8, ["data", "style"])) : (openBlock(), createBlock(_sfc_main$2G, {
|
|
142713
141924
|
key: 1,
|
|
@@ -142719,9 +141930,8 @@ const _sfc_main$2D = /* @__PURE__ */ defineComponent({
|
|
|
142719
141930
|
}, 8, ["id", "active", "duplicate", "edit", "remove", "selected", "settings", "stylable"])) : (openBlock(), createBlock(RawDataCharts, {
|
|
142720
141931
|
key: 2,
|
|
142721
141932
|
data: _ctx.data,
|
|
142722
|
-
"is-edit-mode": unref(isEditMode),
|
|
142723
141933
|
style: normalizeStyle(_ctx.style)
|
|
142724
|
-
}, null, 8, ["data", "
|
|
141934
|
+
}, null, 8, ["data", "style"])),
|
|
142725
141935
|
unref(componentEditMode) && unref(componentEditMode).id === unref(id) ? (openBlock(), createBlock(_sfc_main$2E, {
|
|
142726
141936
|
key: 3,
|
|
142727
141937
|
id: unref(id),
|
|
@@ -176493,8 +175703,8 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
|
|
|
176493
175703
|
can_share: true
|
|
176494
175704
|
},
|
|
176495
175705
|
tags: [],
|
|
176496
|
-
expiresAtDateTime: null,
|
|
176497
|
-
expiresAtOption: "never" /* Never */,
|
|
175706
|
+
expiresAtDateTime: pitcherSettings.value?.is_file_expiration_mandatory ? dayjs().add(7, "day").endOf("day").valueOf() : null,
|
|
175707
|
+
expiresAtOption: pitcherSettings.value?.is_file_expiration_mandatory ? "at" /* At */ : "never" /* Never */,
|
|
176498
175708
|
accessType: appName.value === "admin" ? AccessTypeEnum.PUBLIC : AccessTypeEnum.RESTRICTED,
|
|
176499
175709
|
collaborations: [],
|
|
176500
175710
|
metadata: {}
|
|
@@ -176516,6 +175726,13 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
|
|
|
176516
175726
|
await nextTick();
|
|
176517
175727
|
await validateMetadata();
|
|
176518
175728
|
}
|
|
175729
|
+
const isExpirationValid = computed(() => {
|
|
175730
|
+
const isMandatory = pitcherSettings.value?.is_file_expiration_mandatory;
|
|
175731
|
+
if (isMandatory) {
|
|
175732
|
+
return form.value.expiresAtDateTime !== null && form.value.expiresAtDateTime !== void 0;
|
|
175733
|
+
}
|
|
175734
|
+
return true;
|
|
175735
|
+
});
|
|
176519
175736
|
function onAddFiles() {
|
|
176520
175737
|
fileInputRef.value?.onClick();
|
|
176521
175738
|
}
|
|
@@ -176662,7 +175879,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
|
|
|
176662
175879
|
}, 8, ["on-item-header-click"])
|
|
176663
175880
|
]),
|
|
176664
175881
|
createVNode(_sfc_main$j, {
|
|
176665
|
-
disableDone: !areMetadataValid.value || unref(uploadSelectedFiles).length === 0,
|
|
175882
|
+
disableDone: !areMetadataValid.value || unref(uploadSelectedFiles).length === 0 || !isExpirationValid.value,
|
|
176666
175883
|
onCancel: cancel,
|
|
176667
175884
|
onUpload: upload
|
|
176668
175885
|
}, null, 8, ["disableDone"])
|