feat: moved crm settings to portal

frontend/src/components/Settings/GeneralSettings.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="flex h-full flex-col gap-8 p-8 text-ink-gray-9">
+    <h2 class="flex gap-2 text-xl font-semibold leading-none h-5">
+      {{ __('General') }}
+      <Badge
+        v-if="settings.isDirty"
+        :label="__('Not Saved')"
+        variant="subtle"
+        theme="orange"
+      />
+    </h2>
+
+    <div v-if="settings.doc" class="flex-1 flex flex-col gap-6 overflow-y-auto">
+      <div class="flex w-full">
+        <FormControl
+          type="text"
+          class="w-1/2"
+          v-model="settings.doc.brand_name"
+          :label="__('Brand Name')"
+        />
+      </div>
+
+      <!-- logo -->
+      <hr class="w-full border-outline-gray-2" />
+
+      <div class="flex flex-col justify-between gap-5">
+        <span class="text-lg font-semibold text-ink-gray-9">
+          {{ __('Logo') }}
+        </span>
+        <div class="flex flex-1 gap-5">
+          <div
+            class="flex items-center justify-center rounded border border-outline-gray-modals px-10 py-2"
+          >
+            <img
+              :src="settings.doc?.brand_logo || '/assets/crm/images/logo.png'"
+              alt="Logo"
+              class="size-8 rounded"
+            />
+          </div>
+          <div class="flex flex-1 flex-col gap-2">
+            <ImageUploader
+              label="Favicon"
+              image_type="image/ico"
+              :image_url="settings.doc?.brand_logo"
+              @upload="(url) => (settings.doc.brand_logo = url)"
+              @remove="() => (settings.doc.brand_logo = '')"
+            />
+            <span class="text-p-sm text-ink-gray-6">
+              {{
+                __(
+                  'Appears in the top sidebar. Recommended size is 32x32 px in PNG or SVG',
+                )
+              }}
+            </span>
+          </div>
+        </div>
+      </div>
+
+      <!-- favicon -->
+      <hr class="w-full border-outline-gray-2" />
+
+      <div class="flex flex-col justify-between gap-5">
+        <span class="text-lg font-semibold text-ink-gray-9">
+          {{ __('Favicon') }}
+        </span>
+        <div class="flex flex-1 gap-5">
+          <div
+            class="flex items-center justify-center rounded border border-outline-gray-modals px-10 py-2"
+          >
+            <img
+              :src="settings.doc?.favicon || '/assets/crm/images/logo.png'"
+              alt="Favicon"
+              class="size-8 rounded"
+            />
+          </div>
+          <div class="flex flex-1 flex-col gap-2">
+            <ImageUploader
+              label="Favicon"
+              image_type="image/ico"
+              :image_url="settings.doc?.favicon"
+              @upload="(url) => (settings.doc.favicon = url)"
+              @remove="() => (settings.doc.favicon = '')"
+            />
+            <span class="text-p-sm text-ink-gray-6">
+              {{
+                __(
+                  'Appears next to the title in your browser tab. Recommended size is 32x32 px in PNG or ICO',
+                )
+              }}
+            </span>
+          </div>
+        </div>
+      </div>
+
+      <!-- dropdown settings -->
+      <hr class="w-full border-outline-gray-2" />
+
+      <div class="flex flex-col justify-between gap-5">
+        <span class="text-lg font-semibold text-ink-gray-9">
+          {{ __('Dropdown settings') }}
+        </span>
+        <div class="flex flex-1">
+          <Grid
+            v-model="settings.doc.dropdown_items"
+            doctype="CRM Dropdown Item"
+            parentDoctype="FCRM Settings"
+          />
+        </div>
+      </div>
+
+      <div class="flex flex-row-reverse">
+        <Button :label="__('Save')" variant="solid" @click="updateSettings" />
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import ImageUploader from '@/components/Controls/ImageUploader.vue'
+import Grid from '@/components/Controls/Grid.vue'
+import { FormControl, Badge } from 'frappe-ui'
+import { getSettings } from '@/stores/settings'
+import { showSettings } from '@/composables/settings'
+
+const { _settings: settings } = getSettings()
+
+function updateSettings() {
+  settings.save.submit()
+  showSettings.value = false
+}
+</script>

frontend/src/components/Settings/Settings.vue

@@ -44,6 +44,7 @@
 import WhatsAppIcon from '@/components/Icons/WhatsAppIcon.vue'
 import ERPNextIcon from '@/components/Icons/ERPNextIcon.vue'
 import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
+import GeneralSettings from '@/components/Settings/GeneralSettings.vue'
 import InviteMemberPage from '@/components/Settings/InviteMemberPage.vue'
 import ProfileSettings from '@/components/Settings/ProfileSettings.vue'
 import WhatsAppSettings from '@/components/Settings/WhatsAppSettings.vue'
@@ -79,6 +80,12 @@ const tabs = computed(() => {
             }),
           component: markRaw(ProfileSettings),
         },
+        {
+          label: __('General'),
+          icon: 'settings',
+          component: markRaw(GeneralSettings),
+          condition: () => isManager(),
+        },
         {
           label: __('Invite Members'),
           icon: 'user-plus',

frontend/src/stores/meta.js

@@ -57,7 +57,7 @@ export function getMeta(doctype) {
 
   function getGridSettings(parentDoctype, dt = null) {
     dt = dt || doctype
-    if (!userSettings[parentDoctype]['GridView']?.[doctype]) return {}
+    if (!userSettings[parentDoctype]?.['GridView']?.[doctype]) return {}
     return userSettings[parentDoctype]['GridView'][doctype]
   }
 

frontend/src/stores/settings.js

@@ -5,7 +5,7 @@ const settings = ref({})
 const brand = reactive({})
 
 export function getSettings() {
-  createDocumentResource({
+  const _settings = createDocumentResource({
     doctype: 'FCRM Settings',
     name: 'FCRM Settings',
     onSuccess: (data) => {
@@ -18,6 +18,7 @@ export function getSettings() {
   })
 
   return {
+    _settings,
     settings,
     brand,
   }