1
李凌
2025-10-17 1927f50d962dfe4478fda88b88b5cf83061036e2
1
3 files modified
224 ■■■■ changed files
src/views/C2C/c2c-trade/components/C2cTrade.vue 2 ●●● patch | view | raw | blame | history
src/views/C2C/c2c-trade/page/SellGenerate.vue 16 ●●●●● patch | view | raw | blame | history
src/views/homePage/index.vue 206 ●●●● patch | view | raw | blame | history
src/views/C2C/c2c-trade/components/C2cTrade.vue
@@ -41,7 +41,7 @@
          <span class="text-grey">{{ $t("交易方式") }}</span>
          <div class="h-56 tabBackground rounded-md">
            <template v-if="detail.direction === 'buy'">
              <van-popover class="w-full h-full" placement="left-end" :theme="$store.state.home.theme"
              <van-popover class="w-full h-full" :theme="$store.state.home.theme"
                v-model:show="showPopover" trigger="click" :actions="payList" @select="onSelect">
                <template #reference>
                  <div class="flex justify-center items-center w-full h-full">
src/views/C2C/c2c-trade/page/SellGenerate.vue
@@ -10,11 +10,11 @@
            <div class="font-48">{{ $t('等待买家付款') }}</div>
            <div class="mt-16 font-24">{{ $t('预计收到付款') }} <span style="color: #1D91FF">{{
              orderDetail.expireTime
            }}{{ $t('分钟') }}</span>
                }}{{ $t('分钟') }}</span>
            </div>
          </div>
          <div class="w-140 h-144">
            <otc-circle :time="orderDetail.expireTime * 60" @finish="finish" class="w-full h-full" />
            <otc-circle :time="orderDetail.autoCancelTimeRemain" @finish="finish" class="w-full h-full" />
          </div>
        </div>
        <div class="w-full mt-48 pt-46 pl-32 pb-42 box-border border-ra tabBackground c2cColor">
@@ -87,9 +87,10 @@
          :create-order-time="fullTime(orderDetail.createTime)" :seller-name="orderDetail.c2cUserNickName"
          :unit-price="orderDetail.symbolValue" />
        <!--   已超时   -->
        <cancel-success v-if="timeout" :title="$t('出售')" :count="orderDetail.coinAmount" :total-price="orderDetail.amount"
          :order-number="orderDetail.orderNo" :create-order-time="fullTime(orderDetail.createTime)"
          :seller-name="orderDetail.c2cUserNickName" :unit-price="orderDetail.symbolValue">
        <cancel-success v-if="timeout" :title="$t('出售')" :count="orderDetail.coinAmount"
          :total-price="orderDetail.amount" :order-number="orderDetail.orderNo"
          :create-order-time="fullTime(orderDetail.createTime)" :seller-name="orderDetail.c2cUserNickName"
          :unit-price="orderDetail.symbolValue">
          <template #title>{{ $t('已超时') }}</template>
          <template #desc>{{ $t('买家付款超时,您的订单已取消') }}</template>
        </cancel-success>
@@ -141,10 +142,10 @@
    }
  },
  setup() {
    onBeforeUnmount(()=>{
    onBeforeUnmount(() => {
      let end = setInterval(function () { }, 10000);
      for (let i = 1; i <= end; i++) {
          clearInterval(i);
        clearInterval(i);
      }
    })
  },
@@ -252,6 +253,7 @@
<style lang="scss" scoped>
@import "@/assets/css/copy2.scss";
.border-ra {
  border-radius: 20px;
}
src/views/homePage/index.vue
@@ -40,40 +40,39 @@
    <div id="cryptos" class="pt-10">
        <list-quatation :listData="qList" :tabShow="false" />
    </div> -->
    <van-notice-bar text="通知内容" left-icon="volume" color="orange" background="white"/>
    <van-notice-bar text="通知内容" left-icon="volume" color="orange" background="white" />
    <div style="margin: 0 10px">
      <div class="flex-centerY">
        <div style="font-size: 16px;margin-right: 5px">
          <van-icon v-if="showMoney" @click="showMoney=!showMoney" name="browsing-history" />
          <van-icon v-else @click="showMoney=!showMoney" name="closed-eye" />
          <van-icon v-if="showMoney" @click="showMoney = !showMoney" name="browsing-history" />
          <van-icon v-else @click="showMoney = !showMoney" name="closed-eye" />
        </div>
        <div style="font-size: 14px;color: black">
          {{$t("总资产")}}(USD)
          {{ $t("总资产") }}(USD)
        </div>
      </div>
      <div class="flex-centerY flex-position-between" style="margin-top: 15px">
       <div class="flex flex-justify-between">
         <div style="font-size: 33px;font-weight: bold;color: black">
           {{showMoney?myAssets.capital.toFixed(0):"*****" }}
         </div>
         <div style="font-size: 24px;font-weight: bold;color: black;margin-top: 3px">
           {{showMoney?myAssets.capital.toFixed(2).substring(myAssets.capital.toFixed(2).indexOf(".")):""}}
         </div>
       </div>
        <div style="background: black;color: white;padding: 4px 17px;border-radius: 90px;font-size: 14px">
          {{$t("充值")}}
        <div class="flex flex-justify-between">
          <div style="font-size: 33px;font-weight: bold;color: black">
            {{ showMoney ? todayMoney.money_contract : "*****" }}
          </div>
        </div>
        <div style="background: black;color: white;padding: 4px 17px;border-radius: 90px;font-size: 14px"
          @click="toPage('/cryptos/recharge/rechargeList?isForeign=true')">
          {{ $t("充值") }}
        </div>
      </div>
      <div class="flex-centerY" style="font-size: 12px;color: #999;margin-top: 20px;">
        <div>
          {{$t("今日盈亏")}}
          {{ $t("今日盈亏") }}
        </div>
        <div style="margin-left: 15px">
          {{showMoney? todayMoney.money_contract_profit_today:"****"}}
          {{ showMoney ? todayMoney.money_contract_profit_today : "****" }}
        </div>
        <div style="margin-left: 15px">
          {{showMoney?(Number(todayMoney.money_contract_profit_today+'')/(myAssets.capital==0?1:myAssets.capital)*100).toFixed(2)+'%':"****"}}
          {{ showMoney ? (Number(todayMoney.money_contract_profit_today + '') / (todayMoney.money_contract == 0 ? 1 :
            todayMoney.money_contract) * 100).toFixed(2) + '%' : "****" }}
        </div>
      </div>
    </div>
@@ -85,69 +84,72 @@
      </div>
    </div>
    <div style="position: relative;margin: 10px 00px;border-radius: 12px;border: 1px #eee solid">
<!--      <van-notice-bar class="font-26 mt-10 index_notice" :scrollable="false" wrapable>-->
      <!--      <van-notice-bar class="font-26 mt-10 index_notice" :scrollable="false" wrapable>-->
        <van-swipe @change="current=$event" indicator-color="#999" class="notice-swipe" :autoplay="2000"
                   :show-indicators="false" style="border-radius: 8px;overflow: hidden">
          <van-swipe-item v-for="item in announceList" style="border-radius: 8px;overflow: hidden;border: #eee 1px solid"  :key="item.id" @click="toAnnounceDetail(item.uuid)">
<!--            <div class="flex justify-start items-center">-->
<!--              <img :src="item.imgUrl" style="width:100%" alt="" class="notice_img mr-5">-->
<!--&lt;!&ndash;              <div class="notice_content textColor">&ndash;&gt;-->
<!--&lt;!&ndash;                <div>{{ item.startTime }}</div>&ndash;&gt;-->
<!--&lt;!&ndash;                <div>{{ item.title }}</div>&ndash;&gt;-->
<!--&lt;!&ndash;              </div>&ndash;&gt;-->
<!--            </div>-->
            <img :src="item.imgUrl" alt="" class="notice_img mr-5" style="width:100%;height:100px;border-radius: 8px" >
          </van-swipe-item>
        </van-swipe>
<!--      </van-notice-bar>-->
      <van-swipe @change="current = $event" indicator-color="#999" class="notice-swipe" :autoplay="2000"
        :show-indicators="false" style="border-radius: 8px;overflow: hidden">
        <van-swipe-item v-for="item in announceList" style="border-radius: 8px;overflow: hidden;border: #eee 1px solid"
          :key="item.id" @click="toAnnounceDetail(item.uuid)">
          <!--            <div class="flex justify-start items-center">-->
          <!--              <img :src="item.imgUrl" style="width:100%" alt="" class="notice_img mr-5">-->
          <!--&lt;!&ndash;              <div class="notice_content textColor">&ndash;&gt;-->
          <!--&lt;!&ndash;                <div>{{ item.startTime }}</div>&ndash;&gt;-->
          <!--&lt;!&ndash;                <div>{{ item.title }}</div>&ndash;&gt;-->
          <!--&lt;!&ndash;              </div>&ndash;&gt;-->
          <!--            </div>-->
          <img :src="item.imgUrl" alt="" class="notice_img mr-5" style="width:100%;height:100px;border-radius: 8px">
        </van-swipe-item>
      </van-swipe>
      <!--      </van-notice-bar>-->
      <div class="flex-center" style="position:absolute;bottom:5px;left:0;;z-index:999;width: 100%">
        <div v-for="(i,index) in announceList">
          <div v-if="current!=index" style="width:3px;height:3px;background:#bbb;margin-right:5px;border-radius: 3px"></div>
        <div v-for="(i, index) in announceList">
          <div v-if="current != index" style="width:3px;height:3px;background:#bbb;margin-right:5px;border-radius: 3px">
          </div>
          <div v-else style="width:3px;height:3px;background:#333;;margin-right:5px;border-radius: 3px"></div>
        </div>
      </div>
    </div>
<!--    <div style="margin: 15 0px;align-items: stretch" class="flex-centerY">-->
<!--      <div class="flex-centerY" style="flex: 1;margin-right: 20px;border: #eee 1px solid;border-radius: 12px;padding: 10px 10px">-->
<!--        <div style="flex: 1" class="flexY">-->
<!--          <div style="font-size: 14px;color: black;font-weight: bold">-->
<!--            {{$t("信贷")}}-->
<!--          </div>-->
<!--          <div style="font-size: 12px;color: #999;flex: 1">-->
<!--            {{$t("低利率,彈性強,助您持續擁有資金")}}-->
<!--          </div>-->
<!--        </div>-->
<!--        <div >-->
<!--          <img src="../../assets/img/img_4.png" style="width: 55px;height: 55px">-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="flex-centerY" style="flex: 1;border: #eee 1px solid;border-radius: 12px;padding: 10px 10px">-->
<!--        <div style="flex: 1;height: 100%" class="flexY">-->
<!--          <div style="font-size: 14px;color: black;font-weight: bold">-->
<!--            {{$t("OTC")}}-->
<!--          </div>-->
<!--          <div style="font-size: 12px;color: #999;;flex: 1">-->
<!--            {{$t("200+支付方式")}}-->
<!--          </div>-->
<!--        </div>-->
<!--        <div >-->
<!--          <img src="../../assets/img/img_5.png" style="width: 55px;height: 55px">-->
<!--        </div>-->
<!--      </div>-->
<!--    </div>-->
    <!--    <div style="margin: 15 0px;align-items: stretch" class="flex-centerY">-->
    <!--      <div class="flex-centerY" style="flex: 1;margin-right: 20px;border: #eee 1px solid;border-radius: 12px;padding: 10px 10px">-->
    <!--        <div style="flex: 1" class="flexY">-->
    <!--          <div style="font-size: 14px;color: black;font-weight: bold">-->
    <!--            {{$t("信贷")}}-->
    <!--          </div>-->
    <!--          <div style="font-size: 12px;color: #999;flex: 1">-->
    <!--            {{$t("低利率,彈性強,助您持續擁有資金")}}-->
    <!--          </div>-->
    <!--        </div>-->
    <!--        <div >-->
    <!--          <img src="../../assets/img/img_4.png" style="width: 55px;height: 55px">-->
    <!--        </div>-->
    <!--      </div>-->
    <!--      <div class="flex-centerY" style="flex: 1;border: #eee 1px solid;border-radius: 12px;padding: 10px 10px">-->
    <!--        <div style="flex: 1;height: 100%" class="flexY">-->
    <!--          <div style="font-size: 14px;color: black;font-weight: bold">-->
    <!--            {{$t("OTC")}}-->
    <!--          </div>-->
    <!--          <div style="font-size: 12px;color: #999;;flex: 1">-->
    <!--            {{$t("200+支付方式")}}-->
    <!--          </div>-->
    <!--        </div>-->
    <!--        <div >-->
    <!--          <img src="../../assets/img/img_5.png" style="width: 55px;height: 55px">-->
    <!--        </div>-->
    <!--      </div>-->
    <!--    </div>-->
    <div class="tabs flex justify-start items-center textColor1">
      <div v-for="i in tabList" :key="i" :class="i.key == tab ? 'textColor' : ''" @click="tab = i.key" style="font-size: 16px;margin-top: 20px">
      <div v-for="i in tabList" :key="i" :class="i.key == tab ? 'textColor' : ''" @click="tab = i.key"
        style="font-size: 16px;margin-top: 20px">
        {{ i.name }}
      </div>
    </div>
    <div id="cryptos">
      <list-quatation :listData="qList" :tabShow="false" :tabActive="tab"/>
      <list-quatation :listData="qList" :tabShow="false" :tabActive="tab" />
    </div>
    <div class="home_2" @click="toPage('/quotes/index')">
      {{ $t("更多") }}
      <van-icon name="arrow-down"/>
      <van-icon name="arrow-down" />
    </div>
    <div class="home_3 flex justify-start">
@@ -160,7 +162,7 @@
        <template #title>
          <div class="flex justify-start items-center">
            <img src="@/assets/imgs/home/home_23a.png" alt="" class="border_icon"
                 v-if="storeS.state.vant.theme == 'light'">
              v-if="storeS.state.vant.theme == 'light'">
            <img src="@/assets/imgs/home/home_23b.png" alt="" class="border_icon" v-else>
            {{ $t('公司') }}
          </div>
@@ -174,7 +176,7 @@
        <template #title>
          <div class="flex justify-start items-center">
            <img src="@/assets/imgs/home/home_21a.png" alt="" class="border_icon"
                 v-if="storeS.state.vant.theme == 'light'">
              v-if="storeS.state.vant.theme == 'light'">
            <img src="@/assets/imgs/home/home_21b.png" alt="" class="border_icon" v-else>
            {{ $t('法律') }}
          </div>
@@ -187,7 +189,7 @@
        <template #title>
          <div class="flex justify-start items-center">
            <img src="@/assets/imgs/home/home_22a.png" alt="" class="border_icon"
                 v-if="storeS.state.vant.theme == 'light'">
              v-if="storeS.state.vant.theme == 'light'">
            <img src="@/assets/imgs/home/home_22b.png" alt="" class="border_icon" v-else>
            {{ $t('支援') }}
          </div>
@@ -202,16 +204,16 @@
<script setup>
import Head from './components/head.vue'
import {useI18n} from "vue-i18n";
import {ref, computed, onBeforeUnmount} from 'vue';
import {useRouter} from 'vue-router';
import { useI18n } from "vue-i18n";
import { ref, computed, onBeforeUnmount } from 'vue';
import { useRouter } from 'vue-router';
import ListQuatation from "@/components/Transform/list-quotation/index.vue";
import {_getHomeList} from '@/service/cryptos.api'
import {_getassets, _getContractBySymbolType, _getNewsList1, _getPopupNews} from '@/service/user.api'
import {useStore} from "vuex";
import {TIME_OUT, LOGO} from "@/config";
import {useUserStore} from '@/store/user';
import {setStorage, getStorage} from '@/utils/index.js';
import { _getHomeList } from '@/service/cryptos.api'
import { _getassets, _getContractBySymbolType, _getNewsList1, _getPopupNews } from '@/service/user.api'
import { useStore } from "vuex";
import { TIME_OUT, LOGO } from "@/config";
import { useUserStore } from '@/store/user';
import { setStorage, getStorage } from '@/utils/index.js';
import storeS from '@/store/store'
let catchSymbol = getStorage('symbol')
@@ -219,14 +221,22 @@
  setStorage('symbol', 'btcusdt');
}
const userStore = useUserStore()
const {t} = useI18n()
const { t } = useI18n()
const router = useRouter()
const store = useStore();
const showMoney=ref(true)
const myAssets=ref({})
  _getassets().then(res => {
    myAssets.value = res
  })
const showMoney = ref(true)
const myAssets = ref({})
const myAssetsz = ref({})
_getassets().then(res => {
  myAssets.value = res
})
const todayMoney = ref({
  money_contract_profit_today: 0
})
_getContractBySymbolType().then(data => {
  todayMoney.value = data
})
const tabbers = [
  // { key: 1, name: t('跟单'), icon: new URL('@/assets/imgs/home/home_1.png', import.meta.url) },
@@ -288,7 +298,7 @@
    icon: new URL('@/assets/img/img_3.png', import.meta.url),
    icon2: new URL('@/assets/imgs/home/home_12b.png', import.meta.url),
    path: '/customerService'
  },{
  }, {
    key: 9,
    name: t('闪兑'),
    icon: new URL('@/assets/img/img_2.png', import.meta.url),
@@ -299,23 +309,17 @@
// 手风琴选中
const activeName = ref('0')
const todayMoney=ref({
  money_contract_profit_today:0
})
// tab切换
const tab = ref(1)
const current = ref(0)
const tabList = [
  {name: t('永续合约'), key: 1},
  {name: t('现货'), key: 2},
  { name: t('永续合约'), key: 1 },
  { name: t('现货'), key: 2 },
]
// 获取公告数据
const announceList = ref([])
_getContractBySymbolType().then(data => {
  todayMoney.value = data
})
_getNewsList1({
  language: useI18n().locale.value,
}).then(res => {
@@ -325,7 +329,7 @@
// 跳转公告详情
const toAnnounceDetail = (announceId) => {
  if (announceId) {
    router.push({path: '/cryptos/AnnounceDetail', query: {id: announceId}})
    router.push({ path: '/cryptos/AnnounceDetail', query: { id: announceId } })
  }
}
@@ -348,14 +352,14 @@
// 轮播图数据
const swipe1 = ref([
  {key: 1, img: new URL('@/assets/imgs/home/home_1.png', import.meta.url)},
  {key: 2, img: new URL('@/assets/imgs/home/home_2.png', import.meta.url)},
  {key: 3, img: new URL('@/assets/imgs/home/home_3.png', import.meta.url)},
  { key: 1, img: new URL('@/assets/imgs/home/home_1.png', import.meta.url) },
  { key: 2, img: new URL('@/assets/imgs/home/home_2.png', import.meta.url) },
  { key: 3, img: new URL('@/assets/imgs/home/home_3.png', import.meta.url) },
])
const swipe2 = ref([
  {key: 1, img: new URL('@/assets/imgs/home/home_1.png', import.meta.url)},
  {key: 2, img: new URL('@/assets/imgs/home/home_2.png', import.meta.url)},
  {key: 3, img: new URL('@/assets/imgs/home/home_3.png', import.meta.url)},
  { key: 1, img: new URL('@/assets/imgs/home/home_1.png', import.meta.url) },
  { key: 2, img: new URL('@/assets/imgs/home/home_2.png', import.meta.url) },
  { key: 3, img: new URL('@/assets/imgs/home/home_3.png', import.meta.url) },
])
//#region 行情数据----------------------------------------
@@ -432,7 +436,7 @@
    }
    .notice_content {
      & > div:first-child {
      &>div:first-child {
        color: $text_color1;
      }
    }
@@ -441,7 +445,7 @@
  .tabs {
    font-size: 1.8rem;
    & > div {
    &>div {
      margin-right: 2rem;
    }
  }