st-comp 0.0.277 → 0.0.279

package/src/pages/KlinePlus/KlineDialog/MultiCycle.vue

@@ -1,312 +0,0 @@
-<script setup>
-import dayjs from "dayjs";
-import { ref, onMounted, nextTick } from "vue";
-import { formatLabel, estimateKlineTime, getTimeRange } from "./tools";
-import { getCycleList } from "./api.js";
-
-const emit = defineEmits(["goToSingleCycle"]);
-const props = defineProps({
-  varietyCode: { type: String, required: true },
-  varietyStock: { type: Number, required: true }, // 品种市场类型 0-期货, 1-股票, 2-期权
-  indicatorStore: { type: Object, required: true }, // 指标配置Store
-  userKlineConfig: { type: Object, required: true }, // 用户自定义的K线配置
-
-  // 交互选项
-  sellBuy: { type: Number, default: 1 },
-  rightType: { type: Number, default: null },
-  klineType: { type: Number, default: null },
-  initTimeRange: { type: Array, required: true },
-  mainIndicator: { type: String, required: true },
-
-  // 绘制数据: 成交
-  tradeLog: { type: Array, default: () => [] }, // 成交数据
-  // 绘制数据: 净值
-  netPositionData: { type: Array, default: () => [] }, // 净值数据
-
-  // 功能: 强制定位高亮(非必填)
-  positionTime: { type: [String, null], default: null },
-});
-const chartList = ref([]); // 图表列表
-const chartDomRefList = ref([]); // 图表Dom列表
-const cycleOptions = ref([]);
-const menuList = [{ key: "syncBrushRangeOtherKline", label: "同步其它K线范围" }]; // 菜单列表
-
-// 同步刷选范围
-const syncBrushRange = ref({
-  cycleList: [], // 需要进行刷选的周期
-  startTime: null,
-  endTime: null,
-});
-
-// 清除单个图表的同步刷选
-const handleClearSyncBrush = (cycle) => {
-  if (syncBrushRange.value.cycleList.includes(cycle)) {
-    const index = syncBrushRange.value.cycleList.findIndex((i) => i === cycle);
-    syncBrushRange.value.cycleList.splice(index, 1);
-  }
-};
-
-// 绑定图表Ref
-const handleSetChartDomRef = (el, index) => {
-  if (el) chartDomRefList.value[index] = el;
-};
-
-// 点击菜单项
-const handleClickMenuItem = (menu, item, index) => {
-  switch (menu.key) {
-    // 同步刷选范围
-    case "syncBrushRangeOtherKline": {
-      const { screenTimeRange, contextmenuKlineTime } = chartDomRefList.value[index];
-      // 生成同步刷选的时间范围
-      switch (item.cycle) {
-        // 大周期将contextmenuKlineTime按周期拆成范围, 再使用
-        case "6": {
-          syncBrushRange.value = {
-            cycleList: [],
-            startTime: dayjs(contextmenuKlineTime).format("YYYY-MM-DD 00:00:00"),
-            endTime: dayjs(contextmenuKlineTime).format("YYYY-MM-DD 23:59:59"),
-          };
-          break;
-        }
-        case "7": {
-          syncBrushRange.value = {
-            cycleList: [],
-            startTime: dayjs(contextmenuKlineTime).startOf("week").add(1, "day").format("YYYY-MM-DD 00:00:00"),
-            endTime: dayjs(contextmenuKlineTime).endOf("week").add(1, "day").format("YYYY-MM-DD 23:59:59"),
-          };
-          break;
-        }
-        case "8": {
-          syncBrushRange.value = {
-            cycleList: [],
-            startTime: dayjs(contextmenuKlineTime).startOf("month").format("YYYY-MM-DD 00:00:00"),
-            endTime: dayjs(contextmenuKlineTime).endOf("month").format("YYYY-MM-DD 23:59:59"),
-          };
-          break;
-        }
-        // 小周期直接用screenTimeRange
-        default: {
-          syncBrushRange.value = {
-            cycleList: [],
-            startTime: screenTimeRange[0],
-            endTime: screenTimeRange[1],
-          };
-        }
-      }
-      // 图表重绘
-      chartList.value.forEach((citem, cindex) => {
-        if (cindex !== index) {
-          syncBrushRange.value.cycleList.push(citem.cycle);
-          const startTime = estimateKlineTime(syncBrushRange.value.startTime, "before", 200, citem.cycle);
-          const endTime = estimateKlineTime(syncBrushRange.value.endTime, "after", 200, citem.cycle);
-          citem.initTimeRange = [startTime, endTime];
-        }
-        nextTick(() => chartDomRefList.value[index].reDraw());
-      });
-      break;
-    }
-  }
-};
-
-onMounted(async () => {
-  cycleOptions.value = (await getCycleList()).body[1002].map((item) => ({ label: item.dictName, value: item.dictCode }));
-  const { multiCycleNum, multiCycleList } = props.userKlineConfig;
-  chartList.value = multiCycleList.slice(0, multiCycleNum).map((cycle) => {
-    const params = {
-      type: "reset",
-      cycle,
-      startTime: props.tradeLog[0].openTime,
-      endTime: props.positionTime ? props.positionTime : props.tradeLog.at(-1).closeTime,
-    };
-    const initTimeRange = getTimeRange(params);
-    return { cycle, initTimeRange };
-  });
-});
-defineExpose({
-  changeTimeRange: (type) => {
-    chartList.value = chartList.value.map((item) => {
-      const params = {
-        type,
-        cycle: item.cycle,
-        startTime: props.tradeLog[0].openTime,
-        endTime: props.positionTime ? props.positionTime : props.tradeLog.at(-1).closeTime,
-      };
-      return {
-        ...item,
-        initTimeRange: getTimeRange(params),
-      };
-    });
-    // 同步刷选范围
-    switch (type) {
-      case "week": {
-        const startDate = dayjs().startOf("week").add(1, "day").format("YYYY-MM-DD 00:00:00");
-        const endDate = dayjs().endOf("week").add(1, "day").format("YYYY-MM-DD 23:59:59");
-        syncBrushRange.value = {
-          cycleList: ["6", "7", "8"],
-          startTime: startDate,
-          endTime: endDate,
-        };
-        break;
-      }
-      case "month": {
-        const startDate = dayjs().startOf("month").format("YYYY-MM-DD 00:00:00");
-        const endDate = dayjs().endOf("month").format("YYYY-MM-DD 23:59:59");
-        syncBrushRange.value = {
-          cycleList: ["6", "7", "8"],
-          startTime: startDate,
-          endTime: endDate,
-        };
-        break;
-      }
-      case "reset": {
-        syncBrushRange.value = {
-          cycleList: [],
-          startTime: null,
-          endTime: null,
-        };
-        break;
-      }
-    }
-  },
-});
-</script>
-
-<template>
-  <div :class="`kline-multi grid-${userKlineConfig.multiCycleNum}`">
-    <div
-      class="box"
-      v-for="(item, index) in chartList"
-      @dblclick="emit('goToSingleCycle', item)"
-    >
-      <div class="cycleName">
-        <span>{{ formatLabel(item.cycle, cycleOptions) }}</span>
-        <el-select
-          v-model="item.cycle"
-          popper-class="element-dark"
-          :popper-append-to-body="false"
-          @change="handleClearSyncBrush(item.cycle)"
-        >
-          <el-option
-            v-for="(item, index) in cycleOptions"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-      </div>
-      <st-contextmenu>
-        <st-klinePlus
-          :ref="(el) => handleSetChartDomRef(el, index)"
-          :varietyCode="varietyCode"
-          :varietyStock="varietyStock"
-          :indicatorStore="indicatorStore"
-          :userKlineConfig="userKlineConfig"
-          :cycle="item.cycle"
-          :sellBuy="sellBuy"
-          :rightType="rightType"
-          :klineType="klineType"
-          :initTimeRange="item.initTimeRange"
-          :mainIndicator="mainIndicator"
-          :tradeLog="tradeLog"
-          :netPositionData="netPositionData"
-          :positionTime="positionTime"
-          :syncBrushRange="syncBrushRange"
-        />
-        <template #popover>
-          <el-menu
-            :style="{
-              borderRadius: '4px',
-              overflow: 'hidden',
-              background: '#fff',
-              borderRight: 0,
-            }"
-          >
-            <el-menu-item
-              v-for="menuItem in menuList"
-              style="height: 36px"
-              :key="menuItem.key"
-              :index="menuItem.key"
-              @click="handleClickMenuItem(menuItem, item, index)"
-            >
-              {{ menuItem.label }}
-            </el-menu-item>
-          </el-menu>
-        </template>
-      </st-contextmenu>
-    </div>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.kline-multi {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  padding: 2px;
-  display: grid;
-  grid-template-columns: repeat(3, minmax(150px, 1fr));
-  grid-template-rows: repeat(2, minmax(100px, 1fr));
-  grid-gap: 2px;
-  .box {
-    position: relative;
-    border: 1px solid var(--el-border-color);
-    transition: 0.2s;
-    &:hover {
-      border: 1px solid var(--el-color-primary);
-    }
-    .cycleName {
-      color: white;
-      font-size: 12px;
-      padding: 1px 4px;
-      background-color: var(--el-color-primary);
-      display: flex;
-      align-items: center;
-      border-bottom-left-radius: 4px;
-      position: absolute;
-      z-index: 999;
-      right: 0px;
-      top: 0px;
-      :deep(.el-select) {
-        margin-left: 4px;
-        width: 14px;
-        .el-select__icon {
-          margin-left: 0;
-          color: black;
-          width: 14px;
-          height: 14px;
-        }
-        .el-select__wrapper {
-          border-radius: 50%;
-          background: #ccc;
-          padding: 0;
-          gap: 0;
-          min-height: 14px;
-          line-height: 14px;
-        }
-        .el-select__input {
-          min-width: 0 !important;
-          width: 0 !important;
-        }
-      }
-    }
-  }
-}
-.grid-2 {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(1, minmax(80px, 1fr));
-  grid-gap: 2px;
-}
-.grid-4 {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(2, minmax(80px, 1fr));
-  grid-gap: 2px;
-}
-.grid-6 {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-template-rows: repeat(2, minmax(80px, 1fr));
-  grid-gap: 2px;
-}
-</style>

package/src/pages/KlinePlus/KlineDialog/api.js

@@ -1,108 +0,0 @@
-import axios from "axios";
-
-// 测试环境
-// const userid = 103;
-// const token = "490cebe77872589fc6f670d30983b268";
-// export const host = "http://192.168.12.38:5173";
-
-// 线上环境
-const userid = 200;
-const token = "02e233681c5cecaf788525e70c380ed5";
-export const host = "//investapi.hzyotoy.com";
-
-// 获取数据: 指标列表
-export const getIndicator = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/kline/getIndicator`,
-    data,
-  });
-  return res.data;
-};
-
-// 获取周期列表
-export const getCycleList = async () => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/post/common/qt/getDict`,
-    data: { dictIds: [1002] },
-  });
-  return res.data;
-};
-
-// 查询品种是否股票
-export const queryContractType = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/bjpost/invest/analysis/queryContractType`,
-    data,
-  });
-  return res.data;
-};
-
-// 获取净值曲线数据
-export const queryVarietyNetPositionValue = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/bjpost/invest/analysis/queryVarietyNetPositionValue`,
-    data,
-  });
-  return res.data;
-};
-
-// 获取交易订单数据
-export const queryPairedRecordByVariety = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/bjpost/invest/analysis/queryPairedRecordByVariety`,
-    data,
-  });
-  return res.data;
-};
-
-// 获取篮子品种对应的价差指数
-export const queryJCVariety = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/bjpost/invest/analysis/queryJCVariety`,
-    data,
-  });
-  return res.data;
-};
-
-export const getUserConfig = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/bjpost/common/qt/getUserConfig`,
-    data,
-  });
-  return res.data;
-};
-
-// 获取配置
-export const getConfig = async () => {
-  const res = await axios({
-    method: "get",
-    headers: { token, userid },
-    url: `${host}/middleLayer/get/invest/sys/frontconfig/info`,
-  });
-  return res.data;
-};
-
-// 设置配置
-export const setConfig = async (data) => {
-  const res = await axios({
-    method: "post",
-    headers: { token, userid },
-    url: `${host}/middleLayer/post/invest/sys/frontconfig/save`,
-    data,
-  });
-  return res.data;
-};