前端信息更完善

src/components/History.vue

@@ -129,25 +129,25 @@
         <template v-slot:item.from="{ item }">
           <v-chip
               label
+              color="green lighten-3" target="_blank"
               @click="jump(item.from)"
-              target="_blank"
           >
             {{ getSimpleStr3(item.from) }}
           </v-chip>
         </template>
         <!-- to -->
         <template v-slot:item.to="{ item }">
-          <div
+          <v-chip label
+              color="indigo lighten-4"
               @click="jump(item.to)"
               v-if="!item.toName"
           >
-            <a href="#">{{ getSimpleStr3(item.to) }}</a>
-          </div>
+            {{ getSimpleStr3(item.to) }}
+          </v-chip>
           <v-chip
               label
-              color="primary"
+              color="indigo lighten-4"
               @click="jump(item.to)"
-              target="_blank"
               v-else
           >
             {{ item.toName }}
@@ -199,19 +199,66 @@
             <v-container>
               <div v-for="trade in item.tradeInfo">
                 <v-row>
-                  <v-chip class="ma-2 tradeLabel" label>
-                    {{ trade.amount }}
-                  </v-chip>
-                  <v-chip  class="ma-2" label @click="jump(trade.token, 'token')" v-if="!trade.tokenName && trade.token !== '0xeth'">
-                    {{ getSimpleStr3(trade.token) }}
+                  <!--token symbol-->
+                  <v-chip label
+                          class="ma-2 tradeLabel"
+                          @click="jump(trade.token, 'token')"
+                          v-if="!trade.tokenSymbol && trade.token !== '0xeth'">
+                    {{ myKit._N(trade.amount, 6) }}个{{ getSimpleStr3(trade.token) }}
                   </v-chip>
-                  <v-chip color="primary" class="ma-2" label @click="jump(trade.token, 'token')" v-else>
-                    <div v-if="trade.token === '0xeth'">Ethereum</div>
-                    <div v-else>{{ trade.tokenName }}</div>
+                  <v-chip label
+                          color="blue lighten-4" class="ma-2 tradeLabel"
+                          @click="jump(trade.token, 'token')"
+                          v-else>
+                    {{ myKit._N(trade.amount, 6) }}个{{ trade.tokenSymbol }}
                   </v-chip>
-                  <v-chip dark color="blue-grey" class="ma-2" label @click="jump(trade.from)">{{ getSimpleStr2(trade.from) }}</v-chip>
+                  <!--from-->
+                  <div>
+                    <v-chip label
+                            class="ma-2" color="green lighten-3"
+                            @click="jump(trade.from)"
+                            v-if="trade.from === item.from">
+                      {{ getSimpleStr3(trade.from) }}
+                    </v-chip>
+                    <v-chip label
+                            class="ma-2" color="indigo lighten-4"
+                            @click="jump(trade.from)"
+                            v-else-if="trade.from === item.to">
+                      <div v-if="!trade.fromName">{{ getSimpleStr3(trade.from) }}</div>
+                      <div v-else>{{ trade.fromName }}</div>
+                    </v-chip>
+                    <v-chip label
+                            class="ma-2"
+                            @click="jump(trade.from)"
+                            v-else>
+                      <div v-if="!trade.fromName">{{ getSimpleStr3(trade.from) }}</div>
+                      <div v-else>{{ trade.fromName }}</div>
+                    </v-chip>
+                  </div>
                   <v-icon>mdi-arrow-expand-right</v-icon>
-                  <v-chip dark color="teal" class="ma-2" label @click="jump(trade.to)">{{ getSimpleStr2(trade.to) }}</v-chip>
+                  <!--to-->
+                  <div>
+                    <v-chip label
+                            class="ma-2" color="green lighten-3"
+                            @click="jump(trade.to)"
+                            v-if="trade.to === item.from">
+                      {{ getSimpleStr3(trade.to) }}
+                    </v-chip>
+                    <v-chip label
+                            class="ma-2" color="indigo lighten-4"
+                            @click="jump(trade.to)"
+                            v-else-if="trade.to === item.to">
+                      <div v-if="!trade.toName">{{ getSimpleStr3(trade.to) }}</div>
+                      <div v-else>{{ trade.toName }}</div>
+                    </v-chip>
+                    <v-chip label
+                            class="ma-2"
+                            @click="jump(trade.to)"
+                            v-else>
+                      <div v-if="!trade.toName">{{ getSimpleStr3(trade.to) }}</div>
+                      <div v-else>{{ trade.toName }}</div>
+                    </v-chip>
+                  </div>
                 </v-row>
                 <v-row>
                   <v-divider></v-divider>
@@ -296,7 +343,6 @@
       getSimpleStr3 (str) {
         if (str && str.indexOf('x') !== -1 && str.length > 15) {
           return str.substr(0, 4)
-              + '..'
               + str.substr(str.length - 2, 2)
         } else {
           return str
@@ -382,6 +428,7 @@
     },
 
     data: () => ({
+      myKit: MyKit,
       query: {
         block: '',
         hash: '',
@@ -423,7 +470,7 @@
   max-width: none;
 }
 .tradeLabel {
-  width: 180px;
+  width: 250px;
 }
 thead.v-data-table-header {
   position: fixed !important;