feat: add username/password fields to customer form for Espo auth
Instead of manually entering base64, users can now type username and password which auto-generates the Espo-Authorization header value. Empty credentials on edit won't overwrite existing API key. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
+35
-4
@@ -160,12 +160,27 @@ function CustomerForm({ onDone, onCancel, customer }) {
|
||||
name: customer?.name || '', email: customer?.email || '',
|
||||
espocrm_url: customer?.espocrm_url || '', espocrm_api_key: ''
|
||||
})
|
||||
const [authUser, setAuthUser] = useState('')
|
||||
const [authPass, setAuthPass] = useState('')
|
||||
|
||||
const updateAuthFromCredentials = (user, pass) => {
|
||||
setAuthUser(user)
|
||||
setAuthPass(pass)
|
||||
if (user && pass) {
|
||||
setForm(f => ({ ...f, espocrm_api_key: btoa(user + ':' + pass) }))
|
||||
} else {
|
||||
setForm(f => ({ ...f, espocrm_api_key: '' }))
|
||||
}
|
||||
}
|
||||
|
||||
const submit = async () => {
|
||||
const payload = { ...form }
|
||||
if (!payload.espocrm_api_key) delete payload.espocrm_api_key
|
||||
const url = isEdit ? `${API}/customers/${customer.id}` : `${API}/customers`
|
||||
await fetch(url, {
|
||||
method: isEdit ? 'PUT' : 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(form)
|
||||
body: JSON.stringify(payload)
|
||||
})
|
||||
onDone()
|
||||
}
|
||||
@@ -178,9 +193,25 @@ function CustomerForm({ onDone, onCancel, customer }) {
|
||||
className={inputClass} dir="ltr" />
|
||||
<input placeholder="EspoCRM URL" value={form.espocrm_url} onChange={e => setForm({ ...form, espocrm_url: e.target.value })}
|
||||
className={inputClass} dir="ltr" />
|
||||
<input placeholder={isEdit ? "Espo-Authorization (השאר ריק אם לא משתנה)" : "Espo-Authorization (base64)"}
|
||||
value={form.espocrm_api_key} onChange={e => setForm({ ...form, espocrm_api_key: e.target.value })}
|
||||
className={`${inputClass} font-mono`} dir="ltr" />
|
||||
<div className="bg-slate-50 rounded-xl p-3 space-y-2">
|
||||
<p className="text-xs font-bold text-slate-500 text-right">פרטי התחברות ל-EspoCRM</p>
|
||||
<div className="flex gap-2">
|
||||
<input placeholder="סיסמה" value={authPass}
|
||||
onChange={e => updateAuthFromCredentials(authUser, e.target.value)}
|
||||
className="flex-1 bg-white border border-slate-200 rounded-lg px-3 py-2 text-sm focus:ring-2 focus:ring-blue-500" dir="ltr" type="password" />
|
||||
<input placeholder="שם משתמש" value={authUser}
|
||||
onChange={e => updateAuthFromCredentials(e.target.value, authPass)}
|
||||
className="flex-1 bg-white border border-slate-200 rounded-lg px-3 py-2 text-sm focus:ring-2 focus:ring-blue-500" dir="ltr" />
|
||||
</div>
|
||||
{form.espocrm_api_key && (
|
||||
<p className="text-[10px] text-slate-400 font-mono truncate" dir="ltr">
|
||||
Espo-Authorization: {form.espocrm_api_key}
|
||||
</p>
|
||||
)}
|
||||
{isEdit && !form.espocrm_api_key && (
|
||||
<p className="text-[10px] text-slate-400 text-right">השאר ריק כדי לא לשנות</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<button onClick={submit}
|
||||
className="deep-action-gradient text-white px-4 py-2.5 rounded-xl font-bold flex-1 shadow-lg shadow-blue-500/20 active:scale-95 transition-all">
|
||||
|
||||
Reference in New Issue
Block a user