add upgrade events

src/libs/fetch.js

@@ -287,11 +287,17 @@ export default class ChainFetch {
     })
   }
 
-  async getGovernanceList(next = '') {
+  /// does NOT return value as expected
+  async getUpgradeCurrentPlan(chain = null) {
+    return this.get('/cosmos/upgrade/v1beta1/current_plan', chain)
+  }
+
+  async getGovernanceList(next = '', chain = null) {
+    const key = next || ''
     const url = this.config.chain_name === 'shentu'
-      ? `/shentu/gov/v1alpha1/proposals?pagination.limit=50&pagination.reverse=true&pagination.key=${next}`
-      : `/cosmos/gov/v1beta1/proposals?pagination.limit=50&pagination.reverse=true&pagination.key=${next}`
-    return this.get(url).then(data => {
+      ? `/shentu/gov/v1alpha1/proposals?pagination.limit=50&pagination.reverse=true&pagination.key=${key}`
+      : `/cosmos/gov/v1beta1/proposals?pagination.limit=50&pagination.reverse=true&pagination.key=${key}`
+    return this.get(url, chain).then(data => {
       // const pool = new StakingPool().init(commonProcess(data[1]))
       let proposals = commonProcess(data)
       if (Array.isArray(proposals.proposals)) {

src/views/Governance.vue

@@ -232,7 +232,7 @@ export default {
       proposals: [],
       max: 1,
       operationModalType: '',
-      next: null,
+      next: '',
     }
   },
   mounted() {

src/views/WalletUpgradeEvents.vue

@@ -1,8 +1,135 @@
 <template>
-  <div>xxx</div>
+  <div>
+    <b-row class="match-height">
+      <b-col
+        v-for="(p,i) in list"
+        :key="`${p.id}-${i}`"
+        lg="6"
+        md="12"
+      >
+        <b-card :bg-variant="p.variant">
+          <b-card-title
+            class="mb-0"
+          >
+            <b-avatar
+              :src="p.chain.logo"
+              variant="light-primary"
+              size="22"
+            />
+            <span class="text-uppercase"> {{ p.chain.chain_name }}</span>
+            <br>
+            #{{ p.id }}.
+            <router-link
+              :to="`/${p.chain.chain_name}/gov/${p.id}?from=/wallet/votes`"
+            >
+              {{ p.title }} {{ p.status }}
+            </router-link></b-card-title>
+          <b-card-body md="12">
+            <flip-countdown :deadline="p.countdown" />
+          </b-card-body>
+        </b-card>
+      </b-col>
+    </b-row>
+  </div>
 </template>
-<script>
-export default {
 
+<script>
+import { getLocalAccounts, getLocalChains } from '@/libs/utils'
+import {
+  BRow, BCol, BCard, BCardTitle, BCardBody, BAvatar,
+} from 'bootstrap-vue'
+import FlipCountdown from 'vue2-flip-countdown'
+import dayjs from 'dayjs'
+
+export default {
+  name: 'WalletUpgradeEvents',
+  components: {
+    BAvatar,
+    BRow,
+    BCol,
+    BCard,
+    BCardTitle,
+    BCardBody,
+    FlipCountdown,
+  },
+  props: {
+    content: {
+      type: String,
+      default: () => '',
+    },
+  },
+  data() {
+    return {
+      proposals: [],
+      latest: {},
+    }
+  },
+  computed: {
+    list() {
+      return this.proposals
+        .filter(x => [2, 3].includes(x.status))
+        .map(x => {
+          const x2 = x
+          x2.countdown = this.estmatetime(x.chain.chain_name, x.contents.plan)
+          x2.variant = dayjs().isAfter(dayjs(x2.countdown)) ? 'dark' : ''
+          return x2
+        })
+        .sort((a, b) => dayjs(b.voting_end_time).unix() - dayjs(a.voting_end_time).unix())
+    },
+  },
+  mounted() {
+    const accounts = getLocalAccounts()
+    if (accounts) {
+      const chains = getLocalChains()
+      const toQuery = {}
+
+      Object.keys(accounts).forEach(acc => {
+        accounts[acc].address.forEach(add => {
+          const conf = chains[add.chain]
+          if (conf) {
+            toQuery[add.chain] = conf
+          }
+        })
+      })
+
+      Object.values(toQuery).forEach(item => {
+        this.fetchProposals(item)
+      })
+    }
+  },
+  methods: {
+    estmatetime(chainname, plan) {
+      if (plan.height > 0) {
+        const latest = this.latest[chainname]
+        if (latest) {
+          const gap = plan.height - this.latest[chainname].height
+          if (gap > 0) {
+            return dayjs().add(gap * 6, 'second').format('YYYY-MM-DD hh:mm:ss')
+          }
+        }
+        return '1990-01-01'
+      }
+      return dayjs(plan.time).format('YYYY-MM-DD hh:mm:ss')
+    },
+    fetchProposals(item) {
+      this.$http.getGovernanceList('', item).then(data => {
+        data.proposals.forEach(p => {
+          const type = p.contents['@type']
+          if (type.indexOf('SoftwareUpgradeProposal') > 0) {
+            const p2 = p
+            p2.chain = item
+            if (dayjs(p.voting_end_time).add(15, 'day').isAfter(dayjs())) {
+              this.proposals.push(p2)
+            }
+          }
+        })
+      }, err => {
+        throw new Error(err)
+      })
+      this.$http.getLatestBlock(item).then(b => {
+        this.$set(this.latest, item.chain_name, b.block.header)
+      })
+    },
+  },
 }
 </script>

src/views/WalletVotes.vue

@@ -169,15 +169,7 @@
       title="Upgrade Events"
       lazy
     >
-      <b-alert
-        variant="info"
-        show
-        class="mb-0"
-      >
-        <div class="alert-body">
-          {{ votes }}
-        </div>
-      </b-alert>
+      <wallet-upgrade-events />
     </b-tab>
   </b-tabs>
 </template>
@@ -192,6 +184,7 @@ import {
   getLocalAccounts, getLocalChains, percent, ProposalTally, tokenFormatter,
 } from '@/libs/utils'
 import dayjs from 'dayjs'
+import WalletUpgradeEvents from './WalletUpgradeEvents.vue'
 
 export default {
   components: {
@@ -208,6 +201,7 @@ export default {
     BProgress,
     BProgressBar,
     BTooltip,
+    WalletUpgradeEvents,
   },
   directives: {
     'b-tooltip': VBTooltip,
@@ -229,7 +223,7 @@ export default {
         x2.tally = this.tally[`${x.chain.chain_name}-${x.id}`] || new ProposalTally()
         x2.votes = this.votes.filter(v => v.vote.proposal_id === x.id)
         return x2
-      })
+      }).sort((a, b) => dayjs(b.voting_start_time).unix() - dayjs(a.voting_start_time).unix())
     },
   },
   created() {
@@ -287,18 +281,14 @@ export default {
           })
         })
 
-        let promise = Promise.resolve()
         Object.values(toQuery).forEach(item => {
-          promise = promise.then(() => new Promise(resolve => {
-            this.fetchProposals(item, resolve)
-          }))
+          this.fetchProposals(item)
         })
       }
     },
-    fetchProposals(item, resolve) {
+    fetchProposals(item) {
       if (this.islive) {
         this.$http.getGovernanceListByStatus(2, item.conf).then(data => {
-          resolve()
           data.proposals.forEach(p => {
             const p2 = p
             p2.chain = item.conf