Skip to content

Commit

Permalink
Attach TicketTab to btn in operations
Browse files Browse the repository at this point in the history
  • Loading branch information
GusevPM committed Aug 24, 2023
1 parent beefde9 commit 2d1377a
Show file tree
Hide file tree
Showing 4 changed files with 166 additions and 105 deletions.
13 changes: 13 additions & 0 deletions src/api/bcd.js
Original file line number Diff line number Diff line change
Expand Up @@ -763,4 +763,17 @@ export class BetterCallApi {
return this.api.get(`/contract/${network}/${address}/ticket_updates`, {params})
.then(this.returnResponseData);
}

getTickectUpdatesByOperation(network, operationId) {
return getCancellable(this.api, `/operation/${network}/${operationId}/ticket_updates`, {})
.then((res) => {
if (!res) {
return null;
}
if (res.status !== 200) {
throw new RequestFailedError(res);
}
return res.data
})
}
}
20 changes: 19 additions & 1 deletion src/components/InternalOperation.vue
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,7 @@
text
class="mr-7 text--secondary"
small
@click="openTicketCard"
v-if="data.ticket_updates_count > 0"
>
<v-badge
Expand All @@ -106,6 +107,17 @@
<v-icon>mdi-ticket-confirmation</v-icon>
</v-badge>
</v-btn>
<v-dialog v-model="showTicketUpdates" width="auto" @keydown.esc="showTicketUpdates = false">
<v-card class="bcd-table">
<v-card-title class="py-3 px-7">Ticket updates</v-card-title>
<v-card-text class="pa-0">
<TicketTab
:network="data.network"
:operationId="data.id"
/>
</v-card-text>
</v-card>
</v-dialog>
</v-col>
<v-col
cols="1"
Expand Down Expand Up @@ -254,6 +266,7 @@ import OperationAlert from "@/components/OperationAlert.vue";
import AccountBox from "@/components/Dialogs/AccountBox.vue";
import RawJsonViewer from "@/components/Dialogs/RawJsonViewer.vue";
import MiguelTreeView from "@/components/MiguelTreeView.vue";
import TicketTab from "../views/contract/TicketTab/TicketTab.vue";
export default {
props: {
Expand All @@ -268,10 +281,12 @@ export default {
OperationAlert,
AccountBox,
MiguelTreeView,
TicketTab,
},
data: () => ({
showRaw: false,
showParams: false,
showTicketUpdates: false,
expanded: false,
loadingDiffs: false,
diffs: null
Expand Down Expand Up @@ -446,7 +461,10 @@ export default {
finally(() => {
this.loadingDiffs = false;
})
}
},
openTicketCard() {
this.showTicketUpdates = true;
},
},
watch: {
showParams(newValue) {
Expand Down
236 changes: 133 additions & 103 deletions src/views/contract/TicketTab/TicketTab.vue
Original file line number Diff line number Diff line change
@@ -1,101 +1,101 @@
<template>
<v-container class="canvas fill-canvas pa-8 ma-0" fluid>
<v-row class="px-8 pt-4">
<v-col cols="3" class="pl-4">
<v-list-item-group v-model="selected" class="pt-0 pb-0 themed-border radius-1" mandatory>
<template v-for="(update, idx) in updates">
<v-list-item :key="idx">
<v-list-item-content>
<v-list-item-title>
<Shortcut :str="update.address"/>&nbsp;
<span class="text--secondary">with amount</span>&nbsp;
<span class="text--primary">{{ update.amount }}</span>
</v-list-item-title>
<v-list-item-subtitle class="text--secondary">{{ update.timestamp | fromNow }}</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-divider v-if="idx !== updates.length -1" :key="'d' + idx"></v-divider>
</template>
</v-list-item-group>
</v-col>
<v-col cols="9" class="pr-4">
<v-card class="sticky-card" flat outlined width="95%" v-if="item">
<v-card-text class="data pa-0 pb-0">
<v-list class="py-0">
<v-list-item two-line :to="`/${network}/${item.ticketer}`" exact>
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-ticket-confirmation</v-icon>
</v-list-item-avatar>
<v-container class="canvas fill-canvas pa-8 ma-0" fluid>
<v-row>
<v-col :cols="cols[0]">
<v-list-item-group v-model="selected" class="pt-0 pb-0 themed-border radius-1" mandatory>
<template v-for="(update, idx) in updates">
<v-list-item :key="idx">
<v-list-item-content>
<v-list-item-title>Ticketer</v-list-item-title>
<v-list-item-subtitle class="hash">
{{ item.ticketer }}
</v-list-item-subtitle>
<v-list-item-title>
<Shortcut :str="update.address"/>&nbsp;
<span class="text--secondary">with amount</span>&nbsp;
<span class="text--primary">{{ update.amount }}</span>
</v-list-item-title>
<v-list-item-subtitle class="text--secondary">{{ update.timestamp | fromNow }}</v-list-item-subtitle>
</v-list-item-content>
<v-list-item-action class="justify-end">
<v-list-item-action-text class="caption">{{ item.timestamp | formatShortTime}}</v-list-item-action-text>
<v-list-item-action-text class="caption">Block {{ item.level }}</v-list-item-action-text>
</v-list-item-action>
</v-list-item>
<v-list-item two-line exact :to="`/${network}/${item.address}`">
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-wallet-outline</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Account</v-list-item-title>
<v-list-item-subtitle class="hash">
{{ item.address }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item two-line>
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-circle-multiple-outline</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Amount</v-list-item-title>
<v-list-item-subtitle class="hash">
{{ item.amount }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item two-line exact :to="`/${network}/opg/${item.operation_hash}`">
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-swap-horizontal</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Operation Hash</v-list-item-title>
<v-list-item-subtitle>
{{ item.operation_hash }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-list>
<v-divider></v-divider>
<v-row no-gutters>
<v-col cols="6">
<TypeDef
:typedef="item.content_type"
first="ticket type"
class="pt-6 px-6 pb-5"
style="opacity: 0.8"
/>
</v-col>
<v-divider cols="1" vertical></v-divider>
<v-col cols="5">
<MiguelTreeView
class="pt-6 pb-5"
:address="address"
:miguel="item.content"
:network="network"
openAll />
</v-col>
</v-row>
</v-card-text>
</v-card>
</v-col>
</v-row>
</v-container>
<v-divider v-if="idx !== updates.length -1" :key="'d' + idx"></v-divider>
</template>
</v-list-item-group>
</v-col>
<v-col :cols="cols[1]">
<v-card class="sticky-card" flat outlined width="95%" v-if="item">
<v-card-text class="data pa-0 pb-0">
<v-list class="py-0 bcd-table">
<v-list-item two-line :to="linkToTicketer" exact>
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-ticket-confirmation</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Ticketer</v-list-item-title>
<v-list-item-subtitle class="hash">
{{ item.ticketer }}
</v-list-item-subtitle>
</v-list-item-content>
<v-list-item-action class="justify-end">
<v-list-item-action-text class="caption">{{ item.timestamp | formatShortTime}}</v-list-item-action-text>
<v-list-item-action-text class="caption">Block {{ item.level }}</v-list-item-action-text>
</v-list-item-action>
</v-list-item>
<v-list-item two-line exact :to="`/${network}/${item.address}`">
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-wallet-outline</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Account</v-list-item-title>
<v-list-item-subtitle class="hash">
{{ item.address }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item two-line>
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-circle-multiple-outline</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Amount</v-list-item-title>
<v-list-item-subtitle class="hash">
{{ item.amount }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item two-line exact :to="`/${network}/opg/${item.operation_hash}`">
<v-list-item-avatar>
<v-icon class="text--secondary">mdi-swap-horizontal</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title>Operation Hash</v-list-item-title>
<v-list-item-subtitle>
{{ item.operation_hash }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-list>
<v-divider></v-divider>
<v-row no-gutters>
<v-col cols="6">
<TypeDef
:typedef="item.content_type"
first="ticket type"
class="pt-6 px-6 pb-5"
style="opacity: 0.8"
/>
</v-col>
<v-divider cols="1" vertical></v-divider>
<v-col cols="5">
<MiguelTreeView
class="pt-6 pb-5"
:address="address"
:miguel="item.content"
:network="network"
openAll />
</v-col>
</v-row>
</v-card-text>
</v-card>
</v-col>
</v-row>
</v-container>
</template>

<script>
Expand All @@ -108,24 +108,34 @@ export default {
name: "TicketTab",
props: {
network: String,
address: String
address: String,
operationId: Number,
},
components: {
MiguelTreeView,
TypeDef,
Shortcut
},
data: () => ({
loading: false,
updates: [],
selected: 0,
// Не знаю, делает ли кто-то так ебано, наверное есть способы получше..
cols: [3, 9],
}),
computed: {
item() {
if (!this.updates || this.updates.length === 0) return null;
return this.updates[this.selected];
}
},
linkToTicketer() {
if (this.address !== this.item.ticketer) {
return `/${this.network}/${this.item.ticketer}`;
} else {
return null;
}
},
},
data: () => ({
loading: false,
updates: [],
selected: 0
}),
methods: {
...mapActions(["showError", "hideError"]),
async listTicketUpdates(network, address) {
Expand All @@ -141,11 +151,31 @@ export default {
this.showError(err);
})
.finally(() => {this.loading = false;})
}
},
async getTickectUpdatesByOperation(network, operationId) {
if (this.loading) return;
this.loading = true;
this.api.getTickectUpdatesByOperation(network, operationId)
.then(result => {
this.updates.push(...result);
})
.catch(err => {
console.log(err);
this.showError(err);
})
.finally(() => {this.loading = false;})
},
},
mounted () {
this.listTicketUpdates(this.network, this.address)
if (this.address) {
this.listTicketUpdates(this.network, this.address);
} else if (this.operationId) {
this.cols = [4, 8];
this.getTickectUpdatesByOperation(this.network, this.operationId);
}
},
// Не понял секцию ниже..
watch: {
'address': function(newAddress){
this.updates = [];
Expand Down
2 changes: 1 addition & 1 deletion src/views/contract/TypeDef.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<template>
<div class="d-flex flex-column parameters">
<div v-for="(def, i) in typedef" :key="i" class="mb-2">
<div v-for="(def, i) in typedef" :key="i" :class="typedef.length > 1 ? 'mb-2' : 'mb-0'">
<span v-if="i === 0" class="font-weight-light">{{ first ? first + '&nbsp;' : '' }}</span>
<span v-else-if="def.name" class="font-weight-light">{{ def.name }}&nbsp;</span>
<span class="tree--text" v-html="highlightType(def.type)"></span>
Expand Down

0 comments on commit 2d1377a

Please sign in to comment.