vxe-pc-ui 0.1.0 → 0.2.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/README.md +7 -0
- package/es/anchor/src/anchor-link.js +2 -2
- package/es/anchor/src/util.js +1 -1
- package/es/checkbox/src/checkbox.js +3 -3
- package/es/checkbox/src/group.js +3 -3
- package/es/components.js +6 -0
- package/es/form/src/form-config-item.js +1 -1
- package/es/form/src/form-gather.js +1 -1
- package/es/form/src/form-item.js +4 -4
- package/es/form/src/form.js +3 -3
- package/es/input/src/input.js +3 -3
- package/es/layout-aside/src/layout-aside.js +4 -2
- package/es/layout-aside/style.css +3 -1
- package/es/layout-aside/style.min.css +1 -1
- package/es/layout-body/src/layout-body.js +7 -2
- package/es/layout-body/style.css +2 -0
- package/es/layout-body/style.min.css +1 -1
- package/es/layout-container/src/layout-container.js +2 -1
- package/es/layout-footer/src/layout-footer.js +5 -3
- package/es/layout-footer/style.css +3 -1
- package/es/layout-footer/style.min.css +1 -1
- package/es/layout-header/style.css +0 -1
- package/es/layout-header/style.min.css +1 -1
- package/es/radio/src/button.js +4 -4
- package/es/radio/src/group.js +4 -4
- package/es/radio/src/radio.js +4 -4
- package/es/select/src/optgroup.js +1 -1
- package/es/select/src/option.js +1 -1
- package/es/select/src/select.js +4 -4
- package/es/style.css +1 -1
- package/es/style.min.css +1 -1
- package/es/switch/src/switch.js +3 -3
- package/es/tab-pane/index.js +8 -0
- package/es/tab-pane/style.css +0 -0
- package/es/tab-pane/style.min.css +0 -0
- package/es/tabs/index.js +8 -0
- package/es/tabs/src/tab-pane.js +64 -0
- package/es/tabs/src/tabs.js +195 -0
- package/es/tabs/src/util.js +17 -0
- package/es/tabs/style.css +113 -0
- package/es/tabs/style.min.css +1 -0
- package/es/textarea/src/textarea.js +3 -3
- package/es/ui/src/core.js +1 -1
- package/es/ui/src/log.js +1 -1
- package/es/vxe-layout-aside/style.css +3 -1
- package/es/vxe-layout-aside/style.min.css +1 -1
- package/es/vxe-layout-body/style.css +2 -0
- package/es/vxe-layout-body/style.min.css +1 -1
- package/es/vxe-layout-footer/style.css +3 -1
- package/es/vxe-layout-footer/style.min.css +1 -1
- package/es/vxe-layout-header/style.css +0 -1
- package/es/vxe-layout-header/style.min.css +1 -1
- package/es/vxe-tab-pane/index.js +3 -0
- package/es/vxe-tab-pane/style.css +0 -0
- package/es/vxe-tab-pane/style.min.css +0 -0
- package/es/vxe-tabs/index.js +3 -0
- package/es/vxe-tabs/style.css +113 -0
- package/es/vxe-tabs/style.min.css +1 -0
- package/lib/anchor/src/anchor-link.js +1 -1
- package/lib/anchor/src/anchor-link.min.js +1 -1
- package/lib/anchor/src/util.js +2 -2
- package/lib/anchor/src/util.min.js +1 -1
- package/lib/checkbox/src/checkbox.js +3 -3
- package/lib/checkbox/src/checkbox.min.js +1 -1
- package/lib/checkbox/src/group.js +3 -3
- package/lib/checkbox/src/group.min.js +1 -1
- package/lib/components.js +25 -1
- package/lib/components.min.js +1 -1
- package/lib/form/src/form-config-item.js +1 -1
- package/lib/form/src/form-config-item.min.js +1 -1
- package/lib/form/src/form-gather.js +1 -1
- package/lib/form/src/form-gather.min.js +1 -1
- package/lib/form/src/form-item.js +4 -4
- package/lib/form/src/form-item.min.js +1 -1
- package/lib/form/src/form.js +3 -3
- package/lib/form/src/form.min.js +1 -1
- package/lib/index.umd.js +421 -55
- package/lib/index.umd.min.js +1 -1
- package/lib/input/src/input.js +3 -3
- package/lib/input/src/input.min.js +1 -1
- package/lib/layout-aside/src/layout-aside.js +5 -2
- package/lib/layout-aside/src/layout-aside.min.js +1 -1
- package/lib/layout-aside/style/style.css +3 -1
- package/lib/layout-aside/style/style.min.css +1 -1
- package/lib/layout-body/src/layout-body.js +9 -2
- package/lib/layout-body/src/layout-body.min.js +1 -1
- package/lib/layout-body/style/style.css +2 -0
- package/lib/layout-body/style/style.min.css +1 -1
- package/lib/layout-container/src/layout-container.js +4 -1
- package/lib/layout-container/src/layout-container.min.js +1 -1
- package/lib/layout-footer/src/layout-footer.js +8 -3
- package/lib/layout-footer/src/layout-footer.min.js +1 -1
- package/lib/layout-footer/style/style.css +3 -1
- package/lib/layout-footer/style/style.min.css +1 -1
- package/lib/layout-header/style/style.css +0 -1
- package/lib/layout-header/style/style.min.css +1 -1
- package/lib/radio/src/button.js +4 -4
- package/lib/radio/src/button.min.js +1 -1
- package/lib/radio/src/group.js +4 -4
- package/lib/radio/src/group.min.js +1 -1
- package/lib/radio/src/radio.js +4 -4
- package/lib/radio/src/radio.min.js +1 -1
- package/lib/select/src/optgroup.js +1 -1
- package/lib/select/src/optgroup.min.js +1 -1
- package/lib/select/src/option.js +1 -1
- package/lib/select/src/option.min.js +1 -1
- package/lib/select/src/select.js +4 -4
- package/lib/select/src/select.min.js +1 -1
- package/lib/style.css +1 -1
- package/lib/style.min.css +1 -1
- package/lib/switch/src/switch.js +3 -3
- package/lib/switch/src/switch.min.js +1 -1
- package/lib/tab-pane/index.js +15 -0
- package/lib/tab-pane/index.min.js +1 -0
- package/lib/tab-pane/style/index.js +1 -0
- package/lib/tab-pane/style/style.css +0 -0
- package/lib/tab-pane/style/style.min.css +0 -0
- package/lib/tabs/index.js +15 -0
- package/lib/tabs/index.min.js +1 -0
- package/lib/tabs/src/tab-pane.js +73 -0
- package/lib/tabs/src/tab-pane.min.js +1 -0
- package/lib/tabs/src/tabs.js +240 -0
- package/lib/tabs/src/tabs.min.js +1 -0
- package/lib/tabs/src/util.js +27 -0
- package/lib/tabs/src/util.min.js +1 -0
- package/lib/tabs/style/index.js +1 -0
- package/lib/tabs/style/style.css +113 -0
- package/lib/tabs/style/style.min.css +1 -0
- package/lib/textarea/src/textarea.js +3 -3
- package/lib/textarea/src/textarea.min.js +1 -1
- package/lib/ui/src/core.js +1 -1
- package/lib/ui/src/core.min.js +1 -1
- package/lib/ui/src/log.js +1 -1
- package/lib/ui/src/log.min.js +1 -1
- package/lib/vxe-layout-aside/style/style.css +3 -1
- package/lib/vxe-layout-aside/style/style.min.css +1 -1
- package/lib/vxe-layout-body/style/style.css +2 -0
- package/lib/vxe-layout-body/style/style.min.css +1 -1
- package/lib/vxe-layout-footer/style/style.css +3 -1
- package/lib/vxe-layout-footer/style/style.min.css +1 -1
- package/lib/vxe-layout-header/style/style.css +0 -1
- package/lib/vxe-layout-header/style/style.min.css +1 -1
- package/lib/vxe-tab-pane/index.js +22 -0
- package/lib/vxe-tab-pane/index.min.js +1 -0
- package/lib/vxe-tab-pane/style/index.js +1 -0
- package/lib/vxe-tab-pane/style/style.css +0 -0
- package/lib/vxe-tab-pane/style/style.min.css +0 -0
- package/lib/vxe-tabs/index.js +22 -0
- package/lib/vxe-tabs/index.min.js +1 -0
- package/lib/vxe-tabs/style/index.js +1 -0
- package/lib/vxe-tabs/style/style.css +113 -0
- package/lib/vxe-tabs/style/style.min.css +1 -0
- package/package.json +1 -1
- package/packages/anchor/src/anchor-link.ts +2 -2
- package/packages/anchor/src/util.ts +1 -1
- package/packages/checkbox/src/checkbox.ts +3 -3
- package/packages/checkbox/src/group.ts +3 -3
- package/packages/components.ts +6 -0
- package/packages/form/src/form-config-item.ts +1 -1
- package/packages/form/src/form-gather.ts +1 -1
- package/packages/form/src/form-item.ts +4 -4
- package/packages/form/src/form.ts +4 -3
- package/packages/input/src/input.ts +3 -3
- package/packages/layout-aside/src/layout-aside.ts +8 -6
- package/packages/layout-body/src/layout-body.ts +9 -4
- package/packages/layout-container/src/layout-container.ts +5 -4
- package/packages/layout-footer/src/layout-footer.ts +7 -5
- package/packages/layout-header/src/layout-header.ts +3 -3
- package/packages/radio/src/button.ts +4 -4
- package/packages/radio/src/group.ts +4 -4
- package/packages/radio/src/radio.ts +4 -4
- package/packages/select/src/optgroup.ts +1 -1
- package/packages/select/src/option.ts +1 -1
- package/packages/select/src/select.ts +4 -4
- package/packages/switch/src/switch.ts +3 -3
- package/packages/tab-pane/index.ts +11 -0
- package/packages/tabs/index.ts +11 -0
- package/packages/tabs/src/tab-pane.ts +85 -0
- package/packages/tabs/src/tabs.ts +223 -0
- package/packages/tabs/src/util.ts +21 -0
- package/packages/textarea/src/textarea.ts +3 -3
- package/styles/all.scss +2 -0
- package/styles/components/layout-aside.scss +3 -1
- package/styles/components/layout-body.scss +3 -1
- package/styles/components/layout-footer.scss +3 -1
- package/styles/components/layout-header.scss +0 -1
- package/styles/components/tab-pane.scss +0 -0
- package/styles/components/tabs.scss +116 -0
- package/types/all.d.ts +2 -0
- package/types/components/layout-aside.d.ts +10 -1
- package/types/components/layout-body.d.ts +4 -1
- package/types/components/layout-container.d.ts +4 -1
- package/types/components/layout-footer.d.ts +7 -2
- package/types/components/layout-header.d.ts +4 -1
- package/types/components/tab-pane.d.ts +84 -0
- package/types/components/tabs.d.ts +80 -0
- package/types/tool/common.d.ts +5 -0
package/lib/switch/src/switch.js
CHANGED
|
@@ -38,7 +38,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
38
38
|
emit
|
|
39
39
|
} = context;
|
|
40
40
|
const $xeform = (0, _vue.inject)('$xeForm', null);
|
|
41
|
-
const
|
|
41
|
+
const formItemInfo = (0, _vue.inject)('xeFormItemInfo', null);
|
|
42
42
|
const xID = _xeUtils.default.uniqueId();
|
|
43
43
|
const computeSize = (0, _size.useSize)(props);
|
|
44
44
|
const reactData = (0, _vue.reactive)({
|
|
@@ -75,8 +75,8 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
75
75
|
value
|
|
76
76
|
}, evnt);
|
|
77
77
|
// 自动更新校验状态
|
|
78
|
-
if ($xeform &&
|
|
79
|
-
$xeform.triggerItemEvent(evnt,
|
|
78
|
+
if ($xeform && formItemInfo) {
|
|
79
|
+
$xeform.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
|
|
80
80
|
}
|
|
81
81
|
_atimeout = setTimeout(() => {
|
|
82
82
|
reactData.hasAnimat = false;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_globalStore=_interopRequireDefault(require("../../ui/src/globalStore")),_size=require("../../hooks/size"),_utils=require("../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeSwitch",props:{modelValue:[String,Number,Boolean],disabled:Boolean,size:{type:String,default:()=>_globalStore.default.switch.size||_globalStore.default.size},openLabel:String,closeLabel:String,openValue:{type:[String,Number,Boolean],default:!0},closeValue:{type:[String,Number,Boolean],default:!1},openIcon:String,closeIcon:String},emits:["update:modelValue","change","focus","blur"],setup(o,e){const l=e["emit"],u=(0,_vue.inject)("$xeForm",null),a=(0,_vue.inject)("
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_globalStore=_interopRequireDefault(require("../../ui/src/globalStore")),_size=require("../../hooks/size"),_utils=require("../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeSwitch",props:{modelValue:[String,Number,Boolean],disabled:Boolean,size:{type:String,default:()=>_globalStore.default.switch.size||_globalStore.default.size},openLabel:String,closeLabel:String,openValue:{type:[String,Number,Boolean],default:!0},closeValue:{type:[String,Number,Boolean],default:!1},openIcon:String,closeIcon:String},emits:["update:modelValue","change","focus","blur"],setup(o,e){const l=e["emit"],u=(0,_vue.inject)("$xeForm",null),a=(0,_vue.inject)("xeFormItemInfo",null);var t=_xeUtils.default.uniqueId();const n=(0,_size.useSize)(o),r=(0,_vue.reactive)({isActivated:!1,hasAnimat:!1,offsetLeft:0}),i={xID:t,props:o,context:e,reactData:r},c=(0,_vue.ref)();let s={};const v=(0,_vue.computed)(()=>(0,_utils.getFuncText)(o.openLabel)),d=(0,_vue.computed)(()=>(0,_utils.getFuncText)(o.closeLabel)),_=(0,_vue.computed)(()=>o.modelValue===o.openValue);let p;const b=e=>{var t;o.disabled||(t=_.value,clearTimeout(p),t=t?o.closeValue:o.openValue,r.hasAnimat=!0,l("update:modelValue",t),s.dispatchEvent("change",{value:t},e),u&&a&&u.triggerItemEvent(e,a.itemConfig.field,t),p=setTimeout(()=>{r.hasAnimat=!1},400))},f=e=>{r.isActivated=!0,s.dispatchEvent("focus",{value:o.modelValue},e)},m=e=>{r.isActivated=!1,s.dispatchEvent("blur",{value:o.modelValue},e)};s={dispatchEvent(e,t,u){l(e,Object.assign({$switch:i,$event:u},t))},focus(){var e=c.value;return r.isActivated=!0,e.focus(),(0,_vue.nextTick)()},blur(){return c.value.blur(),(r.isActivated=!1,_vue.nextTick)()}},Object.assign(i,s);return i.renderVN=()=>{var{disabled:e,openIcon:t,closeIcon:u}=o,l=_.value,a=n.value,i=v.value,s=d.value;return(0,_vue.h)("div",{class:["vxe-switch",l?"is--on":"is--off",{["size--"+a]:a,"is--disabled":e,"is--animat":r.hasAnimat}]},[(0,_vue.h)("button",{ref:c,class:"vxe-switch--button",type:"button",disabled:e,onClick:b,onFocus:f,onBlur:m},[(0,_vue.h)("span",{class:"vxe-switch--label vxe-switch--label-on"},[t?(0,_vue.h)("i",{class:["vxe-switch--label-icon",t]}):(0,_vue.createCommentVNode)(),i]),(0,_vue.h)("span",{class:"vxe-switch--label vxe-switch--label-off"},[u?(0,_vue.h)("i",{class:["vxe-switch--label-icon",u]}):(0,_vue.createCommentVNode)(),s]),(0,_vue.h)("span",{class:"vxe-switch--icon"})])])},i},render(){return this.renderVN()}});
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = exports.TabPane = void 0;
|
|
7
|
+
var _tabPane = _interopRequireDefault(require("../tabs/src/tab-pane"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
const VxeTabPane = Object.assign({}, _tabPane.default, {
|
|
10
|
+
install(app) {
|
|
11
|
+
app.component(_tabPane.default.name, _tabPane.default);
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
const TabPane = exports.TabPane = VxeTabPane;
|
|
15
|
+
var _default = exports.default = VxeTabPane;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.TabPane=void 0;var _tabPane=_interopRequireDefault(require("../tabs/src/tab-pane"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const VxeTabPane=Object.assign({},_tabPane.default,{install(e){e.component(_tabPane.default.name,_tabPane.default)}}),TabPane=exports.TabPane=VxeTabPane;var _default=exports.default=VxeTabPane;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
require('./style.css')
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = exports.Tabs = void 0;
|
|
7
|
+
var _tabs = _interopRequireDefault(require("./src/tabs"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
const VxeTabs = Object.assign({}, _tabs.default, {
|
|
10
|
+
install(app) {
|
|
11
|
+
app.component(_tabs.default.name, _tabs.default);
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
const Tabs = exports.Tabs = VxeTabs;
|
|
15
|
+
var _default = exports.default = VxeTabs;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Tabs=void 0;var _tabs=_interopRequireDefault(require("./src/tabs"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const VxeTabs=Object.assign({},_tabs.default,{install(e){e.component(_tabs.default.name,_tabs.default)}}),Tabs=exports.Tabs=VxeTabs;var _default=exports.default=VxeTabs;
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _vue = require("vue");
|
|
8
|
+
var _xeUtils = _interopRequireDefault(require("xe-utils"));
|
|
9
|
+
var _util = require("./util");
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
var _default = exports.default = (0, _vue.defineComponent)({
|
|
12
|
+
name: 'VxeTabPane',
|
|
13
|
+
props: {
|
|
14
|
+
title: [String, Number],
|
|
15
|
+
name: [String, Number, Boolean]
|
|
16
|
+
},
|
|
17
|
+
emits: [],
|
|
18
|
+
setup(props, context) {
|
|
19
|
+
const {
|
|
20
|
+
slots
|
|
21
|
+
} = context;
|
|
22
|
+
const xID = _xeUtils.default.uniqueId();
|
|
23
|
+
const refElem = (0, _vue.ref)();
|
|
24
|
+
const $xeTabs = (0, _vue.inject)('$xeTabs', null);
|
|
25
|
+
const reactData = (0, _vue.reactive)({});
|
|
26
|
+
const tabConfig = (0, _vue.reactive)({
|
|
27
|
+
id: xID,
|
|
28
|
+
title: props.title,
|
|
29
|
+
name: props.name,
|
|
30
|
+
slots: {
|
|
31
|
+
default: slots.default
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
const refMaps = {
|
|
35
|
+
refElem
|
|
36
|
+
};
|
|
37
|
+
const computeMaps = {};
|
|
38
|
+
const $xeTabPane = {
|
|
39
|
+
xID,
|
|
40
|
+
props,
|
|
41
|
+
context,
|
|
42
|
+
reactData,
|
|
43
|
+
getRefMaps: () => refMaps,
|
|
44
|
+
getComputeMaps: () => computeMaps
|
|
45
|
+
};
|
|
46
|
+
(0, _vue.watch)(() => props.title, val => {
|
|
47
|
+
tabConfig.title = val;
|
|
48
|
+
});
|
|
49
|
+
(0, _vue.watch)(() => props.name, val => {
|
|
50
|
+
tabConfig.name = val;
|
|
51
|
+
});
|
|
52
|
+
(0, _vue.onMounted)(() => {
|
|
53
|
+
if ($xeTabs && refElem.value) {
|
|
54
|
+
(0, _util.assembleAnchorTab)($xeTabs, refElem.value, tabConfig);
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
(0, _vue.onUnmounted)(() => {
|
|
58
|
+
if ($xeTabs) {
|
|
59
|
+
(0, _util.destroyAnchorTab)($xeTabs, tabConfig);
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
const renderVN = () => {
|
|
63
|
+
return (0, _vue.h)('div', {
|
|
64
|
+
ref: refElem
|
|
65
|
+
}, []);
|
|
66
|
+
};
|
|
67
|
+
$xeTabPane.renderVN = renderVN;
|
|
68
|
+
return $xeTabPane;
|
|
69
|
+
},
|
|
70
|
+
render() {
|
|
71
|
+
return this.renderVN();
|
|
72
|
+
}
|
|
73
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTabPane",props:{title:[String,Number],name:[String,Number,Boolean]},emits:[],setup(e,t){var u=t["slots"],r=_xeUtils.default.uniqueId();const a=(0,_vue.ref)(),n=(0,_vue.inject)("$xeTabs",null);var i=(0,_vue.reactive)({});const l=(0,_vue.reactive)({id:r,title:e.title,name:e.name,slots:{default:u.default}}),o={refElem:a},s={};u={xID:r,props:e,context:t,reactData:i,getRefMaps:()=>o,getComputeMaps:()=>s};(0,_vue.watch)(()=>e.title,e=>{l.title=e}),(0,_vue.watch)(()=>e.name,e=>{l.name=e}),(0,_vue.onMounted)(()=>{n&&a.value&&(0,_util.assembleAnchorTab)(n,a.value,l)}),(0,_vue.onUnmounted)(()=>{n&&(0,_util.destroyAnchorTab)(n,l)});return u.renderVN=()=>(0,_vue.h)("div",{ref:a},[]),u},render(){return this.renderVN()}});
|
|
@@ -0,0 +1,240 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _vue = require("vue");
|
|
8
|
+
var _xeUtils = _interopRequireDefault(require("xe-utils"));
|
|
9
|
+
var _tabPane = _interopRequireDefault(require("./tab-pane"));
|
|
10
|
+
var _vn = require("../../ui/src/vn");
|
|
11
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
+
var _default = exports.default = (0, _vue.defineComponent)({
|
|
13
|
+
name: 'VxeTabs',
|
|
14
|
+
props: {
|
|
15
|
+
modelValue: [String, Number, Boolean],
|
|
16
|
+
options: Array,
|
|
17
|
+
destroyOnClose: Boolean,
|
|
18
|
+
type: String
|
|
19
|
+
},
|
|
20
|
+
emits: [],
|
|
21
|
+
setup(props, context) {
|
|
22
|
+
const {
|
|
23
|
+
slots
|
|
24
|
+
} = context;
|
|
25
|
+
const xID = _xeUtils.default.uniqueId();
|
|
26
|
+
const refElem = (0, _vue.ref)();
|
|
27
|
+
const refHeaderElem = (0, _vue.ref)();
|
|
28
|
+
const reactData = (0, _vue.reactive)({
|
|
29
|
+
staticTabs: [],
|
|
30
|
+
activeName: props.modelValue,
|
|
31
|
+
initNames: props.modelValue ? [props.modelValue] : [],
|
|
32
|
+
lintLeft: 0,
|
|
33
|
+
lintWidth: 0
|
|
34
|
+
});
|
|
35
|
+
const refMaps = {
|
|
36
|
+
refElem
|
|
37
|
+
};
|
|
38
|
+
const computeActiveOptionTab = (0, _vue.computed)(() => {
|
|
39
|
+
const {
|
|
40
|
+
options
|
|
41
|
+
} = props;
|
|
42
|
+
const {
|
|
43
|
+
activeName
|
|
44
|
+
} = reactData;
|
|
45
|
+
return options ? options.find(item => item.name === activeName) : null;
|
|
46
|
+
});
|
|
47
|
+
const computeActiveDefaultTab = (0, _vue.computed)(() => {
|
|
48
|
+
const {
|
|
49
|
+
staticTabs,
|
|
50
|
+
activeName
|
|
51
|
+
} = reactData;
|
|
52
|
+
return staticTabs.find(item => item.name === activeName);
|
|
53
|
+
});
|
|
54
|
+
const computeMaps = {};
|
|
55
|
+
const $xeTabs = {
|
|
56
|
+
xID,
|
|
57
|
+
props,
|
|
58
|
+
context,
|
|
59
|
+
reactData,
|
|
60
|
+
getRefMaps: () => refMaps,
|
|
61
|
+
getComputeMaps: () => computeMaps
|
|
62
|
+
};
|
|
63
|
+
const callSlot = (slotFunc, params) => {
|
|
64
|
+
if (slotFunc) {
|
|
65
|
+
if (_xeUtils.default.isString(slotFunc)) {
|
|
66
|
+
slotFunc = slots[slotFunc] || null;
|
|
67
|
+
}
|
|
68
|
+
if (_xeUtils.default.isFunction(slotFunc)) {
|
|
69
|
+
return (0, _vn.getSlotVNs)(slotFunc(params));
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
return [];
|
|
73
|
+
};
|
|
74
|
+
const updateLineStyle = () => {
|
|
75
|
+
(0, _vue.nextTick)(() => {
|
|
76
|
+
const {
|
|
77
|
+
type,
|
|
78
|
+
options
|
|
79
|
+
} = props;
|
|
80
|
+
const {
|
|
81
|
+
staticTabs,
|
|
82
|
+
activeName
|
|
83
|
+
} = reactData;
|
|
84
|
+
const headerWrapperEl = refHeaderElem.value;
|
|
85
|
+
if (headerWrapperEl && !type) {
|
|
86
|
+
const index = _xeUtils.default.findIndexOf(staticTabs.length ? staticTabs : options, item => item.name === activeName);
|
|
87
|
+
if (index > -1) {
|
|
88
|
+
const tabEl = headerWrapperEl.children[index];
|
|
89
|
+
const tabWidth = tabEl.clientWidth;
|
|
90
|
+
const lintWidth = Math.max(4, Math.floor(tabWidth * 0.6));
|
|
91
|
+
reactData.lintLeft = tabEl.offsetLeft + Math.floor((tabWidth - lintWidth) / 2);
|
|
92
|
+
reactData.lintWidth = lintWidth;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
};
|
|
97
|
+
const clickEvent = (evnt, item) => {
|
|
98
|
+
const {
|
|
99
|
+
initNames
|
|
100
|
+
} = reactData;
|
|
101
|
+
const {
|
|
102
|
+
name
|
|
103
|
+
} = item;
|
|
104
|
+
if (!initNames.includes(name)) {
|
|
105
|
+
initNames.push(name);
|
|
106
|
+
}
|
|
107
|
+
reactData.activeName = name;
|
|
108
|
+
updateLineStyle();
|
|
109
|
+
};
|
|
110
|
+
const renderTabHeader = list => {
|
|
111
|
+
const {
|
|
112
|
+
type
|
|
113
|
+
} = props;
|
|
114
|
+
const {
|
|
115
|
+
activeName,
|
|
116
|
+
lintLeft,
|
|
117
|
+
lintWidth
|
|
118
|
+
} = reactData;
|
|
119
|
+
return (0, _vue.h)('div', {
|
|
120
|
+
class: 'vxe-tabs-header'
|
|
121
|
+
}, [(0, _vue.h)('div', {
|
|
122
|
+
ref: refHeaderElem,
|
|
123
|
+
class: 'vxe-tabs-header--wrapper'
|
|
124
|
+
}, list.map(item => {
|
|
125
|
+
const {
|
|
126
|
+
title,
|
|
127
|
+
name,
|
|
128
|
+
slots
|
|
129
|
+
} = item;
|
|
130
|
+
const tabSlot = slots ? slots.tab : null;
|
|
131
|
+
return (0, _vue.h)('div', {
|
|
132
|
+
class: ['vxe-tab-header--item', {
|
|
133
|
+
'is--active': activeName === name
|
|
134
|
+
}],
|
|
135
|
+
onClick(evnt) {
|
|
136
|
+
clickEvent(evnt, item);
|
|
137
|
+
}
|
|
138
|
+
}, [(0, _vue.h)('div', {
|
|
139
|
+
class: 'vxe-tab-header--item-name'
|
|
140
|
+
}, tabSlot ? callSlot(tabSlot, {
|
|
141
|
+
name,
|
|
142
|
+
title
|
|
143
|
+
}) : `${title}`)]);
|
|
144
|
+
})), type ? null : (0, _vue.h)('span', {
|
|
145
|
+
class: 'vxe-tabs-header--active-line',
|
|
146
|
+
style: {
|
|
147
|
+
left: `${lintLeft}px`,
|
|
148
|
+
width: `${lintWidth}px`
|
|
149
|
+
}
|
|
150
|
+
})]);
|
|
151
|
+
};
|
|
152
|
+
const renderOptionPane = item => {
|
|
153
|
+
const {
|
|
154
|
+
initNames,
|
|
155
|
+
activeName
|
|
156
|
+
} = reactData;
|
|
157
|
+
const {
|
|
158
|
+
name,
|
|
159
|
+
slots
|
|
160
|
+
} = item;
|
|
161
|
+
const defaultSlot = slots ? slots.default : null;
|
|
162
|
+
return (0, _vue.h)(_tabPane.default, item, {
|
|
163
|
+
default() {
|
|
164
|
+
return name && initNames.includes(name) ? (0, _vue.h)('div', {
|
|
165
|
+
class: ['vxe-tab-pane--item', {
|
|
166
|
+
'is--visible': activeName === name
|
|
167
|
+
}]
|
|
168
|
+
}, callSlot(defaultSlot, {})) : (0, _vue.createCommentVNode)();
|
|
169
|
+
}
|
|
170
|
+
});
|
|
171
|
+
};
|
|
172
|
+
const renderOptionContent = options => {
|
|
173
|
+
const {
|
|
174
|
+
destroyOnClose
|
|
175
|
+
} = props;
|
|
176
|
+
const activeOptionTab = computeActiveOptionTab.value;
|
|
177
|
+
if (destroyOnClose) {
|
|
178
|
+
return activeOptionTab ? renderOptionPane(activeOptionTab) : (0, _vue.createCommentVNode)();
|
|
179
|
+
}
|
|
180
|
+
return options.map(renderOptionPane);
|
|
181
|
+
};
|
|
182
|
+
const renderDefaultPane = item => {
|
|
183
|
+
const {
|
|
184
|
+
initNames,
|
|
185
|
+
activeName
|
|
186
|
+
} = reactData;
|
|
187
|
+
const {
|
|
188
|
+
name,
|
|
189
|
+
slots
|
|
190
|
+
} = item;
|
|
191
|
+
const defaultSlot = slots ? slots.default : null;
|
|
192
|
+
return name && initNames.includes(name) ? (0, _vue.h)('div', {
|
|
193
|
+
class: ['vxe-tab-pane--item', {
|
|
194
|
+
'is--visible': activeName === name
|
|
195
|
+
}]
|
|
196
|
+
}, callSlot(defaultSlot, {})) : (0, _vue.createCommentVNode)();
|
|
197
|
+
};
|
|
198
|
+
const renderDefaultContent = staticTabs => {
|
|
199
|
+
const {
|
|
200
|
+
destroyOnClose
|
|
201
|
+
} = props;
|
|
202
|
+
const activeDefaultTab = computeActiveDefaultTab.value;
|
|
203
|
+
if (destroyOnClose) {
|
|
204
|
+
return activeDefaultTab ? renderDefaultPane(activeDefaultTab) : (0, _vue.createCommentVNode)();
|
|
205
|
+
}
|
|
206
|
+
return staticTabs.map(renderDefaultPane);
|
|
207
|
+
};
|
|
208
|
+
const renderVN = () => {
|
|
209
|
+
const {
|
|
210
|
+
type,
|
|
211
|
+
options
|
|
212
|
+
} = props;
|
|
213
|
+
const {
|
|
214
|
+
staticTabs
|
|
215
|
+
} = reactData;
|
|
216
|
+
const defaultSlot = slots.default;
|
|
217
|
+
return (0, _vue.h)('div', {
|
|
218
|
+
ref: refElem,
|
|
219
|
+
class: ['vxe-tabs', `vxe-tabs--${type || 'default'}`]
|
|
220
|
+
}, [(0, _vue.h)('div', {
|
|
221
|
+
class: 'vxe-tabs-slots'
|
|
222
|
+
}, defaultSlot ? defaultSlot({}) : []), renderTabHeader(defaultSlot ? staticTabs : options || []), (0, _vue.h)('div', {
|
|
223
|
+
class: 'vxe-tabs-pane'
|
|
224
|
+
}, defaultSlot ? renderDefaultContent(staticTabs) : renderOptionContent(options || []))]);
|
|
225
|
+
};
|
|
226
|
+
(0, _vue.watch)(() => props.modelValue, val => {
|
|
227
|
+
reactData.activeName = val;
|
|
228
|
+
updateLineStyle();
|
|
229
|
+
});
|
|
230
|
+
(0, _vue.onMounted)(() => {
|
|
231
|
+
updateLineStyle();
|
|
232
|
+
});
|
|
233
|
+
$xeTabs.renderVN = renderVN;
|
|
234
|
+
(0, _vue.provide)('$xeTabs', $xeTabs);
|
|
235
|
+
return $xeTabs;
|
|
236
|
+
},
|
|
237
|
+
render() {
|
|
238
|
+
return this.renderVN();
|
|
239
|
+
}
|
|
240
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_tabPane=_interopRequireDefault(require("./tab-pane")),_vn=require("../../ui/src/vn");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTabs",props:{modelValue:[String,Number,Boolean],options:Array,destroyOnClose:Boolean,type:String},emits:[],setup(n,e){const i=e["slots"];var t=_xeUtils.default.uniqueId();const u=(0,_vue.ref)(),l=(0,_vue.ref)(),r=(0,_vue.reactive)({staticTabs:[],activeName:n.modelValue,initNames:n.modelValue?[n.modelValue]:[],lintLeft:0,lintWidth:0}),a={refElem:u},v=(0,_vue.computed)(()=>{var e=n["options"];const t=r["activeName"];return e?e.find(e=>e.name===t):null}),o=(0,_vue.computed)(()=>{const{staticTabs:e,activeName:t}=r;return e.find(e=>e.name===t)}),s={};t={xID:t,props:n,context:e,reactData:r,getRefMaps:()=>a,getComputeMaps:()=>s};const d=(e,t)=>e&&(_xeUtils.default.isString(e)&&(e=i[e]||null),_xeUtils.default.isFunction(e))?(0,_vn.getSlotVNs)(e(t)):[],c=()=>{(0,_vue.nextTick)(()=>{var{type:e,options:t}=n;const{staticTabs:a,activeName:s}=r;var i=l.value;i&&!e&&-1<(e=_xeUtils.default.findIndexOf(a.length?a:t,e=>e.name===s))&&(i=(t=i.children[e]).clientWidth,e=Math.max(4,Math.floor(.6*i)),r.lintLeft=t.offsetLeft+Math.floor((i-e)/2),r.lintWidth=e)})},m=(e,t)=>{var a=r["initNames"],t=t["name"];a.includes(t)||a.push(t),r.activeName=t,c()},_=e=>{const{initNames:t,activeName:a}=r,{name:s,slots:i}=e,n=i?i.default:null;return(0,_vue.h)(_tabPane.default,e,{default(){return s&&t.includes(s)?(0,_vue.h)("div",{class:["vxe-tab-pane--item",{"is--visible":a===s}]},d(n,{})):(0,_vue.createCommentVNode)()}})},p=e=>{var{initNames:t,activeName:a}=r,{name:e,slots:s}=e,s=s?s.default:null;return e&&t.includes(e)?(0,_vue.h)("div",{class:["vxe-tab-pane--item",{"is--visible":a===e}]},d(s,{})):(0,_vue.createCommentVNode)()};return(0,_vue.watch)(()=>n.modelValue,e=>{r.activeName=e,c()}),(0,_vue.onMounted)(()=>{c()}),t.renderVN=()=>{var{type:e,options:t}=n,a=r["staticTabs"],s=i.default;return(0,_vue.h)("div",{ref:u,class:["vxe-tabs","vxe-tabs--"+(e||"default")]},[(0,_vue.h)("div",{class:"vxe-tabs-slots"},s?s({}):[]),(e=>{var t=n["type"];const{activeName:i,lintLeft:a,lintWidth:s}=r;return(0,_vue.h)("div",{class:"vxe-tabs-header"},[(0,_vue.h)("div",{ref:l,class:"vxe-tabs-header--wrapper"},e.map(t=>{var{title:e,name:a,slots:s}=t,s=s?s.tab:null;return(0,_vue.h)("div",{class:["vxe-tab-header--item",{"is--active":i===a}],onClick(e){m(e,t)}},[(0,_vue.h)("div",{class:"vxe-tab-header--item-name"},s?d(s,{name:a,title:e}):""+e)])})),t?null:(0,_vue.h)("span",{class:"vxe-tabs-header--active-line",style:{left:a+"px",width:s+"px"}})])})(s?a:t||[]),(0,_vue.h)("div",{class:"vxe-tabs-pane"},s?(e=a,s=n.destroyOnClose,a=o.value,s?a?p(a):(0,_vue.createCommentVNode)():e.map(p)):(s=t||[],a=n.destroyOnClose,e=v.value,a?e?_(e):(0,_vue.createCommentVNode)():s.map(_)))])},(0,_vue.provide)("$xeTabs",t),t},render(){return this.renderVN()}});
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.assembleAnchorTab = assembleAnchorTab;
|
|
7
|
+
exports.destroyAnchorTab = destroyAnchorTab;
|
|
8
|
+
var _xeUtils = _interopRequireDefault(require("xe-utils"));
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
+
function assembleAnchorTab($xeTabs, elem, tabConfig) {
|
|
11
|
+
const staticLinks = $xeTabs.reactData.staticTabs;
|
|
12
|
+
const parentElem = elem.parentNode;
|
|
13
|
+
if (parentElem) {
|
|
14
|
+
staticLinks.splice(_xeUtils.default.arrayIndexOf(parentElem.children, elem), 0, tabConfig);
|
|
15
|
+
$xeTabs.reactData.staticTabs = staticLinks.slice(0);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
function destroyAnchorTab($xeTabs, tabConfig) {
|
|
19
|
+
const staticTabs = $xeTabs.reactData.staticTabs;
|
|
20
|
+
const matchObj = _xeUtils.default.findTree(staticTabs, item => item.id === tabConfig.id, {
|
|
21
|
+
children: 'children'
|
|
22
|
+
});
|
|
23
|
+
if (matchObj) {
|
|
24
|
+
matchObj.items.splice(matchObj.index, 1);
|
|
25
|
+
}
|
|
26
|
+
$xeTabs.reactData.staticTabs = staticTabs.slice(0);
|
|
27
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.assembleAnchorTab=assembleAnchorTab,exports.destroyAnchorTab=destroyAnchorTab;var _xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function assembleAnchorTab(e,t,a){var r=e.reactData.staticTabs,s=t.parentNode;s&&(r.splice(_xeUtils.default.arrayIndexOf(s.children,t),0,a),e.reactData.staticTabs=r.slice(0))}function destroyAnchorTab(e,t){var a=e.reactData.staticTabs,r=_xeUtils.default.findTree(a,e=>e.id===t.id,{children:"children"});r&&r.items.splice(r.index,1),e.reactData.staticTabs=a.slice(0)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
require('./style.css')
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
.vxe-tabs {
|
|
2
|
+
background-color: var(--vxe-ui-layout-background-color);
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.vxe-tabs-header {
|
|
6
|
+
position: relative;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.vxe-tabs-header--wrapper {
|
|
10
|
+
position: relative;
|
|
11
|
+
display: flex;
|
|
12
|
+
flex-direction: row;
|
|
13
|
+
}
|
|
14
|
+
.vxe-tabs-header--wrapper::after {
|
|
15
|
+
content: "";
|
|
16
|
+
position: absolute;
|
|
17
|
+
left: 0;
|
|
18
|
+
bottom: 0;
|
|
19
|
+
width: 100%;
|
|
20
|
+
height: 1px;
|
|
21
|
+
background-color: #e4e7ed;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.vxe-tab-header--item {
|
|
25
|
+
position: relative;
|
|
26
|
+
padding: 0 16px;
|
|
27
|
+
cursor: pointer;
|
|
28
|
+
}
|
|
29
|
+
.vxe-tab-header--item.is--active {
|
|
30
|
+
color: var(--vxe-ui-font-primary-color);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.vxe-tab-header--item-name {
|
|
34
|
+
height: 40px;
|
|
35
|
+
line-height: 40px;
|
|
36
|
+
border-bottom: 2px solid transparent;
|
|
37
|
+
transition: color 0.3s ease-in-out;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.vxe-tab-pane--item {
|
|
41
|
+
display: none;
|
|
42
|
+
padding: var(--vxe-ui-layout-padding-default);
|
|
43
|
+
}
|
|
44
|
+
.vxe-tab-pane--item.is--visible {
|
|
45
|
+
display: block;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.vxe-tabs-header--active-line {
|
|
49
|
+
display: none;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.vxe-tabs--default .vxe-tabs-header--active-line {
|
|
53
|
+
display: block;
|
|
54
|
+
position: absolute;
|
|
55
|
+
bottom: -1px;
|
|
56
|
+
left: 0;
|
|
57
|
+
height: 2px;
|
|
58
|
+
width: 4px;
|
|
59
|
+
background-color: var(--vxe-ui-font-primary-color);
|
|
60
|
+
z-index: 1;
|
|
61
|
+
transition: all 0.3s ease-in-out;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.vxe-tabs--card .vxe-tabs-header {
|
|
65
|
+
border-top: 1px solid #e4e7ed;
|
|
66
|
+
border-left: 1px solid #e4e7ed;
|
|
67
|
+
}
|
|
68
|
+
.vxe-tabs--card .vxe-tab-header--item {
|
|
69
|
+
border-left: 1px solid #e4e7ed;
|
|
70
|
+
}
|
|
71
|
+
.vxe-tabs--card .vxe-tab-header--item:first-child {
|
|
72
|
+
border-left: 0;
|
|
73
|
+
}
|
|
74
|
+
.vxe-tabs--card .vxe-tab-header--item:last-child {
|
|
75
|
+
border-right: 1px solid #e4e7ed;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.vxe-tabs--border-card .vxe-tab-pane--item {
|
|
79
|
+
border-bottom: 1px solid #e4e7ed;
|
|
80
|
+
border-left: 1px solid #e4e7ed;
|
|
81
|
+
border-right: 1px solid #e4e7ed;
|
|
82
|
+
}
|
|
83
|
+
.vxe-tabs--border-card .vxe-tabs-header {
|
|
84
|
+
border-top: 1px solid #e4e7ed;
|
|
85
|
+
border-left: 1px solid #e4e7ed;
|
|
86
|
+
border-right: 1px solid #e4e7ed;
|
|
87
|
+
background-color: #f5f7fa;
|
|
88
|
+
}
|
|
89
|
+
.vxe-tabs--border-card .vxe-tab-header--item.is--active {
|
|
90
|
+
background-color: #ffffff;
|
|
91
|
+
}
|
|
92
|
+
.vxe-tabs--border-card .vxe-tab-header--item.is--active::before {
|
|
93
|
+
content: "";
|
|
94
|
+
position: absolute;
|
|
95
|
+
top: 0;
|
|
96
|
+
left: -1px;
|
|
97
|
+
width: calc(100% + 2px);
|
|
98
|
+
height: 100%;
|
|
99
|
+
border-left: 1px solid #e4e7ed;
|
|
100
|
+
border-right: 1px solid #e4e7ed;
|
|
101
|
+
pointer-events: none;
|
|
102
|
+
}
|
|
103
|
+
.vxe-tabs--border-card .vxe-tab-header--item.is--active::after {
|
|
104
|
+
content: "";
|
|
105
|
+
position: absolute;
|
|
106
|
+
bottom: 0;
|
|
107
|
+
left: 0;
|
|
108
|
+
width: 100%;
|
|
109
|
+
height: 1px;
|
|
110
|
+
background-color: var(--vxe-ui-layout-background-color);
|
|
111
|
+
pointer-events: none;
|
|
112
|
+
z-index: 1;
|
|
113
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.vxe-tabs{background-color:var(--vxe-ui-layout-background-color)}.vxe-tabs-header{position:relative}.vxe-tabs-header--wrapper{position:relative;display:flex;flex-direction:row}.vxe-tabs-header--wrapper::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background-color:#e4e7ed}.vxe-tab-header--item{position:relative;padding:0 16px;cursor:pointer}.vxe-tab-header--item.is--active{color:var(--vxe-ui-font-primary-color)}.vxe-tab-header--item-name{height:40px;line-height:40px;border-bottom:2px solid transparent;transition:color .3s ease-in-out}.vxe-tab-pane--item{display:none;padding:var(--vxe-ui-layout-padding-default)}.vxe-tab-pane--item.is--visible{display:block}.vxe-tabs-header--active-line{display:none}.vxe-tabs--default .vxe-tabs-header--active-line{display:block;position:absolute;bottom:-1px;left:0;height:2px;width:4px;background-color:var(--vxe-ui-font-primary-color);z-index:1;transition:all .3s ease-in-out}.vxe-tabs--card .vxe-tabs-header{border-top:1px solid #e4e7ed;border-left:1px solid #e4e7ed}.vxe-tabs--card .vxe-tab-header--item{border-left:1px solid #e4e7ed}.vxe-tabs--card .vxe-tab-header--item:first-child{border-left:0}.vxe-tabs--card .vxe-tab-header--item:last-child{border-right:1px solid #e4e7ed}.vxe-tabs--border-card .vxe-tab-pane--item{border-bottom:1px solid #e4e7ed;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed}.vxe-tabs--border-card .vxe-tabs-header{border-top:1px solid #e4e7ed;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed;background-color:#f5f7fa}.vxe-tabs--border-card .vxe-tab-header--item.is--active{background-color:#fff}.vxe-tabs--border-card .vxe-tab-header--item.is--active::before{content:"";position:absolute;top:0;left:-1px;width:calc(100% + 2px);height:100%;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed;pointer-events:none}.vxe-tabs--border-card .vxe-tab-header--item.is--active::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--vxe-ui-layout-background-color);pointer-events:none;z-index:1}
|
|
@@ -56,7 +56,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
56
56
|
emit
|
|
57
57
|
} = context;
|
|
58
58
|
const $xeform = (0, _vue.inject)('$xeForm', null);
|
|
59
|
-
const
|
|
59
|
+
const formItemInfo = (0, _vue.inject)('xeFormItemInfo', null);
|
|
60
60
|
const xID = _xeUtils.default.uniqueId();
|
|
61
61
|
const computeSize = (0, _size.useSize)(props);
|
|
62
62
|
const reactData = (0, _vue.reactive)({
|
|
@@ -155,8 +155,8 @@ var _default = exports.default = (0, _vue.defineComponent)({
|
|
|
155
155
|
value
|
|
156
156
|
}, evnt);
|
|
157
157
|
// 自动更新校验状态
|
|
158
|
-
if ($xeform &&
|
|
159
|
-
$xeform.triggerItemEvent(evnt,
|
|
158
|
+
if ($xeform && formItemInfo) {
|
|
159
|
+
$xeform.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
|
|
160
160
|
}
|
|
161
161
|
}
|
|
162
162
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_globalStore=_interopRequireDefault(require("../../ui/src/globalStore")),_utils=require("../../ui/src/utils"),_i18n=require("../../ui/src/i18n"),_size=require("../../hooks/size");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let autoTxtElem;var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTextarea",props:{modelValue:[String,Number],className:String,immediate:{type:Boolean,default:!0},name:String,readonly:Boolean,disabled:Boolean,placeholder:{type:String,default:()=>_xeUtils.default.eqNull(_globalStore.default.textarea.placeholder)?(0,_i18n.getI18n)("vxe.base.pleaseInput"):_globalStore.default.textarea.placeholder},maxlength:[String,Number],rows:{type:[String,Number],default:2},cols:{type:[String,Number],default:null},showWordCount:Boolean,countMethod:Function,autosize:[Boolean,Object],form:String,resize:{type:String,default:()=>_globalStore.default.textarea.resize},size:{type:String,default:()=>_globalStore.default.textarea.size||_globalStore.default.size}},emits:["update:modelValue","input","keydown","keyup","click","change","focus","blur"],setup(v,e){const l=e["emit"],a=(0,_vue.inject)("$xeForm",null),u=(0,_vue.inject)("
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_globalStore=_interopRequireDefault(require("../../ui/src/globalStore")),_utils=require("../../ui/src/utils"),_i18n=require("../../ui/src/i18n"),_size=require("../../hooks/size");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let autoTxtElem;var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTextarea",props:{modelValue:[String,Number],className:String,immediate:{type:Boolean,default:!0},name:String,readonly:Boolean,disabled:Boolean,placeholder:{type:String,default:()=>_xeUtils.default.eqNull(_globalStore.default.textarea.placeholder)?(0,_i18n.getI18n)("vxe.base.pleaseInput"):_globalStore.default.textarea.placeholder},maxlength:[String,Number],rows:{type:[String,Number],default:2},cols:{type:[String,Number],default:null},showWordCount:Boolean,countMethod:Function,autosize:[Boolean,Object],form:String,resize:{type:String,default:()=>_globalStore.default.textarea.resize},size:{type:String,default:()=>_globalStore.default.textarea.size||_globalStore.default.size}},emits:["update:modelValue","input","keydown","keyup","click","change","focus","blur"],setup(v,e){const l=e["emit"],a=(0,_vue.inject)("$xeForm",null),u=(0,_vue.inject)("xeFormItemInfo",null);var t=_xeUtils.default.uniqueId();const x=(0,_size.useSize)(v),_=(0,_vue.reactive)({inputValue:v.modelValue}),f=(0,_vue.ref)(),g=(0,_vue.ref)(),r={refElem:f,refTextarea:g},i={xID:t,props:v,context:e,reactData:_,getRefMaps:()=>r};let o;const h=(0,_vue.computed)(()=>_xeUtils.default.getSize(_.inputValue)),b=(0,_vue.computed)(()=>{var e=h.value;return v.maxlength&&e>_xeUtils.default.toNumber(v.maxlength)}),n=(0,_vue.computed)(()=>Object.assign({minRows:1,maxRows:10},_globalStore.default.textarea.autosize,v.autosize)),s=()=>{var e,{size:t,autosize:a}=v,l=_["inputValue"];a&&((autoTxtElem=autoTxtElem||document.createElement("div")).parentNode||document.body.appendChild(autoTxtElem),a=g.value,e=getComputedStyle(a),autoTxtElem.className=["vxe-textarea--autosize",t?"size--"+t:""].join(" "),autoTxtElem.style.width=a.clientWidth+"px",autoTxtElem.style.padding=e.padding,autoTxtElem.innerText=(""+(l||" ")).replace(/\n$/,"\n "))},d=()=>{v.autosize&&(0,_vue.nextTick)(()=>{var{minRows:e,maxRows:t}=n.value,a=g.value,l=autoTxtElem.clientHeight,u=getComputedStyle(a),r=_xeUtils.default.toNumber(u.lineHeight),u=_xeUtils.default.toNumber(u.paddingTop)+_xeUtils.default.toNumber(u.paddingBottom)+_xeUtils.default.toNumber(u.borderTopWidth)+_xeUtils.default.toNumber(u.borderBottomWidth),l=(l-u)/r,l=l&&/[0-9]/.test(""+l)?l:Math.floor(l)+1;let i=l;l<e?i=e:t<l&&(i=t),a.style.height=i*r+u+"px"})},z=e=>{var t=_.inputValue;i.dispatchEvent(e.type,{value:t},e)},m=(e,t)=>{_.inputValue=e,l("update:modelValue",e),_xeUtils.default.toValueString(v.modelValue)!==e&&(o.dispatchEvent("change",{value:e},t),a)&&u&&a.triggerItemEvent(t,u.itemConfig.field,e)},S=e=>{var t=v["immediate"],a=e.target.value;_.inputValue=a,t&&m(a,e),i.dispatchEvent("input",{value:a},e),d()},y=e=>{var t=v["immediate"];t?z(e):m(_.inputValue,e)},V=e=>{var t=v["immediate"],a=_["inputValue"];t||m(a,e),i.dispatchEvent("blur",{value:a},e)};o={dispatchEvent(e,t,a){l(e,Object.assign({$textarea:i,$event:a},t))},focus(){return g.value.focus(),(0,_vue.nextTick)()},blur(){return g.value.blur(),(0,_vue.nextTick)()}},Object.assign(i,o),(0,_vue.watch)(()=>v.modelValue,e=>{_.inputValue=e,s()}),(0,_vue.nextTick)(()=>{var e=v["autosize"];e&&(s(),d())});return i.renderVN=()=>{var{className:e,resize:t,placeholder:a,disabled:l,maxlength:u,autosize:r,showWordCount:i,countMethod:o,rows:n,cols:s}=v,d=_["inputValue"],m=x.value,p=b.value,c=h.value;return(0,_vue.h)("div",{ref:f,class:["vxe-textarea",e,{["size--"+m]:m,"is--autosize":r,"is--count":i,"is--disabled":l,"def--rows":!_xeUtils.default.eqNull(n),"def--cols":!_xeUtils.default.eqNull(s)}]},[(0,_vue.h)("textarea",{ref:g,class:"vxe-textarea--inner",value:d,name:v.name,placeholder:a?(0,_utils.getFuncText)(a):null,maxlength:u,readonly:v.readonly,disabled:l,rows:n,cols:s,style:t?{resize:t}:null,onInput:S,onChange:y,onKeydown:z,onKeyup:z,onClick:z,onFocus:z,onBlur:V}),i?(0,_vue.h)("span",{class:["vxe-textarea--count",{"is--error":p}]},o?""+o({value:d}):c+(u?"/"+u:"")):null])},i},render(){return this.renderVN()}});
|
package/lib/ui/src/core.js
CHANGED
|
@@ -84,7 +84,7 @@ function setIcon(options) {
|
|
|
84
84
|
function getIcon(key) {
|
|
85
85
|
return arguments.length ? _xeUtils.default.get(_iconStore.default, key) : _iconStore.default;
|
|
86
86
|
}
|
|
87
|
-
const version = exports.version = "0.
|
|
87
|
+
const version = exports.version = "0.2.0";
|
|
88
88
|
const VxeCore = {
|
|
89
89
|
version,
|
|
90
90
|
setConfig,
|
package/lib/ui/src/core.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _exportNames={setConfig:!0,getConfig:!0,setIcon:!0,getIcon:!0,version:!0},_xeUtils=(exports.default=void 0,exports.getConfig=getConfig,exports.getIcon=getIcon,exports.setConfig=setConfig,exports.setIcon=setIcon,exports.version=void 0,_interopRequireDefault(require("xe-utils"))),_domZindex=_interopRequireDefault(require("dom-zindex")),_globalStore=_interopRequireDefault(require("./globalStore")),_iconStore=_interopRequireDefault(require("./iconStore")),_theme=_interopRequireDefault(require("./theme")),_i18n=require("./i18n"),_renderer=(Object.keys(_i18n).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_i18n[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _i18n[e]}})}),require("./renderer")),_validators=(Object.keys(_renderer).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_renderer[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _renderer[e]}})}),require("./validators"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function setConfig(e){return e&&(e.theme&&(0,_theme.default)(e),e.zIndex)&&_domZindex.default.setCurrent(e.zIndex),e?_xeUtils.default.merge(_globalStore.default,e):_globalStore.default}function getConfig(e,t){return arguments.length?_xeUtils.default.get(_globalStore.default,e,t):_globalStore.default}function setIcon(e){return e?Object.assign(_iconStore.default,e):_iconStore.default}function getIcon(e){return arguments.length?_xeUtils.default.get(_iconStore.default,e):_iconStore.default}Object.keys(_validators).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_validators[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _validators[e]}})});const version=exports.version="0.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _exportNames={setConfig:!0,getConfig:!0,setIcon:!0,getIcon:!0,version:!0},_xeUtils=(exports.default=void 0,exports.getConfig=getConfig,exports.getIcon=getIcon,exports.setConfig=setConfig,exports.setIcon=setIcon,exports.version=void 0,_interopRequireDefault(require("xe-utils"))),_domZindex=_interopRequireDefault(require("dom-zindex")),_globalStore=_interopRequireDefault(require("./globalStore")),_iconStore=_interopRequireDefault(require("./iconStore")),_theme=_interopRequireDefault(require("./theme")),_i18n=require("./i18n"),_renderer=(Object.keys(_i18n).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_i18n[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _i18n[e]}})}),require("./renderer")),_validators=(Object.keys(_renderer).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_renderer[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _renderer[e]}})}),require("./validators"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function setConfig(e){return e&&(e.theme&&(0,_theme.default)(e),e.zIndex)&&_domZindex.default.setCurrent(e.zIndex),e?_xeUtils.default.merge(_globalStore.default,e):_globalStore.default}function getConfig(e,t){return arguments.length?_xeUtils.default.get(_globalStore.default,e,t):_globalStore.default}function setIcon(e){return e?Object.assign(_iconStore.default,e):_iconStore.default}function getIcon(e){return arguments.length?_xeUtils.default.get(_iconStore.default,e):_iconStore.default}Object.keys(_validators).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_validators[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _validators[e]}})});const version=exports.version="0.2.0",VxeCore={version:version,setConfig:setConfig,getConfig:getConfig,setIcon:setIcon,getIcon:getIcon,getI18n:_i18n.getI18n,renderer:_renderer.renderer,validators:_validators.validators,modal:null};(0,_theme.default)();var _default=exports.default=VxeCore;
|
package/lib/ui/src/log.js
CHANGED
|
@@ -8,7 +8,7 @@ exports.getLog = getLog;
|
|
|
8
8
|
exports.warnLog = void 0;
|
|
9
9
|
var _i18n = require("./i18n");
|
|
10
10
|
function getLog(message, params) {
|
|
11
|
-
return `[vxe-table v${"0.
|
|
11
|
+
return `[vxe-table v${"0.2.0"}] ${(0, _i18n.getI18n)(message, params)}`;
|
|
12
12
|
}
|
|
13
13
|
function outLog(type) {
|
|
14
14
|
return function (message, params) {
|
package/lib/ui/src/log.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.errLog=void 0,exports.getLog=getLog,exports.warnLog=void 0;var _i18n=require("./i18n");function getLog(o,e){return"[vxe-table v0.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.errLog=void 0,exports.getLog=getLog,exports.warnLog=void 0;var _i18n=require("./i18n");function getLog(o,e){return"[vxe-table v0.2.0] "+(0,_i18n.getI18n)(o,e)}function outLog(r){return function(o,e){o=getLog(o,e);return console[r](o),o}}const warnLog=exports.warnLog=outLog("warn"),errLog=exports.errLog=outLog("error");
|