@opengis/cms 0.0.22 → 0.0.24

package/src/pages/settings/Settings.vue

@@ -1,186 +0,0 @@
-<template>
-  <div
-    class="flex-1 overflow-y-auto bg-gradient-to-br from-slate-50 via-blue-50 to-indigo-50 dark:from-slate-900 dark:via-slate-800 dark:to-slate-900"
-  >
-    <div class="w-full max-w-7xl mx-auto space-y-6">
-      <div class="mb-8">
-        <div class="flex items-center gap-2">
-          <h1 class="text-3xl font-bold text-slate-800 dark:text-slate-100 mb-2">
-            {{ $t("settings.title") }}
-          </h1>
-          <a :href="`https://cms.opengis.info/${locale}/config/general-settings/`" target="_blank" :title="$t('guide.settings')">
-            <HelpCircle class="w-5 h-5" />
-          </a>
-        </div>
-        <p class="text-slate-600 dark:text-slate-300">
-          {{ $t("settings.description") }}
-        </p>
-      </div>
-      <div class="space-y-6 max-w-7xl mx-auto">
-        <!-- <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-          <SettingsCard
-            v-for="card in cards"
-            :key="card.title"
-            :path="card.path"
-            :title="card.title"
-            :description="card.description"
-            :button-text="card.buttonText"
-          >
-            <template #icon>
-              <component :is="card.icon" class="w-5 h-5 mr-2" />
-            </template>
-          </SettingsCard>
-        </div> -->
-        <div
-          class="rounded-xl text-card-foreground shadow-lg border-0 bg-white dark:bg-slate-800 backdrop-blur-sm"
-        >
-          <div
-            class="flex flex-col space-y-1.5 p-6 border-b border-slate-200 dark:border-slate-700 bg-gradient-to-r from-slate-50 dark:from-slate-800 to-white dark:to-slate-800"
-          >
-            <h3
-              class="tracking-tight text-xl font-semibold text-slate-800 dark:text-slate-100 flex items-center"
-            >
-              <BellIcon class="w-5 h-5 mr-2" />{{ $t("settings.systemStatus") }}
-            </h3>
-          </div>
-          <div class="p-6">
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-              <div class="space-y-4">
-                <h3 class="font-medium text-slate-800 dark:text-slate-100">
-                  {{ $t("settings.siteInformation") }}
-                </h3>
-                <div class="space-y-2">
-                  <div class="flex justify-between items-center">
-                    <span class="text-sm text-slate-600 dark:text-slate-400"
-                      >{{ $t("settings.siteName") }}</span
-                    ><span
-                      class="text-sm font-medium text-slate-800 dark:text-slate-100"
-                      >CMS Pro</span
-                    >
-                  </div>
-                  <div class="flex justify-between items-center">
-                    <span class="text-sm text-slate-600 dark:text-slate-400"
-                      >{{ $t("settings.version") }}</span
-                    ><span
-                      class="text-sm font-medium text-slate-800 dark:text-slate-100"
-                      >2.1.0</span
-                    >
-                  </div>
-                  <div class="flex justify-between items-center">
-                    <span class="text-sm text-slate-600 dark:text-slate-400"
-                      >{{ $t("settings.environment") }}</span
-                    >
-                    <div
-                      class="inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent shadow hover:bg-primary/80 bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300"
-                    >
-                      {{ $t("settings.production") }}
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div class="space-y-4">
-                <h3 class="font-medium text-slate-800 dark:text-slate-100">
-                  {{ $t("settings.systemHealth") }}
-                </h3>
-                <div class="space-y-2">
-                  <div class="flex justify-between items-center">
-                    <span class="text-sm text-slate-600 dark:text-slate-400"
-                      >{{ $t("settings.database") }}</span
-                    >
-                    <div
-                      class="inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent shadow hover:bg-primary/80 bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300"
-                    >
-                      {{ $t("settings.connected") }}
-                    </div>
-                  </div>
-                  <div class="flex justify-between items-center">
-                    <span class="text-sm text-slate-600 dark:text-slate-400"
-                        >{{ $t("settings.cache") }}</span
-                    >
-                    <div
-                      class="inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent shadow hover:bg-primary/80 bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300"
-                    >
-                      {{ $t("settings.active") }}
-                    </div>
-                  </div>
-                  <div class="flex justify-between items-center">
-                    <span class="text-sm text-slate-600 dark:text-slate-400"
-                      >{{ $t("settings.storage") }}</span
-                    >
-                    <div
-                      class="inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent shadow hover:bg-primary/80 bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300"
-                    >
-                      {{ $t("settings.used") }}
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import SettingsCard from '../../components/SettingsCard.vue'
-import SettingsIcon from '../../components/icons/SettingsIcon.vue'
-import UsersIcon from '../../components/icons/UsersIcon.vue'
-import ShieldIcon from '../../components/icons/ShieldIcon.vue'
-import KeyIcon from '../../components/icons/KeyIcon.vue'
-import PaletteIcon from '../../components/icons/PaletteIcon.vue'
-import GlobeIcon from '../../components/icons/GlobeIcon.vue'
-import BellIcon from '../../components/icons/BellIcon.vue'
-import { HelpCircle } from 'lucide-vue-next'
-import { useI18n } from 'vue-i18n'
-
-const { t, locale } = useI18n()
-
-const cards = [
-  {
-    title: t('settings.general.general'),
-    path: '/settings/general',
-    description: t('settings.general.general'),
-    buttonText: t('settings.configure'),
-    icon: SettingsIcon
-  },
-  {
-    title: t('settings.users.users'),
-    path: '/settings/users',  
-    description: t('settings.users.users'),
-    buttonText: t('settings.configure'),
-    icon: UsersIcon
-  },
-  {
-    title: t('settings.security'),
-    path: '/settings/security',
-    description: t('settings.security'),
-    buttonText: t('settings.configure'),
-    icon: ShieldIcon
-  },
-  {
-    title: t('settings.api-keys.apiKeys'),
-    path: '/settings/api-keys',
-    description: t('settings.api-keys.apiKeys'),
-    buttonText: t('settings.configure'),
-    icon: KeyIcon
-  },
-  {
-    title: t('settings.appearance.appearance'),
-    path: '/settings/appearance',
-    description: t('settings.appearance.appearance'),
-    buttonText: t('settings.configure'),
-    icon: PaletteIcon
-  },
-  {
-    title: t('settings.localization'),
-    path: '/settings/localization',
-    description: t('settings.localization'),
-    buttonText: t('settings.configure'),
-    icon: GlobeIcon
-  }
-]
-</script>
-
-<style scoped></style>

package/src/pages/settings/Users.vue

@@ -1,109 +0,0 @@
-<template>
-  <div class="w-full max-w-7xl mx-auto space-y-6">
-    <SettingsTitle
-      :title="$t('settings.users.users')"
-      :description="$t('settings.users.usersDescription')"
-    />
-    <SettingsTable
-      v-model="userSettings"
-      :icon="Users"
-      :title="$t('settings.users.userRegistration')"
-      :color="'green'"
-    />
-  </div>
-</template>
-
-<script setup>
-import { Users } from "lucide-vue-next";
-import { ref, onMounted, getCurrentInstance } from "vue";
-import SettingsTitle from "@/components/settings/SettingsTitle.vue";
-import SettingsTable from "@/components/settings/SettingsTable.vue";
-import { useI18n } from "vue-i18n";
-import { notify } from "@opengis/core";
-
-const { t } = useI18n();
-
-const userSettings = ref([
-  {
-    key: "allowRegistration",
-    label: t("settings.users.allowRegistration"),
-    description: t("settings.users.allowRegistrationDescription"),
-    checked: true,
-  },
-  {
-    key: "emailVerification",
-    label: t("settings.users.emailVerification"),
-    description: t("settings.users.emailVerificationDescription"),
-    checked: true,
-  },
-  {
-    key: "autoApprove",
-    label: t("settings.users.autoApprove"),
-    description: t("settings.users.autoApproveDescription"),
-    checked: false,
-  },
-  {
-    key: "defaultRole",
-    label: t("settings.users.defaultRole"),
-    description: "",
-    value: "Viewer",
-    options: [
-      { text: "Viewer", id: "Viewer" },
-      { text: "Contributor", id: "Contributor" },
-      { text: "Author", id: "Author" },
-    ],
-  },
-]);
-
-const fetchData = async () => {
-  const response = await fetch("/api/settings");
-  const data = await response.json();
-  setUserSettings(data?.settings?.users || {});
-};
-
-const setUserSettings = (data) => {
-  if (!data) return;
-  Object.entries(data).forEach(([key, value]) => {
-    const setting = userSettings.value.find((setting) => setting.key === key);
-    if (setting) {
-      setting.checked = value;
-    }
-  });
-};
-
-const saveChanges = async () => {
-  let data = {
-    users: {},
-  };
-
-  userSettings.value.forEach((setting) => {
-    data.users[setting.key] = setting.checked;
-  });
-  try {
-    await fetch("/api/settings", {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify(data),
-    });
-
-    notify({
-      title: "Успішно",
-      message: "Налаштування успішно збережено",
-      type: "success",
-    });
-  } catch (error) {
-    console.error(error);
-    notify({
-      title: "Помилка",
-      message: "Помилка при збереженні налаштувань",
-      type: "error",
-    });
-  }
-};
-
-onMounted(() => {
-  fetchData();
-});
-</script>

package/src/pages/settings/general.vue

@@ -1,154 +0,0 @@
-<template>
-  <div class="w-full max-w-7xl mx-auto space-y-6">
-    <SettingsTitle
-      :title="$t('settings.general.general')"
-      :description="$t('settings.general.generalDescription')"
-    />
-
-    <div class="space-y-6 max-w-7xl mx-auto">
-      <SettingsTable
-        :icon="Settings"
-        :title="$t('settings.general.siteInformation')"
-        :color="'blue'"
-      >
-        <template #content>
-          <VsForm
-            v-model:form="form"
-            :schema="generalScheme(t)"
-            v-model="formValues"
-            :key="formKey"
-          />
-          <div class="flex justify-end space-x-2 pt-4">
-            <button
-              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border shadow-sm hover:text-accent-foreground h-9 px-4 py-2 bg-white dark:bg-slate-700 border-slate-300 dark:border-slate-600 text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-600"
-            >
-              {{ $t("settings.general.cancel") }}
-            </button>
-            <button
-              @click="saveChanges"
-              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-white text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 text-primary-foreground shadow h-9 px-4 py-2 bg-blue-600 hover:bg-blue-700"
-            >
-              <Save class="w-4 h-4 mr-2" />
-              {{ $t("settings.general.saveChanges") }}
-            </button>
-          </div>
-        </template>
-      </SettingsTable>
-
-      <!-- <SettingsTable v-model="notificationSettings" :icon="Bell" :title="$t('settings.general.notifications')" :color="'blue'" /> -->
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, getCurrentInstance, onMounted } from "vue";
-import { Save, Settings, Bell } from "lucide-vue-next";
-import SettingsTitle from "@/components/settings/SettingsTitle.vue";
-import SettingsTable from "@/components/settings/SettingsTable.vue";
-import { useI18n } from "vue-i18n";
-import generalScheme from "./generalScheme.js";
-import { notify } from "@opengis/core";
-const { t } = useI18n();
-import VsForm from "@opengis/form";
-
-const form = ref({});
-
-const formValues = ref({});
-
-const formKey = ref(0);
-
-const fetchData = async () => {
-  const response = await fetch("/api/settings");
-  const data = await response.json();
-  Object.assign(formValues.value, data?.settings?.site_info || {});
-  formKey.value++;
-  setNotificationSettings(data?.settings?.notifications || {});
-};
-
-const setNotificationSettings = (data) => {
-  if (!data) return;
-  Object.entries(data).forEach(([key, value]) => {
-    const setting = notificationSettings.value.find(
-      (setting) => setting.key === key
-    );
-    if (setting) {
-      setting.checked = value;
-    }
-  });
-};
-
-const saveChanges = async () => {
-  let result = await form.value.validate();
-  if (result) {
-    notify({
-      type: "warning",
-      title: t("common.actions.warning"),
-      message: t("settings.general.saveChangesFailed"),
-    });
-    return;
-  }
-  let data = {
-    notifications: {},
-  };
-
-  notificationSettings.value.forEach((setting) => {
-    data.notifications[setting.key] = setting.checked;
-  });
-  data.site_info = formValues.value;
-
-  try {
-    // await fetch("/api/cms-space", { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(formValues.value) });
-    await fetch("/api/settings", {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify(data),
-    });
-
-    notify({
-      title: t("settings.successTitle"),
-      message: t("settings.successMessage"),
-      type: "success",
-    });
-  } catch (error) {
-    console.error(error);
-    notify({
-      title: t("settings.errorTitle"),
-      message: t("settings.errorMessage"),
-      type: "error",
-    });
-  }
-};
-
-const notificationSettings = ref([
-  {
-    key: "email",
-    label: t("settings.general.emailNotifications"),
-    description: t("settings.general.emailNotificationsDescription"),
-    checked: true,
-  },
-  {
-    key: "push",
-    label: t("settings.general.pushNotifications"),
-    description: t("settings.general.pushNotificationsDescription"),
-    checked: false,
-  },
-  {
-    key: "sms",
-    label: t("settings.general.smsNotifications"),
-    description: t("settings.general.smsNotificationsDescription"),
-    checked: false,
-  },
-  {
-    key: "desktop",
-    label: t("settings.general.desktopNotifications"),
-    description: t("settings.general.desktopNotificationsDescription"),
-    checked: true,
-  },
-]);
-
-onMounted(() => {
-  fetchData();
-});
-</script>

package/src/pages/settings/generalScheme.js

@@ -1,132 +0,0 @@
-const scheme = (t) => [
-  {
-    key: "name",
-    label: t('settings.general.siteName'),
-    type: "text",
-    value: t('settings.general.siteName'),
-    col: 6,
-    validators: ["required"],
-  },
-  {
-    key: "url",
-    label: t('settings.general.siteUrl'),
-    type: "text",
-    value: t('settings.general.siteUrl'),
-    col: 6,
-    validators: ["required"],
-  },
-  {
-    key: "previewUrl",
-    label: t('settings.general.previewUrl'),
-    type: "text",
-    value: "http://ip.local.softpro.ua",
-    col: 3,
-    validators: ["required"],
-  },
-  {
-    key: "logo",
-    label: t('settings.general.logoSite'),
-    type: "file",
-    col: 3,
-    validators: ["required"],
-  },
-  {
-    key: "logo-cms",
-    label: t('settings.general.logoCms'),
-    type: "file",
-    col: 3,
-    validators: ["required"],
-  },
-  {
-    key: "image-login",
-    label: t('settings.general.imageLogin'),
-    type: "file",
-    col: 3,
-    validators: ["required"],
-  },
-  {
-    key: "description",
-    label: t('settings.general.siteDescription'),
-    type: "textarea",
-    value: t('settings.general.siteDescription'),
-  },
-  {
-    key: "language",
-    label: t('settings.general.language'),
-    type: "select",
-    col: 6,
-    validators: ["required"],
-    options: [
-      {
-        text: "Ukrainian",
-        id: "uk",
-      },
-      { text: "English", id: "en" },
-    ],
-  },
-  {
-    key: "languages",
-    label: t('settings.general.languages'),
-    type: "select",
-    multiple: true,
-    col: 6,
-    options: [
-      {
-        text: "Ukrainian",
-        id: "uk",
-      },
-      { text: "English", id: "en" },
-    ],
-  },
-  {
-    key: "contacts",
-    label: t('settings.general.contacts'),
-    type:"DataTable",
-    colModel:[
-      {
-        key:"title",
-        ua:t('settings.general.title'),
-        type:"text",
-      },
-      {
-        key:"content",
-        ua:t('settings.general.content'),
-        type:"text",
-      },
-      {
-        key:"url",
-        ua:t('settings.general.url'),
-        type:"text",
-      },
-    ]
-  },
-  {
-    key:"showSocialsNumber",
-    label: t('settings.general.showSocialsNumber'),
-    type:"number",
-  },
-  {
-    key: "socials",
-    label: t('settings.general.socials'),
-    type:"DataTable",
-    colModel:[
-      {
-        key:"id",
-        ua:t('settings.general.name'),
-        type:"text",
-      },
-      {
-        key:"link",
-        ua:t('settings.general.url'),
-        type:"text",
-      },
-    ]
-  },
-  {
-    key:"mapCoords", 
-    label: t('settings.general.mapCoords'),
-    type:"text",
-  }
-];
-
-export default scheme; 

package/src/pages/users/AddUser.vue

@@ -1,106 +0,0 @@
-<template>
-    <div class="space-y-6 max-w-6xl mx-auto relative bg-white">
-        <div class="p-4 sticky top-[-24px] z-10 bg-white dark:bg-slate-800">
-            <div class="flex items-center justify-between">
-                <div class="flex items-center gap-4">
-                    <button
-                        @click="router.back()"
-                        class="p-2 text-gray-500 rounded-full hover:text-gray-900 dark:text-gray-400 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-700"><svg
-                            xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
-                            stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
-                            class="lucide lucide-arrow-left-icon w-5 h-5">
-                            <path d="m12 19-7-7 7-7"></path>
-                            <path d="M19 12H5"></path>
-                        </svg>
-                    </button>
-                    <h1 class="text-2xl font-semibold text-gray-900 dark:text-white">{{ id ? $t("users.editUser" ) : $t("users.createUser") }}</h1>
-                </div>
-                <div class="flex items-center space-x-3">
-                    <button 
-                        @click="handleSubmit"
-                        class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium h-9 px-4 py-2 bg-blue-600 text-white shadow-md transition-all duration-200 transform hover:bg-blue-700 hover:shadow-lg hover:scale-105 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50">
-                        <svg
-                            xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
-                            stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
-                            class="lucide lucide-save-icon w-4 h-4 mr-2">
-                            <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path>
-                            <polyline points="17 21 17 13 7 13 7 21"></polyline>
-                            <polyline points="7 3 7 8 15 8"></polyline>
-                        </svg> 
-                        {{ $t("common.actions.save") }}</button>
-                    </div>
-            </div>
-        </div>
-        <div class="container mx-auto bg-white rounded-md pb-4 px-5">
-            <VsForm v-if="schema" v-model="formValue" v-model:form="form" :schema="schema" />
-        </div>
-    </div>
-</template>
-
-<script setup>
-import { onMounted, ref } from 'vue';
-import VsForm from '@opengis/form';
-import { useRouter, useRoute } from 'vue-router';
-import { useI18n } from 'vue-i18n';
-import { notify } from '@opengis/core';
-const schema = ref(null);
-const formValue = ref({});
-const form = ref({});
-const loading = ref(true);
-const router = useRouter();
-const { t } = useI18n();
-const token = ref(null);
-const id = useRoute().params.id;
-
-const handleSubmit = async () => {
-    let method = id ? 'PUT' : 'POST';
-
-    try {
-        let result = await form.value.validate();
-
-        if (result) {
-            notify({
-                type: "warning",
-                title: t("common.actions.warning"),
-                message: t("users.createUserFailed"),
-            });
-            return;
-        }
-
-        await fetch(`/api/table/${token.value}`, { method: method, body: JSON.stringify(formValue.value), headers: { 'Content-Type': 'application/json' } });
-            
-        notify({
-            type: "success",
-            title: t("common.actions.success"),
-            message: t("users.createUserSuccess"),
-        });
-
-        router.back();
-    } catch (error) {
-        console.error(error);
-    }
-}
-
-
-const fetchData = async () => {
-    let url = id ? `/api/form/admin.users.table/${id}` : '/api/form/admin.users.table';
-
-    try {
-        const response = await fetch(url);
-        const data = await response.json();
-        
-        formValue.value = data?.data || {};
-        token.value = data.token;
-        schema.value = data.schema
-    } catch (error) {
-        schema.value = [];
-    } finally {
-        loading.value = false;
-    }
-}
-
-
-onMounted(() => {
-    fetchData();
-})
-</script>