st-comp 0.0.126 → 0.0.128

package/packages/KlineBasic/utils.js

@@ -1,86 +1,187 @@
 import { stMath } from "st-func";
-import { updateWarningLine, getWarningLine } from './api'
+import { updateWarningLine } from './api'
 
 const { round } = stMath;
 
+// 获取主图配置
+export const getMainOptions = (chartData, config, startValue, endValue) => {
+  const { data, time } = chartData
+  const { gridTop, gridRight, gridLeft, maxShowCounts, showSubChart } = config
+  return {
+    animation: false,
+    grid: {
+      top: `${gridTop}px`,
+      right: `${gridRight}px`,
+      bottom: showSubChart ? '6px' : '24px',
+      left: `${gridLeft}px`,
+    },
+    dataZoom: [
+      {
+        type: "inside",
+        startValue,
+        endValue,
+        maxValueSpan: maxShowCounts,
+      },
+    ],
+    tooltip: {
+      trigger: "axis",
+      appendToBody: true,
+      confine: true,
+      axisPointer: {
+        type: "cross",
+        label: {
+          rich: {},
+          formatter: (data) => {
+            const { axisDimension, value } = data;
+            if (axisDimension === "x") {
+              return showSubChart ? "" : value;
+            } else {
+              return String(round(value));
+            }
+          },
+        },
+      },
+      formatter: () => "",
+    },
+    xAxis: {
+      show: showSubChart ? false : true,
+      type: "category",
+      data: time,
+      splitLine: {
+        show: false,
+      },
+    },
+    yAxis: {
+      type: "value",
+      axisLine: {
+        show: true,
+      },
+      splitLine: {
+        show: true,
+        lineStyle: {
+          type: "dotted",
+          color: "#333",
+        },
+      },
+      min: (value) => round(value.min),
+      max: (value) => round(value.max),
+    },
+    series: [
+      {
+        type: "candlestick",
+        data,
+        itemStyle: {
+          color: "transparent",
+          color0: "#00FFFF",
+          borderColor: "#FF0000",
+          borderColor0: "#00FFFF",
+          borderWidth: 1,
+        },
+      },
+      ...chartData.mainIndicator.map((item) => {
+        return {
+          name: item.key,
+          type: 'line',
+          silent: true,
+          symbol: 'none',
+          data: item.data,
+          lineStyle: {
+            width: item.width || 1,
+          },
+          itemStyle: {
+            color: item.color,
+          }
+        }
+      })
+    ],
+  }
+}
+
+// 获取画线预警配置
 export const getWarningLineOptions = (mainChartIns, warningLineData, props, config, callback) => {
   const { variety, featureId, featureType } = props
-  const { gridLeft, gridRight } = config;
-  return warningLineData.map((item) => {
+  const { gridTop, gridLeft, gridRight } = config;
+  return warningLineData.reduce((res, item) => {
     const { warnPrice } = item;
     const y = mainChartIns?.convertToPixel({ yAxisIndex: 0 }, warnPrice)
+    // 位于顶部的预警线不绘制
+    if (y <= gridTop) return res;
+    // 超出图表的预警线不绘制
+    if (y >= mainChartIns?.getHeight()) return res;
     let dragStart = 0; // 记录拖拽开始的位置
-    return {
-      type: "group",
-      name: "warningLine",
-      info: item,
-      draggable: "vertical",
-      children: [
-        {
-          type: "line",
-          info: item,
-          shape: {
-            x1: gridLeft, // 开始X坐标
-            y1: y, // 开始Y坐标
-            x2: mainChartIns?.getWidth() - gridRight, // 结束X坐标
-            y2: y, // 结束Y坐标
+    return [
+      ...res,
+      {
+        type: "group",
+        name: "warningLine",
+        info: item,
+        draggable: "vertical",
+        children: [
+          {
+            type: "line",
+            info: item,
+            shape: {
+              x1: gridLeft, // 开始X坐标
+              y1: y, // 开始Y坐标
+              x2: mainChartIns?.getWidth() - gridRight, // 结束X坐标
+              y2: y, // 结束Y坐标
+            },
+            style: {
+              stroke: "#FFF",
+              lineWidth: 1,
+              lineDash: [8, 4],
+            },
+            z: 10,
           },
-          style: {
-            stroke: "#FFF",
-            lineWidth: 1,
-            lineDash: [8, 4],
+          {
+            type: "text",
+            info: item,
+            x: mainChartIns?.getWidth() - gridRight,
+            y: y - 5,
+            style: {
+              fill: "#FFF",
+              text: warnPrice,
+              stroke: "#000",
+              lineWidth: 1,
+              opacity: 1,
+            },
+            z: 10,
           },
-          z: 10,
+        ],
+        // 事件:开始拖拽
+        ondragstart: (params) => {
+          dragStart = params.offsetY; // 记录拖拽开始坐标
         },
-        {
-          type: "text",
-          info: item,
-          x: mainChartIns?.getWidth() - gridRight,
-          y: y - 5,
-          style: {
-            fill: "#FFF",
-            text: warnPrice,
-            stroke: "#000",
-            lineWidth: 1,
-            opacity: 1,
-          },
-          z: 10,
+        ondrag: params => {
+          if (params.target && params.target.childAt(1)) {
+            const newValue = mainChartIns.convertFromPixel({ yAxisIndex: 0 }, y + (params.offsetY - dragStart))
+            params.target.childAt(1)?.animate('style', false).when(1, { text: round(newValue, 3) }).start()
+          }
         },
-      ],
-      // 事件:开始拖拽
-      ondragstart: (params) => {
-        dragStart = params.offsetY; // 记录拖拽开始坐标
-      },
-      ondrag: params => {
-        if (params.target && params.target.childAt(1)) {
-          const newValue = mainChartIns.convertFromPixel({ yAxisIndex: 0 }, y + (params.offsetY - dragStart))
-          params.target.childAt(1)?.animate('style', false).when(1, { text: round(newValue, 3) }).start()
-        }
-      },
-      // 事件:结束拖拽
-      ondragend: async (params) => {
-        /**
-         * 之所以不直接使用dragEnd,是因为echarts拖拽会有偏差问题
-         * 需要使用偏移量才会更加准备,不然会出现画完线渲染位置和拖拽位置不一致
-         */
-        const dragEnd = params.offsetY; // 记录结束拖拽坐标
-        const dragInterval = dragEnd - dragStart; // 拖拽偏移量
-        if (dragInterval !== 0) {
-          // 计算偏移后对应的Y轴数据
-          const yAxisValue = mainChartIns?.convertFromPixel({ yAxisIndex: 0 }, dragInterval + y);
-          const params = {
-            id: item.id,
-            warnPrice: round(yAxisValue, 3),
-            featureId, //品种id
-            featureCode: variety, //品种代码
-            featureType, //品种类型
-          };
-          await updateWarningLine(params);
-          ElMessage.success("画线预警修改成功");
-          const res = await getWarningLine({ featureId })
-          callback && callback(res?.body || []);
-        }
-      },
-    };
-  })
+        // 事件:结束拖拽
+        ondragend: async (params) => {
+          /**
+           * 之所以不直接使用dragEnd,是因为echarts拖拽会有偏差问题
+           * 需要使用偏移量才会更加准备,不然会出现画完线渲染位置和拖拽位置不一致
+           */
+          const dragEnd = params.offsetY; // 记录结束拖拽坐标
+          const dragInterval = dragEnd - dragStart; // 拖拽偏移量
+          if (dragInterval !== 0) {
+            // 计算偏移后对应的Y轴数据
+            const yAxisValue = mainChartIns?.convertFromPixel({ yAxisIndex: 0 }, dragInterval + y);
+            const params = {
+              id: item.id,
+              warnPrice: round(yAxisValue, 3),
+              featureId, //品种id
+              featureCode: variety, //品种代码
+              featureType, //品种类型
+            };
+            await updateWarningLine(params);
+            ElMessage.success("画线预警修改成功");
+            callback && callback();
+          }
+        },
+      }
+    ]
+  }, [])
 };

package/src/pages/KlineBasic/index.vue

@@ -32,6 +32,7 @@
         :mainIndicator="mainIndicator"
         :indicatorStore="indicatorStore"
         :config="config"
+        :env="{ VITE_BASE_URL: 'http://127.0.0.1:7001' }"
       />
     </div>
   </div>

package/es/config-provider-4954003d.cjs

@@ -1 +0,0 @@
-"use strict";const o=require("vue"),a=require("./use-global-config-ac2dad80.cjs"),i=require("./use-form-common-props-1b84d8f4.cjs"),e=require("./base-ec05f348.cjs"),p=e.buildProps({a11y:{type:Boolean,default:!0},locale:{type:e.definePropType(Object)},size:i.useSizeProp,button:{type:e.definePropType(Object)},experimentalFeatures:{type:e.definePropType(Object)},keyboardNavigation:{type:Boolean,default:!0},message:{type:e.definePropType(Object)},zIndex:Number,namespace:{type:String,default:"el"},...i.useEmptyValuesProps}),s={},l=o.defineComponent({name:"ElConfigProvider",props:p,setup(t,{slots:u}){o.watch(()=>t.message,n=>{Object.assign(s,n??{})},{immediate:!0,deep:!0});const r=a.provideGlobalConfig(t);return()=>o.renderSlot(u,"default",{config:r==null?void 0:r.value})}});exports.ConfigProvider=l;exports.messageConfig=s;

package/es/el-button-c7b375c4.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("vue"),i=require("./use-form-common-props-1b84d8f4.cjs"),N=require("./index-c4649a37.cjs"),V=require("./use-global-config-ac2dad80.cjs"),d=require("./base-ec05f348.cjs"),$=require("./index-eea0bcb3.cjs"),_=Symbol("buttonGroupContextKey"),w=(o,c)=>{N.useDeprecated({from:"type.text",replacement:"link",version:"3.0.0",scope:"props",ref:"https://element-plus.org/en-US/component/button.html#button-attributes"},e.computed(()=>o.type==="text"));const l=e.inject(_,void 0),n=V.useGlobalConfig("button"),{form:s}=i.useFormItem(),a=i.useFormSize(e.computed(()=>l==null?void 0:l.size)),t=i.useFormDisabled(),u=e.ref(),m=e.useSlots(),f=e.computed(()=>o.type||(l==null?void 0:l.type)||""),v=e.computed(()=>{var r,b,g;return(g=(b=o.autoInsertSpace)!=null?b:(r=n.value)==null?void 0:r.autoInsertSpace)!=null?g:!1}),k=e.computed(()=>o.tag==="button"?{ariaDisabled:t.value||o.loading,disabled:t.value||o.loading,autofocus:o.autofocus,type:o.nativeType}:{}),y=e.computed(()=>{var r;const b=(r=m.default)==null?void 0:r.call(m);if(v.value&&(b==null?void 0:b.length)===1){const g=b[0];if((g==null?void 0:g.type)===e.Text){const x=g.children;return/^\p{Unified_Ideograph}{2}$/u.test(x.trim())}}return!1});return{_disabled:t,_size:a,_type:f,_ref:u,_props:k,shouldAddSpace:y,handleClick:r=>{if(t.value||o.loading){r.stopPropagation();return}o.nativeType==="reset"&&(s==null||s.resetFields()),c("click",r)}}},S=["default","primary","success","warning","info","danger","text",""],z=["button","submit","reset"],B=d.buildProps({size:i.useSizeProp,disabled:Boolean,type:{type:String,values:S,default:""},icon:{type:i.iconPropType},nativeType:{type:String,values:z,default:"button"},loading:Boolean,loadingIcon:{type:i.iconPropType,default:()=>i.loading_default},plain:Boolean,text:Boolean,link:Boolean,bg:Boolean,autofocus:Boolean,round:Boolean,circle:Boolean,color:String,dark:Boolean,autoInsertSpace:{type:Boolean,default:void 0},tag:{type:d.definePropType([String,Object]),default:"button"}}),E={click:o=>o instanceof MouseEvent};function p(o,c=20){return o.mix("#141414",c).toString()}function I(o){const c=i.useFormDisabled(),l=d.useNamespace("button");return e.computed(()=>{let n={},s=o.color;if(s){const a=s.match(/var\((.*?)\)/);a&&(s=window.getComputedStyle(window.document.documentElement).getPropertyValue(a[1]));const t=new $.TinyColor(s),u=o.dark?t.tint(20).toString():p(t,20);if(o.plain)n=l.cssVarBlock({"bg-color":o.dark?p(t,90):t.tint(90).toString(),"text-color":s,"border-color":o.dark?p(t,50):t.tint(50).toString(),"hover-text-color":`var(${l.cssVarName("color-white")})`,"hover-bg-color":s,"hover-border-color":s,"active-bg-color":u,"active-text-color":`var(${l.cssVarName("color-white")})`,"active-border-color":u}),c.value&&(n[l.cssVarBlockName("disabled-bg-color")]=o.dark?p(t,90):t.tint(90).toString(),n[l.cssVarBlockName("disabled-text-color")]=o.dark?p(t,50):t.tint(50).toString(),n[l.cssVarBlockName("disabled-border-color")]=o.dark?p(t,80):t.tint(80).toString());else{const m=o.dark?p(t,30):t.tint(30).toString(),f=t.isDark()?`var(${l.cssVarName("color-white")})`:`var(${l.cssVarName("color-black")})`;if(n=l.cssVarBlock({"bg-color":s,"text-color":f,"border-color":s,"hover-bg-color":m,"hover-text-color":f,"hover-border-color":m,"active-bg-color":u,"active-border-color":u}),c.value){const v=o.dark?p(t,50):t.tint(50).toString();n[l.cssVarBlockName("disabled-bg-color")]=v,n[l.cssVarBlockName("disabled-text-color")]=o.dark?"rgba(255, 255, 255, 0.5)":`var(${l.cssVarName("color-white")})`,n[l.cssVarBlockName("disabled-border-color")]=v}}}return n})}const P=e.defineComponent({name:"ElButton"}),T=e.defineComponent({...P,props:B,emits:E,setup(o,{expose:c,emit:l}){const n=o,s=I(n),a=d.useNamespace("button"),{_ref:t,_size:u,_type:m,_disabled:f,_props:v,shouldAddSpace:k,handleClick:y}=w(n,l),C=e.computed(()=>[a.b(),a.m(m.value),a.m(u.value),a.is("disabled",f.value),a.is("loading",n.loading),a.is("plain",n.plain),a.is("round",n.round),a.is("circle",n.circle),a.is("text",n.text),a.is("link",n.link),a.is("has-bg",n.bg)]);return c({ref:t,size:u,type:m,disabled:f,shouldAddSpace:k}),(r,b)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.tag),e.mergeProps({ref_key:"_ref",ref:t},e.unref(v),{class:e.unref(C),style:e.unref(s),onClick:e.unref(y)}),{default:e.withCtx(()=>[r.loading?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[r.$slots.loading?e.renderSlot(r.$slots,"loading",{key:0}):(e.openBlock(),e.createBlock(e.unref(i.ElIcon),{key:1,class:e.normalizeClass(e.unref(a).is("loading"))},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.loadingIcon)))]),_:1},8,["class"]))],64)):r.icon||r.$slots.icon?(e.openBlock(),e.createBlock(e.unref(i.ElIcon),{key:1},{default:e.withCtx(()=>[r.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.icon),{key:0})):e.renderSlot(r.$slots,"icon",{key:1})]),_:3})):e.createCommentVNode("v-if",!0),r.$slots.default?(e.openBlock(),e.createElementBlock("span",{key:2,class:e.normalizeClass({[e.unref(a).em("text","expand")]:e.unref(k)})},[e.renderSlot(r.$slots,"default")],2)):e.createCommentVNode("v-if",!0)]),_:3},16,["class","style","onClick"]))}});var D=d._export_sfc(T,[["__file","button.vue"]]);const G={size:B.size,type:B.type},F=e.defineComponent({name:"ElButtonGroup"}),q=e.defineComponent({...F,props:G,setup(o){const c=o;e.provide(_,e.reactive({size:e.toRef(c,"size"),type:e.toRef(c,"type")}));const l=d.useNamespace("button");return(n,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(l).b("group"))},[e.renderSlot(n.$slots,"default")],2))}});var h=d._export_sfc(q,[["__file","button-group.vue"]]);const K=d.withInstall(D,{ButtonGroup:h});d.withNoopInstall(h);exports.ElButton=K;exports.buttonTypes=S;