Переглянути джерело

1.修改as详情页面
2.修改msv图

DESKTOP-NE65RNK\Citrus_limon 10 місяців тому
батько
коміт
31478ce445
2 змінених файлів з 13 додано та 322 видалено
  1. 10 320
      src/views/bot/as/detail.vue
  2. 3 2
      src/views/indicator/msv/index.vue

+ 10 - 320
src/views/bot/as/detail.vue

@@ -34,10 +34,10 @@
         <span class="card-title">内部数据</span>
       </template>
       <template v-slot:extra>
-        <lay-button class="card-button" @click="handleSwitchRun">{{ predictorSwitchRun ? "暂停" : "运行" }}</lay-button>
+        <lay-button class="card-button" @click="handleDownData()">下载</lay-button>
       </template>
       <template v-slot:body>
-        <div class="predictor-chart" ref="predictorChartRef"></div>
+        <div class="card-body-wp">内部数据较大,请下载观看。</div>
       </template>
     </lay-card>
 
@@ -61,9 +61,8 @@
 import { ref, reactive, onMounted, onUnmounted, shallowRef } from "vue";
 import { useRoute } from "vue-router";
 import * as echarts from "echarts";
-import dayjs from "dayjs";
 import LogText from "./components/LogText.vue";
-import { get_as_robot_detail, get_robot_detail, get_robot_logs, get_remaining_detail } from "@/api";
+import { get_robot_detail, get_robot_logs, get_remaining_detail } from "@/api";
 
 const ROBOT_STATUS: any = reactive({
   STOPPED: "已停止",
@@ -78,7 +77,6 @@ const ROBOT_STATUS: any = reactive({
 const apiList = ref(window.sessionStorage.getItem("_4L_API_LIST"));
 
 const balanceChartRef = ref();
-const predictorChartRef = ref();
 const logtextRef = ref();
 
 const route = useRoute();
@@ -111,311 +109,8 @@ let robotDetail = ref<any>({});
 let balanceList = ref([]);
 let balanceChart = shallowRef();
 let predictorChart = shallowRef();
-let predictorInterval = ref();
-let predictorSwitchRun = ref(true);
-let requestLimit = ref(false);
 let timer = ref();
 
-const getPredictorState = () => {
-  const params = { botId: route.params.id, startTime: +new Date() - 7 * 24 * 60 * 60 * 1000, endTime: +new Date() };
-  if (pageConfig.predictorLoading) return;
-  pageConfig.predictorLoading = true;
-  get_as_robot_detail(params, (data: any) => {
-    pageConfig.predictorLoading = false;
-    if (data.code == 200 && data.data != null) !predictorChart.value ? initPredictorChart(data.data) : updatePredictorChart(data.data);
-    requestLimit.value = false;
-  });
-};
-
-const initPredictorChart = (data: any) => {
-  if (predictorChart.value != null && !predictorChart.value.isDisposed()) echarts.dispose(predictorChart.value);
-  predictorChart.value = echarts.init(predictorChartRef.value);
-
-  window.removeEventListener("resize", () => predictorChart.value.resize());
-  window.addEventListener("resize", () => predictorChart.value.resize());
-  updatePredictorChart(data);
-};
-const updatePredictorChart = (data: any) => {
-  predictorChart.value.clear();
-  const xData = data.map((item: any) => dayjs(item.update_time * 1).format("MM-DD HH:mm:ss:SSS"));
-  const option = {
-    dataZoom: [
-      {
-        type: "inside",
-        xAxisIndex: [0, 1, 2, 3, 4, 5],
-        start: 0,
-        end: 100,
-      },
-      {
-        xAxisIndex: [0, 1, 2, 3, 4, 5],
-        start: 0,
-        end: 100,
-      },
-    ],
-    tooltip: {
-      trigger: "axis",
-      formatter: (value: any) => {
-        return `时间:${value[0].name}<br />${value.map((item: any) => `${item.marker}${item.seriesName}:${item.value}`).join("<br/>")}`;
-      },
-    },
-    toolbox: {
-      feature: {
-        dataZoom: {},
-        brush: {
-          type: ["rect", "clear"],
-        },
-      },
-    },
-    legend: [
-      {
-        data: ["mid_price", "ask_price", "bid_price", "optimal_ask_price", "optimal_bid_price", "ref_price"],
-        top: "230px",
-      },
-      {
-        data: ["inventory"],
-        top: "380px",
-      },
-      {
-        data: ["spread", "delta_plus", "spread_max", "spread_min"],
-        top: "630px",
-      },
-      {
-        data: ["sigma_square"],
-        top: "780px",
-      },
-      {
-        data: ["gamma"],
-        top: "930px",
-      },
-      {
-        data: ["kappa"],
-        top: "1080px",
-      },
-    ],
-
-    grid: [
-      {
-        top: "50px",
-        left: "60px",
-        right: "60px",
-        height: "150px", // 主图高度
-      },
-      {
-        top: "300px",
-        left: "60px",
-        right: "60px",
-        height: "50px",
-      },
-      {
-        top: "450px",
-        left: "60px",
-        right: "60px",
-        height: "150px",
-      },
-      {
-        top: "700px",
-        left: "60px",
-        right: "60px",
-        height: "50px",
-      },
-      {
-        top: "850px",
-        left: "60px",
-        right: "60px",
-        height: "50px",
-      },
-      {
-        top: "1000px",
-        left: "60px",
-        right: "60px",
-        height: "50px",
-      },
-    ],
-    xAxis: [
-      {
-        type: "category",
-        data: xData,
-      },
-      {
-        gridIndex: 1, // 第1个网格的 x 轴
-        type: "category",
-        data: xData,
-      },
-      {
-        gridIndex: 2, // 第2个网格的 x 轴
-        type: "category",
-        data: xData,
-      },
-      {
-        gridIndex: 3, // 第3个网格的 x 轴
-        type: "category",
-        data: xData,
-      },
-      {
-        gridIndex: 4, // 第4个网格的 x 轴
-        type: "category",
-        data: xData,
-      },
-      {
-        gridIndex: 5, // 第5个网格的 x 轴
-        type: "category",
-        data: xData,
-      },
-    ],
-    yAxis: [
-      {
-        type: "value",
-        min: "dataMin",
-      },
-      {
-        gridIndex: 1, // 第1个网格的 y 轴
-        type: "value",
-        min: "dataMin",
-      },
-      {
-        gridIndex: 2, // 第2个网格的 y 轴
-        type: "value",
-        min: "dataMin",
-      },
-      {
-        gridIndex: 3, // 第3个网格的 y 轴
-        type: "value",
-        min: "dataMin",
-      },
-      {
-        gridIndex: 4, // 第4个网格的 y 轴
-        type: "value",
-        min: "dataMin",
-      },
-      {
-        gridIndex: 5, // 第5个网格的 y 轴
-        type: "value",
-        min: "dataMin",
-      },
-    ],
-    series: [
-      {
-        name: "mid_price",
-        type: "line",
-        data: data.map((item: any) => item.mid_price),
-      },
-      {
-        name: "ask_price",
-        type: "line",
-        data: data.map((item: any) => item.ask_price),
-      },
-      {
-        name: "bid_price",
-        type: "line",
-        data: data.map((item: any) => item.bid_price),
-      },
-      {
-        name: "optimal_ask_price",
-        type: "line",
-        data: data.map((item: any) => item.optimal_ask_price),
-        lineStyle: {
-          type: "dashed",
-        },
-      },
-      {
-        name: "optimal_bid_price",
-        type: "line",
-        data: data.map((item: any) => item.optimal_bid_price),
-        lineStyle: {
-          type: "dashed",
-        },
-      },
-      {
-        name: "ref_price",
-        type: "line",
-        data: data.map((item: any) => item.ref_price),
-      },
-
-      {
-        name: "inventory",
-        type: "line",
-        xAxisIndex: 1,
-        yAxisIndex: 1,
-        data: data.map((item: any) => item.inventory),
-      },
-
-      {
-        name: "spread",
-        type: "line",
-        xAxisIndex: 2,
-        yAxisIndex: 2,
-        data: data.map((item: any) => item.spread),
-      },
-      {
-        name: "delta_plus",
-        type: "line",
-        xAxisIndex: 2,
-        yAxisIndex: 2,
-        data: data.map((item: any) => item.delta_plus),
-      },
-      {
-        name: "spread_max",
-        type: "line",
-        xAxisIndex: 2,
-        yAxisIndex: 2,
-        data: data.map((item: any) => item.spread_max),
-      },
-      {
-        name: "spread_min",
-        type: "line",
-        xAxisIndex: 2,
-        yAxisIndex: 2,
-        data: data.map((item: any) => item.spread_min),
-      },
-
-      {
-        name: "sigma_square",
-        type: "line",
-        xAxisIndex: 3,
-        yAxisIndex: 3,
-        data: data.map((item: any) => item.sigma_square),
-      },
-
-      {
-        name: "gamma",
-        type: "line",
-        xAxisIndex: 4,
-        yAxisIndex: 4,
-        data: data.map((item: any) => item.gamma),
-      },
-
-      {
-        name: "kappa",
-        type: "line",
-        xAxisIndex: 5,
-        yAxisIndex: 5,
-        data: data.map((item: any) => item.kappa),
-      },
-    ],
-  };
-  predictorChart.value.setOption(option, true);
-};
-
-const startPredictorInterval = () => {
-  if (!predictorInterval.value) {
-    getPredictorState();
-    predictorInterval.value = setInterval(() => {
-      if (!requestLimit.value) {
-        requestLimit.value = true;
-        getPredictorState();
-      }
-    }, 5000);
-  }
-};
-
-// 停止定时请求
-const stopPredictorInterval = () => {
-  if (predictorInterval.value) {
-    clearInterval(predictorInterval.value);
-    predictorInterval.value = null; // 释放定时器
-  }
-};
-
 // 获取机器人详情
 const getRobotDetail = () => {
   const params = { id: route.params.id };
@@ -486,16 +181,6 @@ const showLog = (data: any) => {
   logtextRef.value.show(data);
 };
 
-const handleSwitchRun = () => {
-  if (predictorSwitchRun.value) {
-    predictorSwitchRun.value = false;
-    stopPredictorInterval();
-  } else {
-    predictorSwitchRun.value = true;
-    startPredictorInterval();
-  }
-};
-
 const handlePageInfo = (data: any) => {
   let infoList = data;
   let result = infoList.map((item: string) => {
@@ -566,8 +251,11 @@ timer.value = setInterval(() => {
 
 getLogsInfo();
 
+const handleDownData = () => {
+  window.open(`https://4lapi.skyfffire.com/downloadDataFile?url=http://${robotDetail.value.serverIp}:3000/downloadDataFile&id=${robotDetail.value.id}`, "_blank");
+};
+
 onMounted(() => {
-  startPredictorInterval();
   getRobotDetail();
 });
 
@@ -575,11 +263,13 @@ onUnmounted(() => {
   window.removeEventListener("resize", () => balanceChart.value.resize());
   clearInterval(timer.value);
   predictorChart.value.dispose();
-  stopPredictorInterval();
 });
 </script>
 
 <style lang="scss" scoped>
+.card-body-wp{
+  text-align: center;
+}
 .card-button {
   padding: 2px 18px;
 }

+ 3 - 2
src/views/indicator/msv/index.vue

@@ -154,7 +154,7 @@ const initChart = (data: any) => {
         },
       },
       {
-        text: "波动率",
+        text: "回归图",
         top: "600px",
         textStyle: {
           fontSize: 14,
@@ -226,7 +226,7 @@ const initChart = (data: any) => {
           let sigma = params[0]?.value[1] || 0;
           let sigmaMas = params[1]?.value[1];
           // 副图的 tooltip
-          result = `时间:${time}<br/>sigma:${sigma}${sigmaMas ? "<br/>Ma(sigma, 100):" + sigmaMas + "<br/>" : ""}`;
+          result = `时间:${time}<br/>fair price:${sigma}${sigmaMas ? "<br/>fair price ema:" + sigmaMas + "<br/>" : ""}`;
         }
         return result;
       },
@@ -289,6 +289,7 @@ const initChart = (data: any) => {
       {
         gridIndex: 3,
         type: "value",
+        min: "dataMin"
       },
     ],
     series: [