| | |
| | | <div class="flex justify-start pt-45 before"> |
| | | <div class="flex items-center "> |
| | | <img src="@/assets/image/icon_back.png" class="w-35 h-35 back" alt="" @click="jump()"> |
| | | <img src="@/assets/theme/dark/image/black-convert.png" alt="convert-img" class="w-35 h-35" @click="onSidebar"> |
| | | <img src="@/assets/theme/dark/image/black-convert.png" alt="convert-img" class="w-35 h-35" |
| | | @click="onSidebar"> |
| | | <div class="flex pl-21 textColor" @click="onSidebar"> |
| | | <div class="font-35">{{ symbolName.toUpperCase() || '--' }}</div> |
| | | <div class="ml-15 font-28">{{ title }}</div> |
| | | </div> |
| | | <div class="pl-10 w-160 font-28" :class="{ 'text-green': range > 0, 'text-red': range <= 0 }">{{ range || '--' }}%</div> |
| | | <div class="pl-10 w-160 font-28" :class="{ 'text-green': range > 0, 'text-red': range <= 0 }">{{ range || |
| | | '--' }}%</div> |
| | | <!-- 右上角小图标 --> |
| | | <img src="@/assets/image/kline.png" class="w-44 h-44 right" alt="" @click="klineJump()"> |
| | | <img src="../../../assets/image/public/record.png" alt="record-img" class="w-64 h-35 pr-30 record-img" |
| | |
| | | {{ $t('永续合约') }}</button> --> |
| | | <!-- <button class="tabBtn w-368 h-74 lh-74 border-none rounded" |
| | | :class="selectIndex == 2 ? 'select-one-active' : 'no-select'" @click="changeTab(2)"> |
| | | {{ queryType == 'cryptos' ? $t('交割合约') : $t('期货交易') }}</button> --> |
| | | {{ queryType == 'cryptos' ? $t('交割合约') : $t('货币交易') }}</button> --> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | <div class="text-right"> |
| | | <div class="textColor font-28">{{ item.close }}</div> |
| | | <div class="mt-10 font-28" :class="item.change_ratio_str > 0 ? 'text-green' : 'text-red'">{{ item.change_ratio_str |
| | | <div class="mt-10 font-28" :class="item.change_ratio_str > 0 ? 'text-green' : 'text-red'">{{ |
| | | item.change_ratio_str |
| | | }}%</div> |
| | | </div> |
| | | </div> |
| | |
| | | path: `/cryptos/perpetualContract/${val[0].symbol}?type=indices&selectIndex=1` |
| | | }, |
| | | { |
| | | name: this.$t('期货交易'), |
| | | name: this.$t('货币交易'), |
| | | icon: new URL('@/assets/image/etfNav/icon03.png', import.meta.url), |
| | | path: `/cryptos/perpetualContract/${val[0].symbol}?type=indices&selectIndex=2` |
| | | }, |
| | |
| | | path: `/cryptos/perpetualContract/GlobalETF500?type=indices&selectIndex=1` |
| | | }, |
| | | { |
| | | name: this.$t('期货交易'), |
| | | name: this.$t('货币交易'), |
| | | icon: new URL('@/assets/image/etfNav/icon03.png', import.meta.url), |
| | | path: `/cryptos/perpetualContract/GlobalETF500?type=indices&selectIndex=2` |
| | | }, |
| | |
| | | path: `/cryptos/perpetualContract/${val[0].symbol}?type=US-stocks&selectIndex=1` |
| | | }, |
| | | { |
| | | name: this.$t('期货交易'), |
| | | name: this.$t('货币交易'), |
| | | icon: new URL('@/assets/image/etfNav/icon03.png', import.meta.url), |
| | | path: `/cryptos/perpetualContract/${val[0].symbol}?type=US-stocks&selectIndex=2` |
| | | }, |
| | |
| | | logIn: "Transaktion nach Anmeldung", |
| | | idBackImg: "Bitte laden Sie Zertifikatsinformationen hoch", |
| | | '生成实时数据失败': "Live-Daten konnten nicht generiert werden", |
| | | '期货交易': "Futures-Handel", |
| | | '货币交易': "Währungshandel", |
| | | '休市': "Markt geschlossen", |
| | | '交易中': "Handel", |
| | | 'Asia/Shanghai': "Peking-Zeit", |
| | |
| | | logIn: "Fai trading dopo aver effettuato l'accesso", |
| | | idBackImg: "Carica le informazioni sul certificato", |
| | | '生成实时数据失败': "Impossibile generare dati in tempo reale", |
| | | '期货交易': "Futures Trading", |
| | | '货币交易': "Trading di valute", |
| | | '休市': "Chiusura del mercato", |
| | | '交易中': "In transito", |
| | | 'Asia/Shanghai': "Ora di Pechino", |
| | |
| | | logIn: "ログインして取引する", |
| | | idBackImg: "証明書情報をアップロードしてください", |
| | | '生成实时数据失败': "ライブデータの生成に失敗しました", |
| | | '期货交易': "先物取引", |
| | | '货币交易': "通貨取引", |
| | | '请输入谷歌验证码': "Google 確認コードを入力してください", |
| | | '休市': "休業", |
| | | '交易中': "取引中", |
| | |
| | | logIn: "登錄後進行交易", |
| | | idBackImg: "請上傳證件信息", |
| | | '生成实时数据失败': "生成實時數據失敗", |
| | | '期货交易': "期貨交易", |
| | | '货币交易': "貨幣交易", |
| | | '请输入谷歌验证码': "請輸入谷歌驗證碼", |
| | | '休市': "休市", |
| | | '交易中': "交易中", |
| | |
| | | logIn: "Log in", |
| | | idBackImg: "Please upload certificate information", |
| | | '生成实时数据失败': "Failed to generate live data", |
| | | '期货交易': "Futures trading", |
| | | '货币交易': "Currency Trading", |
| | | '请输入谷歌验证码': "Please enter the Google verification code", |
| | | '休市': "Closed", |
| | | '交易中': "Trading", |
| | |
| | | logIn: "Trader après la connexion", |
| | | idBackImg: "Veuillez télécharger les informations du certificat", |
| | | '生成实时数据失败': "Échec de la génération de données en direct", |
| | | '期货交易': "Trading de contrats à terme", |
| | | '货币交易': "Transaction de devise", |
| | | '请输入谷歌验证码': "Veuillez saisir le code de vérification Google", |
| | | '休市': "Fermé", |
| | | '交易中': "En cours de transaction", |
| | |
| | | logIn: "무역에 로그인", |
| | | idBackImg: "인증서 정보를 업로드하십시오", |
| | | '生成实时数据失败': "라이브 데이터를 생성하지 못했습니다.", |
| | | '期货交易': "선물 거래", |
| | | '货币交易': "화폐 거래", |
| | | '请输入谷歌验证码': "Google 인증 코드를 입력하세요.", |
| | | '休市': "휴장", |
| | | '交易中': "거래 중", |
| | |
| | | logIn: "ซื้อขายหลังจากเข้าสู่ระบบ", |
| | | idBackImg: "โปรดอัปโหลดข้อมูลใบรับรอง", |
| | | '生成实时数据失败': "สร้างข้อมูลสดไม่สำเร็จ", |
| | | '期货交易': "การซื้อขายสินค้าอนาคต", |
| | | '货币交易': "การซื้อขายสกุลเงิน", |
| | | '请输入谷歌验证码': "โปรดป้อนรหัสยืนยันของ Google", |
| | | '休市': "ตลาดหยุด", |
| | | '交易中': "การซื้อขาย", |
| | |
| | | logIn: "Đăng nhập để giao dịch", |
| | | idBackImg: "Vui lòng tải lên thông tin chứng chỉ", |
| | | '生成实时数据失败': "Không thể tạo dữ liệu trực tiếp", |
| | | '期货交易': "Giao dịch hợp đồng tương lai", |
| | | '货币交易': "Giao dịch tiền tệ", |
| | | '休市': "Đóng cửa", |
| | | '交易中': "Đang giao dịch", |
| | | 'Asia/Shanghai': "Giờ Trung Quốc", |
| | |
| | | logIn: "登录后进行交易", |
| | | idBackImg: "请上传证件信息", |
| | | '生成实时数据失败': "生成实时数据失败", |
| | | '期货交易': "期货交易", |
| | | '货币交易': "货币交易", |
| | | "请输入谷歌验证码": "请输入谷歌验证码", |
| | | '休市': "休市", |
| | | '交易中': "交易中", |
| | |
| | | <template> |
| | | <div id="cryptos"> |
| | | <div class="DeliveryContractHistory px-10 font-28"> |
| | | <assets-head :title="routeType == 'cryptos' ? $t('交割合约历史') : $t('期货交易')" :backFunc="() => { |
| | | <assets-head :title="routeType == 'cryptos' ? $t('交割合约历史') : $t('货币交易')" :backFunc="() => { |
| | | if ($route.query.goback) { |
| | | $router.push({ |
| | | path: '/cryptos/funds', |
| | |
| | | <van-icon name="arrow-down" /> |
| | | <div class="select-data" v-if="isAll"> |
| | | <div class="select-item" @click.stop="selectItem(item2)" v-for="(item2, index) in currencyList" |
| | | :key="index">{{ routeType == 'indices' ? item2.name : item2.symbol.toUpperCase() || item2.symbol }}</div> |
| | | :key="index">{{ routeType == 'indices' ? item2.name : item2.symbol.toUpperCase() || item2.symbol }} |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | :finished-text="dataList.orders.length ? $t('已经全部加载完毕') : ''" @load="onLoad" :offset="30" class="px-20"> |
| | | <futrue-hold-list v-if="type === 'orders'" :list-data="dataList.orders"> |
| | | </futrue-hold-list> |
| | | <div class="flex flex-col justify-center pt-50 pb-20 items-center" v-if="!dataList.orders.length && !loading"> |
| | | <div class="flex flex-col justify-center pt-50 pb-20 items-center" |
| | | v-if="!dataList.orders.length && !loading"> |
| | | <img src="@/assets/image/assets-center/no-data.png" alt="" class="w-100 h-100 no-data-img" /> |
| | | <p class="text-grey mt-10">{{ $t('暂无记录') }}</p> |
| | | </div> |
| | |
| | | <div class="w-368 h-80 mr-32 font-28 flex justify-center items-center rounded box-border tabBtn" |
| | | :class="tab === '1' ? 'activeBtn' : ''" @click="onTab('1')">{{ $t('永续合约') }}</div> |
| | | <div class="w-368 h-80 font-28 flex justify-center items-center rounded box-border tabBtn" |
| | | :class="tab === '2' ? 'activeBtn' : ''" @click="onTab('2')">{{ queryType == 'cryptos' ? $t('交割合约') : $t('期货交易') |
| | | :class="tab === '2' ? 'activeBtn' : ''" @click="onTab('2')">{{ queryType == 'cryptos' ? $t('交割合约') : $t('货币交易') |
| | | }}</div> |
| | | </div> --> |
| | | <!-- 数据区 --> |
| | |
| | | <p>{{ quote.low || '--' }}</p> |
| | | </div> |
| | | <div class="flex w-1/2 flex-col justify-between w-220 mt-20"> |
| | | <p class="text-grey">{{ queryType == 'cryptos' ? $t('24h成交额') + '(USDT)' : $t('24h成交额') + '(USD)' }}</p> |
| | | <p class="text-grey">{{ queryType == 'cryptos' ? $t('24h成交额') + '(USDT)' : $t('24h成交额') + '(USD)' }} |
| | | </p> |
| | | <p>{{ (quote.volume * 1).toFixed(2) || '--' }}</p> |
| | | </div> |
| | | </div> |
| | |
| | | <span class="flex-1">{{ $t('时间') }}</span> |
| | | <span class="flex-1">{{ $t('方向') }}</span> |
| | | <span class="flex-1">{{ $t('价格') }}{{ queryType == 'cryptos' ? '(USDT)' : '(USD)' }}</span> |
| | | <span class="flex-1 flex justify-center buy-title">{{ $t('数量') }}({{ symbolData.toUpperCase() }})</span> |
| | | <span class="flex-1 flex justify-center buy-title">{{ $t('数量') }}({{ symbolData.toUpperCase() |
| | | }})</span> |
| | | </li> |
| | | <li v-for="(item, index) in deals" :key="item.ts + item.price + item.amount || index" |
| | | class="flex justify-between mt-30"> |
| | |
| | | </div> |
| | | </div> |
| | | <van-popup v-model:show="show" class="rounded-2xl" :key="initFutrue.session_token"> |
| | | <popup-confirm-order :paras="initFutrue.para" :symbol="symbol" :direction="direction" :balance="initFutrue.amount" |
| | | :price="quote.close" @close="onClose" @confirm="onOrderConfirm" v-if="popType === 'confirm'" /> |
| | | <popup-confirm-order :paras="initFutrue.para" :symbol="symbol" :direction="direction" |
| | | :balance="initFutrue.amount" :price="quote.close" @close="onClose" @confirm="onOrderConfirm" |
| | | v-if="popType === 'confirm'" /> |
| | | <popup-delivery showBtns :detailData="detailData" :key="detailData.order_no" @close="onClose" |
| | | @continueToBuy="order()" @timeEnd="handleTimeEnd" :price="quote.close" v-else /> |
| | | </van-popup> |