zartui 2.0.5 → 2.0.7

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.
@@ -1 +1 @@
1
- .zt-cascader__header{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;height:44px;padding:0 16px}.zt-cascader__title{font-weight:700;font-size:16px;line-height:44px}.zt-cascader__close-icon{color:rgba(0,0,0,.4);font-size:20px}.zt-cascader__close-icon:active{color:rgba(0,0,0,.6)}.zt-cascader__tabs .zt-tab{-webkit-box-flex:0;-webkit-flex:none;flex:none;margin:0 8px;padding:0}.zt-cascader__tabs.zt-tabs--line .zt-tabs__wrap{height:48px}.zt-cascader__tabs .zt-tabs__nav--complete{padding-right:8px;padding-left:8px}.zt-cascader__tab{color:#000;font-weight:700;font-size:14px;line-height:44px}.zt-cascader__tab--unselected{color:rgba(0,0,0,.4);font-weight:400}.zt-cascader__option{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;font-family:PingFangSC-Regular;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;color:#000;padding:0 16px;font-weight:400;font-size:14px;line-height:44px}.zt-cascader__option:active{background-color:rgba(0,0,0,.04)}.zt-cascader__option--selected{color:#0091fa;font-weight:700}.zt-cascader__selected-icon{font-size:24px}.zt-cascader__options{box-sizing:border-box;height:352px;overflow-y:auto;-webkit-overflow-scrolling:touch}
1
+ .zt-cascader__header{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;height:44px;padding:0 16px}.zt-cascader__title{font-weight:700;font-size:14px;line-height:44px;color:rgba(45,75,115,.4)}.zt-cascader__tabs .zt-tab{-webkit-box-flex:0;-webkit-flex:none;flex:none;margin:0 8px;padding:0}.zt-cascader__tabs .zt-tabs__wrap{position:relative;height:44px}.zt-cascader__tabs .zt-tabs__wrap::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt-cascader__tabs .zt-tabs__nav--complete{padding-right:8px;padding-left:8px}.zt-cascader__tab{color:#2d4b73;font-weight:700;font-size:14px;line-height:44px}.zt-cascader__tab--unselected{color:rgba(45,75,115,.4);font-weight:400}.zt-cascader__option{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;font-family:PingFangSC-Regular;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;color:#2d4b73;padding:0 16px;font-weight:400;font-size:14px;line-height:44px}.zt-cascader__option:active{background-color:rgba(0,0,0,.04)}.zt-cascader__option--selected{color:#0091fa;font-weight:700}.zt-cascader__selected-icon{font-size:24px}.zt-cascader__options{box-sizing:border-box;height:352px;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-cascader .zt-tabs__nav{background:#fff}.zt-cascader__cancel{margin:8px 16px;width:calc(100% - 32px);background:rgba(45,75,115,.04);border-radius:20.5px}
@@ -2,6 +2,7 @@ import { createNamespace } from '../utils';
2
2
  import Tab from '../tab';
3
3
  import Tabs from '../tabs';
4
4
  import Icon from '../icon';
5
+ import Button from '../button';
5
6
  import Divider from "../divider";
6
7
 
7
8
  var _createNamespace = createNamespace('cascader'),
@@ -21,10 +22,6 @@ export default createComponent({
21
22
  default: function _default() {
22
23
  return [];
23
24
  }
24
- },
25
- closeable: {
26
- type: Boolean,
27
- default: true
28
25
  }
29
26
  },
30
27
  data: function data() {
@@ -180,8 +177,8 @@ export default createComponent({
180
177
  this.$emit('finish', eventParams);
181
178
  }
182
179
  },
183
- onClose: function onClose() {
184
- this.$emit('close');
180
+ onCancel: function onCancel() {
181
+ this.$emit('cancel');
185
182
  },
186
183
  renderHeader: function renderHeader() {
187
184
  var h = this.$createElement;
@@ -189,15 +186,7 @@ export default createComponent({
189
186
  "class": bem('header')
190
187
  }, [h("h2", {
191
188
  "class": bem('title')
192
- }, [this.slots('title') || this.title]), this.closeable ? h(Icon, {
193
- "attrs": {
194
- "name": "cross"
195
- },
196
- "class": bem('close-icon'),
197
- "on": {
198
- "click": this.onClose
199
- }
200
- }) : null]);
189
+ }, [this.slots('title') || this.title])]);
201
190
  },
202
191
  renderDivider: function renderDivider() {
203
192
  var h = this.$createElement;
@@ -275,12 +264,25 @@ export default createComponent({
275
264
  }
276
265
  }
277
266
  }, [this.tabs.map(this.renderTab)]);
267
+ },
268
+ renderMenu: function renderMenu() {
269
+ var h = this.$createElement;
270
+ return h(Button, {
271
+ "class": bem('cancel'),
272
+ "attrs": {
273
+ "background-color": "rgba(45, 75, 115, 0.04)",
274
+ "color": "#2D4B73"
275
+ },
276
+ "on": {
277
+ "click": this.onCancel
278
+ }
279
+ }, ["\u53D6\u6D88"]);
278
280
  }
279
281
  },
280
282
  render: function render() {
281
283
  var h = arguments[0];
282
284
  return h("div", {
283
285
  "class": bem()
284
- }, [this.renderHeader(), this.renderDivider(), this.renderTabs()]);
286
+ }, [this.renderHeader(), this.renderDivider(), this.renderTabs(), this.renderDivider(), this.renderMenu()]);
285
287
  }
286
288
  });
@@ -1,10 +1,11 @@
1
1
  @import '../style/var';
2
+ @import '../style/mixins/hairline';
2
3
 
3
4
  .zt-cascader {
4
5
  &__header {
5
6
  display: flex;
6
7
  align-items: center;
7
- justify-content: space-between;
8
+ justify-content: center;
8
9
  height: @cascader-header-height;
9
10
  padding: 0 @padding-md;
10
11
  }
@@ -13,15 +14,8 @@
13
14
  font-weight: @font-weight-bold;
14
15
  font-size: @cascader-title-font-size;
15
16
  line-height: @cascader-title-line-height;
16
- }
17
-
18
- &__close-icon {
19
- color: @cascader-close-icon-color;
20
- font-size: @cascader-close-icon-size;
17
+ color: @cascader-title-color;
21
18
 
22
- &:active {
23
- color: @cascader-close-icon-active-color;
24
- }
25
19
  }
26
20
 
27
21
  &__tabs {
@@ -31,8 +25,12 @@
31
25
  padding: 0;
32
26
  }
33
27
 
34
- &.zt-tabs--line .zt-tabs__wrap {
28
+ .zt-tabs__wrap {
29
+ position: relative;
35
30
  height: @cascader-tabs-height;
31
+ &::after {
32
+ .hairline-bottom()
33
+ }
36
34
  }
37
35
 
38
36
  .zt-tabs__nav--complete {
@@ -58,7 +56,7 @@
58
56
  align-items: center;
59
57
  font-family: PingFangSC-Regular;
60
58
  justify-content: space-between;
61
- color: @black;
59
+ color: #2D4B73;
62
60
  padding: 0 @padding-md;
63
61
  font-weight: normal;
64
62
  font-size: @font-size-md;
@@ -84,4 +82,15 @@
84
82
  overflow-y: auto;
85
83
  -webkit-overflow-scrolling: touch;
86
84
  }
85
+
86
+ .zt-tabs__nav {
87
+ background: #fff;
88
+ }
89
+
90
+ &__cancel {
91
+ margin: 8px 16px;
92
+ width: calc(100% - 32px);
93
+ background: rgba(45, 75, 115, 0.04);
94
+ border-radius: 20.5px;
95
+ }
87
96
  }
@@ -1,6 +1,8 @@
1
1
  import '../../style/base.css';
2
2
  import '../../info/index.css';
3
3
  import '../../icon/index.css';
4
+ import '../../loading/index.css';
5
+ import '../../button/index.css';
4
6
  import '../../tab/index.css';
5
7
  import '../../sticky/index.css';
6
8
  import '../../tabs/index.css';
@@ -1,6 +1,8 @@
1
1
  import '../../style/base.less';
2
2
  import '../../info/index.less';
3
3
  import '../../icon/index.less';
4
+ import '../../loading/index.less';
5
+ import '../../button/index.less';
4
6
  import '../../tab/index.less';
5
7
  import '../../sticky/index.less';
6
8
  import '../../tabs/index.less';
package/es/field/index.js CHANGED
@@ -626,9 +626,15 @@ export default createComponent({
626
626
  var slots = this.slots;
627
627
  var disabled = this.getProp('disabled');
628
628
  var labelAlign = this.getProp('labelAlign');
629
- var scopedSlots = {
630
- icon: this.genLeftIcon
631
- };
629
+ var scopedSlots = {};
630
+ var SlotIcon = this.genLeftIcon();
631
+
632
+ if (SlotIcon) {
633
+ scopedSlots.icon = function () {
634
+ return SlotIcon;
635
+ };
636
+ }
637
+
632
638
  var Label = this.genLabel();
633
639
 
634
640
  if (Label) {
package/es/index.js CHANGED
@@ -75,7 +75,7 @@ import Tag from './tag';
75
75
  import Timeline from './timeline';
76
76
  import Toast from './toast';
77
77
  import Uploader from './uploader';
78
- var version = '2.0.5';
78
+ var version = '2.0.7';
79
79
 
80
80
  function install(Vue) {
81
81
  var components = [ActionSheet, Area, Avatar, BackTop, Badge, Button, Calendar, Cascader, Cell, CellGroup, Checkbox, CheckboxGroup, Col, Collapse, CollapseItem, CountDown, DatetimePicker, Dialog, Divider, DropdownItem, DropdownMenu, Empty, Field, FoldDialog, Form, Grid, GridItem, HierarchySelect, Icon, Image, ImagePreview, IndexAnchor, IndexBar, Info, Lazyload, List, Loading, Locale, MediaPicker, MediaPlayer, MultiplePicker, NavBar, NoticeBar, NumberKeyboard, Overlay, PasswordInput, PdfViewer, Picker, Popover, Popup, PullRefresh, Radio, RadioGroup, Rate, Row, Search, Signature, Skeleton, Slider, Step, Stepper, Steps, Sticky, Swipe, SwipeCell, SwipeItem, Switch, SwitchCell, Tab, Tabbar, TabbarItem, Table, Tabs, Tag, Timeline, Toast, Uploader];
package/es/style/var.less CHANGED
@@ -257,17 +257,15 @@
257
257
 
258
258
  // Cascader
259
259
  @cascader-header-height: 44px;
260
- @cascader-title-font-size: @font-size-lg;
260
+ @cascader-title-font-size: @font-size-md;
261
261
  @cascader-title-line-height: 44px;
262
- @cascader-close-icon-size: 20px;
263
- @cascader-close-icon-color: @gray-a4;
264
- @cascader-close-icon-active-color: @gray-a6;
262
+ @cascader-title-color: rgba(45, 75, 115, 0.4);
265
263
  @cascader-selected-icon-size: 24px;
266
- @cascader-tabs-height: 48px;
264
+ @cascader-tabs-height: 44px;
267
265
  @cascader-active-color: @blue;
268
266
  @cascader-options-height: 352px;
269
- @cascader-tab-color: @black;
270
- @cascader-unselected-tab-color: @gray-a4;
267
+ @cascader-tab-color: rgba(45, 75, 115, 1);
268
+ @cascader-unselected-tab-color: rgba(45, 75, 115, 0.4);
271
269
 
272
270
  // Cell
273
271
  @cell-font-size: @font-size-lg;
@@ -1 +1 @@
1
- .zt-cascader__header{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;height:44px;padding:0 16px}.zt-cascader__title{font-weight:700;font-size:16px;line-height:44px}.zt-cascader__close-icon{color:rgba(0,0,0,.4);font-size:20px}.zt-cascader__close-icon:active{color:rgba(0,0,0,.6)}.zt-cascader__tabs .zt-tab{-webkit-box-flex:0;-webkit-flex:none;flex:none;margin:0 8px;padding:0}.zt-cascader__tabs.zt-tabs--line .zt-tabs__wrap{height:48px}.zt-cascader__tabs .zt-tabs__nav--complete{padding-right:8px;padding-left:8px}.zt-cascader__tab{color:#000;font-weight:700;font-size:14px;line-height:44px}.zt-cascader__tab--unselected{color:rgba(0,0,0,.4);font-weight:400}.zt-cascader__option{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;font-family:PingFangSC-Regular;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;color:#000;padding:0 16px;font-weight:400;font-size:14px;line-height:44px}.zt-cascader__option:active{background-color:rgba(0,0,0,.04)}.zt-cascader__option--selected{color:#0091fa;font-weight:700}.zt-cascader__selected-icon{font-size:24px}.zt-cascader__options{box-sizing:border-box;height:352px;overflow-y:auto;-webkit-overflow-scrolling:touch}
1
+ .zt-cascader__header{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;height:44px;padding:0 16px}.zt-cascader__title{font-weight:700;font-size:14px;line-height:44px;color:rgba(45,75,115,.4)}.zt-cascader__tabs .zt-tab{-webkit-box-flex:0;-webkit-flex:none;flex:none;margin:0 8px;padding:0}.zt-cascader__tabs .zt-tabs__wrap{position:relative;height:44px}.zt-cascader__tabs .zt-tabs__wrap::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt-cascader__tabs .zt-tabs__nav--complete{padding-right:8px;padding-left:8px}.zt-cascader__tab{color:#2d4b73;font-weight:700;font-size:14px;line-height:44px}.zt-cascader__tab--unselected{color:rgba(45,75,115,.4);font-weight:400}.zt-cascader__option{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;font-family:PingFangSC-Regular;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;color:#2d4b73;padding:0 16px;font-weight:400;font-size:14px;line-height:44px}.zt-cascader__option:active{background-color:rgba(0,0,0,.04)}.zt-cascader__option--selected{color:#0091fa;font-weight:700}.zt-cascader__selected-icon{font-size:24px}.zt-cascader__options{box-sizing:border-box;height:352px;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-cascader .zt-tabs__nav{background:#fff}.zt-cascader__cancel{margin:8px 16px;width:calc(100% - 32px);background:rgba(45,75,115,.04);border-radius:20.5px}
@@ -13,6 +13,8 @@ var _tabs = _interopRequireDefault(require("../tabs"));
13
13
 
14
14
  var _icon = _interopRequireDefault(require("../icon"));
15
15
 
16
+ var _button = _interopRequireDefault(require("../button"));
17
+
16
18
  var _divider = _interopRequireDefault(require("../divider"));
17
19
 
18
20
  var _createNamespace = (0, _utils.createNamespace)('cascader'),
@@ -32,10 +34,6 @@ var _default2 = createComponent({
32
34
  default: function _default() {
33
35
  return [];
34
36
  }
35
- },
36
- closeable: {
37
- type: Boolean,
38
- default: true
39
37
  }
40
38
  },
41
39
  data: function data() {
@@ -191,8 +189,8 @@ var _default2 = createComponent({
191
189
  this.$emit('finish', eventParams);
192
190
  }
193
191
  },
194
- onClose: function onClose() {
195
- this.$emit('close');
192
+ onCancel: function onCancel() {
193
+ this.$emit('cancel');
196
194
  },
197
195
  renderHeader: function renderHeader() {
198
196
  var h = this.$createElement;
@@ -200,15 +198,7 @@ var _default2 = createComponent({
200
198
  "class": bem('header')
201
199
  }, [h("h2", {
202
200
  "class": bem('title')
203
- }, [this.slots('title') || this.title]), this.closeable ? h(_icon.default, {
204
- "attrs": {
205
- "name": "cross"
206
- },
207
- "class": bem('close-icon'),
208
- "on": {
209
- "click": this.onClose
210
- }
211
- }) : null]);
201
+ }, [this.slots('title') || this.title])]);
212
202
  },
213
203
  renderDivider: function renderDivider() {
214
204
  var h = this.$createElement;
@@ -286,13 +276,26 @@ var _default2 = createComponent({
286
276
  }
287
277
  }
288
278
  }, [this.tabs.map(this.renderTab)]);
279
+ },
280
+ renderMenu: function renderMenu() {
281
+ var h = this.$createElement;
282
+ return h(_button.default, {
283
+ "class": bem('cancel'),
284
+ "attrs": {
285
+ "background-color": "rgba(45, 75, 115, 0.04)",
286
+ "color": "#2D4B73"
287
+ },
288
+ "on": {
289
+ "click": this.onCancel
290
+ }
291
+ }, ["\u53D6\u6D88"]);
289
292
  }
290
293
  },
291
294
  render: function render() {
292
295
  var h = arguments[0];
293
296
  return h("div", {
294
297
  "class": bem()
295
- }, [this.renderHeader(), this.renderDivider(), this.renderTabs()]);
298
+ }, [this.renderHeader(), this.renderDivider(), this.renderTabs(), this.renderDivider(), this.renderMenu()]);
296
299
  }
297
300
  });
298
301
 
@@ -1,10 +1,11 @@
1
1
  @import '../style/var';
2
+ @import '../style/mixins/hairline';
2
3
 
3
4
  .zt-cascader {
4
5
  &__header {
5
6
  display: flex;
6
7
  align-items: center;
7
- justify-content: space-between;
8
+ justify-content: center;
8
9
  height: @cascader-header-height;
9
10
  padding: 0 @padding-md;
10
11
  }
@@ -13,15 +14,8 @@
13
14
  font-weight: @font-weight-bold;
14
15
  font-size: @cascader-title-font-size;
15
16
  line-height: @cascader-title-line-height;
16
- }
17
-
18
- &__close-icon {
19
- color: @cascader-close-icon-color;
20
- font-size: @cascader-close-icon-size;
17
+ color: @cascader-title-color;
21
18
 
22
- &:active {
23
- color: @cascader-close-icon-active-color;
24
- }
25
19
  }
26
20
 
27
21
  &__tabs {
@@ -31,8 +25,12 @@
31
25
  padding: 0;
32
26
  }
33
27
 
34
- &.zt-tabs--line .zt-tabs__wrap {
28
+ .zt-tabs__wrap {
29
+ position: relative;
35
30
  height: @cascader-tabs-height;
31
+ &::after {
32
+ .hairline-bottom()
33
+ }
36
34
  }
37
35
 
38
36
  .zt-tabs__nav--complete {
@@ -58,7 +56,7 @@
58
56
  align-items: center;
59
57
  font-family: PingFangSC-Regular;
60
58
  justify-content: space-between;
61
- color: @black;
59
+ color: #2D4B73;
62
60
  padding: 0 @padding-md;
63
61
  font-weight: normal;
64
62
  font-size: @font-size-md;
@@ -84,4 +82,15 @@
84
82
  overflow-y: auto;
85
83
  -webkit-overflow-scrolling: touch;
86
84
  }
85
+
86
+ .zt-tabs__nav {
87
+ background: #fff;
88
+ }
89
+
90
+ &__cancel {
91
+ margin: 8px 16px;
92
+ width: calc(100% - 32px);
93
+ background: rgba(45, 75, 115, 0.04);
94
+ border-radius: 20.5px;
95
+ }
87
96
  }
@@ -1,6 +1,8 @@
1
1
  require('../../style/base.css');
2
2
  require('../../info/index.css');
3
3
  require('../../icon/index.css');
4
+ require('../../loading/index.css');
5
+ require('../../button/index.css');
4
6
  require('../../tab/index.css');
5
7
  require('../../sticky/index.css');
6
8
  require('../../tabs/index.css');
@@ -1,6 +1,8 @@
1
1
  require('../../style/base.less');
2
2
  require('../../info/index.less');
3
3
  require('../../icon/index.less');
4
+ require('../../loading/index.less');
5
+ require('../../button/index.less');
4
6
  require('../../tab/index.less');
5
7
  require('../../sticky/index.less');
6
8
  require('../../tabs/index.less');
@@ -642,9 +642,15 @@ var _default = createComponent({
642
642
  var slots = this.slots;
643
643
  var disabled = this.getProp('disabled');
644
644
  var labelAlign = this.getProp('labelAlign');
645
- var scopedSlots = {
646
- icon: this.genLeftIcon
647
- };
645
+ var scopedSlots = {};
646
+ var SlotIcon = this.genLeftIcon();
647
+
648
+ if (SlotIcon) {
649
+ scopedSlots.icon = function () {
650
+ return SlotIcon;
651
+ };
652
+ }
653
+
648
654
  var Label = this.genLabel();
649
655
 
650
656
  if (Label) {