diff --git a/package.json b/package.json index 342566b..de16140 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "magico-pagebuilder", - "version": "0.0.23", + "version": "0.0.24", "private": true, "scripts": { "dev": "vite", @@ -18,6 +18,7 @@ "magico-section": "https://serwer.magico.pl/gitrepos/public/magico-section.git", "tinymce": "^6.0.3", "vue": "^3.3.4", + "vue-i18n": "9", "vuedraggable": "^4.1.0" }, "devDependencies": { diff --git a/src/components/MagicoPagebuilder.vue b/src/components/MagicoPagebuilder.vue index 2451acf..65f5962 100644 --- a/src/components/MagicoPagebuilder.vue +++ b/src/components/MagicoPagebuilder.vue @@ -21,7 +21,7 @@ data-bs-toggle="dropdown" aria-expanded="false" > - Szablony + {{ t('pagebuilder.template') }} @@ -107,7 +107,7 @@ class="btn btn-success mr-1" :disabled="!pageType.name" > - Zapisz do schowka + {{ t('pagebuilder.copy_template') }} @@ -138,7 +138,7 @@ @@ -155,7 +155,7 @@ optionx = false " > - Dodaj sekcję + {{ t('pagebuilder.add_section') }} @@ -170,6 +170,7 @@ import PagebuilderSection from './PagebuilderSection.vue' import DropdownSectionGrid from './DropdownSectionGrid.vue' import PagebuilderTemplateSave from './PagebuilderTemplateSave.vue' import PagebuilderTemplateLoad from './PagebuilderTemplateLoad.vue' +import { useI18n } from 'vue-i18n' export default { name: 'MagicoPagebuilder', @@ -190,17 +191,21 @@ export default { drag: false, optionx: '', comps: [], - pasteAvailable:false, + pasteAvailable: false, modalAddSection: false, modalCopy: false, pageType: { id: false }, modalSave: false, modalLoad: false, descriptionAllegro: false, - ownUpdate:false, + ownUpdate: false } }, props: ['name', 'modelValue', 'showcopy', 'lang'], + setup() { + const { t } = useI18n() + return { t } + }, mounted: function () { if (localStorage.getItem('description_clipboard')) { this.descriptionAllegro = true @@ -234,9 +239,9 @@ export default { console.log('nq', newQuestion) }, modelValue: function () { - if(this.ownUpdate){ - this.ownUpdate=false; - return; + if (this.ownUpdate) { + this.ownUpdate = false + return } try { this.comps = JSON.parse(this.modelValue) @@ -254,7 +259,7 @@ export default { }, methods: { onChange: function () { - this.ownUpdate=true; + this.ownUpdate = true this.$emit('update:modelValue', JSON.stringify(this.comps)) this.$emit('change') }, @@ -266,17 +271,17 @@ export default { this.comps.splice(this.comps.indexOf(item), 1) this.onChange() }, - pasteClipboard:function(){ - const item =localStorage.getItem('pagebuilder_clipboard'); - if(!item) return; - try{ + pasteClipboard: function () { + const item = localStorage.getItem('pagebuilder_clipboard') + if (!item) return + try { this.comps = JSON.parse(item) - }catch(e){ + } catch (e) { alert('Bład wklejenia') } }, - copyClipboard:function(){ - localStorage.setItem('pagebuilder_clipboard', JSON.stringify(this.comps)); + copyClipboard: function () { + localStorage.setItem('pagebuilder_clipboard', JSON.stringify(this.comps)) }, addSection: function (it) { this.modalAddSection = false diff --git a/src/components/PagebuilderSection.vue b/src/components/PagebuilderSection.vue index 13b015c..d22fd47 100644 --- a/src/components/PagebuilderSection.vue +++ b/src/components/PagebuilderSection.vue @@ -7,9 +7,9 @@ class="col-sm-12" v-for="(column, index) in value.columns" :value="column" - :key="keyIndex+'s' + index" - :id="keyIndex+'s' + index" - :keyIndex="keyIndex+'s' + index" + :key="keyIndex + 's' + index" + :id="keyIndex + 's' + index" + :keyIndex="keyIndex + 's' + index" @change="onChange" > @@ -40,31 +40,35 @@ class="box-settings-icon box-delete text-danger" >delete - +
- -
-
- -
-
- -
+ +
+
+ +
+
+
+
@@ -96,19 +100,22 @@
- +
\ No newline at end of file + diff --git a/src/components/plugin/SectionTextarea.vue b/src/components/plugin/SectionTextarea.vue index 3218364..ee73d73 100644 --- a/src/components/plugin/SectionTextarea.vue +++ b/src/components/plugin/SectionTextarea.vue @@ -2,7 +2,7 @@
open_with{{ langs.label }} + >{{ t('pagebuilder.widget_textarea') }}
@@ -13,7 +13,7 @@ no-enforce-focus class_other="modal-xl" v-model="modalBox" - :title="langs.label" + :title="t('pagebuilder.widget_textarea')" v-on:hide="onCloseModal" >
@@ -24,14 +24,14 @@ rows="12" class="form-control" v-model="text" - :init="vtinymce" + :init="{ ...vtinymce, language: locale }" />
@@ -48,6 +48,7 @@ import tinymceConfig from '../tinymce/config.js' import Editor from '@tinymce/tinymce-vue' import { nextTick } from 'vue' +import { useI18n } from 'vue-i18n' export default { emits: ['update:modelValue'], components: { @@ -58,6 +59,10 @@ export default { props: { modelValue: Object }, + setup() { + const { t, locale } = useI18n() + return { t, locale } + }, mounted: function () { let vm = this this.name = this.modelValue && this.modelValue.name ? this.modelValue.name : this.name diff --git a/src/locale/en.js b/src/locale/en.js new file mode 100644 index 0000000..8c29ffe --- /dev/null +++ b/src/locale/en.js @@ -0,0 +1,19 @@ +export default { + widget_textarea: 'Text area', + close: 'Close', + save: 'Save', + align: 'Alignment', + type: 'Type', + content: 'Content', + widget_text: 'Content', + add_section: 'Add section', + template: 'Templates', + import_template: 'Load template', + save_template: 'Save template', + copy_template: 'Save to clipboard', + paste_template: 'Paste from clipboard', + section_type: 'Section type', + container: 'Container', + full_width: '100% width', + section_settings: 'Section settings' +} diff --git a/src/locale/i18n.js b/src/locale/i18n.js new file mode 100644 index 0000000..101fbda --- /dev/null +++ b/src/locale/i18n.js @@ -0,0 +1,16 @@ +import { createI18n } from 'vue-i18n' + +import pl from './pl' +import en from './en' +const messages = { + pl: { pagebuilder: pl }, + en: { pagebuilder: en } +} +const i18n = createI18n({ + locale: 'en', // Domyślny język + fallbackLocale: 'pl', // Język używany, gdy brakuje tłumaczenia w wybranym języku + messages, + legacy: false +}) + +export default i18n diff --git a/src/locale/pl.js b/src/locale/pl.js new file mode 100644 index 0000000..3389ace --- /dev/null +++ b/src/locale/pl.js @@ -0,0 +1,19 @@ +export default { + widget_textarea: 'Pole tekstowe', + close: 'Zamknij', + save: 'Zapisz', + align: 'Wyrównanie', + type: 'Typ', + content: 'Treść', + widget_text: 'Treść', + add_section: 'Dodaj sekcję', + template: 'Szablony', + import_template: 'Wczytaj szablon', + save_template: 'Zapisz szablon', + copy_template: 'Zapisz do schowka', + paste_template: 'Wklej ze schowka', + section_type: 'Typ sekcji', + container: 'Kontener', + full_width: '100% szerokości', + section_settings: 'Ustawienia sekcji' +} diff --git a/src/main.js b/src/main.js index 884b467..6f8e00d 100644 --- a/src/main.js +++ b/src/main.js @@ -5,8 +5,6 @@ import App from './App.vue' import axios from 'axios' import 'bootstrap/dist/css/bootstrap.min.css' import MagicoPagebuilder from './components/MagicoPagebuilderPlugin.js' +import i18n from './locale/i18n' -const app = createApp(App).use(MagicoPagebuilder).mount('#app') - - - +const app = createApp(App).use(i18n).use(MagicoPagebuilder).mount('#app') diff --git a/yarn.lock b/yarn.lock index 2109059..9355071 100644 --- a/yarn.lock +++ b/yarn.lock @@ -173,6 +173,27 @@ resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-2.0.2.tgz#d9fae00a2d5cb40f92cfe64b47ad749fbc38f917" integrity sha512-6EwiSjwWYP7pTckG6I5eyFANjPhmPjUX9JRLUSfNPC7FX7zK9gyZAfUEaECL6ALTpGX5AjnBq3C9XmVWPitNpw== +"@intlify/core-base@9.14.2": + version "9.14.2" + resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.14.2.tgz#2c074506ea72425e937f911c95c0d845b43f7fdf" + integrity sha512-DZyQ4Hk22sC81MP4qiCDuU+LdaYW91A6lCjq8AWPvY3+mGMzhGDfOCzvyR6YBQxtlPjFqMoFk9ylnNYRAQwXtQ== + dependencies: + "@intlify/message-compiler" "9.14.2" + "@intlify/shared" "9.14.2" + +"@intlify/message-compiler@9.14.2": + version "9.14.2" + resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.14.2.tgz#7217842ea1875d80bbf0f708e9b3ef5ad7c57a03" + integrity sha512-YsKKuV4Qv4wrLNsvgWbTf0E40uRv+Qiw1BeLQ0LAxifQuhiMe+hfTIzOMdWj/ZpnTDj4RSZtkXjJM7JDiiB5LQ== + dependencies: + "@intlify/shared" "9.14.2" + source-map-js "^1.0.2" + +"@intlify/shared@9.14.2": + version "9.14.2" + resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.14.2.tgz#f7dceea32db44c9253e3f965745a42a5cb3a1883" + integrity sha512-uRAHAxYPeF+G5DBIboKpPgC/Waecd4Jz8ihtkpJQD5ycb5PwXp0k/+hBGl5dAjwF7w+l74kz/PKA8r8OK//RUw== + "@jridgewell/sourcemap-codec@^1.4.15": version "1.4.15" resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz#d7c6e6755c78567a951e04ab52ef0fd26de59f32" @@ -273,6 +294,11 @@ "@vue/compiler-dom" "3.4.9" "@vue/shared" "3.4.9" +"@vue/devtools-api@^6.5.0": + version "6.6.4" + resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz#cbe97fe0162b365edc1dba80e173f90492535343" + integrity sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g== + "@vue/eslint-config-prettier@^8.0.0": version "8.0.0" resolved "https://registry.yarnpkg.com/@vue/eslint-config-prettier/-/eslint-config-prettier-8.0.0.tgz#de5cb77ed483b43683d17a788808a0fa4e7bd07e" @@ -384,6 +410,11 @@ bootstrap-icons@^1.10.5: resolved "https://registry.yarnpkg.com/bootstrap-icons/-/bootstrap-icons-1.11.3.tgz#03f9cb754ec005c52f9ee616e2e84a82cab3084b" integrity sha512-+3lpHrCw/it2/7lBL15VR0HEumaBss0+f/Lb6ZvHISn1mlK83jjFpooTLsMWbIjJMDjDjOExMsTxnXSIT4k4ww== +bootstrap@5.2: + version "5.2.3" + resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-5.2.3.tgz#54739f4414de121b9785c5da3c87b37ff008322b" + integrity sha512-cEKPM+fwb3cT8NzQZYEu4HilJ3anCrWqh3CHAok1p9jXqMPsPTBhU25fBckEJHJ/p+tTxTFTsFQGM+gaHpi3QQ== + bootstrap@^5.3.1: version "5.3.2" resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-5.3.2.tgz#97226583f27aae93b2b28ab23f4c114757ff16ae" @@ -1196,6 +1227,15 @@ vue-eslint-parser@^9.4.0: lodash "^4.17.21" semver "^7.3.6" +vue-i18n@9: + version "9.14.2" + resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.14.2.tgz#e7f657664fcb3ccf99ecea684fc56e0f8e5335ce" + integrity sha512-JK9Pm80OqssGJU2Y6F7DcM8RFHqVG4WkuCqOZTVsXkEzZME7ABejAUqUdA931zEBedc4thBgSUWxeQh4uocJAQ== + dependencies: + "@intlify/core-base" "9.14.2" + "@intlify/shared" "9.14.2" + "@vue/devtools-api" "^6.5.0" + vue@^3.3.4: version "3.4.9" resolved "https://registry.yarnpkg.com/vue/-/vue-3.4.9.tgz#54f3c7838fda2d8bd053d54ed214ec833aacd434"