@done-coding/admin-core 0.25.0 → 0.25.1-alpha.0
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/es/components/app-layout/AppPage.vue.mjs +1 -1
- package/es/components/app-layout/AppPage.vue2.mjs +42 -23
- package/es/components/app-layout/use-content-box.mjs +17 -0
- package/es/components/data-view/DataGridView.vue.mjs +1 -1
- package/es/components/data-view/DataGridView.vue2.mjs +34 -14
- package/es/components/data-view/DataListView.vue.mjs +1 -1
- package/es/components/data-view/DataListView.vue2.mjs +27 -7
- package/es/components/data-view/DataListViewItem.vue.mjs +1 -1
- package/es/components/data-view/DataListViewItem.vue2.mjs +3 -2
- package/es/components/list-layout/ListLayout.vue.mjs +1 -1
- package/es/components/list-layout/ListLayout.vue2.mjs +34 -11
- package/es/components/modal/ModalConfirm.vue.mjs +1 -1
- package/es/components/modal/ModalConfirm.vue2.mjs +67 -49
- package/es/components/page-layout/AppPageDetail.vue.mjs +7 -0
- package/es/components/page-layout/AppPageDetail.vue2.mjs +89 -0
- package/es/components/page-layout/AppPageListDetailLayout.vue.mjs +153 -0
- package/es/components/page-layout/AppPageListDetailLayout.vue2.mjs +4 -0
- package/es/components/page-layout/AppPageListDetailSheet.vue.mjs +96 -0
- package/es/components/page-layout/AppPageListDetailSheet.vue2.mjs +4 -0
- package/es/components/page-layout/AppPageListDetailSplit.vue.mjs +7 -0
- package/es/components/page-layout/AppPageListDetailSplit.vue2.mjs +83 -0
- package/es/components/page-layout/use-list-detail.mjs +110 -0
- package/es/components/panel/PanelEditSwitch.vue.mjs +1 -1
- package/es/components/table/TableMain.vue.mjs +1 -1
- package/es/components/table/TableMain.vue2.mjs +55 -5
- package/es/components/view-layout/ViewLayout.vue.mjs +1 -1
- package/es/components/view-layout/ViewLayout.vue2.mjs +34 -4
- package/es/components/view-layout/ViewLayoutNavigation.vue.mjs +7 -0
- package/es/components/view-layout/ViewLayoutNavigation.vue2.mjs +34 -0
- package/es/hooks/use-active-record.mjs +100 -0
- package/es/index.mjs +146 -141
- package/es/inject/key.mjs +4 -0
- package/es/style.css +129 -96
- package/package.json +2 -2
- package/src/components/app-layout/README.md +8 -1
- package/src/components/app-layout/docs/README-AppPage.md +48 -2
- package/src/components/data-view/docs/README-DataGridView.md +2 -1
- package/src/components/data-view/docs/README-DataListView.md +13 -4
- package/src/components/list-layout/docs/README-ListLayout.md +1 -1
- package/src/components/modal/docs/README-ModalConfirm.md +2 -0
- package/src/components/page-layout/README.md +47 -0
- package/src/components/page-layout/docs/README-AppPageDetail.md +57 -0
- package/src/components/page-layout/docs/README-AppPageListDetailLayout.md +142 -0
- package/src/components/table/docs/README-TableMain.md +1 -1
- package/src/components/view-layout/docs/README-ViewLayout.md +14 -0
- package/types/components/app-layout/AppPage.vue.d.ts +14 -0
- package/types/components/app-layout/use-content-box.d.ts +31 -0
- package/types/components/data-view/DataGridView.vue.d.ts +9 -2
- package/types/components/data-view/DataListView.vue.d.ts +10 -2
- package/types/components/data-view/DataListViewItem.vue.d.ts +4 -2
- package/types/components/data-view/types.d.ts +5 -1
- package/types/components/list-layout/ListLayout.vue.d.ts +7 -2
- package/types/components/modal/ModalConfirm.vue.d.ts +18 -0
- package/types/components/page-layout/AppPageDetail.vue.d.ts +40 -0
- package/types/components/page-layout/AppPageListDetailLayout.vue.d.ts +39 -0
- package/types/components/page-layout/AppPageListDetailSheet.vue.d.ts +44 -0
- package/types/components/page-layout/AppPageListDetailSplit.vue.d.ts +47 -0
- package/types/components/page-layout/index.d.ts +4 -0
- package/types/components/page-layout/types.d.ts +102 -0
- package/types/components/page-layout/use-list-detail.d.ts +58 -0
- package/types/components/panel/PanelEditSwitch.vue.d.ts +30 -0
- package/types/components/table/TableMain.vue.d.ts +9 -2
- package/types/components/view-layout/ViewLayoutNavigation.vue.d.ts +13 -0
- package/types/components/view-layout/types.d.ts +46 -0
- package/types/hooks/use-active-record.d.ts +64 -0
- package/types/index.d.ts +1 -0
- package/types/inject/key.d.ts +29 -0
- package/types/injectInfo.json.d.ts +1 -1
- package/types/types/utility-types.d.ts +17 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import _sfc_main from "./AppPageDetail.vue2.mjs";
|
|
2
|
+
/* empty css */
|
|
3
|
+
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
+
const AppPageDetail = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8de03183"]]);
|
|
5
|
+
export {
|
|
6
|
+
AppPageDetail as default
|
|
7
|
+
};
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import { defineComponent, computed, openBlock, createBlock, unref, withCtx, createElementBlock, toDisplayString, createCommentVNode, renderSlot, normalizeProps, guardReactiveProps, mergeProps, createVNode } from "vue";
|
|
2
|
+
import { ElEmpty } from "element-plus";
|
|
3
|
+
import AppPage from "../app-layout/AppPage.vue.mjs";
|
|
4
|
+
import _sfc_main$1 from "../slot-layout/SlotLayoutTemplate.vue.mjs";
|
|
5
|
+
import ViewLayout from "../view-layout/ViewLayout.vue.mjs";
|
|
6
|
+
const _hoisted_1 = {
|
|
7
|
+
key: 0,
|
|
8
|
+
class: "dc-app-page-detail__title"
|
|
9
|
+
};
|
|
10
|
+
const _hoisted_2 = {
|
|
11
|
+
key: 0,
|
|
12
|
+
class: "dc-app-page-detail__title"
|
|
13
|
+
};
|
|
14
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
15
|
+
...{ name: "AppPageDetail" },
|
|
16
|
+
__name: "AppPageDetail",
|
|
17
|
+
props: {
|
|
18
|
+
ctx: {},
|
|
19
|
+
id: {},
|
|
20
|
+
record: {},
|
|
21
|
+
listEmpty: { type: Boolean, default: false },
|
|
22
|
+
embedded: { type: Boolean, default: false },
|
|
23
|
+
detailApi: {},
|
|
24
|
+
detailTitle: {}
|
|
25
|
+
},
|
|
26
|
+
setup(__props) {
|
|
27
|
+
const props = __props;
|
|
28
|
+
const noop = () => {
|
|
29
|
+
};
|
|
30
|
+
const ctxFinal = computed(
|
|
31
|
+
() => props.ctx ?? {
|
|
32
|
+
id: props.id,
|
|
33
|
+
record: props.record,
|
|
34
|
+
index: 0,
|
|
35
|
+
total: 0,
|
|
36
|
+
hasPrev: false,
|
|
37
|
+
hasNext: false,
|
|
38
|
+
goPrev: noop,
|
|
39
|
+
goNext: noop,
|
|
40
|
+
refreshList: noop
|
|
41
|
+
}
|
|
42
|
+
);
|
|
43
|
+
const titleOf = (detailData) => {
|
|
44
|
+
const t = props.detailTitle;
|
|
45
|
+
if (!t) return "";
|
|
46
|
+
return typeof t === "function" ? t(detailData, ctxFinal.value.record) : t;
|
|
47
|
+
};
|
|
48
|
+
const detailParams = computed(() => ({
|
|
49
|
+
id: ctxFinal.value.id
|
|
50
|
+
}));
|
|
51
|
+
const detailScope = (data, loading = false) => ({
|
|
52
|
+
...ctxFinal.value,
|
|
53
|
+
data,
|
|
54
|
+
loading
|
|
55
|
+
});
|
|
56
|
+
return (_ctx, _cache) => {
|
|
57
|
+
return openBlock(), createBlock(unref(_sfc_main$1), {
|
|
58
|
+
tag: unref(AppPage),
|
|
59
|
+
disabled: __props.embedded,
|
|
60
|
+
class: "dc-app-page-detail"
|
|
61
|
+
}, {
|
|
62
|
+
default: withCtx(() => [
|
|
63
|
+
ctxFinal.value.id !== void 0 && !__props.detailApi && titleOf() ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(titleOf()), 1)) : createCommentVNode("", true),
|
|
64
|
+
ctxFinal.value.id !== void 0 && __props.detailApi ? (openBlock(), createBlock(unref(ViewLayout), {
|
|
65
|
+
key: 1,
|
|
66
|
+
api: __props.detailApi,
|
|
67
|
+
params: detailParams.value,
|
|
68
|
+
refreshToken: ctxFinal.value.id
|
|
69
|
+
}, {
|
|
70
|
+
default: withCtx(({ data, loading }) => [
|
|
71
|
+
titleOf(data) ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(titleOf(data)), 1)) : createCommentVNode("", true),
|
|
72
|
+
renderSlot(_ctx.$slots, "detail", normalizeProps(guardReactiveProps(detailScope(data, loading))), void 0, true)
|
|
73
|
+
]),
|
|
74
|
+
_: 3
|
|
75
|
+
}, 8, ["api", "params", "refreshToken"])) : ctxFinal.value.id !== void 0 ? renderSlot(_ctx.$slots, "detail", normalizeProps(mergeProps({ key: 2 }, detailScope())), void 0, true) : renderSlot(_ctx.$slots, "empty", {
|
|
76
|
+
key: 3,
|
|
77
|
+
listEmpty: __props.listEmpty
|
|
78
|
+
}, () => [
|
|
79
|
+
createVNode(unref(ElEmpty), { description: "请从列表选择一条数据" })
|
|
80
|
+
], true)
|
|
81
|
+
]),
|
|
82
|
+
_: 3
|
|
83
|
+
}, 8, ["tag", "disabled"]);
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
});
|
|
87
|
+
export {
|
|
88
|
+
_sfc_main as default
|
|
89
|
+
};
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
import { defineComponent, useModel, computed, shallowRef, provide, readonly, openBlock, createBlock, resolveDynamicComponent, createSlots, withCtx, renderSlot, normalizeProps, guardReactiveProps, mergeModels } from "vue";
|
|
2
|
+
import AppPageListDetailSplit from "./AppPageListDetailSplit.vue.mjs";
|
|
3
|
+
import _sfc_main$1 from "./AppPageListDetailSheet.vue.mjs";
|
|
4
|
+
import { useAppPageListDetailMode, useAppPageListDetailSequence, useAppPageListDetailQuerySync } from "./use-list-detail.mjs";
|
|
5
|
+
import { APP_PAGE_LIST_DETAIL_CONTEXT } from "../../inject/key.mjs";
|
|
6
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
7
|
+
...{ name: "AppPageListDetailLayout" },
|
|
8
|
+
__name: "AppPageListDetailLayout",
|
|
9
|
+
props: /* @__PURE__ */ mergeModels({
|
|
10
|
+
mode: { default: "auto" },
|
|
11
|
+
splitAt: { default: 1200 },
|
|
12
|
+
listWidth: { default: "clamp(280px, 28%, 420px)" },
|
|
13
|
+
autoActiveFirst: { type: Boolean, default: void 0 },
|
|
14
|
+
queryKey: {},
|
|
15
|
+
detailApi: {},
|
|
16
|
+
detailTitle: {},
|
|
17
|
+
sheetLayerType: { default: "drawer" },
|
|
18
|
+
sheetSize: { default: "70%" }
|
|
19
|
+
}, {
|
|
20
|
+
"activeId": {},
|
|
21
|
+
"activeIdModifiers": {},
|
|
22
|
+
"activeData": {},
|
|
23
|
+
"activeDataModifiers": {}
|
|
24
|
+
}),
|
|
25
|
+
emits: ["update:activeId", "update:activeData"],
|
|
26
|
+
setup(__props) {
|
|
27
|
+
const props = __props;
|
|
28
|
+
const activeId = useModel(__props, "activeId");
|
|
29
|
+
const activeData = useModel(__props, "activeData");
|
|
30
|
+
const { isSplit } = useAppPageListDetailMode({
|
|
31
|
+
mode: () => props.mode,
|
|
32
|
+
splitAt: () => props.splitAt
|
|
33
|
+
});
|
|
34
|
+
const formComponent = computed(
|
|
35
|
+
() => isSplit.value ? AppPageListDetailSplit : _sfc_main$1
|
|
36
|
+
);
|
|
37
|
+
const autoActiveFirst = computed(() => props.autoActiveFirst ?? isSplit.value);
|
|
38
|
+
const sequence = useAppPageListDetailSequence({
|
|
39
|
+
activeId,
|
|
40
|
+
activeData,
|
|
41
|
+
autoActiveFirst: () => autoActiveFirst.value
|
|
42
|
+
});
|
|
43
|
+
useAppPageListDetailQuerySync({
|
|
44
|
+
queryKey: () => props.queryKey,
|
|
45
|
+
activeId,
|
|
46
|
+
pendingId: sequence.pendingId
|
|
47
|
+
});
|
|
48
|
+
const listInstance = shallowRef(null);
|
|
49
|
+
const setListRef = (el) => {
|
|
50
|
+
listInstance.value = el ?? null;
|
|
51
|
+
};
|
|
52
|
+
const refreshList = () => {
|
|
53
|
+
var _a, _b;
|
|
54
|
+
(_b = (_a = listInstance.value) == null ? void 0 : _a.refresh) == null ? void 0 : _b.call(_a);
|
|
55
|
+
};
|
|
56
|
+
const listProps = computed(() => ({
|
|
57
|
+
activeId: activeId.value,
|
|
58
|
+
"onUpdate:activeId": (v) => {
|
|
59
|
+
activeId.value = v;
|
|
60
|
+
},
|
|
61
|
+
activeData: activeData.value,
|
|
62
|
+
"onUpdate:activeData": (v) => {
|
|
63
|
+
activeData.value = v;
|
|
64
|
+
},
|
|
65
|
+
onDataChange: sequence.onDataChange,
|
|
66
|
+
ref: setListRef
|
|
67
|
+
}));
|
|
68
|
+
const listEmpty = computed(() => sequence.total.value === 0);
|
|
69
|
+
const detailCtx = computed(() => ({
|
|
70
|
+
id: activeId.value,
|
|
71
|
+
record: activeData.value,
|
|
72
|
+
index: sequence.index.value,
|
|
73
|
+
total: sequence.total.value,
|
|
74
|
+
hasPrev: sequence.hasPrev.value,
|
|
75
|
+
hasNext: sequence.hasNext.value,
|
|
76
|
+
goPrev: sequence.goPrev,
|
|
77
|
+
goNext: sequence.goNext,
|
|
78
|
+
refreshList
|
|
79
|
+
}));
|
|
80
|
+
const onSheetClose = () => {
|
|
81
|
+
activeData.value = void 0;
|
|
82
|
+
activeId.value = void 0;
|
|
83
|
+
};
|
|
84
|
+
provide(APP_PAGE_LIST_DETAIL_CONTEXT, {
|
|
85
|
+
hasPrev: readonly(sequence.hasPrev),
|
|
86
|
+
hasNext: readonly(sequence.hasNext),
|
|
87
|
+
index: readonly(sequence.index),
|
|
88
|
+
total: readonly(sequence.total),
|
|
89
|
+
goPrev: sequence.goPrev,
|
|
90
|
+
goNext: sequence.goNext,
|
|
91
|
+
refreshList
|
|
92
|
+
});
|
|
93
|
+
return (_ctx, _cache) => {
|
|
94
|
+
return openBlock(), createBlock(resolveDynamicComponent(formComponent.value), {
|
|
95
|
+
listProps: listProps.value,
|
|
96
|
+
ctx: detailCtx.value,
|
|
97
|
+
listEmpty: listEmpty.value,
|
|
98
|
+
listWidth: __props.listWidth,
|
|
99
|
+
sheetLayerType: __props.sheetLayerType,
|
|
100
|
+
sheetSize: __props.sheetSize,
|
|
101
|
+
detailApi: __props.detailApi,
|
|
102
|
+
detailTitle: __props.detailTitle,
|
|
103
|
+
onClose: onSheetClose
|
|
104
|
+
}, createSlots({ _: 2 }, [
|
|
105
|
+
_ctx.$slots.list ? {
|
|
106
|
+
name: "list",
|
|
107
|
+
fn: withCtx((scope) => [
|
|
108
|
+
renderSlot(_ctx.$slots, "list", normalizeProps(guardReactiveProps(scope)))
|
|
109
|
+
]),
|
|
110
|
+
key: "0"
|
|
111
|
+
} : void 0,
|
|
112
|
+
_ctx.$slots.detail ? {
|
|
113
|
+
name: "detail",
|
|
114
|
+
fn: withCtx((scope) => [
|
|
115
|
+
renderSlot(_ctx.$slots, "detail", normalizeProps(guardReactiveProps(scope)))
|
|
116
|
+
]),
|
|
117
|
+
key: "1"
|
|
118
|
+
} : void 0,
|
|
119
|
+
_ctx.$slots.empty ? {
|
|
120
|
+
name: "empty",
|
|
121
|
+
fn: withCtx((scope) => [
|
|
122
|
+
renderSlot(_ctx.$slots, "empty", normalizeProps(guardReactiveProps(scope)))
|
|
123
|
+
]),
|
|
124
|
+
key: "2"
|
|
125
|
+
} : void 0,
|
|
126
|
+
_ctx.$slots.right ? {
|
|
127
|
+
name: "right",
|
|
128
|
+
fn: withCtx(() => [
|
|
129
|
+
renderSlot(_ctx.$slots, "right")
|
|
130
|
+
]),
|
|
131
|
+
key: "3"
|
|
132
|
+
} : void 0,
|
|
133
|
+
_ctx.$slots.top ? {
|
|
134
|
+
name: "top",
|
|
135
|
+
fn: withCtx(() => [
|
|
136
|
+
renderSlot(_ctx.$slots, "top")
|
|
137
|
+
]),
|
|
138
|
+
key: "4"
|
|
139
|
+
} : void 0,
|
|
140
|
+
_ctx.$slots.bottom ? {
|
|
141
|
+
name: "bottom",
|
|
142
|
+
fn: withCtx(() => [
|
|
143
|
+
renderSlot(_ctx.$slots, "bottom")
|
|
144
|
+
]),
|
|
145
|
+
key: "5"
|
|
146
|
+
} : void 0
|
|
147
|
+
]), 1064, ["listProps", "ctx", "listEmpty", "listWidth", "sheetLayerType", "sheetSize", "detailApi", "detailTitle"]);
|
|
148
|
+
};
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
export {
|
|
152
|
+
_sfc_main as default
|
|
153
|
+
};
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
import { defineComponent, computed, openBlock, createBlock, unref, createSlots, withCtx, renderSlot, createVNode, normalizeProps, guardReactiveProps } from "vue";
|
|
2
|
+
import ModalConfirm from "../modal/ModalConfirm.vue.mjs";
|
|
3
|
+
import AppPage from "../app-layout/AppPage.vue.mjs";
|
|
4
|
+
import AppPageDetail from "./AppPageDetail.vue.mjs";
|
|
5
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
6
|
+
...{ name: "AppPageListDetailSheet" },
|
|
7
|
+
__name: "AppPageListDetailSheet",
|
|
8
|
+
props: {
|
|
9
|
+
listProps: {},
|
|
10
|
+
ctx: {},
|
|
11
|
+
listEmpty: { type: Boolean },
|
|
12
|
+
sheetLayerType: {},
|
|
13
|
+
sheetSize: {},
|
|
14
|
+
listWidth: {},
|
|
15
|
+
detailApi: { type: Function },
|
|
16
|
+
detailTitle: { type: [String, Function] }
|
|
17
|
+
},
|
|
18
|
+
emits: ["close"],
|
|
19
|
+
setup(__props, { emit: __emit }) {
|
|
20
|
+
const props = __props;
|
|
21
|
+
const emit = __emit;
|
|
22
|
+
const drawerOpen = computed(() => props.ctx.id !== void 0);
|
|
23
|
+
const onDrawerShowChange = (visible) => {
|
|
24
|
+
if (!visible) emit("close");
|
|
25
|
+
};
|
|
26
|
+
return (_ctx, _cache) => {
|
|
27
|
+
return openBlock(), createBlock(unref(AppPage), { class: "dc-app-page-list-detail dc-app-page-list-detail_sheet" }, createSlots({
|
|
28
|
+
default: withCtx(() => [
|
|
29
|
+
renderSlot(_ctx.$slots, "list", { listProps: __props.listProps }),
|
|
30
|
+
createVNode(unref(ModalConfirm), {
|
|
31
|
+
class: "dc-app-page-list-detail-sheet__drawer",
|
|
32
|
+
layerType: __props.sheetLayerType,
|
|
33
|
+
direction: "rtl",
|
|
34
|
+
show: drawerOpen.value,
|
|
35
|
+
width: __props.sheetSize,
|
|
36
|
+
hiddenFooter: "",
|
|
37
|
+
"destroy-on-close": "",
|
|
38
|
+
"onUpdate:show": onDrawerShowChange
|
|
39
|
+
}, {
|
|
40
|
+
default: withCtx(() => [
|
|
41
|
+
createVNode(AppPageDetail, {
|
|
42
|
+
embedded: "",
|
|
43
|
+
ctx: __props.ctx,
|
|
44
|
+
listEmpty: __props.listEmpty,
|
|
45
|
+
detailApi: __props.detailApi,
|
|
46
|
+
detailTitle: __props.detailTitle
|
|
47
|
+
}, createSlots({ _: 2 }, [
|
|
48
|
+
_ctx.$slots.detail ? {
|
|
49
|
+
name: "detail",
|
|
50
|
+
fn: withCtx((scope) => [
|
|
51
|
+
renderSlot(_ctx.$slots, "detail", normalizeProps(guardReactiveProps(scope)))
|
|
52
|
+
]),
|
|
53
|
+
key: "0"
|
|
54
|
+
} : void 0,
|
|
55
|
+
_ctx.$slots.empty ? {
|
|
56
|
+
name: "empty",
|
|
57
|
+
fn: withCtx((scope) => [
|
|
58
|
+
renderSlot(_ctx.$slots, "empty", normalizeProps(guardReactiveProps(scope)))
|
|
59
|
+
]),
|
|
60
|
+
key: "1"
|
|
61
|
+
} : void 0
|
|
62
|
+
]), 1032, ["ctx", "listEmpty", "detailApi", "detailTitle"])
|
|
63
|
+
]),
|
|
64
|
+
_: 3
|
|
65
|
+
}, 8, ["layerType", "show", "width"])
|
|
66
|
+
]),
|
|
67
|
+
_: 2
|
|
68
|
+
}, [
|
|
69
|
+
_ctx.$slots.top ? {
|
|
70
|
+
name: "top",
|
|
71
|
+
fn: withCtx(() => [
|
|
72
|
+
renderSlot(_ctx.$slots, "top")
|
|
73
|
+
]),
|
|
74
|
+
key: "0"
|
|
75
|
+
} : void 0,
|
|
76
|
+
_ctx.$slots.bottom ? {
|
|
77
|
+
name: "bottom",
|
|
78
|
+
fn: withCtx(() => [
|
|
79
|
+
renderSlot(_ctx.$slots, "bottom")
|
|
80
|
+
]),
|
|
81
|
+
key: "1"
|
|
82
|
+
} : void 0,
|
|
83
|
+
_ctx.$slots.right ? {
|
|
84
|
+
name: "right",
|
|
85
|
+
fn: withCtx(() => [
|
|
86
|
+
renderSlot(_ctx.$slots, "right")
|
|
87
|
+
]),
|
|
88
|
+
key: "2"
|
|
89
|
+
} : void 0
|
|
90
|
+
]), 1024);
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
});
|
|
94
|
+
export {
|
|
95
|
+
_sfc_main as default
|
|
96
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import _sfc_main from "./AppPageListDetailSplit.vue2.mjs";
|
|
2
|
+
/* empty css */
|
|
3
|
+
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
+
const AppPageListDetailSplit = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-19f0f56d"]]);
|
|
5
|
+
export {
|
|
6
|
+
AppPageListDetailSplit as default
|
|
7
|
+
};
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { defineComponent, computed, openBlock, createBlock, unref, createSlots, withCtx, createVNode, renderSlot, normalizeProps, guardReactiveProps, createElementVNode, normalizeStyle } from "vue";
|
|
2
|
+
import AppPage from "../app-layout/AppPage.vue.mjs";
|
|
3
|
+
import AppPageDetail from "./AppPageDetail.vue.mjs";
|
|
4
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
5
|
+
...{ name: "AppPageListDetailSplit" },
|
|
6
|
+
__name: "AppPageListDetailSplit",
|
|
7
|
+
props: {
|
|
8
|
+
listProps: {},
|
|
9
|
+
ctx: {},
|
|
10
|
+
listEmpty: { type: Boolean },
|
|
11
|
+
listWidth: {},
|
|
12
|
+
sheetSize: {},
|
|
13
|
+
sheetLayerType: {},
|
|
14
|
+
detailApi: { type: Function },
|
|
15
|
+
detailTitle: { type: [String, Function] }
|
|
16
|
+
},
|
|
17
|
+
setup(__props) {
|
|
18
|
+
const props = __props;
|
|
19
|
+
const listStyle = computed(() => ({ width: props.listWidth }));
|
|
20
|
+
return (_ctx, _cache) => {
|
|
21
|
+
return openBlock(), createBlock(unref(AppPage), { class: "dc-app-page-list-detail dc-app-page-list-detail_split" }, createSlots({
|
|
22
|
+
left: withCtx(() => [
|
|
23
|
+
createElementVNode("div", {
|
|
24
|
+
class: "dc-app-page-list-detail-split__list",
|
|
25
|
+
style: normalizeStyle(listStyle.value)
|
|
26
|
+
}, [
|
|
27
|
+
renderSlot(_ctx.$slots, "list", { listProps: __props.listProps }, void 0, true)
|
|
28
|
+
], 4)
|
|
29
|
+
]),
|
|
30
|
+
default: withCtx(() => [
|
|
31
|
+
createVNode(AppPageDetail, {
|
|
32
|
+
embedded: "",
|
|
33
|
+
ctx: __props.ctx,
|
|
34
|
+
listEmpty: __props.listEmpty,
|
|
35
|
+
detailApi: __props.detailApi,
|
|
36
|
+
detailTitle: __props.detailTitle
|
|
37
|
+
}, createSlots({ _: 2 }, [
|
|
38
|
+
_ctx.$slots.detail ? {
|
|
39
|
+
name: "detail",
|
|
40
|
+
fn: withCtx((scope) => [
|
|
41
|
+
renderSlot(_ctx.$slots, "detail", normalizeProps(guardReactiveProps(scope)), void 0, true)
|
|
42
|
+
]),
|
|
43
|
+
key: "0"
|
|
44
|
+
} : void 0,
|
|
45
|
+
_ctx.$slots.empty ? {
|
|
46
|
+
name: "empty",
|
|
47
|
+
fn: withCtx((scope) => [
|
|
48
|
+
renderSlot(_ctx.$slots, "empty", normalizeProps(guardReactiveProps(scope)), void 0, true)
|
|
49
|
+
]),
|
|
50
|
+
key: "1"
|
|
51
|
+
} : void 0
|
|
52
|
+
]), 1032, ["ctx", "listEmpty", "detailApi", "detailTitle"])
|
|
53
|
+
]),
|
|
54
|
+
_: 2
|
|
55
|
+
}, [
|
|
56
|
+
_ctx.$slots.top ? {
|
|
57
|
+
name: "top",
|
|
58
|
+
fn: withCtx(() => [
|
|
59
|
+
renderSlot(_ctx.$slots, "top", {}, void 0, true)
|
|
60
|
+
]),
|
|
61
|
+
key: "0"
|
|
62
|
+
} : void 0,
|
|
63
|
+
_ctx.$slots.bottom ? {
|
|
64
|
+
name: "bottom",
|
|
65
|
+
fn: withCtx(() => [
|
|
66
|
+
renderSlot(_ctx.$slots, "bottom", {}, void 0, true)
|
|
67
|
+
]),
|
|
68
|
+
key: "1"
|
|
69
|
+
} : void 0,
|
|
70
|
+
_ctx.$slots.right ? {
|
|
71
|
+
name: "right",
|
|
72
|
+
fn: withCtx(() => [
|
|
73
|
+
renderSlot(_ctx.$slots, "right", {}, void 0, true)
|
|
74
|
+
]),
|
|
75
|
+
key: "2"
|
|
76
|
+
} : void 0
|
|
77
|
+
]), 1024);
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
});
|
|
81
|
+
export {
|
|
82
|
+
_sfc_main as default
|
|
83
|
+
};
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { ref, watch, computed, shallowRef } from "vue";
|
|
2
|
+
import { useRoute, useRouter } from "vue-router";
|
|
3
|
+
import { useActivated } from "../../hooks/activated.mjs";
|
|
4
|
+
function useAppPageListDetailMode(options) {
|
|
5
|
+
const viewportWide = ref(true);
|
|
6
|
+
const bind = () => {
|
|
7
|
+
if (typeof window === "undefined" || !window.matchMedia) return void 0;
|
|
8
|
+
const mql = window.matchMedia(`(min-width: ${options.splitAt()}px)`);
|
|
9
|
+
const apply = () => {
|
|
10
|
+
viewportWide.value = mql.matches;
|
|
11
|
+
};
|
|
12
|
+
apply();
|
|
13
|
+
mql.addEventListener("change", apply);
|
|
14
|
+
return () => mql.removeEventListener("change", apply);
|
|
15
|
+
};
|
|
16
|
+
let unbind;
|
|
17
|
+
const rebind = () => {
|
|
18
|
+
unbind == null ? void 0 : unbind();
|
|
19
|
+
unbind = bind();
|
|
20
|
+
};
|
|
21
|
+
useActivated((info) => {
|
|
22
|
+
if (info.isActivated) rebind();
|
|
23
|
+
else {
|
|
24
|
+
unbind == null ? void 0 : unbind();
|
|
25
|
+
unbind = void 0;
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
watch(() => options.splitAt(), rebind);
|
|
29
|
+
const isSplit = computed(() => {
|
|
30
|
+
const m = options.mode();
|
|
31
|
+
if (m === "split") return true;
|
|
32
|
+
if (m === "sheet") return false;
|
|
33
|
+
return viewportWide.value;
|
|
34
|
+
});
|
|
35
|
+
return { isSplit };
|
|
36
|
+
}
|
|
37
|
+
function useAppPageListDetailSequence(options) {
|
|
38
|
+
const { activeId, activeData, autoActiveFirst } = options;
|
|
39
|
+
const rows = shallowRef([]);
|
|
40
|
+
const pendingId = ref(void 0);
|
|
41
|
+
const rawIndex = computed(() => {
|
|
42
|
+
const cur = activeData.value;
|
|
43
|
+
if (!cur) return -1;
|
|
44
|
+
return rows.value.indexOf(cur);
|
|
45
|
+
});
|
|
46
|
+
const total = computed(() => rows.value.length);
|
|
47
|
+
const index = computed(() => rawIndex.value < 0 ? 0 : rawIndex.value + 1);
|
|
48
|
+
const hasPrev = computed(() => rawIndex.value > 0);
|
|
49
|
+
const hasNext = computed(
|
|
50
|
+
() => rawIndex.value >= 0 && rawIndex.value < rows.value.length - 1
|
|
51
|
+
);
|
|
52
|
+
const goPrev = () => {
|
|
53
|
+
if (!hasPrev.value) return;
|
|
54
|
+
activeData.value = rows.value[rawIndex.value - 1];
|
|
55
|
+
};
|
|
56
|
+
const goNext = () => {
|
|
57
|
+
if (!hasNext.value) return;
|
|
58
|
+
activeData.value = rows.value[rawIndex.value + 1];
|
|
59
|
+
};
|
|
60
|
+
const onDataChange = (next) => {
|
|
61
|
+
rows.value = next;
|
|
62
|
+
if (pendingId.value !== void 0 && activeId.value === void 0) {
|
|
63
|
+
activeId.value = pendingId.value;
|
|
64
|
+
pendingId.value = void 0;
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
if (autoActiveFirst() && activeId.value === void 0 && next.length) {
|
|
68
|
+
activeData.value = next[0];
|
|
69
|
+
}
|
|
70
|
+
};
|
|
71
|
+
return {
|
|
72
|
+
rows,
|
|
73
|
+
onDataChange,
|
|
74
|
+
index,
|
|
75
|
+
total,
|
|
76
|
+
hasPrev,
|
|
77
|
+
hasNext,
|
|
78
|
+
goPrev,
|
|
79
|
+
goNext,
|
|
80
|
+
pendingId
|
|
81
|
+
};
|
|
82
|
+
}
|
|
83
|
+
function useAppPageListDetailQuerySync(options) {
|
|
84
|
+
const route = useRoute();
|
|
85
|
+
const router = useRouter();
|
|
86
|
+
useActivated((info) => {
|
|
87
|
+
var _a;
|
|
88
|
+
if (!info.isActivated) return;
|
|
89
|
+
const key = options.queryKey();
|
|
90
|
+
if (!key || !route) return;
|
|
91
|
+
const raw = (_a = route.query) == null ? void 0 : _a[key];
|
|
92
|
+
const value = Array.isArray(raw) ? raw[0] : raw;
|
|
93
|
+
if (value !== null && value !== void 0 && value !== "" && options.activeId.value === void 0) {
|
|
94
|
+
options.pendingId.value = value;
|
|
95
|
+
}
|
|
96
|
+
});
|
|
97
|
+
watch(options.activeId, (id) => {
|
|
98
|
+
const key = options.queryKey();
|
|
99
|
+
if (!key || !router || !route) return;
|
|
100
|
+
const next = { ...route.query };
|
|
101
|
+
if (id === void 0) delete next[key];
|
|
102
|
+
else next[key] = String(id);
|
|
103
|
+
router.replace({ query: next });
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
export {
|
|
107
|
+
useAppPageListDetailMode,
|
|
108
|
+
useAppPageListDetailQuerySync,
|
|
109
|
+
useAppPageListDetailSequence
|
|
110
|
+
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _sfc_main from "./PanelEditSwitch.vue2.mjs";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
-
const PanelEditSwitch = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
4
|
+
const PanelEditSwitch = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-17f3b3db"]]);
|
|
5
5
|
export {
|
|
6
6
|
PanelEditSwitch as default
|
|
7
7
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _sfc_main from "./TableMain.vue2.mjs";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
-
const TableMain = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
4
|
+
const TableMain = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ab2d031c"]]);
|
|
5
5
|
export {
|
|
6
6
|
TableMain as default
|
|
7
7
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { defineComponent, useCssVars, unref, useModel, useAttrs, ref, computed, markRaw, shallowRef, onMounted, onActivated,
|
|
1
|
+
import { defineComponent, useCssVars, unref, useModel, useAttrs, ref, computed, markRaw, shallowRef, watch, onMounted, onActivated, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, createVNode, mergeProps, createCommentVNode, resolveDynamicComponent, Fragment, renderList, createSlots, renderSlot, createTextVNode, toDisplayString, normalizeProps, guardReactiveProps, withDirectives, createElementVNode, vShow, mergeModels } from "vue";
|
|
2
|
+
import { useActiveRecord, activeRecordValueOf } from "../../hooks/use-active-record.mjs";
|
|
2
3
|
import _cloneDeep from "lodash/cloneDeep";
|
|
3
4
|
import _omit from "lodash/omit";
|
|
4
5
|
import _set from "lodash/set";
|
|
@@ -44,6 +45,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
44
45
|
viewportHeight: {},
|
|
45
46
|
parentChannel: {}
|
|
46
47
|
}, {
|
|
48
|
+
"activeId": {},
|
|
49
|
+
"activeIdModifiers": {},
|
|
50
|
+
"activeData": {},
|
|
51
|
+
"activeDataModifiers": {},
|
|
47
52
|
"isAutoRefresh": { type: Boolean },
|
|
48
53
|
"isAutoRefreshModifiers": {},
|
|
49
54
|
"refreshInterval": {},
|
|
@@ -51,13 +56,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
51
56
|
"customView": { type: Boolean, ...{ default: false } },
|
|
52
57
|
"customViewModifiers": {}
|
|
53
58
|
}),
|
|
54
|
-
emits: /* @__PURE__ */ mergeModels(["pageChange", "pageSizeChange", "dataChange", "loadingChange", "pageInfoChange"], ["update:isAutoRefresh", "update:refreshInterval", "update:customView"]),
|
|
59
|
+
emits: /* @__PURE__ */ mergeModels(["pageChange", "pageSizeChange", "dataChange", "loadingChange", "pageInfoChange"], ["update:activeId", "update:activeData", "update:isAutoRefresh", "update:refreshInterval", "update:customView"]),
|
|
55
60
|
setup(__props, { expose: __expose, emit: __emit }) {
|
|
56
61
|
useCssVars((_ctx) => ({
|
|
57
|
-
"
|
|
62
|
+
"v4d2ea4ab": unref(fillMinHeightCss)
|
|
58
63
|
}));
|
|
59
64
|
const props = __props;
|
|
60
65
|
const emits = __emit;
|
|
66
|
+
const activeId = useModel(__props, "activeId");
|
|
67
|
+
const activeData = useModel(__props, "activeData");
|
|
61
68
|
const isAutoRefresh = useModel(__props, "isAutoRefresh");
|
|
62
69
|
const refreshInterval = useModel(__props, "refreshInterval");
|
|
63
70
|
const customView = useModel(__props, "customView");
|
|
@@ -235,6 +242,50 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
235
242
|
const assertRowKey = (rowKey) => {
|
|
236
243
|
return rowKey;
|
|
237
244
|
};
|
|
245
|
+
const activeKeyOf = (row) => activeRecordValueOf(row, assertRowKey(props.rowKey));
|
|
246
|
+
const { setActive } = useActiveRecord({
|
|
247
|
+
// `list` 是 ref<T[]>,读出为 UnwrapRefSimple<T>[](泛型下不等价)——与本文件既有断言同风格
|
|
248
|
+
data: () => list.value,
|
|
249
|
+
keyOf: activeKeyOf,
|
|
250
|
+
activeId,
|
|
251
|
+
activeData,
|
|
252
|
+
name: "TableMain",
|
|
253
|
+
enabled: () => !customView.value
|
|
254
|
+
});
|
|
255
|
+
const activeBindings = computed(
|
|
256
|
+
() => customView.value ? {
|
|
257
|
+
activeId: activeId.value,
|
|
258
|
+
"onUpdate:activeId": (v) => {
|
|
259
|
+
activeId.value = v;
|
|
260
|
+
},
|
|
261
|
+
activeData: activeData.value,
|
|
262
|
+
"onUpdate:activeData": (v) => {
|
|
263
|
+
activeData.value = v;
|
|
264
|
+
}
|
|
265
|
+
} : {
|
|
266
|
+
// [MUST] 链式转发而非覆盖:`highlightCurrentRow` 一直是开的,消费方在 0.26 前可以直接
|
|
267
|
+
// `@current-change` / `:table-props="{ onCurrentChange }"` 拿到行切换事件(经 attrs 直达
|
|
268
|
+
// ElTable)。内部接管后若只写自己的 handler,会把下游回调**静默吞掉**(无报错、无告警)。
|
|
269
|
+
onCurrentChange: (...args) => {
|
|
270
|
+
var _a, _b;
|
|
271
|
+
setActive(args[0] ?? void 0);
|
|
272
|
+
(_b = (_a = tablePropsFinal.value).onCurrentChange) == null ? void 0 : _b.call(_a, ...args);
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
);
|
|
276
|
+
const viewBindings = computed(() => ({
|
|
277
|
+
...tablePropsFinal.value,
|
|
278
|
+
...activeBindings.value
|
|
279
|
+
}));
|
|
280
|
+
watch(
|
|
281
|
+
activeData,
|
|
282
|
+
(row) => {
|
|
283
|
+
var _a;
|
|
284
|
+
if (customView.value) return;
|
|
285
|
+
(_a = elTable.value) == null ? void 0 : _a.setCurrentRow(row);
|
|
286
|
+
},
|
|
287
|
+
{ flush: "post" }
|
|
288
|
+
);
|
|
238
289
|
const expose = {
|
|
239
290
|
refresh,
|
|
240
291
|
reload,
|
|
@@ -347,9 +398,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
347
398
|
ref: elTable,
|
|
348
399
|
class: "table-main-table",
|
|
349
400
|
stripe: "",
|
|
350
|
-
border: "",
|
|
351
401
|
highlightCurrentRow: ""
|
|
352
|
-
},
|
|
402
|
+
}, viewBindings.value, {
|
|
353
403
|
maxHeight: tableMaxHeight.value,
|
|
354
404
|
data: list.value,
|
|
355
405
|
rowKey: assertRowKey(__props.rowKey),
|