@nixweb/nixloc-ui 0.0.132 → 0.0.133
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 +2 -1
- package/src/component/forms/InputAddressGoogle.vue +175 -0
- package/src/component/shared/TableDraggable.vue +2 -1
- package/src/component/template/ListViewWithDataHandler.vue +14 -8
- package/src/component/template/ViewTemplateDocumentView.vue +11 -1
- package/src/store/modules/generic.js +11 -9
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nixweb/nixloc-ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.133",
|
|
4
4
|
"description": "Componentes UI",
|
|
5
5
|
"author": "Fábio Ávila <fabio@nixweb.com.br>",
|
|
6
6
|
"private": false,
|
|
@@ -29,6 +29,7 @@
|
|
|
29
29
|
"vue": "^2.6.11",
|
|
30
30
|
"vue-color": "^2.7.0",
|
|
31
31
|
"vue-currency-filter": "^3.3.0",
|
|
32
|
+
"vue2-google-maps": "^0.10.7",
|
|
32
33
|
"vue-html2pdf": "^1.8.0",
|
|
33
34
|
"vue-image-crop-upload": "^3.0.3",
|
|
34
35
|
"vue-js-toggle-button": "^1.3.0",
|
|
@@ -0,0 +1,175 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="form-group">
|
|
3
|
+
<label>
|
|
4
|
+
<i class="title class-icon-title" :class="classIconTitle"></i>
|
|
5
|
+
<i class="fa-sharp fa-solid fa-location-dot icon-location"></i>
|
|
6
|
+
<span class="title" :style="'color: ' + titleColor"> {{ title }} </span>
|
|
7
|
+
<span class="required" v-if="required">*</span>
|
|
8
|
+
<Tip :field="field" :formName="formName" />
|
|
9
|
+
</label>
|
|
10
|
+
<div class="inner-addon right-addon">
|
|
11
|
+
<div
|
|
12
|
+
class="required glyphicon"
|
|
13
|
+
v-if="notifications.length > 0 && formDirty"
|
|
14
|
+
>
|
|
15
|
+
<i class="fas fa-exclamation-triangle"></i>
|
|
16
|
+
</div>
|
|
17
|
+
<slot v-else></slot>
|
|
18
|
+
<gmap-autocomplete
|
|
19
|
+
@place_changed="setPlace"
|
|
20
|
+
class="form-control"
|
|
21
|
+
v-bind:value="value"
|
|
22
|
+
>
|
|
23
|
+
</gmap-autocomplete>
|
|
24
|
+
</div>
|
|
25
|
+
<div v-if="formDirty">
|
|
26
|
+
<div v-for="message in notifications" :key="message">
|
|
27
|
+
<span class="invalid">{{ message }}</span>
|
|
28
|
+
</div>
|
|
29
|
+
</div>
|
|
30
|
+
</div>
|
|
31
|
+
</template>
|
|
32
|
+
|
|
33
|
+
<script>
|
|
34
|
+
import Tip from "../shared/Tip.vue";
|
|
35
|
+
import { mapState, mapMutations } from "vuex";
|
|
36
|
+
|
|
37
|
+
export default {
|
|
38
|
+
components: { Tip },
|
|
39
|
+
name: "InputText",
|
|
40
|
+
props: [
|
|
41
|
+
"title",
|
|
42
|
+
"classIconTitle",
|
|
43
|
+
"field",
|
|
44
|
+
"placeholder",
|
|
45
|
+
"disabled",
|
|
46
|
+
"titleColor",
|
|
47
|
+
"mask",
|
|
48
|
+
"_style",
|
|
49
|
+
"formName",
|
|
50
|
+
"required",
|
|
51
|
+
"maxLength",
|
|
52
|
+
"value",
|
|
53
|
+
"enter",
|
|
54
|
+
"cleaned",
|
|
55
|
+
"exited",
|
|
56
|
+
"markFormDirty",
|
|
57
|
+
],
|
|
58
|
+
data() {
|
|
59
|
+
return {
|
|
60
|
+
notifications: [],
|
|
61
|
+
formDirty: false,
|
|
62
|
+
withoutMask: {
|
|
63
|
+
mask: "*".repeat(255),
|
|
64
|
+
tokens: {
|
|
65
|
+
"*": { pattern: /./ },
|
|
66
|
+
},
|
|
67
|
+
},
|
|
68
|
+
};
|
|
69
|
+
},
|
|
70
|
+
created() {
|
|
71
|
+
this.validate();
|
|
72
|
+
},
|
|
73
|
+
methods: {
|
|
74
|
+
...mapMutations("validation", [
|
|
75
|
+
"addValidation",
|
|
76
|
+
"removeValidation",
|
|
77
|
+
"updateFormDirty",
|
|
78
|
+
]),
|
|
79
|
+
validate() {
|
|
80
|
+
this.notifications = [];
|
|
81
|
+
|
|
82
|
+
if (this.required && this.value.length == 0) {
|
|
83
|
+
var message = `${this.title} não pode ser vazio!`;
|
|
84
|
+
this.notifications.push(message);
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
if (this.maxLength > 0) {
|
|
88
|
+
if (this.value.length > this.maxLength) {
|
|
89
|
+
var message = `Máximo de ${this.maxLength} caracteres!`;
|
|
90
|
+
this.notifications.push(message);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
pressedEnter() {
|
|
95
|
+
if (this.enter) this.enter();
|
|
96
|
+
},
|
|
97
|
+
outField() {
|
|
98
|
+
if (this.exited) this.exited();
|
|
99
|
+
},
|
|
100
|
+
cleanedField() {
|
|
101
|
+
if (this.value.length == 0) {
|
|
102
|
+
if (this.cleaned) this.cleaned();
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
setPlace(place) {
|
|
106
|
+
this.currentPlace = place;
|
|
107
|
+
this.$emit("input", this.currentPlace.formatted_address);
|
|
108
|
+
},
|
|
109
|
+
},
|
|
110
|
+
computed: {
|
|
111
|
+
...mapState("validation", ["resetForm", "validations"]),
|
|
112
|
+
},
|
|
113
|
+
watch: {
|
|
114
|
+
value() {
|
|
115
|
+
this.validate();
|
|
116
|
+
this.formDirty = true;
|
|
117
|
+
// inverti a validação devido não colocar o default como true no props
|
|
118
|
+
var _value = this.markFormDirty == undefined ? true : this.markFormDirty;
|
|
119
|
+
if (_value) this.updateFormDirty(true);
|
|
120
|
+
},
|
|
121
|
+
notifications() {
|
|
122
|
+
let self = this;
|
|
123
|
+
this.notifications.forEach(function (notification) {
|
|
124
|
+
let obj = {
|
|
125
|
+
key: self.field + "&" + self.formName,
|
|
126
|
+
formName: self.formName,
|
|
127
|
+
notification: notification,
|
|
128
|
+
};
|
|
129
|
+
self.addValidation(obj);
|
|
130
|
+
});
|
|
131
|
+
|
|
132
|
+
if (this.notifications.length == 0) {
|
|
133
|
+
let obj = {
|
|
134
|
+
key: self.field + "&" + self.formName,
|
|
135
|
+
formName: self.formName,
|
|
136
|
+
};
|
|
137
|
+
self.removeValidation(obj);
|
|
138
|
+
}
|
|
139
|
+
},
|
|
140
|
+
resetForm: {
|
|
141
|
+
handler(form) {
|
|
142
|
+
if (form.name == this.formName) this.formDirty = false;
|
|
143
|
+
},
|
|
144
|
+
deep: true,
|
|
145
|
+
},
|
|
146
|
+
},
|
|
147
|
+
};
|
|
148
|
+
</script>
|
|
149
|
+
|
|
150
|
+
<style scoped>
|
|
151
|
+
.title {
|
|
152
|
+
font-size: 14px !important;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
.icon-location {
|
|
156
|
+
color: #0251a0;
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
.class-icon-title {
|
|
160
|
+
margin-right: 5px;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
.success {
|
|
164
|
+
color: #94aa2a;
|
|
165
|
+
font-size: 14px;
|
|
166
|
+
}
|
|
167
|
+
.invalid {
|
|
168
|
+
color: #f0134d;
|
|
169
|
+
font-size: 14px;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
.margin-button {
|
|
173
|
+
margin-top: -3px;
|
|
174
|
+
}
|
|
175
|
+
</style>
|
|
@@ -16,7 +16,8 @@
|
|
|
16
16
|
:clicked="checkMove"
|
|
17
17
|
/>
|
|
18
18
|
</div>
|
|
19
|
-
<i class="fa-regular fa-maximize icon-order"></i> Clique e arraste para
|
|
19
|
+
<i class="fa-regular fa-maximize icon-order"></i> Clique e arraste para
|
|
20
|
+
ordenar
|
|
20
21
|
<table class="table table-responsive-xs">
|
|
21
22
|
<thead>
|
|
22
23
|
<tr>
|
|
@@ -147,7 +147,11 @@ export default {
|
|
|
147
147
|
"updateSearch",
|
|
148
148
|
]),
|
|
149
149
|
getAll() {
|
|
150
|
-
let obj = {
|
|
150
|
+
let obj = {
|
|
151
|
+
...this.baseParams,
|
|
152
|
+
...this.dynamicFilter,
|
|
153
|
+
...this.propsParam,
|
|
154
|
+
};
|
|
151
155
|
let params = { url: this.templateList.urlGetApi, obj: obj };
|
|
152
156
|
this.getApi(params).then((response) => {
|
|
153
157
|
this.content = response.content;
|
|
@@ -158,15 +162,17 @@ export default {
|
|
|
158
162
|
});
|
|
159
163
|
},
|
|
160
164
|
orderAll(data) {
|
|
161
|
-
|
|
165
|
+
if (this.templateList.urlOrderAllApi) {
|
|
166
|
+
let obj = { listIds: data.listIds };
|
|
162
167
|
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
+
let params = {
|
|
169
|
+
url: this.templateList.urlOrderAllApi,
|
|
170
|
+
obj: obj,
|
|
171
|
+
notNotifyToast: true,
|
|
172
|
+
};
|
|
168
173
|
|
|
169
|
-
|
|
174
|
+
this.orderAllApi(params).then((response) => {});
|
|
175
|
+
}
|
|
170
176
|
},
|
|
171
177
|
removeSelected() {
|
|
172
178
|
let params = {
|
|
@@ -119,7 +119,8 @@
|
|
|
119
119
|
</div>
|
|
120
120
|
</Modal>
|
|
121
121
|
<div class="div-editor">
|
|
122
|
-
<
|
|
122
|
+
<Loading type="line" v-if="!showDocumentEditor" />
|
|
123
|
+
<DocumentEditor v-if="showDocumentEditor" />
|
|
123
124
|
</div>
|
|
124
125
|
</div>
|
|
125
126
|
</div>
|
|
@@ -137,6 +138,7 @@ import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
|
|
|
137
138
|
import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
|
|
138
139
|
import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
|
|
139
140
|
import ScrollBar from "@nixweb/nixloc-ui/src/component/layout/ScrollBar.vue";
|
|
141
|
+
import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
|
|
140
142
|
|
|
141
143
|
import print from "vue-print-nb";
|
|
142
144
|
|
|
@@ -154,6 +156,7 @@ export default {
|
|
|
154
156
|
CodeEditor,
|
|
155
157
|
ParameterLegend,
|
|
156
158
|
Molded,
|
|
159
|
+
Loading,
|
|
157
160
|
Button,
|
|
158
161
|
Modal,
|
|
159
162
|
ScrollBar,
|
|
@@ -167,8 +170,15 @@ export default {
|
|
|
167
170
|
return {
|
|
168
171
|
id: this.$route.params.id,
|
|
169
172
|
isDisabled: true,
|
|
173
|
+
showDocumentEditor: false,
|
|
170
174
|
};
|
|
171
175
|
},
|
|
176
|
+
created() {
|
|
177
|
+
let self = this;
|
|
178
|
+
setTimeout(function () {
|
|
179
|
+
self.showDocumentEditor = true;
|
|
180
|
+
}, 1500);
|
|
181
|
+
},
|
|
172
182
|
computed: {
|
|
173
183
|
...mapState("generic", ["modal", "documentHtml"]),
|
|
174
184
|
...mapGetters("generic", ["showModal", "event", "documentPreview"]),
|
|
@@ -99,14 +99,13 @@ export default {
|
|
|
99
99
|
|
|
100
100
|
if (th) {
|
|
101
101
|
|
|
102
|
-
let isPayment = th.innerText.includes("
|
|
103
|
-
|
|
104
|
-
|
|
102
|
+
let isPayment = th.innerText.includes("t.pagamentoLocacao");
|
|
105
103
|
let isPeriod = th.innerText.includes("t.periodoLocacao");
|
|
106
104
|
let isProduct = th.innerText.includes("t.produtoLocacao");
|
|
107
105
|
let isGrouped = th.innerText.includes("t.produtoAgrupado");
|
|
108
106
|
let isMoviment = th.innerText.includes("t.produtoMovimentacao");
|
|
109
|
-
let
|
|
107
|
+
let isCustumerAddress = th.innerText.includes("t.enderecoCliente");
|
|
108
|
+
let isAddressRent = th.innerText.includes("t.enderecoLocacao");
|
|
110
109
|
|
|
111
110
|
|
|
112
111
|
if (isProduct) {
|
|
@@ -116,7 +115,7 @@ export default {
|
|
|
116
115
|
obj.vForSimple = "v-for='periodo in d.periodoLocacao'";
|
|
117
116
|
config.push(obj);
|
|
118
117
|
} else if (isPayment) {
|
|
119
|
-
obj.vForSimple = "v-for='
|
|
118
|
+
obj.vForSimple = "v-for='pagamento in d.pagamentoLocacao'";
|
|
120
119
|
config.push(obj);
|
|
121
120
|
} else if (isGrouped) {
|
|
122
121
|
obj.vForGrouped = "v-for='(itensLocacao, grupo) in produtoAgrupado'";
|
|
@@ -141,9 +140,12 @@ export default {
|
|
|
141
140
|
} else if (isMoviment) {
|
|
142
141
|
obj.vForSimple = "v-for='produto in d.itensMovimentacao'";
|
|
143
142
|
config.push(obj);
|
|
144
|
-
} else if (
|
|
143
|
+
} else if (isCustumerAddress) {
|
|
145
144
|
obj.vForSimple = "v-for='endereco in d.locacao.cliente.endereco'";
|
|
146
145
|
config.push(obj);
|
|
146
|
+
} else if (isAddressRent) {
|
|
147
|
+
obj.vForSimple = "v-for='endereco in d.enderecoLocacao'";
|
|
148
|
+
config.push(obj);
|
|
147
149
|
} else {
|
|
148
150
|
config.push(obj);
|
|
149
151
|
}
|
|
@@ -158,17 +160,17 @@ export default {
|
|
|
158
160
|
replace += `.replace("<tbody>${x.nameGroup}<tr>", "<tbody ${x.vForGrouped}>${x.nameGroupReplace}<tr ${x.vForSimple}>")`;
|
|
159
161
|
});
|
|
160
162
|
|
|
161
|
-
|
|
162
|
-
|
|
163
163
|
var retParse = ret.replaceAll("\"", "'");
|
|
164
164
|
retParse = eval(`retParse${replace}`);
|
|
165
|
-
|
|
165
|
+
|
|
166
166
|
var classImportant = retParse
|
|
167
|
+
.replaceAll("t.pagamentoLocacao", "")
|
|
167
168
|
.replaceAll("t.periodoLocacao", "")
|
|
168
169
|
.replaceAll("t.produtoLocacao", "")
|
|
169
170
|
.replaceAll("t.produtoAgrupado", "")
|
|
170
171
|
.replaceAll("t.produtoMovimentacao", "")
|
|
171
172
|
.replaceAll("t.enderecoCliente", "")
|
|
173
|
+
.replaceAll("t.enderecoLocacao", "")
|
|
172
174
|
.replaceAll("<p> !important;</p>", "<p> </p>");
|
|
173
175
|
}
|
|
174
176
|
|