@nixweb/nixloc-ui 0.0.235 → 0.0.237

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.235",
3
+ "version": "0.0.237",
4
4
  "description": "Componentes UI",
5
5
  "author": "Fábio Ávila <fabio@nixweb.com.br>",
6
6
  "private": false,
@@ -0,0 +1,129 @@
1
+ <template>
2
+ <div>
3
+ <div class="div-current" @click="show = true">
4
+ <img class="img-current" :src="baseUrl + currentValue.photo" alt="">
5
+ </div>
6
+ <div v-if="show" class="main-select" @mouseleave="show = false">
7
+ <div v-for="item in data">
8
+ <div class="div-frame" @click="select(item)">
9
+ <b-row>
10
+ <b-col sm="3">
11
+ <img class="img-card" :src="baseUrl + item.photo" alt="">
12
+ </b-col>
13
+ <b-col sm="9">
14
+ <div class="title-name">{{ item.name }}</div>
15
+ </b-col>
16
+ </b-row>
17
+ </div>
18
+ </div>
19
+ </div>
20
+ </div>
21
+ </template>
22
+ <script>
23
+
24
+ import { mapActions } from "vuex";
25
+
26
+ export default {
27
+ name: "Select",
28
+ props: {
29
+ genericId: String,
30
+ responsibleUser: Object,
31
+ title: String,
32
+ urlGet: String,
33
+ urlUpdate: String,
34
+ },
35
+ components: {
36
+
37
+ },
38
+ data() {
39
+ return {
40
+ baseUrl: "https://espaco.blob.core.windows.net/nixloc-photo-user/",
41
+ currentValue: {},
42
+ data: [],
43
+ show: false,
44
+ baseParams: {
45
+ search: "",
46
+ currentPage: 1,
47
+ totalPerPage: 20,
48
+ },
49
+ };
50
+ },
51
+ mounted() {
52
+ this.getAll();
53
+ },
54
+ methods: {
55
+ ...mapActions("generic", ["getApi", "putApi"]),
56
+ getAll() {
57
+ let obj = { ...this.baseParams };
58
+ let params = { url: this.urlGet, obj: obj };
59
+ this.loading = true;
60
+ this.getApi(params).then((response) => {
61
+ this.data = response.content.data;
62
+ });
63
+ },
64
+ updateResponsibleUser() {
65
+ let params = {
66
+ url: this.urlUpdate,
67
+ obj: { id: this.genericId, userId: this.currentValue.id },
68
+ notNotifyToast: true
69
+ };
70
+ this.putApi(params).then((response) => { });
71
+ },
72
+ select(item) {
73
+ this.currentValue = item;
74
+ this.show = false;
75
+ this.updateResponsibleUser();
76
+ }
77
+ },
78
+ watch: {
79
+ responsibleUser: {
80
+ handler(responsibleUser) {
81
+ this.currentValue = responsibleUser;
82
+ },
83
+ deep: true,
84
+ },
85
+ }
86
+ };
87
+ </script>
88
+
89
+ <style scoped>
90
+ .main-select {
91
+ position: fixed;
92
+ margin-left: 20px;
93
+ min-width: 250px;
94
+ background-color: white !important;
95
+ padding: 15px;
96
+ border: 1px solid #E8EAED;
97
+ border-radius: 10px;
98
+ cursor: pointer;
99
+ z-index: 1000 !important;
100
+ }
101
+
102
+ .div-frame:hover {
103
+ background-color: #F8F9FA !important;
104
+ border-radius: 10px;
105
+ }
106
+
107
+ .div-current {
108
+ cursor: pointer;
109
+ }
110
+
111
+ .title-name {
112
+ margin-top: 13px;
113
+ font-size: 13px;
114
+ }
115
+
116
+ .img-card {
117
+ width: 35px;
118
+ height: 35px;
119
+ margin: 5px;
120
+ border-radius: 50px;
121
+ }
122
+
123
+ .img-current {
124
+ width: 30px;
125
+ height: 30px;
126
+ border-radius: 50px;
127
+ }
128
+ </style>
129
+
@@ -9,7 +9,7 @@
9
9
  {{ row[obj.field] }}
10
10
  <div>{{ row[obj.fieldSecond] }}</div>
11
11
  </div>
12
- <div v-if="obj.type === 'image'">
12
+ <div v-if="obj.type === 'image'" :style="obj.styleBody">
13
13
  <img :class="convertClass(row[obj.fieldComparison], obj.classCssBody)" class="img"
14
14
  :src="urlImage + obj.container + '/' + row[obj.field]" />
15
15
  </div>
@@ -18,27 +18,33 @@
18
18
  {{ row[obj.field] }}
19
19
  </div>
20
20
  </div>
21
- <div v-if="obj.type === 'html'" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
21
+ <div v-if="obj.type === 'html'" :style="obj.styleBody"
22
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
22
23
  <div v-if="row[obj.field]" v-html="row[obj.field]"></div>
23
24
  <div v-else v-html="obj.html"></div>
24
25
  </div>
25
- <div v-if="obj.type === 'select'" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
26
+ <div v-if="obj.type === 'select'" :style="obj.styleBody"
27
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
26
28
  {{ row[obj.field].content }}
27
29
  </div>
28
- <div v-if="obj.type === 'date'" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
30
+ <div v-if="obj.type === 'date'" :style="obj.styleBody"
31
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
29
32
  {{ row[obj.field] | moment("DD/MM/YYYY") }}
30
33
  </div>
31
- <div v-if="obj.type === 'dateTime'" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
34
+ <div v-if="obj.type === 'dateTime'" :style="obj.styleBody"
35
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
32
36
  {{ row[obj.field] | moment("DD/MM/YYYY HH:mm") }}
33
37
  </div>
34
- <div v-if="obj.type === 'currency'" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
38
+ <div v-if="obj.type === 'currency'" :style="obj.styleBody"
39
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
35
40
  {{ row[obj.field] | currency }}
36
41
  </div>
37
- <div v-if="obj.type === 'button'" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
42
+ <div v-if="obj.type === 'button'" :style="obj.styleBody"
43
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
38
44
  <TableButton v-if="obj.ifFieldEqual == row[obj.field]" :obj="obj" :row="row" />
39
45
  </div>
40
- <div v-if="obj.type === 'link'" class="link" :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
41
- @click="navegateTo(obj, row)">
46
+ <div v-if="obj.type === 'link'" class="link" :style="obj.styleBody"
47
+ :class="convertClass(row[obj.fieldComparison], obj.classCssBody)" @click="navegateTo(obj, row)">
42
48
  <span> {{ row[obj.field] }}</span>
43
49
  <div class="field-second">{{ row[obj.fieldSecond] }}</div>
44
50
  </div>