Demo

How to

Quark ERP plugin လုပ်ငန်းအတွက် လုပ်ဆောင်ချက်အလိုက် လမ်းညွှန်ချက်များဖြစ်ပါသည် — plugin scaffold၊ public page၊ mobile UI၊ FAB၊ custom ဒေတာဘေ့စ်၊ caching၊ migration နှင့် plugin assets တို့ ပါဝင်ပါသည်။ စာမျက်နှာတိုင်းတွင် checklist နှင့် code ပါရှိပြီး၊ API အပြည့်အစုံကို Documentation တွင် ဖတ်ရှုနိုင်ပါသည်။

မည်သည့်နေရာမှ စတင်မည်နည်း

ပန်းတိုင်ကို သိရှိပြီး အတိုဆုံးနှင့် မှန်ကန်သော လမ်းကြောင်း လိုအပ်ပါက How to ကို အသုံးပြုပါ။ ပထမဆုံး စီမံကိန်း တည်ဆောက်ရန် Getting started ကို အသုံးပြုပါ။ API အပြည့်အစုံ၊ ရွေးချယ်စရာများနှင့် အစွန်းအကွက်များကို သိရှိလိုပါက Documentation ကို ဖတ်ရှုပါ။

  • ရလဒ် ရှင်းလင်းပြီး အဆင့်များနှင့် code လိုအပ်ပါက ဤလမ်းညွှန်ချက်များကို ဦးစားပေး အသုံးပြုပါ
  • Getting started — စီမံကိန်းအသစ်၊ CLI၊ ဖိုင်တွဲအပြင်အဆင်နှင့် ပထမဆုံး plugin
  • Documentation — backend / frontend API ကိုးကားချက် အပြည့်အစုံ
  • Troubleshooting — boot၊ DI၊ hot reload၊ Tailwind၊ 403 / UI ပျောက်ဆုံးမှု

Plugin ဖန်တီးခြင်း

@quan-erp/cli ဖြင့် scaffold လုပ်ပါ (သို့မဟုတ် sample-es ကို ကူးယူပါ)။ Folder၊ metadata၊ package အမည်နှင့် @quan-erp/* ဗားရှင်းများကို ကိုက်ညီအောင် ညှိပါ။ Feature ပထမဆုံး ထည့်သွင်းပြီး quan-erp watch ကို run ကာ Modules UI မှ Install လုပ်ပါ။

  • မည်သည့်အခါ — plugins/ အောက်တွင် plugin အသစ် စတင်တည်ဆောက်မည်ဆိုလျှင်
  • ရလဒ် — Install ပြီးနောက် shell တွင် menu နှင့် route များ ပေါ်လာပါသည်

Public page ဖန်တီးနည်း

ERP chrome အပြင်ဘက်ရှိ blank-layout page ကို AppRegistry.rootRoute.add() ဖြင့် မှတ်ပုံတင်ရပါသည် — route.add() မဟုတ်ပါ။ Customer portal၊ kitchen board နှင့် QR menu အတွက် အသုံးပြုပါသည်။

  • မည်သည့်အခါ — sidebar / admin shell ကို မပြသရပါက
  • အဓိက API — rootRoute.add နှင့် /${metadata.name} path prefix

Mobile responsive ပြုလုပ်နည်း

Desktop table နှင့် mobile card list ကို တွဲဖက်အသုံးပြုပါ။ useMediaQuery / SCREENS ကို သုံးပြီး၊ bottom-nav နှင့် FAB spacing ကို shared UI helper များနှင့် ကိုက်ညီအောင် ထားရှိပါ။

  • မည်သည့်အခါ — ဖုန်းနှင့် desktop နှစ်ခုလုံးတွင် အလုပ်လုပ်ရပါက
  • အဓိက အချက်များ — isMobile gate၊ card list နှင့် dense table

Floating action button ထည့်သွင်းခြင်း

@quan-erp/shared-ui မှ FloatingActionButton ဖြင့် mobile-only primary action ကို ထည့်သွင်းပါ။ isMobile ဖြင့် ပြသမှုကို ထိန်းချုပ်ပြီး၊ bottom nav မြင်ရပါက နေရာချထားမှုကို ပြောင်းလဲပါ။

  • မည်သည့်အခါ — mobile list တွင် create / primary action လိုအပ်ပါက
  • အဓိက API — FloatingActionButton၊ useIsContainInBottomNavBar

Database source အသစ် ထည့်သွင်းခြင်း

အများအားဖြင့် shared default DataSource (plugin: "default") ကို အသုံးပြုပါ။ သီးခြား host၊ schema၊ reporting DB သို့မဟုတ် replica လိုအပ်မှသာ root @Module ပေါ်တွင် @Database ဖြင့် custom connection ဖွင့်ရပါသည်။

  • မည်သည့်အခါ — shared Postgres ထက် သီးခြား isolation လိုအပ်ပါက
  • အဓိက API — @Database၊ ကိုက်ညီသော plugin + name entities၊ @InjectDatabaseSource

Caching ထည့်သွင်းခြင်း

Root module ပေါ်တွင် @Cache ဖြင့် cache ကို ကြေညာပါ (in-memory သို့မဟုတ် env မှ Redis)။ @CacheClient ဖြင့် inject လုပ်ပြီး၊ လိုအပ်ပါက @CacheRoute / @CacheFn ဖြင့် HTTP route သို့မဟုတ် method ရလဒ်ကို cache လုပ်နိုင်ပါသည်။

  • မည်သည့်အခါ — ထပ်ခါတလဲလဲ ဖတ်ရှုမှု၊ session/token သိုလှောင်မှု၊ ကုန်ကျစရိတ်များသော တွက်ချက်မှု
  • အဓိက API — @Cache၊ @CacheClient၊ route/method helper၊ cross-plugin ပြန်လည်အသုံးပြုမှု

Plugin အတွက် DB migration ဖန်တီးနည်း

IDatabaseMigration class များ (getName၊ getSource၊ up၊ down) ကို IPlugin.getMigrations() မှ ပြန်ပေး၍ schema ပြောင်းလဲမှုကို ပေးပို့ရပါသည်။ Production upgrade တွင် synchronize ကို မမှီခိုပါနှင့်။

  • မည်သည့်အခါ — schema ပြောင်းလဲမှု သို့မဟုတ် တစ်ကြိမ်သာလုပ်ရသော backfill
  • အဓိက API — IDatabaseMigration၊ getMigrations()၊ optional onMigrate()

Plugin frontend နှင့် backend assets

Static ဖိုင်များကို plugin နှင့်အတူ ပို့ဆောင်ပါ — backend သည် backend/assets/ နှင့် AppFolder ကို သုံးပြီး၊ frontend URL သည် PluginAssets.network ဖြင့် ရရှိပါသည်။ APP_DATA_FOLDER ကို hardcode မလုပ်ရပါ။ Runtime တွင် asset folder ထဲသို့ မရေးရပါ။

  • မည်သည့်အခါ — template၊ seed JSON၊ logo နှင့် bundled static ဖိုင်များ
  • အဓိက API — AppFolder.getPluginAssetFolder / getPluginDataFolder၊ PluginAssets.network