@hostlink/nuxt-light 0.0.51 → 0.0.53

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "light",
   "configKey": "light",
-  "version": "0.0.51"
+  "version": "0.0.53"
 }

package/dist/runtime/components/l-app-main.vue

@@ -19,6 +19,8 @@ const tt = await q({
     my: ["styles", "language", f('granted_storage:granted', { right: "system.storage" }, [])],
 })
 
+const allTranslate = ref(await q("allTranslate", []))
+
 let app = tt.app
 let my = tt.my
 let system = null
@@ -33,6 +35,15 @@ const menus = ref(app.menus)
 const i18n = useI18n();
 i18n.locale = my.language || 'en';
 
+const messages = i18n.messages.value[i18n.locale];
+
+for (const translate of allTranslate.value) {
+    messages[translate.name] = translate[my.language]
+}
+
+i18n.setLocaleMessage(i18n.locale, messages);
+
+
 const user = ref(await getCurrentUser());
 
 const leftDrawerOpen = ref(false)

package/dist/runtime/index.d.ts

@@ -7,4 +7,4 @@ interface Light {
     getVersion(): string;
 }
 export declare function useLight(): Light;
-export { notify, addObject, f, getApiUrl, getCurrentUser, getObject, id, list, listData, login, m, mutation, q, removeObject, t, updateObject, getID, deleteObject, listObject } from "./lib";
+export { notify, addObject, f, getApiUrl, getCurrentUser, getObject, id, list, listData, login, m, mutation, q, removeObject, t, updateObject, getID, deleteObject, listObject, getApiBase } from "./lib";

package/dist/runtime/index.mjs

@@ -48,5 +48,6 @@ export {
   updateObject,
   getID,
   deleteObject,
-  listObject
+  listObject,
+  getApiBase
 } from "./lib/index.mjs";

package/dist/runtime/lib/getApiUrl.mjs

@@ -1,4 +1,5 @@
+import { getApiBase } from "./index.mjs";
 export default function getApiUrl(url, params) {
   const urlParams = new URLSearchParams(params).toString();
-  return `/api/${url}?${urlParams}`;
+  return getApiBase() + `${url}?${urlParams}`;
 }

package/dist/runtime/lib/index.d.ts

@@ -18,4 +18,5 @@ import listObject from "./listObject";
 import isGranted from "./isGranted";
 declare const notify: (message: string, color?: string) => void;
 import getID from "./getID";
-export { addObject, f, getApiUrl, getCurrentUser, getObject, id, list, listData, login, m, mutation, q, removeObject, t, updateObject, notify, getID, deleteObject, listObject, isGranted };
+declare const getApiBase: () => {};
+export { addObject, f, getApiUrl, getCurrentUser, getObject, id, list, listData, login, m, mutation, q, removeObject, t, updateObject, notify, getID, deleteObject, listObject, isGranted, getApiBase };

package/dist/runtime/lib/index.mjs

@@ -1,3 +1,4 @@
+import { useRuntimeConfig } from "nuxt/app";
 import { Notify } from "quasar";
 import addObject from "./addObject.mjs";
 import f from "./f.mjs";
@@ -25,6 +26,10 @@ const notify = function(message, color = "green") {
   });
 };
 import getID from "./getID.mjs";
+const getApiBase = () => {
+  const config = useRuntimeConfig();
+  return config?.public?.apiBase ?? "/api/";
+};
 export {
   addObject,
   f,
@@ -45,5 +50,6 @@ export {
   getID,
   deleteObject,
   listObject,
-  isGranted
+  isGranted,
+  getApiBase
 };

package/dist/runtime/lib/m.mjs

@@ -1,6 +1,9 @@
 import axios from "axios";
 import { jsonToGraphQLQuery } from "json-to-graphql-query";
+import { useRuntimeConfig } from "nuxt/app";
+import { getApiBase } from "./index.mjs";
 export default async function(operation, args, fields = []) {
+  const config = useRuntimeConfig();
   const mutation = {
     mutation: {}
   };
@@ -42,9 +45,9 @@ export default async function(operation, args, fields = []) {
     for (let i = 0; i < map_values.length; i++) {
       fd.append(i.toString(), map_values[i]);
     }
-    data = (await service.post("/api/", fd)).data;
+    data = (await service.post(getApiBase(), fd)).data;
   } else {
-    data = (await service.post("/api/", {
+    data = (await service.post(getApiBase(), {
       query: graphql_query
     })).data;
   }

package/dist/runtime/lib/q.mjs

@@ -1,6 +1,8 @@
 import axios from "axios";
 import f from "./f.mjs";
 import { jsonToGraphQLQuery } from "json-to-graphql-query";
+import { useRuntimeConfig } from "nuxt/app";
+import { getApiBase } from "./index.mjs";
 const mapping = function(obj) {
   let q = {};
   Object.entries(obj).forEach(([key, value]) => {
@@ -16,6 +18,7 @@ const mapping = function(obj) {
   return q;
 };
 export default async function(operation, args, fields = []) {
+  const config = useRuntimeConfig();
   const service = axios.create({
     withCredentials: true
   });
@@ -29,7 +32,7 @@ export default async function(operation, args, fields = []) {
     }
     query = f(operation, args, fields);
   }
-  const resp = (await service.post("/api/", {
+  const resp = (await service.post(getApiBase(), {
     query: `{ ${query} }`
   })).data;
   if (resp.errors) {

package/dist/runtime/pages/Translate/index.vue

@@ -1,9 +1,12 @@
 <script setup>
 import { ref, computed, inject, reactive } from 'vue';
 import { m, q } from '../../'
+import { Notify } from 'quasar';
 const app = await q("app", ["languages"])
 
-const splitterModel = ref(38)
+const splitterModel = ref(62)
+
+const all = ref(await q("allTranslate", []))
 
 const obj = reactive({
     name: ""
@@ -23,6 +26,63 @@ const onSave = async () => {
 
         }
     })
+    //reload
+    all.value = await q("allTranslate", [])
+}
+
+
+const columns = [
+    {
+        label: "",
+        name: "_delete"
+    },
+    {
+        label: "Name",
+        name: "name",
+        field: "name",
+        align: "left"
+    }];
+
+for (const language of app.languages) {
+    columns.push({
+        label: language.name,
+        name: language.value,
+        align: "left",
+    })
+}
+
+
+const onUpdateTranslate = async (value, language, name) => {
+
+    if (await m("updateTranslate", {
+        name: name,
+        language: language,
+        value: value
+    })) {
+        Notify.create({
+            message: "Update success",
+            color: "positive",
+            icon: "check"
+        })
+
+    }
+}
+
+const onDelete = async (name) => {
+
+    if (await m("deleteTranslate", {
+        name: name
+    })) {
+        Notify.create({
+            message: "Delete success",
+            color: "positive",
+            icon: "check"
+        })
+
+        //reload
+        all.value = await q("allTranslate", [])
+    }
+
 }
 </script>
 <template>
@@ -30,13 +90,31 @@ const onSave = async () => {
         <l-card>
             <q-splitter v-model="splitterModel" style="height:680px">
                 <template #before>
-                    <q-card-section>
-                        comming soon
-                    </q-card-section>
+                    <q-table :rows="all" flat hide-bottom :rows-per-page-options="[0]" :columns="columns">
+                        <template #body="props">
+                            <q-tr :props="props">
+                                <q-td key="_delete" auto-width>
+                                    <q-btn dense flat round icon="sym_o_delete" @click="onDelete(props.row.name)"></q-btn>
+                                </q-td>
+                                <q-td key="name">
+                                    {{ props.row.name }}
+                                </q-td>
+                                <q-td :key="language.value" v-for="language in app.languages" :props="props">
+                                    <div class="text-pre-wrap">{{ props.row[language.value] }}</div>
+                                    <q-popup-edit v-model="props.row[language.value]" v-slot="scope" buttons
+                                        :title="language.name"
+                                        @save="onUpdateTranslate($event, language.value, props.row.name)">
+                                        <q-input v-model="scope.value" dense autofocus @keyup.enter="scope.set" />
+                                    </q-popup-edit>
+                                </q-td>
+                            </q-tr>
+                        </template>
+                    </q-table>
+
                 </template>
                 <template #after>
                     <l-form :bordered="false" @save="onSave">
-                        <l-input label="Name" required v-model="obj.name"></l-input>
+                        <l-input label="Name" required v-model.trim="obj.name"></l-input>
                         <l-input v-for="language in app.languages" :label="language.name"
                             v-model="obj[language.value]"></l-input>
                     </l-form>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hostlink/nuxt-light",
-  "version": "0.0.51",
+  "version": "0.0.53",
   "description": "HostLink Nuxt Light Framework",
   "repository": "@hostlink/nuxt-light",
   "license": "MIT",