@burh/nuxt-core 1.0.68 → 1.0.70
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/components/argon-core/Cards/Card.vue +63 -64
- package/components/argon-core/Modal.vue +129 -101
- package/components/burh-ds/Cards/ApplicantCard.vue +67 -0
- package/components/burh-ds/Groups/SimpleProductItem.vue +0 -6
- package/components/burh-ds/Modals/ShareBufferModal.vue +80 -0
- package/package.json +1 -1
|
@@ -1,72 +1,71 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
2
|
+
<div
|
|
3
|
+
class="card"
|
|
4
|
+
:class="[
|
|
5
|
+
{ 'card-lift--hover': hover },
|
|
6
|
+
{ shadow: shadow },
|
|
7
|
+
{ [`shadow-${shadowSize}`]: shadowSize },
|
|
8
|
+
{ [`bg-gradient-${gradient}`]: gradient },
|
|
9
|
+
{ [`bg-${type}`]: type }
|
|
10
|
+
]"
|
|
11
|
+
>
|
|
12
|
+
<slot name="image"></slot>
|
|
13
|
+
<div class="card-header" :class="headerClasses" v-if="$slots.header">
|
|
14
|
+
<slot name="header"> </slot>
|
|
15
|
+
</div>
|
|
16
|
+
<div class="card-body" :class="bodyClasses" v-if="!noBody">
|
|
17
|
+
<slot name="body"></slot>
|
|
18
|
+
</div>
|
|
10
19
|
|
|
11
|
-
|
|
12
|
-
<div class="card-header" :class="headerClasses" v-if="$slots.header">
|
|
13
|
-
<slot name="header">
|
|
14
|
-
</slot>
|
|
15
|
-
</div>
|
|
16
|
-
<div class="card-body" :class="bodyClasses" v-if="!noBody">
|
|
17
|
-
<slot></slot>
|
|
18
|
-
</div>
|
|
20
|
+
<slot v-if="noBody"></slot>
|
|
19
21
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
</div>
|
|
25
|
-
</div>
|
|
22
|
+
<div class="card-footer" :class="footerClasses" v-if="$slots.footer">
|
|
23
|
+
<slot name="footer"></slot>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
26
|
</template>
|
|
27
27
|
<script>
|
|
28
28
|
export default {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
29
|
+
name: "card",
|
|
30
|
+
props: {
|
|
31
|
+
type: {
|
|
32
|
+
type: String,
|
|
33
|
+
description: "Card type"
|
|
34
|
+
},
|
|
35
|
+
gradient: {
|
|
36
|
+
type: String,
|
|
37
|
+
description: "Card background gradient type (warning,danger etc)"
|
|
38
|
+
},
|
|
39
|
+
hover: {
|
|
40
|
+
type: Boolean,
|
|
41
|
+
description: "Whether card should move on hover"
|
|
42
|
+
},
|
|
43
|
+
shadow: {
|
|
44
|
+
type: Boolean,
|
|
45
|
+
description: "Whether card has shadow"
|
|
46
|
+
},
|
|
47
|
+
shadowSize: {
|
|
48
|
+
type: String,
|
|
49
|
+
description: "Card shadow size"
|
|
50
|
+
},
|
|
51
|
+
noBody: {
|
|
52
|
+
type: Boolean,
|
|
53
|
+
default: false,
|
|
54
|
+
description: "Whether card should have wrapper body class"
|
|
55
|
+
},
|
|
56
|
+
bodyClasses: {
|
|
57
|
+
type: [String, Object, Array],
|
|
58
|
+
description: "Card body css classes"
|
|
59
|
+
},
|
|
60
|
+
headerClasses: {
|
|
61
|
+
type: [String, Object, Array],
|
|
62
|
+
description: "Card header css classes"
|
|
63
|
+
},
|
|
64
|
+
footerClasses: {
|
|
65
|
+
type: [String, Object, Array],
|
|
66
|
+
description: "Card footer css classes"
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
69
|
};
|
|
70
70
|
</script>
|
|
71
|
-
<style>
|
|
72
|
-
</style>
|
|
71
|
+
<style></style>
|
|
@@ -1,124 +1,152 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
2
|
+
<SlideYUpTransition :duration="animationDuration">
|
|
3
|
+
<div
|
|
4
|
+
class="modal fade"
|
|
5
|
+
@click.self="closeModal"
|
|
6
|
+
:class="[
|
|
7
|
+
{ 'show d-block': show },
|
|
8
|
+
{ 'd-none': !show },
|
|
9
|
+
{ 'modal-mini': type === 'mini' }
|
|
10
|
+
]"
|
|
11
|
+
v-show="show"
|
|
12
|
+
tabindex="-1"
|
|
13
|
+
role="dialog"
|
|
14
|
+
:aria-hidden="!show"
|
|
15
|
+
>
|
|
16
|
+
<div
|
|
17
|
+
class="modal-dialog modal-dialog-centered"
|
|
18
|
+
:class="[
|
|
19
|
+
{
|
|
20
|
+
'modal-notice': type === 'notice',
|
|
21
|
+
[`modal-${size}`]: size
|
|
22
|
+
},
|
|
23
|
+
modalClasses
|
|
24
|
+
]"
|
|
25
|
+
>
|
|
26
|
+
<div
|
|
27
|
+
class="modal-content"
|
|
28
|
+
:class="[
|
|
29
|
+
gradient ? `bg-gradient-${gradient}` : '',
|
|
30
|
+
modalContentClasses
|
|
31
|
+
]"
|
|
32
|
+
>
|
|
33
|
+
<div
|
|
34
|
+
class="modal-header"
|
|
35
|
+
:class="[headerClasses]"
|
|
36
|
+
v-if="$slots.header"
|
|
37
|
+
>
|
|
38
|
+
<slot name="header"></slot>
|
|
39
|
+
<slot name="close-button">
|
|
40
|
+
<button
|
|
41
|
+
type="button"
|
|
42
|
+
class="close"
|
|
43
|
+
v-if="showClose"
|
|
44
|
+
@click="closeModal"
|
|
45
|
+
data-dismiss="modal"
|
|
46
|
+
aria-label="Close"
|
|
47
|
+
>
|
|
48
|
+
<span :aria-hidden="!show">×</span>
|
|
49
|
+
</button>
|
|
50
|
+
</slot>
|
|
51
|
+
</div>
|
|
10
52
|
|
|
11
|
-
|
|
12
|
-
|
|
53
|
+
<div class="modal-body" :class="bodyClasses">
|
|
54
|
+
<slot name="body"></slot>
|
|
55
|
+
</div>
|
|
13
56
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
<span :aria-hidden="!show">×</span>
|
|
24
|
-
</button>
|
|
25
|
-
</slot>
|
|
26
|
-
</div>
|
|
27
|
-
|
|
28
|
-
<div class="modal-body" :class="bodyClasses">
|
|
29
|
-
<slot></slot>
|
|
30
|
-
</div>
|
|
31
|
-
|
|
32
|
-
<div class="modal-footer" :class="footerClasses" v-if="$slots.footer">
|
|
33
|
-
<slot name="footer"></slot>
|
|
34
|
-
</div>
|
|
57
|
+
<div
|
|
58
|
+
class="modal-footer"
|
|
59
|
+
:class="footerClasses"
|
|
60
|
+
v-if="$slots.footer"
|
|
61
|
+
>
|
|
62
|
+
<slot name="footer"></slot>
|
|
63
|
+
</div>
|
|
64
|
+
</div>
|
|
65
|
+
</div>
|
|
35
66
|
</div>
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
</div>
|
|
39
|
-
</SlideYUpTransition>
|
|
67
|
+
</SlideYUpTransition>
|
|
40
68
|
</template>
|
|
41
69
|
<script>
|
|
42
|
-
|
|
70
|
+
import { SlideYUpTransition } from "vue2-transitions";
|
|
43
71
|
|
|
44
|
-
|
|
72
|
+
export default {
|
|
45
73
|
name: "modal",
|
|
46
74
|
components: {
|
|
47
|
-
|
|
75
|
+
SlideYUpTransition
|
|
48
76
|
},
|
|
49
77
|
props: {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
78
|
+
show: Boolean,
|
|
79
|
+
showClose: {
|
|
80
|
+
type: Boolean,
|
|
81
|
+
default: true
|
|
82
|
+
},
|
|
83
|
+
type: {
|
|
84
|
+
type: String,
|
|
85
|
+
default: "",
|
|
86
|
+
validator(value) {
|
|
87
|
+
let acceptedValues = ["", "notice", "mini"];
|
|
88
|
+
return acceptedValues.indexOf(value) !== -1;
|
|
89
|
+
},
|
|
90
|
+
description: 'Modal type (notice|mini|"") '
|
|
91
|
+
},
|
|
92
|
+
modalClasses: {
|
|
93
|
+
type: [Object, String],
|
|
94
|
+
description: "Modal dialog css classes"
|
|
95
|
+
},
|
|
96
|
+
size: {
|
|
97
|
+
type: String,
|
|
98
|
+
description: "Modal size",
|
|
99
|
+
validator(value) {
|
|
100
|
+
let acceptedValues = ["", "sm", "lg", "xl"];
|
|
101
|
+
return acceptedValues.indexOf(value) !== -1;
|
|
102
|
+
}
|
|
61
103
|
},
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
type: [Object, String],
|
|
66
|
-
description: "Modal dialog css classes"
|
|
67
|
-
},
|
|
68
|
-
size: {
|
|
69
|
-
type: String,
|
|
70
|
-
description: 'Modal size',
|
|
71
|
-
validator(value) {
|
|
72
|
-
let acceptedValues = ["", "sm", "lg","xl"];
|
|
73
|
-
return acceptedValues.indexOf(value) !== -1;
|
|
104
|
+
modalContentClasses: {
|
|
105
|
+
type: [Object, String],
|
|
106
|
+
description: "Modal dialog content css classes"
|
|
74
107
|
},
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
animationDuration: {
|
|
97
|
-
type: Number,
|
|
98
|
-
default: 500,
|
|
99
|
-
description: "Modal transition duration"
|
|
100
|
-
}
|
|
108
|
+
gradient: {
|
|
109
|
+
type: String,
|
|
110
|
+
description: "Modal gradient type (danger, primary etc)"
|
|
111
|
+
},
|
|
112
|
+
headerClasses: {
|
|
113
|
+
type: [Object, String],
|
|
114
|
+
description: "Modal Header css classes"
|
|
115
|
+
},
|
|
116
|
+
bodyClasses: {
|
|
117
|
+
type: [Object, String],
|
|
118
|
+
description: "Modal Body css classes"
|
|
119
|
+
},
|
|
120
|
+
footerClasses: {
|
|
121
|
+
type: [Object, String],
|
|
122
|
+
description: "Modal Footer css classes"
|
|
123
|
+
},
|
|
124
|
+
animationDuration: {
|
|
125
|
+
type: Number,
|
|
126
|
+
default: 500,
|
|
127
|
+
description: "Modal transition duration"
|
|
128
|
+
}
|
|
101
129
|
},
|
|
102
130
|
methods: {
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
131
|
+
closeModal() {
|
|
132
|
+
this.$emit("update:show", false);
|
|
133
|
+
this.$emit("close");
|
|
134
|
+
}
|
|
107
135
|
},
|
|
108
136
|
watch: {
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
137
|
+
show(val) {
|
|
138
|
+
let documentClasses = document.body.classList;
|
|
139
|
+
if (val) {
|
|
140
|
+
documentClasses.add("modal-open");
|
|
141
|
+
} else {
|
|
142
|
+
documentClasses.remove("modal-open");
|
|
143
|
+
}
|
|
115
144
|
}
|
|
116
|
-
}
|
|
117
145
|
}
|
|
118
|
-
|
|
146
|
+
};
|
|
119
147
|
</script>
|
|
120
148
|
<style>
|
|
121
|
-
|
|
149
|
+
.modal.show {
|
|
122
150
|
background-color: rgba(0, 0, 0, 0.3);
|
|
123
|
-
|
|
151
|
+
}
|
|
124
152
|
</style>
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="box-applicant col-12 col-sm-6 col-md-3">
|
|
3
|
+
<card
|
|
4
|
+
:hover="true"
|
|
5
|
+
:bodyClasses="'mx-auto text-center px-0'"
|
|
6
|
+
:footerClasses="'mx-auto border-0'"
|
|
7
|
+
>
|
|
8
|
+
<div slot="body">
|
|
9
|
+
<div class="avatar rounded-circle header-avatar">
|
|
10
|
+
<img
|
|
11
|
+
src="https://www.qries.com/images/banner_logo.png"
|
|
12
|
+
class="border"
|
|
13
|
+
/>
|
|
14
|
+
</div>
|
|
15
|
+
<p class="display-4 mx-auto text-truncate">
|
|
16
|
+
{{ applicantName }}
|
|
17
|
+
</p>
|
|
18
|
+
<p class="display-5 mx-auto text-muted">{{ applicantCity }}</p>
|
|
19
|
+
<span class="mx-auto text-muted"
|
|
20
|
+
><i class="fab fa-whatsapp mr-2"></i
|
|
21
|
+
>{{ applicantPhone }}</span
|
|
22
|
+
>
|
|
23
|
+
</div>
|
|
24
|
+
|
|
25
|
+
<div slot="footer">
|
|
26
|
+
<i v-if="isSeen" class="fa fa-eye"></i>
|
|
27
|
+
<i v-else class="fa fa-eye-slash"></i>
|
|
28
|
+
</div>
|
|
29
|
+
</card>
|
|
30
|
+
</div>
|
|
31
|
+
</template>
|
|
32
|
+
<script>
|
|
33
|
+
export default {
|
|
34
|
+
props: {
|
|
35
|
+
applicantName: null,
|
|
36
|
+
applicantImg: null,
|
|
37
|
+
applicantPhone: null,
|
|
38
|
+
applicantCity: null,
|
|
39
|
+
isSeen: null
|
|
40
|
+
},
|
|
41
|
+
data() {
|
|
42
|
+
return {};
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
</script>
|
|
46
|
+
<style lang="scss" scoped>
|
|
47
|
+
.card {
|
|
48
|
+
background: linear-gradient(#01386a 40%, #fff 20%);
|
|
49
|
+
}
|
|
50
|
+
.header {
|
|
51
|
+
&-avatar {
|
|
52
|
+
position: relative;
|
|
53
|
+
width: 8rem;
|
|
54
|
+
height: 8rem;
|
|
55
|
+
max-width: 100%;
|
|
56
|
+
max-height: 90%;
|
|
57
|
+
img {
|
|
58
|
+
height: 100%;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
.box-applicant {
|
|
63
|
+
.card-body {
|
|
64
|
+
height: 20.5rem !important;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
</style>
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<modal
|
|
3
|
+
:show.sync="openModal"
|
|
4
|
+
modalContentClasses="container-fluid"
|
|
5
|
+
headerClasses="row px-4 pt-5"
|
|
6
|
+
bodyClasses="row px-4"
|
|
7
|
+
v-on:close="$emit('close-modal')"
|
|
8
|
+
size="lg"
|
|
9
|
+
class="modal"
|
|
10
|
+
>
|
|
11
|
+
<template slot="header">
|
|
12
|
+
<div class="pl-3">
|
|
13
|
+
<h2 class="display-4">Compartilhar</h2>
|
|
14
|
+
</div>
|
|
15
|
+
</template>
|
|
16
|
+
|
|
17
|
+
<template slot="body">
|
|
18
|
+
<div class="col-12">
|
|
19
|
+
<slot name="body"></slot>
|
|
20
|
+
</div>
|
|
21
|
+
|
|
22
|
+
<div class="col-12 mb-4">
|
|
23
|
+
<label class="mb-0 form-control-label mb-3">
|
|
24
|
+
TEMPO LIMITE PARA CONCLUSÃO
|
|
25
|
+
</label>
|
|
26
|
+
<slot name="buttons"></slot>
|
|
27
|
+
</div>
|
|
28
|
+
|
|
29
|
+
<div class="col-12 d-flex pb-4">
|
|
30
|
+
<base-button
|
|
31
|
+
size="md"
|
|
32
|
+
type="primary"
|
|
33
|
+
role="button"
|
|
34
|
+
@click="sendConfig()"
|
|
35
|
+
class="ml-auto"
|
|
36
|
+
>Enviar
|
|
37
|
+
</base-button>
|
|
38
|
+
</div>
|
|
39
|
+
</template>
|
|
40
|
+
</modal>
|
|
41
|
+
</template>
|
|
42
|
+
<script>
|
|
43
|
+
import { mask } from "vue-the-mask";
|
|
44
|
+
import { Select, Option } from "element-ui";
|
|
45
|
+
export default {
|
|
46
|
+
components: {
|
|
47
|
+
[Select.name]: Select,
|
|
48
|
+
[Option.name]: Option
|
|
49
|
+
},
|
|
50
|
+
directives: { mask },
|
|
51
|
+
data() {
|
|
52
|
+
return {};
|
|
53
|
+
},
|
|
54
|
+
model: {
|
|
55
|
+
prop: "show"
|
|
56
|
+
},
|
|
57
|
+
props: {
|
|
58
|
+
show: {
|
|
59
|
+
type: Boolean,
|
|
60
|
+
default: false
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
watch: {},
|
|
64
|
+
mounted() {},
|
|
65
|
+
computed: {
|
|
66
|
+
openModal: {
|
|
67
|
+
get() {
|
|
68
|
+
return this.show;
|
|
69
|
+
},
|
|
70
|
+
set(show) {
|
|
71
|
+
this.$emit("input", show);
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
methods: {}
|
|
76
|
+
};
|
|
77
|
+
</script>
|
|
78
|
+
<style lang="scss">
|
|
79
|
+
@import "node_modules/@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss";
|
|
80
|
+
</style>
|