src/assets/css/copy.scss
@@ -55,7 +55,7 @@ $blue: #1194F7; $light-blue: #1199FA; $red: #de5d56; $green: #3a7ff6; $green: #2ebd85; $purple: #9A4DFD; $night: #131a2e; // 第三版 src/assets/init.scss
@@ -56,7 +56,7 @@ $blue: #1194F7; $light-blue: #1199FA; $red: #de5d56; $green: #3a7ff6; $green: #2ebd85; $purple: #9A4DFD; $night: #f5f7fa; // overwrite vant src/components/Transform/contract-futrue/index.vue
@@ -6,10 +6,12 @@ <li v-for="(item, index) in initFutrue.para" v-if="initFutrue.para" :key="item.uuid" class="h-92 flex items-center mb-22" @click="onSelect(item, index)"> <p class="w-95 h-full flex justify-center items-center font-22 flex-1" :class="active === item.para_id ? 'bg-light-blue text-white' : 'delivery_left_tab_background textColor'">{{ item.time_num + :class="active === item.para_id ? 'bg-light-blue text-white' : 'delivery_left_tab_background textColor'" >{{ item.time_num + item.time_unit.substr(0, 1) }}</p> <p class="w-125 h-full flex justify-center items-center font-22 flex-1" :class="active === item.para_id ? 'bg-dark-blue text-white' : 'delivery_tab_background textColor'">{{ :class="active === item.para_id ? 'bg-dark-blue text-white' : 'delivery_tab_background textColor'" >{{ item.profit_ratio }}%</p> </li> </ul> @@ -65,4 +67,8 @@ .bg-dark-blue { background: #1255A3; } ul li p{ color: #fff; } </style> src/components/Transform/contract-header/index.vue
@@ -5,7 +5,7 @@ <div class="pl-30 pr-30"> <div class="flex justify-start pt-45 before"> <div class="flex items-center "> <img src="@/assets/image/icon_back_1.png" class="w-35 h-35 back" alt="" @click="jump()"> <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"> <div class="flex pl-21 textColor" @click="onSidebar"> <div class="font-35">{{ symbolName.toUpperCase() || '--' }}</div> @@ -20,7 +20,7 @@ @click="jump" /> </div> --> </div> <div class="flex justify-between pt-34"> <div class="flex justify-between pt-34" v-if="!selectIndex==2"> <button class="tabBtn w-368 h-74 lh-74 border-none rounded" :class="selectIndex == 1 ? 'select-active' : 'no-select'" @click="changeTab(1)"> {{ $t('永续合约') }}</button> @@ -173,17 +173,18 @@ } }, jump() { if (this.$route.query?.from === 'trade') { this.$router.push('/trade/index?tabActive=1') return } if (this.$route.query.type == 'indices') { this.$router.push('/quotes/index') } else if (this.$route.query.type == 'US-stocks') { this.$router.push('/quotes/index?tabActive=3') } else { this.$router.push('/quotes/index?tabActive=1') } this.$router.go(-1) // if (this.$route.query?.from === 'trade') { // this.$router.push('/trade/index?tabActive=1') // return // } // if (this.$route.query.type == 'indices') { // this.$router.push('/quotes/index') // } else if (this.$route.query.type == 'US-stocks') { // this.$router.push('/quotes/index?tabActive=3') // } else { // this.$router.push('/quotes/index?tabActive=1') // } }, klineJump() { this.$router.push(`/cryptos/trendDetails/${this.symbol}?type=${this.queryType}`) @@ -237,7 +238,7 @@ .select-one-active { background-color: $red; color: $text_color; color: #fff; border: none; } src/components/Transform/cryptos-trade-deep-data/index.vue
@@ -1,5 +1,6 @@ <template> <div class="deep-data"> <!-- 币币交易 右侧跳动的数 --> <div class="flex justify-between text-grey font-24"> <div> <div>{{ $t('价格') }}</div> src/components/Transform/deliveryContract/position.vue
@@ -146,7 +146,7 @@ font-style: normal; font-weight: 400; font-size: 26.4981px; color: $text_color; color: #fff; } .position-tag-title { src/components/Transform/perpetual-open/index.vue
@@ -21,7 +21,7 @@ </div> <div class="pt-30 pb-20"> <div class="flex"> <div class="w-440 flex flex-col"> <div class="w-440 flex flex-col" :style="selectIndex==2 ? 'width:100%' : ''"> <template v-if="selectIndex == 1"> <div class="flex items-center h-66 rounded-lg text-grey"> <p class="font-28 flex-1 flex items-center justify-center h-66 " @@ -48,28 +48,28 @@ <contract-futrue v-if="selectIndex == 2 && JSON.stringify(initFutrue.para) != '[]'" class="mb-20" :initFutrue="initFutrue" @paraId="onParaId" /> <div class="h-76 lh-76 greyBg mb-30 flex pr-20 justify-center rounded-lg textColor" v-if="selectIndex == 1"> <input placeholder="" class="greyBg w-full pl-20 h-76 border-none text-left rounded-lg" <input placeholder="" class=" w-full pl-20 h-76 border-none text-left rounded-lg" :disabled="type / 1 === 1" @focus="focus = true" v-model="form.price" /> <span class="ml-20">{{ queryType === 'cryptos' ? 'USDT' : 'USD' }}</span> </div> <div class="w-440 flex items-center greyBg h-76 lh-76 rounded-lg" v-if="initFutrue"> <div class="w-440 flex items-center h-76 lh-76 rounded-lg" v-if="initFutrue" > <div v-if="selectIndex == 1 && initFutrue.para && initFutrue.para.length > 0" class="w-80 flex items-center justify-center" style="height:100%;" @click="onReduce"> <img src="../../../assets/image/public/reduce.png" alt="add" class="w-30 h-6" /> </div> <input v-if="selectIndex == 1" :placeholder="$t('张数')" class="border-none greyBg text-center textColor" <input v-if="selectIndex == 1" :placeholder="$t('张数')" class="border-none text-center textColor" style="width: 156px;" v-model="form.amount" type="number" @input="onInput" /> <input v-if="selectIndex == 2 && JSON.stringify(initFutrue.para) != '[]'" :placeholder="($t('最少') + initFutrue && initFutrue.para ? $t('最小金额') + initFutrue.para[paraIndex].buy_min : '')" class="border-none greyBg text-center textColor" style="width: 156px;" v-model="form.amount" type="number" class="border-none text-center ipt_min" style="width: 156px;background-color: #f0f0f0;" v-model="form.amount" type="number" @input="onInput" /> <div class="w-80 flex items-center justify-center" style="height:100%;"> <template v-if="selectIndex == 1"> <img @click="onAdd" src="../../../assets/image/public/add.png" alt="reduce" class="w-30 h-30" /> </template> <template v-else> <span class="textColor">{{ queryType === 'cryptos' ? 'USDT' : 'USD' }}</span> <span class="text-grey">{{ queryType === 'cryptos' ? 'USDT' : 'USD' }}</span> </template> </div> </div> @@ -197,7 +197,7 @@ @click="$router.push('/login')">{{ $t('logIn') }}</div> </div> </div> <div class="ml-30"> <div class="ml-30" v-if="!selectIndex==2"> <div class="w-290 flex justify-between text-grey font-22"> <div> <div>{{ $t("价格") }}</div> @@ -360,7 +360,7 @@ }, selectIndex: { type: [String, Number], default: 1 default: 2 }, currentType: { type: String, @@ -1044,7 +1044,7 @@ justify-content: flex-end; // padding-right: 40px; align-items: center; s .select-box { width: 220px; @@ -1057,4 +1057,8 @@ .deep-div { min-height: 370px; } #cryptos .ipt_min::placeholder { color: #868C9A; } </style> src/components/Transform/perpetual-order/index.vue
@@ -190,10 +190,12 @@ // padding-bottom: 16px; // color: $text-color; position: relative; color: #fff !important; background-color: #000; // padding: 15px 0; color: $text_color; // color: $text_color; border-radius: 8px; background-color: $color_main // background-color: $color_main } // .active-line::after { src/components/Transform/trade-head/index.vue
@@ -7,7 +7,7 @@ <div class="flex items-center"> <!-- 没有切换模式的 --> <img v-if="isReturn" src="@/assets/image/icon_back_1.png" @click="backPath()" class="w-40 h-40 back mr-50" <img v-if="isReturn" src="@/assets/image/icon_back.png" @click="backPath()" class="w-40 h-40 back mr-50" alt=""> <template v-if="!isChange"> <img src="../../../assets/theme/dark/image/black-convert.png" alt="convert-img" class="w-35 h-35" @@ -16,7 +16,7 @@ <!-- 在切换模式下 --> <template v-if="isChange"> <template v-if="isNight"> <img src="../../../assets/image/icon_back_1.png" class="w-40 h-40 back mr-50" alt="" @click="backPath()"> <img src="../../../assets/image/icon_back.png" class="w-40 h-40 back mr-50" alt="" @click="backPath()"> <img src="./white-convert.png" alt="convert-img" class="w-35 h-35" @click="onSidebar" /> </template> <template v-else> @@ -290,17 +290,18 @@ this.$emit('changeNight', !this.isNight) }, backPath() { if (this.$route.query?.from === 'trade') { this.$router.push('/trade/index?tabActive=1') } else if (this.$route.query.isOptional == 1) { this.$router.push('/optional/index') } this.$router.go(-1) // if (this.$route.query?.from === 'trade') { // this.$router.push('/trade/index?tabActive=1') // } else if (this.$route.query.isOptional == 1) { // this.$router.push('/optional/index') // } // else if (this.$route.query.isOptional == 2){ // this.$router.push('/optional/search') // } else { this.$router.push('/quotes/index?tabActive=1') } // else { // this.$router.push('/quotes/index?tabActive=1') // } }, //打开自选弹窗 openCurrency() { src/components/fx-footer/index.vue
@@ -15,12 +15,12 @@ </template> </van-tabbar-item> <!-- /foreign --> <van-tabbar-item name="trade" :to="'/foreign/deliveryContract/'+jgSymbol"> <!-- <van-tabbar-item name="trade" :to="'/foreign/deliveryContract/'+jgSymbol"> <span :class="[active === 'trade' ? 'active' : '']">{{ $t('trade') }}</span> <template #icon="props"> <img :src="active === 'trade' ? icon.trade.active : icon.trade.inactive" /> </template> </van-tabbar-item> </van-tabbar-item> --> <!-- <van-tabbar-item name="funds" to="/cryptos/funds"> <span>{{ $t('资金') }}</span> <template #icon="props"> src/components/fx-kline/index.vue
@@ -72,7 +72,11 @@ socket.value = new WebSocket(`${WS_URL}/1/${props.symbol}`) socket.value.onmessage = (evt) => { const { data } = evt const { code, data: _data } = JSON.parse(data) let { code, data: _data } = JSON.parse(data) // _data[0].high = Math.floor(Math.random() * 100) + 1 // _data[0].low = Math.floor(Math.random() * 100) + 1 // _data[0].close = Math.floor(Math.random() * 100) + 1 // _data[0].open = Math.floor(Math.random() * 100) + 1 if (code / 1 === 0) { emits('data', _data[0]) updateCharts(_data[0]) @@ -154,8 +158,10 @@ width: quotesStore.stage === 'timeSharing' ? 0 : null, } }) // quotesStore[SET_STAGE]({ stage: 'timeSharing', seconds: 1000 }) if (!quotesStore.stage) { quotesStore[SET_STAGE]({ stage: '1min', seconds: 1 * 60 * 1000 }) quotesStore[SET_STAGE]({ stage: '1min', seconds: 1000 }) } emits('loading', true) @@ -202,8 +208,10 @@ } }) if (!quotesStore.stage) { quotesStore[SET_STAGE]({ stage: '1min', seconds: 1 * 60 * 1000 }) quotesStore[SET_STAGE]({ stage: '1min', seconds: 1000 }) } // quotesStore[SET_STAGE]({ stage: 'timeSharing', seconds: 1000 }) // console.log(data.value) nextTick(() => { src/config/index.js
@@ -34,8 +34,8 @@ export const defaultSeconds = 1 * 24 * 60 * 60 * 1000 // const ENV_DEV = 'zhapi.coinbtcs.com' // dev // const ENV_DEV = 'openapi.yanshiz.com' // dev const ENV_DEV = '192.168.10.18:8086' // dev const ENV_DEV = 'openapi.yanshiz.com' // dev // const ENV_DEV = '192.168.10.18:8086' // dev // const ENV_PRO = 'qheufhj.site' // app域名 src/config/theme.js
@@ -1,3 +1,3 @@ let theme = 'dark' let theme = 'day' // 'dark' export const THEME = theme src/views/cryptos/PerpetualContract/index.vue
@@ -187,8 +187,8 @@ </div> <div class="fixed-box"> <div class="flex justify-between items-center px-30 py-20" @click.stop="handleClickShowKlineChart()"> <span class="font-30 textColor2">{{ symbol.toUpperCase() }} {{ $t('k线图表') }}</span> <van-icon class="textColor font-20" :name="showCharts ? 'arrow-down' : 'arrow-up'"></van-icon> <span class="font-30 textColor2" style="color:#fff;">{{ symbol.toUpperCase() }} {{ $t('k线图表') }}</span> <van-icon class="font-30" style="color:#fff;" :name="showCharts ? 'arrow-down' : 'arrow-up'"></van-icon> </div> <!-- <section class="indicator-index-container" v-if="showKlineChart"> <div class="indicator-index-box"> @@ -462,7 +462,7 @@ //console.log('下单后更新数据') }, onTab(evt) { // 点击tab后的回调 console.log('evt', evt) console.log('evt2', evt) this.clearTimer() // this.clearTimeout() this.curTab = evt src/views/cryptos/Trade/index.vue
@@ -1,5 +1,6 @@ <template> <div id="cryptos"> <!-- 调节跳动深度 --> <div class="pb-108 no_touch"> <!-- <div class="px-30 pt-20"> <div class="flex h-88 w-full box-border border-solid-grey rounded-lg"> @@ -128,8 +129,8 @@ </div> --> <div class="fixed-box"> <div class="flex justify-between items-center px-30 py-20" @click.stop="handleClickShowKlineChart()"> <span class="font-30 textColor2">{{ symbol.toUpperCase() }} {{ $t('k线图表') }}</span> <van-icon class="textColor font-20" :name="showCharts ? 'arrow-down' : 'arrow-up'"></van-icon> <span class="font-30 textColor2" style="">{{ symbol.toUpperCase() }} {{ $t('k线图表') }}</span> <van-icon class="textColor font-28" :name="showCharts ? 'arrow-down' : 'arrow-up'"></van-icon> </div> <!-- <section class="indicator-index-container" v-if="showKlineChart"> <div class="indicator-index-box"> @@ -659,7 +660,7 @@ .select-box { width: 220px; background: #1E1E1E; background: #f5f5f5; margin-right: 20px; } @@ -672,6 +673,8 @@ .option-box { z-index: 99; background-color: #f5f5f5; box-shadow: 0px 0px 0.1875rem 0.1875rem #f5f5f5; } :deep(.van-action-sheet__content) { @@ -807,4 +810,11 @@ color: $text_color; } } .diviLine{ background-color: #f5f5f5; } .textColor2, .textColor{ color: #fff; } </style> src/views/foreign/CoinChart.vue
@@ -28,7 +28,7 @@ <div class="flex-l"> <p class="first-line red">{{ priceFormat(chartData?.close) }}</p> <p class="second-line"> <span class="red">{{ chartData?.change_ratio ? `${chartData?.change_ratio}%` : '--' }}</span> <span class="red">{{ chartData?.change_ratio_str ? `${chartData?.change_ratio_str}%` : '--' }}</span> </p> </div> <div class="flex-r"> @@ -145,7 +145,7 @@ </div> <div class="text-right font-12"> <div class="textColor">{{ item.close || '--' }}</div> <div class="value" :class="item.change_ratio > 0 ? 'green' : 'red'">{{ item.change_ratio <div class="value" :class="item.change_ratio_str > 0 ? 'green' : 'red'">{{ item.change_ratio_str || '--' }}%</div> </div> @@ -298,6 +298,7 @@ // 事件 const onData = (data) => { console.log('onData:',data) chartData.value = data noData.value = false } src/views/foreign/foreignPerpetualContract/deliveryContract.vue
@@ -145,7 +145,7 @@ } const onTab = (evt) => { // 点击tab后的回调 console.log('evt', evt) console.log('evt1', evt) clearTimer() curTab.value = evt if (curTab.value == 'fetchFutrueHoldList') { src/views/news/index.vue
@@ -63,11 +63,17 @@ </div> <div class="text-center">{{t('理財')}}</div> </div> <div class="flex-1 flex flex-col items-center"> <!-- <div class="w-40 h-40 rounded-full flex items-center justify-center"> <div class="flex-1 flex flex-col items-center" @click="goToPage('/cryptos/trade/btcusdt')"> <div class="w-40 h-40 rounded-full flex items-center justify-center"> <img class="w-33 h-33" src="@/assets/c.jpg" draggable="false"> </div> <div class="text-center">模拟交易</div> --> <div class="text-center">{{t('币币交易')}}</div> </div> <div class="flex-1 flex flex-col items-center" @click="goToPage('/cryptos/perpetualContract/btcusdt?type=cryptos&selectIndex=2')"> <div class="w-40 h-40 rounded-full flex items-center justify-center"> <img class="w-33 h-33" src="@/assets/c.jpg" draggable="false"> </div> <div class="text-center">{{t('交割合约')}}</div> </div> <div class="flex-1 flex flex-col items-center" @click="copyInviteLink"> <div class="w-40 h-40 rounded-full flex items-center justify-center">