@nixweb/nixloc-ui 0.0.145 → 0.0.146
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
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<div class="wrapper">
|
|
4
|
+
<span class="num" @click="showEdit = true" v-if="!showEdit">
|
|
5
|
+
<span v-if="text">{{ text }}</span>
|
|
6
|
+
<span class="placeholder" :style="'color:' + placeholderColor" v-else>
|
|
7
|
+
{{ placeholder }}
|
|
8
|
+
</span>
|
|
9
|
+
</span>
|
|
10
|
+
<input
|
|
11
|
+
class="input"
|
|
12
|
+
type="text"
|
|
13
|
+
@keyup.enter.prevent="execute()"
|
|
14
|
+
v-model="text"
|
|
15
|
+
v-if="showEdit"
|
|
16
|
+
/>
|
|
17
|
+
<span @click="execute()" v-if="showEdit && loading == false">
|
|
18
|
+
<i class="fa-solid fa-check"></i>
|
|
19
|
+
</span>
|
|
20
|
+
<div class="div-loading">
|
|
21
|
+
<vue-loading
|
|
22
|
+
v-if="loading"
|
|
23
|
+
type="bubbles"
|
|
24
|
+
color="#D98621"
|
|
25
|
+
:size="{ width: '30px', height: '30px' }"
|
|
26
|
+
>
|
|
27
|
+
</vue-loading>
|
|
28
|
+
</div>
|
|
29
|
+
</div>
|
|
30
|
+
<div v-if="error" class="danger msg-error">
|
|
31
|
+
{{ messageError }}
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
34
|
+
</template>
|
|
35
|
+
|
|
36
|
+
<script>
|
|
37
|
+
import { mapMutations, mapActions } from "vuex";
|
|
38
|
+
|
|
39
|
+
export default {
|
|
40
|
+
name: "InputCallToAction",
|
|
41
|
+
props: [
|
|
42
|
+
"_key",
|
|
43
|
+
"placeholder",
|
|
44
|
+
"placeholderColor",
|
|
45
|
+
"messageError",
|
|
46
|
+
"urlCallToAction",
|
|
47
|
+
"params",
|
|
48
|
+
"value",
|
|
49
|
+
],
|
|
50
|
+
data() {
|
|
51
|
+
return {
|
|
52
|
+
text: "",
|
|
53
|
+
error: false,
|
|
54
|
+
_keySelected: "",
|
|
55
|
+
showEdit: false,
|
|
56
|
+
loading: false,
|
|
57
|
+
};
|
|
58
|
+
},
|
|
59
|
+
mounted() {
|
|
60
|
+
this.text = this.value;
|
|
61
|
+
},
|
|
62
|
+
methods: {
|
|
63
|
+
...mapActions("generic", ["postApi"]),
|
|
64
|
+
execute() {
|
|
65
|
+
let paramsWithValue = { ...this.params, ...{ value: this.text } };
|
|
66
|
+
let params = { url: this.urlCallToAction, obj: paramsWithValue };
|
|
67
|
+
this.loading = true;
|
|
68
|
+
console.log(params);
|
|
69
|
+
this.postApi(params).then((response) => {
|
|
70
|
+
if (response.success) {
|
|
71
|
+
if (!response.content) {
|
|
72
|
+
this.error = true;
|
|
73
|
+
this.text = "";
|
|
74
|
+
this.$emit("input", "");
|
|
75
|
+
} else {
|
|
76
|
+
this.error = false;
|
|
77
|
+
this.$emit("input", this.text);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
this.showEdit = false;
|
|
81
|
+
this.loading = false;
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
},
|
|
85
|
+
},
|
|
86
|
+
};
|
|
87
|
+
</script>
|
|
88
|
+
|
|
89
|
+
<style scoped>
|
|
90
|
+
.input {
|
|
91
|
+
width: 80%;
|
|
92
|
+
border: none;
|
|
93
|
+
text-align: center;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.placeholder {
|
|
97
|
+
font-size: 13px !important;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.div-loading {
|
|
101
|
+
margin-bottom: 4px;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.msg-error {
|
|
105
|
+
font-size: 13px;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.wrapper {
|
|
109
|
+
height: 37px;
|
|
110
|
+
display: flex;
|
|
111
|
+
align-items: center;
|
|
112
|
+
justify-content: center;
|
|
113
|
+
background: #fff;
|
|
114
|
+
border-radius: 8px;
|
|
115
|
+
border: 1px solid #eaedf3;
|
|
116
|
+
box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 3%);
|
|
117
|
+
}
|
|
118
|
+
.wrapper span {
|
|
119
|
+
text-align: center;
|
|
120
|
+
font-size: 15px;
|
|
121
|
+
cursor: pointer;
|
|
122
|
+
user-select: none;
|
|
123
|
+
}
|
|
124
|
+
.wrapper span.num {
|
|
125
|
+
font-size: 17px;
|
|
126
|
+
cursor: pointer;
|
|
127
|
+
color: #3f529b;
|
|
128
|
+
font-size: 13px;
|
|
129
|
+
cursor: pointer;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.wrapper span.num:hover {
|
|
133
|
+
text-decoration: underline;
|
|
134
|
+
transition: 0.1s;
|
|
135
|
+
}
|
|
136
|
+
</style>
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div>
|
|
3
|
-
<div
|
|
3
|
+
<div
|
|
4
|
+
:class="{ 'div-message': !modal.open }"
|
|
5
|
+
v-if="storageNotification.length > 0"
|
|
6
|
+
>
|
|
4
7
|
<div v-for="notification in storageNotification">
|
|
5
8
|
<Alert type="danger">
|
|
6
9
|
{{ notification.message }}
|
|
@@ -12,19 +12,19 @@
|
|
|
12
12
|
<Molded>
|
|
13
13
|
<div v-show="!fileName">
|
|
14
14
|
<slot></slot>
|
|
15
|
-
<
|
|
16
|
-
<
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
</
|
|
15
|
+
<Alert type="info">
|
|
16
|
+
<span>
|
|
17
|
+
Selecione o arquivo no formato <b> .xlsx </b> baseado na
|
|
18
|
+
planilha modelo e aguarde até carregar os dados para
|
|
19
|
+
conferência. </span
|
|
20
|
+
><br />
|
|
21
|
+
<span>
|
|
22
|
+
Até <b> 1000 </b> itens por planilha ou <b> 1MB </b> no arquivo.
|
|
23
|
+
</span>
|
|
24
|
+
</Alert>
|
|
25
25
|
<div class="div-file">
|
|
26
26
|
<FileUpload
|
|
27
|
-
title="
|
|
27
|
+
title="Carregar arquivo .xlsx"
|
|
28
28
|
classIcon="fa-solid fa-file-excel"
|
|
29
29
|
:container="container"
|
|
30
30
|
accepted=".xlsx"
|
|
@@ -68,11 +68,20 @@
|
|
|
68
68
|
_key="print"
|
|
69
69
|
type="primary"
|
|
70
70
|
title="Iniciar Validação"
|
|
71
|
+
:disabled="true"
|
|
71
72
|
classIcon="fa-solid fa-arrow-right-arrow-left"
|
|
72
73
|
size="small"
|
|
73
74
|
:clicked="print"
|
|
74
75
|
/>
|
|
75
76
|
</div>
|
|
77
|
+
<br />
|
|
78
|
+
<Alert type="info">
|
|
79
|
+
<span>
|
|
80
|
+
Total de <b> {{ totalRecords }} </b> registro(s), porem para o
|
|
81
|
+
mapeamento serão carregados somente os <b> 10 </b> primeiros
|
|
82
|
+
registros (se houver).
|
|
83
|
+
</span>
|
|
84
|
+
</Alert>
|
|
76
85
|
<TableImport
|
|
77
86
|
:select="select"
|
|
78
87
|
:headerTable="headerTable"
|
|
@@ -91,13 +100,23 @@ import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
|
|
|
91
100
|
import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
|
|
92
101
|
import FileUpload from "@nixweb/nixloc-ui/src/component/forms/FileUpload";
|
|
93
102
|
import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
|
|
103
|
+
import Alert from "@nixweb/nixloc-ui/src/component/layout/Alert";
|
|
104
|
+
|
|
94
105
|
import TableImport from "@nixweb/nixloc-ui/src/component/shared/TableImport.vue";
|
|
95
106
|
|
|
96
107
|
import { mapState, mapActions, mapMutations } from "vuex";
|
|
97
108
|
|
|
98
109
|
export default {
|
|
99
110
|
name: "ViewTemplateImportFileView",
|
|
100
|
-
components: {
|
|
111
|
+
components: {
|
|
112
|
+
Panel,
|
|
113
|
+
Button,
|
|
114
|
+
Molded,
|
|
115
|
+
FileUpload,
|
|
116
|
+
Loading,
|
|
117
|
+
TableImport,
|
|
118
|
+
Alert,
|
|
119
|
+
},
|
|
101
120
|
props: {
|
|
102
121
|
panel: Object,
|
|
103
122
|
select: Array,
|
|
@@ -110,10 +129,8 @@ export default {
|
|
|
110
129
|
urlMapping: "/api/v1/stock/import-product/mapping",
|
|
111
130
|
loading: false,
|
|
112
131
|
headerTable: [],
|
|
113
|
-
data: [
|
|
114
|
-
|
|
115
|
-
{ cell1: "a", cell2: "c", cell3: "d" },
|
|
116
|
-
],
|
|
132
|
+
data: [],
|
|
133
|
+
totalRecords: 0,
|
|
117
134
|
};
|
|
118
135
|
},
|
|
119
136
|
methods: {
|
|
@@ -140,6 +157,8 @@ export default {
|
|
|
140
157
|
if (response.success) {
|
|
141
158
|
this.loading = false;
|
|
142
159
|
this.headerTable = response.content.headerTable;
|
|
160
|
+
this.data = response.content.data;
|
|
161
|
+
this.totalRecords = response.content.totalRecords;
|
|
143
162
|
}
|
|
144
163
|
});
|
|
145
164
|
},
|
|
@@ -159,7 +178,7 @@ export default {
|
|
|
159
178
|
}
|
|
160
179
|
|
|
161
180
|
.div-file {
|
|
162
|
-
margin-top:
|
|
181
|
+
margin-top: 20px;
|
|
163
182
|
}
|
|
164
183
|
|
|
165
184
|
.div-btn {
|