321

src/service/index.ts

-import axios,{ AxiosInstance } from "axios";
+import axios,{AxiosInstance,AxiosResponse} from "axios";
 
-class AppService {
-    // private baseUrl:string
-    private service:AxiosInstance
-    constructor(){
+
+interface Account{
+    address: string
+    privateKey:string
+    publicKey?:string
+}
+type Callback = (data:AxiosResponse<any>)=>any
+
+class ChainService {
+    service:AxiosInstance
+    account:Account
+
+    constructor(url:string,account:Account){
+        this.account = account;
         this.service = axios.create({
-          baseURL:this.getBaseUrl(),
+            baseURL:url,
             timeout: 15000,
+            method:'post'
+        })
+    }
+    /**
+     * 请求区块链RPC接口的基本方法
+     * @param method 区块链请求方法
+     * @param data 请求的数据内容
+     * @param cb 回掉方式获取Response
+     * @returns 
+     */
+    private async chainRequire(method:string,data:any[],cb?:Callback){
+       return await this.service.request({
+            data:{
+                id:1,
+                method:method,
+                params:data
+            }
+        }).then(res=>{
+            if(cb){
+            return cb(res)
+            }
+            return res
+        }).catch((err)=>{
+            if(cb){
+                return cb(err)
+            }
+            return err
         })
+
     }
-    private getBaseUrl(){
-       return  process.env == 'devlelop'?"123":"321"
+
+    /**
+     * 
+     * @param toAddr 要转账的目标地址
+     * @param contractPair 
+     * @returns 
+     */
+    async creatTransition(toAddr:string,amount:number,execer?:string){
+        return await this.chainRequire('Chain33.CreateRawTransaction',[{
+            to:toAddr,
+            amount:amount,
+            fee:0.003*10e8,
+            isWithdraw:false,
+            execer:execer?execer:'coins'
+        }])
+    }
+
+    async signTransition(txHex:string,privateKey:string){
+        return await this.chainRequire('Chain33.SignRawTx',[{
+            privkey:privateKey,
+            txHex:txHex,
+            expire:'1h',
+            fee:0.003*10e8
+        }])
+    }
+
+    async sendTransaction(txHex:string){
+        return await this.chainRequire('Chain33.SendTransaction',[{
+            data:txHex
+        }])
+    }
+
+    async buildGroupTransaction(txHexs:string[]){
+        return await this.chainRequire('Chain33.CreateRawTxGroup',[{
+            txs:txHexs
+        }])
+    }
+
+    async getInfoByHash(hash:string){
+        return await this.chainRequire('Chain33.QueryTransaction',[{
+            "hash":hash
+        }])
     }
 }
\ No newline at end of file

src/views/Home.vue

@@ -5,7 +5,7 @@
           <Banner :showPart='attendShow'></Banner>
       </div>
       <div class="bot w-11.5/12 mt-3  mx-auto" ref="botbox" v-if='!attendShow'>
-          <app-search class=' w-11/12 mx-auto'></app-search>
+          <app-search v-if='showSearch' class=' w-11/12 mx-auto'></app-search>
           <div class='list-contianer border-2 border-app-blue-3 h-auto mx-auto mt-5 relative rounded-xl' ref='borderBox'>
               <div class='img-holder w-full absolute -top-4 '>
                   <div class=' absolute w-full top-2 text-center text-sm '>排行榜</div>
@@ -13,6 +13,7 @@
               </div>
               <div class='list w-11.5/12 mx-auto my-8 pb-12' @scroll="scrollStart" ref='scrollBox'>
                  <app-card2 class="mb-2" v-for="i in [1,2,3,4,5,6,7,8,9,10,11]" :key="i" />
+                 <div class='h-48'></div>
               </div>
           </div>
       </div>
@@ -31,10 +32,11 @@ export default Vue.extend({
     return{
       anima:null as any,
       scrollArr:[] as any[],
-      attendShow: true,
+      attendShow: false,
+      showSearch:false
     }
   },
-  mounted(){
+  async mounted(){
     const {topBox,botBox,borderBox,scrollBox} = this.$refs
      this.anima = new TimelineLite()
     console.log(this.anima);
@@ -42,19 +44,19 @@ export default Vue.extend({
         this.anima.to(borderBox,0,{css:{height:"calc(100vh - 140px)"},ease:Power2.easeInOut})
        this.anima.to(scrollBox,0,{css:{height:"calc(100vh - 160px)"},ease:Power2.easeInOut})
        this.anima.to(topBox,0.6,{css:{height:"0px", visibility:'hidden'},ease:Power2.easeInOut,delay:0.1},'>-0.1')
-    this.anima.pause()
+    await this.anima.pause()
   }, 
   methods:{
     scrollStart(e:any){
       let poisition = e.target.scrollTop
       this.scrollArr.push(poisition)
-      console.log(poisition);
-      
       let l = this.scrollArr.slice(-2)
       if(e.target.scrollTop > 90 && l[0]<l[1]){        
         this.anima.play()
+        this.showSearch = true
       }else if(e.target.scrollTop <= 320 && l[0]>l[1]){
         this.anima.reverse()
+              this.showSearch = false
       } 
     },
     submitForm(){

src/views/Square.vue

@@ -27,7 +27,7 @@
           <app-card class=" mb-2"></app-card>
           <app-card class=" mb-2"></app-card>
           <app-card2></app-card2>
-          <div class="list-mergeup p-18"></div>
+           <div class='h-48'></div>
         </div>
     </div>
   </div>