@tripup-company/element-ui-extended 0.0.71 → 0.0.74
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/element-ui-extended.common.js +111 -323
- package/dist/element-ui-extended.common.js.map +1 -1
- package/dist/element-ui-extended.css +1 -1
- package/dist/element-ui-extended.umd.js +111 -323
- package/dist/element-ui-extended.umd.js.map +1 -1
- package/dist/element-ui-extended.umd.min.js +2 -2
- package/dist/element-ui-extended.umd.min.js.map +1 -1
- package/dist/examples/models/contact-model.d.ts +0 -1
- package/dist/examples/models/contact-model.d.ts.map +1 -1
- package/dist/src/components/GenericFilters/filter-convertor.d.ts.map +1 -1
- package/dist/src/components/GenericFilters/filter-factory.d.ts +0 -2
- package/dist/src/components/GenericFilters/filter-factory.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/CompositeTable/index.vue +2 -4
- package/src/components/EditableField/index.vue +42 -121
- package/src/components/GenericFilters/FilterRow.vue +23 -60
- package/src/components/GenericFilters/index.vue +11 -19
- package/src/components/NewField/index.vue +16 -63
- package/src/components/PartColumn/EditColumn.vue +0 -4
- package/src/components/PartColumn/NewColumn.vue +0 -4
- package/src/repositories/base-repository.ts +5 -5
- package/src/styles/index.scss +215 -0
- package/dist/src/components/GenericFilters/filters/in-array-of-object.d.ts +0 -7
- package/dist/src/components/GenericFilters/filters/in-array-of-object.d.ts.map +0 -1
|
@@ -4,44 +4,16 @@
|
|
|
4
4
|
<slot class="editable-cell__text__slot">
|
|
5
5
|
<el-col :span="24">
|
|
6
6
|
<el-checkbox v-if="type === 'checkbox'" v-model="dataModel" />
|
|
7
|
-
<el-select
|
|
8
|
-
v-else-if="type === 'select'"
|
|
9
|
-
v-model="dataModel"
|
|
10
|
-
:filterable="filterable"
|
|
11
|
-
:loading="loading"
|
|
12
|
-
:remote="remote"
|
|
13
|
-
:remote-method="remoteMethodHandler"
|
|
14
|
-
:span="24"
|
|
15
|
-
clearable
|
|
16
|
-
placeholder="Select"
|
|
17
|
-
:multiple="selectMultiple"
|
|
18
|
-
:value-key="objectValueKey"
|
|
19
|
-
class="w-100"
|
|
20
|
-
>
|
|
7
|
+
<el-select v-else-if="type === 'select'" v-model="dataModel" :filterable="filterable" :loading="loading" :remote="remote" :remote-method="remoteMethodHandler" :span="24" clearable placeholder="Select" :multiple="selectMultiple" class="w-100">
|
|
21
8
|
<el-option
|
|
22
9
|
v-for="item in selectListLocal"
|
|
23
10
|
:key="item[selectKey]"
|
|
24
11
|
:label="item[selectLabel]"
|
|
25
|
-
:value="
|
|
12
|
+
:value="item[selectValue]"
|
|
26
13
|
/>
|
|
27
14
|
</el-select>
|
|
28
|
-
<el-date-picker
|
|
29
|
-
|
|
30
|
-
v-model="dataModel"
|
|
31
|
-
:format="format"
|
|
32
|
-
:value-format="valueFormat"
|
|
33
|
-
type="date"
|
|
34
|
-
placeholder="Pick a day"
|
|
35
|
-
class="w-100"
|
|
36
|
-
/>
|
|
37
|
-
<el-input-number
|
|
38
|
-
v-else-if="type === 'number'"
|
|
39
|
-
v-model="dataModel"
|
|
40
|
-
:controls="false"
|
|
41
|
-
:step="step"
|
|
42
|
-
:precision="precision"
|
|
43
|
-
class="w-100"
|
|
44
|
-
/>
|
|
15
|
+
<el-date-picker v-else-if="type === 'date-picker'" v-model="dataModel" format="dd.MM.yyyy" value-format="yyyy-MM-dd" type="date" placeholder="Pick a day" class="w-100" />
|
|
16
|
+
<el-input-number v-else-if="type === 'number'" v-model="dataModel" :controls="false" :step="step" :precision="precision" class="w-100" />
|
|
45
17
|
<el-input
|
|
46
18
|
v-else
|
|
47
19
|
v-model="dataModel"
|
|
@@ -59,11 +31,11 @@
|
|
|
59
31
|
import lodash from "lodash";
|
|
60
32
|
const _ = lodash;
|
|
61
33
|
export default {
|
|
62
|
-
name:
|
|
34
|
+
name: 'NewField',
|
|
63
35
|
props: {
|
|
64
36
|
field: {
|
|
65
37
|
type: [String, Boolean],
|
|
66
|
-
default:
|
|
38
|
+
default: '',
|
|
67
39
|
},
|
|
68
40
|
filterable: {
|
|
69
41
|
type: Boolean,
|
|
@@ -71,15 +43,15 @@ export default {
|
|
|
71
43
|
},
|
|
72
44
|
value: {
|
|
73
45
|
type: [String, Boolean, Date, Number, Array],
|
|
74
|
-
default:
|
|
46
|
+
default: '',
|
|
75
47
|
},
|
|
76
48
|
type: {
|
|
77
49
|
type: String,
|
|
78
|
-
default:
|
|
50
|
+
default: 'input',
|
|
79
51
|
},
|
|
80
52
|
placeholder: {
|
|
81
53
|
type: String,
|
|
82
|
-
default:
|
|
54
|
+
default: '',
|
|
83
55
|
},
|
|
84
56
|
selectList: {
|
|
85
57
|
type: Array,
|
|
@@ -91,25 +63,17 @@ export default {
|
|
|
91
63
|
type: Boolean,
|
|
92
64
|
default: false,
|
|
93
65
|
},
|
|
94
|
-
objectValueKey: {
|
|
95
|
-
type: String,
|
|
96
|
-
default: "value",
|
|
97
|
-
},
|
|
98
|
-
selectJson: {
|
|
99
|
-
type: Boolean,
|
|
100
|
-
default: false,
|
|
101
|
-
},
|
|
102
66
|
selectKey: {
|
|
103
67
|
type: String,
|
|
104
|
-
default:
|
|
68
|
+
default: '',
|
|
105
69
|
},
|
|
106
70
|
selectLabel: {
|
|
107
71
|
type: String,
|
|
108
|
-
default:
|
|
72
|
+
default: '',
|
|
109
73
|
},
|
|
110
74
|
selectValue: {
|
|
111
75
|
type: String,
|
|
112
|
-
default:
|
|
76
|
+
default: '',
|
|
113
77
|
},
|
|
114
78
|
precision: {
|
|
115
79
|
type: Number,
|
|
@@ -123,14 +87,6 @@ export default {
|
|
|
123
87
|
type: Object,
|
|
124
88
|
default: null,
|
|
125
89
|
},
|
|
126
|
-
format: {
|
|
127
|
-
type: String,
|
|
128
|
-
default: "dd.MM.yyyy",
|
|
129
|
-
},
|
|
130
|
-
valueFormat: {
|
|
131
|
-
type: String,
|
|
132
|
-
default: "yyyy-MM-dd",
|
|
133
|
-
},
|
|
134
90
|
},
|
|
135
91
|
data() {
|
|
136
92
|
return {
|
|
@@ -155,10 +111,10 @@ export default {
|
|
|
155
111
|
},
|
|
156
112
|
},
|
|
157
113
|
watch: {
|
|
158
|
-
dataModel: function
|
|
159
|
-
this.$emit(
|
|
114
|
+
dataModel: function() {
|
|
115
|
+
this.$emit('editable:save', { 'field': this.field, 'value': this.dataModel });
|
|
160
116
|
},
|
|
161
|
-
value: function
|
|
117
|
+
value: function() {
|
|
162
118
|
this.dataModel = _.cloneDeep(this.value);
|
|
163
119
|
},
|
|
164
120
|
},
|
|
@@ -168,10 +124,7 @@ export default {
|
|
|
168
124
|
methods: {
|
|
169
125
|
async remoteCall(query) {
|
|
170
126
|
this.loading = true;
|
|
171
|
-
const response = await this.remoteMethod.all({
|
|
172
|
-
search: this.selectLabel + ":" + query,
|
|
173
|
-
searchFields: this.selectLabel + ":like",
|
|
174
|
-
});
|
|
127
|
+
const response = await this.remoteMethod.all({ search: this.selectLabel + ':' +query, searchFields: this.selectLabel + ':like' });
|
|
175
128
|
this.selectListLocal = response.data;
|
|
176
129
|
this.loading = false;
|
|
177
130
|
},
|
|
@@ -17,8 +17,6 @@
|
|
|
17
17
|
:type="field.selectList ? 'select' : (field.type? field.type :'input')"
|
|
18
18
|
:select-list="field.selectList ? field.selectList : []"
|
|
19
19
|
:select-multiple="field.selectMultiple"
|
|
20
|
-
:select-json="field.selectJson ? field.selectJson : false"
|
|
21
|
-
:object-value-key="field.objectValueKey ? field.objectValueKey : 'value'"
|
|
22
20
|
:select-key="field.selectList ? (field.selectKey ? field.selectKey : 'value' ) : ''"
|
|
23
21
|
:select-label="field.selectList ? (field.selectLabel ? field.selectLabel : 'name' ) : ''"
|
|
24
22
|
:select-value="field.selectList ? (field.selectValue ? field.selectValue : 'value' ) : ''"
|
|
@@ -26,8 +24,6 @@
|
|
|
26
24
|
:precision="field.precision ? field.precision : 0"
|
|
27
25
|
:remote-method="field.remoteMethod ? field.remoteMethod : null"
|
|
28
26
|
:filterable="field.filterable ? field.filterable : null"
|
|
29
|
-
:format="field.format ? field.format : 'dd.MM.yyyy'"
|
|
30
|
-
:value-format="field.valueFormat ? field.valueFormat : 'yyyy-MM-dd'"
|
|
31
27
|
@editable:save="updateValue"
|
|
32
28
|
/>
|
|
33
29
|
</el-form-item>
|
|
@@ -16,8 +16,6 @@
|
|
|
16
16
|
:type="field.selectList ? 'select' : (field.type? field.type :'input')"
|
|
17
17
|
:select-list="field.selectList ? field.selectList : []"
|
|
18
18
|
:select-multiple="field.selectMultiple"
|
|
19
|
-
:select-json="field.selectJson ? field.selectJson : false"
|
|
20
|
-
:object-value-key="field.objectValueKey ? field.objectValueKey : 'value'"
|
|
21
19
|
:select-key="field.selectList ? (field.selectKey ? field.selectKey : 'value' ) : ''"
|
|
22
20
|
:select-label="field.selectList ? (field.selectLabel ? field.selectLabel : 'name' ) : ''"
|
|
23
21
|
:select-value="field.selectList ? (field.selectValue ? field.selectValue : 'value' ) : ''"
|
|
@@ -25,8 +23,6 @@
|
|
|
25
23
|
:precision="field.precision ? field.precision : 0"
|
|
26
24
|
:remote-method="field.remoteMethod ? field.remoteMethod : null"
|
|
27
25
|
:filterable="field.filterable ? field.filterable : null"
|
|
28
|
-
:format="field.format ? field.format : 'dd.MM.yyyy'"
|
|
29
|
-
:value-format="field.valueFormat ? field.valueFormat : 'yyyy-MM-dd'"
|
|
30
26
|
@editable:save="updateValue"
|
|
31
27
|
/>
|
|
32
28
|
</el-form-item>
|
|
@@ -28,7 +28,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
|
|
|
28
28
|
|
|
29
29
|
create(item: T): Promise<T> {
|
|
30
30
|
return new Promise<T>((resolve, reject) => {
|
|
31
|
-
this.request
|
|
31
|
+
this.request.$request({
|
|
32
32
|
url: this.baseUrl,
|
|
33
33
|
method: 'post',
|
|
34
34
|
data: item,
|
|
@@ -42,7 +42,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
|
|
|
42
42
|
|
|
43
43
|
update(id: string, item: T, include = "--"): Promise<T> {
|
|
44
44
|
return new Promise<T>((resolve, reject) => {
|
|
45
|
-
this.request
|
|
45
|
+
this.request.$request({
|
|
46
46
|
url: this.baseUrl + "/" + id + "?include=" + include,
|
|
47
47
|
method: "patch",
|
|
48
48
|
data: item,
|
|
@@ -58,7 +58,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
|
|
|
58
58
|
|
|
59
59
|
delete(id: string): Promise<boolean> {
|
|
60
60
|
return new Promise<boolean>((resolve, reject) => {
|
|
61
|
-
this.request
|
|
61
|
+
this.request.$request({
|
|
62
62
|
url: this.baseUrl + "/" + id,
|
|
63
63
|
method: "delete",
|
|
64
64
|
})
|
|
@@ -73,7 +73,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
|
|
|
73
73
|
|
|
74
74
|
findOne(id: string, include = "--"): Promise<T> {
|
|
75
75
|
return new Promise<T>((resolve, reject) => {
|
|
76
|
-
this.request
|
|
76
|
+
this.request.$request({
|
|
77
77
|
url: this.baseUrl + "/" + id + "?include=" + include,
|
|
78
78
|
method: "get",
|
|
79
79
|
})
|
|
@@ -88,7 +88,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
|
|
|
88
88
|
|
|
89
89
|
all(query: string, include = "--", filter = ""): Promise<Collection<T>> {
|
|
90
90
|
return new Promise<Collection<T>>((resolve, reject) => {
|
|
91
|
-
this.request
|
|
91
|
+
this.request.$request({
|
|
92
92
|
url: this.baseUrl + "?include=" + include + (filter === "" ? '' : ('&selectFilter=' + filter)),
|
|
93
93
|
method: "get",
|
|
94
94
|
params: query,
|
package/src/styles/index.scss
CHANGED
|
@@ -1,3 +1,218 @@
|
|
|
1
1
|
@import "variables";
|
|
2
2
|
@import 'spacing';
|
|
3
3
|
@import 'editable-field-component';
|
|
4
|
+
|
|
5
|
+
body {
|
|
6
|
+
height: 100%;
|
|
7
|
+
-moz-osx-font-smoothing: grayscale;
|
|
8
|
+
-webkit-font-smoothing: antialiased;
|
|
9
|
+
text-rendering: optimizeLegibility;
|
|
10
|
+
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
label {
|
|
14
|
+
font-weight: 700;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
html {
|
|
18
|
+
height: 100%;
|
|
19
|
+
box-sizing: border-box;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
#app {
|
|
23
|
+
height: 100%;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
*,
|
|
27
|
+
*:before,
|
|
28
|
+
*:after {
|
|
29
|
+
box-sizing: inherit;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.no-padding {
|
|
33
|
+
padding: 0px !important;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.padding-content {
|
|
37
|
+
padding: 4px 0;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
a:focus,
|
|
41
|
+
a:active {
|
|
42
|
+
outline: none;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
a,
|
|
46
|
+
a:focus,
|
|
47
|
+
a:hover {
|
|
48
|
+
cursor: pointer;
|
|
49
|
+
color: inherit;
|
|
50
|
+
text-decoration: none;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
div:focus {
|
|
54
|
+
outline: none;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.fr {
|
|
58
|
+
float: right;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.fl {
|
|
62
|
+
float: left;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.pr-5 {
|
|
66
|
+
padding-right: 5px;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.pl-5 {
|
|
70
|
+
padding-left: 5px;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.block {
|
|
74
|
+
display: block;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.pointer {
|
|
78
|
+
cursor: pointer;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.inlineBlock {
|
|
82
|
+
display: block;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.clearfix {
|
|
86
|
+
&:after {
|
|
87
|
+
visibility: hidden;
|
|
88
|
+
display: block;
|
|
89
|
+
font-size: 0;
|
|
90
|
+
content: " ";
|
|
91
|
+
clear: both;
|
|
92
|
+
height: 0;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
code {
|
|
97
|
+
background: #eef1f6;
|
|
98
|
+
padding: 15px 16px;
|
|
99
|
+
margin-bottom: 20px;
|
|
100
|
+
display: block;
|
|
101
|
+
line-height: 36px;
|
|
102
|
+
font-size: 15px;
|
|
103
|
+
font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
|
|
104
|
+
|
|
105
|
+
a {
|
|
106
|
+
color: #337ab7;
|
|
107
|
+
cursor: pointer;
|
|
108
|
+
|
|
109
|
+
&:hover {
|
|
110
|
+
color: rgb(32, 160, 255);
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
.warn-content {
|
|
116
|
+
background: rgba(66, 185, 131, .1);
|
|
117
|
+
border-radius: 2px;
|
|
118
|
+
padding: 1rem;
|
|
119
|
+
line-height: 1.6rem;
|
|
120
|
+
word-spacing: .05rem;
|
|
121
|
+
|
|
122
|
+
a {
|
|
123
|
+
color: #42b983;
|
|
124
|
+
font-weight: 600;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
@media (min-width: $sm){
|
|
128
|
+
.app-container {
|
|
129
|
+
padding: 20px;
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
.components-container {
|
|
134
|
+
margin: 30px 50px;
|
|
135
|
+
position: relative;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.pagination-container {
|
|
139
|
+
margin-top: 30px;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
.text-center {
|
|
143
|
+
text-align: center
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.sub-navbar {
|
|
147
|
+
height: 50px;
|
|
148
|
+
line-height: 50px;
|
|
149
|
+
position: relative;
|
|
150
|
+
width: 100%;
|
|
151
|
+
text-align: right;
|
|
152
|
+
padding-right: 20px;
|
|
153
|
+
transition: 600ms ease position;
|
|
154
|
+
background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
|
|
155
|
+
|
|
156
|
+
.subtitle {
|
|
157
|
+
font-size: 20px;
|
|
158
|
+
color: #fff;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
&.draft {
|
|
162
|
+
background: #d0d0d0;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
&.deleted {
|
|
166
|
+
background: #d0d0d0;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
.link-type,
|
|
171
|
+
.link-type:focus {
|
|
172
|
+
color: #337ab7;
|
|
173
|
+
cursor: pointer;
|
|
174
|
+
|
|
175
|
+
&:hover {
|
|
176
|
+
color: rgb(32, 160, 255);
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.filter-container {
|
|
181
|
+
padding-bottom: 10px;
|
|
182
|
+
|
|
183
|
+
.filter-item {
|
|
184
|
+
display: inline-block;
|
|
185
|
+
vertical-align: middle;
|
|
186
|
+
margin-bottom: 10px;
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
//refine vue-multiselect plugin
|
|
191
|
+
.multiselect {
|
|
192
|
+
line-height: 16px;
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
.multiselect--active {
|
|
196
|
+
z-index: 1000 !important;
|
|
197
|
+
}
|
|
198
|
+
.el-date-transparent {
|
|
199
|
+
margin-left: -15px;
|
|
200
|
+
input {
|
|
201
|
+
border: none !important;
|
|
202
|
+
background: transparent !important;
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
#app .hideSidebar .nav-icon {
|
|
207
|
+
margin-left: 20px;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
.form-item-min-margin {
|
|
211
|
+
/*.el-form-item {
|
|
212
|
+
margin-bottom: 0px;
|
|
213
|
+
}*/
|
|
214
|
+
.el-textarea__inner {
|
|
215
|
+
line-height: 36px;
|
|
216
|
+
margin-bottom: 10px;
|
|
217
|
+
}
|
|
218
|
+
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { BaseFilter } from "./base-filter";
|
|
2
|
-
import { FilterResponse } from "./interfaces/filter-response";
|
|
3
|
-
export declare class InArrayOfObject extends BaseFilter {
|
|
4
|
-
protected operator: string;
|
|
5
|
-
applyFilter(): FilterResponse;
|
|
6
|
-
}
|
|
7
|
-
//# sourceMappingURL=in-array-of-object.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"in-array-of-object.d.ts","sourceRoot":"","sources":["../../../../../src/components/GenericFilters/filters/in-array-of-object.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,eAAe,CAAC;AACzC,OAAO,EAAC,cAAc,EAAC,MAAM,8BAA8B,CAAC;AAE5D,qBAAa,eAAgB,SAAQ,UAAU;IAC7C,SAAS,CAAC,QAAQ,SAAwB;IACnC,WAAW,IAAI,cAAc;CAMrC"}
|