shawon/JML
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add visibility toggles for app and web in company policy settings and fix routing typo

Browse Source
This commit is contained in:
sazzadulalambd
2026-05-10 18:24:24 +06:00
parent 7f5c7f3f65
commit 63f689d1da
3 changed files with 247 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

241
src/app/admin/settings/components/CompanyPolicySettings.tsx
View File

@@ -19,12 +19,20 @@ interface CompanyPolicySettingsProps {
setEditPolicyDesc: (desc: string) => void; setEditPolicyDesc: (desc: string) => void;
editPolicyDescHtml: string; editPolicyDescHtml: string;
setEditPolicyDescHtml: (desc: string) => void; setEditPolicyDescHtml: (desc: string) => void;
editPolicyShowApp: boolean;
setEditPolicyShowApp: (v: boolean) => void;
editPolicyShowWeb: boolean;
setEditPolicyShowWeb: (v: boolean) => void;
showAddPolicy: boolean; showAddPolicy: boolean;
setShowAddPolicy: (show: boolean) => void; setShowAddPolicy: (show: boolean) => void;
newPolicyName: string; newPolicyName: string;
setNewPolicyName: (name: string) => void; setNewPolicyName: (name: string) => void;
newPolicyDesc: string; newPolicyDesc: string;
setNewPolicyDesc: (desc: string) => void; setNewPolicyDesc: (desc: string) => void;
newPolicyShowApp: boolean;
setNewPolicyShowApp: (v: boolean) => void;
newPolicyShowWeb: boolean;
setNewPolicyShowWeb: (v: boolean) => void;
} }
export default function CompanyPolicySettings({ export default function CompanyPolicySettings({
@@ -40,14 +48,22 @@ export default function CompanyPolicySettings({
setEditPolicyName, setEditPolicyName,
editPolicyDesc, editPolicyDesc,
setEditPolicyDesc, setEditPolicyDesc,
editPolicyDescHtml, editPolicyDescHtml,
setEditPolicyDescHtml, setEditPolicyDescHtml,
showAddPolicy, editPolicyShowApp,
setEditPolicyShowApp,
editPolicyShowWeb,
setEditPolicyShowWeb,
showAddPolicy,
setShowAddPolicy, setShowAddPolicy,
newPolicyName, newPolicyName,
setNewPolicyName, setNewPolicyName,
newPolicyDesc, newPolicyDesc,
setNewPolicyDesc, setNewPolicyDesc,
newPolicyShowApp,
setNewPolicyShowApp,
newPolicyShowWeb,
setNewPolicyShowWeb,
}: CompanyPolicySettingsProps) { }: CompanyPolicySettingsProps) {
return ( return (
<div className="p-6 space-y-6"> <div className="p-6 space-y-6">
@@ -69,18 +85,35 @@ export default function CompanyPolicySettings({
</button> </button>
</div> </div>
{showAddPolicy && ( {showAddPolicy && (
<div className="p-3 bg-white rounded-lg border border-blue-200"> <div className="p-3 bg-white rounded-lg border border-blue-200 space-y-3">
<input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm mb-2" placeholder="Policy Title" /> <input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex gap-2 mt-2"> <div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowApp(!newPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowWeb(!newPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
if (!newPolicyName.trim()) return; if (!newPolicyName.trim()) return;
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: [...settings.companyPolicy.investor, { title: newPolicyName, description: newPolicyDesc }] } }); const newPolicy = { title: newPolicyName, description: newPolicyDesc, showApp: newPolicyShowApp, showWeb: newPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: [...settings.companyPolicy.investor, newPolicy as typeof settings.companyPolicy.investor[number]] } });
setNewPolicyName(''); setNewPolicyName('');
setNewPolicyDesc(''); setNewPolicyDesc('');
setNewPolicyShowApp(true);
setNewPolicyShowWeb(true);
setShowAddPolicy(false); setShowAddPolicy(false);
}} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button> }} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button>
<button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button> <button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); setNewPolicyShowApp(true); setNewPolicyShowWeb(true); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button>
</div> </div>
</div> </div>
)} )}
@@ -91,10 +124,24 @@ export default function CompanyPolicySettings({
<div className="space-y-2"> <div className="space-y-2">
<input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" /> <input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowApp(!editPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowWeb(!editPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2"> <div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
const updated = [...settings.companyPolicy.investor]; const updated = [...settings.companyPolicy.investor];
updated[i] = { title: editPolicyName, description: editPolicyDescHtml }; updated[i] = { title: editPolicyName, description: editPolicyDescHtml, showApp: editPolicyShowApp, showWeb: editPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: updated } }); setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: updated } });
setEditingPolicy(null); setEditingPolicy(null);
setEditPolicyDescHtml(''); setEditPolicyDescHtml('');
@@ -102,16 +149,22 @@ export default function CompanyPolicySettings({
<button onClick={() => { setEditingPolicy(null); setEditPolicyDescHtml(''); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button> <button onClick={() => { setEditingPolicy(null); setEditPolicyDescHtml(''); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button>
</div> </div>
</div> </div>
) : ( ) : (
<div className="flex items-start justify-between"> <div className="flex items-start justify-between">
<div className="flex-1"> <div className="flex-1">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2 mb-1">
<span className="text-sm font-medium text-slate-700">{policy.title}</span> <span className="text-sm font-medium text-slate-700">{policy.title}</span>
{(policy as { showApp?: boolean; showWeb?: boolean }).showApp && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-blue-100 text-blue-600 rounded">App</span>
)}
{(policy as { showApp?: boolean; showWeb?: boolean }).showWeb && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-green-100 text-green-600 rounded">Web</span>
)}
</div> </div>
<div className="text-xs text-slate-500 mt-1 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} /> <div className="text-xs text-slate-500 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} />
</div> </div>
<div className="flex items-center gap-1 ml-2"> <div className="flex items-center gap-1 ml-2">
<button onClick={() => { setEditingPolicy({ tab: 'investor', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); }} className="p-1 text-slate-400 hover:text-blue-600"> <button onClick={() => { setEditingPolicy({ tab: 'investor', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); setEditPolicyShowApp((policy as { showApp?: boolean }).showApp ?? true); setEditPolicyShowWeb((policy as { showWeb?: boolean }).showWeb ?? true); }} className="p-1 text-slate-400 hover:text-blue-600">
<Pencil className="w-3.5 h-3.5" /> <Pencil className="w-3.5 h-3.5" />
</button> </button>
<button onClick={() => { <button onClick={() => {
@@ -138,18 +191,35 @@ export default function CompanyPolicySettings({
</button> </button>
</div> </div>
{showAddPolicy && ( {showAddPolicy && (
<div className="p-3 bg-white rounded-lg border border-blue-200"> <div className="p-3 bg-white rounded-lg border border-blue-200 space-y-3">
<input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm mb-2" placeholder="Policy Title" /> <input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex gap-2 mt-2"> <div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowApp(!newPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowWeb(!newPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
if (!newPolicyName.trim()) return; if (!newPolicyName.trim()) return;
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: [...settings.companyPolicy.merchant, { title: newPolicyName, description: newPolicyDesc }] } }); const newPolicy = { title: newPolicyName, description: newPolicyDesc, showApp: newPolicyShowApp, showWeb: newPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: [...settings.companyPolicy.merchant, newPolicy as typeof settings.companyPolicy.merchant[number]] } });
setNewPolicyName(''); setNewPolicyName('');
setNewPolicyDesc(''); setNewPolicyDesc('');
setNewPolicyShowApp(true);
setNewPolicyShowWeb(true);
setShowAddPolicy(false); setShowAddPolicy(false);
}} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button> }} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button>
<button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button> <button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); setNewPolicyShowApp(true); setNewPolicyShowWeb(true); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button>
</div> </div>
</div> </div>
)} )}
@@ -160,10 +230,24 @@ export default function CompanyPolicySettings({
<div className="space-y-2"> <div className="space-y-2">
<input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" /> <input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowApp(!editPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowWeb(!editPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2"> <div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
const updated = [...settings.companyPolicy.merchant]; const updated = [...settings.companyPolicy.merchant];
updated[i] = { title: editPolicyName, description: editPolicyDescHtml }; updated[i] = { title: editPolicyName, description: editPolicyDescHtml, showApp: editPolicyShowApp, showWeb: editPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: updated } }); setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: updated } });
setEditingPolicy(null); setEditingPolicy(null);
setEditPolicyDescHtml(''); setEditPolicyDescHtml('');
@@ -174,13 +258,19 @@ export default function CompanyPolicySettings({
) : ( ) : (
<div className="flex items-start justify-between"> <div className="flex items-start justify-between">
<div className="flex-1"> <div className="flex-1">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2 mb-1">
<span className="text-sm font-medium text-slate-700">{policy.title}</span> <span className="text-sm font-medium text-slate-700">{policy.title}</span>
{(policy as { showApp?: boolean; showWeb?: boolean }).showApp && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-blue-100 text-blue-600 rounded">App</span>
)}
{(policy as { showApp?: boolean; showWeb?: boolean }).showWeb && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-green-100 text-green-600 rounded">Web</span>
)}
</div> </div>
<div className="text-xs text-slate-500 mt-1 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} /> <div className="text-xs text-slate-500 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} />
</div> </div>
<div className="flex items-center gap-1 ml-2"> <div className="flex items-center gap-1 ml-2">
<button onClick={() => { setEditingPolicy({ tab: 'merchant', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); }} className="p-1 text-slate-400 hover:text-blue-600"> <button onClick={() => { setEditingPolicy({ tab: 'merchant', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); setEditPolicyShowApp((policy as { showApp?: boolean }).showApp ?? true); setEditPolicyShowWeb((policy as { showWeb?: boolean }).showWeb ?? true); }} className="p-1 text-slate-400 hover:text-blue-600">
<Pencil className="w-3.5 h-3.5" /> <Pencil className="w-3.5 h-3.5" />
</button> </button>
<button onClick={() => { <button onClick={() => {
@@ -207,18 +297,35 @@ export default function CompanyPolicySettings({
</button> </button>
</div> </div>
{showAddPolicy && ( {showAddPolicy && (
<div className="p-3 bg-white rounded-lg border border-blue-200"> <div className="p-3 bg-white rounded-lg border border-blue-200 space-y-3">
<input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm mb-2" placeholder="Policy Title" /> <input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex gap-2 mt-2"> <div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowApp(!newPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowWeb(!newPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
if (!newPolicyName.trim()) return; if (!newPolicyName.trim()) return;
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: [...settings.companyPolicy.swapStation, { title: newPolicyName, description: newPolicyDesc }] } }); const newPolicy = { title: newPolicyName, description: newPolicyDesc, showApp: newPolicyShowApp, showWeb: newPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: [...settings.companyPolicy.swapStation, newPolicy as typeof settings.companyPolicy.swapStation[number]] } });
setNewPolicyName(''); setNewPolicyName('');
setNewPolicyDesc(''); setNewPolicyDesc('');
setNewPolicyShowApp(true);
setNewPolicyShowWeb(true);
setShowAddPolicy(false); setShowAddPolicy(false);
}} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button> }} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button>
<button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button> <button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); setNewPolicyShowApp(true); setNewPolicyShowWeb(true); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button>
</div> </div>
</div> </div>
)} )}
@@ -229,10 +336,24 @@ export default function CompanyPolicySettings({
<div className="space-y-2"> <div className="space-y-2">
<input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" /> <input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowApp(!editPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowWeb(!editPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2"> <div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
const updated = [...settings.companyPolicy.swapStation]; const updated = [...settings.companyPolicy.swapStation];
updated[i] = { title: editPolicyName, description: editPolicyDescHtml }; updated[i] = { title: editPolicyName, description: editPolicyDescHtml, showApp: editPolicyShowApp, showWeb: editPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: updated } }); setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: updated } });
setEditingPolicy(null); setEditingPolicy(null);
setEditPolicyDescHtml(''); setEditPolicyDescHtml('');
@@ -243,13 +364,19 @@ export default function CompanyPolicySettings({
) : ( ) : (
<div className="flex items-start justify-between"> <div className="flex items-start justify-between">
<div className="flex-1"> <div className="flex-1">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2 mb-1">
<span className="text-sm font-medium text-slate-700">{policy.title}</span> <span className="text-sm font-medium text-slate-700">{policy.title}</span>
{(policy as { showApp?: boolean; showWeb?: boolean }).showApp && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-blue-100 text-blue-600 rounded">App</span>
)}
{(policy as { showApp?: boolean; showWeb?: boolean }).showWeb && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-green-100 text-green-600 rounded">Web</span>
)}
</div> </div>
<div className="text-xs text-slate-500 mt-1 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} /> <div className="text-xs text-slate-500 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} />
</div> </div>
<div className="flex items-center gap-1 ml-2"> <div className="flex items-center gap-1 ml-2">
<button onClick={() => { setEditingPolicy({ tab: 'swapstation', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); }} className="p-1 text-slate-400 hover:text-blue-600"> <button onClick={() => { setEditingPolicy({ tab: 'swapstation', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); setEditPolicyShowApp((policy as { showApp?: boolean }).showApp ?? true); setEditPolicyShowWeb((policy as { showWeb?: boolean }).showWeb ?? true); }} className="p-1 text-slate-400 hover:text-blue-600">
<Pencil className="w-3.5 h-3.5" /> <Pencil className="w-3.5 h-3.5" />
</button> </button>
<button onClick={() => { <button onClick={() => {
@@ -282,20 +409,36 @@ export default function CompanyPolicySettings({
</button> </button>
</div> </div>
{showAddPolicy && ( {showAddPolicy && (
<div className="p-3 bg-white rounded-lg border border-blue-200"> <div className="p-3 bg-white rounded-lg border border-blue-200 space-y-3">
<input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm mb-2" placeholder="Policy Title" /> <input type="text" value={newPolicyName} onChange={(e) => setNewPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={newPolicyDesc} onChange={(val) => setNewPolicyDesc(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex gap-2 mt-2"> <div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowApp(!newPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setNewPolicyShowWeb(!newPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${newPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${newPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
if (!newPolicyName.trim()) return; if (!newPolicyName.trim()) return;
const updated = { ...settings.companyPolicy.rentalTypes }; const updated = { ...settings.companyPolicy.rentalTypes };
updated[activeRentalTypeTab] = [...updated[activeRentalTypeTab], { title: newPolicyName, description: newPolicyDesc }]; updated[activeRentalTypeTab] = [...updated[activeRentalTypeTab], { title: newPolicyName, description: newPolicyDesc, showApp: newPolicyShowApp, showWeb: newPolicyShowWeb }];
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, rentalTypes: updated } }); setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, rentalTypes: updated } });
setNewPolicyName(''); setNewPolicyName('');
setNewPolicyDesc(''); setNewPolicyDesc('');
setNewPolicyShowApp(true);
setNewPolicyShowWeb(true);
setShowAddPolicy(false); setShowAddPolicy(false);
}} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button> }} className="px-2 py-1 bg-blue-600 text-white rounded text-xs">Add</button>
<button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button> <button onClick={() => { setShowAddPolicy(false); setNewPolicyName(''); setNewPolicyDesc(''); setNewPolicyShowApp(true); setNewPolicyShowWeb(true); }} className="px-2 py-1 bg-slate-200 text-slate-600 rounded text-xs">Cancel</button>
</div> </div>
</div> </div>
)} )}
@@ -306,10 +449,24 @@ export default function CompanyPolicySettings({
<div className="space-y-2"> <div className="space-y-2">
<input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" /> <input type="text" value={editPolicyName} onChange={(e) => setEditPolicyName(e.target.value)} className="w-full px-2 py-1.5 border border-slate-200 rounded text-sm" placeholder="Policy Title" />
<RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} /> <RichTextEditor value={editPolicyDescHtml} onChange={(val) => setEditPolicyDescHtml(val)} placeholder="Policy Description..." minHeight={100} />
<div className="flex items-center gap-6">
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowApp(!editPolicyShowApp)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowApp ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowApp ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on App</span>
</div>
<div className="flex items-center gap-2">
<button type="button" onClick={() => setEditPolicyShowWeb(!editPolicyShowWeb)} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${editPolicyShowWeb ? 'bg-blue-600' : 'bg-slate-300'}`}>
<span className={`inline-block h-4 w-4 transform rounded-full bg-white transition-transform ${editPolicyShowWeb ? 'translate-x-6' : 'translate-x-1'}`} />
</button>
<span className="text-xs font-medium text-slate-600">Show on Web</span>
</div>
</div>
<div className="flex gap-2"> <div className="flex gap-2">
<button onClick={() => { <button onClick={() => {
const updated = { ...settings.companyPolicy.rentalTypes }; const updated = { ...settings.companyPolicy.rentalTypes };
updated[activeRentalTypeTab][i] = { title: editPolicyName, description: editPolicyDescHtml }; updated[activeRentalTypeTab][i] = { title: editPolicyName, description: editPolicyDescHtml, showApp: editPolicyShowApp, showWeb: editPolicyShowWeb };
setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, rentalTypes: updated } }); setSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, rentalTypes: updated } });
setEditingPolicy(null); setEditingPolicy(null);
setEditPolicyDescHtml(''); setEditPolicyDescHtml('');
@@ -320,13 +477,19 @@ export default function CompanyPolicySettings({
) : ( ) : (
<div className="flex items-start justify-between"> <div className="flex items-start justify-between">
<div className="flex-1"> <div className="flex-1">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2 mb-1">
<span className="text-sm font-medium text-slate-700">{policy.title}</span> <span className="text-sm font-medium text-slate-700">{policy.title}</span>
{(policy as { showApp?: boolean; showWeb?: boolean }).showApp && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-blue-100 text-blue-600 rounded">App</span>
)}
{(policy as { showApp?: boolean; showWeb?: boolean }).showWeb && (
<span className="px-1.5 py-0.5 text-[10px] font-bold bg-green-100 text-green-600 rounded">Web</span>
)}
</div> </div>
<div className="text-xs text-slate-500 mt-1 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} /> <div className="text-xs text-slate-500 prose prose-sm max-w-none" dangerouslySetInnerHTML={{ __html: policy.description }} />
</div> </div>
<div className="flex items-center gap-1 ml-2"> <div className="flex items-center gap-1 ml-2">
<button onClick={() => { setEditingPolicy({ tab: 'rentalType', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); }} className="p-1 text-slate-400 hover:text-blue-600"> <button onClick={() => { setEditingPolicy({ tab: 'rentalType', index: i }); setEditPolicyName(policy.title); setEditPolicyDescHtml(policy.description); setEditPolicyShowApp((policy as { showApp?: boolean }).showApp ?? true); setEditPolicyShowWeb((policy as { showWeb?: boolean }).showWeb ?? true); }} className="p-1 text-slate-400 hover:text-blue-600">
<Pencil className="w-3.5 h-3.5" /> <Pencil className="w-3.5 h-3.5" />
</button> </button>
<button onClick={() => { <button onClick={() => {

75
src/app/admin/settings/page.tsx
View File

@@ -85,13 +85,13 @@ export interface CompanySettings {
parts: { id: string; name: string; buyingPrice: number; sellingPrice: number }[]; parts: { id: string; name: string; buyingPrice: number; sellingPrice: number }[];
serviceCenters: { id: string; name: string; address: string; phone: string; rating: number }[]; serviceCenters: { id: string; name: string; address: string; phone: string; rating: number }[];
companyPolicy: { companyPolicy: {
investor: { title: string; description: string }[]; investor: { title: string; description: string; showApp: boolean; showWeb: boolean }[];
merchant: { title: string; description: string }[]; merchant: { title: string; description: string; showApp: boolean; showWeb: boolean }[];
swapStation: { title: string; description: string }[]; swapStation: { title: string; description: string; showApp: boolean; showWeb: boolean }[];
rentalTypes: { rentalTypes: {
single: { title: string; description: string }[]; single: { title: string; description: string; showApp: boolean; showWeb: boolean }[];
shared: { title: string; description: string }[]; shared: { title: string; description: string; showApp: boolean; showWeb: boolean }[];
renttoown: { title: string; description: string }[]; renttoown: { title: string; description: string; showApp: boolean; showWeb: boolean }[];
}; };
}; };
rentalPolicy: { rentalPolicy: {
@@ -406,35 +406,35 @@ const initialSettings: CompanySettings = {
], ],
companyPolicy: { companyPolicy: {
investor: [ investor: [
{ title: 'Investor Policy', description: '<h2>Investor Guidelines</h2><p>Welcome to our investor program. This document outlines the terms and conditions for all investors participating in our EV fleet sharing initiative.</p><h3>Key Requirements</h3><ul><li>All investors must complete KYC verification</li><li>Minimum investment amount: ৳100,000</li><li>Monthly returns are calculated based on fleet utilization</li></ul><p><strong>Note:</strong> Past performance does not guarantee future results. Please read all terms carefully before investing.</p>' }, { title: 'Investor Policy', description: '<h2>Investor Guidelines</h2><p>Welcome to our investor program. This document outlines the terms and conditions for all investors participating in our EV fleet sharing initiative.</p><h3>Key Requirements</h3><ul><li>All investors must complete KYC verification</li><li>Minimum investment amount: ৳100,000</li><li>Monthly returns are calculated based on fleet utilization</li></ul><p><strong>Note:</strong> Past performance does not guarantee future results. Please read all terms carefully before investing.</p>', showApp: true, showWeb: true },
{ title: 'Investor Risk Policy', description: '<h2>Risk Disclosure</h2><p>All investments carry risk. Past performance does not guarantee future results.</p><h3>Risk Factors</h3><ul><li>Market fluctuations</li><li>Operational risks</li><li>Regulatory changes</li></ul>' }, { title: 'Investor Risk Policy', description: '<h2>Risk Disclosure</h2><p>All investments carry risk. Past performance does not guarantee future results.</p><h3>Risk Factors</h3><ul><li>Market fluctuations</li><li>Operational risks</li><li>Regulatory changes</li></ul>', showApp: true, showWeb: false },
{ title: 'Investor Returns Policy', description: '<h2>Returns</h2><p>Returns depend on fleet performance and utilization.</p><h3>Return Calculation</h3><ul><li>Monthly returns: 2-5%</li><li>Quarterly settlements</li><li>Annual statements</li></ul>' } { title: 'Investor Returns Policy', description: '<h2>Returns</h2><p>Returns depend on fleet performance and utilization.</p><h3>Return Calculation</h3><ul><li>Monthly returns: 2-5%</li><li>Quarterly settlements</li><li>Annual statements</li></ul>', showApp: true, showWeb: true }
], ],
merchant: [ merchant: [
{ title: 'Merchant Policy', description: '<h2>Merchant Terms</h2><p>Thank you for joining our merchant network. These guidelines ensure smooth operations.</p><h3>Operational Requirements</h3><ul><li>Maintain minimum inventory levels</li><li>Provide excellent customer service</li><li>Accept all payment methods</li></ul>' }, { title: 'Merchant Policy', description: '<h2>Merchant Terms</h2><p>Thank you for joining our merchant network. These guidelines ensure smooth operations.</p><h3>Operational Requirements</h3><ul><li>Maintain minimum inventory levels</li><li>Provide excellent customer service</li><li>Accept all payment methods</li></ul>', showApp: true, showWeb: true },
{ title: 'Merchant SLA Policy', description: '<h2>Service Level Agreement</h2><p>Orders must be processed within 24 hours.</p><h3>Response Time</h3><ul><li>Order confirmation: Within 2 hours</li><li>Delivery: Within 24 hours</li><li>Support: Within 4 hours</li></ul>' }, { title: 'Merchant SLA Policy', description: '<h2>Service Level Agreement</h2><p>Orders must be processed within 24 hours.</p><h3>Response Time</h3><ul><li>Order confirmation: Within 2 hours</li><li>Delivery: Within 24 hours</li><li>Support: Within 4 hours</li></ul>', showApp: true, showWeb: false },
{ title: 'Merchant Commission Policy', description: '<h2>Commission</h2><p>Merchants earn 15% commission per order.</p><h3>Commission Structure</h3><ul><li>Standard orders: 15%</li><li>Bulk orders: 18%</li><li>Premium merchants: 20%</li></ul>' } { title: 'Merchant Commission Policy', description: '<h2>Commission</h2><p>Merchants earn 15% commission per order.</p><h3>Commission Structure</h3><ul><li>Standard orders: 15%</li><li>Bulk orders: 18%</li><li>Premium merchants: 20%</li></ul>', showApp: true, showWeb: true }
], ],
swapStation: [ swapStation: [
{ title: 'Swap Station Policy', description: '<h2>Swap Guidelines</h2><p>Follow safety protocols when handling batteries.</p><h3>General Guidelines</h3><ul><li>Wear protective gloves</li><li>Inspect batteries before swapping</li><li>Keep area clean</li></ul>' }, { title: 'Swap Station Policy', description: '<h2>Swap Guidelines</h2><p>Follow safety protocols when handling batteries.</p><h3>General Guidelines</h3><ul><li>Wear protective gloves</li><li>Inspect batteries before swapping</li><li>Keep area clean</li></ul>', showApp: true, showWeb: true },
{ title: 'Battery Safety Policy', description: '<h2>Battery Handling</h2><p>Use gloves and inspect batteries before and after swapping.</p><h3>Safety Measures</h3><ul><li>Check for physical damage</li><li>Verify charge level</li><li>Report malfunctions</li></ul>' }, { title: 'Battery Safety Policy', description: '<h2>Battery Handling</h2><p>Use gloves and inspect batteries before and after swapping.</p><h3>Safety Measures</h3><ul><li>Check for physical damage</li><li>Verify charge level</li><li>Report malfunctions</li></ul>', showApp: true, showWeb: false },
{ title: 'Maintenance Policy', description: '<h2>Maintenance</h2><p>Keep stations clean and operational at all times.</p><h3>Daily Tasks</h3><ul><li>Clean charging pads</li><li>Check cable conditions</li><li>Update system software</li></ul>' } { title: 'Maintenance Policy', description: '<h2>Maintenance</h2><p>Keep stations clean and operational at all times.</p><h3>Daily Tasks</h3><ul><li>Clean charging pads</li><li>Check cable conditions</li><li>Update system software</li></ul>', showApp: true, showWeb: true }
], ],
rentalTypes: { rentalTypes: {
single: [ single: [
{ title: 'Rental (Single)', description: '<h2>Single Rental</h2><p>Perfect for individual riders who need a reliable vehicle for daily commute or delivery work.</p><h3>Plan Features</h3><ul><li>Daily, weekly, and monthly options</li><li>Comprehensive insurance included</li><li>24/7 roadside assistance</li></ul>' }, { title: 'Rental (Single)', description: '<h2>Single Rental</h2><p>Perfect for individual riders who need a reliable vehicle for daily commute or delivery work.</p><h3>Plan Features</h3><ul><li>Daily, weekly, and monthly options</li><li>Comprehensive insurance included</li><li>24/7 roadside assistance</li></ul>', showApp: true, showWeb: true },
{ title: 'Single Rental Pricing', description: '<h2>Pricing</h2><p>Starts from ৳400/day with ৳5,000 deposit.</p><h3>Rates</h3><ul><li>Daily: ৳400</li><li>Weekly: ৳2,800</li><li>Monthly: ৳12,000</li></ul>' }, { title: 'Single Rental Pricing', description: '<h2>Pricing</h2><p>Starts from ৳400/day with ৳5,000 deposit.</p><h3>Rates</h3><ul><li>Daily: ৳400</li><li>Weekly: ৳2,800</li><li>Monthly: ৳12,000</li></ul>', showApp: true, showWeb: false },
{ title: 'Single Rental Benefits', description: '<h2>Benefits</h2><p>Includes maintenance, insurance, and support.</p><h3>Included</h3><ul><li>Free maintenance</li><li>Full insurance coverage</li><li>24/7 customer support</li></ul>' } { title: 'Single Rental Benefits', description: '<h2>Benefits</h2><p>Includes maintenance, insurance, and support.</p><h3>Included</h3><ul><li>Free maintenance</li><li>Full insurance coverage</li><li>24/7 customer support</li></ul>', showApp: true, showWeb: true }
], ],
shared: [ shared: [
{ title: 'Rental (2 Person Shared)', description: '<h2>Shared Plan</h2><p>Two riders share cost and responsibilities.</p><h3>Plan Features</h3><ul><li>Split costs between two riders</li><li>Both users must be verified</li><li>Shared liability coverage</li></ul>' }, { title: 'Rental (2 Person Shared)', description: '<h2>Shared Plan</h2><p>Two riders share cost and responsibilities.</p><h3>Plan Features</h3><ul><li>Split costs between two riders</li><li>Both users must be verified</li><li>Shared liability coverage</li></ul>', showApp: true, showWeb: true },
{ title: 'Shared Plan Benefits', description: '<h2>Benefits</h2><p>Split payment and flexible usage.</p><h3>Advantages</h3><ul><li>50% cost savings</li><li>Flexible driver switching</li><li>Shared deposit</li></ul>' }, { title: 'Shared Plan Benefits', description: '<h2>Benefits</h2><p>Split payment and flexible usage.</p><h3>Advantages</h3><ul><li>50% cost savings</li><li>Flexible driver switching</li><li>Shared deposit</li></ul>', showApp: true, showWeb: false },
{ title: 'Shared Pricing', description: '<h2>Pricing</h2><p>৳600/day total (৳300 each).</p><h3>Rates</h3><ul><li>Daily: ৳600 (৳300 each)</li><li>Weekly: ৳4,200 (৳2,100 each)</li><li>Monthly: ৳16,800 (৳8,400 each)</li></ul>' } { title: 'Shared Pricing', description: '<h2>Pricing</h2><p>৳600/day total (৳300 each).</p><h3>Rates</h3><ul><li>Daily: ৳600 (৳300 each)</li><li>Weekly: ৳4,200 (৳2,100 each)</li><li>Monthly: ৳16,800 (৳8,400 each)</li></ul>', showApp: true, showWeb: true }
], ],
renttoown: [ renttoown: [
{ title: 'Rent-to-Own', description: '<h2>Ownership Plan</h2><p>Own vehicle after completing payment tenure.</p><h3>Program Benefits</h3><ul><li>50% payments go toward purchase</li><li>Option to buyout anytime</li><li>Full ownership after 36 months</li></ul>' }, { title: 'Rent-to-Own', description: '<h2>Ownership Plan</h2><p>Own vehicle after completing payment tenure.</p><h3>Program Benefits</h3><ul><li>50% payments go toward purchase</li><li>Option to buyout anytime</li><li>Full ownership after 36 months</li></ul>', showApp: true, showWeb: true },
{ title: 'Eligibility', description: '<h2>Eligibility</h2><p>Requires good payment history.</p><h3>Requirements</h3><ul><li>Credit check applies</li><li>Stable income proof</li><li>Minimum 6 months tenure</li></ul>' }, { title: 'Eligibility', description: '<h2>Eligibility</h2><p>Requires good payment history.</p><h3>Requirements</h3><ul><li>Credit check applies</li><li>Stable income proof</li><li>Minimum 6 months tenure</li></ul>', showApp: true, showWeb: false },
{ title: 'Ownership Benefits', description: '<h2>Benefits</h2><p>50% of payments go toward vehicle purchase.</p><h3>Advantages</h3><ul><li>Transferable to family</li><li>No hidden costs</li><li>Full warranty included</li></ul>' } { title: 'Ownership Benefits', description: '<h2>Benefits</h2><p>50% of payments go toward vehicle purchase.</p><h3>Advantages</h3><ul><li>Transferable to family</li><li>No hidden costs</li><li>Full warranty included</li></ul>', showApp: true, showWeb: true }
] ]
}, },
}, },
@@ -829,9 +829,13 @@ export default function CompanySettingsPage() {
const [editPolicyName, setEditPolicyName] = useState(''); const [editPolicyName, setEditPolicyName] = useState('');
const [editPolicyDesc, setEditPolicyDesc] = useState(''); const [editPolicyDesc, setEditPolicyDesc] = useState('');
const [editPolicyDescHtml, setEditPolicyDescHtml] = useState(''); const [editPolicyDescHtml, setEditPolicyDescHtml] = useState('');
const [editPolicyShowApp, setEditPolicyShowApp] = useState(true);
const [editPolicyShowWeb, setEditPolicyShowWeb] = useState(true);
const [showAddPolicy, setShowAddPolicy] = useState(false); const [showAddPolicy, setShowAddPolicy] = useState(false);
const [newPolicyName, setNewPolicyName] = useState(''); const [newPolicyName, setNewPolicyName] = useState('');
const [newPolicyDesc, setNewPolicyDesc] = useState(''); const [newPolicyDesc, setNewPolicyDesc] = useState('');
const [newPolicyShowApp, setNewPolicyShowApp] = useState(true);
const [newPolicyShowWeb, setNewPolicyShowWeb] = useState(true);
const [addInvestPlan, setAddInvestPlan] = useState(false); const [addInvestPlan, setAddInvestPlan] = useState(false);
const [newInvestName, setNewInvestName] = useState(''); const [newInvestName, setNewInvestName] = useState('');
const [newInvestTier, setNewInvestTier] = useState('Standard'); const [newInvestTier, setNewInvestTier] = useState('Standard');
@@ -1063,13 +1067,13 @@ export default function CompanySettingsPage() {
const addPolicyRule = (tab: 'investor' | 'merchant' | 'swapstation') => { const addPolicyRule = (tab: 'investor' | 'merchant' | 'swapstation') => {
if (!newPolicyName.trim()) return; if (!newPolicyName.trim()) return;
const newRule = { title: newPolicyName, description: newPolicyDesc || '<p></p>' }; const newRule = { title: newPolicyName, description: newPolicyDesc || '<p></p>', showApp: newPolicyShowApp, showWeb: newPolicyShowWeb };
if (tab === 'investor') { if (tab === 'investor') {
updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: [...settings.companyPolicy.investor, newRule] } }); updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: [...settings.companyPolicy.investor, newRule as typeof settings.companyPolicy.investor[number]] } });
} else if (tab === 'merchant') { } else if (tab === 'merchant') {
updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: [...settings.companyPolicy.merchant, newRule] } }); updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: [...settings.companyPolicy.merchant, newRule as typeof settings.companyPolicy.merchant[number]] } });
} else if (tab === 'swapstation') { } else if (tab === 'swapstation') {
updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: [...settings.companyPolicy.swapStation, newRule] } }); updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: [...settings.companyPolicy.swapStation, newRule as typeof settings.companyPolicy.swapStation[number]] } });
} }
setNewPolicyName(''); setNewPolicyName('');
setNewPolicyDesc(''); setNewPolicyDesc('');
@@ -1091,17 +1095,18 @@ export default function CompanySettingsPage() {
const updatePolicyRule = (tab: 'investor' | 'merchant' | 'swapstation', index: number) => { const updatePolicyRule = (tab: 'investor' | 'merchant' | 'swapstation', index: number) => {
const newDesc = editPolicyDescHtml || editPolicyDesc; const newDesc = editPolicyDescHtml || editPolicyDesc;
const updated = { title: editPolicyName, description: newDesc, showApp: editPolicyShowApp, showWeb: editPolicyShowWeb };
if (tab === 'investor') { if (tab === 'investor') {
const newRules = [...settings.companyPolicy.investor]; const newRules = [...settings.companyPolicy.investor];
newRules[index] = { title: editPolicyName, description: newDesc }; newRules[index] = updated as typeof settings.companyPolicy.investor[number];
updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: newRules } }); updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, investor: newRules } });
} else if (tab === 'merchant') { } else if (tab === 'merchant') {
const newRules = [...settings.companyPolicy.merchant]; const newRules = [...settings.companyPolicy.merchant];
newRules[index] = { title: editPolicyName, description: newDesc }; newRules[index] = updated as typeof settings.companyPolicy.merchant[number];
updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: newRules } }); updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, merchant: newRules } });
} else if (tab === 'swapstation') { } else if (tab === 'swapstation') {
const newRules = [...settings.companyPolicy.swapStation]; const newRules = [...settings.companyPolicy.swapStation];
newRules[index] = { title: editPolicyName, description: newDesc }; newRules[index] = updated as typeof settings.companyPolicy.swapStation[number];
updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: newRules } }); updateSettings({ ...settings, companyPolicy: { ...settings.companyPolicy, swapStation: newRules } });
} }
setEditingPolicy(null); setEditingPolicy(null);
@@ -1262,6 +1267,14 @@ export default function CompanySettingsPage() {
setNewPolicyName={setNewPolicyName} setNewPolicyName={setNewPolicyName}
newPolicyDesc={newPolicyDesc} newPolicyDesc={newPolicyDesc}
setNewPolicyDesc={setNewPolicyDesc} setNewPolicyDesc={setNewPolicyDesc}
newPolicyShowApp={newPolicyShowApp}
setNewPolicyShowApp={setNewPolicyShowApp}
newPolicyShowWeb={newPolicyShowWeb}
setNewPolicyShowWeb={setNewPolicyShowWeb}
editPolicyShowApp={editPolicyShowApp}
setEditPolicyShowApp={setEditPolicyShowApp}
editPolicyShowWeb={editPolicyShowWeb}
setEditPolicyShowWeb={setEditPolicyShowWeb}
/> />
)} )}

2
src/app/page.tsx
View File

@@ -34,7 +34,7 @@ export default function LandingPage() {
case 'biker': case 'biker':
router.push('/biker'); router.push('/biker');
break; break;
case 'swap-station': case 'swapstation':
router.push('/swapstation'); router.push('/swapstation');
break; break;
case 'merchant': case 'merchant':