@live-change/frontend-auto-form 0.9.85 → 0.9.87

package/front/src/pages/Edit.vue

@@ -0,0 +1,76 @@
+<template>
+  <div class="w-full lg:w-8/12 md:w-11/12">
+
+<!--    <pre>{{ identifiers }}</pre>
+    <pre>{{ modelDefinition.identifiers }}</pre> -->
+    <!-- <pre>{{identifiersObject}}</pre> -->
+
+    <div class="bg-surface-0 dark:bg-surface-900 p-4 shadow-sm rounded-border">
+
+      <ModelEditor :service="serviceName" :model="modelName" :identifiers="identifiersObject" draft
+                   @saved="handleSaved" />
+
+    </div>
+  </div>
+</template>
+
+<script setup>
+
+  import ModelEditor from "../components/crud/ModelEditor.vue"
+
+  import { ref, computed, onMounted, defineProps, toRefs } from 'vue'
+
+  const props = defineProps({
+    serviceName: {
+      type: String,
+      required: true,
+    },
+    modelName: {
+      type: String,
+      required: true,
+    },
+    id: {
+      type: String,
+      required: true,
+    }
+  })
+  const { serviceName, modelName, id } = toRefs(props)
+
+  import { useApi, usePath, live } from '@live-change/vue3-ssr'
+  const api = useApi()
+  const path = usePath()
+
+  const modelDefinition = computed(() => {
+    const service = api.services[serviceName.value]
+    if(!service) return null
+    const model = service.models[modelName.value]
+    if(!model) return null
+    return model
+  })
+
+  const identifiersObject = computed(() => {
+    return {
+      [modelName.value[0].toLowerCase() + modelName.value.slice(1)]: id.value
+    }
+  })
+
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+
+  function handleSaved(result) {
+    console.log("HANDLE SAVED", result)
+    router.push({
+      name: 'auto-form:view',
+      params: {
+        serviceName: serviceName.value,
+        modelName: modelName.value,
+        id: id.value
+      }
+    })
+  }
+
+</script>
+
+<style scoped>
+
+</style>

package/front/src/pages/Models.vue

@@ -73,7 +73,7 @@
 
   function createRoute(serviceName, model) {
     return {
-      name: 'auto-form:editor',
+      name: 'auto-form:create',
       params: {
         serviceName,
         modelName: model.name

package/front/src/pages/View.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="w-full lg:w-8/12 md:w-11/12">
 
-    <ModelView :service="serviceName" :model="modelName" :identifiers="identifiersObject" />
+    <ModelView :service="serviceName" :model="modelName" :id="id" />
 
   </div>
 </template>
@@ -21,37 +21,12 @@
       type: String,
       required: true,
     },
-    identifiers: {
-      type: Array,
-      default: []
-    }
-  })
-  const { serviceName, modelName, identifiers } = toRefs(props)
-
-  import { useApi, usePath, live } from '@live-change/vue3-ssr'
-  const api = useApi()
-  const path = usePath()
-
-  const modelDefinition = computed(() => {
-    const service = api.services[serviceName.value]
-    if(!service) return null
-    const model = service.models[modelName.value]
-    if(!model) return null
-    return model
-  })
-
-  const identifiersObject = computed(() => {
-    const result = {}
-    for(const [i, identifier] of Object.entries(identifiers.value)) {
-      const identifierDefinition = modelDefinition.value.identifiers[i]
-      if(typeof identifierDefinition === 'string') {
-        result[identifierDefinition] = identifier
-      } else {
-        result[identifierDefinition.name] = identifier
-      }
+    id: {
+      type: String,
+      required: true,
     }
-    return result
   })
+  const { serviceName, modelName, id } = toRefs(props)
 
 </script>
 

package/front/src/router.js

@@ -15,13 +15,19 @@ export function autoFormRoutes(config = {}) {
     }),
 
     route({
-      name: 'auto-form:editor', path: prefix + '/editor/:serviceName/:modelName/:identifiers*', meta: { },
-      component: () => import("./pages/Editor.vue"),
+      name: 'auto-form:create', path: prefix + '/create/:serviceName/:modelName/:identifiersWithNames*', meta: { },
+      component: () => import("./pages/Create.vue"),
       props: true
     }),
 
     route({
-      name: 'auto-form:view', path: prefix + '/view/:serviceName/:modelName/:identifiers*', meta: { },
+      name: 'auto-form:edit', path: prefix + '/edit/:serviceName/:modelName/:id', meta: { },
+      component: () => import("./pages/Edit.vue"),
+      props: true
+    }),
+
+    route({
+      name: 'auto-form:view', path: prefix + '/view/:serviceName/:modelName/:id', meta: { },
       component: () => import("./pages/View.vue"),
       props: true
     }),
@@ -38,6 +44,12 @@ export function autoFormRoutes(config = {}) {
       props: true
     }),
 
+    route({
+      name: 'auto-form:actionParameters', path: prefix + '/action/:serviceName/:actionName/:parametersJson', meta: { },
+      component: () => import("./pages/Action.vue"),
+      props: true
+    }),
+
   ]
 }
 

package/index.js

@@ -47,6 +47,8 @@ export * from './front/src/router.js'
 
 import DataWithSchema from './front/src/components/schema/DataWithSchema.vue'
 export { DataWithSchema }
+import SchemaFromDefinition from './front/src/components/schema/SchemaFromDefinition.vue'
+export { SchemaFromDefinition }
 export * from './front/src/logic/schema.js'
 
 import en from "./front/locales/en.json"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-change/frontend-auto-form",
-  "version": "0.9.85",
+  "version": "0.9.87",
   "scripts": {
     "memDev": "node server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
     "localDevInit": "rm tmp.db; lcli localDev --enableSessions --initScript ./init.js",
@@ -22,16 +22,16 @@
   "type": "module",
   "dependencies": {
     "@fortawesome/fontawesome-free": "^6.7.2",
-    "@live-change/cli": "^0.9.85",
-    "@live-change/dao": "^0.9.85",
-    "@live-change/dao-vue3": "^0.9.85",
-    "@live-change/dao-websocket": "^0.9.85",
-    "@live-change/framework": "^0.9.85",
-    "@live-change/image-frontend": "^0.9.85",
-    "@live-change/image-service": "^0.9.85",
-    "@live-change/session-service": "^0.9.85",
-    "@live-change/vue3-components": "^0.9.85",
-    "@live-change/vue3-ssr": "^0.9.85",
+    "@live-change/cli": "^0.9.87",
+    "@live-change/dao": "^0.9.87",
+    "@live-change/dao-vue3": "^0.9.87",
+    "@live-change/dao-websocket": "^0.9.87",
+    "@live-change/framework": "^0.9.87",
+    "@live-change/image-frontend": "^0.9.87",
+    "@live-change/image-service": "^0.9.87",
+    "@live-change/session-service": "^0.9.87",
+    "@live-change/vue3-components": "^0.9.87",
+    "@live-change/vue3-ssr": "^0.9.87",
     "@vueuse/core": "^12.3.0",
     "codeceptjs-assert": "^0.0.5",
     "compression": "^1.7.5",
@@ -49,10 +49,10 @@
     "v-shared-element": "3.1.1",
     "vue-meta": "^3.0.0-alpha.9",
     "vue-router": "^4.5.0",
-    "vue3-scroll-border": "0.1.6"
+    "vue3-scroll-border": "0.1.7"
   },
   "devDependencies": {
-    "@live-change/codeceptjs-helper": "^0.9.85",
+    "@live-change/codeceptjs-helper": "^0.9.87",
     "codeceptjs": "^3.6.10",
     "generate-password": "1.7.1",
     "playwright": "1.49.1",
@@ -63,5 +63,5 @@
   "author": "Michał Łaszczewski <michal@laszczewski.pl>",
   "license": "ISC",
   "description": "",
-  "gitHead": "126afb0aad3ab6e03aa5742726f429c95c46783a"
+  "gitHead": "7a7694ad2801b7ffa16f347aed441ca5f81ab5fd"
 }