@nixweb/nixloc-ui 0.0.208 → 0.0.209

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": "@nixweb/nixloc-ui",
3
- "version": "0.0.208",
3
+ "version": "0.0.209",
4
4
  "description": "Componentes UI",
5
5
  "author": "Fábio Ávila <fabio@nixweb.com.br>",
6
6
  "private": false,
@@ -1,25 +1,23 @@
1
1
  <template>
2
2
  <div>
3
- <div>
4
- <div class="file" v-if="!value">
5
- <button class="button small primary">
6
- <span v-if="!loadingAdd">
7
- <i :class="classIcon"></i> {{ title }}</span>
8
- <vue-loading v-if="loadingAdd" type="bubbles" color="#fff"
9
- :size="{ width: '20px', height: '20px' }"></vue-loading>
10
- </button>
11
- <input type="file" name="myfile" ref="file" :accept="allowed" v-on:change="upload()" />
12
- </div>
13
- <div v-if="value">
14
- <button class="button small success" @click="download()" v-if="!loadingAdd">
15
- <i class="fas fa-cloud-download-alt"></i> Baixar
16
- </button>
17
- <button class="button small danger" v-if="!loadingAdd" @click="remove()">
18
- <span v-if="!loadingRemove">Remover</span>
19
- <vue-loading v-if="loadingRemove" type="bubbles" color="#fff"
20
- :size="{ width: '20px', height: '20px' }"></vue-loading>
21
- </button>
22
- </div>
3
+ <div class="file" v-if="!value">
4
+ <button class="button small primary">
5
+ <span v-if="!loadingAdd">
6
+ <i :class="classIcon"></i> {{ title }}</span>
7
+ <vue-loading v-if="loadingAdd" type="bubbles" color="#fff"
8
+ :size="{ width: '20px', height: '20px' }"></vue-loading>
9
+ </button>
10
+ <input type="file" name="myfile" ref="file" :accept="allowed" v-on:change="upload()" />
11
+ </div>
12
+ <div v-if="value">
13
+ <button class="button small success" @click="download()" v-if="!loadingAdd">
14
+ <i class="fas fa-cloud-download-alt"></i> Baixar
15
+ </button>
16
+ <button class="button small danger" v-if="!loadingAdd" @click="remove()">
17
+ <span v-if="!loadingRemove">Remover</span>
18
+ <vue-loading v-if="loadingRemove" type="bubbles" color="#fff"
19
+ :size="{ width: '20px', height: '20px' }"></vue-loading>
20
+ </button>
23
21
  </div>
24
22
  </div>
25
23
  </template>
@@ -1,39 +1,45 @@
1
1
  <template>
2
2
  <div>
3
- <b-row>
4
- <b-col sm="3">
5
- <div class="file">
6
- <button class="button small primary" @click="openCamera">
7
- <span><i class="fa-regular fa-camera-web"></i> Câmera</span>
8
- </button>
9
- </div>
10
- <div class="file">
11
- <button class="button small primary">
12
- <span><i class="fa-solid fa-upload"></i> Carregar arquivos</span>
13
- </button>
14
- <input type="file" name="myfile" ref="file" @change="handleFileChange" multiple />
15
- </div>
16
- </b-col>
17
- <b-col sm="9">
18
- <div class="side-by-side" v-for="attachment in attachments">
19
- <div class="text-center box-file">
20
- <div v-if="attachment.extension == 'png' || attachment.extension == 'jpg'">
21
- <img class="img" :src="urlBase + attachment.fileName">
22
- </div>
23
- <div class="icon-generic" v-else>
24
- <i class="fa-light fa-file"></i>
25
- <div><span class="name">{{ attachment.name }}</span></div>
26
- </div>
27
- <div class="icon side-by-side">
28
- <i class="fa-solid fa-download"></i>
29
- </div>
30
- <div class="icon icon-close side-by-side">
31
- <i class="fa-solid fa-circle-xmark"></i>
3
+ <div v-if="loading">
4
+ <span>Aguarde, estamos importando os arquivos...</span>
5
+ <Loading type="line" :center="false" />
6
+ </div>
7
+ <div v-else>
8
+ <b-row>
9
+ <b-col sm="3">
10
+ <div class="file">
11
+ <button class="button small primary" @click="openCamera">
12
+ <span><i class="fa-regular fa-camera-web"></i> Câmera</span>
13
+ </button>
14
+ </div>
15
+ <div class="file">
16
+ <button class="button small primary">
17
+ <span><i class="fa-solid fa-upload"></i> Carregar arquivos</span>
18
+ </button>
19
+ <input type="file" name="myfile" ref="file" @change="confirm" multiple />
20
+ </div>
21
+ </b-col>
22
+ <b-col sm="9">
23
+ <div class="side-by-side" v-for="attachment in attachments">
24
+ <div class="text-center box-file">
25
+ <div v-if="attachment.extension == 'png' || attachment.extension == 'jpg'">
26
+ <img class="img" :src="baseUrl + attachment.fileName">
27
+ </div>
28
+ <div class="icon-generic" v-else>
29
+ <i class="fa-light fa-file"></i>
30
+ <div><span class="name">{{ attachment.name }}</span></div>
31
+ </div>
32
+ <div class="icon side-by-side">
33
+ <i class="fa-solid fa-download"></i>
34
+ </div>
35
+ <div class="icon icon-close side-by-side">
36
+ <i class="fa-solid fa-circle-xmark"></i>
37
+ </div>
32
38
  </div>
33
39
  </div>
34
- </div>
35
- </b-col>
36
- </b-row>
40
+ </b-col>
41
+ </b-row>
42
+ </div>
37
43
  <Modal title="Câmera" :width="600" :height="750" v-if="showModal('webcam')" :onHideModal="stopCamera">
38
44
  <div class="text-center">
39
45
  <WebCam ref="webcam" :autoplay="false" width="400" height="100%"></WebCam>
@@ -46,89 +52,51 @@
46
52
  </div>
47
53
  </div>
48
54
  </Modal>
55
+ <Modal title="Confirmar" :width="600" :height="750" v-if="showModal('confirm')">
56
+ <div class="text-center title">
57
+ <div>
58
+ Total de <b>{{ files.length }}</b> carregados...
59
+ </div>
60
+ <div>
61
+ <button class="button small primary" @click="loadFiles">
62
+ <span>
63
+ <i class="fa-solid fa-circle-check"></i> Confirmar
64
+ </span>
65
+ </button>
66
+ </div>
67
+ </div>
68
+
69
+ </Modal>
49
70
  </div>
50
71
  </template>
51
72
  <script>
52
73
 
53
74
  import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
75
+ import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
54
76
 
55
77
  import { WebCam } from 'vue-cam-vision'
56
78
 
57
- import { mapState, mapGetters, mapMutations } from "vuex";
79
+ import { mapActions, mapGetters, mapMutations } from "vuex";
58
80
 
59
81
  export default {
60
82
  components: {
61
83
  WebCam,
62
- Modal
84
+ Modal,
85
+ Loading
63
86
  },
64
87
  props: {
65
88
  baseUrl: {
66
89
  type: String,
67
90
  default: "https://espaco.blob.core.windows.net",
68
91
  },
69
- container: {
70
- type: String,
71
- default: "nixloc-attachment",
72
- }
92
+ source: String,
93
+ genericId: String
73
94
  },
74
95
  data() {
75
96
  return {
97
+ urlPost: "/api/v1/adm/attachment/upload",
76
98
  files: [],
77
99
  attachments: [
78
- {
79
- fileName: "T7I300FDB9_3.png",
80
- extension: "png",
81
- },
82
- {
83
- fileName: "T7I300FDB9_3.png",
84
- extension: "png",
85
- },
86
- {
87
- fileName: "T7I300FDB9_3.png",
88
- extension: "png",
89
- },
90
- {
91
- fileName: "T7I300FDB9_3.png",
92
- extension: "png",
93
- },
94
- {
95
- name: "screensh...",
96
- fileName: "T7I300FDB9_3.png",
97
- extension: "txt",
98
- },
99
- {
100
- fileName: "T7I300FDB9_3.png",
101
- extension: "png",
102
- },
103
- {
104
- fileName: "T7I300FDB9_3.png",
105
- extension: "png",
106
- },
107
- {
108
- fileName: "T7I300FDB9_3.png",
109
- extension: "png",
110
- },
111
- {
112
- fileName: "T7I300FDB9_3.png",
113
- extension: "png",
114
- },
115
- {
116
- name: "screensh...",
117
- fileName: "T7I300FDB9_3.png",
118
- extension: "txt",
119
- },
120
- {
121
- fileName: "T7I300FDB9_3.png",
122
- extension: "png",
123
- },
124
- {
125
- fileName: "T7I300FDB9_3.png",
126
- extension: "png",
127
- },
128
- {
129
- fileName: "T7I300FDB9_3.png",
130
- extension: "png",
131
- },
132
100
  {
133
101
  fileName: "T7I300FDB9_3.png",
134
102
  extension: "png",
@@ -141,12 +109,34 @@ export default {
141
109
  ],
142
110
  captures: [],
143
111
  imgReport: [],
112
+ loading: false,
144
113
  };
145
114
  },
146
115
  methods: {
147
116
  ...mapMutations("generic", ["openModal", "hideModal"]),
148
- handleFileChange() {
149
- this.files = this.$refs.file.files;
117
+ ...mapActions("generic", ["postFileApi", "deleteFileApi"]),
118
+ confirm() {
119
+ this.files = Object.values(this.$refs.file.files);
120
+ this.openModal("confirm");
121
+ },
122
+ async loadFiles() {
123
+ this.hideModal("confirm");
124
+ this.loading = true;
125
+ let self = this;
126
+ for (const file of this.files) {
127
+ await self.upload(file);
128
+ }
129
+
130
+ this.loading = false;
131
+ },
132
+ async upload(file) {
133
+ let params = {
134
+ url: this.urlPost,
135
+ file: file,
136
+ name: this.source,
137
+ container: this.genericId,
138
+ };
139
+ const response = await this.postFileApi(params);
150
140
  },
151
141
  openCamera() {
152
142
  this.openModal("webcam");
@@ -260,7 +250,10 @@ export default {
260
250
  color: red;
261
251
  }
262
252
 
263
- .btn-webcam {}
253
+ .title {
254
+ font-size: 18px;
255
+ margin-bottom: 20px;
256
+ }
264
257
  </style>
265
258
 
266
259
 
@@ -7,10 +7,10 @@
7
7
  <Molded>
8
8
  <b-row>
9
9
  <b-col sm="10">
10
- <span class="title-module">
10
+ <div class="title-module">
11
11
  <i class="fa-solid fa-video"></i>
12
12
  {{ module.name }}
13
- </span>
13
+ </div>
14
14
  </b-col>
15
15
  <b-col sm="2">
16
16
  <div class="div-title">
@@ -66,32 +66,28 @@
66
66
  <Molded>
67
67
  <div class="div-view" v-html="selectedLesson.videoUrl"></div>
68
68
  </Molded>
69
-
70
69
  </b-col>
71
70
  </Modal>
72
71
  </div>
73
72
  </template>
74
73
 
75
74
  <script>
76
- import draggable from 'vuedraggable';
75
+
77
76
  import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
78
- import InputText from "@nixweb/nixloc-ui/src/component/forms/InputText";
79
- import InputTextEdit from "@nixweb/nixloc-ui/src/component/forms/InputTextEdit";
80
- import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
81
77
  import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
82
- import CodeEditor from "@nixweb/nixloc-ui/src/component/shared/CodeEditor";
83
- import ButtonFilter from "@nixweb/nixloc-ui/src/component/forms/ButtonFilter";
84
78
 
85
- import { mapGetters, mapActions, mapMutations, mapState } from "vuex";
79
+ import axios from "@/config/axios";
80
+
81
+ import { mapGetters, mapMutations } from "vuex";
86
82
 
87
83
  export default {
88
84
  components: {
89
- draggable, Molded, InputText, InputTextEdit, Button, Modal, CodeEditor, ButtonFilter
85
+ Molded, Modal
90
86
  },
91
87
  data() {
92
88
  return {
93
- urlCreateOrUpdate: "/api/v1/support/training/create-or-update",
94
- urlGet: "/api/v1/support/training/get",
89
+ urlGet: "",
90
+ environment: "",
95
91
  courseModules: [],
96
92
  moduleSelected: "",
97
93
  selectedLesson: {}
@@ -100,11 +96,15 @@ export default {
100
96
  mounted() {
101
97
  this.get()
102
98
  },
99
+ created() {
100
+ this.environment = process.env.VUE_APP_API_URL == "https://backend-cliente-prod.azurewebsites.net/" ? "prod" : "dev";
101
+ if (this.environment == "prod") this.urlGet = "https://backend-adm-prod.azurewebsites.net/api/v1/support/training/get";
102
+ if (this.environment == "dev") this.urlGet = "https://backend-adm-dev.azurewebsites.net/api/v1/support/training/get";
103
+ },
103
104
  computed: {
104
105
  ...mapGetters("generic", ["showModal"]),
105
106
  },
106
107
  methods: {
107
- ...mapActions("generic", ["getApi", "postApi"]),
108
108
  ...mapMutations("generic", ["openModal", "hideModal"]),
109
109
  showLesson(moduleName) {
110
110
  this.moduleSelected = moduleName;
@@ -114,12 +114,12 @@ export default {
114
114
  this.openModal("play");
115
115
  },
116
116
  get() {
117
- let params = { url: this.urlGet, obj: {} };
118
- this.getApi(params).then((response) => {
119
- if (response.success) {
120
- this.courseModules = JSON.parse(response.content.course);
121
- }
122
- });
117
+ axios.get(this.urlGet, {})
118
+ .then(response => {
119
+ if (response.data.success) {
120
+ this.courseModules = JSON.parse(response.data.content.course);
121
+ }
122
+ })
123
123
  },
124
124
  },
125
125
  };
@@ -131,11 +131,12 @@ export default {
131
131
  }
132
132
 
133
133
  .title-module {
134
- font-size: 18px;
134
+ font-size: 15px;
135
+ margin-bottom: 10px;
135
136
  }
136
137
 
137
138
  .title-lesson {
138
- font-size: 15px;
139
+ font-size: 14px;
139
140
  }
140
141
 
141
142
  .title-description {