@rytass/bpm-core-react 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +49 -0
- package/dist/chunks/{approval-instance-list-page-BtEc8Cs3.js → approval-instance-list-page-BF2r5D2-.js} +2 -2
- package/dist/chunks/{approval-instance-list-page-BtEc8Cs3.js.map → approval-instance-list-page-BF2r5D2-.js.map} +1 -1
- package/dist/chunks/{approval-instance-list-page-UNIIgUZy.cjs → approval-instance-list-page-C5ZKPHdA.cjs} +2 -2
- package/dist/chunks/{approval-instance-list-page-UNIIgUZy.cjs.map → approval-instance-list-page-C5ZKPHdA.cjs.map} +1 -1
- package/dist/chunks/{auth-provider-D2P-qWmY.cjs → auth-provider-4BeCw7cI.cjs} +2 -2
- package/dist/chunks/{auth-provider-D2P-qWmY.cjs.map → auth-provider-4BeCw7cI.cjs.map} +1 -1
- package/dist/chunks/{auth-provider-TTO9eNZV.js → auth-provider-B5oPmvk2.js} +2 -2
- package/dist/chunks/{auth-provider-TTO9eNZV.js.map → auth-provider-B5oPmvk2.js.map} +1 -1
- package/dist/chunks/{builder-C3E-8OJu.js → builder-BLVnnpnP.js} +2 -2
- package/dist/chunks/{builder-C3E-8OJu.js.map → builder-BLVnnpnP.js.map} +1 -1
- package/dist/chunks/{builder-f-Q_0NUs.cjs → builder-DVE9zIKH.cjs} +2 -2
- package/dist/chunks/{builder-f-Q_0NUs.cjs.map → builder-DVE9zIKH.cjs.map} +1 -1
- package/dist/chunks/{dashboard-page-DrDChhg1.cjs → dashboard-page-CddG1MnK.cjs} +2 -2
- package/dist/chunks/{dashboard-page-DrDChhg1.cjs.map → dashboard-page-CddG1MnK.cjs.map} +1 -1
- package/dist/chunks/{dashboard-page-CQRBJxze.js → dashboard-page-Ib8srCMy.js} +3 -3
- package/dist/chunks/{dashboard-page-CQRBJxze.js.map → dashboard-page-Ib8srCMy.js.map} +1 -1
- package/dist/chunks/{delegations-CFXaJrdX.cjs → delegations-C2wLWsDQ.cjs} +2 -2
- package/dist/chunks/{delegations-CFXaJrdX.cjs.map → delegations-C2wLWsDQ.cjs.map} +1 -1
- package/dist/chunks/{delegations-DwbYkNUg.cjs → delegations-DDEk-WI6.cjs} +2 -2
- package/dist/chunks/{delegations-DwbYkNUg.cjs.map → delegations-DDEk-WI6.cjs.map} +1 -1
- package/dist/chunks/{delegations-FTLaWo1Y.js → delegations-ZNtodFaD.js} +2 -2
- package/dist/chunks/{delegations-FTLaWo1Y.js.map → delegations-ZNtodFaD.js.map} +1 -1
- package/dist/chunks/{delegations-D5pPEWsP.js → delegations-iVnRi3QE.js} +2 -2
- package/dist/chunks/{delegations-D5pPEWsP.js.map → delegations-iVnRi3QE.js.map} +1 -1
- package/dist/chunks/{detail-B9JkYNHc.cjs → detail-Dcr5mM8g.cjs} +2 -2
- package/dist/chunks/{detail-B9JkYNHc.cjs.map → detail-Dcr5mM8g.cjs.map} +1 -1
- package/dist/chunks/{detail-CSxI04gB.js → detail-u9DdLhDW.js} +2 -2
- package/dist/chunks/{detail-CSxI04gB.js.map → detail-u9DdLhDW.js.map} +1 -1
- package/dist/chunks/{login-BfmfCclF.cjs → login-9bCXyjbX.cjs} +2 -2
- package/dist/chunks/{login-BfmfCclF.cjs.map → login-9bCXyjbX.cjs.map} +1 -1
- package/dist/chunks/{login-xgI4wLHe.js → login-BKxpLibd.js} +3 -3
- package/dist/chunks/{login-xgI4wLHe.js.map → login-BKxpLibd.js.map} +1 -1
- package/dist/chunks/{notifications-a-FCxV02.cjs → notifications-BKs4--96.cjs} +2 -2
- package/dist/chunks/{notifications-a-FCxV02.cjs.map → notifications-BKs4--96.cjs.map} +1 -1
- package/dist/chunks/{notifications-BoNa1BXD.js → notifications-CSulztkU.js} +2 -2
- package/dist/chunks/{notifications-BoNa1BXD.js.map → notifications-CSulztkU.js.map} +1 -1
- package/dist/chunks/router-adapter--gYs13E8.cjs +2 -0
- package/dist/chunks/{router-adapter-BybHrCNP.cjs.map → router-adapter--gYs13E8.cjs.map} +1 -1
- package/dist/chunks/{router-adapter-BdHZXLS3.js → router-adapter-DftlFTOd.js} +2 -2
- package/dist/chunks/{router-adapter-BdHZXLS3.js.map → router-adapter-DftlFTOd.js.map} +1 -1
- package/dist/chunks/{templates-DNfDOPGm.js → templates-D44FSB46.js} +2 -2
- package/dist/chunks/{templates-DNfDOPGm.js.map → templates-D44FSB46.js.map} +1 -1
- package/dist/chunks/{templates-CL8bPvgn.cjs → templates-w96t83N-.cjs} +2 -2
- package/dist/chunks/{templates-CL8bPvgn.cjs.map → templates-w96t83N-.cjs.map} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +4 -4
- package/dist/next/BPMNextProviders.d.ts +1 -1
- package/dist/next/index.cjs +1 -1
- package/dist/next/index.cjs.map +1 -1
- package/dist/next/index.js +13 -23
- package/dist/next/index.js.map +1 -1
- package/dist/pages/admin/delegations/index.cjs +1 -1
- package/dist/pages/admin/delegations/index.js +1 -1
- package/dist/pages/delegations/index.cjs +1 -1
- package/dist/pages/delegations/index.js +1 -1
- package/dist/pages/forms/builder/index.cjs +1 -1
- package/dist/pages/forms/builder/index.js +1 -1
- package/dist/pages/instances/detail/index.cjs +1 -1
- package/dist/pages/instances/detail/index.js +1 -1
- package/dist/pages/login/index.cjs +1 -1
- package/dist/pages/login/index.js +1 -1
- package/dist/pages/settings/notifications/index.cjs +1 -1
- package/dist/pages/settings/notifications/index.js +1 -1
- package/dist/pages/templates/index.cjs +1 -1
- package/dist/pages/templates/index.js +1 -1
- package/dist/views/admin/delegations/index.cjs +1 -1
- package/dist/views/admin/delegations/index.js +1 -1
- package/dist/views/admin/index.cjs +1 -1
- package/dist/views/admin/index.js +1 -1
- package/dist/views/cc/index.cjs +1 -1
- package/dist/views/cc/index.js +1 -1
- package/dist/views/dashboard/index.cjs +1 -1
- package/dist/views/dashboard/index.js +1 -1
- package/dist/views/delegations/index.cjs +1 -1
- package/dist/views/delegations/index.js +1 -1
- package/dist/views/forms/builder/index.cjs +1 -1
- package/dist/views/forms/builder/index.js +1 -1
- package/dist/views/forms/index.cjs +1 -1
- package/dist/views/forms/index.js +1 -1
- package/dist/views/inbox/index.cjs +1 -1
- package/dist/views/inbox/index.js +2 -2
- package/dist/views/instances/detail/index.cjs +1 -1
- package/dist/views/instances/detail/index.js +1 -1
- package/dist/views/instances/new/index.cjs +1 -1
- package/dist/views/instances/new/index.js +2 -2
- package/dist/views/login/index.cjs +1 -1
- package/dist/views/login/index.js +1 -1
- package/dist/views/search/index.cjs +1 -1
- package/dist/views/search/index.js +1 -1
- package/dist/views/sent/index.cjs +1 -1
- package/dist/views/sent/index.js +1 -1
- package/dist/views/settings/index.cjs +1 -1
- package/dist/views/settings/index.js +1 -1
- package/dist/views/settings/notifications/index.cjs +1 -1
- package/dist/views/settings/notifications/index.js +1 -1
- package/dist/views/templates/designer/index.cjs +1 -1
- package/dist/views/templates/designer/index.js +1 -1
- package/dist/views/templates/index.cjs +1 -1
- package/dist/views/templates/index.js +1 -1
- package/dist/views/templates/versions/index.cjs +1 -1
- package/dist/views/templates/versions/index.js +1 -1
- package/package.json +1 -1
- package/dist/chunks/router-adapter-BybHrCNP.cjs +0 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";require('../login.css');const e=require("./router-adapter
|
|
2
|
-
//# sourceMappingURL=login-
|
|
1
|
+
"use client";require('../login.css');const e=require("./router-adapter--gYs13E8.cjs"),t=require("./auth-provider-4BeCw7cI.cjs");let n=require("react"),r=require("@mezzanine-ui/react"),i=require("@rytass/bpm-core-client"),a=require("react/jsx-runtime"),o=require("@mezzanine-ui/icons");var s={loginPage:`bpm_loginPage_BjzaI`,loginPanel:`bpm_loginPanel_xo0TW`,brand:`bpm_brand_KVmvZ`,brandLogo:`bpm_brandLogo_jxEAG`,form:`bpm_form_rKKP2`,demoUsers:`bpm_demoUsers_g-5Hd`,demoUserList:`bpm_demoUserList_IxtKp`,demoUserButton:`bpm_demoUserButton_YdkSa`},c=`/rytass-logo.png`,l=`lin.ceo@example.internal`,u=`demo`;function d({logoSrc:d=c,defaultIdentifier:p=l,defaultPassword:h=u,defaultNextPath:g,brandTitle:_=`BPM Admin`,brandSubtitle:v=`BPM API 登入`}={}){let y=e.r(),{loading:b,login:x,member:S}=t.n(),[C,w]=(0,n.useState)([]),[T,E]=(0,n.useState)(null),[D,O]=(0,n.useState)(p),[k,A]=(0,n.useState)(h),[j,M]=(0,n.useState)(!1);(0,n.useEffect)(()=>{b||!S||y.replace(f(g))},[g,b,S,y]),(0,n.useEffect)(()=>{(async()=>{try{w(await(0,i.listApiTestMembers)())}catch{w([])}})()},[]);let N=(0,n.useCallback)(async e=>{e.preventDefault(),E(null),M(!0);try{await x({identifier:D,password:k}),y.replace(f(g))}catch(e){E(m(e))}finally{M(!1)}},[g,D,x,k,y]);function P(e){O(e.target.value)}function F(e){A(e.target.value)}return(0,a.jsx)(`main`,{className:s.loginPage,children:(0,a.jsxs)(`section`,{className:s.loginPanel,children:[(0,a.jsxs)(`div`,{className:s.brand,children:[(0,a.jsx)(`img`,{alt:``,className:s.brandLogo,src:d}),(0,a.jsxs)(`div`,{children:[(0,a.jsx)(r.Typography,{variant:`h3`,children:_}),(0,a.jsx)(r.Typography,{color:`text-neutral`,variant:`body`,children:v})]})]}),(0,a.jsxs)(`form`,{className:s.form,onSubmit:N,children:[(0,a.jsxs)(`label`,{children:[(0,a.jsx)(r.Typography,{color:`text-neutral`,variant:`caption`,children:`帳號`}),(0,a.jsx)(r.Input,{fullWidth:!0,name:`identifier`,onChange:P,placeholder:`member id 或 email`,value:D})]}),(0,a.jsxs)(`label`,{children:[(0,a.jsx)(r.Typography,{color:`text-neutral`,variant:`caption`,children:`密碼`}),(0,a.jsx)(r.Input,{fullWidth:!0,inputType:`password`,name:`password`,onChange:F,value:k,variant:`password`})]}),T?(0,a.jsx)(r.Typography,{color:`text-error`,variant:`body`,children:T}):null,(0,a.jsx)(r.Button,{disabled:j,icon:o.LoginIcon,iconType:`leading`,type:`submit`,variant:`base-primary`,children:`登入`})]}),C.length?(0,a.jsxs)(`div`,{className:s.demoUsers,children:[(0,a.jsx)(r.Typography,{color:`text-neutral`,variant:`caption`,children:`測試帳號`}),(0,a.jsx)(`div`,{className:s.demoUserList,children:C.map(e=>(0,a.jsxs)(`button`,{className:s.demoUserButton,onClick:()=>O(e.email),type:`button`,children:[(0,a.jsx)(`span`,{children:e.name}),(0,a.jsx)(`span`,{children:e.email})]},e.memberId))})]}):null]})})}function f(e){if(e&&e.startsWith(`/`)&&!e.startsWith(`//`))return e;let t=p().get(`next`);return!t||!t.startsWith(`/`)||t.startsWith(`//`)?`/`:t}function p(){return typeof window>`u`?new URLSearchParams:new URLSearchParams(window.location.search)}function m(e){return e instanceof Error?e.message:`登入失敗`}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return d}});
|
|
2
|
+
//# sourceMappingURL=login-9bCXyjbX.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"login-BfmfCclF.cjs","names":[],"sources":["../../src/views/login/login.module.scss","../../src/views/login/LoginView.tsx"],"sourcesContent":[".loginPage {\n align-items: center;\n background: var(--mzn-color-bg-body);\n display: flex;\n min-height: 100vh;\n justify-content: center;\n padding: 32px;\n}\n\n.loginPanel {\n border: 1px solid var(--mzn-color-border);\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n gap: 28px;\n max-width: 440px;\n padding: 32px;\n width: 100%;\n}\n\n.brand {\n align-items: center;\n display: flex;\n gap: 14px;\n}\n\n.brandLogo {\n border-radius: 8px;\n height: 40px;\n width: 40px;\n object-fit: contain;\n}\n\n.form {\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\n.demoUsers {\n border-top: 1px solid var(--mzn-color-border);\n display: flex;\n flex-direction: column;\n gap: 10px;\n padding-top: 20px;\n}\n\n.demoUserList {\n display: grid;\n gap: 8px;\n}\n\n.demoUserButton {\n background: transparent;\n border: 1px solid var(--mzn-color-border);\n border-radius: 6px;\n color: inherit;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n font: inherit;\n gap: 2px;\n padding: 10px 12px;\n text-align: left;\n}\n\n.demoUserButton:hover {\n border-color: var(--mzn-color-primary);\n}\n\n.demoUserButton span:last-child {\n color: var(--mzn-color-text-secondary);\n font-size: 12px;\n}\n","'use client';\n\nimport {\n useCallback,\n useEffect,\n useState,\n type ChangeEvent,\n type FormEvent,\n type ReactElement,\n} from 'react';\nimport { Button, Input, Typography } from '@mezzanine-ui/react';\nimport { LoginIcon } from '@mezzanine-ui/icons';\nimport {\n listApiTestMembers,\n type ApiPublicMember,\n} from '@rytass/bpm-core-client';\nimport { useAuth } from '../../lib/auth-provider';\nimport { useRouterAdapter } from '../../lib/router-adapter';\nimport styles from './login.module.scss';\n\nexport interface LoginViewProps {\n /**\n * Logo image URL. Renders an inline `<img>` so the view stays framework\n * agnostic (no `next/image` dependency). Defaults to\n * `/rytass-logo.png` — host should serve a static asset at that path or\n * override via this prop.\n */\n readonly logoSrc?: string;\n /**\n * Pre-fill the identifier input. Defaults to the seeded demo account\n * email so the form is usable out of the box.\n */\n readonly defaultIdentifier?: string;\n /**\n * Pre-fill the password input. Defaults to the seeded demo password\n * (`'demo'`). Production hosts should pass an empty string.\n */\n readonly defaultPassword?: string;\n /**\n * Custom redirect target after a successful login. Defaults to reading\n * `?next=` from the host router's search params, falling back to `'/'`.\n */\n readonly defaultNextPath?: string;\n /**\n * Override the BPM admin brand title shown above the form. Defaults to\n * `'BPM Admin'`.\n */\n readonly brandTitle?: string;\n /**\n * Override the brand subtitle shown above the form. Defaults to\n * `'BPM API 登入'`.\n */\n readonly brandSubtitle?: string;\n}\n\nconst DEFAULT_LOGO = '/rytass-logo.png';\nconst DEFAULT_IDENTIFIER = 'lin.ceo@example.internal';\nconst DEFAULT_PASSWORD = 'demo';\n\n/**\n * Login UI for the BPM admin host. Renders the brand mark, identifier /\n * password fields, and a \"test members\" picker fed by\n * `listApiTestMembers()`. Self-contained: composes Mezzanine UI primitives,\n * reads the auth context, and uses the host router adapter to redirect on\n * success.\n *\n * Wrap with `<AuthProvider>` (and indirectly `<RouterAdapterProvider>`)\n * higher in the tree. The `pages/login` subpath ships a thin Next.js\n * wrapper that exports `default` (Server Component) and `metadata`.\n */\nexport function LoginView({\n logoSrc = DEFAULT_LOGO,\n defaultIdentifier = DEFAULT_IDENTIFIER,\n defaultPassword = DEFAULT_PASSWORD,\n defaultNextPath,\n brandTitle = 'BPM Admin',\n brandSubtitle = 'BPM API 登入',\n}: LoginViewProps = {}): ReactElement {\n const router = useRouterAdapter();\n const { loading, login, member } = useAuth();\n const [testMembers, setTestMembers] = useState<readonly ApiPublicMember[]>(\n [],\n );\n const [error, setError] = useState<string | null>(null);\n const [identifier, setIdentifier] = useState(defaultIdentifier);\n const [password, setPassword] = useState(defaultPassword);\n const [submitting, setSubmitting] = useState(false);\n\n useEffect((): void => {\n if (loading || !member) return;\n router.replace(resolveNextPath(defaultNextPath));\n }, [defaultNextPath, loading, member, router]);\n\n useEffect((): void => {\n void (async () => {\n try {\n setTestMembers(await listApiTestMembers());\n } catch {\n setTestMembers([]);\n }\n })();\n }, []);\n\n const handleSubmit = useCallback(\n async (event: FormEvent<HTMLFormElement>): Promise<void> => {\n event.preventDefault();\n setError(null);\n setSubmitting(true);\n try {\n await login({ identifier, password });\n router.replace(resolveNextPath(defaultNextPath));\n } catch (loginError: unknown) {\n setError(readErrorMessage(loginError));\n } finally {\n setSubmitting(false);\n }\n },\n [defaultNextPath, identifier, login, password, router],\n );\n\n function handleIdentifierChange(event: ChangeEvent<HTMLInputElement>): void {\n setIdentifier(event.target.value);\n }\n function handlePasswordChange(event: ChangeEvent<HTMLInputElement>): void {\n setPassword(event.target.value);\n }\n\n return (\n <main className={styles.loginPage}>\n <section className={styles.loginPanel}>\n <div className={styles.brand}>\n <img alt=\"\" className={styles.brandLogo} src={logoSrc} />\n <div>\n <Typography variant=\"h3\">{brandTitle}</Typography>\n <Typography color=\"text-neutral\" variant=\"body\">\n {brandSubtitle}\n </Typography>\n </div>\n </div>\n\n <form className={styles.form} onSubmit={handleSubmit}>\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 帳號\n </Typography>\n <Input\n fullWidth\n name=\"identifier\"\n onChange={handleIdentifierChange}\n placeholder=\"member id 或 email\"\n value={identifier}\n />\n </label>\n\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 密碼\n </Typography>\n <Input\n fullWidth\n inputType=\"password\"\n name=\"password\"\n onChange={handlePasswordChange}\n value={password}\n variant=\"password\"\n />\n </label>\n\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n\n <Button\n disabled={submitting}\n icon={LoginIcon}\n iconType=\"leading\"\n type=\"submit\"\n variant=\"base-primary\"\n >\n 登入\n </Button>\n </form>\n\n {testMembers.length ? (\n <div className={styles.demoUsers}>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 測試帳號\n </Typography>\n <div className={styles.demoUserList}>\n {testMembers.map((testMember) => (\n <button\n className={styles.demoUserButton}\n key={testMember.memberId}\n onClick={(): void => setIdentifier(testMember.email)}\n type=\"button\"\n >\n <span>{testMember.name}</span>\n <span>{testMember.email}</span>\n </button>\n ))}\n </div>\n </div>\n ) : null}\n </section>\n </main>\n );\n}\n\nfunction resolveNextPath(fallback: string | undefined): string {\n if (fallback && fallback.startsWith('/') && !fallback.startsWith('//')) {\n return fallback;\n }\n const params = readBrowserSearchParams();\n const next = params.get('next');\n if (!next || !next.startsWith('/') || next.startsWith('//')) {\n return '/';\n }\n return next;\n}\n\nfunction readBrowserSearchParams(): URLSearchParams {\n if (typeof window === 'undefined') return new URLSearchParams();\n return new URLSearchParams(window.location.search);\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '登入失敗';\n}\n"],"mappings":"6gBCuDM,EAAe,mBACf,EAAqB,2BACrB,EAAmB,OAazB,SAAgB,EAAU,CACxB,UAAU,EACV,oBAAoB,EACpB,kBAAkB,EAClB,kBACA,aAAa,YACb,gBAAgB,cACE,CAAC,EAAiB,CACpC,IAAM,EAAS,EAAA,EAAiB,EAC1B,CAAE,UAAS,QAAO,UAAW,EAAA,EAAQ,EACrC,CAAC,EAAa,IAAA,EAAA,EAAA,UAClB,CAAC,CACH,EACM,CAAC,EAAO,IAAA,EAAA,EAAA,UAAoC,IAAI,EAChD,CAAC,EAAY,IAAA,EAAA,EAAA,UAA0B,CAAiB,EACxD,CAAC,EAAU,IAAA,EAAA,EAAA,UAAwB,CAAe,EAClD,CAAC,EAAY,IAAA,EAAA,EAAA,UAA0B,EAAK,GAElD,EAAA,EAAA,eAAsB,CAChB,GAAW,CAAC,GAChB,EAAO,QAAQ,EAAgB,CAAe,CAAC,CACjD,EAAG,CAAC,EAAiB,EAAS,EAAQ,CAAM,CAAC,GAE7C,EAAA,EAAA,eAAsB,EACd,SAAY,CAChB,GAAI,CACF,EAAe,MAAA,EAAA,EAAA,oBAAyB,CAAC,CAC3C,MAAQ,CACN,EAAe,CAAC,CAAC,CACnB,CACF,GAAG,CACL,EAAG,CAAC,CAAC,EAEL,IAAM,GAAA,EAAA,EAAA,aACJ,KAAO,IAAqD,CAC1D,EAAM,eAAe,EACrB,EAAS,IAAI,EACb,EAAc,EAAI,EAClB,GAAI,CACF,MAAM,EAAM,CAAE,aAAY,UAAS,CAAC,EACpC,EAAO,QAAQ,EAAgB,CAAe,CAAC,CACjD,OAAS,EAAqB,CAC5B,EAAS,EAAiB,CAAU,CAAC,CACvC,QAAU,CACR,EAAc,EAAK,CACrB,CACF,EACA,CAAC,EAAiB,EAAY,EAAO,EAAU,CAAM,CACvD,EAEA,SAAS,EAAuB,EAA4C,CAC1E,EAAc,EAAM,OAAO,KAAK,CAClC,CACA,SAAS,EAAqB,EAA4C,CACxE,EAAY,EAAM,OAAO,KAAK,CAChC,CAEA,OACE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAO,oBACtB,EAAA,EAAA,MAAC,UAAD,CAAS,UAAW,EAAO,oBAA3B,EACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,EAAO,eAAvB,EACE,EAAA,EAAA,KAAC,MAAD,CAAK,IAAI,GAAG,UAAW,EAAO,UAAW,IAAK,CAAU,CAAA,GACxD,EAAA,EAAA,MAAC,MAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,QAAQ,cAAM,CAAuB,CAAA,GACjD,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,MAAM,eAAe,QAAQ,gBACtC,CACS,CAAA,CACT,CAAA,CAAA,CACF,KAEL,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAO,KAAM,SAAU,WAAxC,EACE,EAAA,EAAA,MAAC,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,MAAM,eAAe,QAAQ,mBAAU,IAEvC,CAAA,GACZ,EAAA,EAAA,KAAC,EAAA,MAAD,CACE,UAAA,GACA,KAAK,aACL,SAAU,EACV,YAAY,oBACZ,MAAO,CACR,CAAA,CACI,CAAA,CAAA,GAEP,EAAA,EAAA,MAAC,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,MAAM,eAAe,QAAQ,mBAAU,IAEvC,CAAA,GACZ,EAAA,EAAA,KAAC,EAAA,MAAD,CACE,UAAA,GACA,UAAU,WACV,KAAK,WACL,SAAU,EACV,MAAO,EACP,QAAQ,UACT,CAAA,CACI,CAAA,CAAA,EAEN,GACC,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,MAAM,aAAa,QAAQ,gBACpC,CACS,CAAA,EACV,MAEJ,EAAA,EAAA,KAAC,EAAA,OAAD,CACE,SAAU,EACV,KAAM,EAAA,UACN,SAAS,UACT,KAAK,SACL,QAAQ,wBACT,IAEO,CAAA,CACJ,IAEL,EAAY,QACX,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,EAAO,mBAAvB,EACE,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,MAAM,eAAe,QAAQ,mBAAU,MAEvC,CAAA,GACZ,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAO,sBACpB,EAAY,IAAK,IAChB,EAAA,EAAA,MAAC,SAAD,CACE,UAAW,EAAO,eAElB,YAAqB,EAAc,EAAW,KAAK,EACnD,KAAK,kBAJP,EAME,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAW,IAAW,CAAA,GAC7B,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAW,KAAY,CAAA,CACxB,GAND,EAAW,QAMV,CACT,CACE,CAAA,CACF,IACH,IACG,GACL,CAAA,CAEV,CAEA,SAAS,EAAgB,EAAsC,CAC7D,GAAI,GAAY,EAAS,WAAW,GAAG,GAAK,CAAC,EAAS,WAAW,IAAI,EACnE,OAAO,EAGT,IAAM,EADS,EACF,EAAO,IAAI,MAAM,EAI9B,MAHI,CAAC,GAAQ,CAAC,EAAK,WAAW,GAAG,GAAK,EAAK,WAAW,IAAI,EACjD,IAEF,CACT,CAEA,SAAS,GAA2C,CAElD,OADI,OAAO,OAAW,IAAoB,IAAI,gBACvC,IAAI,gBAAgB,OAAO,SAAS,MAAM,CACnD,CAEA,SAAS,EAAiB,EAAwB,CAChD,OAAO,aAAiB,MAAQ,EAAM,QAAU,MAClD"}
|
|
1
|
+
{"version":3,"file":"login-9bCXyjbX.cjs","names":[],"sources":["../../src/views/login/login.module.scss","../../src/views/login/LoginView.tsx"],"sourcesContent":[".loginPage {\n align-items: center;\n background: var(--mzn-color-bg-body);\n display: flex;\n min-height: 100vh;\n justify-content: center;\n padding: 32px;\n}\n\n.loginPanel {\n border: 1px solid var(--mzn-color-border);\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n gap: 28px;\n max-width: 440px;\n padding: 32px;\n width: 100%;\n}\n\n.brand {\n align-items: center;\n display: flex;\n gap: 14px;\n}\n\n.brandLogo {\n border-radius: 8px;\n height: 40px;\n width: 40px;\n object-fit: contain;\n}\n\n.form {\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\n.demoUsers {\n border-top: 1px solid var(--mzn-color-border);\n display: flex;\n flex-direction: column;\n gap: 10px;\n padding-top: 20px;\n}\n\n.demoUserList {\n display: grid;\n gap: 8px;\n}\n\n.demoUserButton {\n background: transparent;\n border: 1px solid var(--mzn-color-border);\n border-radius: 6px;\n color: inherit;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n font: inherit;\n gap: 2px;\n padding: 10px 12px;\n text-align: left;\n}\n\n.demoUserButton:hover {\n border-color: var(--mzn-color-primary);\n}\n\n.demoUserButton span:last-child {\n color: var(--mzn-color-text-secondary);\n font-size: 12px;\n}\n","'use client';\n\nimport {\n useCallback,\n useEffect,\n useState,\n type ChangeEvent,\n type FormEvent,\n type ReactElement,\n} from 'react';\nimport { Button, Input, Typography } from '@mezzanine-ui/react';\nimport { LoginIcon } from '@mezzanine-ui/icons';\nimport {\n listApiTestMembers,\n type ApiPublicMember,\n} from '@rytass/bpm-core-client';\nimport { useAuth } from '../../lib/auth-provider';\nimport { useRouterAdapter } from '../../lib/router-adapter';\nimport styles from './login.module.scss';\n\nexport interface LoginViewProps {\n /**\n * Logo image URL. Renders an inline `<img>` so the view stays framework\n * agnostic (no `next/image` dependency). Defaults to\n * `/rytass-logo.png` — host should serve a static asset at that path or\n * override via this prop.\n */\n readonly logoSrc?: string;\n /**\n * Pre-fill the identifier input. Defaults to the seeded demo account\n * email so the form is usable out of the box.\n */\n readonly defaultIdentifier?: string;\n /**\n * Pre-fill the password input. Defaults to the seeded demo password\n * (`'demo'`). Production hosts should pass an empty string.\n */\n readonly defaultPassword?: string;\n /**\n * Custom redirect target after a successful login. Defaults to reading\n * `?next=` from the host router's search params, falling back to `'/'`.\n */\n readonly defaultNextPath?: string;\n /**\n * Override the BPM admin brand title shown above the form. Defaults to\n * `'BPM Admin'`.\n */\n readonly brandTitle?: string;\n /**\n * Override the brand subtitle shown above the form. Defaults to\n * `'BPM API 登入'`.\n */\n readonly brandSubtitle?: string;\n}\n\nconst DEFAULT_LOGO = '/rytass-logo.png';\nconst DEFAULT_IDENTIFIER = 'lin.ceo@example.internal';\nconst DEFAULT_PASSWORD = 'demo';\n\n/**\n * Login UI for the BPM admin host. Renders the brand mark, identifier /\n * password fields, and a \"test members\" picker fed by\n * `listApiTestMembers()`. Self-contained: composes Mezzanine UI primitives,\n * reads the auth context, and uses the host router adapter to redirect on\n * success.\n *\n * Wrap with `<AuthProvider>` (and indirectly `<RouterAdapterProvider>`)\n * higher in the tree. The `pages/login` subpath ships a thin Next.js\n * wrapper that exports `default` (Server Component) and `metadata`.\n */\nexport function LoginView({\n logoSrc = DEFAULT_LOGO,\n defaultIdentifier = DEFAULT_IDENTIFIER,\n defaultPassword = DEFAULT_PASSWORD,\n defaultNextPath,\n brandTitle = 'BPM Admin',\n brandSubtitle = 'BPM API 登入',\n}: LoginViewProps = {}): ReactElement {\n const router = useRouterAdapter();\n const { loading, login, member } = useAuth();\n const [testMembers, setTestMembers] = useState<readonly ApiPublicMember[]>(\n [],\n );\n const [error, setError] = useState<string | null>(null);\n const [identifier, setIdentifier] = useState(defaultIdentifier);\n const [password, setPassword] = useState(defaultPassword);\n const [submitting, setSubmitting] = useState(false);\n\n useEffect((): void => {\n if (loading || !member) return;\n router.replace(resolveNextPath(defaultNextPath));\n }, [defaultNextPath, loading, member, router]);\n\n useEffect((): void => {\n void (async () => {\n try {\n setTestMembers(await listApiTestMembers());\n } catch {\n setTestMembers([]);\n }\n })();\n }, []);\n\n const handleSubmit = useCallback(\n async (event: FormEvent<HTMLFormElement>): Promise<void> => {\n event.preventDefault();\n setError(null);\n setSubmitting(true);\n try {\n await login({ identifier, password });\n router.replace(resolveNextPath(defaultNextPath));\n } catch (loginError: unknown) {\n setError(readErrorMessage(loginError));\n } finally {\n setSubmitting(false);\n }\n },\n [defaultNextPath, identifier, login, password, router],\n );\n\n function handleIdentifierChange(event: ChangeEvent<HTMLInputElement>): void {\n setIdentifier(event.target.value);\n }\n function handlePasswordChange(event: ChangeEvent<HTMLInputElement>): void {\n setPassword(event.target.value);\n }\n\n return (\n <main className={styles.loginPage}>\n <section className={styles.loginPanel}>\n <div className={styles.brand}>\n <img alt=\"\" className={styles.brandLogo} src={logoSrc} />\n <div>\n <Typography variant=\"h3\">{brandTitle}</Typography>\n <Typography color=\"text-neutral\" variant=\"body\">\n {brandSubtitle}\n </Typography>\n </div>\n </div>\n\n <form className={styles.form} onSubmit={handleSubmit}>\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 帳號\n </Typography>\n <Input\n fullWidth\n name=\"identifier\"\n onChange={handleIdentifierChange}\n placeholder=\"member id 或 email\"\n value={identifier}\n />\n </label>\n\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 密碼\n </Typography>\n <Input\n fullWidth\n inputType=\"password\"\n name=\"password\"\n onChange={handlePasswordChange}\n value={password}\n variant=\"password\"\n />\n </label>\n\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n\n <Button\n disabled={submitting}\n icon={LoginIcon}\n iconType=\"leading\"\n type=\"submit\"\n variant=\"base-primary\"\n >\n 登入\n </Button>\n </form>\n\n {testMembers.length ? (\n <div className={styles.demoUsers}>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 測試帳號\n </Typography>\n <div className={styles.demoUserList}>\n {testMembers.map((testMember) => (\n <button\n className={styles.demoUserButton}\n key={testMember.memberId}\n onClick={(): void => setIdentifier(testMember.email)}\n type=\"button\"\n >\n <span>{testMember.name}</span>\n <span>{testMember.email}</span>\n </button>\n ))}\n </div>\n </div>\n ) : null}\n </section>\n </main>\n );\n}\n\nfunction resolveNextPath(fallback: string | undefined): string {\n if (fallback && fallback.startsWith('/') && !fallback.startsWith('//')) {\n return fallback;\n }\n const params = readBrowserSearchParams();\n const next = params.get('next');\n if (!next || !next.startsWith('/') || next.startsWith('//')) {\n return '/';\n }\n return next;\n}\n\nfunction readBrowserSearchParams(): URLSearchParams {\n if (typeof window === 'undefined') return new URLSearchParams();\n return new URLSearchParams(window.location.search);\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '登入失敗';\n}\n"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { r as e } from "./router-adapter-
|
|
3
|
-
import { n as t } from "./auth-provider-
|
|
2
|
+
import { r as e } from "./router-adapter-DftlFTOd.js";
|
|
3
|
+
import { n as t } from "./auth-provider-B5oPmvk2.js";
|
|
4
4
|
import { useCallback as n, useEffect as r, useState as i } from "react";
|
|
5
5
|
import { Button as a, Input as o, Typography as s } from "@mezzanine-ui/react";
|
|
6
6
|
import { listApiTestMembers as c } from "@rytass/bpm-core-client";
|
|
@@ -155,4 +155,4 @@ function y(e) {
|
|
|
155
155
|
//#endregion
|
|
156
156
|
export { g as t };
|
|
157
157
|
|
|
158
|
-
//# sourceMappingURL=login-
|
|
158
|
+
//# sourceMappingURL=login-BKxpLibd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"login-xgI4wLHe.js","names":[],"sources":["../../src/views/login/login.module.scss","../../src/views/login/LoginView.tsx"],"sourcesContent":[".loginPage {\n align-items: center;\n background: var(--mzn-color-bg-body);\n display: flex;\n min-height: 100vh;\n justify-content: center;\n padding: 32px;\n}\n\n.loginPanel {\n border: 1px solid var(--mzn-color-border);\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n gap: 28px;\n max-width: 440px;\n padding: 32px;\n width: 100%;\n}\n\n.brand {\n align-items: center;\n display: flex;\n gap: 14px;\n}\n\n.brandLogo {\n border-radius: 8px;\n height: 40px;\n width: 40px;\n object-fit: contain;\n}\n\n.form {\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\n.demoUsers {\n border-top: 1px solid var(--mzn-color-border);\n display: flex;\n flex-direction: column;\n gap: 10px;\n padding-top: 20px;\n}\n\n.demoUserList {\n display: grid;\n gap: 8px;\n}\n\n.demoUserButton {\n background: transparent;\n border: 1px solid var(--mzn-color-border);\n border-radius: 6px;\n color: inherit;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n font: inherit;\n gap: 2px;\n padding: 10px 12px;\n text-align: left;\n}\n\n.demoUserButton:hover {\n border-color: var(--mzn-color-primary);\n}\n\n.demoUserButton span:last-child {\n color: var(--mzn-color-text-secondary);\n font-size: 12px;\n}\n","'use client';\n\nimport {\n useCallback,\n useEffect,\n useState,\n type ChangeEvent,\n type FormEvent,\n type ReactElement,\n} from 'react';\nimport { Button, Input, Typography } from '@mezzanine-ui/react';\nimport { LoginIcon } from '@mezzanine-ui/icons';\nimport {\n listApiTestMembers,\n type ApiPublicMember,\n} from '@rytass/bpm-core-client';\nimport { useAuth } from '../../lib/auth-provider';\nimport { useRouterAdapter } from '../../lib/router-adapter';\nimport styles from './login.module.scss';\n\nexport interface LoginViewProps {\n /**\n * Logo image URL. Renders an inline `<img>` so the view stays framework\n * agnostic (no `next/image` dependency). Defaults to\n * `/rytass-logo.png` — host should serve a static asset at that path or\n * override via this prop.\n */\n readonly logoSrc?: string;\n /**\n * Pre-fill the identifier input. Defaults to the seeded demo account\n * email so the form is usable out of the box.\n */\n readonly defaultIdentifier?: string;\n /**\n * Pre-fill the password input. Defaults to the seeded demo password\n * (`'demo'`). Production hosts should pass an empty string.\n */\n readonly defaultPassword?: string;\n /**\n * Custom redirect target after a successful login. Defaults to reading\n * `?next=` from the host router's search params, falling back to `'/'`.\n */\n readonly defaultNextPath?: string;\n /**\n * Override the BPM admin brand title shown above the form. Defaults to\n * `'BPM Admin'`.\n */\n readonly brandTitle?: string;\n /**\n * Override the brand subtitle shown above the form. Defaults to\n * `'BPM API 登入'`.\n */\n readonly brandSubtitle?: string;\n}\n\nconst DEFAULT_LOGO = '/rytass-logo.png';\nconst DEFAULT_IDENTIFIER = 'lin.ceo@example.internal';\nconst DEFAULT_PASSWORD = 'demo';\n\n/**\n * Login UI for the BPM admin host. Renders the brand mark, identifier /\n * password fields, and a \"test members\" picker fed by\n * `listApiTestMembers()`. Self-contained: composes Mezzanine UI primitives,\n * reads the auth context, and uses the host router adapter to redirect on\n * success.\n *\n * Wrap with `<AuthProvider>` (and indirectly `<RouterAdapterProvider>`)\n * higher in the tree. The `pages/login` subpath ships a thin Next.js\n * wrapper that exports `default` (Server Component) and `metadata`.\n */\nexport function LoginView({\n logoSrc = DEFAULT_LOGO,\n defaultIdentifier = DEFAULT_IDENTIFIER,\n defaultPassword = DEFAULT_PASSWORD,\n defaultNextPath,\n brandTitle = 'BPM Admin',\n brandSubtitle = 'BPM API 登入',\n}: LoginViewProps = {}): ReactElement {\n const router = useRouterAdapter();\n const { loading, login, member } = useAuth();\n const [testMembers, setTestMembers] = useState<readonly ApiPublicMember[]>(\n [],\n );\n const [error, setError] = useState<string | null>(null);\n const [identifier, setIdentifier] = useState(defaultIdentifier);\n const [password, setPassword] = useState(defaultPassword);\n const [submitting, setSubmitting] = useState(false);\n\n useEffect((): void => {\n if (loading || !member) return;\n router.replace(resolveNextPath(defaultNextPath));\n }, [defaultNextPath, loading, member, router]);\n\n useEffect((): void => {\n void (async () => {\n try {\n setTestMembers(await listApiTestMembers());\n } catch {\n setTestMembers([]);\n }\n })();\n }, []);\n\n const handleSubmit = useCallback(\n async (event: FormEvent<HTMLFormElement>): Promise<void> => {\n event.preventDefault();\n setError(null);\n setSubmitting(true);\n try {\n await login({ identifier, password });\n router.replace(resolveNextPath(defaultNextPath));\n } catch (loginError: unknown) {\n setError(readErrorMessage(loginError));\n } finally {\n setSubmitting(false);\n }\n },\n [defaultNextPath, identifier, login, password, router],\n );\n\n function handleIdentifierChange(event: ChangeEvent<HTMLInputElement>): void {\n setIdentifier(event.target.value);\n }\n function handlePasswordChange(event: ChangeEvent<HTMLInputElement>): void {\n setPassword(event.target.value);\n }\n\n return (\n <main className={styles.loginPage}>\n <section className={styles.loginPanel}>\n <div className={styles.brand}>\n <img alt=\"\" className={styles.brandLogo} src={logoSrc} />\n <div>\n <Typography variant=\"h3\">{brandTitle}</Typography>\n <Typography color=\"text-neutral\" variant=\"body\">\n {brandSubtitle}\n </Typography>\n </div>\n </div>\n\n <form className={styles.form} onSubmit={handleSubmit}>\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 帳號\n </Typography>\n <Input\n fullWidth\n name=\"identifier\"\n onChange={handleIdentifierChange}\n placeholder=\"member id 或 email\"\n value={identifier}\n />\n </label>\n\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 密碼\n </Typography>\n <Input\n fullWidth\n inputType=\"password\"\n name=\"password\"\n onChange={handlePasswordChange}\n value={password}\n variant=\"password\"\n />\n </label>\n\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n\n <Button\n disabled={submitting}\n icon={LoginIcon}\n iconType=\"leading\"\n type=\"submit\"\n variant=\"base-primary\"\n >\n 登入\n </Button>\n </form>\n\n {testMembers.length ? (\n <div className={styles.demoUsers}>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 測試帳號\n </Typography>\n <div className={styles.demoUserList}>\n {testMembers.map((testMember) => (\n <button\n className={styles.demoUserButton}\n key={testMember.memberId}\n onClick={(): void => setIdentifier(testMember.email)}\n type=\"button\"\n >\n <span>{testMember.name}</span>\n <span>{testMember.email}</span>\n </button>\n ))}\n </div>\n </div>\n ) : null}\n </section>\n </main>\n );\n}\n\nfunction resolveNextPath(fallback: string | undefined): string {\n if (fallback && fallback.startsWith('/') && !fallback.startsWith('//')) {\n return fallback;\n }\n const params = readBrowserSearchParams();\n const next = params.get('next');\n if (!next || !next.startsWith('/') || next.startsWith('//')) {\n return '/';\n }\n return next;\n}\n\nfunction readBrowserSearchParams(): URLSearchParams {\n if (typeof window === 'undefined') return new URLSearchParams();\n return new URLSearchParams(window.location.search);\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '登入失敗';\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"login-BKxpLibd.js","names":[],"sources":["../../src/views/login/login.module.scss","../../src/views/login/LoginView.tsx"],"sourcesContent":[".loginPage {\n align-items: center;\n background: var(--mzn-color-bg-body);\n display: flex;\n min-height: 100vh;\n justify-content: center;\n padding: 32px;\n}\n\n.loginPanel {\n border: 1px solid var(--mzn-color-border);\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n gap: 28px;\n max-width: 440px;\n padding: 32px;\n width: 100%;\n}\n\n.brand {\n align-items: center;\n display: flex;\n gap: 14px;\n}\n\n.brandLogo {\n border-radius: 8px;\n height: 40px;\n width: 40px;\n object-fit: contain;\n}\n\n.form {\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\n.demoUsers {\n border-top: 1px solid var(--mzn-color-border);\n display: flex;\n flex-direction: column;\n gap: 10px;\n padding-top: 20px;\n}\n\n.demoUserList {\n display: grid;\n gap: 8px;\n}\n\n.demoUserButton {\n background: transparent;\n border: 1px solid var(--mzn-color-border);\n border-radius: 6px;\n color: inherit;\n cursor: pointer;\n display: flex;\n flex-direction: column;\n font: inherit;\n gap: 2px;\n padding: 10px 12px;\n text-align: left;\n}\n\n.demoUserButton:hover {\n border-color: var(--mzn-color-primary);\n}\n\n.demoUserButton span:last-child {\n color: var(--mzn-color-text-secondary);\n font-size: 12px;\n}\n","'use client';\n\nimport {\n useCallback,\n useEffect,\n useState,\n type ChangeEvent,\n type FormEvent,\n type ReactElement,\n} from 'react';\nimport { Button, Input, Typography } from '@mezzanine-ui/react';\nimport { LoginIcon } from '@mezzanine-ui/icons';\nimport {\n listApiTestMembers,\n type ApiPublicMember,\n} from '@rytass/bpm-core-client';\nimport { useAuth } from '../../lib/auth-provider';\nimport { useRouterAdapter } from '../../lib/router-adapter';\nimport styles from './login.module.scss';\n\nexport interface LoginViewProps {\n /**\n * Logo image URL. Renders an inline `<img>` so the view stays framework\n * agnostic (no `next/image` dependency). Defaults to\n * `/rytass-logo.png` — host should serve a static asset at that path or\n * override via this prop.\n */\n readonly logoSrc?: string;\n /**\n * Pre-fill the identifier input. Defaults to the seeded demo account\n * email so the form is usable out of the box.\n */\n readonly defaultIdentifier?: string;\n /**\n * Pre-fill the password input. Defaults to the seeded demo password\n * (`'demo'`). Production hosts should pass an empty string.\n */\n readonly defaultPassword?: string;\n /**\n * Custom redirect target after a successful login. Defaults to reading\n * `?next=` from the host router's search params, falling back to `'/'`.\n */\n readonly defaultNextPath?: string;\n /**\n * Override the BPM admin brand title shown above the form. Defaults to\n * `'BPM Admin'`.\n */\n readonly brandTitle?: string;\n /**\n * Override the brand subtitle shown above the form. Defaults to\n * `'BPM API 登入'`.\n */\n readonly brandSubtitle?: string;\n}\n\nconst DEFAULT_LOGO = '/rytass-logo.png';\nconst DEFAULT_IDENTIFIER = 'lin.ceo@example.internal';\nconst DEFAULT_PASSWORD = 'demo';\n\n/**\n * Login UI for the BPM admin host. Renders the brand mark, identifier /\n * password fields, and a \"test members\" picker fed by\n * `listApiTestMembers()`. Self-contained: composes Mezzanine UI primitives,\n * reads the auth context, and uses the host router adapter to redirect on\n * success.\n *\n * Wrap with `<AuthProvider>` (and indirectly `<RouterAdapterProvider>`)\n * higher in the tree. The `pages/login` subpath ships a thin Next.js\n * wrapper that exports `default` (Server Component) and `metadata`.\n */\nexport function LoginView({\n logoSrc = DEFAULT_LOGO,\n defaultIdentifier = DEFAULT_IDENTIFIER,\n defaultPassword = DEFAULT_PASSWORD,\n defaultNextPath,\n brandTitle = 'BPM Admin',\n brandSubtitle = 'BPM API 登入',\n}: LoginViewProps = {}): ReactElement {\n const router = useRouterAdapter();\n const { loading, login, member } = useAuth();\n const [testMembers, setTestMembers] = useState<readonly ApiPublicMember[]>(\n [],\n );\n const [error, setError] = useState<string | null>(null);\n const [identifier, setIdentifier] = useState(defaultIdentifier);\n const [password, setPassword] = useState(defaultPassword);\n const [submitting, setSubmitting] = useState(false);\n\n useEffect((): void => {\n if (loading || !member) return;\n router.replace(resolveNextPath(defaultNextPath));\n }, [defaultNextPath, loading, member, router]);\n\n useEffect((): void => {\n void (async () => {\n try {\n setTestMembers(await listApiTestMembers());\n } catch {\n setTestMembers([]);\n }\n })();\n }, []);\n\n const handleSubmit = useCallback(\n async (event: FormEvent<HTMLFormElement>): Promise<void> => {\n event.preventDefault();\n setError(null);\n setSubmitting(true);\n try {\n await login({ identifier, password });\n router.replace(resolveNextPath(defaultNextPath));\n } catch (loginError: unknown) {\n setError(readErrorMessage(loginError));\n } finally {\n setSubmitting(false);\n }\n },\n [defaultNextPath, identifier, login, password, router],\n );\n\n function handleIdentifierChange(event: ChangeEvent<HTMLInputElement>): void {\n setIdentifier(event.target.value);\n }\n function handlePasswordChange(event: ChangeEvent<HTMLInputElement>): void {\n setPassword(event.target.value);\n }\n\n return (\n <main className={styles.loginPage}>\n <section className={styles.loginPanel}>\n <div className={styles.brand}>\n <img alt=\"\" className={styles.brandLogo} src={logoSrc} />\n <div>\n <Typography variant=\"h3\">{brandTitle}</Typography>\n <Typography color=\"text-neutral\" variant=\"body\">\n {brandSubtitle}\n </Typography>\n </div>\n </div>\n\n <form className={styles.form} onSubmit={handleSubmit}>\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 帳號\n </Typography>\n <Input\n fullWidth\n name=\"identifier\"\n onChange={handleIdentifierChange}\n placeholder=\"member id 或 email\"\n value={identifier}\n />\n </label>\n\n <label>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 密碼\n </Typography>\n <Input\n fullWidth\n inputType=\"password\"\n name=\"password\"\n onChange={handlePasswordChange}\n value={password}\n variant=\"password\"\n />\n </label>\n\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n\n <Button\n disabled={submitting}\n icon={LoginIcon}\n iconType=\"leading\"\n type=\"submit\"\n variant=\"base-primary\"\n >\n 登入\n </Button>\n </form>\n\n {testMembers.length ? (\n <div className={styles.demoUsers}>\n <Typography color=\"text-neutral\" variant=\"caption\">\n 測試帳號\n </Typography>\n <div className={styles.demoUserList}>\n {testMembers.map((testMember) => (\n <button\n className={styles.demoUserButton}\n key={testMember.memberId}\n onClick={(): void => setIdentifier(testMember.email)}\n type=\"button\"\n >\n <span>{testMember.name}</span>\n <span>{testMember.email}</span>\n </button>\n ))}\n </div>\n </div>\n ) : null}\n </section>\n </main>\n );\n}\n\nfunction resolveNextPath(fallback: string | undefined): string {\n if (fallback && fallback.startsWith('/') && !fallback.startsWith('//')) {\n return fallback;\n }\n const params = readBrowserSearchParams();\n const next = params.get('next');\n if (!next || !next.startsWith('/') || next.startsWith('//')) {\n return '/';\n }\n return next;\n}\n\nfunction readBrowserSearchParams(): URLSearchParams {\n if (typeof window === 'undefined') return new URLSearchParams();\n return new URLSearchParams(window.location.search);\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '登入失敗';\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";require('../notifications.css');const e=require("./chunk-CMqjfN_6.cjs"),t=require("./auth-provider-
|
|
2
|
-
//# sourceMappingURL=notifications-
|
|
1
|
+
"use client";require('../notifications.css');const e=require("./chunk-CMqjfN_6.cjs"),t=require("./auth-provider-4BeCw7cI.cjs");let n=require("react"),r=require("@mezzanine-ui/react"),i=require("react/jsx-runtime"),a=require("@rytass/bpm-core-client/workflow"),o=require("@mezzanine-ui/react/ContentHeader");o=e.t(o,1);let s=require("@mezzanine-ui/core/form");var c={preferenceFilter:`bpm_preferenceFilter_snhMa`,segmentFilterControl:`bpm_segmentFilterControl_piBnq`,segmentFilterLabel:`bpm_segmentFilterLabel_U0z8J`},l=[{id:`INSTANT`,name:`即時通知`},{id:`DAILY`,name:`每日摘要`}],u=[{id:`ON`,name:`開`},{id:`OFF`,name:`關`}],d={emailDigestMode:`INSTANT`,emailEnabled:!0,inAppEnabled:!0,memberId:``,quietHoursEnd:null,quietHoursStart:null,updatedAt:``};function f(){let{member:e}=t.n(),f=e?.memberId??null,[v,y]=(0,n.useState)(d),[b,x]=(0,n.useState)(!0),[S,C]=(0,n.useState)(!1),[w,T]=(0,n.useState)(null);(0,n.useEffect)(()=>{f&&(x(!0),T(null),(0,a.readNotificationPreference)(f).then(e=>{y(e)}).catch(e=>{T(_(e))}).finally(()=>{x(!1)}))},[f]);async function E(e){if(!f||S)return;let t=v;y(e),C(!0);try{y(await(0,a.updateNotificationPreference)({emailDigestMode:e.emailDigestMode,emailEnabled:e.emailEnabled,inAppEnabled:e.inAppEnabled,memberId:f,quietHoursEnd:e.quietHoursEnd,quietHoursStart:e.quietHoursStart}))}catch(e){y(t),T(_(e))}finally{C(!1)}}let D=b||S;return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(r.PageHeader,{children:(0,i.jsx)(o.default,{description:`調整站內通知、Email 通知與摘要頻率。`,title:`通知設定`})}),(0,i.jsx)(r.SectionGroup,{children:(0,i.jsx)(r.Section,{filterArea:(0,i.jsx)(r.FilterArea,{className:c.preferenceFilter,isDirty:!1,children:(0,i.jsxs)(r.FilterLine,{children:[(0,i.jsx)(r.Filter,{minWidth:160,span:1,children:(0,i.jsx)(r.FormField,{layout:s.FormFieldLayout.VERTICAL,name:`inAppEnabled`,style:p,children:(0,i.jsxs)(`div`,{className:c.segmentFilterControl,children:[(0,i.jsx)(`span`,{className:c.segmentFilterLabel,children:`站內通知`}),(0,i.jsx)(r.RadioGroup,{disabled:D,name:`inAppEnabled`,onChange:e=>{E({...v,inAppEnabled:h(e.target.value)})},options:[...u],size:`sub`,type:`segment`,value:g(v.inAppEnabled)})]})})}),(0,i.jsx)(r.Filter,{minWidth:180,span:1,children:(0,i.jsx)(r.FormField,{layout:s.FormFieldLayout.VERTICAL,name:`emailEnabled`,style:p,children:(0,i.jsxs)(`div`,{className:c.segmentFilterControl,children:[(0,i.jsx)(`span`,{className:c.segmentFilterLabel,children:`Email 通知`}),(0,i.jsx)(r.RadioGroup,{disabled:D,name:`emailEnabled`,onChange:e=>{E({...v,emailEnabled:h(e.target.value)})},options:[...u],size:`sub`,type:`segment`,value:g(v.emailEnabled)})]})})}),(0,i.jsx)(r.Filter,{minWidth:280,span:2,children:(0,i.jsx)(r.FormField,{fullWidth:!0,layout:s.FormFieldLayout.VERTICAL,name:`emailDigestMode`,style:p,children:(0,i.jsxs)(`div`,{className:c.segmentFilterControl,children:[(0,i.jsx)(`span`,{className:c.segmentFilterLabel,children:`Email 頻率`}),(0,i.jsx)(r.RadioGroup,{disabled:D,name:`emailDigestMode`,onChange:e=>{E({...v,emailDigestMode:m(e.target.value)})},options:[...l],size:`sub`,type:`segment`,value:v.emailDigestMode})]})})})]})}),children:w?(0,i.jsx)(r.Typography,{color:`text-error`,variant:`body`,children:w}):(0,i.jsx)(r.Typography,{color:`text-neutral`,variant:`body`,children:`偏好設定會立即生效。`})})})]})}var p={minWidth:0,whiteSpace:`nowrap`};function m(e){return e===`DAILY`?`DAILY`:`INSTANT`}function h(e){return e!==`OFF`}function g(e){return e?`ON`:`OFF`}function _(e){return e instanceof Error?e.message:`發生未知錯誤`}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return f}});
|
|
2
|
+
//# sourceMappingURL=notifications-BKs4--96.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notifications-a-FCxV02.cjs","names":[],"sources":["../../src/views/settings/notifications/notification-settings.module.scss","../../src/views/settings/notifications/SettingsNotificationsView.tsx"],"sourcesContent":[".preferenceFilter {\n :global(.mzn-filter-area__actions) {\n display: none;\n }\n\n :global(.mzn-form-field__label-area) {\n display: none;\n }\n\n :global(.mzn-form-field__control-field-slot--main) {\n width: 100%;\n min-width: 0;\n }\n}\n\n.segmentFilterControl {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n min-width: 0;\n white-space: nowrap;\n\n :global(.mzn-input-check-group--segmented) {\n align-self: flex-start;\n transform: translateY(-7px);\n }\n}\n\n.segmentFilterLabel {\n flex: 0 0 auto;\n color: var(--mzn-color-text-primary, #1f2937);\n font-size: 13px;\n line-height: 16px;\n}\n","'use client';\n\nimport {\n ChangeEvent,\n CSSProperties,\n ReactElement,\n useEffect,\n useState,\n} from 'react';\nimport {\n Filter,\n FilterArea,\n FilterLine,\n FormField,\n PageHeader,\n RadioGroup,\n Section,\n SectionGroup,\n Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport { useAuth } from '../../../lib/auth-provider';\nimport {\n NotificationDigestMode,\n NotificationPreferenceRecord,\n readNotificationPreference,\n updateNotificationPreference,\n} from '@rytass/bpm-core-client/workflow';\nimport styles from './notification-settings.module.scss';\n\ninterface DigestOption {\n readonly id: NotificationDigestMode;\n readonly name: string;\n}\n\ntype EnabledSegmentValue = 'OFF' | 'ON';\n\ninterface EnabledSegmentOption {\n readonly id: EnabledSegmentValue;\n readonly name: string;\n}\n\nconst DIGEST_OPTIONS: readonly DigestOption[] = [\n { id: 'INSTANT', name: '即時通知' },\n { id: 'DAILY', name: '每日摘要' },\n];\n\nconst ENABLED_SEGMENT_OPTIONS: readonly EnabledSegmentOption[] = [\n { id: 'ON', name: '開' },\n { id: 'OFF', name: '關' },\n];\n\nconst DEFAULT_PREFERENCE: NotificationPreferenceRecord = {\n emailDigestMode: 'INSTANT',\n emailEnabled: true,\n inAppEnabled: true,\n memberId: '',\n quietHoursEnd: null,\n quietHoursStart: null,\n updatedAt: '',\n};\n\n\nexport function SettingsNotificationsView(): ReactElement {\n const { member } = useAuth();\n const currentMemberId = member?.memberId ?? null;\n const [preference, setPreference] =\n useState<NotificationPreferenceRecord>(DEFAULT_PREFERENCE);\n const [loading, setLoading] = useState(true);\n const [saving, setSaving] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n useEffect((): void => {\n if (!currentMemberId) {\n return;\n }\n\n setLoading(true);\n setError(null);\n\n readNotificationPreference(currentMemberId)\n .then((nextPreference): void => {\n setPreference(nextPreference);\n })\n .catch((requestError: unknown): void => {\n setError(readErrorMessage(requestError));\n })\n .finally((): void => {\n setLoading(false);\n });\n }, [currentMemberId]);\n\n async function handlePreferenceChange(\n nextPreference: NotificationPreferenceRecord,\n ): Promise<void> {\n if (!currentMemberId || saving) {\n return;\n }\n\n const previousPreference = preference;\n setPreference(nextPreference);\n setSaving(true);\n\n try {\n setPreference(\n await updateNotificationPreference({\n emailDigestMode: nextPreference.emailDigestMode,\n emailEnabled: nextPreference.emailEnabled,\n inAppEnabled: nextPreference.inAppEnabled,\n memberId: currentMemberId,\n quietHoursEnd: nextPreference.quietHoursEnd,\n quietHoursStart: nextPreference.quietHoursStart,\n }),\n );\n } catch (requestError: unknown) {\n setPreference(previousPreference);\n setError(readErrorMessage(requestError));\n } finally {\n setSaving(false);\n }\n }\n\n const controlsDisabled = loading || saving;\n\n return (\n <>\n <PageHeader>\n <ContentHeader\n description=\"調整站內通知、Email 通知與摘要頻率。\"\n title=\"通知設定\"\n />\n </PageHeader>\n\n <SectionGroup>\n <Section\n filterArea={\n <FilterArea className={styles.preferenceFilter} isDirty={false}>\n <FilterLine>\n <Filter minWidth={160} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"inAppEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n 站內通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"inAppEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n inAppEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.inAppEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={180} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"emailEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.emailEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={280} span={2}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"emailDigestMode\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 頻率\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailDigestMode\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailDigestMode: readDigestMode(\n event.target.value,\n ),\n });\n }}\n options={[...DIGEST_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={preference.emailDigestMode}\n />\n </div>\n </FormField>\n </Filter>\n </FilterLine>\n </FilterArea>\n }\n >\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : (\n <Typography color=\"text-neutral\" variant=\"body\">\n 偏好設定會立即生效。\n </Typography>\n )}\n </Section>\n </SectionGroup>\n </>\n );\n}\n\nconst FILTER_FIELD_STYLE = {\n minWidth: 0,\n whiteSpace: 'nowrap',\n} satisfies CSSProperties;\n\nfunction readDigestMode(value: unknown): NotificationDigestMode {\n return value === 'DAILY' ? 'DAILY' : 'INSTANT';\n}\n\nfunction readEnabledSegmentValue(value: unknown): boolean {\n return value !== 'OFF';\n}\n\nfunction readEnabledSegmentValueId(enabled: boolean): EnabledSegmentValue {\n return enabled ? 'ON' : 'OFF';\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"notifications-BKs4--96.cjs","names":[],"sources":["../../src/views/settings/notifications/notification-settings.module.scss","../../src/views/settings/notifications/SettingsNotificationsView.tsx"],"sourcesContent":[".preferenceFilter {\n :global(.mzn-filter-area__actions) {\n display: none;\n }\n\n :global(.mzn-form-field__label-area) {\n display: none;\n }\n\n :global(.mzn-form-field__control-field-slot--main) {\n width: 100%;\n min-width: 0;\n }\n}\n\n.segmentFilterControl {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n min-width: 0;\n white-space: nowrap;\n\n :global(.mzn-input-check-group--segmented) {\n align-self: flex-start;\n transform: translateY(-7px);\n }\n}\n\n.segmentFilterLabel {\n flex: 0 0 auto;\n color: var(--mzn-color-text-primary, #1f2937);\n font-size: 13px;\n line-height: 16px;\n}\n","'use client';\n\nimport {\n ChangeEvent,\n CSSProperties,\n ReactElement,\n useEffect,\n useState,\n} from 'react';\nimport {\n Filter,\n FilterArea,\n FilterLine,\n FormField,\n PageHeader,\n RadioGroup,\n Section,\n SectionGroup,\n Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport { useAuth } from '../../../lib/auth-provider';\nimport {\n NotificationDigestMode,\n NotificationPreferenceRecord,\n readNotificationPreference,\n updateNotificationPreference,\n} from '@rytass/bpm-core-client/workflow';\nimport styles from './notification-settings.module.scss';\n\ninterface DigestOption {\n readonly id: NotificationDigestMode;\n readonly name: string;\n}\n\ntype EnabledSegmentValue = 'OFF' | 'ON';\n\ninterface EnabledSegmentOption {\n readonly id: EnabledSegmentValue;\n readonly name: string;\n}\n\nconst DIGEST_OPTIONS: readonly DigestOption[] = [\n { id: 'INSTANT', name: '即時通知' },\n { id: 'DAILY', name: '每日摘要' },\n];\n\nconst ENABLED_SEGMENT_OPTIONS: readonly EnabledSegmentOption[] = [\n { id: 'ON', name: '開' },\n { id: 'OFF', name: '關' },\n];\n\nconst DEFAULT_PREFERENCE: NotificationPreferenceRecord = {\n emailDigestMode: 'INSTANT',\n emailEnabled: true,\n inAppEnabled: true,\n memberId: '',\n quietHoursEnd: null,\n quietHoursStart: null,\n updatedAt: '',\n};\n\n\nexport function SettingsNotificationsView(): ReactElement {\n const { member } = useAuth();\n const currentMemberId = member?.memberId ?? null;\n const [preference, setPreference] =\n useState<NotificationPreferenceRecord>(DEFAULT_PREFERENCE);\n const [loading, setLoading] = useState(true);\n const [saving, setSaving] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n useEffect((): void => {\n if (!currentMemberId) {\n return;\n }\n\n setLoading(true);\n setError(null);\n\n readNotificationPreference(currentMemberId)\n .then((nextPreference): void => {\n setPreference(nextPreference);\n })\n .catch((requestError: unknown): void => {\n setError(readErrorMessage(requestError));\n })\n .finally((): void => {\n setLoading(false);\n });\n }, [currentMemberId]);\n\n async function handlePreferenceChange(\n nextPreference: NotificationPreferenceRecord,\n ): Promise<void> {\n if (!currentMemberId || saving) {\n return;\n }\n\n const previousPreference = preference;\n setPreference(nextPreference);\n setSaving(true);\n\n try {\n setPreference(\n await updateNotificationPreference({\n emailDigestMode: nextPreference.emailDigestMode,\n emailEnabled: nextPreference.emailEnabled,\n inAppEnabled: nextPreference.inAppEnabled,\n memberId: currentMemberId,\n quietHoursEnd: nextPreference.quietHoursEnd,\n quietHoursStart: nextPreference.quietHoursStart,\n }),\n );\n } catch (requestError: unknown) {\n setPreference(previousPreference);\n setError(readErrorMessage(requestError));\n } finally {\n setSaving(false);\n }\n }\n\n const controlsDisabled = loading || saving;\n\n return (\n <>\n <PageHeader>\n <ContentHeader\n description=\"調整站內通知、Email 通知與摘要頻率。\"\n title=\"通知設定\"\n />\n </PageHeader>\n\n <SectionGroup>\n <Section\n filterArea={\n <FilterArea className={styles.preferenceFilter} isDirty={false}>\n <FilterLine>\n <Filter minWidth={160} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"inAppEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n 站內通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"inAppEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n inAppEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.inAppEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={180} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"emailEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.emailEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={280} span={2}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"emailDigestMode\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 頻率\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailDigestMode\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailDigestMode: readDigestMode(\n event.target.value,\n ),\n });\n }}\n options={[...DIGEST_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={preference.emailDigestMode}\n />\n </div>\n </FormField>\n </Filter>\n </FilterLine>\n </FilterArea>\n }\n >\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : (\n <Typography color=\"text-neutral\" variant=\"body\">\n 偏好設定會立即生效。\n </Typography>\n )}\n </Section>\n </SectionGroup>\n </>\n );\n}\n\nconst FILTER_FIELD_STYLE = {\n minWidth: 0,\n whiteSpace: 'nowrap',\n} satisfies CSSProperties;\n\nfunction readDigestMode(value: unknown): NotificationDigestMode {\n return value === 'DAILY' ? 'DAILY' : 'INSTANT';\n}\n\nfunction readEnabledSegmentValue(value: unknown): boolean {\n return value !== 'OFF';\n}\n\nfunction readEnabledSegmentValueId(enabled: boolean): EnabledSegmentValue {\n return enabled ? 'ON' : 'OFF';\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { n as e } from "./auth-provider-
|
|
2
|
+
import { n as e } from "./auth-provider-B5oPmvk2.js";
|
|
3
3
|
import { useEffect as t, useState as n } from "react";
|
|
4
4
|
import { Filter as r, FilterArea as i, FilterLine as a, FormField as o, PageHeader as s, RadioGroup as c, Section as l, SectionGroup as u, Typography as d } from "@mezzanine-ui/react";
|
|
5
5
|
import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
|
|
@@ -190,4 +190,4 @@ function O(e) {
|
|
|
190
190
|
//#endregion
|
|
191
191
|
export { C as t };
|
|
192
192
|
|
|
193
|
-
//# sourceMappingURL=notifications-
|
|
193
|
+
//# sourceMappingURL=notifications-CSulztkU.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notifications-BoNa1BXD.js","names":[],"sources":["../../src/views/settings/notifications/notification-settings.module.scss","../../src/views/settings/notifications/SettingsNotificationsView.tsx"],"sourcesContent":[".preferenceFilter {\n :global(.mzn-filter-area__actions) {\n display: none;\n }\n\n :global(.mzn-form-field__label-area) {\n display: none;\n }\n\n :global(.mzn-form-field__control-field-slot--main) {\n width: 100%;\n min-width: 0;\n }\n}\n\n.segmentFilterControl {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n min-width: 0;\n white-space: nowrap;\n\n :global(.mzn-input-check-group--segmented) {\n align-self: flex-start;\n transform: translateY(-7px);\n }\n}\n\n.segmentFilterLabel {\n flex: 0 0 auto;\n color: var(--mzn-color-text-primary, #1f2937);\n font-size: 13px;\n line-height: 16px;\n}\n","'use client';\n\nimport {\n ChangeEvent,\n CSSProperties,\n ReactElement,\n useEffect,\n useState,\n} from 'react';\nimport {\n Filter,\n FilterArea,\n FilterLine,\n FormField,\n PageHeader,\n RadioGroup,\n Section,\n SectionGroup,\n Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport { useAuth } from '../../../lib/auth-provider';\nimport {\n NotificationDigestMode,\n NotificationPreferenceRecord,\n readNotificationPreference,\n updateNotificationPreference,\n} from '@rytass/bpm-core-client/workflow';\nimport styles from './notification-settings.module.scss';\n\ninterface DigestOption {\n readonly id: NotificationDigestMode;\n readonly name: string;\n}\n\ntype EnabledSegmentValue = 'OFF' | 'ON';\n\ninterface EnabledSegmentOption {\n readonly id: EnabledSegmentValue;\n readonly name: string;\n}\n\nconst DIGEST_OPTIONS: readonly DigestOption[] = [\n { id: 'INSTANT', name: '即時通知' },\n { id: 'DAILY', name: '每日摘要' },\n];\n\nconst ENABLED_SEGMENT_OPTIONS: readonly EnabledSegmentOption[] = [\n { id: 'ON', name: '開' },\n { id: 'OFF', name: '關' },\n];\n\nconst DEFAULT_PREFERENCE: NotificationPreferenceRecord = {\n emailDigestMode: 'INSTANT',\n emailEnabled: true,\n inAppEnabled: true,\n memberId: '',\n quietHoursEnd: null,\n quietHoursStart: null,\n updatedAt: '',\n};\n\n\nexport function SettingsNotificationsView(): ReactElement {\n const { member } = useAuth();\n const currentMemberId = member?.memberId ?? null;\n const [preference, setPreference] =\n useState<NotificationPreferenceRecord>(DEFAULT_PREFERENCE);\n const [loading, setLoading] = useState(true);\n const [saving, setSaving] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n useEffect((): void => {\n if (!currentMemberId) {\n return;\n }\n\n setLoading(true);\n setError(null);\n\n readNotificationPreference(currentMemberId)\n .then((nextPreference): void => {\n setPreference(nextPreference);\n })\n .catch((requestError: unknown): void => {\n setError(readErrorMessage(requestError));\n })\n .finally((): void => {\n setLoading(false);\n });\n }, [currentMemberId]);\n\n async function handlePreferenceChange(\n nextPreference: NotificationPreferenceRecord,\n ): Promise<void> {\n if (!currentMemberId || saving) {\n return;\n }\n\n const previousPreference = preference;\n setPreference(nextPreference);\n setSaving(true);\n\n try {\n setPreference(\n await updateNotificationPreference({\n emailDigestMode: nextPreference.emailDigestMode,\n emailEnabled: nextPreference.emailEnabled,\n inAppEnabled: nextPreference.inAppEnabled,\n memberId: currentMemberId,\n quietHoursEnd: nextPreference.quietHoursEnd,\n quietHoursStart: nextPreference.quietHoursStart,\n }),\n );\n } catch (requestError: unknown) {\n setPreference(previousPreference);\n setError(readErrorMessage(requestError));\n } finally {\n setSaving(false);\n }\n }\n\n const controlsDisabled = loading || saving;\n\n return (\n <>\n <PageHeader>\n <ContentHeader\n description=\"調整站內通知、Email 通知與摘要頻率。\"\n title=\"通知設定\"\n />\n </PageHeader>\n\n <SectionGroup>\n <Section\n filterArea={\n <FilterArea className={styles.preferenceFilter} isDirty={false}>\n <FilterLine>\n <Filter minWidth={160} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"inAppEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n 站內通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"inAppEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n inAppEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.inAppEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={180} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"emailEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.emailEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={280} span={2}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"emailDigestMode\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 頻率\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailDigestMode\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailDigestMode: readDigestMode(\n event.target.value,\n ),\n });\n }}\n options={[...DIGEST_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={preference.emailDigestMode}\n />\n </div>\n </FormField>\n </Filter>\n </FilterLine>\n </FilterArea>\n }\n >\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : (\n <Typography color=\"text-neutral\" variant=\"body\">\n 偏好設定會立即生效。\n </Typography>\n )}\n </Section>\n </SectionGroup>\n </>\n );\n}\n\nconst FILTER_FIELD_STYLE = {\n minWidth: 0,\n whiteSpace: 'nowrap',\n} satisfies CSSProperties;\n\nfunction readDigestMode(value: unknown): NotificationDigestMode {\n return value === 'DAILY' ? 'DAILY' : 'INSTANT';\n}\n\nfunction readEnabledSegmentValue(value: unknown): boolean {\n return value !== 'OFF';\n}\n\nfunction readEnabledSegmentValueId(enabled: boolean): EnabledSegmentValue {\n return enabled ? 'ON' : 'OFF';\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"notifications-CSulztkU.js","names":[],"sources":["../../src/views/settings/notifications/notification-settings.module.scss","../../src/views/settings/notifications/SettingsNotificationsView.tsx"],"sourcesContent":[".preferenceFilter {\n :global(.mzn-filter-area__actions) {\n display: none;\n }\n\n :global(.mzn-form-field__label-area) {\n display: none;\n }\n\n :global(.mzn-form-field__control-field-slot--main) {\n width: 100%;\n min-width: 0;\n }\n}\n\n.segmentFilterControl {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n min-width: 0;\n white-space: nowrap;\n\n :global(.mzn-input-check-group--segmented) {\n align-self: flex-start;\n transform: translateY(-7px);\n }\n}\n\n.segmentFilterLabel {\n flex: 0 0 auto;\n color: var(--mzn-color-text-primary, #1f2937);\n font-size: 13px;\n line-height: 16px;\n}\n","'use client';\n\nimport {\n ChangeEvent,\n CSSProperties,\n ReactElement,\n useEffect,\n useState,\n} from 'react';\nimport {\n Filter,\n FilterArea,\n FilterLine,\n FormField,\n PageHeader,\n RadioGroup,\n Section,\n SectionGroup,\n Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport { useAuth } from '../../../lib/auth-provider';\nimport {\n NotificationDigestMode,\n NotificationPreferenceRecord,\n readNotificationPreference,\n updateNotificationPreference,\n} from '@rytass/bpm-core-client/workflow';\nimport styles from './notification-settings.module.scss';\n\ninterface DigestOption {\n readonly id: NotificationDigestMode;\n readonly name: string;\n}\n\ntype EnabledSegmentValue = 'OFF' | 'ON';\n\ninterface EnabledSegmentOption {\n readonly id: EnabledSegmentValue;\n readonly name: string;\n}\n\nconst DIGEST_OPTIONS: readonly DigestOption[] = [\n { id: 'INSTANT', name: '即時通知' },\n { id: 'DAILY', name: '每日摘要' },\n];\n\nconst ENABLED_SEGMENT_OPTIONS: readonly EnabledSegmentOption[] = [\n { id: 'ON', name: '開' },\n { id: 'OFF', name: '關' },\n];\n\nconst DEFAULT_PREFERENCE: NotificationPreferenceRecord = {\n emailDigestMode: 'INSTANT',\n emailEnabled: true,\n inAppEnabled: true,\n memberId: '',\n quietHoursEnd: null,\n quietHoursStart: null,\n updatedAt: '',\n};\n\n\nexport function SettingsNotificationsView(): ReactElement {\n const { member } = useAuth();\n const currentMemberId = member?.memberId ?? null;\n const [preference, setPreference] =\n useState<NotificationPreferenceRecord>(DEFAULT_PREFERENCE);\n const [loading, setLoading] = useState(true);\n const [saving, setSaving] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n useEffect((): void => {\n if (!currentMemberId) {\n return;\n }\n\n setLoading(true);\n setError(null);\n\n readNotificationPreference(currentMemberId)\n .then((nextPreference): void => {\n setPreference(nextPreference);\n })\n .catch((requestError: unknown): void => {\n setError(readErrorMessage(requestError));\n })\n .finally((): void => {\n setLoading(false);\n });\n }, [currentMemberId]);\n\n async function handlePreferenceChange(\n nextPreference: NotificationPreferenceRecord,\n ): Promise<void> {\n if (!currentMemberId || saving) {\n return;\n }\n\n const previousPreference = preference;\n setPreference(nextPreference);\n setSaving(true);\n\n try {\n setPreference(\n await updateNotificationPreference({\n emailDigestMode: nextPreference.emailDigestMode,\n emailEnabled: nextPreference.emailEnabled,\n inAppEnabled: nextPreference.inAppEnabled,\n memberId: currentMemberId,\n quietHoursEnd: nextPreference.quietHoursEnd,\n quietHoursStart: nextPreference.quietHoursStart,\n }),\n );\n } catch (requestError: unknown) {\n setPreference(previousPreference);\n setError(readErrorMessage(requestError));\n } finally {\n setSaving(false);\n }\n }\n\n const controlsDisabled = loading || saving;\n\n return (\n <>\n <PageHeader>\n <ContentHeader\n description=\"調整站內通知、Email 通知與摘要頻率。\"\n title=\"通知設定\"\n />\n </PageHeader>\n\n <SectionGroup>\n <Section\n filterArea={\n <FilterArea className={styles.preferenceFilter} isDirty={false}>\n <FilterLine>\n <Filter minWidth={160} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"inAppEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n 站內通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"inAppEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n inAppEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.inAppEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={180} span={1}>\n <FormField\n layout={FormFieldLayout.VERTICAL}\n name=\"emailEnabled\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 通知\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailEnabled\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailEnabled: readEnabledSegmentValue(\n event.target.value,\n ),\n });\n }}\n options={[...ENABLED_SEGMENT_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={readEnabledSegmentValueId(\n preference.emailEnabled,\n )}\n />\n </div>\n </FormField>\n </Filter>\n <Filter minWidth={280} span={2}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"emailDigestMode\"\n style={FILTER_FIELD_STYLE}\n >\n <div className={styles.segmentFilterControl}>\n <span className={styles.segmentFilterLabel}>\n Email 頻率\n </span>\n <RadioGroup\n disabled={controlsDisabled}\n name=\"emailDigestMode\"\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n void handlePreferenceChange({\n ...preference,\n emailDigestMode: readDigestMode(\n event.target.value,\n ),\n });\n }}\n options={[...DIGEST_OPTIONS]}\n size=\"sub\"\n type=\"segment\"\n value={preference.emailDigestMode}\n />\n </div>\n </FormField>\n </Filter>\n </FilterLine>\n </FilterArea>\n }\n >\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : (\n <Typography color=\"text-neutral\" variant=\"body\">\n 偏好設定會立即生效。\n </Typography>\n )}\n </Section>\n </SectionGroup>\n </>\n );\n}\n\nconst FILTER_FIELD_STYLE = {\n minWidth: 0,\n whiteSpace: 'nowrap',\n} satisfies CSSProperties;\n\nfunction readDigestMode(value: unknown): NotificationDigestMode {\n return value === 'DAILY' ? 'DAILY' : 'INSTANT';\n}\n\nfunction readEnabledSegmentValue(value: unknown): boolean {\n return value !== 'OFF';\n}\n\nfunction readEnabledSegmentValueId(enabled: boolean): EnabledSegmentValue {\n return enabled ? 'ON' : 'OFF';\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use client";let e=require("react"),t=require("react/jsx-runtime");var n=(0,e.createContext)(null);function r({value:e,children:r}){return(0,t.jsx)(n.Provider,{value:e,children:r})}function i(){let t=(0,e.useContext)(n);if(!t)throw Error("useRouterAdapter must be used inside <RouterAdapterProvider>. In Next.js, wrap your app with <BPMNextProviders> from `@rytass/bpm-core-react/next` (it mounts <RouterAdapterProvider> internally). For non-Next hosts, build your own RouterAdapter and pass it to <RouterAdapterProvider value={...}>.");return t}function a(){return typeof window>`u`?new URLSearchParams:new URLSearchParams(window.location.search)}Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return r}});
|
|
2
|
+
//# sourceMappingURL=router-adapter--gYs13E8.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"router-adapter
|
|
1
|
+
{"version":3,"file":"router-adapter--gYs13E8.cjs","names":[],"sources":["../../src/lib/router-adapter.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n useContext,\n type ReactElement,\n type ReactNode,\n} from 'react';\n\n/**\n * Framework-agnostic router contract every BPM view consumes.\n *\n * Next.js App Router consumers wire it from `useRouter()` / `usePathname()`,\n * but the contract is intentionally generic so SPA / Remix / Tanstack Router\n * hosts can plug in the same `<RouterAdapterProvider>` with their own\n * navigation primitives.\n */\nexport interface RouterAdapter {\n /** Current pathname (e.g. \"/inbox\"). `null` during SSR before hydration. */\n readonly pathname: string | null;\n /** Navigate to `href` (push onto history). */\n push(href: string): void;\n /** Navigate to `href` and replace the current history entry. */\n replace(href: string): void;\n /** Optional: go back. Falls back to `history.back()` when omitted. */\n back?(): void;\n /**\n * Optional search params accessor. Returned `URLSearchParams` should be\n * read-only — mutating it does not navigate. Default implementation reads\n * `window.location.search` on the client.\n */\n searchParams?(): URLSearchParams;\n}\n\nconst RouterAdapterContext = createContext<RouterAdapter | null>(null);\n\nexport interface RouterAdapterProviderProps {\n readonly value: RouterAdapter;\n readonly children: ReactNode;\n}\n\n/**\n * Wraps the BPM React tree so `useRouterAdapter()` resolves to the host's\n * navigation primitives. Consumers typically put this once at the very root\n * of their layout (or inside a `'use client'` shim that reads\n * `useRouter()` + `usePathname()` from `next/navigation`).\n */\nexport function RouterAdapterProvider({\n value,\n children,\n}: RouterAdapterProviderProps): ReactElement {\n return (\n <RouterAdapterContext.Provider value={value}>\n {children}\n </RouterAdapterContext.Provider>\n );\n}\n\n/**\n * Reads the host-provided {@link RouterAdapter}. Throws when used outside a\n * `<RouterAdapterProvider>` to surface wiring mistakes early.\n */\nexport function useRouterAdapter(): RouterAdapter {\n const value = useContext(RouterAdapterContext);\n if (!value) {\n throw new Error(\n 'useRouterAdapter must be used inside <RouterAdapterProvider>. ' +\n 'In Next.js, wrap your app with <BPMNextProviders> from ' +\n '`@rytass/bpm-core-react/next` (it mounts <RouterAdapterProvider> ' +\n 'internally). For non-Next hosts, build your own RouterAdapter ' +\n 'and pass it to <RouterAdapterProvider value={...}>.',\n );\n }\n return value;\n}\n\n/**\n * Pure default search-params reader for the browser. Server-side returns an\n * empty `URLSearchParams`. Used internally when a {@link RouterAdapter}\n * does not override `searchParams()`.\n */\nexport function defaultBrowserSearchParams(): URLSearchParams {\n if (typeof window === 'undefined') return new URLSearchParams();\n return new URLSearchParams(window.location.search);\n}\n"],"mappings":"mEAkCA,IAAM,GAAA,EAAA,EAAA,eAA2D,IAAI,EAarE,SAAgB,EAAsB,CACpC,QACA,YAC2C,CAC3C,OACE,EAAA,EAAA,KAAC,EAAqB,SAAtB,CAAsC,QACnC,UAC4B,CAAA,CAEnC,CAMA,SAAgB,GAAkC,CAChD,IAAM,GAAA,EAAA,EAAA,YAAmB,CAAoB,EAC7C,GAAI,CAAC,EACH,MAAU,MACR,ySAKF,EAEF,OAAO,CACT,CAOA,SAAgB,GAA8C,CAE5D,OADI,OAAO,OAAW,IAAoB,IAAI,gBACvC,IAAI,gBAAgB,OAAO,SAAS,MAAM,CACnD"}
|
|
@@ -11,7 +11,7 @@ function i({ value: e, children: t }) {
|
|
|
11
11
|
}
|
|
12
12
|
function a() {
|
|
13
13
|
let e = t(r);
|
|
14
|
-
if (!e) throw Error("useRouterAdapter must be used inside <RouterAdapterProvider>. In Next.js, wrap your app with <
|
|
14
|
+
if (!e) throw Error("useRouterAdapter must be used inside <RouterAdapterProvider>. In Next.js, wrap your app with <BPMNextProviders> from `@rytass/bpm-core-react/next` (it mounts <RouterAdapterProvider> internally). For non-Next hosts, build your own RouterAdapter and pass it to <RouterAdapterProvider value={...}>.");
|
|
15
15
|
return e;
|
|
16
16
|
}
|
|
17
17
|
function o() {
|
|
@@ -20,4 +20,4 @@ function o() {
|
|
|
20
20
|
//#endregion
|
|
21
21
|
export { o as n, a as r, i as t };
|
|
22
22
|
|
|
23
|
-
//# sourceMappingURL=router-adapter-
|
|
23
|
+
//# sourceMappingURL=router-adapter-DftlFTOd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"router-adapter-
|
|
1
|
+
{"version":3,"file":"router-adapter-DftlFTOd.js","names":[],"sources":["../../src/lib/router-adapter.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n useContext,\n type ReactElement,\n type ReactNode,\n} from 'react';\n\n/**\n * Framework-agnostic router contract every BPM view consumes.\n *\n * Next.js App Router consumers wire it from `useRouter()` / `usePathname()`,\n * but the contract is intentionally generic so SPA / Remix / Tanstack Router\n * hosts can plug in the same `<RouterAdapterProvider>` with their own\n * navigation primitives.\n */\nexport interface RouterAdapter {\n /** Current pathname (e.g. \"/inbox\"). `null` during SSR before hydration. */\n readonly pathname: string | null;\n /** Navigate to `href` (push onto history). */\n push(href: string): void;\n /** Navigate to `href` and replace the current history entry. */\n replace(href: string): void;\n /** Optional: go back. Falls back to `history.back()` when omitted. */\n back?(): void;\n /**\n * Optional search params accessor. Returned `URLSearchParams` should be\n * read-only — mutating it does not navigate. Default implementation reads\n * `window.location.search` on the client.\n */\n searchParams?(): URLSearchParams;\n}\n\nconst RouterAdapterContext = createContext<RouterAdapter | null>(null);\n\nexport interface RouterAdapterProviderProps {\n readonly value: RouterAdapter;\n readonly children: ReactNode;\n}\n\n/**\n * Wraps the BPM React tree so `useRouterAdapter()` resolves to the host's\n * navigation primitives. Consumers typically put this once at the very root\n * of their layout (or inside a `'use client'` shim that reads\n * `useRouter()` + `usePathname()` from `next/navigation`).\n */\nexport function RouterAdapterProvider({\n value,\n children,\n}: RouterAdapterProviderProps): ReactElement {\n return (\n <RouterAdapterContext.Provider value={value}>\n {children}\n </RouterAdapterContext.Provider>\n );\n}\n\n/**\n * Reads the host-provided {@link RouterAdapter}. Throws when used outside a\n * `<RouterAdapterProvider>` to surface wiring mistakes early.\n */\nexport function useRouterAdapter(): RouterAdapter {\n const value = useContext(RouterAdapterContext);\n if (!value) {\n throw new Error(\n 'useRouterAdapter must be used inside <RouterAdapterProvider>. ' +\n 'In Next.js, wrap your app with <BPMNextProviders> from ' +\n '`@rytass/bpm-core-react/next` (it mounts <RouterAdapterProvider> ' +\n 'internally). For non-Next hosts, build your own RouterAdapter ' +\n 'and pass it to <RouterAdapterProvider value={...}>.',\n );\n }\n return value;\n}\n\n/**\n * Pure default search-params reader for the browser. Server-side returns an\n * empty `URLSearchParams`. Used internally when a {@link RouterAdapter}\n * does not override `searchParams()`.\n */\nexport function defaultBrowserSearchParams(): URLSearchParams {\n if (typeof window === 'undefined') return new URLSearchParams();\n return new URLSearchParams(window.location.search);\n}\n"],"mappings":";;;;AAkCA,IAAM,IAAuB,EAAoC,IAAI;AAarE,SAAgB,EAAsB,EACpC,UACA,eAC2C;CAC3C,OACE,kBAAC,EAAqB,UAAtB;EAAsC;EACnC;CAC4B,CAAA;AAEnC;AAMA,SAAgB,IAAkC;CAChD,IAAM,IAAQ,EAAW,CAAoB;CAC7C,IAAI,CAAC,GACH,MAAU,MACR,ySAKF;CAEF,OAAO;AACT;AAOA,SAAgB,IAA8C;CAE5D,OADI,OAAO,SAAW,MAAoB,IAAI,gBAAgB,IACvD,IAAI,gBAAgB,OAAO,SAAS,MAAM;AACnD"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { r as e } from "./router-adapter-
|
|
2
|
+
import { r as e } from "./router-adapter-DftlFTOd.js";
|
|
3
3
|
import { t } from "./format-date-time-CB-LxzqT.js";
|
|
4
4
|
import { r as n } from "./routes-config-dxahImVe.js";
|
|
5
5
|
import { t as r } from "./bpm-form-field-Cao0rMol.js";
|
|
@@ -377,4 +377,4 @@ function B(e) {
|
|
|
377
377
|
//#endregion
|
|
378
378
|
export { P as t };
|
|
379
379
|
|
|
380
|
-
//# sourceMappingURL=templates-
|
|
380
|
+
//# sourceMappingURL=templates-D44FSB46.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"templates-DNfDOPGm.js","names":[],"sources":["../../src/views/templates/template-name-modal.tsx","../../src/views/templates/TemplatesView.tsx"],"sourcesContent":["'use client';\n\nimport { ChangeEvent, ReactElement, useEffect, useState } from 'react';\nimport { Input, Modal, Select, Typography } from '@mezzanine-ui/react';\nimport { BPMFormField } from '../../components/bpm-form-field';\n\nexport interface TemplateCategoryOption {\n readonly categoryId: string | null;\n readonly id: string;\n readonly name: string;\n}\n\ninterface TemplateNameModalProps {\n readonly confirmText: string;\n readonly categoryOptions: readonly TemplateCategoryOption[];\n readonly initialName: string;\n readonly loading: boolean;\n readonly onClose: () => void;\n readonly onSubmit: (input: {\n readonly categoryId: string | null;\n readonly name: string;\n }) => Promise<void>;\n readonly open: boolean;\n readonly title: string;\n}\n\nexport function TemplateNameModal({\n confirmText,\n categoryOptions,\n initialName,\n loading,\n onClose,\n onSubmit,\n open,\n title,\n}: TemplateNameModalProps): ReactElement {\n const [name, setName] = useState(initialName);\n const [category, setCategory] = useState<TemplateCategoryOption>(\n categoryOptions[0] ?? UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION,\n );\n const [error, setError] = useState<string | null>(null);\n const trimmedName = name.trim();\n\n useEffect((): void => {\n if (!open) {\n return;\n }\n\n setName(initialName);\n setCategory(categoryOptions[0] ?? UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION);\n setError(null);\n }, [categoryOptions, initialName, open]);\n\n async function handleConfirm(): Promise<void> {\n if (!trimmedName) {\n setError('請輸入模板名稱');\n return;\n }\n\n try {\n await onSubmit({ categoryId: category.categoryId, name: trimmedName });\n } catch (submitError: unknown) {\n setError(readErrorMessage(submitError));\n }\n }\n\n return (\n <Modal\n cancelText=\"取消\"\n confirmButtonProps={{ disabled: !trimmedName }}\n confirmText={confirmText}\n loading={loading}\n modalType=\"standard\"\n onCancel={onClose}\n onClose={onClose}\n onConfirm={(): void => void handleConfirm()}\n open={open}\n showModalFooter\n showModalHeader\n size=\"narrow\"\n title={title}\n >\n <BPMFormField label=\"模板名稱\" name=\"templateName\" required>\n <Input\n autoFocus\n fullWidth\n onChange={(event: ChangeEvent<HTMLInputElement>): void => {\n setName(event.target.value);\n setError(null);\n }}\n placeholder=\"例如:費用申請流程\"\n value={name}\n variant=\"base\"\n />\n </BPMFormField>\n <BPMFormField label=\"分類\" name=\"templateCategory\">\n <Select\n clearable={false}\n fullWidth\n onChange={(option): void => {\n setCategory(readCategoryOption(option, categoryOptions));\n setError(null);\n }}\n options={[...categoryOptions]}\n placeholder=\"選擇分類\"\n value={category}\n />\n </BPMFormField>\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n </Modal>\n );\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n\nexport const UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION: TemplateCategoryOption = {\n categoryId: null,\n id: 'UNCATEGORIZED',\n name: '未分類',\n};\n\nfunction readCategoryOption(\n value: unknown,\n options: readonly TemplateCategoryOption[],\n): TemplateCategoryOption {\n if (!isRecord(value)) {\n return UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION;\n }\n\n const id = typeof value.id === 'string' ? value.id : null;\n\n return (\n options.find((option) => option.id === id) ??\n UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION\n );\n}\n\nfunction isRecord(value: unknown): value is Readonly<Record<string, unknown>> {\n return typeof value === 'object' && value !== null;\n}\n","'use client';\n\nimport type { ChangeEvent, Key, ReactElement } from 'react';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n Badge,\n Button,\n Filter,\n FilterArea,\n FilterLine,\n FormField,\n Input,\n PageHeader,\n Section,\n SectionGroup,\n Select,\n Tab,\n TabItem,\n Table,\n Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { PlusIcon } from '@mezzanine-ui/icons';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport type { TableActions, TableColumn } from '@mezzanine-ui/core/table';\nimport styles from './templates.module.scss';\nimport { formatDateTime } from '../../lib/format-date-time';\nimport { useRouterAdapter } from '../../lib/router-adapter';\nimport { useBPMRoutes } from '../../lib/routes-config';\nimport {\n TemplateCategoryOption,\n TemplateNameModal,\n UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION,\n} from './template-name-modal';\nimport {\n ApprovalTemplateListStatus,\n ApprovalTemplateRecord,\n ApprovalTemplateCategoryRecord,\n createApprovalTemplate,\n listApprovalTemplateCategoriesPage,\n listApprovalTemplatesPage,\n} from '@rytass/bpm-core-client/template';\nimport { listLaunchableTemplates } from '@rytass/bpm-core-client/workflow';\n\nconst TEMPLATE_PAGE_SIZE_OPTIONS = [10, 20, 50];\nconst TEMPLATE_STATUS_TABS: readonly {\n readonly key: TemplateStatusTabKey;\n readonly label: string;\n}[] = [\n { key: 'ALL', label: '全部' },\n { key: 'PUBLISHED', label: '已發布' },\n { key: 'DRAFT', label: '草稿' },\n];\n\nconst TEMPLATE_CATEGORY_PAGE_SIZE = 100;\n\ntype TemplateStatusTabKey = 'ALL' | ApprovalTemplateListStatus;\n\ntype TemplateRow = Readonly<\n Record<string, unknown> &\n ApprovalTemplateRecord & {\n categoryLabel: string;\n key: string;\n status: ApprovalTemplateListStatus;\n }\n>;\n\n\nexport function TemplatesView(): ReactElement {\n const router = useRouterAdapter();\n const routes = useBPMRoutes();\n const [templates, setTemplates] = useState<readonly ApprovalTemplateRecord[]>(\n [],\n );\n const [categoryFilter, setCategoryFilter] = useState<TemplateCategoryOption>(\n UNCATEGORIZED_TEMPLATE_FILTER_OPTION,\n );\n const [categoryOptions, setCategoryOptions] = useState<\n readonly TemplateCategoryOption[]\n >([]);\n const [launchableTemplateIds, setLaunchableTemplateIds] = useState<\n ReadonlySet<string>\n >(new Set());\n const [createModalOpen, setCreateModalOpen] = useState(false);\n const [creating, setCreating] = useState(false);\n const [error, setError] = useState<string | null>(null);\n const [loading, setLoading] = useState(true);\n const [templatePage, setTemplatePage] = useState(1);\n const [templatePageSize, setTemplatePageSize] = useState(10);\n const [templateSearchText, setTemplateSearchText] = useState('');\n const [templateStatus, setTemplateStatus] =\n useState<TemplateStatusTabKey>('ALL');\n const [templateTotalCount, setTemplateTotalCount] = useState(0);\n\n const refreshTemplates = useCallback(async (): Promise<void> => {\n setLoading(true);\n setError(null);\n\n try {\n const [\n templatePageResult,\n nextLaunchableTemplates,\n activeCategoryPageResult,\n ] = await Promise.all([\n listApprovalTemplatesPage({\n categoryId: categoryFilter.categoryId,\n page: templatePage,\n pageSize: templatePageSize,\n searchText: templateSearchText,\n status: templateStatus === 'ALL' ? null : templateStatus,\n }),\n listLaunchableTemplates(),\n listApprovalTemplateCategoriesPage({\n page: 1,\n pageSize: TEMPLATE_CATEGORY_PAGE_SIZE,\n searchText: '',\n status: 'ACTIVE',\n }),\n ]);\n\n setCategoryOptions([\n ...activeCategoryPageResult.categories.map(readCategoryOption),\n ]);\n setTemplates(templatePageResult.templates);\n setTemplateTotalCount(templatePageResult.totalCount);\n setLaunchableTemplateIds(\n new Set(nextLaunchableTemplates.map((template) => template.id)),\n );\n } catch (requestError: unknown) {\n setError(readErrorMessage(requestError));\n } finally {\n setLoading(false);\n }\n }, [\n categoryFilter,\n templatePage,\n templatePageSize,\n templateSearchText,\n templateStatus,\n ]);\n\n useEffect((): void => {\n void refreshTemplates();\n }, [refreshTemplates]);\n\n const rows = useMemo(\n (): TemplateRow[] =>\n templates.map((template) => ({\n ...template,\n categoryLabel: readTemplateCategoryLabel(template),\n key: template.id,\n status: template.currentVersionId ? 'PUBLISHED' : 'DRAFT',\n updatedAt: formatDateTime(template.updatedAt),\n })),\n [templates],\n );\n const columns = useMemo(\n (): TableColumn<TemplateRow>[] => [\n { dataIndex: 'name', key: 'name', title: '模板名稱', width: 220 },\n {\n key: 'status',\n render: (record: TemplateRow): ReactElement => (\n <TemplateStatusBadge status={record.status} />\n ),\n title: '狀態',\n width: 120,\n },\n {\n key: 'category',\n render: (record: TemplateRow): ReactElement => (\n <TemplateCategoryLabel record={record} />\n ),\n title: '分類',\n width: 160,\n },\n {\n dataIndex: 'updatedAt',\n key: 'updatedAt',\n title: '更新時間',\n width: 220,\n },\n ],\n [],\n );\n const tableActions = useMemo(\n (): TableActions<TemplateRow> => ({\n render: (record): ReturnType<TableActions<TemplateRow>['render']> => [\n {\n disabled: (template): boolean =>\n !launchableTemplateIds.has(template.id),\n name: '發起',\n onClick: (): void =>\n router.push(routes.caseNew(record.id)),\n variant: 'base-primary',\n },\n {\n name: '設計',\n onClick: (): void => router.push(routes.templateDesigner(record.id)),\n },\n {\n name: '版本',\n onClick: (): void => router.push(routes.templateVersions(record.id)),\n },\n ],\n variant: 'base-secondary',\n width: 192,\n }),\n [launchableTemplateIds, router],\n );\n\n async function handleCreateTemplate({\n categoryId,\n name,\n }: {\n readonly categoryId: string | null;\n readonly name: string;\n }): Promise<void> {\n setCreating(true);\n setError(null);\n\n try {\n const templateId = await createApprovalTemplate({ categoryId, name });\n setCreateModalOpen(false);\n router.push(routes.templateDesigner(templateId));\n } finally {\n setCreating(false);\n }\n }\n\n return (\n <>\n <>\n <PageHeader>\n <ContentHeader\n description=\"建立流程模板、維護草稿與發布版本。\"\n title=\"簽核模板\"\n >\n <Button\n disabled={creating}\n icon={PlusIcon}\n iconType=\"leading\"\n onClick={(): void => setCreateModalOpen(true)}\n variant=\"base-primary\"\n >\n 建立模板\n </Button>\n </ContentHeader>\n </PageHeader>\n\n <SectionGroup>\n <Section\n filterArea={\n <FilterArea className={styles.templateFilterArea} size=\"sub\">\n <FilterLine>\n <Filter span={3}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"templateSearchText\"\n >\n <Input\n fullWidth\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n setTemplateSearchText(event.target.value);\n setTemplatePage(1);\n }}\n placeholder=\"關鍵字:搜尋模板名稱、分類或描述\"\n size=\"sub\"\n value={templateSearchText}\n variant=\"base\"\n />\n </FormField>\n </Filter>\n <Filter span={2}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"templateCategoryFilter\"\n >\n <Select\n clearable={false}\n fullWidth\n onChange={(option): void => {\n setCategoryFilter(\n readCategoryFilterOption(option, categoryOptions),\n );\n setTemplatePage(1);\n }}\n options={[\n UNCATEGORIZED_TEMPLATE_FILTER_OPTION,\n ...categoryOptions,\n ]}\n placeholder=\"分類\"\n renderValue={(value): string =>\n `分類:${readTemplateCategoryFilterLabel(value)}`\n }\n size=\"sub\"\n value={categoryFilter}\n />\n </FormField>\n </Filter>\n </FilterLine>\n </FilterArea>\n }\n tab={\n <Tab\n activeKey={templateStatus}\n onChange={(activeKey): void => {\n setTemplateStatus(readTemplateStatusTabKey(activeKey));\n setTemplatePage(1);\n }}\n >\n {TEMPLATE_STATUS_TABS.map((statusTab) => (\n <TabItem key={statusTab.key}>{statusTab.label}</TabItem>\n ))}\n </Tab>\n }\n >\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n <Table\n actions={tableActions}\n columns={columns}\n dataSource={rows}\n fullWidth\n loading={loading}\n pagination={{\n current: templatePage,\n onChange: (page): void => {\n setTemplatePage(page);\n },\n onChangePageSize: (pageSize): void => {\n setTemplatePage(1);\n setTemplatePageSize(pageSize);\n },\n pageSize: templatePageSize,\n pageSizeLabel: '每頁筆數',\n pageSizeOptions: TEMPLATE_PAGE_SIZE_OPTIONS,\n renderResultSummary: (from, to, total): string =>\n `顯示 ${from}-${to} 筆,共 ${total} 筆`,\n showPageSizeOptions: true,\n total: templateTotalCount,\n }}\n />\n </Section>\n </SectionGroup>\n </>\n\n <TemplateNameModal\n categoryOptions={[\n UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION,\n ...categoryOptions,\n ]}\n confirmText=\"建立\"\n initialName=\"\"\n loading={creating}\n onClose={(): void => setCreateModalOpen(false)}\n onSubmit={handleCreateTemplate}\n open={createModalOpen}\n title=\"建立簽核模板\"\n />\n </>\n );\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n\nfunction readTemplateStatusTabKey(activeKey: Key): TemplateStatusTabKey {\n if (activeKey === 'PUBLISHED' || activeKey === 'DRAFT') {\n return activeKey;\n }\n\n return 'ALL';\n}\n\nfunction TemplateStatusBadge({\n status,\n}: {\n readonly status: ApprovalTemplateListStatus;\n}): ReactElement {\n if (status === 'PUBLISHED') {\n return <Badge size=\"sub\" text=\"已發布\" variant=\"dot-success\" />;\n }\n\n return <Badge size=\"sub\" text=\"草稿\" variant=\"dot-inactive\" />;\n}\n\nfunction TemplateCategoryLabel({\n record,\n}: {\n readonly record: TemplateRow;\n}): ReactElement {\n if (record.categoryDetail?.isActive === false) {\n return (\n <Badge\n size=\"sub\"\n text={`${record.categoryLabel}(停用)`}\n variant=\"dot-inactive\"\n />\n );\n }\n\n return (\n <Typography component=\"span\" variant=\"body\">\n {record.categoryLabel}\n </Typography>\n );\n}\n\nconst UNCATEGORIZED_TEMPLATE_FILTER_OPTION: TemplateCategoryOption = {\n categoryId: null,\n id: 'ALL_CATEGORIES',\n name: '全部分類',\n};\n\nfunction readCategoryOption(\n category: ApprovalTemplateCategoryRecord,\n): TemplateCategoryOption {\n return {\n categoryId: category.id,\n id: category.id,\n name: category.name,\n };\n}\n\nfunction readCategoryFilterOption(\n value: unknown,\n options: readonly TemplateCategoryOption[],\n): TemplateCategoryOption {\n if (!isRecord(value)) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION;\n }\n\n const id = typeof value.id === 'string' ? value.id : null;\n\n if (id === UNCATEGORIZED_TEMPLATE_FILTER_OPTION.id) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION;\n }\n\n return (\n options.find((option) => option.id === id) ??\n UNCATEGORIZED_TEMPLATE_FILTER_OPTION\n );\n}\n\nfunction readTemplateCategoryFilterLabel(value: unknown): string {\n if (Array.isArray(value)) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION.name;\n }\n\n if (!isRecord(value)) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION.name;\n }\n\n return typeof value.name === 'string'\n ? value.name\n : UNCATEGORIZED_TEMPLATE_FILTER_OPTION.name;\n}\n\nfunction readTemplateCategoryLabel(template: ApprovalTemplateRecord): string {\n return template.categoryDetail?.name ?? template.category ?? '未分類';\n}\n\nfunction isRecord(value: unknown): value is Readonly<Record<string, unknown>> {\n return typeof value === 'object' && value !== null;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"templates-D44FSB46.js","names":[],"sources":["../../src/views/templates/template-name-modal.tsx","../../src/views/templates/TemplatesView.tsx"],"sourcesContent":["'use client';\n\nimport { ChangeEvent, ReactElement, useEffect, useState } from 'react';\nimport { Input, Modal, Select, Typography } from '@mezzanine-ui/react';\nimport { BPMFormField } from '../../components/bpm-form-field';\n\nexport interface TemplateCategoryOption {\n readonly categoryId: string | null;\n readonly id: string;\n readonly name: string;\n}\n\ninterface TemplateNameModalProps {\n readonly confirmText: string;\n readonly categoryOptions: readonly TemplateCategoryOption[];\n readonly initialName: string;\n readonly loading: boolean;\n readonly onClose: () => void;\n readonly onSubmit: (input: {\n readonly categoryId: string | null;\n readonly name: string;\n }) => Promise<void>;\n readonly open: boolean;\n readonly title: string;\n}\n\nexport function TemplateNameModal({\n confirmText,\n categoryOptions,\n initialName,\n loading,\n onClose,\n onSubmit,\n open,\n title,\n}: TemplateNameModalProps): ReactElement {\n const [name, setName] = useState(initialName);\n const [category, setCategory] = useState<TemplateCategoryOption>(\n categoryOptions[0] ?? UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION,\n );\n const [error, setError] = useState<string | null>(null);\n const trimmedName = name.trim();\n\n useEffect((): void => {\n if (!open) {\n return;\n }\n\n setName(initialName);\n setCategory(categoryOptions[0] ?? UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION);\n setError(null);\n }, [categoryOptions, initialName, open]);\n\n async function handleConfirm(): Promise<void> {\n if (!trimmedName) {\n setError('請輸入模板名稱');\n return;\n }\n\n try {\n await onSubmit({ categoryId: category.categoryId, name: trimmedName });\n } catch (submitError: unknown) {\n setError(readErrorMessage(submitError));\n }\n }\n\n return (\n <Modal\n cancelText=\"取消\"\n confirmButtonProps={{ disabled: !trimmedName }}\n confirmText={confirmText}\n loading={loading}\n modalType=\"standard\"\n onCancel={onClose}\n onClose={onClose}\n onConfirm={(): void => void handleConfirm()}\n open={open}\n showModalFooter\n showModalHeader\n size=\"narrow\"\n title={title}\n >\n <BPMFormField label=\"模板名稱\" name=\"templateName\" required>\n <Input\n autoFocus\n fullWidth\n onChange={(event: ChangeEvent<HTMLInputElement>): void => {\n setName(event.target.value);\n setError(null);\n }}\n placeholder=\"例如:費用申請流程\"\n value={name}\n variant=\"base\"\n />\n </BPMFormField>\n <BPMFormField label=\"分類\" name=\"templateCategory\">\n <Select\n clearable={false}\n fullWidth\n onChange={(option): void => {\n setCategory(readCategoryOption(option, categoryOptions));\n setError(null);\n }}\n options={[...categoryOptions]}\n placeholder=\"選擇分類\"\n value={category}\n />\n </BPMFormField>\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n </Modal>\n );\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n\nexport const UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION: TemplateCategoryOption = {\n categoryId: null,\n id: 'UNCATEGORIZED',\n name: '未分類',\n};\n\nfunction readCategoryOption(\n value: unknown,\n options: readonly TemplateCategoryOption[],\n): TemplateCategoryOption {\n if (!isRecord(value)) {\n return UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION;\n }\n\n const id = typeof value.id === 'string' ? value.id : null;\n\n return (\n options.find((option) => option.id === id) ??\n UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION\n );\n}\n\nfunction isRecord(value: unknown): value is Readonly<Record<string, unknown>> {\n return typeof value === 'object' && value !== null;\n}\n","'use client';\n\nimport type { ChangeEvent, Key, ReactElement } from 'react';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n Badge,\n Button,\n Filter,\n FilterArea,\n FilterLine,\n FormField,\n Input,\n PageHeader,\n Section,\n SectionGroup,\n Select,\n Tab,\n TabItem,\n Table,\n Typography,\n} from '@mezzanine-ui/react';\nimport ContentHeader from '@mezzanine-ui/react/ContentHeader';\nimport { PlusIcon } from '@mezzanine-ui/icons';\nimport { FormFieldLayout } from '@mezzanine-ui/core/form';\nimport type { TableActions, TableColumn } from '@mezzanine-ui/core/table';\nimport styles from './templates.module.scss';\nimport { formatDateTime } from '../../lib/format-date-time';\nimport { useRouterAdapter } from '../../lib/router-adapter';\nimport { useBPMRoutes } from '../../lib/routes-config';\nimport {\n TemplateCategoryOption,\n TemplateNameModal,\n UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION,\n} from './template-name-modal';\nimport {\n ApprovalTemplateListStatus,\n ApprovalTemplateRecord,\n ApprovalTemplateCategoryRecord,\n createApprovalTemplate,\n listApprovalTemplateCategoriesPage,\n listApprovalTemplatesPage,\n} from '@rytass/bpm-core-client/template';\nimport { listLaunchableTemplates } from '@rytass/bpm-core-client/workflow';\n\nconst TEMPLATE_PAGE_SIZE_OPTIONS = [10, 20, 50];\nconst TEMPLATE_STATUS_TABS: readonly {\n readonly key: TemplateStatusTabKey;\n readonly label: string;\n}[] = [\n { key: 'ALL', label: '全部' },\n { key: 'PUBLISHED', label: '已發布' },\n { key: 'DRAFT', label: '草稿' },\n];\n\nconst TEMPLATE_CATEGORY_PAGE_SIZE = 100;\n\ntype TemplateStatusTabKey = 'ALL' | ApprovalTemplateListStatus;\n\ntype TemplateRow = Readonly<\n Record<string, unknown> &\n ApprovalTemplateRecord & {\n categoryLabel: string;\n key: string;\n status: ApprovalTemplateListStatus;\n }\n>;\n\n\nexport function TemplatesView(): ReactElement {\n const router = useRouterAdapter();\n const routes = useBPMRoutes();\n const [templates, setTemplates] = useState<readonly ApprovalTemplateRecord[]>(\n [],\n );\n const [categoryFilter, setCategoryFilter] = useState<TemplateCategoryOption>(\n UNCATEGORIZED_TEMPLATE_FILTER_OPTION,\n );\n const [categoryOptions, setCategoryOptions] = useState<\n readonly TemplateCategoryOption[]\n >([]);\n const [launchableTemplateIds, setLaunchableTemplateIds] = useState<\n ReadonlySet<string>\n >(new Set());\n const [createModalOpen, setCreateModalOpen] = useState(false);\n const [creating, setCreating] = useState(false);\n const [error, setError] = useState<string | null>(null);\n const [loading, setLoading] = useState(true);\n const [templatePage, setTemplatePage] = useState(1);\n const [templatePageSize, setTemplatePageSize] = useState(10);\n const [templateSearchText, setTemplateSearchText] = useState('');\n const [templateStatus, setTemplateStatus] =\n useState<TemplateStatusTabKey>('ALL');\n const [templateTotalCount, setTemplateTotalCount] = useState(0);\n\n const refreshTemplates = useCallback(async (): Promise<void> => {\n setLoading(true);\n setError(null);\n\n try {\n const [\n templatePageResult,\n nextLaunchableTemplates,\n activeCategoryPageResult,\n ] = await Promise.all([\n listApprovalTemplatesPage({\n categoryId: categoryFilter.categoryId,\n page: templatePage,\n pageSize: templatePageSize,\n searchText: templateSearchText,\n status: templateStatus === 'ALL' ? null : templateStatus,\n }),\n listLaunchableTemplates(),\n listApprovalTemplateCategoriesPage({\n page: 1,\n pageSize: TEMPLATE_CATEGORY_PAGE_SIZE,\n searchText: '',\n status: 'ACTIVE',\n }),\n ]);\n\n setCategoryOptions([\n ...activeCategoryPageResult.categories.map(readCategoryOption),\n ]);\n setTemplates(templatePageResult.templates);\n setTemplateTotalCount(templatePageResult.totalCount);\n setLaunchableTemplateIds(\n new Set(nextLaunchableTemplates.map((template) => template.id)),\n );\n } catch (requestError: unknown) {\n setError(readErrorMessage(requestError));\n } finally {\n setLoading(false);\n }\n }, [\n categoryFilter,\n templatePage,\n templatePageSize,\n templateSearchText,\n templateStatus,\n ]);\n\n useEffect((): void => {\n void refreshTemplates();\n }, [refreshTemplates]);\n\n const rows = useMemo(\n (): TemplateRow[] =>\n templates.map((template) => ({\n ...template,\n categoryLabel: readTemplateCategoryLabel(template),\n key: template.id,\n status: template.currentVersionId ? 'PUBLISHED' : 'DRAFT',\n updatedAt: formatDateTime(template.updatedAt),\n })),\n [templates],\n );\n const columns = useMemo(\n (): TableColumn<TemplateRow>[] => [\n { dataIndex: 'name', key: 'name', title: '模板名稱', width: 220 },\n {\n key: 'status',\n render: (record: TemplateRow): ReactElement => (\n <TemplateStatusBadge status={record.status} />\n ),\n title: '狀態',\n width: 120,\n },\n {\n key: 'category',\n render: (record: TemplateRow): ReactElement => (\n <TemplateCategoryLabel record={record} />\n ),\n title: '分類',\n width: 160,\n },\n {\n dataIndex: 'updatedAt',\n key: 'updatedAt',\n title: '更新時間',\n width: 220,\n },\n ],\n [],\n );\n const tableActions = useMemo(\n (): TableActions<TemplateRow> => ({\n render: (record): ReturnType<TableActions<TemplateRow>['render']> => [\n {\n disabled: (template): boolean =>\n !launchableTemplateIds.has(template.id),\n name: '發起',\n onClick: (): void =>\n router.push(routes.caseNew(record.id)),\n variant: 'base-primary',\n },\n {\n name: '設計',\n onClick: (): void => router.push(routes.templateDesigner(record.id)),\n },\n {\n name: '版本',\n onClick: (): void => router.push(routes.templateVersions(record.id)),\n },\n ],\n variant: 'base-secondary',\n width: 192,\n }),\n [launchableTemplateIds, router],\n );\n\n async function handleCreateTemplate({\n categoryId,\n name,\n }: {\n readonly categoryId: string | null;\n readonly name: string;\n }): Promise<void> {\n setCreating(true);\n setError(null);\n\n try {\n const templateId = await createApprovalTemplate({ categoryId, name });\n setCreateModalOpen(false);\n router.push(routes.templateDesigner(templateId));\n } finally {\n setCreating(false);\n }\n }\n\n return (\n <>\n <>\n <PageHeader>\n <ContentHeader\n description=\"建立流程模板、維護草稿與發布版本。\"\n title=\"簽核模板\"\n >\n <Button\n disabled={creating}\n icon={PlusIcon}\n iconType=\"leading\"\n onClick={(): void => setCreateModalOpen(true)}\n variant=\"base-primary\"\n >\n 建立模板\n </Button>\n </ContentHeader>\n </PageHeader>\n\n <SectionGroup>\n <Section\n filterArea={\n <FilterArea className={styles.templateFilterArea} size=\"sub\">\n <FilterLine>\n <Filter span={3}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"templateSearchText\"\n >\n <Input\n fullWidth\n onChange={(\n event: ChangeEvent<HTMLInputElement>,\n ): void => {\n setTemplateSearchText(event.target.value);\n setTemplatePage(1);\n }}\n placeholder=\"關鍵字:搜尋模板名稱、分類或描述\"\n size=\"sub\"\n value={templateSearchText}\n variant=\"base\"\n />\n </FormField>\n </Filter>\n <Filter span={2}>\n <FormField\n fullWidth\n layout={FormFieldLayout.VERTICAL}\n name=\"templateCategoryFilter\"\n >\n <Select\n clearable={false}\n fullWidth\n onChange={(option): void => {\n setCategoryFilter(\n readCategoryFilterOption(option, categoryOptions),\n );\n setTemplatePage(1);\n }}\n options={[\n UNCATEGORIZED_TEMPLATE_FILTER_OPTION,\n ...categoryOptions,\n ]}\n placeholder=\"分類\"\n renderValue={(value): string =>\n `分類:${readTemplateCategoryFilterLabel(value)}`\n }\n size=\"sub\"\n value={categoryFilter}\n />\n </FormField>\n </Filter>\n </FilterLine>\n </FilterArea>\n }\n tab={\n <Tab\n activeKey={templateStatus}\n onChange={(activeKey): void => {\n setTemplateStatus(readTemplateStatusTabKey(activeKey));\n setTemplatePage(1);\n }}\n >\n {TEMPLATE_STATUS_TABS.map((statusTab) => (\n <TabItem key={statusTab.key}>{statusTab.label}</TabItem>\n ))}\n </Tab>\n }\n >\n {error ? (\n <Typography color=\"text-error\" variant=\"body\">\n {error}\n </Typography>\n ) : null}\n <Table\n actions={tableActions}\n columns={columns}\n dataSource={rows}\n fullWidth\n loading={loading}\n pagination={{\n current: templatePage,\n onChange: (page): void => {\n setTemplatePage(page);\n },\n onChangePageSize: (pageSize): void => {\n setTemplatePage(1);\n setTemplatePageSize(pageSize);\n },\n pageSize: templatePageSize,\n pageSizeLabel: '每頁筆數',\n pageSizeOptions: TEMPLATE_PAGE_SIZE_OPTIONS,\n renderResultSummary: (from, to, total): string =>\n `顯示 ${from}-${to} 筆,共 ${total} 筆`,\n showPageSizeOptions: true,\n total: templateTotalCount,\n }}\n />\n </Section>\n </SectionGroup>\n </>\n\n <TemplateNameModal\n categoryOptions={[\n UNCATEGORIZED_TEMPLATE_CATEGORY_OPTION,\n ...categoryOptions,\n ]}\n confirmText=\"建立\"\n initialName=\"\"\n loading={creating}\n onClose={(): void => setCreateModalOpen(false)}\n onSubmit={handleCreateTemplate}\n open={createModalOpen}\n title=\"建立簽核模板\"\n />\n </>\n );\n}\n\nfunction readErrorMessage(error: unknown): string {\n return error instanceof Error ? error.message : '發生未知錯誤';\n}\n\nfunction readTemplateStatusTabKey(activeKey: Key): TemplateStatusTabKey {\n if (activeKey === 'PUBLISHED' || activeKey === 'DRAFT') {\n return activeKey;\n }\n\n return 'ALL';\n}\n\nfunction TemplateStatusBadge({\n status,\n}: {\n readonly status: ApprovalTemplateListStatus;\n}): ReactElement {\n if (status === 'PUBLISHED') {\n return <Badge size=\"sub\" text=\"已發布\" variant=\"dot-success\" />;\n }\n\n return <Badge size=\"sub\" text=\"草稿\" variant=\"dot-inactive\" />;\n}\n\nfunction TemplateCategoryLabel({\n record,\n}: {\n readonly record: TemplateRow;\n}): ReactElement {\n if (record.categoryDetail?.isActive === false) {\n return (\n <Badge\n size=\"sub\"\n text={`${record.categoryLabel}(停用)`}\n variant=\"dot-inactive\"\n />\n );\n }\n\n return (\n <Typography component=\"span\" variant=\"body\">\n {record.categoryLabel}\n </Typography>\n );\n}\n\nconst UNCATEGORIZED_TEMPLATE_FILTER_OPTION: TemplateCategoryOption = {\n categoryId: null,\n id: 'ALL_CATEGORIES',\n name: '全部分類',\n};\n\nfunction readCategoryOption(\n category: ApprovalTemplateCategoryRecord,\n): TemplateCategoryOption {\n return {\n categoryId: category.id,\n id: category.id,\n name: category.name,\n };\n}\n\nfunction readCategoryFilterOption(\n value: unknown,\n options: readonly TemplateCategoryOption[],\n): TemplateCategoryOption {\n if (!isRecord(value)) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION;\n }\n\n const id = typeof value.id === 'string' ? value.id : null;\n\n if (id === UNCATEGORIZED_TEMPLATE_FILTER_OPTION.id) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION;\n }\n\n return (\n options.find((option) => option.id === id) ??\n UNCATEGORIZED_TEMPLATE_FILTER_OPTION\n );\n}\n\nfunction readTemplateCategoryFilterLabel(value: unknown): string {\n if (Array.isArray(value)) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION.name;\n }\n\n if (!isRecord(value)) {\n return UNCATEGORIZED_TEMPLATE_FILTER_OPTION.name;\n }\n\n return typeof value.name === 'string'\n ? value.name\n : UNCATEGORIZED_TEMPLATE_FILTER_OPTION.name;\n}\n\nfunction readTemplateCategoryLabel(template: ApprovalTemplateRecord): string {\n return template.categoryDetail?.name ?? template.category ?? '未分類';\n}\n\nfunction isRecord(value: unknown): value is Readonly<Record<string, unknown>> {\n return typeof value === 'object' && value !== null;\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";const e=require("./chunk-CMqjfN_6.cjs"),t=require("./router-adapter
|
|
2
|
-
//# sourceMappingURL=templates-
|
|
1
|
+
"use client";const e=require("./chunk-CMqjfN_6.cjs"),t=require("./router-adapter--gYs13E8.cjs"),n=require("./format-date-time-XxBzF0F5.cjs"),r=require("./routes-config-2aKbWq2H.cjs"),i=require("./bpm-form-field-Bc6k4ZEO.cjs"),a=require("./categories-B6QZKZRt.cjs");let o=require("react"),s=require("@mezzanine-ui/react"),c=require("react/jsx-runtime"),l=require("@rytass/bpm-core-client/workflow"),u=require("@mezzanine-ui/react/ContentHeader");u=e.t(u,1);let d=require("@mezzanine-ui/core/form"),f=require("@mezzanine-ui/icons"),p=require("@rytass/bpm-core-client/template");function m({confirmText:e,categoryOptions:t,initialName:n,loading:r,onClose:a,onSubmit:l,open:u,title:d}){let[f,p]=(0,o.useState)(n),[m,v]=(0,o.useState)(t[0]??g),[y,b]=(0,o.useState)(null),x=f.trim();(0,o.useEffect)(()=>{u&&(p(n),v(t[0]??g),b(null))},[t,n,u]);async function S(){if(!x){b(`請輸入模板名稱`);return}try{await l({categoryId:m.categoryId,name:x})}catch(e){b(h(e))}}return(0,c.jsxs)(s.Modal,{cancelText:`取消`,confirmButtonProps:{disabled:!x},confirmText:e,loading:r,modalType:`standard`,onCancel:a,onClose:a,onConfirm:()=>void S(),open:u,showModalFooter:!0,showModalHeader:!0,size:`narrow`,title:d,children:[(0,c.jsx)(i.t,{label:`模板名稱`,name:`templateName`,required:!0,children:(0,c.jsx)(s.Input,{autoFocus:!0,fullWidth:!0,onChange:e=>{p(e.target.value),b(null)},placeholder:`例如:費用申請流程`,value:f,variant:`base`})}),(0,c.jsx)(i.t,{label:`分類`,name:`templateCategory`,children:(0,c.jsx)(s.Select,{clearable:!1,fullWidth:!0,onChange:e=>{v(_(e,t)),b(null)},options:[...t],placeholder:`選擇分類`,value:m})}),y?(0,c.jsx)(s.Typography,{color:`text-error`,variant:`body`,children:y}):null]})}function h(e){return e instanceof Error?e.message:`發生未知錯誤`}var g={categoryId:null,id:`UNCATEGORIZED`,name:`未分類`};function _(e,t){if(!v(e))return g;let n=typeof e.id==`string`?e.id:null;return t.find(e=>e.id===n)??g}function v(e){return typeof e==`object`&&!!e}var y=[10,20,50],b=[{key:`ALL`,label:`全部`},{key:`PUBLISHED`,label:`已發布`},{key:`DRAFT`,label:`草稿`}],x=100;function S(){let e=t.r(),i=r.r(),[h,_]=(0,o.useState)([]),[v,S]=(0,o.useState)(E),[j,M]=(0,o.useState)([]),[N,P]=(0,o.useState)(new Set),[F,I]=(0,o.useState)(!1),[L,R]=(0,o.useState)(!1),[z,B]=(0,o.useState)(null),[V,H]=(0,o.useState)(!0),[U,W]=(0,o.useState)(1),[G,K]=(0,o.useState)(10),[q,J]=(0,o.useState)(``),[Y,X]=(0,o.useState)(`ALL`),[Z,Q]=(0,o.useState)(0),$=(0,o.useCallback)(async()=>{H(!0),B(null);try{let[e,t,n]=await Promise.all([(0,p.listApprovalTemplatesPage)({categoryId:v.categoryId,page:U,pageSize:G,searchText:q,status:Y===`ALL`?null:Y}),(0,l.listLaunchableTemplates)(),(0,p.listApprovalTemplateCategoriesPage)({page:1,pageSize:x,searchText:``,status:`ACTIVE`})]);M([...n.categories.map(D)]),_(e.templates),Q(e.totalCount),P(new Set(t.map(e=>e.id)))}catch(e){B(ee(e))}finally{H(!1)}},[v,U,G,q,Y]);(0,o.useEffect)(()=>{$()},[$]);let te=(0,o.useMemo)(()=>h.map(e=>({...e,categoryLabel:A(e),key:e.id,status:e.currentVersionId?`PUBLISHED`:`DRAFT`,updatedAt:n.t(e.updatedAt)})),[h]),ne=(0,o.useMemo)(()=>[{dataIndex:`name`,key:`name`,title:`模板名稱`,width:220},{key:`status`,render:e=>(0,c.jsx)(w,{status:e.status}),title:`狀態`,width:120},{key:`category`,render:e=>(0,c.jsx)(T,{record:e}),title:`分類`,width:160},{dataIndex:`updatedAt`,key:`updatedAt`,title:`更新時間`,width:220}],[]),re=(0,o.useMemo)(()=>({render:t=>[{disabled:e=>!N.has(e.id),name:`發起`,onClick:()=>e.push(i.caseNew(t.id)),variant:`base-primary`},{name:`設計`,onClick:()=>e.push(i.templateDesigner(t.id))},{name:`版本`,onClick:()=>e.push(i.templateVersions(t.id))}],variant:`base-secondary`,width:192}),[N,e]);async function ie({categoryId:t,name:n}){R(!0),B(null);try{let r=await(0,p.createApprovalTemplate)({categoryId:t,name:n});I(!1),e.push(i.templateDesigner(r))}finally{R(!1)}}return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(s.PageHeader,{children:(0,c.jsx)(u.default,{description:`建立流程模板、維護草稿與發布版本。`,title:`簽核模板`,children:(0,c.jsx)(s.Button,{disabled:L,icon:f.PlusIcon,iconType:`leading`,onClick:()=>I(!0),variant:`base-primary`,children:`建立模板`})})}),(0,c.jsx)(s.SectionGroup,{children:(0,c.jsxs)(s.Section,{filterArea:(0,c.jsx)(s.FilterArea,{className:a.n.templateFilterArea,size:`sub`,children:(0,c.jsxs)(s.FilterLine,{children:[(0,c.jsx)(s.Filter,{span:3,children:(0,c.jsx)(s.FormField,{fullWidth:!0,layout:d.FormFieldLayout.VERTICAL,name:`templateSearchText`,children:(0,c.jsx)(s.Input,{fullWidth:!0,onChange:e=>{J(e.target.value),W(1)},placeholder:`關鍵字:搜尋模板名稱、分類或描述`,size:`sub`,value:q,variant:`base`})})}),(0,c.jsx)(s.Filter,{span:2,children:(0,c.jsx)(s.FormField,{fullWidth:!0,layout:d.FormFieldLayout.VERTICAL,name:`templateCategoryFilter`,children:(0,c.jsx)(s.Select,{clearable:!1,fullWidth:!0,onChange:e=>{S(O(e,j)),W(1)},options:[E,...j],placeholder:`分類`,renderValue:e=>`分類:${k(e)}`,size:`sub`,value:v})})})]})}),tab:(0,c.jsx)(s.Tab,{activeKey:Y,onChange:e=>{X(C(e)),W(1)},children:b.map(e=>(0,c.jsx)(s.TabItem,{children:e.label},e.key))}),children:[z?(0,c.jsx)(s.Typography,{color:`text-error`,variant:`body`,children:z}):null,(0,c.jsx)(s.Table,{actions:re,columns:ne,dataSource:te,fullWidth:!0,loading:V,pagination:{current:U,onChange:e=>{W(e)},onChangePageSize:e=>{W(1),K(e)},pageSize:G,pageSizeLabel:`每頁筆數`,pageSizeOptions:y,renderResultSummary:(e,t,n)=>`顯示 ${e}-${t} 筆,共 ${n} 筆`,showPageSizeOptions:!0,total:Z}})]})})]}),(0,c.jsx)(m,{categoryOptions:[g,...j],confirmText:`建立`,initialName:``,loading:L,onClose:()=>I(!1),onSubmit:ie,open:F,title:`建立簽核模板`})]})}function ee(e){return e instanceof Error?e.message:`發生未知錯誤`}function C(e){return e===`PUBLISHED`||e===`DRAFT`?e:`ALL`}function w({status:e}){return e===`PUBLISHED`?(0,c.jsx)(s.Badge,{size:`sub`,text:`已發布`,variant:`dot-success`}):(0,c.jsx)(s.Badge,{size:`sub`,text:`草稿`,variant:`dot-inactive`})}function T({record:e}){return e.categoryDetail?.isActive===!1?(0,c.jsx)(s.Badge,{size:`sub`,text:`${e.categoryLabel}(停用)`,variant:`dot-inactive`}):(0,c.jsx)(s.Typography,{component:`span`,variant:`body`,children:e.categoryLabel})}var E={categoryId:null,id:`ALL_CATEGORIES`,name:`全部分類`};function D(e){return{categoryId:e.id,id:e.id,name:e.name}}function O(e,t){if(!j(e))return E;let n=typeof e.id==`string`?e.id:null;return n===E.id?E:t.find(e=>e.id===n)??E}function k(e){return Array.isArray(e)||!j(e)?E.name:typeof e.name==`string`?e.name:E.name}function A(e){return e.categoryDetail?.name??e.category??`未分類`}function j(e){return typeof e==`object`&&!!e}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return S}});
|
|
2
|
+
//# sourceMappingURL=templates-w96t83N-.cjs.map
|