@burh/nuxt-core 1.0.202 → 1.0.204

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.
@@ -1,134 +1,134 @@
1
- <template>
2
- <el-dialog
3
- :visible.sync="isActive"
4
- width="80%"
5
- custom-class="position-relative"
6
- @close="$emit('close')"
7
- class="test-radius"
8
- >
9
- <template>
10
- <div class="row d-flex justify-content-between mx-0 user-pdf">
11
- <img v-show="coverPhoto" :src="coverPhoto" alt="" />
12
- <div v-show="!coverPhoto" class="no-cover-photo"></div>
13
- <slot name="content"></slot>
14
- </div>
15
- <slot></slot>
16
- <!-- <el-tooltip placement="top" :content="!showTools ? 'Exibir Ferramentas' : 'Esconder Ferramentas'">
17
- <span class="tool tool-show--tools">
18
- <font-awesome-icon :icon="['fas', !showTools ? 'expand-alt' : 'compress-alt']" class="h3 text-primary"
19
- @click="showTools = !showTools"/>
20
- </span>
21
- </el-tooltip> -->
22
- <span class="tool tool-close" @click="$emit('close')">
23
- Fechar
24
- <font-awesome-icon
25
- :icon="['fas', 'times']"
26
- class="text-white ml-1"
27
- />
28
- </span>
29
- </template>
30
- </el-dialog>
31
- </template>
32
-
33
- <script>
34
- import { Dialog } from 'element-ui';
35
-
36
- export default {
37
- name: 'user-curriculum',
38
- components: {
39
- [Dialog.name]: Dialog
40
- },
41
- props: {
42
- show: {
43
- type: Boolean,
44
- default: false
45
- },
46
- tools: {
47
- type: Array,
48
- default: () => []
49
- },
50
- cover: String
51
- },
52
- data() {
53
- return {
54
- isActive: this.show,
55
- showTools: false,
56
- coverPhoto: this.cover
57
- };
58
- },
59
- watch: {
60
- show(value) {
61
- this.isActive = value;
62
- },
63
- cover(value) {
64
- this.coverPhoto = value;
65
- }
66
- }
67
- };
68
- </script>
69
-
70
- <style lang="scss" scoped>
71
- @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
72
-
73
- /deep/ .el-dialog__body {
74
- padding: 0;
75
- }
76
-
77
- /deep/ .el-dialog__header {
78
- display: none;
79
- }
80
-
81
- /deep/ .el-dialog {
82
- overflow: hidden;
83
- border-radius: 10px;
84
- padding-bottom: 50px;
85
- max-width: 1360px;
86
- margin-top: 5vh!important;
87
- }
88
-
89
- .test-radius {
90
- border-radius: 10px;
91
- }
92
-
93
- .tool {
94
- position: absolute;
95
- top: 1rem;
96
- z-index: 10;
97
- color: $primary;
98
- cursor: pointer;
99
-
100
- &-show--tools {
101
- right: 1.5rem;
102
- }
103
-
104
- &-close {
105
- position: absolute;
106
- width: 104.93px;
107
- height: 28px;
108
- right: 1.5rem;
109
- display: flex;
110
- justify-content: center;
111
- align-items: center;
112
-
113
- font-weight: 600;
114
- background: rgba(0, 0, 0, 0.2);
115
- border-radius: 17.5px;
116
- color: #fff;
117
- }
118
- }
119
-
120
- .user-pdf {
121
- background-color: #fff;
122
- img {
123
- width: 100%;
124
- height: 150px;
125
- object-fit: cover;
126
- }
127
-
128
- .no-cover-photo {
129
- background: $primary;
130
- width: 100%;
131
- height: 150px;
132
- }
133
- }
134
- </style>
1
+ <template>
2
+ <el-dialog
3
+ :visible.sync="isActive"
4
+ width="80%"
5
+ custom-class="position-relative"
6
+ @close="$emit('close')"
7
+ class="test-radius"
8
+ >
9
+ <template>
10
+ <div class="row d-flex justify-content-between mx-0 user-pdf">
11
+ <img v-show="coverPhoto" :src="coverPhoto" alt="" />
12
+ <div v-show="!coverPhoto" class="no-cover-photo"></div>
13
+ <slot name="content"></slot>
14
+ </div>
15
+ <slot></slot>
16
+ <!-- <el-tooltip placement="top" :content="!showTools ? 'Exibir Ferramentas' : 'Esconder Ferramentas'">
17
+ <span class="tool tool-show--tools">
18
+ <font-awesome-icon :icon="['fas', !showTools ? 'expand-alt' : 'compress-alt']" class="h3 text-primary"
19
+ @click="showTools = !showTools"/>
20
+ </span>
21
+ </el-tooltip> -->
22
+ <span class="tool tool-close" @click="$emit('close')">
23
+ Fechar
24
+ <font-awesome-icon
25
+ :icon="['fas', 'times']"
26
+ class="text-white ml-1"
27
+ />
28
+ </span>
29
+ </template>
30
+ </el-dialog>
31
+ </template>
32
+
33
+ <script>
34
+ import { Dialog } from 'element-ui';
35
+
36
+ export default {
37
+ name: 'user-curriculum',
38
+ components: {
39
+ [Dialog.name]: Dialog
40
+ },
41
+ props: {
42
+ show: {
43
+ type: Boolean,
44
+ default: false
45
+ },
46
+ tools: {
47
+ type: Array,
48
+ default: () => []
49
+ },
50
+ cover: String
51
+ },
52
+ data() {
53
+ return {
54
+ isActive: this.show,
55
+ showTools: false,
56
+ coverPhoto: this.cover
57
+ };
58
+ },
59
+ watch: {
60
+ show(value) {
61
+ this.isActive = value;
62
+ },
63
+ cover(value) {
64
+ this.coverPhoto = value;
65
+ }
66
+ }
67
+ };
68
+ </script>
69
+
70
+ <style lang="scss" scoped>
71
+ @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
72
+
73
+ /deep/ .el-dialog__body {
74
+ padding: 0;
75
+ }
76
+
77
+ /deep/ .el-dialog__header {
78
+ display: none;
79
+ }
80
+
81
+ /deep/ .el-dialog {
82
+ overflow: hidden;
83
+ border-radius: 10px;
84
+ padding-bottom: 50px;
85
+ max-width: 1360px;
86
+ margin-top: 5vh!important;
87
+ }
88
+
89
+ .test-radius {
90
+ border-radius: 10px;
91
+ }
92
+
93
+ .tool {
94
+ position: absolute;
95
+ top: 1rem;
96
+ z-index: 10;
97
+ color: $primary;
98
+ cursor: pointer;
99
+
100
+ &-show--tools {
101
+ right: 1.5rem;
102
+ }
103
+
104
+ &-close {
105
+ position: absolute;
106
+ width: 104.93px;
107
+ height: 28px;
108
+ right: 1.5rem;
109
+ display: flex;
110
+ justify-content: center;
111
+ align-items: center;
112
+
113
+ font-weight: 600;
114
+ background: rgba(0, 0, 0, 0.2);
115
+ border-radius: 17.5px;
116
+ color: #fff;
117
+ }
118
+ }
119
+
120
+ .user-pdf {
121
+ background-color: #fff;
122
+ img {
123
+ width: 100%;
124
+ height: 150px;
125
+ object-fit: cover;
126
+ }
127
+
128
+ .no-cover-photo {
129
+ background: $primary;
130
+ width: 100%;
131
+ height: 150px;
132
+ }
133
+ }
134
+ </style>
@@ -1,72 +1,72 @@
1
- <template>
2
- <base-header class="app-header" :type="'white'">
3
- <div class="row justify-content-center">
4
- <div class="col-6 my-auto">
5
- <h2 class="font-weight-bold display-3">{{name}}</h2>
6
- <span id="credits-amount" v-if="subheader">
7
- {{ subheader }} Créditos
8
- </span>
9
- </div>
10
-
11
- <div class="col-6 d-flex justify-content-end align-items-center">
12
- <el-tooltip v-for="(item, index) in icons" :key="index"
13
- v-show="!item.disabled"
14
- class="item" effect="dark" :content="item.title" placement="top">
15
- <base-button size="md" type="link" class="text-primary px-2 w-auto"
16
- @click="$emit(item.event, item)">
17
- <font-awesome-icon :icon="item.icon" class="mr-2" />
18
- </base-button>
19
- </el-tooltip>
20
-
21
- <slot name="buttons"></slot>
22
- </div>
23
-
24
- <slot/>
25
- </div>
26
- </base-header>
27
- </template>
28
- <script>
29
- export default {
30
- data(){
31
- return{
32
- default: ''
33
- };
34
- },
35
- props:{
36
- icons:{
37
- type: Array,
38
- default: () =>[{ event: 'view', icon: ['fas', 'eye'], disabled: false, title: 'Visualizar' }, { event: 'config', icon: ['fas', 'cog'], disabled: false, title: 'Editar' } ]
39
- },
40
- name: {
41
- type: String,
42
- default: 'Teste de matematica'
43
- },
44
- subheader: {
45
- type: Number,
46
- default: null
47
- }
48
- },
49
- };
50
- </script>
51
- <style lang="scss" scoped>
52
- #credits-amount {
53
- min-width: 8em;
54
- margin: 1rem 1rem 1rem 0;
55
- padding: 0.25em 1em;
56
- font-size: 0.85rem;
57
- line-height: 1.4em;
58
- border-radius: 23rem;
59
- font-weight: 400;
60
- text-align: center;
61
- background-color: rgba(29, 161, 241, 0.1);
62
- color: #1da1f1;
63
- }
64
- </style>
65
- <style lang="scss">
66
-
67
- .app-header {
68
- width: 100%;
69
- padding-top: 1.25rem;
70
- box-shadow: 0 0 2rem 0 rgba(136, 152, 170, 0.15);
71
- }
72
- </style>
1
+ <template>
2
+ <base-header class="app-header" :type="'white'">
3
+ <div class="row justify-content-center">
4
+ <div class="col-6 my-auto">
5
+ <h2 class="font-weight-bold display-3">{{name}}</h2>
6
+ <span id="credits-amount" v-if="subheader">
7
+ {{ subheader }} Créditos
8
+ </span>
9
+ </div>
10
+
11
+ <div class="col-6 d-flex justify-content-end align-items-center">
12
+ <el-tooltip v-for="(item, index) in icons" :key="index"
13
+ v-show="!item.disabled"
14
+ class="item" effect="dark" :content="item.title" placement="top">
15
+ <base-button size="md" type="link" class="text-primary px-2 w-auto"
16
+ @click="$emit(item.event, item)">
17
+ <font-awesome-icon :icon="item.icon" class="mr-2" />
18
+ </base-button>
19
+ </el-tooltip>
20
+
21
+ <slot name="buttons"></slot>
22
+ </div>
23
+
24
+ <slot/>
25
+ </div>
26
+ </base-header>
27
+ </template>
28
+ <script>
29
+ export default {
30
+ data(){
31
+ return{
32
+ default: ''
33
+ };
34
+ },
35
+ props:{
36
+ icons:{
37
+ type: Array,
38
+ default: () =>[{ event: 'view', icon: ['fas', 'eye'], disabled: false, title: 'Visualizar' }, { event: 'config', icon: ['fas', 'cog'], disabled: false, title: 'Editar' } ]
39
+ },
40
+ name: {
41
+ type: String,
42
+ default: 'Teste de matematica'
43
+ },
44
+ subheader: {
45
+ type: Number,
46
+ default: null
47
+ }
48
+ },
49
+ };
50
+ </script>
51
+ <style lang="scss" scoped>
52
+ #credits-amount {
53
+ min-width: 8em;
54
+ margin: 1rem 1rem 1rem 0;
55
+ padding: 0.25em 1em;
56
+ font-size: 0.85rem;
57
+ line-height: 1.4em;
58
+ border-radius: 23rem;
59
+ font-weight: 400;
60
+ text-align: center;
61
+ background-color: rgba(29, 161, 241, 0.1);
62
+ color: #1da1f1;
63
+ }
64
+ </style>
65
+ <style lang="scss">
66
+
67
+ .app-header {
68
+ width: 100%;
69
+ padding-top: 1.25rem;
70
+ box-shadow: 0 0 2rem 0 rgba(136, 152, 170, 0.15);
71
+ }
72
+ </style>
@@ -1,61 +1,61 @@
1
- <template>
2
- <client-only>
3
- <text-editor
4
- ref="editor"
5
- v-model="value"
6
- :config="editorConfig"
7
- />
8
- </client-only>
9
- </template>
10
-
11
- <script>
12
- export default {
13
- name: 'html-editor',
14
- components: {
15
- 'text-editor': () => { if (process.client) { return import('@blowstack/ckeditor-nuxt') } }
16
- },
17
- props: {
18
- value: {
19
- type: String,
20
- default: ''
21
- }
22
- },
23
- mounted() {
24
- import('@ckeditor/ckeditor5-build-classic/build/translations/pt-br')
25
- },
26
- data() {
27
- return {
28
- editorConfig: {
29
- language: 'pt-br',
30
- removePlugins: [
31
- 'Title',
32
- 'FontBackgroundColor',
33
- 'FontColor',
34
- 'FontFamily',
35
- 'FontSize',
36
- 'Subscript',
37
- 'Superscript',
38
- 'BlockQuote',
39
- 'PageBreak'
40
- ]
41
- }
42
- }
43
- },
44
- watch: {
45
- value() {
46
- this.$emit("input", this.value)
47
- }
48
- }
49
- };
50
- </script>
51
-
52
- <style lang="scss">
53
- .ck-editor {
54
- margin-bottom: 20px!important;
55
- }
56
- .ck-content {
57
- min-height: 200px;
58
- max-height: 500px;
59
- overflow-y: auto;
60
- }
61
- </style>
1
+ <template>
2
+ <client-only>
3
+ <text-editor
4
+ ref="editor"
5
+ v-model="value"
6
+ :config="editorConfig"
7
+ />
8
+ </client-only>
9
+ </template>
10
+
11
+ <script>
12
+ export default {
13
+ name: 'html-editor',
14
+ components: {
15
+ 'text-editor': () => { if (process.client) { return import('@blowstack/ckeditor-nuxt') } }
16
+ },
17
+ props: {
18
+ value: {
19
+ type: String,
20
+ default: ''
21
+ }
22
+ },
23
+ mounted() {
24
+ import('@ckeditor/ckeditor5-build-classic/build/translations/pt-br')
25
+ },
26
+ data() {
27
+ return {
28
+ editorConfig: {
29
+ language: 'pt-br',
30
+ removePlugins: [
31
+ 'Title',
32
+ 'FontBackgroundColor',
33
+ 'FontColor',
34
+ 'FontFamily',
35
+ 'FontSize',
36
+ 'Subscript',
37
+ 'Superscript',
38
+ 'BlockQuote',
39
+ 'PageBreak'
40
+ ]
41
+ }
42
+ }
43
+ },
44
+ watch: {
45
+ value() {
46
+ this.$emit("input", this.value)
47
+ }
48
+ }
49
+ };
50
+ </script>
51
+
52
+ <style lang="scss">
53
+ .ck-editor {
54
+ margin-bottom: 20px!important;
55
+ }
56
+ .ck-content {
57
+ min-height: 200px;
58
+ max-height: 500px;
59
+ overflow-y: auto;
60
+ }
61
+ </style>
@@ -28,23 +28,44 @@
28
28
  em contato.
29
29
  </p>
30
30
 
31
- <form>
32
- <input
33
- type="text"
34
- v-model="name"
35
- placeholder="Nome Completo"
36
- />
37
-
38
- <input
39
- type="text"
40
- v-model="phone"
41
- placeholder="Telefone"
42
- />
43
-
44
- <button type="button" @click="sendContact()">
45
- Solicitar Contato
46
- </button>
47
- </form>
31
+ <validation-observer ref="sendTest">
32
+ <section>
33
+ <validation-provider
34
+ tag="div"
35
+ name="Nome"
36
+ rules="required"
37
+ v-slot="{ errors }"
38
+ >
39
+ <base-input
40
+ type="text"
41
+ v-model="name"
42
+ :error="errors[0]"
43
+ :valid="errors.length ? true : false"
44
+ placeholder="Nome Completo"
45
+ />
46
+ </validation-provider>
47
+
48
+ <validation-provider
49
+ tag="div"
50
+ name="Telefone"
51
+ rules="required"
52
+ v-slot="{ errors }"
53
+ >
54
+ <base-input
55
+ type="text"
56
+ v-model="phone"
57
+ id="phone"
58
+ :error="errors[0]"
59
+ :valid="errors.length ? true : false"
60
+ placeholder="Telefone"
61
+ />
62
+ </validation-provider>
63
+
64
+ <button type="button" @click="sendContact()">
65
+ Solicitar Contato
66
+ </button>
67
+ </section>
68
+ </validation-observer>
48
69
  </section>
49
70
  </div>
50
71
  </div>
@@ -79,10 +100,14 @@ export default {
79
100
  };
80
101
  },
81
102
  methods: {
82
- sendContact() {
83
- if (this.name || this.phone) {
84
- this.$emit('send-contact', this.name, this.phone);
103
+ async sendContact() {
104
+ const pass = await this.$refs.sendTest.validate();
105
+ if (!pass) {
106
+ return;
85
107
  }
108
+
109
+ this.$emit('send-contact', this.name, this.phone);
110
+ this.$emit('close');
86
111
  }
87
112
  }
88
113
  };
@@ -172,7 +197,7 @@ export default {
172
197
  color: #1d364b;
173
198
  }
174
199
 
175
- form {
200
+ section {
176
201
  input {
177
202
  margin: 0.4rem 0;
178
203
  padding: 0.75rem;