refactor: 231025/delete_unneccesary_element

This commit is contained in:
NguyenAnhQuan 2025-10-23 15:30:00 +07:00
parent e24832fa1a
commit 3040bd5a57
8 changed files with 8 additions and 161 deletions

View File

@ -16,10 +16,6 @@ const copyAddress = () => {
const handleSend = () => { const handleSend = () => {
console.log('Send clicked') console.log('Send clicked')
} }
const handleScanQR = () => {
console.log('Scan QR clicked')
}
</script> </script>
<template> <template>
@ -52,36 +48,11 @@ const handleScanQR = () => {
</svg> </svg>
</div> </div>
</div> </div>
<!-- QR Code Section -->
<div class="qr-section">
<div class="qr-placeholder">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<rect x="0" y="0" width="100" height="100" fill="white" />
<rect x="5" y="5" width="35" height="35" fill="black" />
<rect x="10" y="10" width="25" height="25" fill="white" />
<rect x="15" y="15" width="15" height="15" fill="black" />
<rect x="60" y="5" width="35" height="35" fill="black" />
<rect x="65" y="10" width="25" height="25" fill="white" />
<rect x="70" y="15" width="15" height="15" fill="black" />
<rect x="5" y="60" width="35" height="35" fill="black" />
<rect x="10" y="65" width="25" height="25" fill="white" />
<rect x="15" y="70" width="15" height="15" fill="black" />
<rect x="45" y="45" width="10" height="10" fill="black" />
<rect x="60" y="60" width="10" height="10" fill="black" />
<rect x="70" y="70" width="10" height="10" fill="black" />
</svg>
</div>
</div>
<!-- Action Buttons --> <!-- Action Buttons -->
<div class="action-buttons"> <div class="action-buttons">
<ButtonCommon type="primary" size="large" block @click="handleSend" class="btn-send"> <ButtonCommon type="primary" size="large" block @click="handleSend" class="btn-send">
SEND SEND
</ButtonCommon> </ButtonCommon>
<ButtonCommon type="primary" size="large" block @click="handleScanQR" class="btn-scan">
Scan QR code
</ButtonCommon>
</div> </div>
<!-- Wallet Status --> <!-- Wallet Status -->
@ -179,40 +150,12 @@ const handleScanQR = () => {
} }
} }
} }
.qr-section {
display: flex;
justify-content: center;
margin-bottom: var(--spacing-2xl);
.qr-placeholder {
width: var(--qr-size);
height: var(--qr-size);
background: var(--bg-white);
border: var(--qr-border);
border-radius: var(--qr-radius);
padding: var(--spacing-lg);
box-shadow: var(--qr-shadow);
transition: var(--transition-normal);
&:hover {
transform: scale(1.05);
}
svg {
width: 100%;
height: 100%;
}
}
}
.action-buttons { .action-buttons {
display: flex; display: flex;
gap: var(--spacing-lg); gap: var(--spacing-lg);
margin-bottom: var(--spacing-2xl); margin-bottom: var(--spacing-2xl);
:deep(.btn-send), :deep(.btn-send) {
:deep(.btn-scan) {
letter-spacing: var(--tracking-wide); letter-spacing: var(--tracking-wide);
} }
} }

View File

@ -8,10 +8,6 @@ const authStore = useAuthStore()
const currentState = computed(() => authStore.getCurrentState()) const currentState = computed(() => authStore.getCurrentState())
const handleOnboardingComplete = () => {
authStore.nextStep()
}
const handleGoToCreate = () => { const handleGoToCreate = () => {
authStore.goToCreate() authStore.goToCreate()
} }

View File

@ -2,9 +2,9 @@
import { ref } from 'vue' import { ref } from 'vue'
import { Tabs, Row, Col } from 'ant-design-vue' import { Tabs, Row, Col } from 'ant-design-vue'
import WalletInfo from '@/components/WalletInfo.vue' import WalletInfo from '@/components/WalletInfo.vue'
import { TransactionsTab, WalletTab, NetworkTab, DebugTab } from './components' import { WalletTab, NetworkTab, UTXOTab } from './components'
const activeTab = ref('WALLET') const activeTab = ref('UTXOs')
const network = ref('kaspa-mainnet') const network = ref('kaspa-mainnet')
</script> </script>
@ -19,9 +19,9 @@ const network = ref('kaspa-mainnet')
<!-- Right Column - Tabs Content --> <!-- Right Column - Tabs Content -->
<Col :xs="24" :lg="12"> <Col :xs="24" :lg="12">
<Tabs v-model:activeKey="activeTab" size="large" class="main-tabs"> <Tabs v-model:activeKey="activeTab" size="large" class="main-tabs">
<!-- TRANSACTIONS TAB --> <!-- DEBUG TAB -->
<Tabs.TabPane key="TRANSACTIONS" tab="TRANSACTIONS"> <Tabs.TabPane key="UTXOs" tab="UTXOs">
<TransactionsTab /> <UTXOTab />
</Tabs.TabPane> </Tabs.TabPane>
<!-- WALLET TAB --> <!-- WALLET TAB -->
@ -33,11 +33,6 @@ const network = ref('kaspa-mainnet')
<Tabs.TabPane key="NETWORK" tab="NETWORK"> <Tabs.TabPane key="NETWORK" tab="NETWORK">
<NetworkTab /> <NetworkTab />
</Tabs.TabPane> </Tabs.TabPane>
<!-- DEBUG TAB -->
<Tabs.TabPane key="DEBUG" tab="DEBUG">
<DebugTab />
</Tabs.TabPane>
</Tabs> </Tabs>
</Col> </Col>
</Row> </Row>

View File

@ -17,8 +17,6 @@ const loading = ref(true)
const error = ref('') const error = ref('')
const isConnected = ref(false) const isConnected = ref(false)
// Kaspa RPC Client instance (placeholder)
// You'll need to implement this using kaspa-wasm or kaspa RPC library
let rpcClient: any = null let rpcClient: any = null
let unsubscribe: (() => void) | null = null let unsubscribe: (() => void) | null = null
@ -41,7 +39,6 @@ const initializeKaspaRPC = async () => {
} }
} }
// Simulate RPC connection (mock for development)
const simulateRPCConnection = async (): Promise<void> => { const simulateRPCConnection = async (): Promise<void> => {
return new Promise((resolve) => { return new Promise((resolve) => {
setTimeout(() => { setTimeout(() => {
@ -56,7 +53,6 @@ const simulateRPCConnection = async (): Promise<void> => {
medianTimeUTC: new Date().toISOString().replace('T', ' ').substring(0, 19), medianTimeUTC: new Date().toISOString().replace('T', ' ').substring(0, 19),
} }
// Simulate DAA score increment (real Kaspa ~1 block/sec)
const mockSubscription = setInterval(() => { const mockSubscription = setInterval(() => {
networkStatus.value.daaScore += 1 networkStatus.value.daaScore += 1
networkStatus.value.dagHeader += 1 networkStatus.value.dagHeader += 1
@ -64,7 +60,6 @@ const simulateRPCConnection = async (): Promise<void> => {
updateMedianTime() updateMedianTime()
}, 1000) }, 1000)
// Store cleanup function
unsubscribe = () => clearInterval(mockSubscription) unsubscribe = () => clearInterval(mockSubscription)
resolve() resolve()
@ -72,12 +67,10 @@ const simulateRPCConnection = async (): Promise<void> => {
}) })
} }
// Update median time
const updateMedianTime = () => { const updateMedianTime = () => {
networkStatus.value.medianTimeUTC = new Date().toISOString().replace('T', ' ').substring(0, 19) networkStatus.value.medianTimeUTC = new Date().toISOString().replace('T', ' ').substring(0, 19)
} }
// Use mock data fallback
const useMockData = () => { const useMockData = () => {
networkStatus.value = { networkStatus.value = {
network: 'kaspa-mainnet', network: 'kaspa-mainnet',
@ -90,19 +83,16 @@ const useMockData = () => {
} }
} }
// Retry connection
const retryConnection = () => { const retryConnection = () => {
initializeKaspaRPC() initializeKaspaRPC()
} }
// Cleanup on unmount
const cleanup = () => { const cleanup = () => {
if (unsubscribe) { if (unsubscribe) {
unsubscribe() unsubscribe()
unsubscribe = null unsubscribe = null
} }
if (rpcClient) { if (rpcClient) {
// TODO: Disconnect RPC client
rpcClient.disconnect() rpcClient.disconnect()
rpcClient = null rpcClient = null
} }

View File

@ -1,41 +0,0 @@
<script setup lang="ts">
// Component for Transactions Tab
</script>
<template>
<div class="content-card">
<div class="tab-content-header">
<h2>Transaction History</h2>
</div>
<div class="empty-state">
<p>No transactions yet</p>
</div>
</div>
</template>
<style lang="scss" scoped>
.content-card {
@include card-base;
}
.tab-content-header {
text-align: center;
margin-bottom: var(--spacing-2xl);
padding-bottom: var(--spacing-lg);
border-bottom: 2px solid var(--border-color);
h2 {
font-size: 1.3rem;
font-weight: var(--font-bold);
color: var(--text-primary);
margin: 0;
}
}
.empty-state {
text-align: center;
padding: var(--spacing-4xl) var(--spacing-lg);
color: var(--text-muted);
font-size: var(--font-lg);
}
</style>

View File

@ -1,22 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue' import { ref } from 'vue'
import { EditOutlined } from '@ant-design/icons-vue' import { EditOutlined } from '@ant-design/icons-vue'
import ButtonCommon from '@/components/common/ButtonCommon.vue'
const inUseUtxosCount = ref(0) const inUseUtxosCount = ref(0)
const inUseUtxosAmount = ref(0) const inUseUtxosAmount = ref(0)
const handleShowUTXOs = () => {
console.log('Show UTXOs')
}
const handleForceTransactionUpdate = () => {
console.log('Force transaction times update')
}
const handleScanMoreAddresses = () => {
console.log('Scan More Addresses')
}
</script> </script>
<template> <template>
@ -32,17 +20,7 @@ const handleScanMoreAddresses = () => {
</div> </div>
</div> </div>
<div class="debug-actions"> <div class="list-pagination"></div>
<ButtonCommon type="primary" size="large" block @click="handleShowUTXOs">
Show UTXOs
</ButtonCommon>
<ButtonCommon type="primary" size="large" block @click="handleForceTransactionUpdate">
Force transaction times update
</ButtonCommon>
<ButtonCommon type="primary" size="large" block @click="handleScanMoreAddresses">
Scan More Addresses
</ButtonCommon>
</div>
</div> </div>
</template> </template>
@ -86,11 +64,5 @@ const handleScanMoreAddresses = () => {
} }
} }
} }
.debug-actions {
display: flex;
flex-direction: column;
gap: var(--spacing-lg);
}
} }
</style> </style>

View File

@ -18,10 +18,6 @@ const handleBackupFile = () => {
const handleBackupSeed = () => { const handleBackupSeed = () => {
console.log('Backup Seed') console.log('Backup Seed')
} }
const handleRecoverFromSeed = () => {
console.log('Recover From Seed')
}
</script> </script>
<template> <template>
@ -44,9 +40,6 @@ const handleRecoverFromSeed = () => {
<ButtonCommon type="primary" size="large" block @click="handleBackupSeed"> <ButtonCommon type="primary" size="large" block @click="handleBackupSeed">
Backup Seed Backup Seed
</ButtonCommon> </ButtonCommon>
<ButtonCommon type="primary" size="large" block @click="handleRecoverFromSeed">
Recover From Seed
</ButtonCommon>
</div> </div>
<Divider /> <Divider />

View File

@ -1,4 +1,3 @@
export { default as TransactionsTab } from './TransactionsTab.vue'
export { default as WalletTab } from './WalletTab.vue' export { default as WalletTab } from './WalletTab.vue'
export { default as NetworkTab } from './NetworkTab.vue' export { default as NetworkTab } from './NetworkTab.vue'
export { default as DebugTab } from './DebugTab.vue' export { default as UTXOTab } from './UTXOTab.vue'