woms 3.0
This commit is contained in:
Basilosaurusrex
698
src/pages/AdminPage.jsx
Normal file
698
src/pages/AdminPage.jsx
Normal file
@@ -0,0 +1,698 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
import { useAdminConfig } from '../hooks/useAdminConfig'
|
||||
import { useAuth } from '../context/AuthContext'
|
||||
import { useCustomers } from '../hooks/useCustomers'
|
||||
import { useEmployees } from '../hooks/useEmployees'
|
||||
import { FaPlus, FaTrash, FaFloppyDisk, FaSpinner } from 'react-icons/fa6'
|
||||
import { FaEdit } from 'react-icons/fa'
|
||||
|
||||
export default function AdminPage() {
|
||||
const { user, isAdmin } = useAuth()
|
||||
const { config, loading, error, updateConfig } = useAdminConfig()
|
||||
const { customers, loading: customersLoading, createCustomer, updateCustomer, deleteCustomer, refresh: refreshCustomers } = useCustomers()
|
||||
const { employees, loading: employeesLoading, createEmployee, updateEmployee, deleteEmployee, refresh: refreshEmployees } = useEmployees()
|
||||
const [localConfig, setLocalConfig] = useState(() => {
|
||||
// Initialisiere mit Default-Werten falls config noch nicht geladen
|
||||
if (config && Object.keys(config).length > 0) {
|
||||
return config
|
||||
}
|
||||
return {
|
||||
ticketTypes: [],
|
||||
systems: [],
|
||||
responseLevels: [],
|
||||
serviceTypes: [],
|
||||
priorities: []
|
||||
}
|
||||
})
|
||||
const [saving, setSaving] = useState(false)
|
||||
const [saveMessage, setSaveMessage] = useState('')
|
||||
const [editingCustomer, setEditingCustomer] = useState(null)
|
||||
const [customerForm, setCustomerForm] = useState({ code: '', name: '', location: '', email: '', phone: '' })
|
||||
const [editingEmployee, setEditingEmployee] = useState(null)
|
||||
const [employeeForm, setEmployeeForm] = useState({ userId: '', displayName: '', email: '', shortcode: '' })
|
||||
|
||||
// Update localConfig when config loads
|
||||
useEffect(() => {
|
||||
if (config && Object.keys(config).length > 0) {
|
||||
setLocalConfig(config)
|
||||
}
|
||||
}, [config])
|
||||
|
||||
if (!isAdmin) {
|
||||
return (
|
||||
<div className="main-content">
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
<h2>Zugriff verweigert</h2>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
<p>Du hast keine Berechtigung, auf diese Seite zuzugreifen.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const handleAddItem = (field) => {
|
||||
setLocalConfig(prev => ({
|
||||
...prev,
|
||||
[field]: [...prev[field], field === 'priorities' ? { value: prev[field].length, label: 'New' } : 'New Item']
|
||||
}))
|
||||
}
|
||||
|
||||
const handleRemoveItem = (field, index) => {
|
||||
setLocalConfig(prev => ({
|
||||
...prev,
|
||||
[field]: prev[field].filter((_, i) => i !== index)
|
||||
}))
|
||||
}
|
||||
|
||||
const handleUpdateItem = (field, index, value) => {
|
||||
setLocalConfig(prev => {
|
||||
const newArray = [...prev[field]]
|
||||
if (field === 'priorities') {
|
||||
newArray[index] = { ...newArray[index], ...value }
|
||||
} else {
|
||||
newArray[index] = value
|
||||
}
|
||||
return { ...prev, [field]: newArray }
|
||||
})
|
||||
}
|
||||
|
||||
const handleSave = async () => {
|
||||
setSaving(true)
|
||||
setSaveMessage('')
|
||||
|
||||
const result = await updateConfig(localConfig)
|
||||
|
||||
if (result.success) {
|
||||
setSaveMessage('Konfiguration erfolgreich gespeichert!')
|
||||
setTimeout(() => setSaveMessage(''), 3000)
|
||||
} else {
|
||||
setSaveMessage('Fehler beim Speichern: ' + (result.error || 'Unbekannter Fehler'))
|
||||
}
|
||||
|
||||
setSaving(false)
|
||||
}
|
||||
|
||||
if (loading && !config) {
|
||||
return (
|
||||
<div className="main-content text-center p-4">
|
||||
<FaSpinner className="spinner" size={32} />
|
||||
<p>Lade Konfiguration...</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="main-content">
|
||||
<header className="text-center mb-2">
|
||||
<h2>Admin Panel - Dropdown Konfiguration</h2>
|
||||
</header>
|
||||
|
||||
{error && (
|
||||
<div className="bg-red text-white p-2 mb-2" style={{ borderRadius: '4px' }}>
|
||||
Fehler: {error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{saveMessage && (
|
||||
<div className={`p-2 mb-2 ${saveMessage.includes('erfolgreich') ? 'bg-green text-white' : 'bg-red text-white'}`} style={{ borderRadius: '4px' }}>
|
||||
{saveMessage}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="row">
|
||||
{/* Ticket Types */}
|
||||
<div className="col col-6">
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Work Order Types</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{localConfig.ticketTypes?.map((type, index) => (
|
||||
<div key={index} className="form-group" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={type}
|
||||
onChange={(e) => handleUpdateItem('ticketTypes', index, e.target.value)}
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={() => handleRemoveItem('ticketTypes', index)}
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={() => handleAddItem('ticketTypes')}
|
||||
style={{ width: '100%', marginTop: '8px' }}
|
||||
>
|
||||
<FaPlus /> Hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Systems */}
|
||||
<div className="col col-6">
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Affected Systems</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{localConfig.systems?.map((system, index) => (
|
||||
<div key={index} className="form-group" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={system}
|
||||
onChange={(e) => handleUpdateItem('systems', index, e.target.value)}
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={() => handleRemoveItem('systems', index)}
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={() => handleAddItem('systems')}
|
||||
style={{ width: '100%', marginTop: '8px' }}
|
||||
>
|
||||
<FaPlus /> Hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row">
|
||||
{/* Response Levels */}
|
||||
<div className="col col-6">
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Response Levels</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{localConfig.responseLevels?.map((level, index) => (
|
||||
<div key={index} className="form-group" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={level}
|
||||
onChange={(e) => handleUpdateItem('responseLevels', index, e.target.value)}
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={() => handleRemoveItem('responseLevels', index)}
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={() => handleAddItem('responseLevels')}
|
||||
style={{ width: '100%', marginTop: '8px' }}
|
||||
>
|
||||
<FaPlus /> Hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Service Types */}
|
||||
<div className="col col-6">
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Service Types</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{localConfig.serviceTypes?.map((type, index) => (
|
||||
<div key={index} className="form-group" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={type}
|
||||
onChange={(e) => handleUpdateItem('serviceTypes', index, e.target.value)}
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={() => handleRemoveItem('serviceTypes', index)}
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={() => handleAddItem('serviceTypes')}
|
||||
style={{ width: '100%', marginTop: '8px' }}
|
||||
>
|
||||
<FaPlus /> Hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Priorities */}
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Priorities</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{localConfig.priorities?.map((priority, index) => (
|
||||
<div key={index} className="form-group" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
|
||||
<input
|
||||
type="number"
|
||||
className="form-control"
|
||||
value={priority.value}
|
||||
onChange={(e) => handleUpdateItem('priorities', index, { ...priority, value: parseInt(e.target.value) })}
|
||||
style={{ width: '100px' }}
|
||||
placeholder="Value"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={priority.label}
|
||||
onChange={(e) => handleUpdateItem('priorities', index, { ...priority, label: e.target.value })}
|
||||
style={{ flex: 1 }}
|
||||
placeholder="Label"
|
||||
/>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={() => handleRemoveItem('priorities', index)}
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={() => handleAddItem('priorities')}
|
||||
style={{ width: '100%', marginTop: '8px' }}
|
||||
>
|
||||
<FaPlus /> Hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Customers */}
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Customers</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{customersLoading ? (
|
||||
<div className="text-center p-2">
|
||||
<FaSpinner className="spinner" /> Lade Kunden...
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<table className="table" style={{ marginBottom: '16px' }}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Code</th>
|
||||
<th>Name</th>
|
||||
<th>Location</th>
|
||||
<th>Email</th>
|
||||
<th>Phone</th>
|
||||
<th>Aktionen</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{customers.map((customer) => (
|
||||
<tr key={customer.$id}>
|
||||
{editingCustomer === customer.$id ? (
|
||||
<>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.code}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, code: e.target.value }))}
|
||||
style={{ width: '100px' }}
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.name}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, name: e.target.value }))}
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.location}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, location: e.target.value }))}
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
value={customerForm.email}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, email: e.target.value }))}
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.phone}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, phone: e.target.value }))}
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={async () => {
|
||||
const result = await updateCustomer(customer.$id, customerForm)
|
||||
if (result.success) {
|
||||
setEditingCustomer(null)
|
||||
setCustomerForm({ code: '', name: '', location: '', email: '', phone: '' })
|
||||
}
|
||||
}}
|
||||
>
|
||||
Speichern
|
||||
</button>
|
||||
<button
|
||||
className="btn"
|
||||
onClick={() => {
|
||||
setEditingCustomer(null)
|
||||
setCustomerForm({ code: '', name: '', location: '', email: '', phone: '' })
|
||||
}}
|
||||
style={{ marginLeft: '4px' }}
|
||||
>
|
||||
Abbrechen
|
||||
</button>
|
||||
</td>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<td>{customer.code || '-'}</td>
|
||||
<td>{customer.name || '-'}</td>
|
||||
<td>{customer.location || '-'}</td>
|
||||
<td>{customer.email || '-'}</td>
|
||||
<td>{customer.phone || '-'}</td>
|
||||
<td>
|
||||
<button
|
||||
className="btn"
|
||||
onClick={() => {
|
||||
setEditingCustomer(customer.$id)
|
||||
setCustomerForm({
|
||||
code: customer.code || '',
|
||||
name: customer.name || '',
|
||||
location: customer.location || '',
|
||||
email: customer.email || '',
|
||||
phone: customer.phone || ''
|
||||
})
|
||||
}}
|
||||
>
|
||||
<FaEdit />
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={async () => {
|
||||
if (confirm(`Möchtest du ${customer.name || customer.code} wirklich löschen?`)) {
|
||||
await deleteCustomer(customer.$id)
|
||||
}
|
||||
}}
|
||||
style={{ marginLeft: '4px' }}
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</td>
|
||||
</>
|
||||
)}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div className="card" style={{ background: '#f5f5f5', padding: '16px' }}>
|
||||
<h4 style={{ marginTop: 0 }}>Neuen Kunden hinzufügen</h4>
|
||||
<div className="row">
|
||||
<div className="col col-3">
|
||||
<div className="form-group">
|
||||
<label className="form-label">Code</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.code}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, code: e.target.value }))}
|
||||
placeholder="C001"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col col-3">
|
||||
<div className="form-group">
|
||||
<label className="form-label">Name</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.name}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, name: e.target.value }))}
|
||||
placeholder="Kundenname"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col col-3">
|
||||
<div className="form-group">
|
||||
<label className="form-label">Location</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.location}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, location: e.target.value }))}
|
||||
placeholder="Stadt"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col col-3">
|
||||
<div className="form-group">
|
||||
<label className="form-label">Email</label>
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
value={customerForm.email}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, email: e.target.value }))}
|
||||
placeholder="email@example.com"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col col-3">
|
||||
<div className="form-group">
|
||||
<label className="form-label">Phone</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={customerForm.phone}
|
||||
onChange={(e) => setCustomerForm(prev => ({ ...prev, phone: e.target.value }))}
|
||||
placeholder="030-123456"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col col-9">
|
||||
<div className="form-group" style={{ marginTop: '24px' }}>
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={async () => {
|
||||
if (!customerForm.name) {
|
||||
alert('Bitte gib mindestens einen Namen ein.')
|
||||
return
|
||||
}
|
||||
const result = await createCustomer(customerForm)
|
||||
if (result.success) {
|
||||
setCustomerForm({ code: '', name: '', location: '', email: '', phone: '' })
|
||||
} else {
|
||||
alert('Fehler beim Erstellen: ' + (result.error || 'Unbekannter Fehler'))
|
||||
}
|
||||
}}
|
||||
>
|
||||
<FaPlus /> Kunden hinzufügen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Employees */}
|
||||
<div className="card mb-2">
|
||||
<div className="card-header">
|
||||
<h3>Mitarbeiter & Kürzel</h3>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{employeesLoading ? (
|
||||
<div className="text-center p-2">
|
||||
<FaSpinner className="spinner" /> Lade Mitarbeiter...
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
{employees.length === 0 ? (
|
||||
<div style={{ padding: '20px', textAlign: 'center', background: '#f5f5f5', borderRadius: '4px' }}>
|
||||
<p style={{ margin: '0 0 8px 0', fontSize: '16px', fontWeight: 'bold' }}>
|
||||
Noch keine Mitarbeiter in der Liste
|
||||
</p>
|
||||
<p style={{ margin: 0, fontSize: '14px', color: '#666' }}>
|
||||
Sobald sich Benutzer einloggen, werden sie automatisch hier angezeigt.
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<table className="table" style={{ marginBottom: '16px' }}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Email</th>
|
||||
<th>Kürzel</th>
|
||||
<th>User ID</th>
|
||||
<th>Aktionen</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{employees.map((employee) => (
|
||||
<tr key={employee.$id}>
|
||||
{editingEmployee === employee.$id ? (
|
||||
<>
|
||||
<td>{employee.displayName || '-'}</td>
|
||||
<td>{employee.email || '-'}</td>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={employeeForm.shortcode}
|
||||
onChange={(e) => setEmployeeForm(prev => ({ ...prev, shortcode: e.target.value.toUpperCase() }))}
|
||||
placeholder="KNSO"
|
||||
style={{ width: '100px' }}
|
||||
maxLength={10}
|
||||
autoFocus
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
<small style={{ color: '#666' }}>{employee.userId.substring(0, 12)}...</small>
|
||||
</td>
|
||||
<td>
|
||||
<button
|
||||
className="btn btn-green"
|
||||
onClick={async () => {
|
||||
const result = await updateEmployee(employee.$id, {
|
||||
shortcode: employeeForm.shortcode
|
||||
})
|
||||
if (result.success) {
|
||||
setEditingEmployee(null)
|
||||
setEmployeeForm({ userId: '', displayName: '', email: '', shortcode: '' })
|
||||
} else {
|
||||
alert('Fehler: ' + (result.error || 'Unbekannter Fehler'))
|
||||
}
|
||||
}}
|
||||
>
|
||||
Speichern
|
||||
</button>
|
||||
<button
|
||||
className="btn"
|
||||
onClick={() => {
|
||||
setEditingEmployee(null)
|
||||
setEmployeeForm({ userId: '', displayName: '', email: '', shortcode: '' })
|
||||
}}
|
||||
style={{ marginLeft: '4px' }}
|
||||
>
|
||||
Abbrechen
|
||||
</button>
|
||||
</td>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<td>{employee.displayName || '-'}</td>
|
||||
<td>{employee.email || '-'}</td>
|
||||
<td>
|
||||
<strong style={{ color: employee.shortcode ? '#007bff' : '#999' }}>
|
||||
{employee.shortcode || '(kein Kürzel)'}
|
||||
</strong>
|
||||
</td>
|
||||
<td>
|
||||
<small style={{ color: '#666' }}>{employee.userId.substring(0, 12)}...</small>
|
||||
</td>
|
||||
<td>
|
||||
<button
|
||||
className="btn btn-blue"
|
||||
onClick={() => {
|
||||
setEditingEmployee(employee.$id)
|
||||
setEmployeeForm({
|
||||
userId: employee.userId,
|
||||
displayName: employee.displayName || '',
|
||||
email: employee.email || '',
|
||||
shortcode: employee.shortcode || ''
|
||||
})
|
||||
}}
|
||||
title="Kürzel bearbeiten"
|
||||
>
|
||||
<FaEdit /> Kürzel
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-red"
|
||||
onClick={async () => {
|
||||
if (confirm(`Möchtest du ${employee.displayName} wirklich aus der Mitarbeiter-Liste entfernen?`)) {
|
||||
await deleteEmployee(employee.$id)
|
||||
}
|
||||
}}
|
||||
style={{ marginLeft: '4px' }}
|
||||
title="Aus Mitarbeiter-Liste entfernen"
|
||||
>
|
||||
<FaTrash />
|
||||
</button>
|
||||
</td>
|
||||
</>
|
||||
)}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="text-center mt-2">
|
||||
<button
|
||||
className="btn btn-dark"
|
||||
onClick={handleSave}
|
||||
disabled={saving}
|
||||
style={{ minWidth: '200px' }}
|
||||
>
|
||||
{saving ? (
|
||||
<>
|
||||
<FaSpinner className="spinner" /> Speichere...
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<FaFloppyDisk /> Konfiguration speichern
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user