1
PC-20250623MANY\Administrator
2025-08-18 fbe4c23b9a0316937bc63213c910cbb393d6bc65
src/page/kline/components/kLine.vue
@@ -6,27 +6,60 @@
          <div class="periodWrap kline_periodWrap" ref="kline_periodWrap">
            <!-- DWM 分 -->
            <div class="btnGroup" style="position: relative">
              <div class="btn2" v-for="(item, index) in KLinePeriodMenu" :class="{ active: KLinePeriodIndex == index }"
                :key="item.ID" @click="OnClickKLinePeriodMenu(index, item, 'kline')">
              <div
                class="btn2"
                v-for="(item, index) in KLinePeriodMenu"
                :class="{ active: KLinePeriodIndex == index }"
                :key="item.ID"
                @click="OnClickKLinePeriodMenu(index, item, 'kline')"
              >
                <span>{{ item.Name }}</span>
              </div>
              <div style="position: absolute; right: 0; top: 25px; z-index: 99" v-if="isShow == true">
                <div class="btnGroup" v-show="IsShowRightMenu" style="display: flex; flex-direction: column">
                  <div class="btn" :class="{ active: KLineRightIndex == index }" v-for="(item, index) in KLineRightMenu"
                    :key="item.ID" style="padding: 10px" @click="OnClickKLineRightMenu(index, item)">
              <div
                style="position: absolute; right: 0; top: 25px; z-index: 99"
                v-if="isShow == true"
              >
                <div
                  class="btnGroup"
                  v-show="IsShowRightMenu"
                  style="display: flex; flex-direction: column"
                >
                  <div
                    class="btn"
                    :class="{ active: KLineRightIndex == index }"
                    v-for="(item, index) in KLineRightMenu"
                    :key="item.ID"
                    style="padding: 10px"
                    @click="OnClickKLineRightMenu(index, item)"
                  >
                    {{ item.Name }}
                  </div>
                  <div class="btn" v-for="item in KLineIndexMenu" :key="item.ID" style="padding: 10px"
                    @click="ChangeKLineIndex(item)">
                  <div
                    class="btn"
                    v-for="item in KLineIndexMenu"
                    :key="item.ID"
                    style="padding: 10px"
                    @click="ChangeKLineIndex(item)"
                  >
                    {{ item.Name }}
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="hqchart" id="hqchart_minute" ref="kline" v-show="chartType == 'minute'"></div>
          <div class="hqchart" id="hqchart_kline" ref="kline2" v-show="chartType == 'kline'"></div>
          <div
            class="hqchart"
            id="hqchart_minute"
            ref="kline"
            v-show="chartType == 'minute'"
          ></div>
          <div
            class="hqchart"
            id="hqchart_kline"
            ref="kline2"
            v-show="chartType == 'kline'"
          ></div>
        </div>
      </div>
    </div>
@@ -58,7 +91,7 @@
      // { Index:"KDJ", Modify: false, Change: true, Close: true},
      // { Index: "KDJ", Modify: false, Change: false, Close: false }
    ],
    SplashTitle: 'loading...',
    SplashTitle: "loading...",
    Symbol: "AAPL.usa",
    IsAutoUpdate: true, // 是自动更新数据
    AutoUpdateFrequency: 20000,
@@ -919,7 +952,7 @@
      }
      // { Index: 'MACD', Modify: true, Change: true, Close: false }
    ],
    SplashTitle: 'loading...',
    SplashTitle: "loading...",
    Symbol: "600015.sh",
    IsAutoUpdate: true, // 是自动更新数据
    AutoUpdateFrequency: 15000,
@@ -1221,8 +1254,9 @@
    SetChartStyle() {
      EastMoney.HQData.SetMinuteChartCoordinate();
      var blackStyle = HQChart.Chart.HQChartStyle.GetStyleConfig(
        HQChart.Chart.STYLE_TYPE_ID.WHITE_ID
      ); // 读取黑色风格配置
        // HQChart.Chart.STYLE_TYPE_ID.WHITE_ID // 白色风格
        HQChart.Chart.STYLE_TYPE_ID.BLACK_ID // 黑色风格
      );
      blackStyle.UpBarColor = "#449b54"; //上涨
      blackStyle.DownBarColor = "#e13b45";
@@ -1251,8 +1285,6 @@
      option.NetworkFilter = (data, callback) => {
        this.NetworkFilter(data, callback);
        // this.NetworkFilter(data, callback);
      }; // 网络请求回调函数
      var chart = HQChart.Chart.JSChart.Init(this.$refs.kline2);
      HQChart.Chart.JSChart.GetResource().FrameLogo.Text = null;
@@ -1332,7 +1364,12 @@
        clearInterval(this.timerss);
        this.timerss = null;
      }
      this.getFilter(data, callback);
      this.timerss = setInterval(() => {
        this.getFilter(data, callback);
      }, 5000);
    },
    getFilter(data, callback) {
        switch (data.Name) {
          // 分时图数据对接
          case "MinuteChartContainer::RequestMinuteData":
@@ -1358,9 +1395,7 @@
            EastMoney.HQData.NetworkFilter(data, callback);
            break;
        }
      }, 5000);
    },
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
      this.ChangeSymbol(keyPath[1]);
@@ -1479,9 +1514,9 @@
    .btnGroup {
      // border: 1px solid #242424;
      color: #000;
      color: #fff;
      display: flex;
      background: #fff;
      // background: #fff;
      .btn {
        margin: 0 0.1rem;
@@ -1499,7 +1534,7 @@
      .active {
        color: #c4d600;
        font-weight: 800;
        background: rgb(245, 245, 245);
        background: #444;
      }
    }
@@ -1514,14 +1549,14 @@
    #hqchart_minute {
      // height: 100%;
      background-color: #fff;
      background-color: #000;
      height: 5rem;
      position: relative;
    }
    #hqchart_kline {
      // height: 100% !important;
      background-color: #fff;
      background-color: #000;
      height: 5rem;
      position: relative;
    }
@@ -1546,7 +1581,7 @@
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff !important;
  // background: #fff !important;
}
.btnGroup {