feat(web): migrate CRM screens to Ant Design Vue with central theme

Adopt ant-design-vue and a shared antdTheme for leads, pipeline, invoices, and shared form controls under strict single-page governance. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-10-18 19:39:59 +03:30
parent ab538b8304
commit 4abab55a6b
40 changed files with 7529 additions and 11795 deletions
@@ -0,0 +1,77 @@
+import type { ThemeConfig } from 'ant-design-vue/es/config-provider/context';
+
+/**
+ * Central Ant Design Vue v4 theme for Montact.
+ * Migrated pages must consume this via App ConfigProvider — do not fork in views.
+ *
+ * controlHeight: 36 is the system default (Ant derives SM/LG).
+ * Do not set controlHeight* under components — inherit the token.
+ */
+/** Tailwind gray-50 / gray-200 — layout fill + control/card borders */
+const GRAY_50 = '#f9fafb';
+const GRAY_200 = '#e5e7eb';
+
+export const antdTheme = {
+  token: {
+    colorPrimary: '#10b981',
+    fontFamily: '"IRANSans", Tahoma, sans-serif',
+
+    /** Page / subtle surface fill */
+    colorBgLayout: GRAY_50,
+    colorFillQuaternary: GRAY_50,
+    colorFillAlter: GRAY_50,
+
+    /** Control, card, and divider borders */
+    colorBorder: GRAY_200,
+    colorBorderSecondary: GRAY_200,
+
+    borderRadius: 8,
+    borderRadiusSM: 6,
+    borderRadiusLG: 12,
+
+    /** Default Ant control size for the whole app (buttons, inputs, selects, …). */
+    controlHeight: 36,
+
+    /* Spacing scale: 8, 12, 16, 20, 24 */
+    paddingXXS: 4,
+    paddingXS: 8,
+    paddingSM: 12,
+    padding: 16,
+    paddingMD: 20,
+    paddingLG: 24,
+    paddingXL: 32,
+
+    marginXXS: 4,
+    marginXS: 8,
+    marginSM: 12,
+    margin: 16,
+    marginMD: 20,
+    marginLG: 24,
+    marginXL: 32,
+
+    boxShadow:
+      '0 1px 2px 0 rgba(15, 23, 42, 0.04), 0 1px 6px -1px rgba(15, 23, 42, 0.06), 0 2px 4px 0 rgba(15, 23, 42, 0.04)',
+    boxShadowSecondary:
+      '0 6px 16px 0 rgba(15, 23, 42, 0.08), 0 3px 6px -4px rgba(15, 23, 42, 0.1), 0 9px 28px 8px rgba(15, 23, 42, 0.05)',
+  },
+  components: {
+    Card: {
+      paddingLG: 24,
+      headerBg: 'transparent',
+    },
+    Collapse: {
+      headerBg: GRAY_50,
+      contentBg: GRAY_50,
+      colorBorder: GRAY_200,
+    },
+    Input: {
+      colorBorder: GRAY_200,
+    },
+    Select: {
+      colorBorder: GRAY_200,
+    },
+    Form: {
+      itemMarginBottom: 18,
+    },
+  },
+} as ThemeConfig;