新增:合并订单
This commit is contained in:
parent
b2ac4ec9f3
commit
acc7d485e1
@ -22,7 +22,7 @@
|
||||
<v-list-item-title>Limit</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-divider></v-divider>
|
||||
<v-list-item>
|
||||
<v-list-item @click="openMergeDialog">
|
||||
<v-list-item-title>Merge</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-list-item>
|
||||
@ -294,7 +294,7 @@
|
||||
<v-list-item @click="limitType = 'Market'"><v-list-item-title>Market</v-list-item-title></v-list-item>
|
||||
<v-list-item @click="limitType = 'Limit'"><v-list-item-title>Limit</v-list-item-title></v-list-item>
|
||||
<v-divider></v-divider>
|
||||
<v-list-item><v-list-item-title>Merge</v-list-item-title></v-list-item>
|
||||
<v-list-item @click="openMergeDialog"><v-list-item-title>Merge</v-list-item-title></v-list-item>
|
||||
<v-list-item><v-list-item-title>Split</v-list-item-title></v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
@ -444,7 +444,7 @@
|
||||
<v-list-item @click="limitType = 'Market'"><v-list-item-title>Market</v-list-item-title></v-list-item>
|
||||
<v-list-item @click="limitType = 'Limit'"><v-list-item-title>Limit</v-list-item-title></v-list-item>
|
||||
<v-divider></v-divider>
|
||||
<v-list-item><v-list-item-title>Merge</v-list-item-title></v-list-item>
|
||||
<v-list-item @click="openMergeDialog"><v-list-item-title>Merge</v-list-item-title></v-list-item>
|
||||
<v-list-item><v-list-item-title>Split</v-list-item-title></v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
@ -549,6 +549,44 @@
|
||||
</v-sheet>
|
||||
</v-bottom-sheet>
|
||||
</template>
|
||||
|
||||
<!-- Merge shares dialog(与桌面/移动端分支并列,始终挂载才能响应 openMergeDialog) -->
|
||||
<v-dialog v-model="mergeDialogOpen" max-width="440" persistent content-class="merge-dialog" transition="dialog-transition">
|
||||
<v-card class="merge-dialog-card" rounded="lg">
|
||||
<div class="merge-dialog-header">
|
||||
<h3 class="merge-dialog-title">Merge shares</h3>
|
||||
<v-btn icon variant="text" size="small" class="merge-dialog-close" @click="mergeDialogOpen = false">
|
||||
<v-icon>mdi-close</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
<v-card-text class="merge-dialog-body">
|
||||
<p class="merge-dialog-desc">
|
||||
Merge a share of Yes and No to get 1 USDC. You can do this to save cost when trying to get rid of a position.
|
||||
</p>
|
||||
<div class="merge-amount-row">
|
||||
<label class="merge-amount-label">Amount</label>
|
||||
<v-text-field
|
||||
v-model.number="mergeAmount"
|
||||
type="number"
|
||||
min="0"
|
||||
hide-details
|
||||
density="compact"
|
||||
variant="outlined"
|
||||
class="merge-amount-input"
|
||||
/>
|
||||
</div>
|
||||
<p class="merge-available">
|
||||
Available shares: {{ availableMergeShares }}
|
||||
<button type="button" class="merge-max-link" @click="setMergeMax">Max</button>
|
||||
</p>
|
||||
</v-card-text>
|
||||
<v-card-actions class="merge-dialog-actions">
|
||||
<v-btn color="primary" variant="flat" block class="merge-submit-btn" @click="submitMerge">
|
||||
Merge Shares
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -565,6 +603,21 @@ const props = withDefaults(
|
||||
// 移动端:底部栏与弹出层
|
||||
const sheetOpen = ref(false)
|
||||
|
||||
// Merge shares dialog
|
||||
const mergeDialogOpen = ref(false)
|
||||
const mergeAmount = ref(0)
|
||||
const availableMergeShares = ref(0)
|
||||
function openMergeDialog() {
|
||||
mergeAmount.value = 0
|
||||
mergeDialogOpen.value = true
|
||||
}
|
||||
function setMergeMax() {
|
||||
mergeAmount.value = availableMergeShares.value
|
||||
}
|
||||
function submitMerge() {
|
||||
mergeDialogOpen.value = false
|
||||
}
|
||||
|
||||
const yesPriceCents = computed(() => 19)
|
||||
const noPriceCents = computed(() => 82)
|
||||
|
||||
@ -1137,4 +1190,92 @@ function submitOrder() {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Merge shares dialog */
|
||||
.merge-dialog-card {
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.merge-dialog-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20px 20px 0;
|
||||
}
|
||||
|
||||
.merge-dialog-title {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #111827;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.merge-dialog-close {
|
||||
color: #6b7280;
|
||||
}
|
||||
|
||||
.merge-dialog-body {
|
||||
padding: 16px 20px 8px;
|
||||
}
|
||||
|
||||
.merge-dialog-desc {
|
||||
font-size: 14px;
|
||||
color: #374151;
|
||||
line-height: 1.5;
|
||||
margin: 0 0 20px;
|
||||
}
|
||||
|
||||
.merge-amount-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.merge-amount-label {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #111827;
|
||||
min-width: 60px;
|
||||
}
|
||||
|
||||
.merge-amount-input {
|
||||
flex: 1;
|
||||
max-width: 160px;
|
||||
}
|
||||
|
||||
.merge-amount-input :deep(.v-field) {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.merge-available {
|
||||
font-size: 13px;
|
||||
color: #6b7280;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.merge-max-link {
|
||||
color: #2563eb;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
margin-left: 4px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.merge-max-link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.merge-dialog-actions {
|
||||
padding: 16px 20px 20px;
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.merge-submit-btn {
|
||||
text-transform: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user