fix(web): add DynamicExtFields to all create pages

zichun
1 parent 8b9e0ab2
Showing 6 changed files with 82 additions and 11 deletions
distribution/src/main/kotlin/org/vibeerp/demo/DemoSeedRunner.kt
web/src/pages/CreateLocationPage.tsx
web/src/pages/CreatePurchaseOrderPage.tsx
web/src/pages/CreateSalesOrderPage.tsx
web/src/pages/CreateWorkOrderPage.tsx
web/src/pages/MetadataAdminPage.tsx
@@ -186,7 +186,7 @@ class DemoSeedRunner(
         val locations = listOf(
             DemoLocation("WH-RAW", "Raw Materials Warehouse", "WAREHOUSE"),
             DemoLocation("WH-FG", "Finished Goods Warehouse", "WAREHOUSE"),
-            DemoLocation("WH-QUARANTINE", "Quarantine Area", "QUARANTINE"),
+            DemoLocation("WH-STAGING", "Staging Area", "VIRTUAL"),
         )
         val sql = """
@@ -228,9 +228,9 @@ class DemoSeedRunner(
         )
         val balances = listOf(
-            DemoBalance("PAPER-A3-120G", "WH-RAW", BigDecimal("5000.0000")),
-            DemoBalance("INK-CMYK-BLACK", "WH-RAW", BigDecimal("200.0000")),
-            DemoBalance("BROCHURE-A4", "WH-FG", BigDecimal("500.0000")),
+            DemoBalance("PAPER-A3-120G", "WH-RAW", BigDecimal("10000.0000")),
+            DemoBalance("INK-CMYK-BLACK", "WH-RAW", BigDecimal("1000.0000")),
+            DemoBalance("BROCHURE-A4", "WH-FG", BigDecimal("5000.0000")),
         )
         val balanceSql = """
@@ -286,14 +286,13 @@ class DemoSeedRunner(
         // --- SO-001: Acme Publishing, 2 lines ---
         val so1Id = UUID.randomUUID()
-        val so1Total = BigDecimal("1000.0000")
-            .add(BigDecimal("400.0000")) // 1000 * 0.50 + 5 * 80
+        val so1Total = BigDecimal("900.0000") // 1000 * 0.50 + 500 * 0.80
         insertSalesOrder(so1Id, "DEMO-SO-001", "CUST-ACME", orderDate, "USD", so1Total, now, principal)
         insertSalesOrderLine(so1Id, 1, "BROCHURE-A4",
             BigDecimal("1000.0000"), BigDecimal("0.5000"), "USD", now, principal)
-        insertSalesOrderLine(so1Id, 2, "DESIGN-HOURLY",
-            BigDecimal("5.0000"), BigDecimal("80.0000"), "USD", now, principal)
+        insertSalesOrderLine(so1Id, 2, "BROCHURE-A4",
+            BigDecimal("500.0000"), BigDecimal("0.8000"), "USD", now, principal)
         // --- SO-002: Globex Print, 1 line ---
         val so2Id = UUID.randomUUID()
@@ -3,6 +3,7 @@ import { useNavigate } from &#39;react-router-dom&#39;
 import { inventory } from '@/api/client'
 import { PageHeader } from '@/components/PageHeader'
 import { ErrorBox } from '@/components/ErrorBox'
+import { DynamicExtFields } from '@/components/DynamicExtFields'
 const LOCATION_TYPES = ['WAREHOUSE', 'BIN', 'VIRTUAL'] as const
@@ -11,6 +12,7 @@ export function CreateLocationPage() {
   const [code, setCode] = useState('')
   const [name, setName] = useState('')
   const [type, setType] = useState<string>('WAREHOUSE')
+  const [ext, setExt] = useState<Record<string, unknown>>({})
   const [submitting, setSubmitting] = useState(false)
   const [error, setError] = useState<Error | null>(null)
@@ -19,7 +21,8 @@ export function CreateLocationPage() {
     setError(null)
     setSubmitting(true)
     try {
-      await inventory.createLocation({ code, name, type })
+      const extPayload = Object.keys(ext).length > 0 ? ext : undefined
+      await inventory.createLocation({ code, name, type, ...(extPayload ? { ext: extPayload } : {}) })
       navigate('/locations')
     } catch (err: unknown) {
       setError(err instanceof Error ? err : new Error(String(err)))
@@ -53,6 +56,11 @@ export function CreateLocationPage() {
             {LOCATION_TYPES.map((t) => <option key={t} value={t}>{t}</option>)}
           </select>
         </div>
+        <DynamicExtFields
+          entityName="Location"
+          values={ext}
+          onChange={(k, v) => setExt((prev) => ({ ...prev, [k]: v }))}
+        />
         {error && <ErrorBox error={error} />}
         <button type="submit" className="btn-primary" disabled={submitting}>
           {submitting ? 'Creating...' : 'Create Location'}
@@ -4,6 +4,7 @@ import { catalog, partners, purchaseOrders } from &#39;@/api/client&#39;
 import type { Item, Partner } from '@/types/api'
 import { PageHeader } from '@/components/PageHeader'
 import { ErrorBox } from '@/components/ErrorBox'
+import { DynamicExtFields } from '@/components/DynamicExtFields'
 interface LineInput {
   itemCode: string
@@ -20,6 +21,7 @@ export function CreatePurchaseOrderPage() {
   const [lines, setLines] = useState<LineInput[]>([{ itemCode: '', quantity: '', unitPrice: '' }])
   const [items, setItems] = useState<Item[]>([])
   const [supplierList, setSupplierList] = useState<Partner[]>([])
+  const [ext, setExt] = useState<Record<string, unknown>>({})
   const [submitting, setSubmitting] = useState(false)
   const [error, setError] = useState<Error | null>(null)
@@ -51,6 +53,7 @@ export function CreatePurchaseOrderPage() {
     setError(null)
     setSubmitting(true)
     try {
+      const extPayload = Object.keys(ext).length > 0 ? ext : undefined
       const created = await purchaseOrders.create({
         code, partnerCode, currencyCode,
         orderDate: new Date().toISOString().slice(0, 10),
@@ -62,6 +65,7 @@ export function CreatePurchaseOrderPage() {
           unitPrice: Number(l.unitPrice),
           currencyCode,
         })),
+        ...(extPayload ? { ext: extPayload } : {}),
       })
       navigate(`/purchase-orders/${created.id}`)
     } catch (err: unknown) {
@@ -128,6 +132,11 @@ export function CreatePurchaseOrderPage() {
           </div>
         </div>
+        <DynamicExtFields
+          entityName="PurchaseOrder"
+          values={ext}
+          onChange={(k, v) => setExt((prev) => ({ ...prev, [k]: v }))}
+        />
         {error && <ErrorBox error={error} />}
         <button type="submit" className="btn-primary" disabled={submitting}>
           {submitting ? 'Creating...' : 'Create Purchase Order'}
@@ -4,6 +4,7 @@ import { catalog, partners, salesOrders } from &#39;@/api/client&#39;
 import type { Item, Partner } from '@/types/api'
 import { PageHeader } from '@/components/PageHeader'
 import { ErrorBox } from '@/components/ErrorBox'
+import { DynamicExtFields } from '@/components/DynamicExtFields'
 interface LineInput {
   itemCode: string
@@ -21,6 +22,7 @@ export function CreateSalesOrderPage() {
   ])
   const [items, setItems] = useState<Item[]>([])
   const [partnerList, setPartnerList] = useState<Partner[]>([])
+  const [ext, setExt] = useState<Record<string, unknown>>({})
   const [submitting, setSubmitting] = useState(false)
   const [error, setError] = useState<Error | null>(null)
@@ -52,6 +54,7 @@ export function CreateSalesOrderPage() {
     setError(null)
     setSubmitting(true)
     try {
+      const extPayload = Object.keys(ext).length > 0 ? ext : undefined
       const created = await salesOrders.create({
         code,
         partnerCode,
@@ -64,7 +67,8 @@ export function CreateSalesOrderPage() {
           unitPrice: Number(l.unitPrice),
           currencyCode,
         })),
-      })
+        ...(extPayload ? { ext: extPayload } : {}),
+      } as Parameters<typeof salesOrders.create>[0])
       navigate(`/sales-orders/${created.id}`)
     } catch (err: unknown) {
       setError(err instanceof Error ? err : new Error(String(err)))
@@ -177,6 +181,12 @@ export function CreateSalesOrderPage() {
           </div>
         </div>
+        <DynamicExtFields
+          entityName="SalesOrder"
+          values={ext}
+          onChange={(k, v) => setExt((prev) => ({ ...prev, [k]: v }))}
+        />
+
         {error && <ErrorBox error={error} />}
         <div className="flex items-center gap-3 pt-2">
@@ -4,6 +4,7 @@ import { catalog, inventory, production } from &#39;@/api/client&#39;
 import type { Item, Location } from '@/types/api'
 import { PageHeader } from '@/components/PageHeader'
 import { ErrorBox } from '@/components/ErrorBox'
+import { DynamicExtFields } from '@/components/DynamicExtFields'
 interface BomLine { itemCode: string; quantityPerUnit: string; sourceLocationCode: string }
 interface OpLine { operationCode: string; workCenter: string; standardMinutes: string }
@@ -18,6 +19,7 @@ export function CreateWorkOrderPage() {
   const [ops, setOps] = useState<OpLine[]>([])
   const [items, setItems] = useState<Item[]>([])
   const [locations, setLocations] = useState<Location[]>([])
+  const [ext, setExt] = useState<Record<string, unknown>>({})
   const [submitting, setSubmitting] = useState(false)
   const [error, setError] = useState<Error | null>(null)
@@ -47,6 +49,7 @@ export function CreateWorkOrderPage() {
     setError(null)
     setSubmitting(true)
     try {
+      const extPayload = Object.keys(ext).length > 0 ? ext : undefined
       const created = await production.createWorkOrder({
         code, outputItemCode,
         outputQuantity: Number(outputQuantity),
@@ -61,6 +64,7 @@ export function CreateWorkOrderPage() {
           workCenter: o.workCenter,
           standardMinutes: Number(o.standardMinutes),
         })),
+        ...(extPayload ? { ext: extPayload } : {}),
       })
       navigate(`/work-orders/${created.id}`)
     } catch (err: unknown) {
@@ -160,6 +164,11 @@ export function CreateWorkOrderPage() {
           </div>
         </div>
+        <DynamicExtFields
+          entityName="WorkOrder"
+          values={ext}
+          onChange={(k, v) => setExt((prev) => ({ ...prev, [k]: v }))}
+        />
         {error && <ErrorBox error={error} />}
         <button type="submit" className="btn-primary" disabled={submitting}>
           {submitting ? 'Creating...' : 'Create Work Order'}
@@ -145,6 +145,8 @@ export function MetadataAdminPage() {
   const [cfPii, setCfPii] = useState(false)
   const [cfLabelEn, setCfLabelEn] = useState('')
   const [cfLabelZh, setCfLabelZh] = useState('')
+  const [cfAllowedValues, setCfAllowedValues] = useState('')
+  const [cfMaxLength, setCfMaxLength] = useState('')
   const [cfSaving, setCfSaving] = useState(false)
   // ── Loaders ───────────────────────────────────────────────────────
@@ -192,6 +194,8 @@ export function MetadataAdminPage() {
     setCfTargetEntity('')
     setCfFieldKey('')
     setCfTypeKind('string')
+    setCfAllowedValues('')
+    setCfMaxLength('')
     setCfRequired(false)
     setCfPii(false)
     setCfLabelEn('')
@@ -222,7 +226,11 @@ export function MetadataAdminPage() {
     const body: Omit<CustomFieldDef, 'source'> = {
       key: cfFieldKey,
       targetEntity: cfTargetEntity,
-      type: { kind: cfTypeKind },
+      type: {
+        kind: cfTypeKind,
+        ...(cfTypeKind === 'enum' && cfAllowedValues ? { allowedValues: cfAllowedValues.split(',').map((v) => v.trim()).filter(Boolean) } : {}),
+        ...(cfTypeKind === 'string' && cfMaxLength ? { maxLength: Number(cfMaxLength) } : {}),
+      },
       required: cfRequired,
       pii: cfPii,
       labelTranslations: {
@@ -613,6 +621,34 @@ export function MetadataAdminPage() {
                       ))}
                     </select>
                   </div>
+                  {cfTypeKind === 'enum' && (
+                    <div>
+                      <label className="block text-xs font-medium text-slate-700">
+                        Allowed values (comma-separated)
+                      </label>
+                      <input
+                        type="text"
+                        value={cfAllowedValues}
+                        onChange={(e) => setCfAllowedValues(e.target.value)}
+                        placeholder="LOW, NORMAL, HIGH, URGENT"
+                        className="mt-1 w-full rounded-md border border-slate-300 px-2 py-1.5 text-sm"
+                      />
+                    </div>
+                  )}
+                  {cfTypeKind === 'string' && (
+                    <div>
+                      <label className="block text-xs font-medium text-slate-700">
+                        Max length
+                      </label>
+                      <input
+                        type="number"
+                        value={cfMaxLength}
+                        onChange={(e) => setCfMaxLength(e.target.value)}
+                        placeholder="255"
+                        className="mt-1 w-full rounded-md border border-slate-300 px-2 py-1.5 text-sm"
+                      />
+                    </div>
+                  )}
                   <div className="flex items-end gap-4 pb-1">
                     <label className="flex items-center gap-1.5 text-sm text-slate-700">
                       <input