上一版是10.10的, 这版才是原始源码

admin

2026-01-06 42faef34194c466f03e29d75a63ae502e4213044

 src/views/usStock/Detail.vue

@@ -50,8 +50,8 @@
              <span class="value">{{ formatMoney(chartData?.open) }}</span>
            </p>
            <p class="flex">
              <span class="label">{{ $t("收") }}</span>
              <span class="value">{{ formatMoney(chartData?.close) }}</span>
              <span class="label">{{ $t("quantity") }}</span>
              <span class="value">{{ formatMoney(chartData?.volume) }}</span>
            </p>
            <!-- <p class="flex">
              <span class="label">{{ $t("Change") }}</span>
@@ -60,7 +60,7 @@
              }}</span>
            </p> -->
          </div>
          <!-- <div class="flex-r-item">
          <div class="flex-r-item">
            <p class="flex">
              <span class="label">{{ $t("Forehead") }}</span>
              <span class="value">{{ formatMoney(chartData?.volume) }}</span>
@@ -75,9 +75,9 @@
            </p>
            <p class="flex">
              <span class="label">{{ $t("amplitude") }}</span>
              <span class="value">{{ formatMoney(chartData?.amplitude) }}</span>
              <span class="value">{{ formatMoney(chartData?.changeRatio) }}</span>
            </p>
          </div> -->
          </div>
        </div>
      </section>
      <p class="status-info" v-if="chartData?.market?.status">
@@ -110,11 +110,11 @@
      </section>
      <section class="kline-container flex">
        <div class="chart-index">
          <fx-kline :height="400" :symbol="symbol" :isShowsolid="true" :chartType="chartType" v-if="symbol"
            @data="onData" :key="`${symbol}-${timeValue}`" />
          <fx-kline :height="400" :symbol="symbol" :isShowsolid="true" :chartType="chartType" v-if="symbol" @data="onData"
            :key="`${symbol}-${timeValue}`" />
        </div>
        <div class="order-book-container"
          v-if="timeLabelActive === -1 && !['HK-stocks', 'JP-stocks'].includes(symbolType)">
          v-if="timeLabelActive === 0 && !['HK-stocks', 'JP-stocks'].includes(symbolType)">
          <!-- <keep-alive>
            <trade-deep-data :symbol="symbol" v-if="symbol" :price="price" class="trade-deep-container" />
          </keep-alive> -->
@@ -127,7 +127,7 @@
              <div class="justify-between flex flex-1">
                <span :class="item.trade_volume >= 100 ? 'text-green' : 'text-red'">{{
                  item.current ?
                    Number(item.current).toFixed(3) : '--'
                  Number(item.current).toFixed(3) : '--'
                }}</span>
                <span class="text-right textColor" :class="item.trade_volume >= 100 ? 'text-green' : ''">{{
                  formatMoney(item?.trade_volume)
@@ -141,11 +141,11 @@
      <div class="all-etf-ranking">
        <div class="tabs flex">
          <div class="tab-item" v-for="(item, index) in tabList" @click="selectTabIndex(index, item.value)"
            :class="[tabIndex === item.value ? 'active' : '']" :key="item">
            :class="[tabIndex === index ? 'active' : '']" :key="item">
            {{ item.title }}
          </div>
        </div>
        <!-- <F10Details :details="details" v-if="tabIndex === 0" /> -->
        <F10Details :details="details" v-if="tabIndex === 0" />
        <div class="new-trade" v-if="tabIndex === 1">
          <ul class="px-12 text-grey">
            <li class="flex justify-between mt-30">
@@ -278,7 +278,7 @@
const active = ref(0)
const timeLabelActive = ref(0)
const chartType = ref('')
const tabIndex = ref(1)
const tabIndex = ref(0)
const constituentList = ref([])
const isConstituent = ref(false)
const price = ref('')
@@ -303,7 +303,7 @@
const bids = ref(arr)

const tabList = route.query.symbolType === 'US-stocks' ? ref([
  // { title: t('ProfileF10'), value: 0 },
  { title: t('ProfileF10'), value: 0 },
  { title: t('最新交易'), value: 1 },
  { title: t('深度图'), value: 2 },
]) : ref([
@@ -311,46 +311,22 @@
])

const filterOne = ref([
  { name: '1' + t('分'), paramsValue: '1', seconds: 1 * 60 * 1000, index: 12, },
  { name: '1' + t('周'), paramsValue: 'W', seconds: 7 * 24 * 60 * 60 * 1000, index: 2, },
  { name: '1' + t('月'), paramsValue: 'M', seconds: 30 * 24 * 60 * 60 * 1000, index: 3, },
  { name: '1' + t('天'), paramsValue: 'D', seconds: 1 * 24 * 60 * 60 * 1000, index: 4, },

  // 乱序的
  // { name: "1" + t("分"), paramsValue: "1day", seconds: 1 * 60 * 1000, index: 12 },
  // { name: "15" + t("分"), paramsValue: "1week", seconds: 15 * 60 * 1000, index: 10 },
  // { name: "30" + t("分"), paramsValue: "1mon", seconds: 30 * 60 * 1000, index: 9 },
  // { name: "120" + t("分"), paramsValue: "1quarter", seconds: 2 * 60 * 60 * 1000, index: 7 },

  // {
  //   name: "1" + t("天"),
  //   paramsValue: "1year",
  //   seconds: 1 * 24 * 60 * 60 * 1000,
  //   index: 1,
  // },
  // 原本的
  // { name: t('分时'), paramsValue: 'timeSharing', seconds: 1 * 60 * 1000, index: 0, },
  // { name: '1' + t('天'), paramsValue: '1day', seconds: 1 * 24 * 60 * 60 * 1000, index: 1, },
  // { name: '1' + t('周'), paramsValue: '1week', seconds: 7 * 24 * 60 * 60 * 1000, index: 2, },
  // { name: '1' + t('月'), paramsValue: '1mon', seconds: 30 * 24 * 60 * 60 * 1000, index: 3, },
  // { name: '5' + t('天'), paramsValue: '5day', seconds: 5 * 24 * 60 * 60 * 1000, index: 4, },
  // { name: t('season'), paramsValue: '1quarter', seconds: 3 * 30 * 24 * 60 * 60 * 1000, index: 5, },
  // { name: t('Year'), paramsValue: '1year', seconds: 12 * 30 * 24 * 60 * 60 * 1000, index: 6, },
  { name: t('分时'), paramsValue: 'timeSharing', seconds: 1 * 60 * 1000, index: 0, },
  { name: '1' + t('天'), paramsValue: '1day', seconds: 1 * 24 * 60 * 60 * 1000, index: 1, },
  { name: '1' + t('周'), paramsValue: '1week', seconds: 7 * 24 * 60 * 60 * 1000, index: 2, },
  { name: '1' + t('月'), paramsValue: '1mon', seconds: 30 * 24 * 60 * 60 * 1000, index: 3, },
  { name: '5' + t('天'), paramsValue: '5day', seconds: 5 * 24 * 60 * 60 * 1000, index: 4, },
  { name: t('season'), paramsValue: '1quarter', seconds: 3 * 30 * 24 * 60 * 60 * 1000, index: 5, },
  { name: t('Year'), paramsValue: '1year', seconds: 12 * 30 * 24 * 60 * 60 * 1000, index: 6, },
])

const filterTwo = ref([
  { name: '60' + t('分'), paramsValue: '60', seconds: 60 * 60 * 1000, index: 7, },
  { name: '45' + t('分'), paramsValue: '45', seconds: 45 * 60 * 1000, index: 8, },
  { name: '30' + t('分'), paramsValue: '30', seconds: 30 * 60 * 1000, index: 9, },
  { name: '15' + t('分'), paramsValue: '15', seconds: 15 * 60 * 1000, index: 10, },
  { name: '5' + t('分'), paramsValue: '5', seconds: 5 * 60 * 1000, index: 11, },
  // 原本的
  // { name: '120' + t('分'), paramsValue: '120min', seconds: 2 * 60 * 60 * 1000, index: 7, },
  // { name: '60' + t('分'), paramsValue: '60min', seconds: 1 * 60 * 60 * 1000, index: 8, },
  // { name: '30' + t('分'), paramsValue: '30min', seconds: 30 * 60 * 1000, index: 9, },
  // { name: '15' + t('分'), paramsValue: '15min', seconds: 15 * 60 * 1000, index: 10, },
  // { name: '5' + t('分'), paramsValue: '5min', seconds: 5 * 60 * 1000, index: 11, },
  // { name: '1' + t('分'), paramsValue: '1min', seconds: 1 * 60 * 1000, index: 12, },
  { name: '120' + t('分'), paramsValue: '120min', seconds: 2 * 60 * 60 * 1000, index: 7, },
  { name: '60' + t('分'), paramsValue: '60min', seconds: 1 * 60 * 60 * 1000, index: 8, },
  { name: '30' + t('分'), paramsValue: '30min', seconds: 30 * 60 * 1000, index: 9, },
  { name: '15' + t('分'), paramsValue: '15min', seconds: 15 * 60 * 1000, index: 10, },
  { name: '5' + t('分'), paramsValue: '5min', seconds: 5 * 60 * 1000, index: 11, },
  { name: '1' + t('分'), paramsValue: '1min', seconds: 1 * 60 * 1000, index: 12, },
])

const leftIcon = new URL(`../../assets/theme/${thStore.theme}/image/black-convert.png`, import.meta.url)
@@ -378,9 +354,9 @@
  getIsItemHasAddGlobal()
  // 默认日k
  handleClickSelectTime({
    paramsValue: '1',
    seconds: 1 * 60 * 1000,
    index: 12
    paramsValue: 'timeSharing',
    seconds: 1 * 24 * 60 * 60 * 1000,
    index: 0
  })
})

@@ -405,44 +381,8 @@
  }
})

const startAskBidSocket = () => { // 委托和深度
  sockets.value.askBid = new WebSocket(`${WS_URL}/3/${symbol.value}`)
  sockets.value.askBid.onmessage = (evt) => {
    const { data } = evt
    const { code, data: _data } = JSON.parse(data)
    if (code / 1 === 0) {
      deepBuy.value = _data.bids
      deepSell.value = _data.asks
      _data.asks = _data.asks.sort((prev, next) => prev.price - next.price)
      _data.bids = _data.bids.sort((prev, next) => prev.price - next.price)
      asks.value = _data.asks.slice(0, 17)
      bids.value = _data.bids.reverse().slice(0, 17)
    }
  }
}
const startDealsSocket = () => { // 交易
  sockets.value.deals = new WebSocket(`${WS_URL}/3/${symbol.value}`)
  sockets.value.deals.onmessage = (evt) => {
    const { data } = evt
    const { code, data: _data } = JSON.parse(data)
    // todo: 数据有些问题
    if (code / 1 === 0) {
      // deals.value = _data.data.slice(0, 17)
      let buys = _data.bids.map(item => {
        item.direction = 'buy'
        return item
      })
      let sells = _data.asks.map(item => {
        item.direction = 'sell'
        return item
      })
      deals.value = [...buys.slice(0, 8), ...sells.slice(0, 9)]
    }
  }
}

watch([tabIndex, symbol], ([val, val2]) => {
  if (val / 1 === 0 || val / 1 === 2) {
  if (val / 1 === 0) {
    sockets.value.deals && sockets.value.deals.close()
    sockets.value.deals = null
    if (val2) { // 刚进来可能是null
@@ -458,6 +398,32 @@
  immediate: true
})

const startAskBidSocket = () => { // 委托
  sockets.value.askBid = new WebSocket(`${WS_URL}/3/${symbol.value}`)
  sockets.value.askBid.onmessage = (evt) => {
    const { data } = evt
    const { code, data: _data } = JSON.parse(data)
    if (code / 1 === 0) {
      deepBuy.value = _data.bids
      deepSell.value = _data.asks
      _data.asks = _data.asks.sort((prev, next) => prev.price - next.price)
      _data.bids = _data.bids.sort((prev, next) => prev.price - next.price)
      asks.value = _data.asks.slice(0, 17)
      bids.value = _data.bids.reverse().slice(0, 17)
    }
  }
}
const startDealsSocket = () => { // 交易
  sockets.value.deals = new WebSocket(`${WS_URL}/2/${symbol.value}`)
  sockets.value.deals.onmessage = (evt) => {
    const { data } = evt
    const { code, data: _data } = JSON.parse(data)
    // todo: 数据有些问题
    if (code / 1 === 0) {
      deals.value = _data.data.slice(0, 17)
    }
  }
}

const closeSocket = () => {
  sockets.value.quote && sockets.value.quote.close()
@@ -606,14 +572,10 @@

// 事件
const onData = (data) => {
  console.log("dataaaaa", data);

  chartData.value = data
  // symbolType.value = data?.type
}
const fetchQuotes = () => {
  // console.log("quotesStore", quotesStore.coins);

  _getQuotes(quotesStore.coins).then(data => {
    data.map(item => {
      item.name = item.symbol
@@ -652,7 +614,7 @@
}

const selectTabIndex = (index, value) => {
  tabIndex.value = value
  tabIndex.value = index
}

const handleClickMoreBtn = () => {