新增选择时间

src/views/option/VDatafeed.js

@@ -64,7 +64,7 @@ class VDatafeed {
         return {
             supports_search: false,
             supports_group_request: false,
-            supported_resolutions: ["5", "15", "30", "60", "1D", "1W", "1M"],
+            supported_resolutions: ["1","5", "15", "30", "60", "1D", "1W", "1M"],
             supports_marks: true,
             supports_timescale_marks: true,
             supports_time: true
@@ -90,12 +90,15 @@ class VDatafeed {
             //设置精度  100表示保留两位小数   1000三位   10000四位
             'pricescale': 10000,
             'ticker': this.self.symbol.toLocaleUpperCase(),
-            intraday_multipliers: ["5",
+            intraday_multipliers: [
+                "1",
+                "5",
                 "15",
                 "30",
                 "60",
                 "240",],
             'supported_resolutions': [
+                "1",
                 "5",
                 "15",
                 "30",

src/views/option/kline.vue

@@ -116,10 +116,12 @@ export default {
         ws: undefined,
         onLoadedCallback: undefined,
         onRealtimeCallback: undefined,
-      timer: "15",
+    //   timer: "15",
+        timer: "1",
         sub: "",
         isCreateSocket: false,
         page: {},
+        tt:undefined
     };
   },
   methods: {
@@ -283,18 +285,20 @@ export default {
         }
     },
     initView() {
+        let _this = this;
         let Tdata = new VDatafeed(this);
-      this.TView = new TradingView.widget({
+        let widget=(_this.TView = new TradingView.widget({
             width: "100%",
             height: 590,
-        interval: this.timer,
+            interval: _this.timer,
-        timezone: "Asia/Shanghai",
+            // timezone: "Asia/Shanghai",
+            timezone: "America/Toronto",
             theme: "light", // 自定义主题
             style: "1",
             library_path: "/static/Kline/charting_library/",
             datafeed: Tdata,
-        locale: this.lang,
+            locale: _this.lang,
-        toolbar_bg: this.theme == "light" ? "#f1f3f6" : "#222e3d",
+            toolbar_bg: _this.theme == "light" ? "#f1f3f6" : "#222e3d",
             enable_publishing: false,
             withdateranges: true,
             hide_side_toolbar: false,
@@ -305,9 +309,9 @@ export default {
             container_id: "tradingview_1355aw2",
             disabled_features: [
                 "header_symbol_search",
+                // "widget_logo",
                 "header_compare",
                 "volume_force_overlay",
-          "header_widget_dom_node",
                 'timeframes_toolbar',
                 "control_bar",
                 "main_series_scale_menu",
@@ -316,14 +320,133 @@ export default {
                 "symbol_search_hot_key",
                 "symbol_info",
                 "pane_context_menu",
-          "header_widget_dom_node",
+                // "header_widget_dom_node",
                 'timeframes_toolbar',
             ],
-        supported_resolutions: ["5", "15", "30", "60", "240", "1D", "1W", "1M"],
+            // enabled_features:['header_indicators'],
-        overrides: tvStyle[this.theme],
+            supported_resolutions: ["1","5", "15", "30", "60", "240", "1D", "1W", "1M"],
+            overrides: tvStyle[_this.theme],
             custom_css_url: `/static/Kline/charting_library/static/css/tradingview_${
-          this.theme == "light" ? "white" : "black"
+            _this.theme == "light" ? "white" : "black"
             }.css`,
+            drawings_access: {
+                type: "black",
+                tools: [
+                    { name: "Trend Line", grayed: true },
+                    { name: "Trend Angle", grayed: true }
+                ]
+            },
+        }));
+        widget.onChartReady(function () {
+            let buttonArr = [
+                {
+                title: "1" + _this.$t("exchange.min"),
+                resolution: "1",
+                chartType: 1
+                },
+                {
+                title: "5" + _this.$t("exchange.min"),
+                resolution: "5",
+                chartType: 1
+                },
+                {
+                title: "15" + _this.$t("exchange.min"),
+                resolution: "15",
+                chartType: 1
+                },
+                {
+                title: "30" + _this.$t("exchange.min"),
+                resolution: "30",
+                chartType: 1
+                },
+                {
+                title: "1" + _this.$t("exchange.hour"),
+                resolution: "60",
+                chartType: 1
+                },
+                {
+                title: "1" + _this.$t("exchange.day"),
+                resolution: "1D",
+                chartType: 1
+                },
+                {
+                title: "1" + _this.$t("exchange.week"),
+                resolution: "1W",
+                chartType: 1
+                },
+                {
+                title: "1" + _this.$t("exchange.month"),
+                resolution: "1M",
+                chartType: 1
+                }
+            ];
+            let btn = {};
+            let nowTime = "";
+
+            buttonArr.forEach((v, i) => {
+                let button = widget.createButton();
+                button.attr("title", v.title).addClass("my-date").text(v.title);
+                if (v.resolution === _this.timer) {
+                    button.css({
+                        color: "#5786d2",
+                        "border-bottom": "1px solid #5786d2",
+                    });
+                    // localStorage.setItem("tim", v.resolution);
+                }
+                btn = button.on("click", function (e) {
+                    $(this).parents(".left").children().find(".my-date").removeAttr("style");
+                    handleClick(e, v.resolution);
+                    button.css({
+                        color: "#5786d2",
+                        "border-bottom": "1px solid #5786d2",
+                    });
+                    // _this.$store.commit("upType", v.type);
+                    localStorage.setItem("tim", v.resolution);
+                    widget.chart().setChartType(v.chartType); //改变K线类型
+                });
+            });
+            let handleClick = (e, value) => {
+                _this.setSymbol = function (symbol, value) {
+                    gh.chart().setSymbol(symbol, value);
+                };
+                widget.chart().setResolution(value, function onReadyCallback() {}); //改变分辨率
+                $(e.target)
+                .addClass("mydate")
+                .closest("div.space-single")
+                .siblings("div.space-single")
+                .find("div.button")
+                .removeClass("mydate");
+            };
+            widget.chart().createStudy(
+                "Moving Average",
+                false,
+                true,
+                [5, "close", 0],
+                null,
+                {
+                  "Plot.color": "#e843da",
+                }
+              );
+            widget.chart().createStudy(
+                "Moving Average",
+                false,
+                true,
+                [10, "close", 0],
+                null,
+                {
+                  "Plot.color": "#53b987",
+                }
+              );
+            widget.chart().createStudy(
+                "Moving Average",
+                false,
+                true,
+                [30, "close", 0],
+                null,
+                {
+                  "Plot.color": "#ff231f",
+                }
+              );
         });
     },
   },