1

PC-20250623MANY\Administrator

2025-08-30 9f5adc78ec0e386684a12f3b4f26a0fff4a3286f

 src/views/home/components/HomeLtr.vue

@@ -91,10 +91,10 @@
      // { Index:"KDJ", Modify: false, Change: true, Close: true},
      // { Index: "KDJ", Modify: false, Change: false, Close: false }
    ],
    SplashTitle: "loading...",

    Symbol: "AAPL.usa",
    IsAutoUpdate: true, // 是自动更新数据
    AutoUpdateFrequency: 1000,
    AutoUpdateFrequency: 20000,
    DayCount: 1, // 1 最新交易日数据 >1 多日走势图
    IsShowRightMenu: false, // 是否显示右键菜单
    CorssCursorTouchEnd: true,
@@ -146,6 +146,791 @@
  return option;
};

DefaultData.GetMinuteIndexMenu = function () {
  var data = [
    {
      Name: "MACD",
      ID: "MACD",
      WindowIndex: 2,
    },
    {
      Name: "KDJ",
      ID: "KDJ",
      WindowIndex: 2,
    },
    {
      Name: "DMI",
      ID: "DMI",
      WindowIndex: 2,
    },
    {
      Name: "ROC",
      ID: "ROC",
      WindowIndex: 2,
    },
  ];

  return data;
};

DefaultData.GetKLineIndexMenu = function () {
  var data = [
    {
      Name: "MA",
      ID: "MA",
      WindowIndex: 0,
    },
    {
      Name: "BOLL",
      ID: "BOLL",
      WindowIndex: 0,
    },
    {
      Name: "MACD",
      ID: "MACD",
      WindowIndex: 1,
    },
    {
      Name: "KDJ",
      ID: "KDJ",
      WindowIndex: 1,
    },
    {
      Name: "DMI",
      ID: "DMI",
      WindowIndex: 1,
    },
    {
      Name: "ROC",
      ID: "ROC",
      WindowIndex: 1,
    },
  ];

  return data;
};

DefaultData.GetTestSymbolMenu = function () {
  // 品种代码规则 ${东方财富品种代码}_${东方财富市场}.${HQChart内部市场后缀}
  var data = [
    {
      Title: "美股",
      Icon: "",
      Sub: [
        {
          Name: "网易",
          Code: "NTES_105.usa",
        },
        {
          Name: "微软",
          Code: "MSFT_105.usa",
        },
        {
          Name: "亚马逊",
          Code: "AMZN_105.usa",
        },
        {
          Name: "人人网",
          Code: "RENN_106.usa",
        },
        {
          Name: "滴滴",
          Code: "DIDI_106.usa",
        },
        {
          Name: "阿里巴巴",
          Code: "BABA_106.usa",
        },
        {
          Name: "知乎",
          Code: "ZH_106.usa",
        },
        {
          Name: "道琼斯",
          Code: "DJIA_100.usa",
        },
        {
          Name: "标普500",
          Code: "SPX_100.usa",
        },
        {
          Name: "纳斯达克",
          Code: "NDX_100.usa",
        },
      ],
    },
    {
      Title: "沪深A股",
      Icon: "",
      Sub: [
        {
          Name: "浦发银行",
          Code: "600000_1.sh",
        },
        {
          Name: "东方财富",
          Code: "300059_0.sz",
        },
        {
          Name: "上证指数",
          Code: "000001_1.sh",
        },
        {
          Name: "深证成指",
          Code: "399001_0.sz",
        },
      ],
    },
    {
      Title: "北交所",
      Icon: "",
      Sub: [
        {
          Name: "凯添燃气",
          Code: "831010_0.bj",
        },
        {
          Name: "驱动力",
          Code: "838275_0.bj",
        },
        {
          Name: "齐鲁华信",
          Code: "830832_0.bj",
        },
        {
          Name: "苏轴股份",
          Code: "430418_0.bj",
        },
      ],
    },
    {
      Title: "ETF基金",
      Icon: "",
      Sub: [
        {
          Name: "50ETF基金",
          Code: "510800_1.sh",
        },
        {
          Name: "上证180ETF",
          Code: "510180_1.sh",
        },
        {
          Name: "恒生ETF",
          Code: "159920_0.sz",
        },
        {
          Name: "创业板50ETF",
          Code: "159949_0.sz",
        },
      ],
    },
    {
      Title: "港股",
      Icon: "",
      Sub: [
        {
          Name: "比亚迪股份",
          Code: "01211_116.hk",
        },
        {
          Name: "招商银行",
          Code: "03968_116.hk",
        },
        {
          Name: "汇丰控股",
          Code: "00005_116.hk",
        },
        {
          Name: "长和",
          Code: "00001_116.hk",
        },
        {
          Name: "恒生指数",
          Code: "HSI_100.hk",
        },
      ],
    },
    {
      Title: "外汇",
      Icon: "",
      Sub: [
        {
          Name: "美元兑加元",
          Code: "USDCAD_119.FOREX",
        },
        {
          Name: "美元兑港币",
          Code: "USDHKD_119.FOREX",
        },
        {
          Name: "美元兑欧元",
          Code: "USDEUR_119.FOREX",
        },
        {
          Name: "欧元兑英镑",
          Code: "EURGBP_119.FOREX",
        },
        {
          Name: "美元指数",
          Code: "UPI_100.ET",
        },
      ],
    },
    {
      Title: "上海期货交易所",
      Icon: "",
      Sub: [
        {
          Name: "沪铜主力",
          Code: "CUM_113.SHFE",
        },
        {
          Name: "沪锡主力",
          Code: "SNM_113.SHFE",
        },
        {
          Name: "沪金主力",
          Code: "AUM_113.SHFE",
        },
        {
          Name: "沪镍主力",
          Code: "NIM_113.SHFE",
        },
        {
          Name: "橡胶主力",
          Code: "RUM_113.SHFE",
        },
        {
          Name: "螺纹钢主力",
          Code: "RBM_113.SHFE",
        },
        {
          Name: "沪银主力",
          Code: "AGM_113.SHFE",
        },
        {
          Name: "线材主力",
          Code: "WRM_113.SHFE",
        },
        {
          Name: "沪铅主力",
          Code: "PBM_113.SHFE",
        },
        {
          Name: "沪锌主力",
          Code: "ZNM_113.SHFE",
        },
        {
          Name: "石油沥青主力",
          Code: "BUM_113.SHFE",
        },
        {
          Name: "沪铝主力",
          Code: "ALM_113.SHFE",
        },
        {
          Name: "燃油主力",
          Code: "FUM_113.SHFE",
        },
        {
          Name: "热轧卷板主力",
          Code: "HCM_113.SHFE",
        },
        {
          Name: "纸浆主力",
          Code: "SPM_113.SHFE",
        },
        {
          Name: "不锈钢主力",
          Code: "SSM_113.SHFE",
        },
      ],
    },
    {
      Title: "上海国际能源交易中心",
      Icon: "",
      Sub: [
        {
          Name: "原油主力",
          Code: "SCM_142.SHFE",
        },
        {
          Name: "20号胶主力",
          Code: "NRM_142.SHFE",
        },
        {
          Name: "低硫燃油主力",
          Code: "LUM_142.SHFE",
        },
        {
          Name: "国际铜主力",
          Code: "BCM_142.SHFE",
        },
      ],
    },
    {
      Title: "大连商品交易所",
      Icon: "",
      Sub: [
        {
          Name: "玉米主力",
          Code: "CM_114.DCE",
        },
        {
          Name: "豆一主力",
          Code: "AM_114.DCE",
        },
        {
          Name: "豆二主力",
          Code: "BM_114.DCE",
        },
        {
          Name: "豆粕主力",
          Code: "MM_114.DCE",
        },
        {
          Name: "豆油主力",
          Code: "YM_114.DCE",
        },
        {
          Name: "棕榈油主力",
          Code: "PM_114.DCE",
        },
        {
          Name: "聚乙烯主力",
          Code: "LM_114.DCE",
        },
        {
          Name: "聚氯乙烯主力",
          Code: "VM_114.DCE",
        },

        {
          Name: "焦炭主力",
          Code: "JM_114.DCE",
        },
        {
          Name: "焦煤主力",
          Code: "JMM_114.DCE",
        },
        {
          Name: "纤维板主力",
          Code: "FBM_114.DCE",
        },
        {
          Name: "胶合板主力",
          Code: "BBM_114.DCE",
        },
        {
          Name: "铁矿石主力",
          Code: "IM_114.DCE",
        },
        {
          Name: "鸡蛋主力",
          Code: "JDM_114.DCE",
        },

        {
          Name: "聚丙烯主力",
          Code: "PPM_114.DCE",
        },
        {
          Name: "玉米淀粉主力",
          Code: "CSM_114.DCE",
        },
        {
          Name: "乙二醇主力",
          Code: "EGM_114.DCE",
        },
        {
          Name: "粳米主力",
          Code: "RRM_114.DCE",
        },
        {
          Name: "苯乙烯主力",
          Code: "EBM_114.DCE",
        },
        {
          Name: "LPG主力",
          Code: "PGM_114.DCE",
        },
        {
          Name: "生猪主力",
          Code: "LHM_114.DCE",
        },
      ],
    },
    {
      Title: "郑州商品交易所",
      Icon: "",
      Sub: [
        {
          Name: "强麦主力",
          Code: "WHM_115.CZC",
        },
        {
          Name: "普麦主力",
          Code: "PMM_115.CZC",
        },
        {
          Name: "一号棉花主力",
          Code: "CFM_115.CZC",
        },
        {
          Name: "白糖主力",
          Code: "SRM_115.CZC",
        },
        {
          Name: "PTA主力",
          Code: "TAM_115.CZC",
        },
        {
          Name: "菜油主力",
          Code: "OIM_115.CZC",
        },
        {
          Name: "早籼稻主力",
          Code: "RIM_115.CZC",
        },
        {
          Name: "甲醇主力",
          Code: "MAM_115.CZC",
        },
        {
          Name: "玻璃主力",
          Code: "FGM_115.CZC",
        },
        {
          Name: "菜籽主力",
          Code: "RSM_115.CZC",
        },
        {
          Name: "菜粕主力",
          Code: "RMM_115.CZC",
        },
        {
          Name: "粳稻主力",
          Code: "JRM_115.CZC",
        },
        {
          Name: "晚籼稻主力",
          Code: "LRM_115.CZC",
        },
        {
          Name: "硅铁主力",
          Code: "SFM_115.CZC",
        },
        {
          Name: "锰硅主力",
          Code: "SMM_115.CZC",
        },
        {
          Name: "动力煤主力",
          Code: "ZCM_115.CZC",
        },
        {
          Name: "棉纱主力",
          Code: "CYM_115.CZC",
        },
        {
          Name: "苹果主力",
          Code: "APM_115.CZC",
        },
        {
          Name: "红枣主力",
          Code: "CJM_115.CZC",
        },
        {
          Name: "尿素主力",
          Code: "URM_115.CZC",
        },
        {
          Name: "纯碱主力",
          Code: "SAM_115.CZC",
        },
        {
          Name: "短纤主力",
          Code: "PFM_115.CZC",
        },
        {
          Name: "花生主力",
          Code: "PKM_115.CZC",
        },
      ],
    },
    {
      Title: "中国金融期货交易所",
      Icon: "",
      Sub: [
        {
          Name: "二债主力",
          Code: "TS-130130_8.CFE",
        },
        {
          Name: "五债主力",
          Code: "TF-050130_8.CFE",
        },
        {
          Name: "十债主力",
          Code: "T-110130_8.CFE",
        },
        {
          Name: "上证主力",
          Code: "IH-070130_8.CFE",
        },
        {
          Name: "中证主力",
          Code: "IC-060130_8.CFE",
        },
        {
          Name: "沪深主力",
          Code: "IF-040130_8.CFE",
        },
      ],
    },
    {
      Title: "芝加哥商业交易所",
      Icon: "",
      Sub: [
        {
          Name: "小麦当月连续",
          Code: "ZW00Y_103.CBOT",
        },
        {
          Name: "迷你小麦当月连续",
          Code: "XW00Y_103.CBOT",
        },
        {
          Name: "玉米当月连续",
          Code: "ZC00Y_103.CBOT",
        },
        {
          Name: "迷你玉米当月连续",
          Code: "XC00Y_103.CBOT",
        },
        {
          Name: "大豆当月连续",
          Code: "ZS00Y_103.CBOT",
        },
        {
          Name: "迷你大豆当月连续",
          Code: "XK00Y_103.CBOT",
        },
        {
          Name: "豆油当月连续",
          Code: "ZL00Y_103.CBOT",
        },
        {
          Name: "豆粕当月连续",
          Code: "ZM00Y_103.CBOT",
        },
        {
          Name: "燕麦当月连续",
          Code: "ZO00Y_103.CBOT",
        },
        {
          Name: "稻谷当月连续",
          Code: "ZR00Y_103.CBOT",
        },

        {
          Name: "小型纳指当月连续",
          Code: "NQ00Y_103.CBOT",
        },
        {
          Name: "小型标普当月连续",
          Code: "ES00Y_103.CBOT",
        },
        {
          Name: "小型道指当月连续",
          Code: "YM00Y_103.CBOT",
        },

        {
          Name: "2年美国债当月连续",
          Code: "TU00Y_103.CBOT",
        },
        {
          Name: "5年美国债当月连续",
          Code: "FV00Y_103.CBOT",
        },
        {
          Name: "10年美国债当月连续",
          Code: "TY00Y_103.CBOT",
        },
        {
          Name: "30年美国债当月连续",
          Code: "US00Y_103.CBOT",
        },
        {
          Name: "超国债当月连续",
          Code: "UL00Y_103.CBOT",
        },
      ],
    },
    {
      Title: "纽约商品交易所",
      Icon: "",
      Sub: [
        {
          Name: "NYMEX原油",
          Code: "CL00Y_102.NYMEX",
        },
        {
          Name: "NYMEX铂金",
          Code: "PL00Y_102.NYMEX",
        },
        {
          Name: "迷你原油",
          Code: "QM00Y_102.NYMEX",
        },
        {
          Name: "NYMEX燃油",
          Code: "HO00Y_102.NYMEX",
        },
        {
          Name: "NYMEX汽油",
          Code: "RB00Y_102.NYMEX",
        },
        {
          Name: "NYMEX钯金",
          Code: "PA00Y_102.NYMEX",
        },
        {
          Name: "热轧钢卷",
          Code: "HR00Y_102.NYMEX",
        },
        {
          Name: "天然气",
          Code: "NG00Y_102.NYMEX",
        },
      ],
    },
    {
      Title: "纽约商业期货交易所",
      Icon: "",
      Sub: [
        {
          Name: "COMEX白银",
          Code: "SI00Y_101.COMEX",
        },
        {
          Name: "迷你白银",
          Code: "QI00Y_101.COMEX",
        },
        {
          Name: "微型黄金",
          Code: "MGC00Y_101.COMEX",
        },
        {
          Name: "迷你黄金",
          Code: "QO00Y_101.COMEX",
        },
        {
          Name: "COMEX黄金",
          Code: "GC00Y_101.COMEX",
        },
        {
          Name: "COMEX铜",
          Code: "HG00Y_101.COMEX",
        },
      ],
    },
    {
      Title: "纽约期货交易所",
      Icon: "",
      Sub: [
        {
          Name: "棉花当月连续",
          Code: "CT00Y_108.NYBOT",
        },
      ],
    },
    {
      Title: "伦敦金属交易所",
      Icon: "",
      Sub: [
        {
          Name: "综合镍03",
          Code: "NI-LNKT_109.LME",
        },
        {
          Name: "综合铜03",
          Code: "CA-LCPT_109.LME",
        },
        {
          Name: "综合铝03",
          Code: "AH-LALT_109.LME",
        },
        {
          Name: "综合锡03",
          Code: "SN-LTNT_109.LME",
        },
        {
          Name: "综合锌03",
          Code: "ZS-LZNT_109.LME",
        },
        {
          Name: "综合铅03",
          Code: "PB-LLDT_109.LME",
        },
      ],
    },
    {
      Title: "东京商品交易所",
      Icon: "",
      Sub: [
        {
          Name: "日铂金当月连续",
          Code: "JPL00Y_111.TOCOM",
        },
        {
          Name: "日白银当月连续",
          Code: "JAG00Y_111.TOCOM",
        },
        {
          Name: "日原油当月连续",
          Code: "JCO00Y_111.TOCOM",
        },
        {
          Name: "日煤油当月连续",
          Code: "JKE00Y_111.TOCOM",
        },
        {
          Name: "日橡胶当月连续",
          Code: "JRU00Y_111.TOCOM",
        },
        {
          Name: "日黄金当月连续",
          Code: "JAU00Y_111.TOCOM",
        },
        {
          Name: "日汽油当月连续",
          Code: "JGL00Y_111.TOCOM",
        },
      ],
    },
    {
      Title: "美国洲际交易所",
      Icon: "",
      Sub: [
        {
          Name: "布伦特原油当月连续",
          Code: "B00Y_112.IPE",
        },
        {
          Name: "重柴油当月连续",
          Code: "G00Y_112.IPE",
        },
      ],
    },
  ];

  return data;
};

// k形图
DefaultData.GetKLineOption = function () {
  var option = {
    Type: "历史K线图", // 创建图形类型
@@ -167,13 +952,13 @@
      },
      // { Index: 'MACD', Modify: true, Change: true, Close: false }
    ],
    SplashTitle: "loading...",
    // Symbol: "600015.sh",
    Symbol: "",
    IsAutoUpdate: false, // 是自动更新数据
    AutoUpdateFrequency: 2000,
    IsApiPeriod: true,
    IsShowRightMenu: false, // 是否显示右键菜单
    CorssCursorTouchEnd: true,
    // CorssCursorTouchEnd:true,

    KLine: {
      DragMode: 1, // 拖拽模式 0 禁止拖拽 1 数据拖拽 2 区间选择
@@ -243,8 +1028,37 @@
  return option;
};

DefaultData.GetMinuteDayMenu = function () {
  var data = [
    {
      Name: "1D",
      ID: 1,
    },
    {
      Name: "2D",
      ID: 2,
    },
    {
      Name: "3D",
      ID: 3,
    },
    {
      Name: "4D",
      ID: 4,
    },
    {
      Name: "5D",
      ID: 5,
    },
  ];

  return data;
};

DefaultData.GetKLinePeriodMenu = function () {
  var data = [
    // { Name: i18n.t('hj86'), ID: 3 },分时额外处理
    // { Name: i18n.t("hj86"), ID: 4 },
    {
      Name: i18n.t("hj87"),
      ID: 0,
@@ -274,6 +1088,25 @@
  return data;
};

DefaultData.GetKLineRightMenu = function () {
  var data = [
    {
      Name: i18n.t("hj93"),
      ID: 0,
    },
    {
      Name: i18n.t("hj94"),
      ID: 1,
    },
    {
      Name: i18n.t("hj95"),
      ID: 2,
    },
  ];

  return data;
};

export default {
  name: "HomeLtr",
  props: {
@@ -293,15 +1126,25 @@
      chartType: "kline",
      KLineChart: null, // 图形控件  K线图
      Chart: null, // 图形控件  分时图
      timerss: null,
      timerss1: null,
      timerss2: null,
      isShow: false,
      MinuteDayMenu: DefaultData.GetMinuteDayMenu(),
      KLineRightMenu: DefaultData.GetKLineRightMenu(),
      MinuteIndexMenu: DefaultData.GetMinuteIndexMenu(),
      KLineIndexMenu: DefaultData.GetKLineIndexMenu(),
      Symbol: "", // HQChart内部编码美股加后缀.usa AAPL.usa
      NavMenuAry: DefaultData.GetTestSymbolMenu(),
      VolChartHeight: 10,
    };
  },
  watch: {
    obj: {
      handler(newVal, oldVal) {
        if (newVal.id && newVal.id != oldVal.id) {
          this.KLineChart.ChangeSymbol(newVal.code + ".sz");
          this.clearTime(); // 清除所有定时器
          this.KLineChart.ChangeSymbol(newVal.code);
          this.Chart.ChangeSymbol(newVal.code);
        }
      },
      deep: true,
@@ -313,11 +1156,30 @@
  beforeDestroy() {
    this.KLineChart.ChartDestory();
    this.Chart.ChartDestory();
    if (this.timerss) {
      clearInterval(this.timerss);
    if (this.timerss1) {
      clearInterval(this.timerss1);
    }
    if (this.timerss2) {
      clearInterval(this.timerss2);
    }
    this.clearTime();
  },
  methods: {
    handleClick(tab) {
      this.clearTime(); // 清除所有定时器
      this.KLineChart.ChangePeriod(tab.$attrs.Id);
      this.Chart.ChangePeriod(tab.$attrs.Id);
    },
    // 清除所有定时器
    clearTime() {
      // 创建一个额外的定时器以获取当前最大定时器 ID
      let lastIntervalId = setInterval(() => {}, 1000);
      // 遍历并清除所有定时器
      for (let i = 1; i <= lastIntervalId; i++) {
        clearInterval(i);
        clearTimeout(i);
      }
    },
    init() {
      this.OnSize();
      this.SetChartStyle();
@@ -325,12 +1187,6 @@
      this.$nextTick(() => {
        // this.CreateMinuteChart();
        this.CreateKLineChart();

        this.timerss = setInterval(() => {
          if (this.KLineChart) {
            this.KLineChart.ChangeSymbol(this.obj.code);
          }
        }, 30000);
      });
      let that = this;
      window.onresize = _.debounce(this.OnSize, 200);
@@ -385,15 +1241,11 @@
      blackStyle.DownBarColor = "#e13b45";
      HQChart.Chart.JSChart.SetStyle(blackStyle);
    },
    handleClick(tab) {
      this.KLineChart.ChangePeriod(tab.$attrs.Id);
    },

    CreateMinuteChart() {
      var option = DefaultData.GetMinuteOption();
      option.NetworkFilter = (data, callback) => {
        // console.log("CreateMinuteChart", data, callback);
        this.NetworkFilter(data, callback);
        this.NetworkFilter2(data, callback);
      }; // 网络请求回调函数

      var chart = HQChart.Chart.JSChart.Init(this.$refs.kline);
@@ -407,7 +1259,7 @@
      HQChart.Chart.JSChart.GetResource().FrameLogo.Text = null;

      option.NetworkFilter = (data, callback) => {
        this.NetworkFilter(data, callback);
        this.NetworkFilter1(data, callback);
      }; // 网络请求回调函数

      chart.SetOption(option);
@@ -415,49 +1267,32 @@
      this.KLineChart = chart;
    },

    NetworkFilter(
    NetworkFilter1(
      data,
      callback // 第3方数据替换接口
    ) {
      // if (this.timerss) {
      //   clearInterval(this.timerss);
      //   this.timerss = null;
      // }
      this.timeChange(data, callback);
      // this.timerss = setInterval(() => {
      //   // this.KLineChart.ChangeSymbol(this.obj.code);
      //   this.timeChange(data, callback);
      // }, 3000);
    },
    timeChange(data, callback) {
      EastMoney.HQData.Log("[HQChartDemo::NetworkFilter] data", data);
      console.log("NetworkFilter", data.Name);

      switch (data.Name) {
        // 分时图数据对接
        case "MinuteChartContainer::RequestMinuteData":
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
        case "MinuteChartContainer::RequestHistoryMinuteData":
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
      EastMoney.HQData.NetworkFilter(data, callback);
      this.timerss1 = setInterval(() => {
        EastMoney.HQData.NetworkFilter(data, callback);
      }, 2000);
    },

        case "KLineChartContainer::RequestHistoryData": // 日线全量数据下载
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
        case "KLineChartContainer::RequestRealtimeData": // 日线实时数据更新
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
        case "KLineChartContainer::RequestFlowCapitalData": // 流通股本
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
        case "KLineChartContainer::ReqeustHistoryMinuteData": // 分钟全量数据下载
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
        case "KLineChartContainer::RequestMinuteRealtimeData": // 分钟增量数据更新
          EastMoney.HQData.NetworkFilter(data, callback);
          break;
    NetworkFilter2(
      data,
      callback // 第3方数据替换接口
    ) {
      EastMoney.HQData.Log("[HQChartDemo::NetworkFilter] data", data);

      if (this.timerss2) {
        clearInterval(this.timerss2);
        this.timerss2 = null;
      }
      this.timerss2 = setInterval(() => {
        EastMoney.HQData.NetworkFilter(data, callback);
        console.log("另一个的数据", data);
      }, 2000);
    },
  },
};