feat

lxf

2025-04-18 66a33e936d39ec4db7fdffed5d646e044ccc43e9

 src/page/trade/index.vue

@@ -17,14 +17,14 @@
        </div> -->
        <!-- :key="symbol"-->
        <!-- 头部区 -->
        <trade-head :backFunc="() => $router.push('/')" :symbol="symbol" :price="price" :range="range" :isTrade="true"
        <trade-head :backFunc="() => $router.push('/')" :symbol="symbol" :symbolname="symbolname" :price="price" :range="range" :isTrade="true"
            @update-coin="onUpdate" @data="quote = $event" />

        <div class="trade-buy-sell flex justify-between px-30 py-30">
            <trade-order-area :symbol="symbol" :init-open="initOpen" :init-close="initClose" :price="price"
            <trade-order-area :symbol="symbol" :symbolname="symbolname" :init-open="initOpen" :init-close="initClose" :price="price"
                @ordered="onOrdered" />
            <keep-alive>
                <trade-deep-data :selectValue="selectValue" @getList="getList" :showType="showType" :symbol="symbol"
                <trade-deep-data :selectValue="selectValue" :symbolname="symbolname" @getList="getList" :showType="showType" :symbol="symbol"
                    v-if="symbol" :price="price" class="w-290 ml-30" />
            </keep-alive>
        </div>
@@ -52,12 +52,11 @@
                <div class="flex  pl-30">
                    <template>
                        <div class="px-10 py-10 flex items-center text-grey" @click="tabClick('1')"
                            :class="tabType == '1' ? 'active-line' : ''">{{ $t('当前委托') }}<span v-if="tabType == '1'">({{
                                entrustList.length }})</span></div>
                        <div class="px-10  ml-50  py-10 flex  items-center text-grey" @click="tabClick('3')"
                            :class="tabType == '3' ? 'active-line' : ''">{{ $t('历史委托') }}</div>
                        <div class="px-10 py-10 flex items-center  ml-50 text-grey" @click="tabClick('2')"
                            :class="tabType == '2' ? 'active-line' : ''">{{ $t('资产') }}</div>
                            :class="tabType == '1' ? 'active-line' : ''">{{ $t('当前委托') }}<span v-if="tabType == '1'"></span></div>
                        <!-- <div class="px-10  ml-50  py-10 flex  items-center text-grey" @click="tabClick('3')"
                            :class="tabType == '3' ? 'active-line' : ''">{{ $t('历史委托') }}</div> -->
                        <!-- <div class="px-10 py-10 flex items-center  ml-50 text-grey" @click="tabClick('2')"
                            :class="tabType == '2' ? 'active-line' : ''">{{ $t('资产') }}</div> -->
                    </template>
                </div>
                <img src="../../assets/image/public/record.png" alt="record-img" class="w-32 h-35 pr-30 "
@@ -78,11 +77,11 @@
                <ul>
                    <li v-for="item in pairsList" :key="item.symbol" class="flex justify-between py-10">
                        <div class="flex items-center">
                            <img :src="item.symbol ? `${HOST_URL}/symbol/${item.symbol}.png` : require('@/assets/loading-default.png')"
                            <img :src="item.symbol ? `${HOST_URL}/wap/symbol/${item.symbol}.png` : require('@/assets/loading-default.png')"
                                class="w-52 h-52 rounded-full mr-16" />
                            <p class="flex flex-col">
                                <strong class="font-28 textColor mb-6">{{ item.symbol.toUpperCase() }}</strong>
                                <span class="font-20 text-grey">{{ item.full_name }}</span>
                                <strong class="font-28 textColor mb-6">{{ item.full_name }}</strong>
                                <span class="font-20 text-grey">{{ item.symbol.toUpperCase() }}</span>
                            </p>
                        </div>
                        <div class="flex flex-col items-end text-grey">
@@ -100,7 +99,7 @@
                <ul>
                    <li v-for="item in no_zeroList" :key="item.symbol" class="flex justify-between py-10">
                        <div class="flex items-center">
                            <img :src="item.symbol ? `${HOST_URL}/symbol/${item.symbol}.png` : require('@/assets/loading-default.png')"
                            <img :src="item.symbol ? `${HOST_URL}/wap/symbol/${item.symbol}.png` : require('@/assets/loading-default.png')"
                                class="w-52 h-52 rounded-full mr-16" />
                            <p class="flex flex-col">
                                <strong class="font-28 textColor mb-6">{{ item.symbol.toUpperCase() }}</strong>
@@ -122,15 +121,15 @@
            <img src="@/assets/image/assets-center/no-data.png" alt="no-date" class="w-180 h-180" />
            <p class="textColor">{{ $t('暂无数据') }}</p>
        </div>
        <div class="fixed w-full shadow z-10 tabBackground1">
        <!-- <div class="fixed w-full shadow z-10 tabBackground1"> -->
            <div class="flex justify-between px-30 py-10">
                <span class="font-24 textColor2">{{ symbol.toUpperCase() }}/USDT&nbsp;{{ $t('k线图表') }}</span>
                <van-icon class="textColor" @click.stop="showCharts = !showCharts"
                    :name="showCharts ? 'arrow-down' : 'arrow-up'"></van-icon>
                <span class="font-24 textColor2">{{ symbolname }}&nbsp;{{ $t('k线图表') }}</span>
               <!-- <van-icon class="textColor" @click.stop="showCharts = !showCharts"
                    :name="showCharts ? 'arrow-down' : 'arrow-up'"></van-icon> -->
            </div>
            <k-line-charts :update-key="updateKey" :update-data="quote" :symbol="symbol" v-if="symbol && showCharts"
            <k-line-charts :update-key="updateKey" :update-data="quote" :symbol="symbol" 
                :showBottom="false" />
        </div>
        <!-- </div> -->
        <van-action-sheet v-model="isSelectShow" @select="onSelect" :actions="actions" :cancel-text="$t('取消')"
            close-on-click-action @cancel="onCancel" />
    </div>
@@ -177,7 +176,7 @@
        }),
    },
    data() {
        const initArr = []
        var  initArr = []
        for (let i = 0; i < 8; i++) {
            initArr.push({
                volume: '--',
@@ -226,18 +225,21 @@
            showType: 0,
            sortList: [],
            selectValue: 0,
            coinPrice: 0

            coinPrice: 0,
         symbolname:'',
        }
    },
    async created() {
        if (!this.coinList.length) {
            await this.SET_COIN_LIST()
        }
      console.log('this.symbolname',this.$route.query.name);
    },
    methods: {
        ...mapActions('home', [SET_COIN_LIST]),
        onUpdate(symbol) { // 更新
         console.log("symbol123123",symbol);
         this.symbolname = getStorage('symbolname')
            this.symbol = symbol
            this.closeSocket()
            this.init(symbol)
@@ -376,7 +378,11 @@
                })
        },
        goHistory() {
            this.$router.push(`/tradeRecord/${this.symbol}`)
            // this.$router.push(`/tradeRecord/${this.symbol}`)
         this.$router.push({
           path: `/tradeRecord/${this.symbol}`,
           query: { name: this.symbolname }
         });
        },
        //价格类型下拉框切换
        selectBtn() {
@@ -407,23 +413,37 @@
            this.sortList = val.arry
        }
    },
    beforeRouteEnter(to, from, next) {
        let { params: { symbol } } = to
        console.log('to', to)
        let catchTradeSymbol = getStorage('tradeSymbol')
        if (catchTradeSymbol) {
            symbol = catchTradeSymbol
        }
        console.log(catchTradeSymbol)
        if (symbol) {
            next(vm => {
                vm.symbol = symbol
                vm.init(symbol)
            })
        } else {
            next()
        }
    },
beforeRouteEnter(to, from, next) {
         var that = this
         let {
            params: {
               symbol
            },
         } = to;
         // this.symbolname = this.$route.params.name
         let catchTradeSymbol = getStorage("tradeSymbol");
         if (catchTradeSymbol) {
            symbol = catchTradeSymbol;
         }
         if (symbol) {
            // debugger
            // if(that.typeindex==0){
            //    next((vm) => {
            //       vm.symbol = symbol;
            //       vm.inita(symbol);
            //    });
            // }else{
               next((vm) => {
                  vm.symbol = symbol;
                  vm.symbolname = getStorage("symbolname");
                  vm.init(symbol);
               });
            // }
				
         } else {
            next();
         }
      },
    activated() {
        // if (!this.socket) {
        //     this.startQuoteSocket()