@simitgroup/simpleapp-generator 1.6.6-z-alpha → 1.6.7-a-alpha

package/templates/nuxt/plugins/19.simpleapp-mini-app-store.ts.eta

@@ -0,0 +1,379 @@
+/**
+ * This file was automatically generated by simpleapp generator. Every
+ * MODIFICATION OVERRIDE BY GENERATEOR
+ * last change 2025-06-09
+ */
+
+import _ from "lodash";
+import {
+  Miniapp,
+  MiniAppDetail,
+  MiniAppDetailActionAccess,
+  MiniappIntegrationPages,
+  MINIAPPMANAGERApi,
+} from "~/simpleapp/generate/openapi";
+import {
+  MiniAppFormWithMiniAppCode,
+  MiniAppFrameworkCompatibility,
+} from "~/simpleapp/generate/features/miniApp/app/types/miniApp";
+
+export default defineNuxtPlugin(async () => {
+  /**
+   * Mini app directory
+   */
+  const MINI_APP_PAGE_PATH_PREFIX = "miniapp";
+
+  /**
+   * To totally block mini app. if mini app's framework compability lower than this.
+   * To support backward compatibility, with deprecation notice,
+   * if mini app's framework compability higher than this, but lower than MIN_FRAMEWORK_COMPATIBLE_VERSION.
+   */
+  const MIN_FRAMEWORK_VERSION = "1.0";
+
+  /**
+   * The minimum version that is compatible with the current framework.
+   */
+  const MIN_FRAMEWORK_COMPATIBLE_VERSION = "1.0";
+
+  const config = getAxiosConfig();
+
+  const miniAppManager = new MINIAPPMANAGERApi(config);
+
+  const MINI_APP_BUILT_IN_SETTING_NAME = "mini-app-setting";
+
+  const useMiniAppStore = defineStore("mini-app", {
+    state: () => ({
+      actionAccess: {} as MiniAppDetailActionAccess,
+
+      /**
+       * Store all installed miniApps
+       */
+      installedMiniApps: [] as MiniAppDetail[],
+
+      /**
+       * Is fetching installed miniApps
+       */
+      isFetchingInstalledMiniApps: true,
+    }),
+    getters: {
+      getForm: (state) => (formCode: string) => {
+        return state.installedMiniApps.flatMap((miniApp) => {
+          return miniApp.integration.forms
+            .filter((form) => form.code == formCode)
+            .map((form) => {
+              return {
+                ...form,
+                miniAppCode: miniApp.code,
+              } as MiniAppFormWithMiniAppCode;
+            });
+        });
+      },
+
+      isHaveMiniAppFeature: (state) => {
+        if (state.isFetchingInstalledMiniApps) {
+          // if still fetching, return true 1st, else will immediate show restricted warning
+          return true;
+        }
+
+        return state.actionAccess.isHaveMiniAppFeature ?? false;
+      },
+
+      isShowMiniAppMoreMenuButton: (state) => {
+        const filtered = state.installedMiniApps.filter(
+          (item) =>
+            item.integration?.pages?.length > 0 ||
+            (item.integration?.settings?.jsonSchema &&
+              Object.keys(item.integration.settings.jsonSchema).length > 0),
+        );
+
+        return _.isEmpty(filtered) ? false : true;
+      },
+
+      isCanInstall: (state) => state.actionAccess.isAllowInstall,
+      isCanUninstall: (state) => state.actionAccess.isAllowUninstall,
+      isCanUpdateSetting: (state) => state.actionAccess.isAllowUpdateSetting,
+      isHasMiniAppFeature: (state) => state.actionAccess.isHaveMiniAppFeature,
+    },
+
+    actions: {
+      getMenuItems() {
+        return this.installedMiniApps.flatMap((miniApp) => {
+          const pages = miniApp.integration.pages.filter((page) => {
+            return this.checkIsAllowAccessMiniAppPage(miniApp.code, page.code) && this.isRequiredToShowOnMenu(page);
+          });
+
+          if (this.isCanUpdateSetting) {
+            if (
+              miniApp.integration.settings?.jsonSchema &&
+              !_.isEmpty(miniApp.integration.settings.jsonSchema)
+            ) {
+              pages.push({
+                code: MINI_APP_BUILT_IN_SETTING_NAME,
+                title: t("miniAppLang.setting"),
+                description: "",
+                sourceType: "",
+                sources: {
+                  development: "",
+                  production: "",
+                },
+                requiredPermissions: [],
+                iconType: "class",
+                icon: "pi pi-cog",
+              });
+            }
+          }
+
+          // Only return mini app if pages not empty
+          if (_.isEmpty(pages)) {
+            return [];
+          }
+
+          return {
+            _id: miniApp._id,
+            code: miniApp.code,
+            name: miniApp.name,
+            logo: miniApp.logo,
+            pages,
+          };
+        });
+      },
+
+      isRequiredToShowOnMenu(page: MiniappIntegrationPages){
+        return page.isHideOnMenu !== true;
+      },
+
+      // ============================ Load Function ============================
+      async loadInstalledMiniApps() {
+        this.isFetchingInstalledMiniApps = true;
+
+        const resp = await miniAppManager
+          .runGetInstalledMiniApps()
+          .then((res) => {
+            return res.data;
+          })
+          .catch((res: any) => {
+            return Promise.reject(res);
+          });
+
+        this.installedMiniApps = resp.installedMiniApps;
+        this.actionAccess = resp.actionAccess;
+
+        this.isFetchingInstalledMiniApps = false;
+      },
+
+      async loadMiniAppDetail(miniAppCode: string) {
+        return await miniAppManager
+          .runGetMiniAppDetail(miniAppCode)
+          .then((res) => {
+            return res.data;
+          })
+          .catch((res: any) => {
+            return Promise.reject(res);
+          });
+      },
+
+      async loadCategorizedMiniApps() {
+        return await miniAppManager
+          .runGetCategorizedMiniApps()
+          .then((res) => {
+            return res.data;
+          })
+          .catch((res: any) => {
+            return Promise.reject(res);
+          });
+      },
+
+      // ================================ Permission ===============================
+
+      getActionAccess(
+        type: "install" | "uninstall" | "updateSetting" | "plan",
+      ) {
+        switch (type) {
+          case "install":
+            return {
+              isAllow: this.isCanInstall,
+              reason: "insufficientInstallPermission",
+            };
+
+          case "uninstall":
+            return {
+              isAllow: this.isCanUninstall,
+              reason: "insufficientUninstallPermission",
+            };
+
+          case "updateSetting":
+            return {
+              isAllow: this.isCanUpdateSetting,
+              reason: "insufficientChangeSettingPermission",
+            };
+
+          case "plan":
+            return {
+              isAllow: this.isHasMiniAppFeature,
+              reason: "packageTypeRestricted",
+            };
+        }
+      },
+
+      // ============================ Path & Navigation ============================
+
+      getMiniAppSettingPath(miniAppCode: string) {
+        return `${MINI_APP_PAGE_PATH_PREFIX}/${miniAppCode}/setting`;
+      },
+
+      getMiniAppPageUrlPath(miniAppCode: string, pageCode: string): string {
+        const page = pageCode === "index" ? "" : "/" + pageCode;
+        return `${MINI_APP_PAGE_PATH_PREFIX}/${miniAppCode}/app${page}`;
+      },
+
+      getMiniAppPageUrl(
+        miniAppCode: string,
+        pageCode: string,
+        querystr?: string,
+      ): string {
+        const path = this.getMiniAppPageUrlPath(miniAppCode, pageCode);
+        return getDocumentUrl(path, "", querystr);
+      },
+
+      getMiniAppSettingPageUrl(miniAppCode: string, querystr?: string): string {
+        const path = this.getMiniAppSettingPath(miniAppCode);
+        return getDocumentUrl(path, "", querystr);
+      },
+
+      navigateToMiniAppInstall(miniAppCode: string) {
+        goTo(`integrations/${miniAppCode}`);
+      },
+
+      navigateToMiniAppPage(miniAppCode: string, pageCode: string) {
+        if (pageCode === MINI_APP_BUILT_IN_SETTING_NAME) {
+          goTo(this.getMiniAppSettingPath(miniAppCode));
+        } else {
+          goTo(this.getMiniAppPageUrlPath(miniAppCode, pageCode));
+        }
+      },
+
+      // ============================ Validation ============================
+
+      checkIsMiniAppInstalled(miniAppCode: string) {
+        const miniApp = this.installedMiniApps.find(
+          (item) => item.code === miniAppCode,
+        );
+
+        return miniApp ? true : false;
+      },
+
+      checkIsAllowAccessMiniAppPage(miniAppCode: string, pageCode: string) {
+        const miniApp = this.installedMiniApps.find(
+          (item) => item.code === miniAppCode,
+        );
+        if (!miniApp) {
+          return false;
+        }
+
+        const page = miniApp.integration.pages.find(
+          (item) => item.code === pageCode,
+        );
+        if (!page) {
+          return false;
+        }
+
+        if (checkHasHighPrivilege()) {
+          return true;
+        }
+
+        const userRoles = getUserProfile().roles;
+
+        if (page.requiredPermissions && !_.isEmpty(page.requiredPermissions)) {
+          return page.requiredPermissions.some((permission) =>
+            userRoles.includes(permission),
+          );
+        }
+        return true;
+      },
+
+      getPageInfo(miniApp: Miniapp, pageCode: string) {
+        return miniApp.integration.pages.find((item) => item.code === pageCode);
+      },
+
+      checkMiniAppFrameworkCompatibility: (
+        miniApp: Miniapp,
+      ): MiniAppFrameworkCompatibility => {
+        if (miniApp.frameworkCompatibility < MIN_FRAMEWORK_VERSION) {
+          return MiniAppFrameworkCompatibility.DEPRECATED;
+        }
+
+        if (miniApp.frameworkCompatibility < MIN_FRAMEWORK_COMPATIBLE_VERSION) {
+          return MiniAppFrameworkCompatibility.TO_BE_DEPRECATED;
+        }
+
+        return MiniAppFrameworkCompatibility.COMPATIBLE;
+      },
+
+      // ============================ miniApp Action ============================
+
+      async installMiniApp(miniAppCode: string) {
+        const miniAppInstallation = await miniAppManager
+          .runInstallMiniApp(miniAppCode)
+          .then((res) => {
+            return res.data;
+          })
+          .catch((res: any) => {
+            return Promise.reject(res);
+          });
+
+        this.loadInstalledMiniApps();
+
+        return miniAppInstallation;
+      },
+
+      async uninstallMiniApp(miniAppCode: string) {
+        const miniAppInstallation = await miniAppManager
+          .runUninstallMiniApp(miniAppCode)
+          .then((res) => {
+            return res.data;
+          })
+          .catch((res: any) => {
+            return Promise.reject(res);
+          });
+
+        this.loadInstalledMiniApps();
+
+        return miniAppInstallation;
+      },
+
+      async updateMiniAppSetting(
+        miniAppCode: string,
+        data: { [key: string]: any },
+      ) {
+        const miniAppInstallation = await miniAppManager
+          .runUpdateMiniAppSetting(miniAppCode, data)
+          .then((res) => {
+            return res.data;
+            ``;
+          })
+          .catch((res: any) => {
+            return Promise.reject(res);
+          });
+
+        this.loadInstalledMiniApps();
+
+        return miniAppInstallation;
+      },
+
+      openMiniAppSetting(miniAppCode: string | undefined) {
+        if (miniAppCode && miniAppCode != "") {
+          this.navigateToMiniAppPage(
+            miniAppCode,
+            MINI_APP_BUILT_IN_SETTING_NAME,
+          );
+        }
+      },
+    },
+  });
+
+  return {
+    provide: {
+      miniAppStore: useMiniAppStore(),
+    },
+  };
+});

package/templates/nuxt/plugins/20.simpleapp-userstore.ts.eta

@@ -51,7 +51,7 @@ export default defineNuxtPlugin(async (nuxtApp) => {
       async loadRemoteUserInfo() {
         // console.log('loadRemoteUserInfo')
 
-        const { $axios, $appPluginsStore, $customFieldStore } = useNuxtApp();
+        const { $axios, $miniAppStore, $customFieldStore } = useNuxtApp();
         const route = useRoute();
         let xorg = this.getCurrentXorg();
 
@@ -62,8 +62,8 @@ export default defineNuxtPlugin(async (nuxtApp) => {
           apiurl = `${useRuntimeConfig().public.appUrl}/api/${xorg}`;
         }
 
-        if(xorg !== undefined) {
-          await $appPluginsStore.loadInstalledPlugins();
+        if (xorg !== undefined) {
+          await $miniAppStore.loadInstalledMiniApps();
           await $customFieldStore.fetchList();
         }
 

package/templates/nuxt/simpleapp/generate/features/customField/components/CustomFieldFormField.vue.eta

@@ -0,0 +1,100 @@
+<template>
+  <template v-if="validJsonSchema">
+    <template v-if="_.isArray(validJsonSchema)"> </template>
+    <template v-else>
+      <template v-if="validJsonSchema.type === 'object'">
+        <template v-if="validJsonSchema['x-foreignkey']">
+          <CustomFieldFormFieldInput
+            :jsonSchema="validJsonSchema"
+            :hierarchy="hierarchy"
+            :schemaSource="schemaSource"
+            :handleGetField="handleGetField"
+            v-model="data[schemaName]"
+          />
+        </template>
+        <template v-else>
+          <Fieldset class="col-span-2 rounded-xl">
+            <template #legend>
+              <span
+                :class="{
+                  'mx-2': legendTitle && legendTitle !== '',
+                }"
+              >
+                {{ legendTitle }}
+              </span>
+            </template>
+
+            <div
+              class="grid grid-cols-2 gap-4 p-2"
+              :class="{
+                'pt-4': legendTitle === undefined || legendTitle === '',
+              }"
+            >
+              <template
+                v-if="validJsonSchema.properties"
+                v-for="(subSchema, subSchemaName) in validJsonSchema.properties"
+                :key="subSchemaName"
+              >
+                <CustomFieldFormField
+                  :jsonSchema="subSchema"
+                  :data="data[schemaName]"
+                  :schemaSource="schemaSource"
+                  :schemaName="subSchemaName as string"
+                  :handleGetField="handleGetField"
+                  :hierarchy="
+                    hierarchy === '' || hierarchy === undefined
+                      ? (subSchemaName as string)
+                      : `${hierarchy}.${subSchemaName}`
+                  "
+                />
+              </template>
+            </div>
+          </Fieldset>
+        </template>
+      </template>
+      <template v-else>
+        <CustomFieldFormFieldInput
+          :jsonSchema="validJsonSchema"
+          :hierarchy="hierarchy"
+          :schemaSource="schemaSource"
+          :handleGetField="handleGetField"
+          v-model="data[schemaName]"
+        />
+      </template>
+    </template>
+  </template>
+</template>
+
+<script setup lang="ts">
+import _ from "lodash";
+import { SimpleAppJSONSchema7Definition } from "~/types";
+import { SchemaSource } from "~/types/customField.type";
+import CustomFieldFormFieldInput from "./CustomFieldFormFieldInput.vue";
+
+const props = defineProps<{
+  jsonSchema?: SimpleAppJSONSchema7Definition | undefined;
+  data: any;
+  hierarchy: string;
+  schemaName: string;
+  schemaSource: SchemaSource;
+  isHideFieldsetLegend?: boolean;
+  handleGetField: (path: string) => any;
+}>();
+
+const legendTitle = computed(() => {
+  if (props.isHideFieldsetLegend) return "";
+
+  return (
+    (props.jsonSchema &&
+      typeof props.jsonSchema !== "boolean" &&
+      props.jsonSchema?.title) ??
+    props.schemaName
+  );
+});
+const validJsonSchema = computed(() => {
+  if (props.jsonSchema !== undefined && typeof props.jsonSchema === "object") {
+    return props.jsonSchema;
+  }
+  return false;
+});
+</script>

package/templates/nuxt/simpleapp/generate/features/customField/components/CustomFieldFormFieldInput.vue.eta

@@ -0,0 +1,121 @@
+<template>
+  <template v-if="jsonSchema.type !== 'array'">
+    <SimpleAppInput
+      v-if="fieldPath"
+      :setting="handleGetField(fieldPath)"
+      :inputType="inputType"
+      :hidelabel="isParentIsArray"
+      v-model="model"
+    />
+  </template>
+  <template
+    v-else-if="
+      jsonSchema.type === 'array' &&
+      jsonSchema.items &&
+      _.isObject(jsonSchema.items) &&
+      !Array.isArray(jsonSchema.items)
+    "
+  >
+    <template v-if="jsonSchema.items.type === 'object'">
+      <div class="col-span-2">
+        <SimpleAppInputTable
+          :getField="handleGetField"
+          class="col-span-4"
+          :setting="handleGetField(fieldPath)"
+          v-model="model"
+        >
+          <Column
+            v-if="
+              jsonSchema.items &&
+              typeof jsonSchema.items === 'object' &&
+              'properties' in jsonSchema.items
+            "
+            v-for="(subSchema, subSchemaName) in jsonSchema.items.properties"
+            :key="subSchemaName"
+            :field="subSchemaName.toString()"
+            #body="{ index }"
+            :header="camelCaseToWords(subSchemaName.toString())"
+          >
+            <CustomFieldFormFieldInput
+              v-if="typeof subSchema === 'object' && subSchema !== null"
+              :jsonSchema="subSchema"
+              :hierarchy="
+                hierarchy === '' || hierarchy === undefined
+                  ? (subSchemaName as string)
+                  : `${hierarchy}.*.${subSchemaName}`
+              "
+              :schemaSource="schemaSource"
+              :handleGetField="handleGetField"
+              v-model="model[index][subSchemaName]"
+            />
+          </Column>
+
+          <Column #body="{ index }" header="Delete">
+            <Button
+              class="btn-danger"
+              type="button"
+              @click="model.splice(index, 1)"
+            >
+              X
+            </Button>
+          </Column>
+        </SimpleAppInputTable>
+      </div>
+    </template>
+    <template v-else-if="jsonSchema.items.type === 'string'">
+      <SimpleAppInput
+        v-if="fieldPath"
+        :setting="handleGetField(fieldPath)"
+        :inputType="SimpleAppInputType.chip"
+        :hidelabel="isParentIsArray"
+        v-model="model"
+      />
+    </template>
+  </template>
+</template>
+
+<script setup lang="ts">
+import _ from "lodash";
+import { SimpleAppInputType, SimpleAppJSONSchema7 } from "~/types";
+import { SchemaSource } from "~/types/customField.type";
+
+const props = defineProps<{
+  jsonSchema: SimpleAppJSONSchema7;
+  hierarchy: string;
+  handleGetField: any;
+  schemaSource: SchemaSource;
+}>();
+
+const model = defineModel<any>();
+
+const fieldPath = computed(() => {
+  const hierarchies = props.hierarchy.split(".");
+
+  const path = (getFieldPathPrefix() + hierarchies.join("/properties/"))
+    .replace("properties/*", "items")
+    .replace("*", "items");
+
+  // if (props.schemaSource === "miniAppSetting") {
+  //   return path.replace("/properties/setting", "");
+  // }
+
+  return path;
+});
+
+const inputType = computed(() => {
+  return getInputType(props.jsonSchema);
+});
+
+const isParentIsArray = computed(() => {
+  const hierarchies = props.hierarchy.split(".");
+  return hierarchies[hierarchies.length - 2] == "*";
+});
+
+function getFieldPathPrefix() {
+  if (props.schemaSource === "customField") {
+    return "#/properties/more/properties/";
+  }
+
+  return "#/properties/";
+}
+</script>

package/templates/nuxt/simpleapp/generate/features/customField/components/CustomFieldFormSection.vue.eta

@@ -0,0 +1,40 @@
+<template>
+  <section v-if="validProperties" class="space-y-4">
+    <template
+      v-for="(groupJsonSchema, groupName) in validProperties"
+      :key="groupName"
+    >
+      <CustomFieldFormField
+        v-if="isValidSchema(groupJsonSchema)"
+        :jsonSchema="groupJsonSchema"
+        :data="data"
+        :handleGetField="handleGetField"
+        :schemaName="groupName.toString()"
+        :hierarchy="groupName.toString()"
+        schemaSource="customField"
+      />
+    </template>
+  </section>
+</template>
+
+<script setup lang="ts">
+import _ from 'lodash';
+import { CustomFieldMoreSchema } from '~/simpleapp/generate/features/customField/types/common';
+import CustomFieldFormField from './CustomFieldFormField.vue';
+
+const props = defineProps<{
+  customFieldJsonSchema: CustomFieldMoreSchema;
+  data: any;
+  handleGetField: (path: string) => any;
+}>();
+
+const validProperties = computed(() => {
+  if (
+    props.customFieldJsonSchema.properties !== undefined &&
+    typeof props.customFieldJsonSchema.properties === 'object'
+  ) {
+    return props.customFieldJsonSchema.properties;
+  }
+  return false;
+});
+</script>

package/templates/nuxt/simpleapp/generate/features/customField/components/CustomFieldMenuItem.vue.eta

@@ -0,0 +1,37 @@
+<template>
+  <div class="py-2 border-b border-dashed">
+    <div
+      class="flex flex-col gap-1 px-3 py-1 hover:bg-slate-100 h-full rounded-lg cursor-pointer text-surface-700"
+      :class="{
+        'bg-slate-100': isActive,
+      }"
+      @click="goTo(`customfield/${resource.name}`)"
+    >
+      <div class="text-sm font-medium">{{ t(resource.name) }}</div>
+      <div class="flex items-center gap-2">
+        <CustomFieldMenuItemBadge
+          :isActive="resource.hasCustomFieldFormSetting"
+          :title="t('customFieldLang.formSettingBadgeLabel')"
+        />
+        <CustomFieldMenuItemBadge
+          :isActive="resource.hasCustomFieldListSetting"
+          :title="t('customFieldLang.listSettingBadgeLabel')"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { CustomFieldPageMenuResourceItem } from "../types/page";
+import CustomFieldMenuItemBadge from "./CustomFieldMenuItemBadge.vue";
+
+const props = defineProps<{
+  activeResource: string;
+  resource: CustomFieldPageMenuResourceItem;
+}>();
+
+const isActive = computed(() => {
+  return props.activeResource === props.resource.name;
+});
+</script>