n20-common-lib 2.6.49 → 2.6.51

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "n20-common-lib",
3
- "version": "2.6.49",
3
+ "version": "2.6.51",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -1,35 +1,45 @@
1
1
  .n20-pagination-1 {
2
2
  display: inline-block;
3
3
  padding-right: 5px;
4
- > * {
4
+
5
+ >* {
5
6
  vertical-align: middle;
6
7
  }
8
+
7
9
  .el-pagination {
8
10
  display: inline-block;
9
11
  }
12
+
10
13
  .btn-prev,
11
14
  .btn-next {
12
15
  padding-left: 6px;
13
16
  padding-right: 6px;
14
17
  border: 1px solid $--border-color-base;
18
+
15
19
  &:not([disabled]):hover {
16
20
  border-color: $--color-primary;
17
21
  }
18
22
  }
23
+
19
24
  .btn-next {
20
25
  margin-left: 6px;
21
26
  }
27
+
22
28
  .el-pagination {
23
29
  padding: 1px 5px;
24
30
  }
25
31
  }
32
+
26
33
  .n20-pagination-jumper-1 {
27
34
  width: 36px;
35
+ text-align: center;
28
36
  margin-left: 6px;
29
37
  margin-right: 6px;
38
+
30
39
  &.is-without-controls {
31
40
  .el-input__inner {
32
41
  height: 26px;
42
+ text-align: center;
33
43
  line-height: 26px;
34
44
  padding-left: 4px;
35
45
  padding-right: 4px;
@@ -37,19 +47,23 @@
37
47
  }
38
48
  }
39
49
  }
50
+
40
51
  .n20-pagination-sizes-1 {
41
52
  .el-radio-button__inner {
42
53
  border-radius: 2px !important;
43
54
  border: 1px solid $--border-color-base;
44
55
  box-shadow: none;
45
56
  }
46
- .el-radio-button__orig-radio:checked + .el-radio-button__inner {
57
+
58
+ .el-radio-button__orig-radio:checked+.el-radio-button__inner {
47
59
  border-color: $--color-primary;
48
60
  }
49
61
  }
62
+
50
63
  .n20-pagination-usersizes-1 {
51
64
  width: 52px;
52
65
  vertical-align: middle;
66
+
53
67
  &.is-without-controls {
54
68
  .el-input__inner {
55
69
  height: 26px;
@@ -59,6 +73,7 @@
59
73
  border-radius: 2px;
60
74
  }
61
75
  }
76
+
62
77
  &.is-active {
63
78
  .el-input__inner {
64
79
  border-color: $--border-color-base;
@@ -68,66 +83,81 @@
68
83
 
69
84
  .n20-pagination {
70
85
  display: inline-block;
71
- > * {
86
+
87
+ >* {
72
88
  vertical-align: middle;
73
89
  }
90
+
74
91
  .el-pagination {
75
92
  display: inline-block;
76
93
  padding-right: 0;
77
94
  }
95
+
78
96
  .btn-prev,
79
97
  .btn-next {
80
98
  padding-left: 6px;
81
99
  padding-right: 6px;
82
100
  border: 1px solid $--border-color-base;
83
101
  border-radius: $--border-radius-small;
102
+
84
103
  &:not([disabled]):hover {
85
104
  border-color: $--color-primary;
86
105
  }
87
106
  }
107
+
88
108
  .btn-next {
89
109
  margin-left: 4px;
90
110
  }
111
+
91
112
  .el-input__inner {
92
113
  height: 26px;
93
114
  line-height: 26px;
94
115
  }
116
+
95
117
  .el-pagination__sizes {
96
118
  margin-right: 6px;
119
+
97
120
  .el-input {
98
121
  width: 85px;
99
122
  margin-left: 0;
100
123
  margin-right: 0;
101
124
  }
125
+
102
126
  .el-input .el-input__inner {
103
127
  padding-right: 20px;
104
128
  }
129
+
105
130
  .el-select__caret {
106
131
  line-height: 25px;
107
132
  position: relative;
108
133
  top: -2px;
109
134
  }
110
135
  }
136
+
111
137
  .el-pagination__jump {
112
138
  margin-left: 0;
113
139
  }
114
140
  }
141
+
115
142
  .n20-pagination-total,
116
143
  .n20-pagination-no {
117
144
  min-width: initial !important;
118
145
  }
146
+
119
147
  .n20-pagination-total {
120
148
  margin-left: 4px;
121
149
  margin-right: 4px;
122
150
  font-weight: normal;
123
151
  }
152
+
124
153
  .n20-pagination-no {
125
154
  color: $--color-primary;
126
155
  }
156
+
127
157
  .el-pagination__sizes-popper {
128
158
  .el-select-dropdown__item {
129
159
  padding-left: 12px;
130
160
  padding-right: 12px;
131
161
  text-align: center;
132
162
  }
133
- }
163
+ }
@@ -1,10 +1,11 @@
1
1
  <template>
2
- <div class="flex-box" style="height: 100%">
2
+ <div :class="{ 'flex-box': position !== 'top' }" style="height: 100%">
3
3
  <AnchorSidebar
4
4
  v-if="position !== 'right'"
5
5
  :nav-list="navList"
6
6
  :activit="value"
7
7
  :style="{ width: navWidth }"
8
+ :class="{ 'top-css': position === 'top' }"
8
9
  @click="activitFn"
9
10
  />
10
11
  <div ref="anchor-content" :class="['flex-item', parentClass]" style="height: 100%; overflow: auto">
@@ -214,3 +215,24 @@ export default {
214
215
  }
215
216
  }
216
217
  </script>
218
+ <style>
219
+ .top-css {
220
+ width: auto !important;
221
+ display: flex;
222
+ margin-bottom: 4px;
223
+ }
224
+ .top-css .n20-anchor2-nav {
225
+ padding: 5px;
226
+ border-left: none;
227
+ }
228
+ .top-css .n20-anchor2-nav-activit {
229
+ color: var(--color-primary);
230
+ }
231
+ .top-css .n20-anchor2-nav-activit:after {
232
+ content: '';
233
+ height: 2px;
234
+ background-color: #007aff;
235
+ display: block;
236
+ margin-top: 4px;
237
+ }
238
+ </style>
@@ -9,7 +9,7 @@
9
9
  {{ data[0].name }}
10
10
  </div>
11
11
  </div>
12
- <el-tabs v-else :value="init" class="n20-secondary-tab m-b-s" :before-leave="beforeFn" @tab-click="clickFn">
12
+ <el-tabs v-else :value="init" :class="classes" :tabPosition="tabPosition" :before-leave="beforeFn" @tab-click="clickFn">
13
13
  <el-tab-pane
14
14
  v-for="item of data"
15
15
  :key="item.name"
@@ -44,6 +44,19 @@ export default {
44
44
  stop: {
45
45
  type: Boolean,
46
46
  default: false
47
+ },
48
+ tabPosition: {
49
+ type: String,
50
+ default: 'top'
51
+ }
52
+ },
53
+ computed: {
54
+ classes(){
55
+ return {
56
+ 'n20-secondary-tab': true,
57
+ 'm-b-s': this.tabPosition == 'top',
58
+ 'left-css': this.tabPosition == 'left'
59
+ }
47
60
  }
48
61
  },
49
62
  methods: {
@@ -93,4 +106,17 @@ export default {
93
106
  .tooltip.show {
94
107
  opacity: 1;
95
108
  }
109
+ .left-css .el-tabs__item.is-active:after{
110
+ width: 2px;
111
+ height: 20px!important;
112
+ margin-top: -22px!important;
113
+ margin-left: -10px;
114
+ }
115
+ .left-css .el-tabs__item.is-left {
116
+ text-align: left!important;
117
+ }
118
+ .left-css .el-tabs__header.is-left{
119
+ margin-right: 0!important;
120
+ margin-left: 10px!important;
121
+ }
96
122
  </style>