@hostlink/nuxt-light 0.0.52 → 0.0.54

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/dist/module.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "light",
3
3
  "configKey": "light",
4
- "version": "0.0.52"
4
+ "version": "0.0.54"
5
5
  }
@@ -15,10 +15,12 @@ const props = defineProps({
15
15
  });
16
16
 
17
17
  const tt = await q({
18
- app: ["menus", "viewAsMode", "languages"],
18
+ app: ["menus", "viewAsMode", "languages", { i18nMessages: ["name", "value"] }],
19
19
  my: ["styles", "language", f('granted_storage:granted', { right: "system.storage" }, [])],
20
20
  })
21
21
 
22
+ const allTranslate = ref(await q("allTranslate", []))
23
+
22
24
  let app = tt.app
23
25
  let my = tt.my
24
26
  let system = null
@@ -33,6 +35,15 @@ const menus = ref(app.menus)
33
35
  const i18n = useI18n();
34
36
  i18n.locale = my.language || 'en';
35
37
 
38
+ const messages = i18n.messages.value[i18n.locale];
39
+
40
+ for (const translate of allTranslate.value) {
41
+ messages[translate.name] = translate[my.language]
42
+ }
43
+
44
+ i18n.setLocaleMessage(i18n.locale, messages);
45
+
46
+
36
47
  const user = ref(await getCurrentUser());
37
48
 
38
49
  const leftDrawerOpen = ref(false)
@@ -9,7 +9,13 @@ const mapping = function(obj) {
9
9
  if (value instanceof Array) {
10
10
  q[key] = {};
11
11
  value.forEach((subField) => {
12
- q[key][subField] = true;
12
+ if (subField instanceof Object) {
13
+ Object.entries(mapping(subField)).forEach(([subKey, subValue]) => {
14
+ q[key][subKey] = subValue;
15
+ });
16
+ } else {
17
+ q[key][subField] = true;
18
+ }
13
19
  });
14
20
  } else {
15
21
  q[key] = mapping(value);
@@ -1,9 +1,12 @@
1
1
  <script setup>
2
2
  import { ref, computed, inject, reactive } from 'vue';
3
3
  import { m, q } from '../../'
4
+ import { Notify } from 'quasar';
4
5
  const app = await q("app", ["languages"])
5
6
 
6
- const splitterModel = ref(38)
7
+ const splitterModel = ref(62)
8
+
9
+ const all = ref(await q("allTranslate", []))
7
10
 
8
11
  const obj = reactive({
9
12
  name: ""
@@ -23,6 +26,71 @@ const onSave = async () => {
23
26
 
24
27
  }
25
28
  })
29
+
30
+ Notify.create({
31
+ message: "Save success",
32
+ color: "positive",
33
+ icon: "check"
34
+ })
35
+
36
+ //reload
37
+ all.value = await q("allTranslate", [])
38
+ }
39
+
40
+
41
+ const columns = [
42
+ {
43
+ label: "",
44
+ name: "_delete"
45
+ },
46
+ {
47
+ label: "Name",
48
+ name: "name",
49
+ field: "name",
50
+ align: "left",
51
+ sortable: true,
52
+ }];
53
+
54
+ for (const language of app.languages) {
55
+ columns.push({
56
+ label: language.name,
57
+ name: language.value,
58
+ align: "left",
59
+ })
60
+ }
61
+
62
+
63
+ const onUpdateTranslate = async (value, language, name) => {
64
+
65
+ if (await m("updateTranslate", {
66
+ name: name,
67
+ language: language,
68
+ value: value
69
+ })) {
70
+ Notify.create({
71
+ message: "Update success",
72
+ color: "positive",
73
+ icon: "check"
74
+ })
75
+
76
+ }
77
+ }
78
+
79
+ const onDelete = async (name) => {
80
+
81
+ if (await m("deleteTranslate", {
82
+ name: name
83
+ })) {
84
+ Notify.create({
85
+ message: "Delete success",
86
+ color: "positive",
87
+ icon: "check"
88
+ })
89
+
90
+ //reload
91
+ all.value = await q("allTranslate", [])
92
+ }
93
+
26
94
  }
27
95
  </script>
28
96
  <template>
@@ -30,13 +98,31 @@ const onSave = async () => {
30
98
  <l-card>
31
99
  <q-splitter v-model="splitterModel" style="height:680px">
32
100
  <template #before>
33
- <q-card-section>
34
- comming soon
35
- </q-card-section>
101
+ <q-table :rows="all" flat hide-bottom :rows-per-page-options="[0]" :columns="columns">
102
+ <template #body="props">
103
+ <q-tr :props="props">
104
+ <q-td key="_delete" auto-width>
105
+ <q-btn dense flat round icon="sym_o_delete" @click="onDelete(props.row.name)"></q-btn>
106
+ </q-td>
107
+ <q-td key="name">
108
+ {{ props.row.name }}
109
+ </q-td>
110
+ <q-td :key="language.value" v-for="language in app.languages" :props="props">
111
+ <div class="text-pre-wrap">{{ props.row[language.value] }}</div>
112
+ <q-popup-edit v-model="props.row[language.value]" v-slot="scope" buttons
113
+ :title="language.name"
114
+ @save="onUpdateTranslate($event, language.value, props.row.name)">
115
+ <q-input v-model="scope.value" dense autofocus @keyup.enter="scope.set" />
116
+ </q-popup-edit>
117
+ </q-td>
118
+ </q-tr>
119
+ </template>
120
+ </q-table>
121
+
36
122
  </template>
37
123
  <template #after>
38
124
  <l-form :bordered="false" @save="onSave">
39
- <l-input label="Name" required v-model="obj.name"></l-input>
125
+ <l-input label="Name" required v-model.trim="obj.name"></l-input>
40
126
  <l-input v-for="language in app.languages" :label="language.name"
41
127
  v-model="obj[language.value]"></l-input>
42
128
  </l-form>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hostlink/nuxt-light",
3
- "version": "0.0.52",
3
+ "version": "0.0.54",
4
4
  "description": "HostLink Nuxt Light Framework",
5
5
  "repository": "@hostlink/nuxt-light",
6
6
  "license": "MIT",