feat: complete admin panel and backend admin api migration

2026-09-13 21:02:25 +03:30
parent 03119cd655
commit 267fc7b7d1
239 changed files with 25431 additions and 935 deletions
@@ -0,0 +1,94 @@
+// ─────────────────────────────────────────────────────────────────────────
+// Global utility layer.
+//
+// WHY THIS EXISTS. Legacy henza_admin shipped a full Tailwind build
+// (tailwind.config.js, ~28KB) whose custom scale the templates depend on —
+// `mb-base`, `text-primary`, `w-5`, `grid-cols-4` and friends all resolved
+// there. This port never installed Tailwind, but ~185 of those class names
+// survived in the ported templates. They were patched over by re-declaring a
+// handful of them inside each view's own `<style scoped>` block — 100+ copies
+// across 49 files, which (a) drifted in value and (b) could not reach child
+// components at all, because a scoped rule never applies inside a child.
+//
+// This file replaces all of that with ONE global definition, using LEGACY's
+// values rather than the drifted ones.
+// ─────────────────────────────────────────────────────────────────────────
+
+// ── Design tokens ────────────────────────────────────────────────────
+// Legacy themeConfig.js + vue.config.js modifyVars. These are also fed to the
+// ant LESS build in vite.config.ts; declaring them here as custom properties
+// makes them reachable from plain CSS too (App.vue:65 reads --primary-color).
+//
+// NOTE ant.less:5-7 declares `--primary: #41b883` / `--accent: #35495e` —
+// ant-design-pro boilerplate in Vue's own palette, inherited verbatim from
+// legacy. `--accent` drives @border-color-base, i.e. EVERY ant border. It is
+// left alone here (changing it is a visual decision, not a bug fix), but the
+// Henza tokens below are what application code should use.
+:root {
+  --primary-color: #1c2d56;
+  --secondary-color: #836447;
+  --third-color: #f5cb55;
+  --success-color: #28c76f;
+  --danger-color: #ea5455;
+  --warning-color: #ff9f43;
+}
+
+// ── Text colour ──────────────────────────────────────────────────────
+.text-primary { color: var(--primary-color); }
+.text-secondary { color: var(--secondary-color); }
+.text-third { color: var(--third-color); }
+.text-success { color: var(--success-color); }
+.text-danger { color: var(--danger-color); }
+.text-warning { color: var(--warning-color); }
+
+// ── Spacing ──────────────────────────────────────────────────────────
+// legacy tailwind.config.js:628,664 — `base` is 2.2rem, NOT the 1.5rem the
+// per-file copies drifted to.
+.mb-base { margin-bottom: 2.2rem; }
+.mt-base { margin-top: 2.2rem; }
+.p-base { padding: 2.2rem; }
+.mb-5 { margin-bottom: 1.25rem; }
+.mx-1 { margin: 0 0.25rem; }
+
+// RTL-FLIPPED. The ported views deliberately invert these: the panel is RTL,
+// so a Tailwind `ml-*` from the legacy template must push to the RIGHT to keep
+// the original visual gap. Verified against the per-file copies this layer
+// replaces — .ml-1/.ml-3 were `margin-right`, .mr-4 was `margin-left`, in
+// every occurrence. Keep the logical inversion; do NOT "correct" it.
+.ml-1 { margin-right: 0.25rem; }
+.ml-3 { margin-right: 0.75rem; }
+.mr-4 { margin-left: 1rem; }
+
+// ── Sizing ───────────────────────────────────────────────────────────
+// Tailwind's 0.25rem scale. `h-5` was used 17 times and defined NOWHERE, so
+// every `icon-class="w-5 h-5 …"` rendered at inherited size.
+.w-5 { width: 1.25rem; }
+.h-5 { height: 1.25rem; }
+.w-6 { width: 1.5rem; }
+.h-6 { height: 1.5rem; }
+.w-full { width: 100%; }
+
+// ── Layout ───────────────────────────────────────────────────────────
+.flex { display: flex; }
+.inline-flex { display: inline-flex; }
+.items-center { align-items: center; }
+.justify-center { justify-content: center; }
+.justify-between { justify-content: space-between; }
+.gap-2 { gap: 0.5rem; }
+.cursor-pointer { cursor: pointer; }
+
+// Responsive auto-fit grids. These are a port-ism (legacy used Tailwind's
+// explicit `grid-cols-N` + breakpoint prefixes); kept because every ported
+// form already binds them.
+.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
+.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
+.grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
+
+// ── Card chrome ──────────────────────────────────────────────────────
+// Legacy's <vx-card> (vuexy/components/vxCard.scss:1-11) carried a soft shadow
+// and 8px radius. <a-card> is a flat 1px-bordered box, which is the single
+// most visible difference across the 54 card sites in the port.
+body #app .ant-card {
+  border-radius: 0.5rem;
+  box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
+}