bkui-vue 0.0.1-beta.45 → 0.0.1-beta.46
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/dist/index.cjs.js +26 -26
- package/dist/index.esm.js +388 -95
- package/dist/index.umd.js +27 -27
- package/dist/style.css +1 -1
- package/lib/button/index.js +1 -1
- package/lib/dialog/dialog.css +3 -0
- package/lib/dialog/dialog.d.ts +89 -17
- package/lib/dialog/dialog.less +4 -0
- package/lib/dialog/dialog.variable.css +3 -0
- package/lib/dialog/index.d.ts +191 -36
- package/lib/dialog/index.js +1 -1
- package/lib/icon/funnel.d.ts +4 -0
- package/lib/icon/funnel.js +1 -0
- package/lib/icon/index.d.ts +1 -0
- package/lib/modal/index.d.ts +149 -1
- package/lib/modal/modal.css +20 -0
- package/lib/modal/modal.d.ts +58 -0
- package/lib/modal/modal.less +25 -0
- package/lib/modal/modal.variable.css +20 -0
- package/lib/modal/props.mixin.d.ts +26 -0
- package/lib/popover/index.d.ts +33 -2
- package/lib/popover/popover.d.ts +16 -1
- package/lib/popover/props.d.ts +12 -0
- package/lib/sideslider/index.d.ts +123 -1
- package/lib/sideslider/sideslider.d.ts +58 -0
- package/lib/switcher/switcher.less +2 -0
- package/lib/tab/index.d.ts +1 -1
- package/lib/tab/tab-panel.d.ts +1 -1
- package/lib/table/plugins/head-filter.css +68 -0
- package/lib/table/plugins/head-filter.less +83 -0
- package/lib/table/plugins/head-filter.variable.css +162 -0
- package/lib/table/plugins/head-sort.css +22 -0
- package/lib/table/plugins/head-sort.less +28 -0
- package/lib/table/plugins/head-sort.variable.css +116 -0
- package/lib/table/props.d.ts +8 -1
- package/lib/table/render.d.ts +10 -15
- package/lib/table/table.css +4 -26
- package/lib/table/table.d.ts +1 -0
- package/lib/table/table.less +7 -27
- package/lib/table/table.variable.css +4 -26
- package/lib/table/utils.d.ts +10 -1
- package/package.json +29 -16
- package/lib/icon/index.js +0 -1
- package/lib/icon/info-line.js +0 -1
- package/lib/icon/info.js +0 -1
- package/lib/icon/left-shape.js +0 -1
- package/lib/icon/play-shape.js +0 -1
- package/lib/icon/plus.js +0 -1
- package/lib/icon/qq.js +0 -1
- package/lib/icon/right-shape.js +0 -1
- package/lib/icon/search.js +0 -1
- package/lib/icon/share.js +0 -1
- package/lib/icon/spinner.js +0 -1
- package/lib/icon/success.js +0 -1
- package/lib/icon/switcher-loading.js +0 -1
- package/lib/icon/text-file.js +0 -1
- package/lib/icon/tree-application-shape.js +0 -1
- package/lib/icon/unvisible.js +0 -1
- package/lib/icon/up-shape.js +0 -1
- package/lib/icon/warn.js +0 -1
- package/lib/icon/weixin.js +0 -1
- package/lib/input/index.js +0 -1
- package/lib/link/index.js +0 -1
- package/lib/loading/index.js +0 -1
- package/lib/menu/index.js +0 -1
- package/lib/message/index.js +0 -1
- package/lib/modal/index.js +0 -1
- package/lib/navigation/index.js +0 -1
- package/lib/notify/index.js +0 -1
- package/lib/pagination/index.js +0 -1
- package/lib/popover/index.js +0 -1
- package/lib/process/index.js +0 -1
- package/lib/progress/index.js +0 -1
- package/lib/radio/index.js +0 -1
- package/lib/rate/index.js +0 -1
- package/lib/resize-layout/index.js +0 -1
- package/lib/select/index.js +0 -1
- package/lib/shared/index.js +0 -1
- package/lib/sideslider/index.js +0 -1
- package/lib/slider/index.js +0 -1
- package/lib/steps/index.js +0 -1
- package/lib/swiper/index.js +0 -1
- package/lib/switcher/index.js +0 -1
- package/lib/tab/index.js +0 -1
- package/lib/table/index.js +0 -1
- package/lib/tag/index.js +0 -1
- package/lib/tag-input/index.js +0 -1
- package/lib/timeline/index.js +0 -1
- package/lib/transfer/index.js +0 -1
- package/lib/tree/index.js +0 -1
- package/lib/virtual-render/index.js +0 -1
package/dist/index.esm.js
CHANGED
@@ -33,7 +33,7 @@ var __publicField = (obj, key, value) => {
|
|
33
33
|
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
34
34
|
return value;
|
35
35
|
};
|
36
|
-
import { createVNode, h as h$1, mergeProps, defineComponent, reactive, ref, computed, watch, onMounted, onBeforeUnmount, Transition, getCurrentInstance, provide, inject,
|
36
|
+
import { createVNode, h as h$1, mergeProps, defineComponent, reactive, ref, computed, watch, onMounted, onBeforeUnmount, Transition, getCurrentInstance, provide, inject, nextTick, isVNode, createTextVNode, Fragment, toRefs, customRef, onBeforeMount, withDirectives, vShow, toRef, unref, resolveDirective, vModelText, watchEffect, onUpdated, render, onUnmounted, Teleport } from "vue";
|
37
37
|
var reset = "";
|
38
38
|
var alert = "";
|
39
39
|
var backtop = "";
|
@@ -2370,39 +2370,48 @@ bkIcon.inheritAttrs = false;
|
|
2370
2370
|
bkIcon.displayName = "bkIcon";
|
2371
2371
|
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 744.64L789.6 462.72 880 554.56 512 928 144 554.56 234.4 462.72 512 744.64z"}},{"type":"element","name":"path","attributes":{"d":"M144 187.68L234.4 96 512 377.76 789.6 96 880 187.68 512 561.28 144 187.68z"}}]}');
|
2372
2372
|
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M279.36 512L561.28 789.6 469.44 880 96 512 469.44 144 561.28 234.4 279.36 512z"}},{"type":"element","name":"path","attributes":{"d":"M836.32 144L928 234.4 646.08 512 928 789.6 836.32 880 462.72 512 836.32 144z"}}]}');
|
2373
|
-
const data$
|
2373
|
+
const data$y = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M697.6 281.6l48 48-176 176 176 176-48 48-224-224L697.6 281.6z"}},{"type":"element","name":"path","attributes":{"d":"M505.6 281.6l48 48-176 176 176 176-48 48-224-224L505.6 281.6z"}}]}');
|
2374
2374
|
const angleDoubleLeft = (props, context) => {
|
2375
2375
|
const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
|
2376
2376
|
return createVNode(bkIcon, mergeProps(p2, {
|
2377
|
-
"data": data$
|
2377
|
+
"data": data$y,
|
2378
2378
|
"name": "angleDoubleLeft"
|
2379
2379
|
}), null);
|
2380
2380
|
};
|
2381
2381
|
angleDoubleLeft.displayName = "angleDoubleLeft";
|
2382
2382
|
angleDoubleLeft.inheritAttrs = false;
|
2383
2383
|
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M744.64 512L462.72 789.6 554.56 880 928 512 554.56 144 462.72 234.4 744.64 512z"}},{"type":"element","name":"path","attributes":{"d":"M187.68 144L96 234.4 377.76 512 96 789.6 187.68 880 561.28 512 187.68 144z"}}]}');
|
2384
|
-
const data$
|
2384
|
+
const data$x = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M358.4 729.6l-48-48 176-176-176-176 48-48 224 224L358.4 729.6z"}},{"type":"element","name":"path","attributes":{"d":"M550.4 729.6l-48-48 176-176-176-176 48-48 224 224L550.4 729.6z"}}]}');
|
2385
2385
|
const angleDoubleRight = (props, context) => {
|
2386
2386
|
const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
|
2387
2387
|
return createVNode(bkIcon, mergeProps(p2, {
|
2388
|
-
"data": data$
|
2388
|
+
"data": data$x,
|
2389
2389
|
"name": "angleDoubleRight"
|
2390
2390
|
}), null);
|
2391
2391
|
};
|
2392
2392
|
angleDoubleRight.displayName = "angleDoubleRight";
|
2393
2393
|
angleDoubleRight.inheritAttrs = false;
|
2394
2394
|
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 279.36L789.6 561.28 880 469.44 512 96 144 469.44 234.4 561.28 512 279.36z"}},{"type":"element","name":"path","attributes":{"d":"M144 836.32L234.4 928 512 646.08 789.6 928 880 836.32 512 462.72 144 836.32z"}}]}');
|
2395
|
-
const data$
|
2395
|
+
const data$w = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 256L96 704 187.04 704 512 704 836.96 704 928 704 512 256z"}}]}');
|
2396
2396
|
const angleDownFill = (props, context) => {
|
2397
2397
|
const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
|
2398
2398
|
return createVNode(bkIcon, mergeProps(p2, {
|
2399
|
-
"data": data$
|
2399
|
+
"data": data$w,
|
2400
2400
|
"name": "angleDownFill"
|
2401
2401
|
}), null);
|
2402
2402
|
};
|
2403
2403
|
angleDownFill.displayName = "angleDownFill";
|
2404
2404
|
angleDownFill.inheritAttrs = false;
|
2405
|
-
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 762.56L98.72 349.28 189.28 258.72 512 581.44 834.72 258.72 925.28 349.28 512 762.56z"}}]}');
|
2405
|
+
const data$v = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 762.56L98.72 349.28 189.28 258.72 512 581.44 834.72 258.72 925.28 349.28 512 762.56z"}}]}');
|
2406
|
+
const angleDownLine = (props, context) => {
|
2407
|
+
const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
|
2408
|
+
return createVNode(bkIcon, mergeProps(p2, {
|
2409
|
+
"data": data$v,
|
2410
|
+
"name": "angleDownLine"
|
2411
|
+
}), null);
|
2412
|
+
};
|
2413
|
+
angleDownLine.displayName = "angleDownLine";
|
2414
|
+
angleDownLine.inheritAttrs = false;
|
2406
2415
|
const data$u = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M288 448L336 400 512 576 688 400 736 448 512 672z"}}]}');
|
2407
2416
|
const angleDown = (props, context) => {
|
2408
2417
|
const p2 = __spreadValues(__spreadValues({}, props), context.attrs);
|
@@ -2589,6 +2598,7 @@ const folder = (props, context) => {
|
|
2589
2598
|
};
|
2590
2599
|
folder.displayName = "folder";
|
2591
2600
|
folder.inheritAttrs = false;
|
2601
|
+
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 1024 1024","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;"},"elements":[{"type":"element","name":"path","attributes":{"d":"M860.8 128H163.2a32 32 0 0 0-27.36 52l295.2 336 0.96 0V896l160-82.72V516.8l0.96 0 295.2-336A32 32 0 0 0 860.8 128Z"}}]}');
|
2592
2602
|
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64C264 64 64 264 64 512c0 57.6 11.2 113.6 32 166.4V896c0 17.6 14.4 32 32 32h217.6C576 1019.2 836.8 908.8 928 678.4S908.8 187.2 678.4 96C625.6 75.2 569.6 64 512 64zM500.8 721.6c-27.2 0-48-20.8-48-48s20.8-48 48-48c27.2 0 48 20.8 48 48S528 721.6 500.8 721.6zM587.2 507.2c-36.8 20.8-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8c1.6-70.4 49.6-118.4 136-118.4 80 0 132.8 44.8 132.8 110.4C648 454.4 627.2 484.8 587.2 507.2z"}}]}');
|
2593
2603
|
JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zM500.8 721.6c-27.2 0-48-20.8-48-48s20.8-48 48-48c27.2 0 48 20.8 48 48S528 721.6 500.8 721.6zM587.2 507.2c-36.8 20.8-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8c1.6-70.4 49.6-118.4 136-118.4 80 0 132.8 44.8 132.8 110.4C648 454.4 627.2 484.8 587.2 507.2z"}}]}');
|
2594
2604
|
const data$c = JSON.parse('{"type":"element","name":"svg","attributes":{"xmlns":"http://www.w3.org/2000/svg","class":"bk-icon","style":"width: 1em; height: 1em; vertical-align: middle;fill: currentColor;overflow: hidden;","overflow":"hidden","viewBox":"0 0 1024 1024"},"elements":[{"type":"element","name":"path","attributes":{"d":"M512 128c212.8 0 384 171.2 384 384S724.8 896 512 896 128 724.8 128 512 299.2 128 512 128M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64z"}},{"type":"element","name":"path","attributes":{"d":"M548.8 673.6A48 48 0 0 1 500.8 721.6 48 48 0 0 1 452.8 673.6 48 48 0 0 1 548.8 673.6z"}},{"type":"element","name":"path","attributes":{"d":"M513.6 302.4c80 0 132.8 44.8 132.8 110.4 0 41.6-20.8 72-60.8 96-40 24-48 35.2-48 62.4v14.4H464v-16c-3.2-44.8 11.2-70.4 51.2-92.8 36.8-22.4 48-35.2 48-60.8s-20.8-44.8-52.8-44.8c-28.8-1.6-52.8 19.2-56 48 0 1.6 0 1.6 0 3.2h-76.8C377.6 352 427.2 302.4 513.6 302.4z"}}]}');
|
@@ -8510,13 +8520,13 @@ var Component$r = defineComponent({
|
|
8510
8520
|
var _a, _b;
|
8511
8521
|
return createVNode("div", {
|
8512
8522
|
"class": loadingWrapperCls.value
|
8513
|
-
}, [props.loading &&
|
8523
|
+
}, [props.loading && [createVNode("div", {
|
8514
8524
|
"class": containerCls.value
|
8515
8525
|
}, [indicator.value, hasTitle.value && createVNode("div", {
|
8516
8526
|
"class": "bk-loading-title"
|
8517
8527
|
}, [props.title])]), ctx.slots.default && createVNode("div", {
|
8518
8528
|
"class": "bk-loading-mask"
|
8519
|
-
}, null)]
|
8529
|
+
}, null)], (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]);
|
8520
8530
|
};
|
8521
8531
|
}
|
8522
8532
|
});
|
@@ -8572,6 +8582,8 @@ var Component$q = defineComponent({
|
|
8572
8582
|
});
|
8573
8583
|
const loadingSize = computed(() => props.size === BkLoadingSize.Small ? BkLoadingSize.Mini : BkLoadingSize.Small);
|
8574
8584
|
const handleClick = () => {
|
8585
|
+
if (props.loading)
|
8586
|
+
return;
|
8575
8587
|
emit("click");
|
8576
8588
|
};
|
8577
8589
|
const handleMouseOver = () => {
|
@@ -8592,12 +8604,13 @@ var Component$q = defineComponent({
|
|
8592
8604
|
"onClick": handleClick,
|
8593
8605
|
"onMouseover": handleMouseOver,
|
8594
8606
|
"onMouseleave": handleMouseout
|
8595
|
-
}), [props.loading
|
8607
|
+
}), [props.loading ? createVNode(BkLoading, {
|
8608
|
+
"loading": true,
|
8596
8609
|
"class": `${btnClsPrefix}-loading`,
|
8597
8610
|
"mode": props.laodingMode,
|
8598
8611
|
"theme": loadingTheme.value,
|
8599
8612
|
"size": loadingSize.value
|
8600
|
-
}, null)
|
8613
|
+
}, null) : slots.default && createVNode("span", {
|
8601
8614
|
"class": `${btnClsPrefix}-text`
|
8602
8615
|
}, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)])]);
|
8603
8616
|
};
|
@@ -8993,6 +9006,45 @@ const propsMixin$1 = {
|
|
8993
9006
|
showMask: {
|
8994
9007
|
type: Boolean,
|
8995
9008
|
default: true
|
9009
|
+
},
|
9010
|
+
closeIcon: {
|
9011
|
+
type: Boolean,
|
9012
|
+
default: true
|
9013
|
+
},
|
9014
|
+
escClose: {
|
9015
|
+
type: Boolean,
|
9016
|
+
default: true
|
9017
|
+
},
|
9018
|
+
maskClose: {
|
9019
|
+
type: Boolean,
|
9020
|
+
default: true
|
9021
|
+
},
|
9022
|
+
fullscreen: {
|
9023
|
+
type: Boolean,
|
9024
|
+
default: false
|
9025
|
+
},
|
9026
|
+
size: {
|
9027
|
+
type: String,
|
9028
|
+
default: "normal",
|
9029
|
+
validator: (value) => {
|
9030
|
+
const dialogSize = ["normal", "small", "medium", "large"];
|
9031
|
+
if (dialogSize.indexOf(value) < 0) {
|
9032
|
+
console.error(`dialogSize property is not valid: '${value}',\u3010${dialogSize.join(" | ")}\u3011`);
|
9033
|
+
return false;
|
9034
|
+
}
|
9035
|
+
return true;
|
9036
|
+
}
|
9037
|
+
},
|
9038
|
+
renderDirective: {
|
9039
|
+
type: String,
|
9040
|
+
default: "show",
|
9041
|
+
validator: (value) => {
|
9042
|
+
if (["show", "if"].indexOf(value) < 0) {
|
9043
|
+
console.error(`type render-directive is not valid: '${value}'`);
|
9044
|
+
return false;
|
9045
|
+
}
|
9046
|
+
return true;
|
9047
|
+
}
|
8996
9048
|
}
|
8997
9049
|
};
|
8998
9050
|
var Component$m = defineComponent({
|
@@ -9014,6 +9066,7 @@ var Component$m = defineComponent({
|
|
9014
9066
|
return {
|
9015
9067
|
width: this.dialogWidth,
|
9016
9068
|
height: this.dialogHeight,
|
9069
|
+
minHeigth: `${200}px`,
|
9017
9070
|
display: this.visible ? "inherit" : "none"
|
9018
9071
|
};
|
9019
9072
|
}
|
@@ -9044,7 +9097,7 @@ var Component$m = defineComponent({
|
|
9044
9097
|
render() {
|
9045
9098
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
9046
9099
|
return createVNode("div", {
|
9047
|
-
"class": ["bk-modal-wrapper",
|
9100
|
+
"class": ["bk-modal-wrapper", this.size, this.customClass, this.fullscreen ? "bk-model-fullscreen" : ""],
|
9048
9101
|
"style": this.compStyle
|
9049
9102
|
}, [this.isShow ? createVNode("div", {
|
9050
9103
|
"class": "bk-modal-body"
|
@@ -9068,6 +9121,14 @@ var Component$l = defineComponent({
|
|
9068
9121
|
BkButton
|
9069
9122
|
},
|
9070
9123
|
props: __spreadProps(__spreadValues({}, propsMixin$1), {
|
9124
|
+
width: {
|
9125
|
+
type: [Number, String],
|
9126
|
+
default: null
|
9127
|
+
},
|
9128
|
+
height: {
|
9129
|
+
type: [Number, String],
|
9130
|
+
default: null
|
9131
|
+
},
|
9071
9132
|
confirmText: {
|
9072
9133
|
type: String,
|
9073
9134
|
default: "\u786E\u5B9A"
|
@@ -9103,30 +9164,62 @@ var Component$l = defineComponent({
|
|
9103
9164
|
}
|
9104
9165
|
return true;
|
9105
9166
|
}
|
9167
|
+
},
|
9168
|
+
theme: {
|
9169
|
+
type: String,
|
9170
|
+
default: "primary",
|
9171
|
+
validator: (value) => {
|
9172
|
+
if (["primary", "warning", "success", "danger"].indexOf(value) < 0) {
|
9173
|
+
console.error(`theme property is not valid: '${value}'`);
|
9174
|
+
return false;
|
9175
|
+
}
|
9176
|
+
return true;
|
9177
|
+
}
|
9106
9178
|
}
|
9107
9179
|
}),
|
9108
|
-
emits: ["closed", "update:isShow"],
|
9180
|
+
emits: ["closed", "update:isShow", "confirm"],
|
9181
|
+
mounted() {
|
9182
|
+
if (this.escClose) {
|
9183
|
+
addEventListener("keydown", this.escCloseHandler);
|
9184
|
+
}
|
9185
|
+
},
|
9186
|
+
beforeDestory() {
|
9187
|
+
if (this.escClose) {
|
9188
|
+
removeEventListener("keydown", this.escCloseHandler);
|
9189
|
+
}
|
9190
|
+
},
|
9109
9191
|
methods: {
|
9110
9192
|
handleClose() {
|
9111
9193
|
this.$emit("update:isShow", false);
|
9112
9194
|
this.$emit("closed");
|
9195
|
+
},
|
9196
|
+
handleConfirm() {
|
9197
|
+
this.$emit("update:isShow", false);
|
9198
|
+
this.$emit("confirm");
|
9199
|
+
},
|
9200
|
+
escCloseHandler(e) {
|
9201
|
+
if (this.isShow && this.closeIcon) {
|
9202
|
+
if (e.keyCode === 27) {
|
9203
|
+
this.handleClose();
|
9204
|
+
}
|
9205
|
+
}
|
9113
9206
|
}
|
9114
9207
|
},
|
9115
9208
|
render() {
|
9116
9209
|
const dialogSlot = {
|
9117
9210
|
header: () => {
|
9118
9211
|
var _a, _b, _c;
|
9119
|
-
return
|
9212
|
+
return [createVNode("div", {
|
9120
9213
|
"class": "bk-dialog-tool"
|
9121
9214
|
}, [createVNode("span", {
|
9122
|
-
"class": "bk-dialog-close",
|
9215
|
+
"class": ["bk-dialog-close", this.closeIcon ? "" : "close-icon"],
|
9123
9216
|
"onClick": this.handleClose
|
9124
9217
|
}, [createTextVNode("+")])]), createVNode("div", {
|
9125
9218
|
"class": "bk-dialog-header"
|
9126
9219
|
}, [createVNode("span", {
|
9127
9220
|
"class": "bk-dialog-title",
|
9128
9221
|
"style": `text-align: ${this.headerAlign}`
|
9129
|
-
}, [(_c = (_b = (_a = this.$slots).header) == null ? void 0 : _b.call(_a)) != null ? _c : this.title])])]
|
9222
|
+
}, [(_c = (_b = (_a = this.$slots).header) == null ? void 0 : _b.call(_a)) != null ? _c : this.title])])];
|
9130
9223
|
},
|
9131
9224
|
default: () => {
|
9132
9225
|
var _a, _b, _c;
|
@@ -9138,11 +9231,12 @@ var Component$l = defineComponent({
|
|
9138
9231
|
"class": "bk-dialog-footer",
|
9139
9232
|
"style": `text-align: ${this.footerAlign}`
|
9140
9233
|
}, [(_c = (_b = (_a = this.$slots).footer) == null ? void 0 : _b.call(_a)) != null ? _c : createVNode(Fragment, null, [createVNode(BkButton, {
|
9141
|
-
"onClick": this.
|
9142
|
-
"theme":
|
9234
|
+
"onClick": this.handleConfirm,
|
9235
|
+
"theme": this.theme
|
9143
9236
|
}, {
|
9144
9237
|
default: () => [this.confirmText]
|
9145
9238
|
}), createVNode(BkButton, {
|
9239
|
+
"style": "margin-left: 8px;",
|
9146
9240
|
"onClick": this.handleClose
|
9147
9241
|
}, {
|
9148
9242
|
default: () => [this.cancelText]
|
@@ -9483,8 +9577,12 @@ var Component$h = defineComponent({
|
|
9483
9577
|
});
|
9484
9578
|
const BkLink = withInstall(Component$h);
|
9485
9579
|
const placements = ["auto", "auto-start", "auto-end", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"];
|
9486
|
-
const
|
9487
|
-
|
9580
|
+
const EventProps$1 = {
|
9581
|
+
onAfterHidden: Function,
|
9582
|
+
onAfterShow: Function
|
9583
|
+
};
|
9584
|
+
const PopoverProps = __spreadValues({
|
9585
|
+
isShow: PropTypes.bool.def(false),
|
9488
9586
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def("auto"),
|
9489
9587
|
height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def("auto"),
|
9490
9588
|
content: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(""),
|
@@ -9507,11 +9605,20 @@ const PopoverProps = {
|
|
9507
9605
|
}
|
9508
9606
|
]),
|
9509
9607
|
boundary: PropTypes.oneOfType([PropTypes.string.def("parent"), PropTypes.instanceOf(HTMLElement)]),
|
9510
|
-
fixOnBoundary: PropTypes.bool.def(false)
|
9511
|
-
|
9608
|
+
fixOnBoundary: PropTypes.bool.def(false),
|
9609
|
+
stopBehaviors: PropTypes.oneOfType([
|
9610
|
+
PropTypes.arrayOf(PropTypes.commonType([
|
9611
|
+
"stopPropagation",
|
9612
|
+
"stopImmediatePropagation",
|
9613
|
+
"preventDefault"
|
9614
|
+
], "stopBehaviors")),
|
9615
|
+
PropTypes.string
|
9616
|
+
]).def([])
|
9617
|
+
}, EventProps$1);
|
9512
9618
|
var Component$g = defineComponent({
|
9513
9619
|
name: "Popover",
|
9514
9620
|
props: PopoverProps,
|
9621
|
+
emits: ["afterHidden", "afterShow", "update:isShow"],
|
9515
9622
|
setup(props, ctx) {
|
9516
9623
|
let isPopInstance = false;
|
9517
9624
|
let popoverInstance = /* @__PURE__ */ Object.create(null);
|
@@ -9544,22 +9651,24 @@ var Component$g = defineComponent({
|
|
9544
9651
|
customThemes
|
9545
9652
|
};
|
9546
9653
|
});
|
9547
|
-
const
|
9654
|
+
const handlePopShow = (val) => {
|
9548
9655
|
var _a, _b;
|
9549
|
-
if (
|
9656
|
+
if (isPopInstance) {
|
9550
9657
|
val ? (_a = popoverInstance.show) == null ? void 0 : _a.call(popoverInstance) : (_b = popoverInstance.hide) == null ? void 0 : _b.call(popoverInstance);
|
9551
9658
|
}
|
9552
9659
|
};
|
9553
9660
|
watch(() => props.isShow, (val) => {
|
9554
|
-
|
9661
|
+
handlePopShow(val);
|
9555
9662
|
}, {
|
9556
9663
|
immediate: true
|
9557
9664
|
});
|
9558
9665
|
const handleClose = () => {
|
9559
9666
|
ctx.emit("update:isShow", false);
|
9667
|
+
ctx.emit("afterHidden", false);
|
9560
9668
|
};
|
9561
9669
|
const handleShown = () => {
|
9562
9670
|
ctx.emit("update:isShow", true);
|
9671
|
+
ctx.emit("afterShow", false);
|
9563
9672
|
};
|
9564
9673
|
const getOptions = () => ({
|
9565
9674
|
theme: compTheme.value.systemThemes.join(" "),
|
@@ -9583,7 +9692,7 @@ var Component$g = defineComponent({
|
|
9583
9692
|
const initPopInstance = () => {
|
9584
9693
|
popoverInstance = new BKPopover(reference2.value, refContent.value, getOptions());
|
9585
9694
|
isPopInstance = true;
|
9586
|
-
|
9695
|
+
handlePopShow(isShow.value);
|
9587
9696
|
};
|
9588
9697
|
const update = () => {
|
9589
9698
|
destroyPopInstance();
|
@@ -9605,6 +9714,19 @@ var Component$g = defineComponent({
|
|
9605
9714
|
[`data-${cur}-theme`]: true
|
9606
9715
|
}, out), {});
|
9607
9716
|
const contentClass = `bk-popover-content ${customThemeCls}`;
|
9717
|
+
const handleClickContent = (e) => {
|
9718
|
+
const stopBehaviorFn = (behavior) => {
|
9719
|
+
if (typeof e[behavior] === "function") {
|
9720
|
+
e[behavior]();
|
9721
|
+
}
|
9722
|
+
};
|
9723
|
+
if (Array.isArray(props.stopBehaviors)) {
|
9724
|
+
props.stopBehaviors.forEach(stopBehaviorFn);
|
9725
|
+
}
|
9726
|
+
if (typeof props.stopBehaviors === "string") {
|
9727
|
+
stopBehaviorFn(props.stopBehaviors);
|
9728
|
+
}
|
9729
|
+
};
|
9608
9730
|
return () => {
|
9609
9731
|
var _a, _b;
|
9610
9732
|
return createVNode("div", {
|
@@ -9624,7 +9746,9 @@ var Component$g = defineComponent({
|
|
9624
9746
|
"ref": refContent,
|
9625
9747
|
"class": contentClass,
|
9626
9748
|
"style": compStyle.value
|
9627
|
-
}, customTheme
|
9749
|
+
}, customTheme, {
|
9750
|
+
"onClick": handleClickContent
|
9751
|
+
}), [(_c = (_b2 = (_a2 = ctx.slots).content) == null ? void 0 : _b2.call(_a2)) != null ? _c : content.value, arrow2.value && createVNode("div", {
|
9628
9752
|
"class": "arrow",
|
9629
9753
|
"data-popper-arrow": true
|
9630
9754
|
}, null)])];
|
@@ -10175,7 +10299,7 @@ var Component$d = defineComponent({
|
|
10175
10299
|
"onChooseRate": chooseRate,
|
10176
10300
|
"onChangeHover": changeHover,
|
10177
10301
|
"onMouseleave": () => changeHover(0)
|
10178
|
-
}, commonAttrs), null) :
|
10302
|
+
}, commonAttrs), null) : [createVNode(star, mergeProps({
|
10179
10303
|
"rate": 5,
|
10180
10304
|
"style": starStyle.value,
|
10181
10305
|
"class": "bk-score-real",
|
@@ -10183,7 +10307,7 @@ var Component$d = defineComponent({
|
|
10183
10307
|
}, commonAttrs), null), createVNode(star, mergeProps({
|
10184
10308
|
"rate": 0,
|
10185
10309
|
"editable": false
|
10186
|
-
}, commonAttrs), null)]
|
10310
|
+
}, commonAttrs), null)]]);
|
10187
10311
|
}
|
10188
10312
|
});
|
10189
10313
|
const BkRate = withInstall(Component$d);
|
@@ -11454,14 +11578,14 @@ var Component$9 = defineComponent({
|
|
11454
11578
|
const dialogSlot = {
|
11455
11579
|
header: () => {
|
11456
11580
|
var _a, _b, _c;
|
11457
|
-
return
|
11581
|
+
return [createVNode("div", {
|
11458
11582
|
"class": "bk-sideslider-header"
|
11459
11583
|
}, [createVNode("span", {
|
11460
11584
|
"class": `bk-sideslider-close ${this.direction}`,
|
11461
11585
|
"onClick": this.handleClose
|
11462
11586
|
}, null), createVNode("span", {
|
11463
11587
|
"class": `bk-sideslider-title ${this.direction}`
|
11464
|
-
}, [(_c = (_b = (_a = this.$slots).header) == null ? void 0 : _b.call(_a)) != null ? _c : "Header"])])]
|
11588
|
+
}, [(_c = (_b = (_a = this.$slots).header) == null ? void 0 : _b.call(_a)) != null ? _c : "Header"])])];
|
11465
11589
|
},
|
11466
11590
|
default: () => {
|
11467
11591
|
var _a, _b, _c;
|
@@ -11990,11 +12114,14 @@ const tableProps = {
|
|
11990
12114
|
field: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
|
11991
12115
|
render: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
|
11992
12116
|
width: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]),
|
11993
|
-
type: PropTypes.commonType(["selection", "index", "expand"], "columnType").def(""),
|
12117
|
+
type: PropTypes.commonType(["selection", "index", "expand", "none"], "columnType").def("none"),
|
11994
12118
|
sort: PropTypes.oneOfType([PropTypes.shape({
|
11995
|
-
sortby: PropTypes.string.def(""),
|
11996
12119
|
sortFn: PropTypes.func.def(null),
|
11997
12120
|
sortScope: PropTypes.commonType(Object.values(SortScope)).def("current")
|
12121
|
+
}), PropTypes.bool]).def(false),
|
12122
|
+
filter: PropTypes.oneOfType([PropTypes.shape({
|
12123
|
+
list: PropTypes.arrayOf(PropTypes.any).def([]),
|
12124
|
+
filterFn: PropTypes.func.def(null)
|
11998
12125
|
}), PropTypes.bool]).def(false)
|
11999
12126
|
})),
|
12000
12127
|
activeColumn: PropTypes.oneOfType([PropTypes.number.def(-1), PropTypes.arrayOf(PropTypes.number.def(-1))]),
|
@@ -12459,14 +12586,6 @@ var Component$5 = defineComponent({
|
|
12459
12586
|
}
|
12460
12587
|
});
|
12461
12588
|
const BkPagination = withInstall(Component$5);
|
12462
|
-
class TablePlugins {
|
12463
|
-
constructor(props, ctx) {
|
12464
|
-
__publicField(this, "props", null);
|
12465
|
-
__publicField(this, "ctx", null);
|
12466
|
-
this.props = props;
|
12467
|
-
this.ctx = ctx;
|
12468
|
-
}
|
12469
|
-
}
|
12470
12589
|
const resolvePropVal = (prop, key, args) => {
|
12471
12590
|
if (Object.prototype.hasOwnProperty.call(prop, key)) {
|
12472
12591
|
if (typeof prop[key] === "function") {
|
@@ -12611,15 +12730,184 @@ const resolveHeadConfig = (props) => {
|
|
12611
12730
|
height: headHeight
|
12612
12731
|
}, __spreadValues({}, thead));
|
12613
12732
|
};
|
12733
|
+
const getRowText = (row, key, column) => {
|
12734
|
+
if (column.type === "index") {
|
12735
|
+
return row.__$table_row_index;
|
12736
|
+
}
|
12737
|
+
return row[key];
|
12738
|
+
};
|
12739
|
+
var HeadFilter = defineComponent({
|
12740
|
+
name: "HeadFilter",
|
12741
|
+
props: {
|
12742
|
+
column: PropTypes.any.def({}),
|
12743
|
+
height: PropTypes.number.def(40)
|
12744
|
+
},
|
12745
|
+
emits: ["change"],
|
12746
|
+
setup(props, {
|
12747
|
+
emit
|
12748
|
+
}) {
|
12749
|
+
const {
|
12750
|
+
column
|
12751
|
+
} = props;
|
12752
|
+
const isShow = ref(false);
|
12753
|
+
const state = reactive({
|
12754
|
+
isOpen: false,
|
12755
|
+
checked: []
|
12756
|
+
});
|
12757
|
+
const headClass = computed(() => classes({
|
12758
|
+
[resolveClassName("table-head-action")]: true,
|
12759
|
+
"column-filter": true,
|
12760
|
+
"--row-height": `${props.height}px`,
|
12761
|
+
active: state.checked.length,
|
12762
|
+
opened: state.isOpen
|
12763
|
+
}));
|
12764
|
+
const headFilterContentClass = classes({
|
12765
|
+
[resolveClassName("table-head-filter")]: true
|
12766
|
+
});
|
12767
|
+
const handlePopShow = (isOpen) => {
|
12768
|
+
state.isOpen = isOpen;
|
12769
|
+
};
|
12770
|
+
const modifiers = [{
|
12771
|
+
name: "offset",
|
12772
|
+
options: {
|
12773
|
+
offset: [0, 0]
|
12774
|
+
}
|
12775
|
+
}];
|
12776
|
+
const theme = `light ${resolveClassName("table-head-filter")}`;
|
12777
|
+
const handleItemChecked = (value, item) => {
|
12778
|
+
const isChecked = !!value;
|
12779
|
+
if (isChecked) {
|
12780
|
+
state.checked.push(item.value);
|
12781
|
+
} else {
|
12782
|
+
const index = state.checked.findIndex((val) => val === item.value);
|
12783
|
+
if (index >= 0) {
|
12784
|
+
state.checked.splice(index, 1);
|
12785
|
+
}
|
12786
|
+
}
|
12787
|
+
};
|
12788
|
+
let localData = reactive([]);
|
12789
|
+
watchEffect(() => {
|
12790
|
+
const {
|
12791
|
+
list = []
|
12792
|
+
} = column.filter;
|
12793
|
+
localData = list.map((item) => __spreadProps(__spreadValues({}, item), {
|
12794
|
+
checked: state.checked.includes(item.value)
|
12795
|
+
}));
|
12796
|
+
});
|
12797
|
+
const filterFn = typeof column.filter.filterFn === "function" ? (checked, row, index, data2) => column.filter.filterFn(checked, row, props.column, index, data2) : (checked, row) => checked.length ? checked.includes(getRowText(row, resolvePropVal(column, "field", [column, row]), column)) : true;
|
12798
|
+
const handleBtnSaveClick = () => {
|
12799
|
+
emit("change", [...state.checked], filterFn);
|
12800
|
+
isShow.value = false;
|
12801
|
+
};
|
12802
|
+
const handleBtnResetClick = () => {
|
12803
|
+
if (state.checked.length) {
|
12804
|
+
state.checked.splice(0, state.checked.length);
|
12805
|
+
emit("change", state.checked, filterFn);
|
12806
|
+
isShow.value = false;
|
12807
|
+
}
|
12808
|
+
};
|
12809
|
+
return () => createVNode(BkPopover, mergeProps({
|
12810
|
+
"trigger": "click",
|
12811
|
+
"isShow": isShow.value,
|
12812
|
+
"placement": "bottom-end",
|
12813
|
+
"stopBehaviors": ["stopPropagation"],
|
12814
|
+
"arrow": false
|
12815
|
+
}, {
|
12816
|
+
modifiers,
|
12817
|
+
theme
|
12818
|
+
}, {
|
12819
|
+
"boundary": document.body,
|
12820
|
+
"onAfterShow": () => handlePopShow(true),
|
12821
|
+
"onAfterHidden": () => handlePopShow(false)
|
12822
|
+
}), {
|
12823
|
+
default: () => createVNode(angleDownLine, {
|
12824
|
+
"class": headClass.value,
|
12825
|
+
"onClick": () => isShow.value = true
|
12826
|
+
}, null),
|
12827
|
+
content: () => createVNode("div", {
|
12828
|
+
"class": headFilterContentClass
|
12829
|
+
}, [createVNode("div", {
|
12830
|
+
"class": "content-list"
|
12831
|
+
}, [localData.map((item) => createVNode("div", {
|
12832
|
+
"class": "list-item"
|
12833
|
+
}, [createVNode(BkCheckbox, {
|
12834
|
+
"label": item.text,
|
12835
|
+
"checked": item.checked,
|
12836
|
+
"onChange": (val) => handleItemChecked(val, item)
|
12837
|
+
}, null)]))]), createVNode("div", {
|
12838
|
+
"class": "content-footer"
|
12839
|
+
}, [createVNode("span", {
|
12840
|
+
"class": "btn-filter-save",
|
12841
|
+
"onClick": handleBtnSaveClick
|
12842
|
+
}, [createTextVNode("\u786E\u5B9A")]), createVNode("span", {
|
12843
|
+
"class": "btn-filter-split"
|
12844
|
+
}, null), createVNode("span", {
|
12845
|
+
"class": ["btn-filter-reset", state.checked.length ? "" : "disable"],
|
12846
|
+
"onClick": handleBtnResetClick
|
12847
|
+
}, [createTextVNode("\u91CD\u7F6E")])])])
|
12848
|
+
});
|
12849
|
+
}
|
12850
|
+
});
|
12851
|
+
var SortType = /* @__PURE__ */ ((SortType2) => {
|
12852
|
+
SortType2["ASC"] = "asc";
|
12853
|
+
SortType2["DESC"] = "desc";
|
12854
|
+
return SortType2;
|
12855
|
+
})(SortType || {});
|
12856
|
+
var headSort = "";
|
12857
|
+
var HeadSort = defineComponent({
|
12858
|
+
name: "HeadSort",
|
12859
|
+
props: {
|
12860
|
+
column: PropTypes.any.def({})
|
12861
|
+
},
|
12862
|
+
emits: ["change"],
|
12863
|
+
setup(props, {
|
12864
|
+
emit
|
12865
|
+
}) {
|
12866
|
+
const sortType = ref("");
|
12867
|
+
const hanldeSortClick = (e, type) => {
|
12868
|
+
var _a, _b;
|
12869
|
+
e.stopImmediatePropagation();
|
12870
|
+
e.stopPropagation();
|
12871
|
+
e.preventDefault();
|
12872
|
+
sortType.value = type;
|
12873
|
+
const fieldName = props.column.field;
|
12874
|
+
const getVal = (row) => getRowText(row, fieldName, props.column);
|
12875
|
+
const sortFn0 = (a2, b2) => {
|
12876
|
+
const val0 = getVal(a2);
|
12877
|
+
const val1 = getVal(b2);
|
12878
|
+
if (typeof val0 === "number" && typeof val1 === "number") {
|
12879
|
+
return val0 - val1;
|
12880
|
+
}
|
12881
|
+
return String.prototype.localeCompare.call(val0, val1);
|
12882
|
+
};
|
12883
|
+
const sortFn = typeof ((_a = props.column.sort) == null ? void 0 : _a.sortFn) === "function" ? (_b = props.column.sort) == null ? void 0 : _b.sortFn : sortFn0;
|
12884
|
+
const execFn = (_a2, _b2) => sortFn(_a2, _b2) * (type === SortType.DESC ? -1 : 1);
|
12885
|
+
emit("change", execFn, type);
|
12886
|
+
};
|
12887
|
+
return () => createVNode("span", {
|
12888
|
+
"class": resolveClassName("head-cell-sort")
|
12889
|
+
}, [createVNode(angleDownFill, {
|
12890
|
+
"class": ["sort-action", "sort-asc", sortType.value === SortType.ASC ? "active" : ""],
|
12891
|
+
"onClick": (e) => hanldeSortClick(e, SortType.ASC)
|
12892
|
+
}, null), createVNode(angleUpFill, {
|
12893
|
+
"class": ["sort-action", "sort-desc", sortType.value === SortType.DESC ? "active" : ""],
|
12894
|
+
"onClick": (e) => hanldeSortClick(e, SortType.DESC)
|
12895
|
+
}, null)]);
|
12896
|
+
}
|
12897
|
+
});
|
12898
|
+
class TablePlugins {
|
12899
|
+
constructor(props, ctx) {
|
12900
|
+
__publicField(this, "props", null);
|
12901
|
+
__publicField(this, "ctx", null);
|
12902
|
+
this.props = props;
|
12903
|
+
this.ctx = ctx;
|
12904
|
+
}
|
12905
|
+
}
|
12614
12906
|
let EVENTS;
|
12615
12907
|
(function(EVENTS2) {
|
12616
12908
|
EVENTS2["ON_SORT_BY_CLICK"] = "onSortByClick";
|
12909
|
+
EVENTS2["ON_FILTER_CLICK"] = "onFilterClick";
|
12617
12910
|
})(EVENTS || (EVENTS = {}));
|
12618
|
-
let SortType;
|
12619
|
-
(function(SortType2) {
|
12620
|
-
SortType2["ASC"] = "asc";
|
12621
|
-
SortType2["DESC"] = "desc";
|
12622
|
-
})(SortType || (SortType = {}));
|
12623
12911
|
class TableRender {
|
12624
12912
|
constructor(props, ctx, reactiveProp, colgroups) {
|
12625
12913
|
__publicField(this, "getColumnClass", (colIndex) => `${this.uuid}-column-${colIndex}`);
|
@@ -12711,6 +12999,36 @@ class TableRender {
|
|
12711
12999
|
this.context.emit("column-pick", this.propActiveCols);
|
12712
13000
|
}
|
12713
13001
|
}
|
13002
|
+
getSortCell(column, index) {
|
13003
|
+
const hanldeSortClick = (sortFn, type) => {
|
13004
|
+
this.emitEvent(EVENTS.ON_SORT_BY_CLICK, [{
|
13005
|
+
sortFn,
|
13006
|
+
column,
|
13007
|
+
index,
|
13008
|
+
type
|
13009
|
+
}]);
|
13010
|
+
};
|
13011
|
+
return createVNode(HeadSort, {
|
13012
|
+
"column": column,
|
13013
|
+
"onChange": hanldeSortClick
|
13014
|
+
}, null);
|
13015
|
+
}
|
13016
|
+
getFilterCell(column, index) {
|
13017
|
+
const handleFilterChange = (checked, filterFn) => {
|
13018
|
+
const filterFn0 = (row, index2) => filterFn(checked, row, index2);
|
13019
|
+
this.emitEvent(EVENTS.ON_FILTER_CLICK, [{
|
13020
|
+
filterFn: filterFn0,
|
13021
|
+
checked,
|
13022
|
+
column,
|
13023
|
+
index
|
13024
|
+
}]);
|
13025
|
+
};
|
13026
|
+
return createVNode(HeadFilter, {
|
13027
|
+
"column": column,
|
13028
|
+
"height": this.props.headHeight,
|
13029
|
+
"onChange": handleFilterChange
|
13030
|
+
}, null);
|
13031
|
+
}
|
12714
13032
|
renderHeader() {
|
12715
13033
|
const config = resolveHeadConfig(this.props);
|
12716
13034
|
const {
|
@@ -12719,47 +13037,13 @@ class TableRender {
|
|
12719
13037
|
const rowStyle = {
|
12720
13038
|
"--row-height": `${resolvePropVal(config, "height", ["thead"])}px`
|
12721
13039
|
};
|
12722
|
-
const hanldeSortClick = (e, column, index, type) => {
|
12723
|
-
var _a, _b;
|
12724
|
-
e.stopImmediatePropagation();
|
12725
|
-
e.stopPropagation();
|
12726
|
-
e.preventDefault();
|
12727
|
-
const fieldName = column.field;
|
12728
|
-
const getVal = (row) => this.getRowText(row, fieldName, column);
|
12729
|
-
const sortFn0 = (a2, b2) => {
|
12730
|
-
const val0 = getVal(a2);
|
12731
|
-
const val1 = getVal(b2);
|
12732
|
-
if (typeof val0 === "number" && typeof val1 === "number") {
|
12733
|
-
return val0 - val1;
|
12734
|
-
}
|
12735
|
-
return String.prototype.localeCompare.call(val0, val1);
|
12736
|
-
};
|
12737
|
-
Object.assign(column, {
|
12738
|
-
_sort_reg: type
|
12739
|
-
});
|
12740
|
-
const sortFn = typeof ((_a = column.sort) == null ? void 0 : _a.sortFn) === "function" ? (_b = column.sort) == null ? void 0 : _b.sortFn : sortFn0;
|
12741
|
-
const execFn = (_a2, _b2) => sortFn(_a2, _b2) * (type === SortType.DESC ? -1 : 1);
|
12742
|
-
this.emitEvent(EVENTS.ON_SORT_BY_CLICK, [{
|
12743
|
-
sortFn: execFn,
|
12744
|
-
column,
|
12745
|
-
index,
|
12746
|
-
type
|
12747
|
-
}]);
|
12748
|
-
};
|
12749
13040
|
const renderHeadCell = (column, index) => {
|
12750
13041
|
const cells = [];
|
12751
13042
|
if (column.sort) {
|
12752
|
-
|
12753
|
-
|
12754
|
-
|
12755
|
-
|
12756
|
-
"class": ["sort-action", "sort-asc", sortReg === SortType.ASC ? "active" : ""],
|
12757
|
-
"onClick": (e) => hanldeSortClick(e, column, index, SortType.ASC)
|
12758
|
-
}, null), createVNode(angleUpFill, {
|
12759
|
-
"class": ["sort-action", "sort-desc", sortReg === SortType.DESC ? "active" : ""],
|
12760
|
-
"onClick": (e) => hanldeSortClick(e, column, index, SortType.DESC)
|
12761
|
-
}, null)]);
|
12762
|
-
cells.push(sortCell);
|
13043
|
+
cells.push(this.getSortCell(column, index));
|
13044
|
+
}
|
13045
|
+
if (column.filter) {
|
13046
|
+
cells.push(this.getFilterCell(column, index));
|
12763
13047
|
}
|
12764
13048
|
if (typeof cellFn === "function") {
|
12765
13049
|
cells.unshift(cellFn(column, index));
|
@@ -12805,14 +13089,8 @@ class TableRender {
|
|
12805
13089
|
handleRowDblClick(e, row, index, rows) {
|
12806
13090
|
this.context.emit("rowDblClick", e, row, index, rows, this);
|
12807
13091
|
}
|
12808
|
-
getRowText(row, key, column) {
|
12809
|
-
if (column.type === "index") {
|
12810
|
-
return row.__$table_row_index;
|
12811
|
-
}
|
12812
|
-
return row[key];
|
12813
|
-
}
|
12814
13092
|
renderCell(row, column, index, rows) {
|
12815
|
-
const cell =
|
13093
|
+
const cell = getRowText(row, resolvePropVal(column, "field", [column, row]), column);
|
12816
13094
|
if (typeof column.render === "function") {
|
12817
13095
|
return column.render(cell, row, index, rows);
|
12818
13096
|
}
|
@@ -12834,6 +13112,7 @@ class TableRender {
|
|
12834
13112
|
})]);
|
12835
13113
|
}
|
12836
13114
|
}
|
13115
|
+
var headFilter = "";
|
12837
13116
|
var Component$4 = defineComponent({
|
12838
13117
|
name: "Table",
|
12839
13118
|
props: tableProps,
|
@@ -12846,6 +13125,7 @@ var Component$4 = defineComponent({
|
|
12846
13125
|
const startIndex = ref(0);
|
12847
13126
|
const endIndex = ref(0);
|
12848
13127
|
let columnSortFn = null;
|
13128
|
+
let columnFilterFn = null;
|
12849
13129
|
let pagination2 = reactive({
|
12850
13130
|
count: 0,
|
12851
13131
|
limit: 10,
|
@@ -12890,13 +13170,20 @@ var Component$4 = defineComponent({
|
|
12890
13170
|
__$table_row_index: index + 1
|
12891
13171
|
})));
|
12892
13172
|
const pageData = reactive([]);
|
12893
|
-
|
12894
|
-
pagination2 = resolvePaginationOption(props.pagination, pagination2);
|
12895
|
-
resetStartEndIndex();
|
13173
|
+
const resolvePageData = () => {
|
12896
13174
|
pageData.splice(0, pageData.length, ...indexData.value.slice(startIndex.value, endIndex.value));
|
13175
|
+
if (typeof columnFilterFn === "function") {
|
13176
|
+
const filterVals = pageData.filter((row, index) => columnFilterFn(row, index, props.data));
|
13177
|
+
pageData.splice(0, pageData.length, ...filterVals);
|
13178
|
+
}
|
12897
13179
|
if (typeof columnSortFn === "function") {
|
12898
13180
|
pageData.sort(columnSortFn);
|
12899
13181
|
}
|
13182
|
+
};
|
13183
|
+
watchEffect(() => {
|
13184
|
+
pagination2 = resolvePaginationOption(props.pagination, pagination2);
|
13185
|
+
resetStartEndIndex();
|
13186
|
+
resolvePageData();
|
12900
13187
|
});
|
12901
13188
|
const tableRender = new TableRender(props, ctx, reactiveProp, colgroups);
|
12902
13189
|
tableRender.on(EVENTS.ON_SORT_BY_CLICK, (args) => {
|
@@ -12905,6 +13192,12 @@ var Component$4 = defineComponent({
|
|
12905
13192
|
} = args;
|
12906
13193
|
columnSortFn = sortFn;
|
12907
13194
|
pageData.sort(columnSortFn);
|
13195
|
+
}).on(EVENTS.ON_FILTER_CLICK, (args) => {
|
13196
|
+
const {
|
13197
|
+
filterFn
|
13198
|
+
} = args;
|
13199
|
+
columnFilterFn = filterFn;
|
13200
|
+
resolvePageData();
|
12908
13201
|
});
|
12909
13202
|
const wrapperStyle = computed(() => ({
|
12910
13203
|
minHeight: resolveNumberOrStringToPix(props.minHeight, "auto")
|