vue-devui 1.5.4 → 1.5.6

package/echarts/index.es.js

@@ -0,0 +1,395 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { defineComponent, ref, onMounted, onUnmounted, createVNode } from "vue";
+import * as echarts from "echarts";
+import { toRefs } from "@vueuse/core";
+const devuiChartProps = {
+  option: {
+    type: Object,
+    default: {}
+  }
+};
+const DARK_LINE_COLOR = "#4E5057";
+const DARK_TITLE_COLOR = "#CED1DB";
+const DARK_TEXT_COLOR = "#696C75";
+const DARK_LEGEND_COLOR = "#868A99";
+const DARK_AXIS_COLOR = "#4E5057";
+const LIGHT_LINE_COLOR = "#D7D8DA";
+const LIGHT_TITLE_COLOR = "#252B3A";
+const LIGHT_TEXT_COLOR = "#9B9FA8";
+const LIGHT_LEGEND_COLOR = "#71757F";
+const LIGHT_AXIS_COLOR = "#D7D8DA";
+const DEFAULT_BASIC_COLOR_PALETTE = [
+  "#5C8DFF",
+  "#BC94FF",
+  "#54D2EB",
+  "#A6DD82",
+  "#FCDA6B",
+  "#CA7ED6",
+  "#7298F1",
+  "#73CEA6",
+  "#EDD249",
+  "#CAABFF",
+  "#85CAFF",
+  "#93D99A",
+  "#96ADFA",
+  "#F4AF8F",
+  "#A282E9",
+  "#FFBB6B",
+  "#69DBB9",
+  "#76DBEF",
+  "#B1CE4F",
+  "#5DA4DC"
+];
+function axisCommon(type) {
+  if (type === "dark") {
+    return {
+      axisLine: {
+        lineStyle: {
+          color: DARK_AXIS_COLOR
+        }
+      },
+      axisTick: {
+        lineStyle: {
+          color: DARK_AXIS_COLOR
+        }
+      },
+      axisLabel: {
+        textStyle: {
+          color: DARK_TEXT_COLOR
+        }
+      },
+      splitLine: {
+        lineStyle: {
+          type: [3, 3],
+          color: DARK_LINE_COLOR
+        }
+      }
+    };
+  } else {
+    return {
+      axisLine: {
+        lineStyle: {
+          color: LIGHT_AXIS_COLOR
+        }
+      },
+      axisTick: {
+        lineStyle: {
+          color: LIGHT_AXIS_COLOR
+        }
+      },
+      axisLabel: {
+        textStyle: {
+          color: LIGHT_TEXT_COLOR
+        }
+      },
+      splitLine: {
+        lineStyle: {
+          type: [3, 3],
+          color: LIGHT_LINE_COLOR
+        }
+      }
+    };
+  }
+}
+const DEVUI_ECHART_THEME = {
+  defaultColorPalette: DEFAULT_BASIC_COLOR_PALETTE,
+  defaultDarkTheme: {
+    color: DEFAULT_BASIC_COLOR_PALETTE,
+    tooltip: {
+      axisPointer: {
+        label: {
+          show: false
+        },
+        lineStyle: {
+          color: DARK_LINE_COLOR,
+          width: 2,
+          type: [2, 3]
+        },
+        crossStyle: {
+          color: DARK_LINE_COLOR,
+          width: 2,
+          type: [2, 3]
+        }
+      },
+      backgroundColor: "rgba(36,37,38,0.96)",
+      extraCssText: "border-radius: 8px;box-shadow: 0 1px 4px 0 rgba(37,43,58,0.1)",
+      borderWidth: 0,
+      padding: [8, 8],
+      textStyle: {
+        color: DARK_LEGEND_COLOR,
+        fontSize: 12
+      }
+    },
+    virtualMap: {
+      textStyle: {
+        color: DARK_TEXT_COLOR
+      }
+    },
+    legend: {
+      height: "80%",
+      width: "80%",
+      textStyle: {
+        color: DARK_LEGEND_COLOR
+      }
+    },
+    textStyle: {
+      color: DARK_TEXT_COLOR
+    },
+    title: {
+      textStyle: {
+        color: DARK_TITLE_COLOR
+      }
+    },
+    toolbox: {
+      iconStyle: {
+        borderColor: DARK_LINE_COLOR
+      }
+    },
+    dataZoom: {
+      textStyle: {
+        color: DARK_TEXT_COLOR
+      }
+    },
+    timeline: {
+      lineStyle: {
+        color: DARK_LINE_COLOR
+      },
+      label: {
+        textStyle: {
+          color: DARK_TEXT_COLOR
+        }
+      }
+    },
+    timeAxis: axisCommon("dark"),
+    logAxis: axisCommon("dark"),
+    valueAxis: __spreadProps(__spreadValues({}, axisCommon("dark")), {
+      axisLine: {
+        show: false,
+        lineStyle: {
+          color: DARK_AXIS_COLOR
+        }
+      },
+      axisTick: {
+        show: false
+      }
+    }),
+    categoryAxis: __spreadProps(__spreadValues({}, axisCommon("dark")), {
+      axisLine: {
+        show: true,
+        lineStyle: {
+          color: DARK_AXIS_COLOR
+        }
+      },
+      axisTick: {
+        show: false
+      }
+    }),
+    line: {
+      symbol: "circle"
+    },
+    graph: {
+      color: DEFAULT_BASIC_COLOR_PALETTE
+    },
+    geo: {
+      itemStyle: {
+        borderColor: "#fff",
+        areaColor: "#37383A"
+      }
+    }
+  },
+  defaultLightTheme: {
+    color: DEFAULT_BASIC_COLOR_PALETTE,
+    tooltip: {
+      axisPointer: {
+        label: {
+          show: false
+        },
+        lineStyle: {
+          color: LIGHT_LINE_COLOR,
+          width: 2,
+          type: [2, 3]
+        },
+        crossStyle: {
+          color: LIGHT_LINE_COLOR,
+          width: 2,
+          type: [2, 3]
+        }
+      },
+      backgroundColor: "rgba(255,255,255,0.96)",
+      extraCssText: "border-radius: 8px;box-shadow: 0 1px 4px 0 rgba(37,43,58,0.1)",
+      borderWidth: 0,
+      padding: [8, 8],
+      textStyle: {
+        color: LIGHT_LEGEND_COLOR,
+        fontSize: 12
+      }
+    },
+    virtualMap: {
+      textStyle: {
+        color: LIGHT_TEXT_COLOR
+      }
+    },
+    legend: {
+      height: "80%",
+      width: "80%",
+      align: "left",
+      textStyle: {
+        color: LIGHT_LEGEND_COLOR
+      }
+    },
+    textStyle: {
+      color: LIGHT_TEXT_COLOR
+    },
+    title: {
+      textStyle: {
+        color: LIGHT_TITLE_COLOR
+      }
+    },
+    toolbox: {
+      iconStyle: {
+        borderColor: LIGHT_LINE_COLOR
+      }
+    },
+    dataZoom: {
+      textStyle: {
+        color: LIGHT_TEXT_COLOR
+      }
+    },
+    timeline: {
+      lineStyle: {
+        color: LIGHT_LINE_COLOR
+      },
+      label: {
+        textStyle: {
+          color: LIGHT_TEXT_COLOR
+        }
+      }
+    },
+    timeAxis: axisCommon("light"),
+    logAxis: axisCommon("light"),
+    valueAxis: __spreadProps(__spreadValues({}, axisCommon("light")), {
+      axisLine: {
+        show: false,
+        lineStyle: {
+          color: LIGHT_AXIS_COLOR
+        }
+      },
+      axisTick: {
+        show: false
+      }
+    }),
+    categoryAxis: __spreadProps(__spreadValues({}, axisCommon("light")), {
+      axisLine: {
+        show: true,
+        lineStyle: {
+          color: LIGHT_AXIS_COLOR
+        }
+      },
+      axisTick: {
+        show: false
+      }
+    }),
+    line: {
+      symbol: "emptyCircle",
+      markPoint: {
+        label: {
+          show: true,
+          color: LIGHT_TEXT_COLOR
+        }
+      }
+    },
+    graph: {
+      color: DEFAULT_BASIC_COLOR_PALETTE
+    },
+    geo: {
+      itemStyle: {
+        borderColor: "#fff",
+        areaColor: "#eaebed"
+      }
+    }
+  }
+};
+var DChart = defineComponent({
+  name: "DChart",
+  props: devuiChartProps,
+  emits: ["chartReady"],
+  setup(props, {
+    emit
+  }) {
+    const {
+      option
+    } = toRefs(props);
+    let theme;
+    let themeService;
+    let isDark = false;
+    let echartInstacne;
+    let timer;
+    const chartRef = ref();
+    const themeChange = () => {
+      var _a;
+      isDark = !!((_a = themeService == null ? void 0 : themeService.currentTheme) == null ? void 0 : _a.isDark);
+      theme = isDark ? DEVUI_ECHART_THEME.defaultDarkTheme : DEVUI_ECHART_THEME.defaultLightTheme;
+      echartInstacne.dispose();
+      echartInstacne = echarts.init(chartRef.value, theme);
+      echartInstacne.setOption(option.value, true);
+      console.log(option.value);
+      emit("chartReady", echartInstacne);
+    };
+    const onresize = () => {
+      clearTimeout(timer);
+      timer = setTimeout(() => {
+        echartInstacne.resize();
+      }, 100);
+    };
+    onMounted(() => {
+      var _a;
+      themeService = window["devuiThemeService"];
+      isDark = !!((_a = themeService == null ? void 0 : themeService.currentTheme) == null ? void 0 : _a.isDark);
+      theme = isDark ? DEVUI_ECHART_THEME.defaultDarkTheme : DEVUI_ECHART_THEME.defaultLightTheme;
+      echartInstacne = echarts.init(chartRef.value, theme);
+      if (themeService) {
+        themeService.eventBus.add("themeChanged", themeChange);
+      }
+      echartInstacne.setOption(option.value, true);
+      emit("chartReady", echartInstacne);
+      window.addEventListener("resize", onresize);
+    });
+    onUnmounted(() => {
+      echartInstacne == null ? void 0 : echartInstacne.dispatchAction({
+        type: "hideTip"
+      });
+      themeService.eventBus.remove("themeChanged", themeChange);
+    });
+    return () => createVNode("div", {
+      "ref": chartRef,
+      "class": "devui-charts"
+    }, null);
+  }
+});
+var index = {
+  title: "Echarts \u56FE\u8868",
+  category: "\u6F14\u8FDB\u4E2D",
+  status: "100%",
+  install(app) {
+    app.component(DChart.name, DChart);
+  }
+};
+export { DChart, index as default, devuiChartProps };

package/echarts/index.umd.js

@@ -0,0 +1 @@
+var j=Object.defineProperty,G=Object.defineProperties;var H=Object.getOwnPropertyDescriptors;var F=Object.getOwnPropertySymbols;var z=Object.prototype.hasOwnProperty,N=Object.prototype.propertyIsEnumerable;var v=(e,t,l)=>t in e?j(e,t,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[t]=l,p=(e,t)=>{for(var l in t||(t={}))z.call(t,l)&&v(e,l,t[l]);if(F)for(var l of F(t))N.call(t,l)&&v(e,l,t[l]);return e},C=(e,t)=>G(e,H(t));(function(e,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue"),require("echarts"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","echarts","@vueuse/core"],t):(e=typeof globalThis!="undefined"?globalThis:e||self,t(e.index={},e.Vue,e.echarts,e.core))})(this,function(e,t,l,R){"use strict";function k(o){if(o&&o.__esModule)return o;var d={__proto__:null,[Symbol.toStringTag]:"Module"};return o&&Object.keys(o).forEach(function(n){if(n!=="default"){var s=Object.getOwnPropertyDescriptor(o,n);Object.defineProperty(d,n,s.get?s:{enumerable:!0,get:function(){return o[n]}})}}),d.default=o,Object.freeze(d)}var g=k(l);const _={option:{type:Object,default:{}}},u="#4E5057",B="#CED1DB",h="#696C75",b="#868A99",D="#4E5057",y="#D7D8DA",I="#252B3A",c="#9B9FA8",E="#71757F",S="#D7D8DA",f=["#5C8DFF","#BC94FF","#54D2EB","#A6DD82","#FCDA6B","#CA7ED6","#7298F1","#73CEA6","#EDD249","#CAABFF","#85CAFF","#93D99A","#96ADFA","#F4AF8F","#A282E9","#FFBB6B","#69DBB9","#76DBEF","#B1CE4F","#5DA4DC"];function a(o){return o==="dark"?{axisLine:{lineStyle:{color:D}},axisTick:{lineStyle:{color:D}},axisLabel:{textStyle:{color:h}},splitLine:{lineStyle:{type:[3,3],color:u}}}:{axisLine:{lineStyle:{color:S}},axisTick:{lineStyle:{color:S}},axisLabel:{textStyle:{color:c}},splitLine:{lineStyle:{type:[3,3],color:y}}}}const T={defaultColorPalette:f,defaultDarkTheme:{color:f,tooltip:{axisPointer:{label:{show:!1},lineStyle:{color:u,width:2,type:[2,3]},crossStyle:{color:u,width:2,type:[2,3]}},backgroundColor:"rgba(36,37,38,0.96)",extraCssText:"border-radius: 8px;box-shadow: 0 1px 4px 0 rgba(37,43,58,0.1)",borderWidth:0,padding:[8,8],textStyle:{color:b,fontSize:12}},virtualMap:{textStyle:{color:h}},legend:{height:"80%",width:"80%",textStyle:{color:b}},textStyle:{color:h},title:{textStyle:{color:B}},toolbox:{iconStyle:{borderColor:u}},dataZoom:{textStyle:{color:h}},timeline:{lineStyle:{color:u},label:{textStyle:{color:h}}},timeAxis:a("dark"),logAxis:a("dark"),valueAxis:C(p({},a("dark")),{axisLine:{show:!1,lineStyle:{color:D}},axisTick:{show:!1}}),categoryAxis:C(p({},a("dark")),{axisLine:{show:!0,lineStyle:{color:D}},axisTick:{show:!1}}),line:{symbol:"circle"},graph:{color:f},geo:{itemStyle:{borderColor:"#fff",areaColor:"#37383A"}}},defaultLightTheme:{color:f,tooltip:{axisPointer:{label:{show:!1},lineStyle:{color:y,width:2,type:[2,3]},crossStyle:{color:y,width:2,type:[2,3]}},backgroundColor:"rgba(255,255,255,0.96)",extraCssText:"border-radius: 8px;box-shadow: 0 1px 4px 0 rgba(37,43,58,0.1)",borderWidth:0,padding:[8,8],textStyle:{color:E,fontSize:12}},virtualMap:{textStyle:{color:c}},legend:{height:"80%",width:"80%",align:"left",textStyle:{color:E}},textStyle:{color:c},title:{textStyle:{color:I}},toolbox:{iconStyle:{borderColor:y}},dataZoom:{textStyle:{color:c}},timeline:{lineStyle:{color:y},label:{textStyle:{color:c}}},timeAxis:a("light"),logAxis:a("light"),valueAxis:C(p({},a("light")),{axisLine:{show:!1,lineStyle:{color:S}},axisTick:{show:!1}}),categoryAxis:C(p({},a("light")),{axisLine:{show:!0,lineStyle:{color:S}},axisTick:{show:!1}}),line:{symbol:"emptyCircle",markPoint:{label:{show:!0,color:c}}},graph:{color:f},geo:{itemStyle:{borderColor:"#fff",areaColor:"#eaebed"}}}};var A=t.defineComponent({name:"DChart",props:_,emits:["chartReady"],setup(o,{emit:d}){const{option:n}=R.toRefs(o);let s,i,m=!1,r,O;const L=t.ref(),w=()=>{var x;m=!!((x=i==null?void 0:i.currentTheme)==null?void 0:x.isDark),s=m?T.defaultDarkTheme:T.defaultLightTheme,r.dispose(),r=g.init(L.value,s),r.setOption(n.value,!0),console.log(n.value),d("chartReady",r)},M=()=>{clearTimeout(O),O=setTimeout(()=>{r.resize()},100)};return t.onMounted(()=>{var x;i=window.devuiThemeService,m=!!((x=i==null?void 0:i.currentTheme)==null?void 0:x.isDark),s=m?T.defaultDarkTheme:T.defaultLightTheme,r=g.init(L.value,s),i&&i.eventBus.add("themeChanged",w),r.setOption(n.value,!0),d("chartReady",r),window.addEventListener("resize",M)}),t.onUnmounted(()=>{r==null||r.dispatchAction({type:"hideTip"}),i.eventBus.remove("themeChanged",w)}),()=>t.createVNode("div",{ref:L,class:"devui-charts"},null)}}),P={title:"Echarts \u56FE\u8868",category:"\u6F14\u8FDB\u4E2D",status:"100%",install(o){o.component(A.name,A)}};e.DChart=A,e.default=P,e.devuiChartProps=_,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"});

package/echarts/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "echarts",
+  "version": "0.0.0",
+  "main": "index.umd.js",
+  "module": "index.es.js",
+  "style": "style.css",
+  "types": "../types/echarts/index.d.ts"
+}