97 lines
2.6 KiB
Vue
97 lines
2.6 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { ref } from 'vue'
|
||
|
|
import { EditOutlined } from '@ant-design/icons-vue'
|
||
|
|
import ButtonCommon from '@/components/common/ButtonCommon.vue'
|
||
|
|
|
||
|
|
const inUseUtxosCount = 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>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="content-card debug-card">
|
||
|
|
<div class="debug-header">
|
||
|
|
<h3 class="debug-title">
|
||
|
|
IN USE UTXOS
|
||
|
|
<EditOutlined style="margin-left: 8px; font-size: 16px" />
|
||
|
|
</h3>
|
||
|
|
<div class="debug-info">
|
||
|
|
<p><strong>COUNT</strong> {{ inUseUtxosCount }}</p>
|
||
|
|
<p><strong>AMOUNT</strong> {{ inUseUtxosAmount }} KAS</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="debug-actions">
|
||
|
|
<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>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.content-card {
|
||
|
|
@include card-base;
|
||
|
|
}
|
||
|
|
|
||
|
|
.debug-card {
|
||
|
|
.debug-header {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: var(--spacing-2xl);
|
||
|
|
padding-bottom: var(--spacing-xl);
|
||
|
|
border-bottom: 2px solid var(--border-color);
|
||
|
|
|
||
|
|
.debug-title {
|
||
|
|
font-size: var(--font-2xl);
|
||
|
|
font-weight: var(--font-bold);
|
||
|
|
color: var(--text-primary);
|
||
|
|
margin-bottom: var(--spacing-lg);
|
||
|
|
letter-spacing: var(--tracking-wide);
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.debug-info {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
gap: var(--spacing-sm);
|
||
|
|
|
||
|
|
p {
|
||
|
|
margin: 0;
|
||
|
|
font-size: var(--font-lg);
|
||
|
|
color: var(--text-secondary);
|
||
|
|
|
||
|
|
strong {
|
||
|
|
font-weight: var(--font-semibold);
|
||
|
|
margin-right: var(--spacing-sm);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.debug-actions {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
gap: var(--spacing-lg);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|