@burh/nuxt-core 1.0.159 → 1.0.161

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.
Files changed (4) hide show
  1. package/components/burh-ds/Dropdown/UserMenuDropdown.vue +52 -53
  2. package/components/burh-ds/Inputs/HtmlEditor.vue +42 -114
  3. package/components/layouts/burh-ds/navbar/AppNavbar.vue +67 -57
  4. package/package.json +3 -1
package/components/burh-ds/Dropdown/UserMenuDropdown.vue CHANGED
@@ -1,29 +1,27 @@
1
1
  <template>
2
- <base-dropdown menu-on-right
3
- class="nav-item"
4
- tag="li"
5
- title-tag="a"
6
- >
7
- <business-avatar
8
- :logo="userAvatar"
9
- :userName="userName"
10
- :companyName="companyName"
11
- class="nav-link pr-0 pt-2 pb-2"
12
- :class="textColor"
13
- @click.prevent
14
- slot="title-container"
15
- />
16
- <h6 class="dropdown-header">Entrar como</h6>
17
- <slot name="companies"></slot>
18
- <dropdown-section
19
- v-for="(value, name) in text"
20
- :key="name"
21
- :title="name"
22
- :items="value"
23
- />
24
- <hr class="dropdown-divider">
25
- <sign-out-item @logout="$emit('logout')" />
26
- </base-dropdown>
2
+ <base-dropdown menu-on-right class="nav-item" tag="li" title-tag="a">
3
+ <business-avatar
4
+ :logo="userAvatar"
5
+ :userName="userName"
6
+ :companyName="companyName"
7
+ class="nav-link pr-0 pt-2 pb-2"
8
+ :class="textColor"
9
+ @click.prevent
10
+ slot="title-container"
11
+ />
12
+ <h6 class="dropdown-header">
13
+ {{ isSindipecas ? 'Opções' : 'Entrar como' }}
14
+ </h6>
15
+ <slot name="companies"></slot>
16
+ <dropdown-section
17
+ v-for="(value, name) in text"
18
+ :key="name"
19
+ :title="name"
20
+ :items="value"
21
+ />
22
+ <hr class="dropdown-divider" />
23
+ <sign-out-item @logout="$emit('logout')" />
24
+ </base-dropdown>
27
25
  </template>
28
26
  <script>
29
27
  import DropdownSection from './DropdownSection';
@@ -32,33 +30,34 @@ import AvatarLink from '../Avatar/AvatarLink';
32
30
  import BusinessAvatar from '../Avatar/BusinessAvatar';
33
31
 
34
32
  export default {
35
- name: 'user-menu-dropdown',
36
- components: {
37
- DropdownSection,
38
- SignOutItem,
39
- AvatarLink,
40
- BusinessAvatar
41
- },
42
- props: {
43
- text: Object,
44
- userAvatar: String,
45
- userName: String,
46
- companyLogo: String,
47
- companyName: String,
48
- textColor: String,
49
- companies: Array
50
- },
51
- methods: {
52
- handleCompanyClick(company) {
53
-
54
- }
55
- },
56
- data() {
57
- return {
58
- console : console
59
- };
60
- }
33
+ name: 'user-menu-dropdown',
34
+ components: {
35
+ DropdownSection,
36
+ SignOutItem,
37
+ AvatarLink,
38
+ BusinessAvatar
39
+ },
40
+ props: {
41
+ text: Object,
42
+ userAvatar: String,
43
+ userName: String,
44
+ companyLogo: String,
45
+ companyName: String,
46
+ textColor: String,
47
+ companies: Array,
48
+ isSindipecas: {
49
+ type: Boolean,
50
+ default: false
51
+ }
52
+ },
53
+ methods: {
54
+ handleCompanyClick(company) {}
55
+ },
56
+ data() {
57
+ return {
58
+ console: console
59
+ };
60
+ }
61
61
  };
62
62
  </script>
63
- <style lang="scss" scoped>
64
- </style>
63
+ <style lang="scss" scoped></style>
package/components/burh-ds/Inputs/HtmlEditor.vue CHANGED
@@ -1,133 +1,61 @@
1
1
  <template>
2
- <div class="quill">
3
- <div :id="toolbarId"></div>
4
- <div :id="editorId" :name="name" class ref="editor"></div>
5
- </div>
2
+ <client-only>
3
+ <text-editor
4
+ ref="editor"
5
+ v-model="value"
6
+ :config="editorConfig"
7
+ />
8
+ </client-only>
6
9
  </template>
10
+
7
11
  <script>
8
- import 'quill/dist/quill.core.css'
9
- import 'quill/dist/quill.snow.css'
10
- import 'quill/dist/quill.bubble.css'
11
12
  export default {
12
- name: "html-editor",
13
+ name: 'html-editor',
14
+ components: {
15
+ 'text-editor': () => { if (process.client) { return import('@blowstack/ckeditor-nuxt') } }
16
+ },
13
17
  props: {
14
18
  value: {
15
19
  type: String,
16
- default: "",
17
- },
18
- name: String,
19
- configTools: {
20
- type: Array,
21
- default: () => null
20
+ default: ''
22
21
  }
23
22
  },
23
+ mounted() {
24
+ import('@ckeditor/ckeditor5-build-classic/build/translations/pt-br')
25
+ },
24
26
  data() {
25
27
  return {
26
- editor: null,
27
- content: null,
28
- lastHtmlValue: "",
29
- editorId: null,
30
- toolbarId: null,
31
- };
32
- },
33
- methods: {
34
- initialize(Quill) {
35
- this.editor = new Quill(`#${this.editorId}`, {
36
- theme: "snow",
37
- modules: {
38
- toolbar: this.configTools || [
39
- //[{ 'font': [] }],
40
- //[{ 'color': [] }, { 'background': [] }],
41
-
42
- [{ 'size': ['small', false, 'large', 'huge'] }], // custom dropdown
43
- //[{ 'header': [1, 2, 3, 4, 5, 6, false] }],
44
-
45
- //[{ 'align': '' }, {'align': 'center'}, {'align': 'justify'}, {'align': 'right'}],
46
-
47
- ['bold', 'italic', 'underline', 'strike'], // toggled buttons
48
-
49
- [ 'link', 'image' ], // add's image support
50
-
51
- //['blockquote', 'code-block'],
52
-
53
- [{ 'list': 'ordered'}, { 'list': 'bullet' }],
54
- //[{ 'script': 'sub'}, { 'script': 'super' }], // superscript/subscript
55
- [{ 'indent': '-1'}, { 'indent': '+1' }], // outdent/indent
56
- //[{ 'direction': 'rtl' }], // text direction
57
-
58
- ['clean']
59
- ]
60
- },
61
- });
62
-
63
- if (this.value) {
64
- if (this.value.length > 0) {
65
- this.editor.pasteHTML(this.value);
66
- }
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
+ ]
67
41
  }
68
-
69
- let editorRef = this.$refs.editor;
70
- let node = editorRef.children[0];
71
- this.editor.on("text-change", () => {
72
- let html = node.innerHTML;
73
- if (html === "<p><br></p>") {
74
- html = "";
75
- }
76
- this.content = html;
77
- this.$emit("input", this.content);
78
- });
79
- },
80
- pasteHTML() {
81
- if (!this.editor) {
82
- return;
83
- }
84
- this.editor.pasteHTML(this.value);
85
- },
86
- randomString() {
87
- let text = "";
88
- let possible =
89
- "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
90
-
91
- for (let i = 0; i < 5; i++)
92
- text += possible.charAt(
93
- Math.floor(Math.random() * possible.length)
94
- );
95
-
96
- return text;
97
- },
98
- },
99
- async mounted() {
100
- let Quill = await import("quill");
101
- Quill = Quill.default || Quill;
102
- this.editorId = this.randomString();
103
- this.toolbarId = this.randomString();
104
- this.$nextTick(() => {
105
- this.initialize(Quill);
106
- });
42
+ }
107
43
  },
108
44
  watch: {
109
- value(newVal) {
110
- if (newVal !== this.content) {
111
- this.pasteHTML(newVal);
112
- }
113
- },
114
- },
45
+ value() {
46
+ this.$emit("input", this.value)
47
+ }
48
+ }
115
49
  };
116
50
  </script>
51
+
117
52
  <style lang="scss">
118
- .ql-clipboard {
119
- display: none;
120
- }
121
- .ql-editor {
122
- strong {
123
- font-weight: bold;
53
+ .ck-editor {
54
+ margin-bottom: 20px!important;
55
+ }
56
+ .ck-content {
57
+ min-height: 200px;
58
+ max-height: 500px;
59
+ overflow-y: auto;
124
60
  }
125
- margin-bottom: 1.5rem;
126
- resize: vertical;
127
- overflow-y: scroll;
128
- font-family: Poppins, Open Sans, sans-serif;
129
- }
130
- .ql-container.ql-snow {
131
- border: 0;
132
- }
133
61
  </style>
package/components/layouts/burh-ds/navbar/AppNavbar.vue CHANGED
@@ -1,24 +1,35 @@
1
1
  <template>
2
- <base-nav
3
- container-classes="container-fluid container-fluid--bu"
4
- class="border-bottom navbar-animated navbar-horizontal"
5
- expand="lg"
6
- type="white"
7
- >
8
- <div style="display: flex; " slot="brand">
9
- <avatar-link
10
- :logo="brand"
11
- :name="brandName"
12
- class="row pl-4 nav-link cursor-pointer"
13
- @avatar-click="redirectIndex"
14
- />
15
- <slot name="brand-center" />
16
- </div>
2
+ <base-nav
3
+ container-classes="container-fluid container-fluid--bu"
4
+ class="border-bottom navbar-animated navbar-horizontal"
5
+ expand="lg"
6
+ type="white"
7
+ >
8
+ <div style="display: flex; " slot="brand">
9
+ <avatar-link
10
+ :logo="brand"
11
+ :name="brandName"
12
+ class="row pl-4 nav-link cursor-pointer"
13
+ @avatar-click="redirectIndex"
14
+ />
15
+ <slot name="brand-center" />
16
+ </div>
17
17
 
18
- <a v-if="currentUser && !disabledLinks" :href="urlBackToBusiness" class="btn btn-link">
19
- Voltar para o Burh
20
- </a>
21
- </base-nav>
18
+ <a
19
+ v-if="currentUser && !disabledLinks"
20
+ :href="urlBackToBusiness"
21
+ class="btn btn-link"
22
+ >
23
+ Voltar para o Burh
24
+ </a>
25
+ <user-menu-dropdown
26
+ v-else
27
+ :companyName="'Sindipeças'"
28
+ :userName="brandName"
29
+ :isSindipecas="true"
30
+ @logout="$emit('logout')"
31
+ />
32
+ </base-nav>
22
33
  </template>
23
34
  <script>
24
35
  import BaseNav from '@burh/nuxt-core/components/burh-ds/Navbar/BaseNav.vue';
@@ -27,45 +38,44 @@ import AppLinkArea from '@burh/nuxt-core/components/burh-ds/Dropdown/AppLinkArea
27
38
  import AvatarLink from '@burh/nuxt-core/components/burh-ds/Avatar/AvatarLink.vue';
28
39
 
29
40
  export default {
30
- components: {
31
- BaseNav,
32
- UserMenuDropdown,
33
- AppLinkArea,
34
- AvatarLink,
35
- },
36
- props: {
37
- currentUser: Object,
38
- currentCompany: Object,
39
- userMenuText: Object,
40
- brand: String,
41
- brandName: String,
42
- showableProducts: Object,
43
- activeProducts: Array,
44
- gridApps: Array,
45
- disabledLinks: Boolean
46
- },
47
- data() {
48
- return {
49
- console: console,
50
- indexRoute: String,
41
+ components: {
42
+ BaseNav,
43
+ UserMenuDropdown,
44
+ AppLinkArea,
45
+ AvatarLink
46
+ },
47
+ props: {
48
+ currentUser: Object,
49
+ currentCompany: Object,
50
+ userMenuText: Object,
51
+ brand: String,
52
+ brandName: String,
53
+ showableProducts: Object,
54
+ activeProducts: Array,
55
+ gridApps: Array,
56
+ disabledLinks: Boolean
57
+ },
58
+ data() {
59
+ return {
60
+ console: console,
61
+ indexRoute: String,
51
62
  urlBackToBusiness: process.env.oldBusinessUrl
52
- };
53
- },
54
- methods: {
55
- handleAvatarClick(company) {
56
- this.$emit('company-click', company);
57
- },
58
- redirectIndex() {
59
- if (!this.disabledLinks)
60
- this.$router.push(this.indexRoute);
61
- },
62
- getCurrentApp(){
63
- this.indexRoute = `/${this.$route.path.split('/')[1]}`
64
- },
65
- },
66
- mounted(){
67
- this.getCurrentApp();
68
- }
63
+ };
64
+ },
65
+ methods: {
66
+ handleAvatarClick(company) {
67
+ this.$emit('company-click', company);
68
+ },
69
+ redirectIndex() {
70
+ if (!this.disabledLinks) this.$router.push(this.indexRoute);
71
+ },
72
+ getCurrentApp() {
73
+ this.indexRoute = `/${this.$route.path.split('/')[1]}`;
74
+ }
75
+ },
76
+ mounted() {
77
+ this.getCurrentApp();
78
+ }
69
79
  };
70
80
  </script>
71
81
  <style lang="scss">
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@burh/nuxt-core",
3
- "version": "1.0.159",
3
+ "version": "1.0.161",
4
4
  "description": "Design System and Components.",
5
5
  "author": "Burh",
6
6
  "scripts": {
@@ -14,7 +14,9 @@
14
14
  },
15
15
  "dependencies": {
16
16
  "@babel/core": "^7.4.5",
17
+ "@blowstack/ckeditor-nuxt": "^0.6.0",
17
18
  "@chenfengyuan/vue-qrcode": "^1.0.1",
19
+ "@ckeditor/ckeditor5-build-classic": "^27.0.0",
18
20
  "@fortawesome/fontawesome-svg-core": "^1.2.22",
19
21
  "@fortawesome/free-brands-svg-icons": "^5.10.2",
20
22
  "@fortawesome/free-regular-svg-icons": "^5.10.2",