ваше сообщение коммита
This commit is contained in:
@@ -238,39 +238,8 @@ const proposalsChange = ref(8);
|
||||
const yieldRate = ref(8.7);
|
||||
const yieldChange = ref(1.2);
|
||||
|
||||
// Топ участников (временные данные)
|
||||
const topParticipants = ref([
|
||||
{
|
||||
rank: 1,
|
||||
address: '0x1234567890123456789012345678901234567890',
|
||||
balance: 2500,
|
||||
percentage: 25.0
|
||||
},
|
||||
{
|
||||
rank: 2,
|
||||
address: '0x2345678901234567890123456789012345678901',
|
||||
balance: 1800,
|
||||
percentage: 18.0
|
||||
},
|
||||
{
|
||||
rank: 3,
|
||||
address: '0x3456789012345678901234567890123456789012',
|
||||
balance: 1200,
|
||||
percentage: 12.0
|
||||
},
|
||||
{
|
||||
rank: 4,
|
||||
address: '0x4567890123456789012345678901234567890123',
|
||||
balance: 800,
|
||||
percentage: 8.0
|
||||
},
|
||||
{
|
||||
rank: 5,
|
||||
address: '0x5678901234567890123456789012345678901234',
|
||||
balance: 600,
|
||||
percentage: 6.0
|
||||
}
|
||||
]);
|
||||
// Топ участников (загружаются из блокчейна)
|
||||
const topParticipants = ref([]);
|
||||
|
||||
// Методы
|
||||
const formatAddress = (address) => {
|
||||
|
||||
@@ -1,726 +0,0 @@
|
||||
<!--
|
||||
Copyright (c) 2024-2025 Тарабанов Александр Викторович
|
||||
All rights reserved.
|
||||
|
||||
This software is proprietary and confidential.
|
||||
Unauthorized copying, modification, or distribution is prohibited.
|
||||
|
||||
For licensing inquiries: info@hb3-accelerator.com
|
||||
Website: https://hb3-accelerator.com
|
||||
GitHub: https://github.com/HB3-ACCELERATOR
|
||||
-->
|
||||
|
||||
<template>
|
||||
<BaseLayout
|
||||
:is-authenticated="isAuthenticated"
|
||||
:identities="identities"
|
||||
:token-balances="tokenBalances"
|
||||
:is-loading-tokens="isLoadingTokens"
|
||||
@auth-action-completed="$emit('auth-action-completed')"
|
||||
>
|
||||
<div class="dle-multisig-management">
|
||||
<div class="multisig-header">
|
||||
<h3>🔐 Управление мультиподписью</h3>
|
||||
<button class="btn btn-primary" @click="showCreateForm = true">
|
||||
<i class="fas fa-plus"></i> Создать операцию
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Форма создания мультиподписи -->
|
||||
<div v-if="showCreateForm" class="create-multisig-form">
|
||||
<div class="form-header">
|
||||
<h4>🔐 Новая мультиподпись</h4>
|
||||
<button class="close-btn" @click="showCreateForm = false">×</button>
|
||||
</div>
|
||||
|
||||
<div class="form-content">
|
||||
<!-- Описание операции -->
|
||||
<div class="form-section">
|
||||
<h5>📝 Описание операции</h5>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="operationDescription">Описание операции:</label>
|
||||
<textarea
|
||||
id="operationDescription"
|
||||
v-model="newOperation.description"
|
||||
class="form-control"
|
||||
rows="3"
|
||||
placeholder="Опишите, что нужно сделать..."
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="operationDuration">Длительность сбора подписей (дни):</label>
|
||||
<input
|
||||
type="number"
|
||||
id="operationDuration"
|
||||
v-model.number="newOperation.duration"
|
||||
class="form-control"
|
||||
min="1"
|
||||
max="30"
|
||||
placeholder="7"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Тип операции -->
|
||||
<div class="form-section">
|
||||
<h5>⚙️ Тип операции</h5>
|
||||
|
||||
<div class="operation-types">
|
||||
<div class="form-group">
|
||||
<label for="multisigOperationType">Выберите тип операции:</label>
|
||||
<select id="multisigOperationType" v-model="newOperation.operationType" class="form-control">
|
||||
<option value="">-- Выберите тип --</option>
|
||||
<option value="transfer">Передача токенов</option>
|
||||
<option value="mint">Минтинг токенов</option>
|
||||
<option value="burn">Сжигание токенов</option>
|
||||
<option value="addModule">Добавить модуль</option>
|
||||
<option value="removeModule">Удалить модуль</option>
|
||||
<option value="custom">Пользовательская операция</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Параметры для передачи токенов -->
|
||||
<div v-if="newOperation.operationType === 'transfer'" class="operation-params">
|
||||
<div class="form-group">
|
||||
<label for="multisigTransferTo">Адрес получателя:</label>
|
||||
<input
|
||||
type="text"
|
||||
id="multisigTransferTo"
|
||||
v-model="newOperation.operationParams.to"
|
||||
class="form-control"
|
||||
placeholder="0x..."
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="multisigTransferAmount">Количество токенов:</label>
|
||||
<input
|
||||
type="number"
|
||||
id="multisigTransferAmount"
|
||||
v-model.number="newOperation.operationParams.amount"
|
||||
class="form-control"
|
||||
min="1"
|
||||
placeholder="100"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Параметры для модулей -->
|
||||
<div v-if="newOperation.operationType === 'addModule' || newOperation.operationType === 'removeModule'" class="operation-params">
|
||||
<div class="form-group">
|
||||
<label for="moduleId">ID модуля:</label>
|
||||
<input
|
||||
type="text"
|
||||
id="moduleId"
|
||||
v-model="newOperation.operationParams.moduleId"
|
||||
class="form-control"
|
||||
placeholder="TreasuryModule"
|
||||
>
|
||||
</div>
|
||||
<div v-if="newOperation.operationType === 'addModule'" class="form-group">
|
||||
<label for="moduleAddress">Адрес модуля:</label>
|
||||
<input
|
||||
type="text"
|
||||
id="moduleAddress"
|
||||
v-model="newOperation.operationParams.moduleAddress"
|
||||
class="form-control"
|
||||
placeholder="0x..."
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Пользовательская операция -->
|
||||
<div v-if="newOperation.operationType === 'custom'" class="operation-params">
|
||||
<div class="form-group">
|
||||
<label for="customMultisigOperation">Пользовательская операция (hex):</label>
|
||||
<textarea
|
||||
id="customMultisigOperation"
|
||||
v-model="newOperation.operationParams.customData"
|
||||
class="form-control"
|
||||
rows="3"
|
||||
placeholder="0x..."
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Предварительный просмотр -->
|
||||
<div class="form-section">
|
||||
<h5>👁️ Предварительный просмотр</h5>
|
||||
<div class="preview-card">
|
||||
<div class="preview-item">
|
||||
<strong>Описание:</strong> {{ newOperation.description || 'Не указано' }}
|
||||
</div>
|
||||
<div class="preview-item">
|
||||
<strong>Длительность:</strong> {{ newOperation.duration || 7 }} дней
|
||||
</div>
|
||||
<div class="preview-item">
|
||||
<strong>Тип операции:</strong> {{ getOperationTypeName(newOperation.operationType) || 'Не выбран' }}
|
||||
</div>
|
||||
<div v-if="newOperation.operationType" class="preview-item">
|
||||
<strong>Параметры:</strong> {{ getOperationParamsPreview() }}
|
||||
</div>
|
||||
<div class="preview-item">
|
||||
<strong>Хеш операции:</strong> {{ getOperationHash() }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Действия -->
|
||||
<div class="form-actions">
|
||||
<button
|
||||
class="btn btn-success"
|
||||
@click="createMultisigOperation"
|
||||
:disabled="!isFormValid || isCreating"
|
||||
>
|
||||
<i class="fas fa-paper-plane"></i>
|
||||
{{ isCreating ? 'Создание...' : 'Создать операцию' }}
|
||||
</button>
|
||||
<button class="btn btn-secondary" @click="resetForm">
|
||||
<i class="fas fa-undo"></i> Сбросить
|
||||
</button>
|
||||
<button class="btn btn-danger" @click="showCreateForm = false">
|
||||
<i class="fas fa-times"></i> Отмена
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Список операций мультиподписи -->
|
||||
<div class="multisig-list">
|
||||
<div class="list-header">
|
||||
<h4>📋 Список операций мультиподписи</h4>
|
||||
<div class="list-filters">
|
||||
<select v-model="statusFilter" class="form-control">
|
||||
<option value="">Все статусы</option>
|
||||
<option value="active">Активные</option>
|
||||
<option value="pending">Ожидающие</option>
|
||||
<option value="succeeded">Принятые</option>
|
||||
<option value="defeated">Отклоненные</option>
|
||||
<option value="executed">Выполненные</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="filteredOperations.length === 0" class="no-operations">
|
||||
<p>Операций мультиподписи пока нет</p>
|
||||
</div>
|
||||
|
||||
<div v-else class="operations-grid">
|
||||
<div
|
||||
v-for="operation in filteredOperations"
|
||||
:key="operation.id"
|
||||
class="operation-card"
|
||||
:class="operation.status"
|
||||
>
|
||||
<div class="operation-header">
|
||||
<h5>{{ operation.description }}</h5>
|
||||
<span class="operation-status" :class="operation.status">
|
||||
{{ getOperationStatusText(operation.status) }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="operation-details">
|
||||
<div class="detail-item">
|
||||
<strong>ID:</strong> #{{ operation.id }}
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<strong>Создатель:</strong> {{ shortenAddress(operation.initiator) }}
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<strong>Хеш:</strong> {{ shortenAddress(operation.operationHash) }}
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<strong>Дедлайн:</strong> {{ formatDate(operation.deadline) }}
|
||||
</div>
|
||||
<div class="detail-item">
|
||||
<strong>Подписи:</strong>
|
||||
<span class="signatures">
|
||||
<span class="for">За: {{ operation.forSignatures }}</span>
|
||||
<span class="against">Против: {{ operation.againstSignatures }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="operation-actions">
|
||||
<button
|
||||
v-if="canSign(operation)"
|
||||
class="btn btn-sm btn-success"
|
||||
@click="signOperation(operation.id, true)"
|
||||
:disabled="hasSigned(operation.id, true)"
|
||||
>
|
||||
<i class="fas fa-thumbs-up"></i> Подписать за
|
||||
</button>
|
||||
<button
|
||||
v-if="canSign(operation)"
|
||||
class="btn btn-sm btn-danger"
|
||||
@click="signOperation(operation.id, false)"
|
||||
:disabled="hasSigned(operation.id, false)"
|
||||
>
|
||||
<i class="fas fa-thumbs-down"></i> Подписать против
|
||||
</button>
|
||||
<button
|
||||
v-if="canExecute(operation)"
|
||||
class="btn btn-sm btn-primary"
|
||||
@click="executeOperation(operation.id)"
|
||||
>
|
||||
<i class="fas fa-play"></i> Исполнить
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-sm btn-info"
|
||||
@click="viewOperationDetails(operation.id)"
|
||||
>
|
||||
<i class="fas fa-eye"></i> Детали
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted, defineProps, defineEmits } from 'vue';
|
||||
import { useAuthContext } from '@/composables/useAuth';
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
|
||||
const props = defineProps({
|
||||
dleAddress: { type: String, required: false, default: null },
|
||||
dleContract: { type: Object, required: false, default: null },
|
||||
isAuthenticated: Boolean,
|
||||
identities: Array,
|
||||
tokenBalances: Object,
|
||||
isLoadingTokens: Boolean
|
||||
});
|
||||
|
||||
const emit = defineEmits(['auth-action-completed']);
|
||||
|
||||
const { address } = useAuthContext();
|
||||
|
||||
// Состояние формы
|
||||
const showCreateForm = ref(false);
|
||||
const isCreating = ref(false);
|
||||
const statusFilter = ref('');
|
||||
|
||||
// Новая операция
|
||||
const newOperation = ref({
|
||||
description: '',
|
||||
duration: 7,
|
||||
operationType: '',
|
||||
operationParams: {
|
||||
to: '',
|
||||
from: '',
|
||||
amount: 0,
|
||||
moduleId: '',
|
||||
moduleAddress: '',
|
||||
customData: ''
|
||||
}
|
||||
});
|
||||
|
||||
// Операции мультиподписи
|
||||
const operations = ref([]);
|
||||
|
||||
// Вычисляемые свойства
|
||||
const isFormValid = computed(() => {
|
||||
return (
|
||||
newOperation.value.description &&
|
||||
newOperation.value.duration > 0 &&
|
||||
newOperation.value.operationType &&
|
||||
validateOperationParams()
|
||||
);
|
||||
});
|
||||
|
||||
const filteredOperations = computed(() => {
|
||||
if (!statusFilter.value) return operations.value;
|
||||
return operations.value.filter(o => o.status === statusFilter.value);
|
||||
});
|
||||
|
||||
// Функции
|
||||
function validateOperationParams() {
|
||||
const params = newOperation.value.operationParams;
|
||||
|
||||
switch (newOperation.value.operationType) {
|
||||
case 'transfer':
|
||||
case 'mint':
|
||||
return params.to && params.amount > 0;
|
||||
case 'burn':
|
||||
return params.from && params.amount > 0;
|
||||
case 'addModule':
|
||||
return params.moduleId && params.moduleAddress;
|
||||
case 'removeModule':
|
||||
return params.moduleId;
|
||||
case 'custom':
|
||||
return params.customData && params.customData.startsWith('0x');
|
||||
default:
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function getOperationTypeName(type) {
|
||||
const types = {
|
||||
'transfer': 'Передача токенов',
|
||||
'mint': 'Минтинг токенов',
|
||||
'burn': 'Сжигание токенов',
|
||||
'addModule': 'Добавить модуль',
|
||||
'removeModule': 'Удалить модуль',
|
||||
'custom': 'Пользовательская операция'
|
||||
};
|
||||
return types[type] || 'Неизвестный тип';
|
||||
}
|
||||
|
||||
function getOperationParamsPreview() {
|
||||
const params = newOperation.value.operationParams;
|
||||
|
||||
switch (newOperation.value.operationType) {
|
||||
case 'transfer':
|
||||
return `Кому: ${shortenAddress(params.to)}, Количество: ${params.amount}`;
|
||||
case 'mint':
|
||||
return `Кому: ${shortenAddress(params.to)}, Количество: ${params.amount}`;
|
||||
case 'burn':
|
||||
return `От: ${shortenAddress(params.from)}, Количество: ${params.amount}`;
|
||||
case 'addModule':
|
||||
return `ID: ${params.moduleId}, Адрес: ${shortenAddress(params.moduleAddress)}`;
|
||||
case 'removeModule':
|
||||
return `ID: ${params.moduleId}`;
|
||||
case 'custom':
|
||||
return `Данные: ${params.customData.substring(0, 20)}...`;
|
||||
default:
|
||||
return 'Не указаны';
|
||||
}
|
||||
}
|
||||
|
||||
function getOperationHash() {
|
||||
// Генерируем хеш операции на основе параметров
|
||||
const params = newOperation.value.operationParams;
|
||||
const operationData = JSON.stringify({
|
||||
type: newOperation.value.operationType,
|
||||
params: params
|
||||
});
|
||||
|
||||
// Простой хеш для демонстрации
|
||||
return '0x' + btoa(operationData).substring(0, 64);
|
||||
}
|
||||
|
||||
function shortenAddress(address) {
|
||||
if (!address) return '';
|
||||
return `${address.slice(0, 6)}...${address.slice(-4)}`;
|
||||
}
|
||||
|
||||
function formatDate(timestamp) {
|
||||
if (!timestamp) return 'N/A';
|
||||
return new Date(timestamp * 1000).toLocaleString();
|
||||
}
|
||||
|
||||
function getOperationStatusText(status) {
|
||||
const statusMap = {
|
||||
'pending': 'Ожидает',
|
||||
'active': 'Активно',
|
||||
'succeeded': 'Принято',
|
||||
'defeated': 'Отклонено',
|
||||
'executed': 'Выполнено'
|
||||
};
|
||||
return statusMap[status] || status;
|
||||
}
|
||||
|
||||
function canSign(operation) {
|
||||
return operation.status === 'active' && !hasSigned(operation.id);
|
||||
}
|
||||
|
||||
function canExecute(operation) {
|
||||
return operation.status === 'succeeded' && !operation.executed;
|
||||
}
|
||||
|
||||
function hasSigned(operationId, support = null) {
|
||||
// Здесь должна быть проверка подписи пользователя
|
||||
return false;
|
||||
}
|
||||
|
||||
// Создание операции мультиподписи
|
||||
async function createMultisigOperation() {
|
||||
if (!isFormValid.value) {
|
||||
alert('Пожалуйста, заполните все обязательные поля');
|
||||
return;
|
||||
}
|
||||
|
||||
isCreating.value = true;
|
||||
|
||||
try {
|
||||
// Генерируем хеш операции
|
||||
const operationHash = getOperationHash();
|
||||
|
||||
// Вызов смарт-контракта
|
||||
const tx = await props.dleContract.createMultiSigOperation(
|
||||
operationHash,
|
||||
newOperation.value.duration * 24 * 60 * 60 // конвертируем в секунды
|
||||
);
|
||||
|
||||
await tx.wait();
|
||||
|
||||
// Обновляем список операций
|
||||
await loadOperations();
|
||||
|
||||
// Сбрасываем форму
|
||||
resetForm();
|
||||
showCreateForm.value = false;
|
||||
|
||||
alert('✅ Операция мультиподписи успешно создана!');
|
||||
|
||||
} catch (error) {
|
||||
// console.error('Ошибка при создании операции мультиподписи:', error);
|
||||
alert('❌ Ошибка при создании операции: ' + error.message);
|
||||
} finally {
|
||||
isCreating.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
// Подписание операции
|
||||
async function signOperation(operationId, support) {
|
||||
try {
|
||||
const tx = await props.dleContract.signMultiSigOperation(operationId, support);
|
||||
await tx.wait();
|
||||
|
||||
await loadOperations();
|
||||
alert('✅ Ваша подпись учтена!');
|
||||
|
||||
} catch (error) {
|
||||
// console.error('Ошибка при подписании операции:', error);
|
||||
alert('❌ Ошибка при подписании: ' + error.message);
|
||||
}
|
||||
}
|
||||
|
||||
// Исполнение операции
|
||||
async function executeOperation(operationId) {
|
||||
try {
|
||||
const tx = await props.dleContract.executeMultiSigOperation(operationId);
|
||||
await tx.wait();
|
||||
|
||||
await loadOperations();
|
||||
alert('✅ Операция успешно исполнена!');
|
||||
|
||||
} catch (error) {
|
||||
// console.error('Ошибка при исполнении операции:', error);
|
||||
alert('❌ Ошибка при исполнении операции: ' + error.message);
|
||||
}
|
||||
}
|
||||
|
||||
// Загрузка операций
|
||||
async function loadOperations() {
|
||||
try {
|
||||
// Здесь должен быть вызов API или смарт-контракта для загрузки операций
|
||||
// Пока используем заглушку
|
||||
operations.value = [];
|
||||
} catch (error) {
|
||||
// console.error('Ошибка при загрузке операций:', error);
|
||||
}
|
||||
}
|
||||
|
||||
function resetForm() {
|
||||
newOperation.value = {
|
||||
description: '',
|
||||
duration: 7,
|
||||
operationType: '',
|
||||
operationParams: {
|
||||
to: '',
|
||||
from: '',
|
||||
amount: 0,
|
||||
moduleId: '',
|
||||
moduleAddress: '',
|
||||
customData: ''
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function viewOperationDetails(operationId) {
|
||||
// Открыть модальное окно с деталями операции
|
||||
// console.log('Просмотр деталей операции:', operationId);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadOperations();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dle-multisig-management {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.multisig-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.create-multisig-form {
|
||||
background: #f8f9fa;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.form-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 1.5rem;
|
||||
cursor: pointer;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
margin-bottom: 1.5rem;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.form-section:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.form-section h5 {
|
||||
color: #333;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.operation-types {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.operation-params {
|
||||
margin-top: 1rem;
|
||||
padding: 1rem;
|
||||
background: #f8f9fa;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.preview-card {
|
||||
background: #fff;
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 6px;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.preview-item {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
.multisig-list {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.list-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.operations-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.operation-card {
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 8px;
|
||||
padding: 1rem;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.operation-card.active {
|
||||
border-color: #28a745;
|
||||
}
|
||||
|
||||
.operation-card.succeeded {
|
||||
border-color: #007bff;
|
||||
}
|
||||
|
||||
.operation-card.defeated {
|
||||
border-color: #dc3545;
|
||||
}
|
||||
|
||||
.operation-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.operation-header h5 {
|
||||
margin: 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.operation-status {
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 4px;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.operation-status.active {
|
||||
background: #d4edda;
|
||||
color: #155724;
|
||||
}
|
||||
|
||||
.operation-status.succeeded {
|
||||
background: #d1ecf1;
|
||||
color: #0c5460;
|
||||
}
|
||||
|
||||
.operation-status.defeated {
|
||||
background: #f8d7da;
|
||||
color: #721c24;
|
||||
}
|
||||
|
||||
.operation-details {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.detail-item {
|
||||
margin-bottom: 0.5rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.signatures {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.signatures .for {
|
||||
color: #28a745;
|
||||
}
|
||||
|
||||
.signatures .against {
|
||||
color: #dc3545;
|
||||
}
|
||||
|
||||
.operation-actions {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.no-operations {
|
||||
text-align: center;
|
||||
padding: 2rem;
|
||||
color: #666;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -293,85 +293,8 @@ const filters = ref({
|
||||
status: ''
|
||||
});
|
||||
|
||||
// История операций (временные данные)
|
||||
const history = ref([
|
||||
{
|
||||
id: 1,
|
||||
type: 'proposal',
|
||||
title: 'Создание предложения',
|
||||
description: 'Создано предложение #15: Перевод 100 токенов партнеру',
|
||||
timestamp: Date.now() - 3600000,
|
||||
status: 'success',
|
||||
transactionHash: '0x1234567890abcdef1234567890abcdef1234567890abcdef1234567890abcdef',
|
||||
blockNumber: 18456789,
|
||||
data: {
|
||||
'ID предложения': 15,
|
||||
'Инициатор': '0x1234...5678',
|
||||
'Количество токенов': '100 MDLE',
|
||||
'Получатель': '0xabcd...efgh'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: 'vote',
|
||||
title: 'Голосование',
|
||||
description: 'Подписано предложение #15',
|
||||
timestamp: Date.now() - 7200000,
|
||||
status: 'success',
|
||||
transactionHash: '0xabcdef1234567890abcdef1234567890abcdef1234567890abcdef1234567890',
|
||||
blockNumber: 18456788,
|
||||
data: {
|
||||
'ID предложения': 15,
|
||||
'Голосующий': '0x5678...9012',
|
||||
'Вес голоса': '500 токенов'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: 'transfer',
|
||||
title: 'Трансфер токенов',
|
||||
description: 'Перевод 50 токенов между участниками',
|
||||
timestamp: Date.now() - 10800000,
|
||||
status: 'success',
|
||||
transactionHash: '0x567890abcdef1234567890abcdef1234567890abcdef1234567890abcdef1234',
|
||||
blockNumber: 18456787,
|
||||
data: {
|
||||
'От': '0x9012...3456',
|
||||
'Кому': '0x3456...7890',
|
||||
'Количество': '50 MDLE'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
type: 'treasury',
|
||||
title: 'Операция с казной',
|
||||
description: 'Пополнение казны на 1000 USDC',
|
||||
timestamp: Date.now() - 14400000,
|
||||
status: 'pending',
|
||||
transactionHash: '0x901234567890abcdef1234567890abcdef1234567890abcdef1234567890abcd',
|
||||
blockNumber: 18456786,
|
||||
data: {
|
||||
'Тип операции': 'Депозит',
|
||||
'Актив': 'USDC',
|
||||
'Количество': '1000'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
type: 'module',
|
||||
title: 'Установка модуля',
|
||||
description: 'Установлен модуль "Казначейство"',
|
||||
timestamp: Date.now() - 18000000,
|
||||
status: 'success',
|
||||
transactionHash: '0x345678901234567890abcdef1234567890abcdef1234567890abcdef123456789',
|
||||
blockNumber: 18456785,
|
||||
data: {
|
||||
'Название модуля': 'Казначейство',
|
||||
'Версия': '1.0.0',
|
||||
'Адрес контракта': '0xabcd...efgh'
|
||||
}
|
||||
}
|
||||
]);
|
||||
// История операций (загружается из блокчейна)
|
||||
const history = ref([]);
|
||||
|
||||
// Вычисляемые свойства
|
||||
const filteredHistory = computed(() => {
|
||||
|
||||
@@ -1,766 +0,0 @@
|
||||
<!--
|
||||
Copyright (c) 2024-2025 Тарабанов Александр Викторович
|
||||
All rights reserved.
|
||||
|
||||
This software is proprietary and confidential.
|
||||
Unauthorized copying, modification, or distribution is prohibited.
|
||||
|
||||
For licensing inquiries: info@hb3-accelerator.com
|
||||
Website: https://hb3-accelerator.com
|
||||
GitHub: https://github.com/HB3-ACCELERATOR
|
||||
-->
|
||||
|
||||
<template>
|
||||
<BaseLayout
|
||||
:is-authenticated="isAuthenticated"
|
||||
:identities="identities"
|
||||
:token-balances="tokenBalances"
|
||||
:is-loading-tokens="isLoadingTokens"
|
||||
@auth-action-completed="$emit('auth-action-completed')"
|
||||
>
|
||||
<div class="modules-container">
|
||||
<!-- Заголовок -->
|
||||
<div class="page-header">
|
||||
<div class="header-content">
|
||||
<h1>Модули DLE</h1>
|
||||
<p>Установка, настройка и управление модулями</p>
|
||||
</div>
|
||||
<button class="close-btn" @click="router.push('/management')">×</button>
|
||||
</div>
|
||||
|
||||
<!-- Доступные модули -->
|
||||
<div class="available-modules-section">
|
||||
<h2>Доступные модули</h2>
|
||||
<div class="modules-grid">
|
||||
<div
|
||||
v-for="module in availableModules"
|
||||
:key="module.id"
|
||||
class="module-card"
|
||||
:class="{ 'module-installed': module.installed }"
|
||||
>
|
||||
<div class="module-header">
|
||||
<h3>{{ module.name }}</h3>
|
||||
<span class="module-version">v{{ module.version }}</span>
|
||||
</div>
|
||||
<p class="module-description">{{ module.description }}</p>
|
||||
<div class="module-features">
|
||||
<span
|
||||
v-for="feature in module.features"
|
||||
:key="feature"
|
||||
class="feature-tag"
|
||||
>
|
||||
{{ feature }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="module-actions">
|
||||
<button
|
||||
v-if="!module.installed"
|
||||
@click="installModule(module.id)"
|
||||
class="btn-primary"
|
||||
:disabled="isInstalling"
|
||||
>
|
||||
{{ isInstalling ? 'Установка...' : 'Установить' }}
|
||||
</button>
|
||||
<button
|
||||
v-else
|
||||
@click="openModuleInterface(module)"
|
||||
class="btn-secondary"
|
||||
>
|
||||
Управление
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Установленные модули -->
|
||||
<div class="installed-modules-section">
|
||||
<h2>Установленные модули</h2>
|
||||
<div v-if="installedModules.length === 0" class="empty-state">
|
||||
<p>Нет установленных модулей</p>
|
||||
</div>
|
||||
<div v-else class="installed-modules-list">
|
||||
<div
|
||||
v-for="module in installedModules"
|
||||
:key="module.address"
|
||||
class="installed-module-card"
|
||||
>
|
||||
<div class="module-info">
|
||||
<div class="module-header">
|
||||
<h3>{{ module.name }}</h3>
|
||||
<span class="module-status" :class="module.status">
|
||||
{{ getStatusText(module.status) }}
|
||||
</span>
|
||||
</div>
|
||||
<p class="module-description">{{ module.description }}</p>
|
||||
<p class="module-address">Адрес: {{ formatAddress(module.address) }}</p>
|
||||
<p class="module-version">Версия: {{ module.version }}</p>
|
||||
</div>
|
||||
<div class="module-actions">
|
||||
<button @click="openModuleInterface(module)" class="btn-secondary">
|
||||
Управление
|
||||
</button>
|
||||
<button @click="configureModule(module)" class="btn-secondary">
|
||||
Настройки
|
||||
</button>
|
||||
<button @click="uninstallModule(module.address)" class="btn-danger">
|
||||
Удалить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Модальное окно настройки модуля -->
|
||||
<div v-if="showConfigModal" class="modal-overlay" @click="showConfigModal = false">
|
||||
<div class="modal-content" @click.stop>
|
||||
<div class="modal-header">
|
||||
<h3>Настройки модуля {{ selectedModule?.name }}</h3>
|
||||
<button @click="showConfigModal = false" class="close-btn">✕</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form @submit.prevent="saveModuleConfig" class="config-form">
|
||||
<div
|
||||
v-for="setting in selectedModule?.configSettings"
|
||||
:key="setting.key"
|
||||
class="form-group"
|
||||
>
|
||||
<label :for="setting.key">{{ setting.label }}:</label>
|
||||
<input
|
||||
v-if="setting.type === 'text'"
|
||||
:id="setting.key"
|
||||
v-model="moduleConfig[setting.key]"
|
||||
type="text"
|
||||
:placeholder="setting.placeholder"
|
||||
required
|
||||
>
|
||||
<input
|
||||
v-else-if="setting.type === 'number'"
|
||||
:id="setting.key"
|
||||
v-model="moduleConfig[setting.key]"
|
||||
type="number"
|
||||
:min="setting.min"
|
||||
:max="setting.max"
|
||||
:placeholder="setting.placeholder"
|
||||
required
|
||||
>
|
||||
<select
|
||||
v-else-if="setting.type === 'select'"
|
||||
:id="setting.key"
|
||||
v-model="moduleConfig[setting.key]"
|
||||
required
|
||||
>
|
||||
<option value="">Выберите значение</option>
|
||||
<option
|
||||
v-for="option in setting.options"
|
||||
:key="option.value"
|
||||
:value="option.value"
|
||||
>
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</select>
|
||||
<span class="setting-hint">{{ setting.hint }}</span>
|
||||
</div>
|
||||
|
||||
<div class="form-actions">
|
||||
<button type="button" @click="showConfigModal = false" class="btn-secondary">
|
||||
Отмена
|
||||
</button>
|
||||
<button type="submit" class="btn-primary" :disabled="isSavingConfig">
|
||||
{{ isSavingConfig ? 'Сохранение...' : 'Сохранить' }}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, defineProps, defineEmits } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
|
||||
// Определяем props
|
||||
const props = defineProps({
|
||||
isAuthenticated: Boolean,
|
||||
identities: Array,
|
||||
tokenBalances: Object,
|
||||
isLoadingTokens: Boolean
|
||||
});
|
||||
|
||||
// Определяем emits
|
||||
const emit = defineEmits(['auth-action-completed']);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
// Состояние
|
||||
const isInstalling = ref(false);
|
||||
const isSavingConfig = ref(false);
|
||||
const showConfigModal = ref(false);
|
||||
const selectedModule = ref(null);
|
||||
const moduleConfig = ref({});
|
||||
|
||||
// Доступные модули (временные данные)
|
||||
const availableModules = ref([
|
||||
{
|
||||
id: 'treasury',
|
||||
name: 'Казначейство',
|
||||
version: '1.0.0',
|
||||
description: 'Управление средствами и активами DLE',
|
||||
features: ['Мультивалютность', 'Автоматизация', 'Отчетность'],
|
||||
installed: true,
|
||||
configSettings: [
|
||||
{
|
||||
key: 'maxWithdrawal',
|
||||
label: 'Максимальная сумма вывода',
|
||||
type: 'number',
|
||||
min: 0,
|
||||
max: 1000000,
|
||||
placeholder: '10000',
|
||||
hint: 'Максимальная сумма для однократного вывода средств'
|
||||
},
|
||||
{
|
||||
key: 'approvalRequired',
|
||||
label: 'Требуется одобрение',
|
||||
type: 'select',
|
||||
options: [
|
||||
{ value: 'true', label: 'Да' },
|
||||
{ value: 'false', label: 'Нет' }
|
||||
],
|
||||
hint: 'Требуется ли одобрение для операций с казной'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 'governance',
|
||||
name: 'Расширенное управление',
|
||||
version: '2.1.0',
|
||||
description: 'Дополнительные функции голосования и управления',
|
||||
features: ['Делегирование', 'Взвешенное голосование', 'Автоматизация'],
|
||||
installed: false,
|
||||
configSettings: [
|
||||
{
|
||||
key: 'delegationEnabled',
|
||||
label: 'Включить делегирование',
|
||||
type: 'select',
|
||||
options: [
|
||||
{ value: 'true', label: 'Да' },
|
||||
{ value: 'false', label: 'Нет' }
|
||||
],
|
||||
hint: 'Разрешить делегирование голосов'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 'compliance',
|
||||
name: 'Соответствие требованиям',
|
||||
version: '1.2.0',
|
||||
description: 'Модуль для обеспечения соответствия нормативным требованиям',
|
||||
features: ['KYC/AML', 'Отчетность', 'Аудит'],
|
||||
installed: false,
|
||||
configSettings: [
|
||||
{
|
||||
key: 'kycRequired',
|
||||
label: 'Требуется KYC',
|
||||
type: 'select',
|
||||
options: [
|
||||
{ value: 'true', label: 'Да' },
|
||||
{ value: 'false', label: 'Нет' }
|
||||
],
|
||||
hint: 'Требуется ли прохождение KYC для участия'
|
||||
}
|
||||
]
|
||||
}
|
||||
]);
|
||||
|
||||
// Установленные модули (временные данные)
|
||||
const installedModules = ref([
|
||||
{
|
||||
name: 'Казначейство',
|
||||
description: 'Управление средствами и активами DLE',
|
||||
address: '0x1234567890123456789012345678901234567890',
|
||||
version: '1.0.0',
|
||||
status: 'active',
|
||||
configSettings: availableModules.value[0].configSettings
|
||||
}
|
||||
]);
|
||||
|
||||
// Методы
|
||||
const installModule = async (moduleId) => {
|
||||
if (isInstalling.value) return;
|
||||
|
||||
try {
|
||||
isInstalling.value = true;
|
||||
|
||||
// Здесь будет логика установки модуля
|
||||
console.log('Установка модуля:', moduleId);
|
||||
|
||||
// Временная логика
|
||||
const module = availableModules.value.find(m => m.id === moduleId);
|
||||
if (module) {
|
||||
module.installed = true;
|
||||
|
||||
// Добавляем в список установленных
|
||||
installedModules.value.push({
|
||||
name: module.name,
|
||||
description: module.description,
|
||||
address: '0x' + Math.random().toString(16).substr(2, 40),
|
||||
version: module.version,
|
||||
status: 'active',
|
||||
configSettings: module.configSettings
|
||||
});
|
||||
}
|
||||
|
||||
alert('Модуль успешно установлен!');
|
||||
|
||||
} catch (error) {
|
||||
console.error('Ошибка установки модуля:', error);
|
||||
alert('Ошибка при установке модуля');
|
||||
} finally {
|
||||
isInstalling.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const uninstallModule = async (moduleAddress) => {
|
||||
if (!confirm('Вы уверены, что хотите удалить этот модуль?')) return;
|
||||
|
||||
try {
|
||||
// Здесь будет логика удаления модуля
|
||||
console.log('Удаление модуля:', moduleAddress);
|
||||
|
||||
// Временная логика
|
||||
installedModules.value = installedModules.value.filter(m => m.address !== moduleAddress);
|
||||
|
||||
// Обновляем статус в доступных модулях
|
||||
const module = availableModules.value.find(m => m.name === 'Казначейство');
|
||||
if (module) {
|
||||
module.installed = false;
|
||||
}
|
||||
|
||||
alert('Модуль успешно удален!');
|
||||
|
||||
} catch (error) {
|
||||
console.error('Ошибка удаления модуля:', error);
|
||||
alert('Ошибка при удалении модуля');
|
||||
}
|
||||
};
|
||||
|
||||
const configureModule = (module) => {
|
||||
selectedModule.value = module;
|
||||
moduleConfig.value = {};
|
||||
showConfigModal.value = true;
|
||||
};
|
||||
|
||||
const saveModuleConfig = async () => {
|
||||
if (isSavingConfig.value) return;
|
||||
|
||||
try {
|
||||
isSavingConfig.value = true;
|
||||
|
||||
// Здесь будет логика сохранения конфигурации
|
||||
console.log('Сохранение конфигурации:', moduleConfig.value);
|
||||
|
||||
alert('Конфигурация успешно сохранена!');
|
||||
showConfigModal.value = false;
|
||||
|
||||
} catch (error) {
|
||||
console.error('Ошибка сохранения конфигурации:', error);
|
||||
alert('Ошибка при сохранении конфигурации');
|
||||
} finally {
|
||||
isSavingConfig.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const openModuleInterface = (module) => {
|
||||
// Здесь будет логика открытия интерфейса модуля
|
||||
console.log('Открытие интерфейса модуля:', module);
|
||||
alert(`Открытие интерфейса модуля ${module.name}`);
|
||||
};
|
||||
|
||||
const getStatusText = (status) => {
|
||||
const statusMap = {
|
||||
'active': 'Активен',
|
||||
'inactive': 'Неактивен',
|
||||
'error': 'Ошибка',
|
||||
'updating': 'Обновляется'
|
||||
};
|
||||
return statusMap[status] || status;
|
||||
};
|
||||
|
||||
const formatAddress = (address) => {
|
||||
if (!address) return '';
|
||||
return address.substring(0, 6) + '...' + address.substring(address.length - 4);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.modules-container {
|
||||
padding: 20px;
|
||||
background-color: var(--color-white);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 40px;
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.header-content {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
color: var(--color-primary);
|
||||
font-size: 2.5rem;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.page-header p {
|
||||
color: var(--color-grey-dark);
|
||||
font-size: 1.1rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 1.5rem;
|
||||
cursor: pointer;
|
||||
color: #666;
|
||||
padding: 0;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
transition: all 0.2s;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.close-btn:hover {
|
||||
background: #f0f0f0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* Секции */
|
||||
.available-modules-section,
|
||||
.installed-modules-section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.available-modules-section h2,
|
||||
.installed-modules-section h2 {
|
||||
color: var(--color-primary);
|
||||
margin-bottom: 20px;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
/* Сетка модулей */
|
||||
.modules-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.module-card {
|
||||
background: white;
|
||||
padding: 25px;
|
||||
border-radius: var(--radius-lg);
|
||||
border: 1px solid #e9ecef;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.module-card:hover {
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.module-card.module-installed {
|
||||
border-left: 4px solid #28a745;
|
||||
background: #f8fff9;
|
||||
}
|
||||
|
||||
.module-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.module-header h3 {
|
||||
margin: 0;
|
||||
color: var(--color-primary);
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.module-version {
|
||||
background: var(--color-primary);
|
||||
color: white;
|
||||
padding: 4px 8px;
|
||||
border-radius: 12px;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.module-description {
|
||||
color: var(--color-grey-dark);
|
||||
margin: 0 0 15px 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.module-features {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.feature-tag {
|
||||
background: #e9ecef;
|
||||
color: var(--color-grey-dark);
|
||||
padding: 4px 8px;
|
||||
border-radius: 12px;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.module-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
/* Установленные модули */
|
||||
.installed-modules-list {
|
||||
display: grid;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.installed-module-card {
|
||||
background: white;
|
||||
padding: 25px;
|
||||
border-radius: var(--radius-lg);
|
||||
border: 1px solid #e9ecef;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.installed-module-card:hover {
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.module-info {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.module-status {
|
||||
padding: 4px 12px;
|
||||
border-radius: 12px;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.module-status.active {
|
||||
background: #d4edda;
|
||||
color: #155724;
|
||||
}
|
||||
|
||||
.module-status.inactive {
|
||||
background: #f8d7da;
|
||||
color: #721c24;
|
||||
}
|
||||
|
||||
.module-status.error {
|
||||
background: #f8d7da;
|
||||
color: #721c24;
|
||||
}
|
||||
|
||||
.module-status.updating {
|
||||
background: #fff3cd;
|
||||
color: #856404;
|
||||
}
|
||||
|
||||
.module-address {
|
||||
font-family: monospace;
|
||||
font-size: 0.9rem;
|
||||
color: var(--color-grey-dark);
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
.module-version {
|
||||
font-size: 0.9rem;
|
||||
color: var(--color-grey-dark);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Модальное окно */
|
||||
.modal-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: white;
|
||||
border-radius: var(--radius-lg);
|
||||
width: 90%;
|
||||
max-width: 600px;
|
||||
max-height: 90vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
border-bottom: 1px solid #e9ecef;
|
||||
}
|
||||
|
||||
.modal-header h3 {
|
||||
margin: 0;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
/* Форма конфигурации */
|
||||
.config-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
font-weight: 600;
|
||||
color: var(--color-grey-dark);
|
||||
}
|
||||
|
||||
.form-group input,
|
||||
.form-group select {
|
||||
padding: 12px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: var(--radius-sm);
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.setting-hint {
|
||||
font-size: 0.8rem;
|
||||
color: var(--color-grey-dark);
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
justify-content: flex-end;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* Кнопки */
|
||||
.btn-primary {
|
||||
background: var(--color-primary);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
background: var(--color-primary-dark);
|
||||
}
|
||||
|
||||
.btn-primary:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: var(--color-secondary);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: var(--color-secondary-dark);
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background: #dc3545;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-danger:hover {
|
||||
background: #c82333;
|
||||
}
|
||||
|
||||
/* Состояния */
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 60px;
|
||||
color: var(--color-grey-dark);
|
||||
background: #f8f9fa;
|
||||
border-radius: var(--radius-lg);
|
||||
border: 2px dashed #dee2e6;
|
||||
}
|
||||
|
||||
.empty-state p {
|
||||
margin: 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
/* Адаптивность */
|
||||
@media (max-width: 768px) {
|
||||
.modules-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.module-actions {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,611 +0,0 @@
|
||||
<!--
|
||||
Copyright (c) 2024-2025 Тарабанов Александр Викторович
|
||||
All rights reserved.
|
||||
|
||||
This software is proprietary and confidential.
|
||||
Unauthorized copying, modification, or distribution is prohibited.
|
||||
|
||||
For licensing inquiries: info@hb3-accelerator.com
|
||||
Website: https://hb3-accelerator.com
|
||||
GitHub: https://github.com/HB3-ACCELERATOR
|
||||
-->
|
||||
|
||||
<template>
|
||||
<BaseLayout
|
||||
:is-authenticated="isAuthenticated"
|
||||
:identities="identities"
|
||||
:token-balances="tokenBalances"
|
||||
:is-loading-tokens="isLoadingTokens"
|
||||
@auth-action-completed="$emit('auth-action-completed')"
|
||||
>
|
||||
<div class="proposals-container">
|
||||
<!-- Заголовок -->
|
||||
<div class="page-header">
|
||||
<div class="header-content">
|
||||
<h1>Предложения</h1>
|
||||
<p>Создание, подписание и выполнение предложений</p>
|
||||
</div>
|
||||
<button class="close-btn" @click="router.push('/management')">×</button>
|
||||
</div>
|
||||
|
||||
<!-- Создание нового предложения -->
|
||||
<div class="create-proposal-section">
|
||||
<h2>Создать новое предложение</h2>
|
||||
<form @submit.prevent="createProposal" class="proposal-form">
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="operationType">Тип операции:</label>
|
||||
<select id="operationType" v-model="newProposal.operationType" required>
|
||||
<option value="">Выберите тип операции</option>
|
||||
<option value="token_transfer">Перевод токенов</option>
|
||||
<option value="treasury_operation">Казначейская операция</option>
|
||||
<option value="module_install">Установка модуля</option>
|
||||
<option value="parameter_change">Изменение параметров</option>
|
||||
<option value="emergency_action">Экстренные действия</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="timelockDelay">Задержка таймлока (часы):</label>
|
||||
<input
|
||||
id="timelockDelay"
|
||||
type="number"
|
||||
v-model="newProposal.timelockDelay"
|
||||
min="1"
|
||||
max="168"
|
||||
required
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="description">Описание операции:</label>
|
||||
<textarea
|
||||
id="description"
|
||||
v-model="newProposal.description"
|
||||
placeholder="Опишите детали операции..."
|
||||
required
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Целевые сети:</label>
|
||||
<div class="networks-grid">
|
||||
<label v-for="network in availableNetworks" :key="network.id" class="network-checkbox">
|
||||
<input
|
||||
type="checkbox"
|
||||
:value="network.id"
|
||||
v-model="newProposal.targetChains"
|
||||
>
|
||||
{{ network.name }}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn-primary" :disabled="isCreatingProposal">
|
||||
{{ isCreatingProposal ? 'Создание...' : 'Создать предложение' }}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Активные предложения -->
|
||||
<div class="proposals-section">
|
||||
<h2>Активные предложения</h2>
|
||||
<div v-if="proposals.length === 0" class="empty-state">
|
||||
<p>Нет активных предложений</p>
|
||||
</div>
|
||||
<div v-else class="proposals-list">
|
||||
<div
|
||||
v-for="proposal in proposals"
|
||||
:key="proposal.id"
|
||||
class="proposal-card"
|
||||
:class="{ 'proposal-executed': proposal.executed }"
|
||||
>
|
||||
<div class="proposal-header">
|
||||
<h3>Предложение #{{ proposal.id }}</h3>
|
||||
<span class="proposal-status" :class="getStatusClass(proposal)">
|
||||
{{ getStatusText(proposal) }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="proposal-details">
|
||||
<p><strong>Описание:</strong> {{ proposal.description }}</p>
|
||||
<p><strong>Инициатор:</strong> {{ formatAddress(proposal.initiator) }}</p>
|
||||
<p><strong>Таймлок:</strong> {{ formatTimestamp(proposal.timelock) }}</p>
|
||||
<p><strong>Подписи:</strong> {{ proposal.signaturesCount }} / {{ proposal.quorumRequired }}</p>
|
||||
</div>
|
||||
|
||||
<div class="proposal-actions">
|
||||
<button
|
||||
v-if="!proposal.hasSigned && !proposal.executed"
|
||||
@click="signProposal(proposal.id)"
|
||||
class="btn-secondary"
|
||||
:disabled="isSigning"
|
||||
>
|
||||
Подписать
|
||||
</button>
|
||||
<button
|
||||
v-if="canExecuteProposal(proposal)"
|
||||
@click="executeProposal(proposal.id)"
|
||||
class="btn-success"
|
||||
:disabled="isExecuting"
|
||||
>
|
||||
Выполнить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, defineProps, defineEmits } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
|
||||
// Определяем props
|
||||
const props = defineProps({
|
||||
isAuthenticated: Boolean,
|
||||
identities: Array,
|
||||
tokenBalances: Object,
|
||||
isLoadingTokens: Boolean
|
||||
});
|
||||
|
||||
// Определяем emits
|
||||
const emit = defineEmits(['auth-action-completed']);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
// Состояние
|
||||
const isCreatingProposal = ref(false);
|
||||
const isSigning = ref(false);
|
||||
const isExecuting = ref(false);
|
||||
|
||||
const newProposal = ref({
|
||||
operationType: '',
|
||||
description: '',
|
||||
targetChains: [],
|
||||
timelockDelay: 24
|
||||
});
|
||||
|
||||
// Доступные сети
|
||||
const availableNetworks = ref([
|
||||
{ id: 1, name: 'Ethereum Mainnet' },
|
||||
{ id: 137, name: 'Polygon' },
|
||||
{ id: 56, name: 'BSC' },
|
||||
{ id: 42161, name: 'Arbitrum' }
|
||||
]);
|
||||
|
||||
// Предложения (временные данные)
|
||||
const proposals = ref([
|
||||
{
|
||||
id: 1,
|
||||
description: 'Перевод 100 токенов партнеру',
|
||||
initiator: '0x1234567890123456789012345678901234567890',
|
||||
timelock: Math.floor(Date.now() / 1000) + 3600,
|
||||
signaturesCount: 5000,
|
||||
quorumRequired: 5100,
|
||||
executed: false,
|
||||
hasSigned: false
|
||||
}
|
||||
]);
|
||||
|
||||
// Методы
|
||||
const createProposal = async () => {
|
||||
if (isCreatingProposal.value) return;
|
||||
|
||||
try {
|
||||
isCreatingProposal.value = true;
|
||||
|
||||
// Здесь будет создание предложения в смарт-контракте
|
||||
// console.log('Создание предложения:', newProposal.value);
|
||||
|
||||
// Временная логика
|
||||
const proposal = {
|
||||
id: proposals.value.length + 1,
|
||||
description: newProposal.value.description,
|
||||
initiator: '0x' + Math.random().toString(16).substr(2, 40),
|
||||
timelock: Math.floor(Date.now() / 1000) + (newProposal.value.timelockDelay * 3600),
|
||||
signaturesCount: 0,
|
||||
quorumRequired: 5100,
|
||||
executed: false,
|
||||
hasSigned: false
|
||||
};
|
||||
|
||||
proposals.value.push(proposal);
|
||||
|
||||
// Сброс формы
|
||||
newProposal.value = {
|
||||
operationType: '',
|
||||
description: '',
|
||||
targetChains: [],
|
||||
timelockDelay: 24
|
||||
};
|
||||
|
||||
} catch (error) {
|
||||
// console.error('Ошибка создания предложения:', error);
|
||||
} finally {
|
||||
isCreatingProposal.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const signProposal = async (proposalId) => {
|
||||
if (isSigning.value) return;
|
||||
|
||||
try {
|
||||
isSigning.value = true;
|
||||
|
||||
// Здесь будет подписание предложения в смарт-контракте
|
||||
// console.log('Подписание предложения:', proposalId);
|
||||
|
||||
const proposal = proposals.value.find(p => p.id === proposalId);
|
||||
if (proposal) {
|
||||
proposal.signaturesCount += 1000;
|
||||
proposal.hasSigned = true;
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
// console.error('Ошибка подписания предложения:', error);
|
||||
} finally {
|
||||
isSigning.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const executeProposal = async (proposalId) => {
|
||||
if (isExecuting.value) return;
|
||||
|
||||
try {
|
||||
isExecuting.value = true;
|
||||
|
||||
// Здесь будет выполнение предложения в смарт-контракте
|
||||
// console.log('Выполнение предложения:', proposalId);
|
||||
|
||||
const proposal = proposals.value.find(p => p.id === proposalId);
|
||||
if (proposal) {
|
||||
proposal.executed = true;
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
// console.error('Ошибка выполнения предложения:', error);
|
||||
} finally {
|
||||
isExecuting.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const canExecuteProposal = (proposal) => {
|
||||
return !proposal.executed &&
|
||||
proposal.signaturesCount >= proposal.quorumRequired &&
|
||||
Date.now() >= proposal.timelock * 1000;
|
||||
};
|
||||
|
||||
const formatAddress = (address) => {
|
||||
if (!address) return '';
|
||||
return address.substring(0, 6) + '...' + address.substring(address.length - 4);
|
||||
};
|
||||
|
||||
const formatTimestamp = (timestamp) => {
|
||||
return new Date(timestamp * 1000).toLocaleString('ru-RU');
|
||||
};
|
||||
|
||||
const getStatusClass = (proposal) => {
|
||||
if (proposal.executed) return 'status-executed';
|
||||
if (proposal.signaturesCount >= proposal.quorumRequired) return 'status-ready';
|
||||
return 'status-pending';
|
||||
};
|
||||
|
||||
const getStatusText = (proposal) => {
|
||||
if (proposal.executed) return 'Выполнено';
|
||||
if (proposal.signaturesCount >= proposal.quorumRequired) return 'Готово к выполнению';
|
||||
return 'Ожидает подписей';
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.proposals-container {
|
||||
padding: 20px;
|
||||
background-color: var(--color-white);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 40px;
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.header-content {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
color: var(--color-primary);
|
||||
font-size: 2.5rem;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.page-header p {
|
||||
color: var(--color-grey-dark);
|
||||
font-size: 1.1rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 1.5rem;
|
||||
cursor: pointer;
|
||||
color: #666;
|
||||
padding: 0;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
transition: all 0.2s;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.close-btn:hover {
|
||||
background: #f0f0f0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* Секции */
|
||||
.create-proposal-section,
|
||||
.proposals-section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.create-proposal-section h2,
|
||||
.proposals-section h2 {
|
||||
color: var(--color-primary);
|
||||
margin-bottom: 20px;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
/* Форма */
|
||||
.proposal-form {
|
||||
background: #f8f9fa;
|
||||
padding: 25px;
|
||||
border-radius: var(--radius-lg);
|
||||
border: 1px solid #e9ecef;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
font-weight: 600;
|
||||
color: var(--color-grey-dark);
|
||||
}
|
||||
|
||||
.form-group input,
|
||||
.form-group select,
|
||||
.form-group textarea {
|
||||
padding: 12px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: var(--radius-sm);
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.form-group textarea {
|
||||
min-height: 100px;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.networks-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.network-checkbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
cursor: pointer;
|
||||
padding: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.network-checkbox:hover {
|
||||
background: #e9ecef;
|
||||
}
|
||||
|
||||
.network-checkbox input[type="checkbox"] {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/* Предложения */
|
||||
.proposals-list {
|
||||
display: grid;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.proposal-card {
|
||||
background: white;
|
||||
padding: 25px;
|
||||
border-radius: var(--radius-lg);
|
||||
border: 1px solid #e9ecef;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.proposal-card:hover {
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.proposal-card.proposal-executed {
|
||||
opacity: 0.7;
|
||||
background: #f8f9fa;
|
||||
}
|
||||
|
||||
.proposal-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.proposal-header h3 {
|
||||
margin: 0;
|
||||
color: var(--color-primary);
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.proposal-status {
|
||||
padding: 6px 16px;
|
||||
border-radius: 20px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.status-pending {
|
||||
background: #fff3cd;
|
||||
color: #856404;
|
||||
}
|
||||
|
||||
.status-ready {
|
||||
background: #d1ecf1;
|
||||
color: #0c5460;
|
||||
}
|
||||
|
||||
.status-executed {
|
||||
background: #d4edda;
|
||||
color: #155724;
|
||||
}
|
||||
|
||||
.proposal-details {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.proposal-details p {
|
||||
margin: 8px 0;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.proposal-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* Кнопки */
|
||||
.btn-primary {
|
||||
background: var(--color-primary);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 12px 24px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
background: var(--color-primary-dark);
|
||||
}
|
||||
|
||||
.btn-primary:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: var(--color-secondary);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-secondary:hover:not(:disabled) {
|
||||
background: var(--color-secondary-dark);
|
||||
}
|
||||
|
||||
.btn-secondary:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
background: #28a745;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-success:hover:not(:disabled) {
|
||||
background: #218838;
|
||||
}
|
||||
|
||||
.btn-success:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Состояния */
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 60px;
|
||||
color: var(--color-grey-dark);
|
||||
background: #f8f9fa;
|
||||
border-radius: var(--radius-lg);
|
||||
border: 2px dashed #dee2e6;
|
||||
}
|
||||
|
||||
.empty-state p {
|
||||
margin: 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
/* Адаптивность */
|
||||
@media (max-width: 768px) {
|
||||
.form-row {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.proposal-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.proposal-actions {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.networks-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -216,27 +216,8 @@ const newSettings = ref({
|
||||
reason: ''
|
||||
});
|
||||
|
||||
// История изменений (временные данные)
|
||||
const settingsHistory = ref([
|
||||
{
|
||||
id: 1,
|
||||
timestamp: Date.now() - 86400000, // 1 день назад
|
||||
reason: 'Оптимизация параметров голосования для повышения эффективности',
|
||||
quorumChange: { from: 60, to: 51 },
|
||||
votingDelayChange: { from: 2, to: 1 },
|
||||
author: '0x1234567890123456789012345678901234567890'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
timestamp: Date.now() - 604800000, // 1 неделя назад
|
||||
reason: 'Первоначальная настройка параметров DLE',
|
||||
quorumChange: { from: 0, to: 60 },
|
||||
votingDelayChange: { from: 0, to: 2 },
|
||||
votingPeriodChange: { from: 0, to: 45818 },
|
||||
proposalThresholdChange: { from: 0, to: 100 },
|
||||
author: '0x2345678901234567890123456789012345678901'
|
||||
}
|
||||
]);
|
||||
// История изменений (загружается из блокчейна)
|
||||
const settingsHistory = ref([]);
|
||||
|
||||
// Методы
|
||||
const updateSettings = async () => {
|
||||
|
||||
@@ -351,14 +351,8 @@ const networkSettings = ref({
|
||||
rpcEndpoint: 'https://mainnet.infura.io/v3/YOUR_PROJECT_ID'
|
||||
});
|
||||
|
||||
// Доступные сети
|
||||
const availableNetworks = ref([
|
||||
{ id: 1, name: 'Ethereum Mainnet', chainId: 1 },
|
||||
{ id: 137, name: 'Polygon', chainId: 137 },
|
||||
{ id: 56, name: 'BSC', chainId: 56 },
|
||||
{ id: 42161, name: 'Arbitrum', chainId: 42161 },
|
||||
{ id: 10, name: 'Optimism', chainId: 10 }
|
||||
]);
|
||||
// Доступные сети (загружаются из конфигурации)
|
||||
const availableNetworks = ref([]);
|
||||
|
||||
// Методы
|
||||
const saveMainSettings = async () => {
|
||||
|
||||
@@ -228,12 +228,12 @@ const isLoadingDle = ref(false);
|
||||
const isTransferring = ref(false);
|
||||
const isDistributing = ref(false);
|
||||
|
||||
// Данные токенов (реактивные)
|
||||
const tokenSymbol = computed(() => selectedDle.value?.symbol || 'MDLE');
|
||||
const totalSupply = computed(() => selectedDle.value?.initialAmounts?.[0] || 10000);
|
||||
const userBalance = computed(() => Math.floor(totalSupply.value * 0.1)); // 10% для демо
|
||||
const quorumPercentage = computed(() => selectedDle.value?.governanceSettings?.quorumPercentage || 51);
|
||||
const tokenPrice = ref(1.25);
|
||||
// Данные токенов (загружаются из блокчейна)
|
||||
const tokenSymbol = computed(() => selectedDle.value?.symbol || '');
|
||||
const totalSupply = computed(() => selectedDle.value?.totalSupply || 0);
|
||||
const userBalance = computed(() => selectedDle.value?.deployerBalance || 0);
|
||||
const quorumPercentage = computed(() => selectedDle.value?.quorumPercentage || 0);
|
||||
const tokenPrice = ref(0);
|
||||
|
||||
// Данные трансфера
|
||||
const transferData = ref({
|
||||
@@ -250,14 +250,8 @@ const distributionData = ref({
|
||||
]
|
||||
});
|
||||
|
||||
// Держатели токенов (временные данные)
|
||||
const tokenHolders = ref([
|
||||
{ address: '0x1234567890123456789012345678901234567890', balance: 2500 },
|
||||
{ address: '0x2345678901234567890123456789012345678901', balance: 1800 },
|
||||
{ address: '0x3456789012345678901234567890123456789012', balance: 1200 },
|
||||
{ address: '0x4567890123456789012345678901234567890123', balance: 800 },
|
||||
{ address: '0x5678901234567890123456789012345678901234', balance: 600 }
|
||||
]);
|
||||
// Держатели токенов (загружаются из блокчейна)
|
||||
const tokenHolders = ref([]);
|
||||
|
||||
// Функции
|
||||
async function loadDleData() {
|
||||
@@ -268,27 +262,38 @@ async function loadDleData() {
|
||||
|
||||
isLoadingDle.value = true;
|
||||
try {
|
||||
// Загружаем данные DLE из backend
|
||||
const response = await axios.get(`/dle-v2`);
|
||||
const dles = response.data.data; // Используем response.data.data
|
||||
// Читаем актуальные данные из блокчейна
|
||||
const blockchainResponse = await axios.post('/blockchain/read-dle-info', {
|
||||
dleAddress: dleAddress.value
|
||||
});
|
||||
|
||||
// Находим нужный DLE по адресу
|
||||
const dle = dles.find(d => d.dleAddress === dleAddress.value);
|
||||
|
||||
if (dle) {
|
||||
selectedDle.value = dle;
|
||||
console.log('Загружен DLE:', dle);
|
||||
console.log('Данные токенов будут обновлены автоматически');
|
||||
if (blockchainResponse.data.success) {
|
||||
const blockchainData = blockchainResponse.data.data;
|
||||
selectedDle.value = blockchainData;
|
||||
console.log('Загружены данные DLE из блокчейна:', blockchainData);
|
||||
|
||||
// Загружаем держателей токенов (если есть API)
|
||||
await loadTokenHolders();
|
||||
} else {
|
||||
console.warn('DLE не найден:', dleAddress.value);
|
||||
console.warn('Не удалось прочитать данные из блокчейна для', dleAddress.value);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Ошибка загрузки DLE:', error);
|
||||
console.error('Ошибка загрузки данных DLE из блокчейна:', error);
|
||||
} finally {
|
||||
isLoadingDle.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function loadTokenHolders() {
|
||||
try {
|
||||
// Здесь можно добавить загрузку держателей токенов из блокчейна
|
||||
// Пока оставляем пустым
|
||||
tokenHolders.value = [];
|
||||
} catch (error) {
|
||||
console.error('Ошибка загрузки держателей токенов:', error);
|
||||
}
|
||||
}
|
||||
|
||||
function shortenAddress(address) {
|
||||
if (!address) return '';
|
||||
return `${address.slice(0, 6)}...${address.slice(-4)}`;
|
||||
|
||||
@@ -270,49 +270,8 @@ const dailyChange = ref(25000);
|
||||
const assetsCount = ref(5);
|
||||
const yieldPercentage = ref(8.5);
|
||||
|
||||
// Активы (временные данные)
|
||||
const assets = ref([
|
||||
{
|
||||
id: 'eth',
|
||||
name: 'Ethereum',
|
||||
symbol: 'ETH',
|
||||
balance: 125.5,
|
||||
value: 450000,
|
||||
change: 2.5
|
||||
},
|
||||
{
|
||||
id: 'usdc',
|
||||
name: 'USD Coin',
|
||||
symbol: 'USDC',
|
||||
balance: 500000,
|
||||
value: 500000,
|
||||
change: 0.1
|
||||
},
|
||||
{
|
||||
id: 'btc',
|
||||
name: 'Bitcoin',
|
||||
symbol: 'BTC',
|
||||
balance: 2.5,
|
||||
value: 150000,
|
||||
change: -1.2
|
||||
},
|
||||
{
|
||||
id: 'matic',
|
||||
name: 'Polygon',
|
||||
symbol: 'MATIC',
|
||||
balance: 50000,
|
||||
value: 75000,
|
||||
change: 5.8
|
||||
},
|
||||
{
|
||||
id: 'link',
|
||||
name: 'Chainlink',
|
||||
symbol: 'LINK',
|
||||
balance: 2500,
|
||||
value: 75000,
|
||||
change: 3.2
|
||||
}
|
||||
]);
|
||||
// Активы (загружаются из блокчейна)
|
||||
const assets = ref([]);
|
||||
|
||||
// Вкладки операций
|
||||
const operationTabs = ref([
|
||||
@@ -335,32 +294,8 @@ const withdrawData = ref({
|
||||
reason: ''
|
||||
});
|
||||
|
||||
// История операций (временные данные)
|
||||
const operationsHistory = ref([
|
||||
{
|
||||
id: 1,
|
||||
type: 'deposit',
|
||||
asset: 'Ethereum',
|
||||
symbol: 'ETH',
|
||||
amount: 10.5,
|
||||
value: 37500,
|
||||
reason: 'Пополнение казны от доходов',
|
||||
timestamp: Date.now() - 3600000,
|
||||
status: 'completed'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: 'withdraw',
|
||||
asset: 'USD Coin',
|
||||
symbol: 'USDC',
|
||||
amount: 25000,
|
||||
value: 25000,
|
||||
reason: 'Выплата партнерам',
|
||||
recipient: '0x1234567890123456789012345678901234567890',
|
||||
timestamp: Date.now() - 7200000,
|
||||
status: 'completed'
|
||||
}
|
||||
]);
|
||||
// История операций (загружается из блокчейна)
|
||||
const operationsHistory = ref([]);
|
||||
|
||||
// Методы
|
||||
const depositAsset = (asset) => {
|
||||
|
||||
Reference in New Issue
Block a user