<!--
  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-proposals-management">
    <div class="proposals-header">
      <div class="header-info">
        <h3>🗳️ Управление предложениями</h3>
        <div v-if="selectedDle" class="dle-info">
          <span class="dle-name">{{ selectedDle.name }} ({{ selectedDle.symbol }})</span>
          <span class="dle-address">{{ shortenAddress(selectedDle.dleAddress) }}</span>
        </div>
        <div v-else-if="isLoadingDle" class="loading-info">
          <span>Загрузка данных DLE...</span>
        </div>
        <div v-else class="no-dle-info">
          <span>DLE не выбран</span>
        </div>
      </div>
      

    </div>

    <!-- Список предложений -->
    <div class="proposals-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>
          <button 
            class="btn btn-sm btn-outline-secondary" 
            @click="loadDleData"
            :disabled="isLoadingDle"
          >
            <i class="fas fa-sync-alt"></i> Обновить
      </button>
        </div>
    </div>

      <div v-if="filteredProposals.length === 0" class="no-proposals">
        <p>Предложений пока нет</p>
      </div>

      <div v-else class="proposals-grid">
        <div 
          v-for="proposal in filteredProposals" 
          :key="proposal.id" 
          class="proposal-card"
          :class="proposal.status"
        >

          <div class="proposal-header">
            <h5>{{ proposal.description || 'Без описания' }}</h5>
            <span class="proposal-status" :class="proposal.status">
              {{ getProposalStatusText(proposal.status) }}
            </span>
          </div>

          <div class="proposal-details">
            <div class="detail-item">
              <strong>ID:</strong> #{{ proposal.id }}
            </div>
            <div class="detail-item">
              <strong>Создатель:</strong> {{ shortenAddress(proposal.initiator) }}
            </div>
            <div class="detail-item">
              <strong>Создано:</strong> {{ formatDate(proposal.blockNumber ? proposal.blockNumber * 1000 : Date.now()) }}
            </div>
            <div class="detail-item">
              <strong>Цепочка:</strong> {{ getChainName(proposal.governanceChainId) || 'Неизвестная сеть' }}
            </div>
            <div class="detail-item">
              <strong>Дедлайн:</strong> {{ formatDate(proposal.deadline) }}
            </div>
            <div class="detail-item">
              <strong>Голоса:</strong> 
              <div class="votes-container">
                <div class="votes-info">
                  <span class="for">За: {{ formatVotes(proposal.forVotes) }}</span>
                  <span class="against">Против: {{ formatVotes(proposal.againstVotes) }}</span>
                </div>
                <div class="quorum-info">
                  <span class="quorum-percentage">Кворум: {{ getQuorumPercentage(proposal) }}% из {{ getRequiredQuorum() }}%</span>
                </div>
                <div class="quorum-progress">
                  <div class="progress-bar">
                    <div 
                      class="progress-fill" 
                      :style="{ width: getQuorumProgress(proposal) + '%' }"
                    ></div>
                  </div>
                </div>
              </div>
            </div>
            <div class="detail-item" v-if="proposal.operation && proposal.operation !== '0x'">
              <strong>Операция:</strong> 
              <span class="operation">{{ decodeOperation(proposal.operation) }}</span>
            </div>
            <div class="detail-item" v-if="getOperationDetails(proposal.operation, proposal)">
              <strong>Детали операции:</strong> 
              <span class="operation-details">{{ getOperationDetails(proposal.operation, proposal) }}</span>
            </div>
          </div>

          <div class="proposal-actions">
            <button 
              v-if="canSign(proposal) && props.isAuthenticated && hasAdminRights()"
              class="btn btn-sm btn-success" 
              @click="signProposalLocal(proposal.id)"
              :disabled="hasSigned(proposal.id)"
            >
              <i class="fas fa-signature"></i> Подписать
            </button>
            <button 
              v-if="canVoteAgainst(proposal) && props.isAuthenticated && hasAdminRights()"
              class="btn btn-sm btn-warning" 
              @click="cancelSignatureLocal(proposal.id)"
              :disabled="hasVotedAgainst(proposal.id)"
            >
              <i class="fas fa-times"></i> Против
            </button>
            <button 
              v-if="canExecute(proposal) && props.isAuthenticated && hasAdminRights()"
              class="btn btn-sm btn-primary" 
              @click="executeProposalLocal(proposal.id)"
            >
              <i class="fas fa-play"></i> Исполнить
            </button>
            
            <!-- Информация для неавторизованных пользователей -->
            <div v-if="!props.isAuthenticated" class="auth-notice">
              <small class="text-muted">
                <i class="fas fa-info-circle"></i> 
                Для участия в голосовании необходимо авторизоваться
              </small>
            </div>
            <div v-else-if="!hasAdminRights()" class="auth-notice">
              <small class="text-muted">
                <i class="fas fa-lock"></i> 
                Для участия в голосовании необходимы права администратора
              </small>
            </div>

          </div>
        </div>
      </div>
    </div>

    <!-- Форма создания предложения (всегда внизу страницы) -->
    <div class="create-proposal-form">
      <div class="form-header">
        <h4>📝 Создание нового предложения</h4>
        <!-- Кнопка закрытия больше не нужна -->
      </div>
      
      <!-- Информация для неавторизованных пользователей -->
      <div v-if="!props.isAuthenticated" class="auth-notice-form">
        <div class="alert alert-info">
          <i class="fas fa-info-circle"></i>
          <strong>Для создания предложений необходимо авторизоваться в приложении</strong>
          <p class="mb-0 mt-2">Подключите кошелек в сайдбаре для создания новых предложений</p>
        </div>
      </div>
      
      <!-- Форма только для авторизованных пользователей -->
      <div v-else>
      
      <div class="form-content">
        <!-- Основная информация -->
        <div class="form-section">
          <h5>📋 Основная информация</h5>
          
          <div class="form-group">
            <label for="proposalDescription">Описание предложения:</label>
            <textarea 
              id="proposalDescription" 
              v-model="newProposal.description" 
              class="form-control" 
              rows="3"
              placeholder="Опишите, что нужно сделать..."
            ></textarea>
          </div>
          
          <div class="form-group">
            <label for="proposalDuration">Длительность голосования (дни):</label>
            <input 
              type="number" 
              id="proposalDuration" 
              v-model.number="newProposal.duration" 
              class="form-control"
              min="1"
              max="30"
              placeholder="7"
            >
          </div>
        </div>

        <!-- Выбор цепочки для кворума -->
        <div class="form-section">
          <h5>🔗 Выбор цепочки для кворума</h5>
          <p class="form-help">Выберите цепочку, в которой будет происходить сбор голосов</p>
          
          <div class="chains-grid">
            <div 
              v-for="chain in availableChains" 
              :key="chain.chainId"
              class="chain-option"
              :class="{ 'selected': newProposal.governanceChainId === chain.chainId }"
              @click="newProposal.governanceChainId = chain.chainId"
            >
              <div class="chain-info">
                <h6>{{ chain.name }}</h6>
                <span class="chain-id">Chain ID: {{ chain.chainId }}</span>
                <p class="chain-description">{{ chain.description }}</p>
              </div>
              <div class="chain-status">
                <i v-if="newProposal.governanceChainId === chain.chainId" class="fas fa-check"></i>
              </div>
            </div>
          </div>
        </div>

        <!-- Тип операции -->
        <div class="form-section">
          <h5>⚙️ Тип операции</h5>
          
          <div class="operation-types">
            <div class="form-group">
              <label for="operationType">Выберите тип операции:</label>
              <select id="operationType" v-model="newProposal.operationType" class="form-control">
                <option value="">-- Выберите тип --</option>
                <option value="transfer">Передача токенов</option>
                <option value="mint">Минтинг токенов</option>
                <option value="burn">Сжигание токенов</option>
                <option value="custom">Пользовательская операция</option>
              </select>
            </div>

            <!-- Параметры для передачи токенов -->
            <div v-if="newProposal.operationType === 'transfer'" class="operation-params">
              <div class="form-group">
                <label for="transferTo">Адрес получателя:</label>
                <input 
                  type="text" 
                  id="transferTo" 
                  v-model="newProposal.operationParams.to" 
                  class="form-control"
                  placeholder="0x1234567890abcdef1234567890abcdef12345678"
                  :class="{ 'is-invalid': newProposal.operationParams.to && !validateAddress(newProposal.operationParams.to) }"
                >
                <small class="form-text text-muted">Введите корректный Ethereum адрес (42 символа, начинается с 0x)</small>
              </div>
              <div class="form-group">
                <label for="transferAmount">Количество токенов:</label>
                <input 
                  type="number" 
                  id="transferAmount" 
                  v-model.number="newProposal.operationParams.amount" 
                  class="form-control"
                  min="1"
                  placeholder="100"
                  :class="{ 'is-invalid': newProposal.operationParams.amount <= 0 }"
                >
                <small class="form-text text-muted">Введите количество токенов для передачи</small>
              </div>
            </div>

            <!-- Параметры для минтинга -->
            <div v-if="newProposal.operationType === 'mint'" class="operation-params">
              <div class="form-group">
                <label for="mintTo">Адрес получателя:</label>
                <input 
                  type="text" 
                  id="mintTo" 
                  v-model="newProposal.operationParams.to" 
                  class="form-control"
                  placeholder="0x..."
                >
              </div>
              <div class="form-group">
                <label for="mintAmount">Количество токенов:</label>
                <input 
                  type="number" 
                  id="mintAmount" 
                  v-model.number="newProposal.operationParams.amount" 
                  class="form-control"
                  min="1"
                  placeholder="1000"
                >
              </div>
            </div>

            <!-- Параметры для сжигания -->
            <div v-if="newProposal.operationType === 'burn'" class="operation-params">
              <div class="form-group">
                <label for="burnFrom">Адрес владельца:</label>
                <input 
                  type="text" 
                  id="burnFrom" 
                  v-model="newProposal.operationParams.from" 
                  class="form-control"
                  placeholder="0x..."
                >
              </div>
              <div class="form-group">
                <label for="burnAmount">Количество токенов:</label>
                <input 
                  type="number" 
                  id="burnAmount" 
                  v-model.number="newProposal.operationParams.amount" 
                  class="form-control"
                  min="1"
                  placeholder="100"
                >
              </div>
            </div>

            <!-- Пользовательская операция -->
            <div v-if="newProposal.operationType === 'custom'" class="operation-params">
              <div class="form-group">
                <label for="customOperation">Пользовательская операция (hex):</label>
                <textarea 
                  id="customOperation" 
                  v-model="newProposal.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> {{ newProposal.description || 'Не указано' }}
            </div>
            <div class="preview-item">
              <strong>Длительность:</strong> {{ newProposal.duration || 7 }} дней
            </div>
            <div class="preview-item">
              <strong>Цепочка для кворума:</strong> 
              {{ getChainName(newProposal.governanceChainId) || 'Не выбрана' }}
            </div>
            <div class="preview-item">
              <strong>Тип операции:</strong> {{ getOperationTypeName(newProposal.operationType) || 'Не выбран' }}
            </div>
            <div v-if="newProposal.operationType" class="preview-item">
              <strong>Параметры:</strong> {{ getOperationParamsPreview() }}
            </div>
          </div>
        </div>

        <!-- Действия -->
        <div class="form-actions">
          <button 
            class="btn btn-success" 
            @click="createProposal" 
            :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>
        </div>
      </div>
      </div> <!-- Закрываем div для авторизованных пользователей -->
    </div>
  </div>
  </BaseLayout>
</template>

<script setup>
import { ref, computed, onMounted, onUnmounted, watch, defineProps, defineEmits, inject } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import { useAuthContext } from '@/composables/useAuth';
import BaseLayout from '../../components/BaseLayout.vue';
import { getDLEInfo, loadProposals, createProposal as createProposalAPI, voteForProposal as voteForProposalAPI, executeProposal as executeProposalAPI, getSupportedChains } from '../../utils/dle-contract.js';
import wsClient from '../../utils/websocket.js';

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
});

// Получаем данные из BaseLayout через inject
const injectedIsAuthenticated = inject('isAuthenticated', computed(() => false));
const injectedIdentities = inject('identities', computed(() => []));
const injectedTokenBalances = inject('tokenBalances', computed(() => null));
const injectedIsLoadingTokens = inject('isLoadingTokens', computed(() => false));

const emit = defineEmits(['auth-action-completed']);

const { address, isAuthenticated, tokenBalances, checkTokenBalances } = useAuthContext();
const router = useRouter();
const route = useRoute();

// Получаем адрес DLE из URL
const dleAddress = computed(() => {
  const address = route.query.address || props.dleAddress;
  console.log('DLE Address from URL:', address);
  return address;
});

// Состояние DLE
const selectedDle = ref(null);
const isLoadingDle = ref(false);

// Состояние формы
// const showCreateForm = ref(false); // Больше не нужно - форма всегда видна
const isCreating = ref(false);
const statusFilter = ref('');

// Новое предложение
const newProposal = ref({
  description: '',
  duration: 7,
  governanceChainId: null,
  operationType: '',
  operationParams: {
    to: '',
    from: '',
    amount: 0,
    customData: ''
  }
});

// Доступные цепочки (загружаются из конфигурации)
const availableChains = ref([]);

// Предложения
const proposals = ref([]);



// Вычисляемые свойства
const isFormValid = computed(() => {
  return (
    newProposal.value.description &&
    newProposal.value.duration > 0 &&
    newProposal.value.governanceChainId &&
    newProposal.value.operationType &&
    validateOperationParams()
  );
});

const filteredProposals = computed(() => {
  console.log('[Frontend] Фильтрация предложений. Всего:', proposals.value.length);
  console.log('[Frontend] Фильтр статуса:', statusFilter.value);
  
  if (!statusFilter.value) {
    console.log('[Frontend] Возвращаем все предложения:', proposals.value);
    return proposals.value;
  }
  
  const filtered = proposals.value.filter(p => p.status === statusFilter.value);
  console.log('[Frontend] Отфильтрованные предложения:', filtered);
  return filtered;
});

// Функции
async function loadDleData() {
  console.log('loadDleData вызвана с адресом:', dleAddress.value);
  
  if (!dleAddress.value) {
    console.warn('Адрес DLE не указан');
    return;
  }

  isLoadingDle.value = true;
  try {
    // Загружаем данные DLE из блокчейна
    const dleData = await getDLEInfo(dleAddress.value);
    selectedDle.value = dleData;
    console.log('Загружены данные DLE из блокчейна:', dleData);
    
    // Загружаем предложения
    const proposalsData = await loadProposals(dleAddress.value);
    console.log('[Frontend] Загруженные предложения из API:', proposalsData);
    
    // Преобразуем данные из API в формат для frontend
    proposals.value = proposalsData.map(proposal => {
              const transformedProposal = {
          ...proposal,
          status: getProposalStatus(proposal),
          deadline: proposal.deadline || (proposal.startTime + proposal.duration)
        };
      console.log('[Frontend] Преобразованное предложение:', transformedProposal);
      return transformedProposal;
    });
    
    console.log('[Frontend] Итоговый список предложений:', proposals.value);
    
    // Загружаем поддерживаемые цепочки
    const chainsData = await getSupportedChains(dleAddress.value);
    availableChains.value = chainsData;
    

  } catch (error) {
    console.error('Ошибка загрузки данных DLE из блокчейна:', error);
  } finally {
    isLoadingDle.value = false;
  }
}

function validateOperationParams() {
  const params = newProposal.value.operationParams;
  
  switch (newProposal.value.operationType) {
    case 'transfer':
    case 'mint':
      return validateAddress(params.to) && params.amount > 0;
    case 'burn':
      return validateAddress(params.from) && params.amount > 0;
    case 'custom':
      return params.customData && params.customData.startsWith('0x') && params.customData.length >= 10;
    default:
      return false;
  }
}

function validateAddress(address) {
  if (!address) return false;
  // Проверяем формат Ethereum адреса
  const addressRegex = /^0x[a-fA-F0-9]{40}$/;
  return addressRegex.test(address);
}

function getChainName(chainId) {
  // Сначала ищем в availableChains
  const chain = availableChains.value.find(c => c.chainId === chainId);
  if (chain) return chain.name;
  
  // Если не найдено, используем известные chain ID
  const knownChains = {
    1: 'Ethereum Mainnet',
    11155111: 'Sepolia Testnet',
    137: 'Polygon',
    56: 'BSC',
    42161: 'Arbitrum One'
  };
  
  return knownChains[chainId] || `Chain ID: ${chainId}`;
}

function getOperationTypeName(type) {
  const types = {
    'transfer': 'Передача токенов',
    'mint': 'Минтинг токенов',
    'burn': 'Сжигание токенов',
    'custom': 'Пользовательская операция'
  };
  return types[type] || 'Неизвестный тип';
}

function getOperationParamsPreview() {
  const params = newProposal.value.operationParams;
  
  switch (newProposal.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 'custom':
      return `Данные: ${params.customData.substring(0, 20)}...`;
    default:
      return 'Не указаны';
  }
}

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 getProposalStatus(proposal) {
  const now = Math.floor(Date.now() / 1000);
  const deadline = proposal.deadline || 0;
  
  if (proposal.executed) {
    return 'executed';
  }
  
  if (deadline > 0 && now >= deadline) {
    return proposal.isPassed ? 'succeeded' : 'defeated';
  }
  
  return 'active';
}

function getProposalStatusText(status) {
  const statusMap = {
    'pending': 'Ожидает',
    'active': 'Активно',
    'succeeded': 'Принято',
    'defeated': 'Отклонено',
    'executed': 'Выполнено'
  };
  return statusMap[status] || status;
}

function decodeOperation(operation) {
  if (!operation || operation === '0x') return 'Нет операции';
  
  // Простое декодирование по селекторам
  const selectors = {
    '0xa9059cbb': 'Transfer',
    '0x40c10f19': 'Mint',
    '0x42966c68': 'Burn (address,uint256)'
  };
  
  const selector = operation.slice(0, 10);
  return selectors[selector] || `Операция (${selector})`;
}

function getQuorumPercentage(proposal) {
  if (!selectedDle.value || !selectedDle.value.totalSupply) {
    console.log('[Quorum] Нет данных DLE или totalSupply');
    return 0;
  }
  
  // Приводим все к одной единице измерения (wei)
  const totalSupplyWei = parseFloat(selectedDle.value.totalSupply) * Math.pow(10, 18);
  const forVotesWei = proposal.forVotes || 0;
  const againstVotesWei = proposal.againstVotes || 0;
  const totalVotesWei = forVotesWei + againstVotesWei;
  
  if (totalSupplyWei === 0) {
    console.log('[Quorum] TotalSupply равен 0');
    return 0;
  }
  
  const percentage = (totalVotesWei / totalSupplyWei) * 100;
  const roundedPercentage = Math.round(percentage * 100) / 100;
  console.log('[Quorum] Расчет процента:', { 
    totalSupplyWei, 
    forVotesWei, 
    againstVotesWei, 
    totalVotesWei, 
    percentage, 
    roundedPercentage 
  });
  return roundedPercentage; // Округляем до 2 знаков
}

function getQuorumProgress(proposal) {
  const percentage = getQuorumPercentage(proposal);
  const requiredQuorum = getRequiredQuorum();
  const progress = Math.min((percentage / requiredQuorum) * 100, 100);
  console.log('[Quorum] Прогресс кворума:', { percentage, requiredQuorum, progress });
  return progress;
}

function getRequiredQuorum() {
  const quorum = selectedDle.value?.quorumPercentage || 51;
  console.log('[Quorum] Требуемый кворум из DLE:', quorum, 'DLE данные:', selectedDle.value);
  return quorum; // По умолчанию 51% если данные не загружены
}

function formatVotes(votes) {
  if (!votes || votes === 0) return '0';
  
  // Конвертируем из wei в токены
  const tokens = votes / Math.pow(10, 18);
  return tokens.toFixed(2);
}

function getOperationDetails(operation, proposal) {
  if (!operation || operation === '0x') return null;
  
  const selector = operation.slice(0, 10);
  const data = operation.slice(10);
  
  try {
    switch (selector) {
      case '0xa9059cbb': // transfer(address,uint256)
        if (data.length >= 128) {
          const to = '0x' + data.slice(24, 64);
          const amount = parseInt(data.slice(64, 128), 16);
          return `Передать ${amount} токенов на адрес ${shortenAddress(to)}`;
        }
        break;
        
      case '0x40c10f19': // mint(address,uint256)
        if (data.length >= 128) {
          const to = '0x' + data.slice(24, 64);
          const amount = parseInt(data.slice(64, 128), 16);
          return `Создать ${amount} токенов для адреса ${shortenAddress(to)}`;
        }
        break;
        
      case '0x42966c68': // burn(address,uint256) или burn(uint256)
        if (data.length >= 128) {
          // Новый формат: burn(address,uint256) - адрес указан в операции
          const from = '0x' + data.slice(24, 64);
          const amount = parseInt(data.slice(64, 128), 16);
          return `Сжечь ${amount} токенов с адреса ${shortenAddress(from)}`;
        } else if (data.length >= 64) {
          // Старый формат: burn(uint256) - сжигает с адреса создателя предложения
          const amount = parseInt(data.slice(0, 64), 16);
          const burnerAddress = proposal.initiator || 'неизвестный адрес';
          return `Сжечь ${amount} токенов с адреса создателя ${shortenAddress(burnerAddress)}`;
        }
        break;
    }
  } catch (error) {
    console.error('Ошибка декодирования операции:', error);
  }
  
  return null;
}

function canSign(proposal) {
  return proposal.status === 'active' && !hasSigned(proposal.id);
}

function canExecute(proposal) {
  return proposal.status === 'succeeded' && !proposal.executed;
}

function hasSigned(proposalId) {
  // Здесь должна быть проверка подписи пользователя
  // Пока возвращаем false, так как нет API для проверки
  return false;
}

function canVoteAgainst(proposal) {
  return proposal.status === 'active' && !hasVotedAgainst(proposal.id);
}

function hasVotedAgainst(proposalId) {
  // Здесь должна быть проверка голосования "против" пользователя
  // Пока возвращаем false, так как нет API для проверки
  return false;
}

// Проверяем, голосовал ли пользователь за предложение
function hasVotedFor(proposalId) {
  // Здесь должна быть проверка голосования "за" пользователя
  // Пока возвращаем false, так как нет API для проверки
  return false;
}





// Создание предложения
async function createProposal() {
  // Проверка авторизации для создания предложений
  if (!props.isAuthenticated) {
    alert('❌ Для создания предложений необходимо авторизоваться в приложении');
    return;
  }

  if (!isFormValid.value) {
    alert('Пожалуйста, заполните все обязательные поля');
    return;
  }

  isCreating.value = true;
  
  try {
    // Подготовка данных для смарт-контракта
    const operation = encodeOperation();
    
    // Создаем предложение через API
    const result = await createProposalAPI(dleAddress.value, {
      description: newProposal.value.description,
      duration: newProposal.value.duration * 24 * 60 * 60, // конвертируем в секунды
      operation: operation,
      governanceChainId: newProposal.value.governanceChainId
    });
    
    console.log('Предложение создано:', result);
    
    // Отправляем WebSocket уведомление
    wsClient.send('proposal_created', {
      dleAddress: dleAddress.value,
      proposalId: result.proposalId,
      txHash: result.txHash
    });
    
    // Ждем немного, чтобы блокчейн обработал транзакцию
    await new Promise(resolve => setTimeout(resolve, 5000));
    
    // Обновляем список предложений
    await loadDleData();
    
    // Отправляем WebSocket уведомление о новом предложении
    wsClient.send('proposal_created', {
      dleAddress: dleAddress.value,
      proposalId: result.proposalId,
      txHash: result.txHash
    });
    
    // Сбрасываем форму
    resetForm();
    // showCreateForm.value = false; // Больше не нужно
    
    alert('✅ Предложение успешно создано!');
    
  } catch (error) {
    console.error('Ошибка при создании предложения:', error);
    alert('❌ Ошибка при создании предложения: ' + error.message);
  } finally {
    isCreating.value = false;
  }
}

function encodeOperation() {
  const params = newProposal.value.operationParams;
  
  switch (newProposal.value.operationType) {
    case 'transfer':
      return encodeTransferOperation(params.to, params.amount);
    case 'mint':
      return encodeMintOperation(params.to, params.amount);
    case 'burn':
      return encodeBurnOperation(params.from, params.amount);
    case 'custom':
      return params.customData;
    default:
      throw new Error('Неизвестный тип операции');
  }
}

function encodeTransferOperation(to, amount) {
  // Кодировка операции передачи токенов ERC20
  const selector = '0xa9059cbb'; // transfer(address,uint256)
  const paddedAddress = to.slice(2).padStart(64, '0');
  const paddedAmount = BigInt(amount).toString(16).padStart(64, '0');
  return selector + paddedAddress + paddedAmount;
}

function encodeMintOperation(to, amount) {
  // Кодировка операции минтинга токенов
  const selector = '0x40c10f19'; // mint(address,uint256)
  const paddedAddress = to.slice(2).padStart(64, '0');
  const paddedAmount = BigInt(amount).toString(16).padStart(64, '0');
  return selector + paddedAddress + paddedAmount;
}

function encodeBurnOperation(from, amount) {
  // Кодировка операции сжигания токенов
  const selector = '0x42966c68'; // burn(address,uint256)
  const paddedAddress = from.slice(2).padStart(64, '0');
  const paddedAmount = BigInt(amount).toString(16).padStart(64, '0');
  return selector + paddedAddress + paddedAmount;
}

// Подпись предложения
async function signProposalLocal(proposalId) {
  // Проверка прав админа для голосования
  if (!props.isAuthenticated) {
    alert('❌ Для участия в голосовании необходимо авторизоваться в приложении');
    return;
  }
  
  // Дополнительная проверка на права админа (можно расширить логику)
  if (!hasAdminRights()) {
    alert('❌ Для участия в голосовании необходимы права администратора');
    return;
  }

  try {
    console.log('[Debug] Попытка подписи для предложения:', proposalId);
    console.log('[Debug] Адрес кошелька:', address.value);
    
    await voteForProposalAPI(dleAddress.value, proposalId, true); // Подпись = голос "за"
    
    await loadDleData();
    alert('✅ Предложение подписано!');
    
  } catch (error) {
    console.error('Ошибка при подписании:', error);
    
    if (error.message.includes('Already voted')) {
      alert('⚠️ Ошибка: Вы уже голосовали за это предложение!\n\nВаш адрес: ' + address.value + '\n\nВозможные причины:\n• Вы уже голосовали с этим кошельком\n• Вы голосовали с другим кошельком ранее\n\nКаждый адрес может голосовать только один раз за предложение.');
    } else {
      alert('❌ Ошибка при подписании: ' + error.message);
    }
  }
}

// Отмена подписи (голос "против")
async function cancelSignatureLocal(proposalId) {
  // Проверка прав админа для голосования
  if (!props.isAuthenticated) {
    alert('❌ Для участия в голосовании необходимо авторизоваться в приложении');
    return;
  }
  
  // Дополнительная проверка на права админа
  if (!hasAdminRights()) {
    alert('❌ Для участия в голосовании необходимы права администратора');
    return;
  }

  try {
    console.log('[Debug] Попытка голосования "против" для предложения:', proposalId);
    console.log('[Debug] Адрес кошелька:', address.value);
    
    await voteForProposalAPI(dleAddress.value, proposalId, false); // Голос "против"
    
    await loadDleData();
    alert('✅ Ваш голос "против" учтен!');
    
  } catch (error) {
    console.error('Ошибка при голосовании "против":', error);
    
    if (error.message.includes('Already voted')) {
      alert('⚠️ Ошибка: Вы уже голосовали за это предложение!\n\nВаш адрес: ' + address.value + '\n\nВозможные причины:\n• Вы уже голосовали с этим кошельком\n• Вы голосовали с другим кошельком ранее\n\nКаждый адрес может голосовать только один раз за предложение.');
    } else {
      alert('❌ Ошибка при голосовании "против": ' + error.message);
    }
  }
}

// Исполнение предложения
async function executeProposalLocal(proposalId) {
  // Проверка прав админа для исполнения
  if (!props.isAuthenticated) {
    alert('❌ Для исполнения предложений необходимо авторизоваться в приложении');
    return;
  }
  
  // Дополнительная проверка на права админа
  if (!hasAdminRights()) {
    alert('❌ Для исполнения предложений необходимы права администратора');
    return;
  }

  try {
    await executeProposalAPI(dleAddress.value, proposalId);
    
    await loadDleData();
    alert('✅ Предложение успешно исполнено!');
    
  } catch (error) {
    console.error('Ошибка при исполнении предложения:', error);
    alert('❌ Ошибка при исполнении предложения: ' + error.message);
  }
}



function resetForm() {
  newProposal.value = {
    description: '',
    duration: 7,
    governanceChainId: null,
    operationType: '',
    operationParams: {
      to: '',
      from: '',
      amount: 0,
      customData: ''
    }
  };
}

// Проверка прав администратора
function hasAdminRights() {
  console.log('[hasAdminRights] Проверка прав администратора');
  
  // Используем данные из useAuthContext напрямую
const isAuth = isAuthenticated.value;
const tokenBalancesData = tokenBalances.value;
  
  console.log('[hasAdminRights] isAuthenticated:', isAuth);
  console.log('[hasAdminRights] tokenBalances:', tokenBalancesData);
  
  // Базовая проверка - пользователь должен быть авторизован
  if (!isAuth) {
    console.log('[hasAdminRights] Пользователь не авторизован');
    return false;
  }
  
    // Проверяем, есть ли у пользователя админ токены
  if (tokenBalancesData && Array.isArray(tokenBalancesData)) {
    const balances = tokenBalancesData;
    console.log('[hasAdminRights] Балансы токенов:', balances);
    
    // Проверяем, есть ли хотя бы один токен с достаточным балансом
    for (const balance of balances) {
      console.log('[hasAdminRights] Проверяем баланс:', balance);
      // Проверяем баланс напрямую, так как структура данных может отличаться
      const balanceValue = parseFloat(balance.balance || '0');
      const minBalance = parseFloat(balance.minBalance || '0');
      
      if (balanceValue >= minBalance) {
        console.log('[hasAdminRights] Найден токен с достаточным балансом:', balance);
        return true;
      }
    }
  }
  
  console.log('[hasAdminRights] Нет админ токенов, доступ запрещен');
  // Если нет админ токенов, возвращаем false
  return false;
}



// Отслеживаем изменения в адресе DLE
watch(dleAddress, (newAddress) => {
  if (newAddress) {
    loadDleData();
  }
}, { immediate: true });

onMounted(async () => {
  // Принудительно загружаем токены, если пользователь аутентифицирован
  if (isAuthenticated.value && address.value) {
    console.log('[DleProposalsView] Принудительная загрузка токенов для адреса:', address.value);
    await checkTokenBalances(address.value);
  }
  
  // Загрузка данных DLE
  if (dleAddress.value) {
    loadDleData();
  }
  
  // Подписываемся на WebSocket обновления
  wsClient.on('proposal_created', (data) => {
    console.log('[WebSocket] Получено уведомление о новом предложении:', data);
    if (data.dleAddress === dleAddress.value) {
      loadDleData(); // Обновляем список предложений
    }
  });
  
  wsClient.on('proposal_voted', (data) => {
    console.log('[WebSocket] Получено уведомление о подписи:', data);
    if (data.dleAddress === dleAddress.value) {
      loadDleData(); // Обновляем список предложений
    }
  });
  
  wsClient.on('proposal_executed', (data) => {
    console.log('[WebSocket] Получено уведомление об исполнении:', data);
    if (data.dleAddress === dleAddress.value) {
      loadDleData(); // Обновляем список предложений
    }
  });
});

onUnmounted(() => {
  // Отписываемся от WebSocket обновлений
  wsClient.off('proposal_created');
  wsClient.off('proposal_voted');
  wsClient.off('proposal_executed');
});
</script>

<style scoped>
.dle-proposals-management {
  padding: 1rem;
}

.proposals-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
}

.header-info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.header-info h3 {
  margin: 0;
  color: var(--color-primary);
}

.dle-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.dle-name {
  font-weight: 600;
  color: #333;
  font-size: 1rem;
}

.dle-address {
  font-family: monospace;
  font-size: 0.875rem;
  color: #666;
  background: #f8f9fa;
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  display: inline-block;
  width: fit-content;
}

.loading-info,
.no-dle-info {
  font-size: 0.875rem;
  color: #666;
  font-style: italic;
}

.create-proposal-form {
  background: #f8f9fa;
  border-radius: 8px;
  padding: 1.5rem;
  margin-top: 2rem;
  border-top: 2px solid #e9ecef;
}

.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;
}

.chains-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1rem;
}

.chain-option {
  border: 2px solid #e9ecef;
  border-radius: 8px;
  padding: 1rem;
  cursor: pointer;
  transition: all 0.3s ease;
}

.chain-option:hover {
  border-color: #007bff;
}

.chain-option.selected {
  border-color: #007bff;
  background: #f8f9ff;
}

.chain-info h6 {
  margin: 0 0 0.5rem 0;
  color: #333;
}

.chain-id {
  font-size: 0.9rem;
  color: #666;
}

.chain-description {
  font-size: 0.9rem;
  color: #888;
  margin: 0.5rem 0 0 0;
}

.chain-status {
  text-align: right;
  color: #007bff;
}

.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;
}

.proposals-list {
  margin-top: 2rem;
}

.list-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.list-filters {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.proposals-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
}

.proposal-card {
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: 1rem;
  background: #fff;
}

.proposal-card.active {
  border-color: #28a745;
}

.proposal-card.succeeded {
  border-color: #007bff;
}

.proposal-card.defeated {
  border-color: #dc3545;
}

.auth-notice {
  text-align: center;
  padding: 1rem;
  background-color: #f8f9fa;
  border-radius: 4px;
  margin-top: 1rem;
}

.auth-notice-form {
  margin-bottom: 1rem;
}

.auth-notice-form .alert {
  margin-bottom: 0;
}

.proposal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.proposal-header h5 {
  margin: 0;
  color: #333;
}

.proposal-status {
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-size: 0.8rem;
  font-weight: 600;
}

.proposal-status.active {
  background: #d4edda;
  color: #155724;
}

.proposal-status.succeeded {
  background: #d1ecf1;
  color: #0c5460;
}

.proposal-status.defeated {
  background: #f8d7da;
  color: #721c24;
}

.proposal-details {
  margin-bottom: 1rem;
}

.detail-item {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

.votes-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.votes-info {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.votes-info .for {
  color: #28a745;
  font-weight: 500;
}

.votes-info .against {
  color: #dc3545;
  font-weight: 500;
}

.quorum-info {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.quorum-info .quorum-percentage {
  color: #666;
  font-size: 0.9em;
}

.quorum-progress {
  width: 100%;
}

.progress-bar {
  width: 100%;
  height: 8px;
  background-color: #e9ecef;
  border-radius: 4px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #28a745, #20c997);
  transition: width 0.3s ease;
}



.proposal-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.no-proposals {
  text-align: center;
  padding: 2rem;
  color: #666;
}

.form-help {
  font-size: 0.9rem;
  color: #666;
  margin-bottom: 1rem;
}

/* Стили для валидации */
.form-control.is-invalid {
  border-color: #dc3545;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.form-text {
  font-size: 0.875rem;
  color: #6c757d;
  margin-top: 0.25rem;
}

.form-control {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 1rem;
}

.operation {
  font-family: monospace;
  font-size: 0.9em;
  color: #666;
}

.operation-details {
  font-size: 0.9em;
  color: #28a745;
  font-weight: 500;
}
</style> 