feat: Update BillingManager to replace 'nodeName' with 'purpose', add purpose formatting function, and enhance UI elements with consistent icon sizes
Publish Fast Tabler Docker image / build-and-push-fast (push) Successful in 6m56s
Publish Fast Tabler Docker image / build-and-push-fast (push) Successful in 6m56s
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
{
|
||||
"id": "1",
|
||||
"hostName": "VDSINA",
|
||||
"nodeName": "VDSINA",
|
||||
"purpose": "relay",
|
||||
"country": "RU",
|
||||
"provider": "VDSINA",
|
||||
"loginUrl": "cp.vdsina.com",
|
||||
@@ -16,7 +16,7 @@
|
||||
{
|
||||
"id": "2",
|
||||
"hostName": "Macloud",
|
||||
"nodeName": "Macloud",
|
||||
"purpose": "bgp",
|
||||
"country": "RU",
|
||||
"provider": "Macloud",
|
||||
"loginUrl": "cp.macloud.ru",
|
||||
@@ -30,7 +30,7 @@
|
||||
{
|
||||
"id": "3",
|
||||
"hostName": "Hosting VDS",
|
||||
"nodeName": "Steal",
|
||||
"purpose": "monitoring",
|
||||
"country": "RU",
|
||||
"provider": "Hosting VDS",
|
||||
"loginUrl": "my.hosting-vds.com/",
|
||||
@@ -44,7 +44,7 @@
|
||||
{
|
||||
"id": "4",
|
||||
"hostName": "Waicore",
|
||||
"nodeName": "Waicore",
|
||||
"purpose": "dns",
|
||||
"country": "DE",
|
||||
"provider": "Waicore",
|
||||
"loginUrl": "my.waicore.com/billmgr",
|
||||
@@ -58,7 +58,7 @@
|
||||
{
|
||||
"id": "5",
|
||||
"hostName": "IHOR",
|
||||
"nodeName": "Ihore",
|
||||
"purpose": "proxy",
|
||||
"country": "RU",
|
||||
"provider": "IHOR",
|
||||
"loginUrl": "billing.ihor-hosting.ru/billmgr",
|
||||
|
||||
@@ -40,7 +40,7 @@ function BillingManager() {
|
||||
// Новый элемент для добавления
|
||||
const [newItem, setNewItem] = useState({
|
||||
hostName: '',
|
||||
nodeName: '',
|
||||
purpose: '',
|
||||
country: '',
|
||||
provider: '',
|
||||
loginUrl: '',
|
||||
@@ -70,7 +70,7 @@ function BillingManager() {
|
||||
{
|
||||
"id": "1",
|
||||
"hostName": "VDSINA",
|
||||
"nodeName": "VDSINA",
|
||||
"purpose": "relay",
|
||||
"country": "RU",
|
||||
"provider": "VDSINA",
|
||||
"loginUrl": "cp.vdsina.com",
|
||||
@@ -84,7 +84,7 @@ function BillingManager() {
|
||||
{
|
||||
"id": "2",
|
||||
"hostName": "Macloud",
|
||||
"nodeName": "Macloud",
|
||||
"purpose": "bgp",
|
||||
"country": "RU",
|
||||
"provider": "Macloud",
|
||||
"loginUrl": "cp.macloud.ru",
|
||||
@@ -98,7 +98,7 @@ function BillingManager() {
|
||||
{
|
||||
"id": "3",
|
||||
"hostName": "Hosting VDS",
|
||||
"nodeName": "Steal",
|
||||
"purpose": "monitoring",
|
||||
"country": "RU",
|
||||
"provider": "Hosting VDS",
|
||||
"loginUrl": "my.hosting-vds.com/",
|
||||
@@ -112,7 +112,7 @@ function BillingManager() {
|
||||
{
|
||||
"id": "4",
|
||||
"hostName": "Waicore",
|
||||
"nodeName": "Waicore",
|
||||
"purpose": "dns",
|
||||
"country": "DE",
|
||||
"provider": "Waicore",
|
||||
"loginUrl": "my.waicore.com/billmgr",
|
||||
@@ -126,7 +126,7 @@ function BillingManager() {
|
||||
{
|
||||
"id": "5",
|
||||
"hostName": "IHOR",
|
||||
"nodeName": "Ihore",
|
||||
"purpose": "proxy",
|
||||
"country": "RU",
|
||||
"provider": "IHOR",
|
||||
"loginUrl": "billing.ihor-hosting.ru/billmgr",
|
||||
@@ -281,6 +281,19 @@ function BillingManager() {
|
||||
}).format(amount);
|
||||
}
|
||||
|
||||
function formatPurpose(purpose) {
|
||||
const purposeMap = {
|
||||
'relay': 'Relay VPS',
|
||||
'bgp': 'BGP сервер',
|
||||
'monitoring': 'Мониторинг',
|
||||
'dns': 'DNS сервер',
|
||||
'proxy': 'Прокси сервер',
|
||||
'backup': 'Backup сервер',
|
||||
'other': 'Другое'
|
||||
};
|
||||
return purposeMap[purpose] || purpose || 'Не указано';
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
{/* Заголовок страницы */}
|
||||
@@ -297,14 +310,14 @@ function BillingManager() {
|
||||
onClick={fetchBillingData}
|
||||
disabled={loading}
|
||||
>
|
||||
<IconRefresh className="icon" />
|
||||
<IconRefresh size={16} />
|
||||
Обновить
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-primary"
|
||||
onClick={handleAddItem}
|
||||
>
|
||||
<IconPlus className="icon" />
|
||||
<IconPlus size={16} />
|
||||
Добавить
|
||||
</button>
|
||||
</div>
|
||||
@@ -414,7 +427,7 @@ function BillingManager() {
|
||||
onClick={handleSaveChanges}
|
||||
disabled={loading}
|
||||
>
|
||||
<IconDatabase className="icon" />
|
||||
<IconDatabase size={16} />
|
||||
Сохранить
|
||||
</button>
|
||||
</div>
|
||||
@@ -425,7 +438,7 @@ function BillingManager() {
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Имя хостера</th>
|
||||
<th>Нода</th>
|
||||
<th>Назначение</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@@ -441,10 +454,10 @@ function BillingManager() {
|
||||
</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="avatar avatar-sm me-2">
|
||||
{countryToFlag(item.country)}
|
||||
<span className="badge bg-blue-lt text-blue me-2">
|
||||
{formatPurpose(item.purpose)}
|
||||
</span>
|
||||
{item.nodeName}
|
||||
{formatPurpose(item.purpose)}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -480,7 +493,7 @@ function BillingManager() {
|
||||
{providers.map(provider => {
|
||||
const providerItems = billingData.filter(item => item.provider === provider);
|
||||
const totalCost = providerItems.reduce((sum, item) => sum + item.monthlyCost, 0);
|
||||
const servers = providerItems.map(item => item.nodeName).join(', ');
|
||||
const servers = providerItems.map(item => formatPurpose(item.purpose)).join(', ');
|
||||
|
||||
return (
|
||||
<tr key={provider}>
|
||||
@@ -533,7 +546,7 @@ function BillingManager() {
|
||||
className="btn btn-outline-primary btn-sm"
|
||||
onClick={handleAddItem}
|
||||
>
|
||||
<IconPlus className="icon" />
|
||||
<IconPlus size={16} />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -560,18 +573,18 @@ function BillingManager() {
|
||||
<td>
|
||||
<div className="btn-list">
|
||||
<button
|
||||
className="btn btn-icon btn-sm"
|
||||
className="btn btn-icon btn-sm btn-outline-primary"
|
||||
onClick={() => handleEditItem(item)}
|
||||
title="Редактировать"
|
||||
>
|
||||
<IconEdit className="icon" />
|
||||
<IconEdit size={16} />
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-icon btn-sm"
|
||||
className="btn btn-icon btn-sm btn-outline-danger"
|
||||
onClick={() => handleDeleteItem(item)}
|
||||
title="Удалить"
|
||||
>
|
||||
<IconTrash className="icon" />
|
||||
<IconTrash size={16} />
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
@@ -609,18 +622,18 @@ function BillingManager() {
|
||||
<td>
|
||||
<div className="btn-list">
|
||||
<button
|
||||
className="btn btn-icon btn-sm"
|
||||
className="btn btn-icon btn-sm btn-outline-primary"
|
||||
onClick={() => handleEditItem(item)}
|
||||
title="Редактировать"
|
||||
>
|
||||
<IconEdit className="icon" />
|
||||
<IconEdit size={16} />
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-icon btn-sm"
|
||||
className="btn btn-icon btn-sm btn-outline-danger"
|
||||
onClick={() => handleDeleteItem(item)}
|
||||
title="Удалить"
|
||||
>
|
||||
<IconTrash className="icon" />
|
||||
<IconTrash size={16} />
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
@@ -698,14 +711,22 @@ function AddBillingModal({ show, item, onItemChange, onSubmit, onClose }) {
|
||||
/>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<label className="form-label">Нода</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={item.nodeName}
|
||||
onChange={(e) => handleChange('nodeName', e.target.value)}
|
||||
<label className="form-label">Назначение</label>
|
||||
<select
|
||||
className="form-select"
|
||||
value={item.purpose || ''}
|
||||
onChange={(e) => handleChange('purpose', e.target.value)}
|
||||
required
|
||||
/>
|
||||
>
|
||||
<option value="">Выберите назначение</option>
|
||||
<option value="relay">Relay VPS</option>
|
||||
<option value="bgp">BGP сервер</option>
|
||||
<option value="monitoring">Мониторинг</option>
|
||||
<option value="dns">DNS сервер</option>
|
||||
<option value="proxy">Прокси сервер</option>
|
||||
<option value="backup">Backup сервер</option>
|
||||
<option value="other">Другое</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<label className="form-label">Страна</label>
|
||||
@@ -812,6 +833,7 @@ function AddBillingModal({ show, item, onItemChange, onSubmit, onClose }) {
|
||||
Отмена
|
||||
</button>
|
||||
<button type="submit" className="btn btn-primary">
|
||||
<IconPlus size={16} className="me-1" />
|
||||
Добавить
|
||||
</button>
|
||||
</div>
|
||||
@@ -857,14 +879,22 @@ function EditBillingModal({ show, item, onItemChange, onSubmit, onClose }) {
|
||||
/>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<label className="form-label">Нода</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
value={item.nodeName || ''}
|
||||
onChange={(e) => handleChange('nodeName', e.target.value)}
|
||||
<label className="form-label">Назначение</label>
|
||||
<select
|
||||
className="form-select"
|
||||
value={item.purpose || ''}
|
||||
onChange={(e) => handleChange('purpose', e.target.value)}
|
||||
required
|
||||
/>
|
||||
>
|
||||
<option value="">Выберите назначение</option>
|
||||
<option value="relay">Relay VPS</option>
|
||||
<option value="bgp">BGP сервер</option>
|
||||
<option value="monitoring">Мониторинг</option>
|
||||
<option value="dns">DNS сервер</option>
|
||||
<option value="proxy">Прокси сервер</option>
|
||||
<option value="backup">Backup сервер</option>
|
||||
<option value="other">Другое</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<label className="form-label">Страна</label>
|
||||
@@ -971,6 +1001,7 @@ function EditBillingModal({ show, item, onItemChange, onSubmit, onClose }) {
|
||||
Отмена
|
||||
</button>
|
||||
<button type="submit" className="btn btn-primary">
|
||||
<IconCheck size={16} className="me-1" />
|
||||
Сохранить
|
||||
</button>
|
||||
</div>
|
||||
@@ -1002,6 +1033,7 @@ function DeleteBillingModal({ show, item, onDelete, onClose }) {
|
||||
Отмена
|
||||
</button>
|
||||
<button type="button" className="btn btn-danger" onClick={onDelete}>
|
||||
<IconTrash size={16} className="me-1" />
|
||||
Удалить
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user