@ued_fpi/data-visual 1.2.10 → 1.2.12

package/dist/es/aims/src/AirQualityCalendar/index.vue.mjs

@@ -1,42 +1,26 @@
-import { ElDatePicker } from 'element-plus/es';
+import { ElIcon, ElDatePicker } from 'element-plus/es';
 import 'element-plus/es/components/base/style/css';
 import 'element-plus/es/components/date-picker/style/css';
-import { defineComponent, ref, reactive, onMounted, watch, openBlock, createElementBlock, createElementVNode, createVNode, Fragment, renderList, toDisplayString, normalizeStyle } from 'vue';
-import _imports_0 from './images/left-arrow-double.png.mjs';
-import _imports_1 from './images/left-arrow.png.mjs';
-import _imports_2 from './images/right-arrow.png.mjs';
-import _imports_3 from './images/right-arrow-double.png.mjs';
+import 'element-plus/es/components/icon/style/css';
+import { defineComponent, ref, reactive, onMounted, watch, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, unref, isRef, Fragment, renderList, toDisplayString, withDirectives, normalizeStyle, vShow } from 'vue';
 import dayjs from 'dayjs';
+import { DArrowLeft, ArrowLeft, ArrowRight, DArrowRight } from '@element-plus/icons-vue';
 import { factorToColor } from 'fpi-tg-factor-tools';
+import '../common/BasicNoData/index.mjs';
 import { getEnvFeatureCalendar } from './api/index.mjs';
+import _BasicNoData from '../common/BasicNoData/index.vue.mjs';
 
 const _hoisted_1 = { class: "dv-aims-air-quality-calendar-container" };
 const _hoisted_2 = { class: "flex date-time" };
 const _hoisted_3 = { class: "flex img-left" };
-const _hoisted_4 = /* @__PURE__ */ createElementVNode("img", { src: _imports_0 }, null, -1);
-const _hoisted_5 = [
-  _hoisted_4
-];
-const _hoisted_6 = /* @__PURE__ */ createElementVNode("img", { src: _imports_1 }, null, -1);
-const _hoisted_7 = [
-  _hoisted_6
-];
-const _hoisted_8 = { class: "flex img-right" };
-const _hoisted_9 = /* @__PURE__ */ createElementVNode("img", { src: _imports_2 }, null, -1);
-const _hoisted_10 = [
-  _hoisted_9
-];
-const _hoisted_11 = /* @__PURE__ */ createElementVNode("img", { src: _imports_3 }, null, -1);
-const _hoisted_12 = [
-  _hoisted_11
-];
-const _hoisted_13 = { class: "flex weeks" };
-const _hoisted_14 = { class: "flex calendar-content" };
-const _hoisted_15 = { class: "day" };
-const _hoisted_16 = { class: "num" };
-const _hoisted_17 = { class: "suff-null-day" };
-const _hoisted_18 = { class: "flex legends" };
-const _hoisted_19 = { class: "level" };
+const _hoisted_4 = { class: "flex img-right" };
+const _hoisted_5 = { class: "flex weeks" };
+const _hoisted_6 = { class: "flex calendar-content" };
+const _hoisted_7 = { class: "day" };
+const _hoisted_8 = { class: "num" };
+const _hoisted_9 = { class: "suff-null-day" };
+const _hoisted_10 = { class: "flex legends" };
+const _hoisted_11 = { class: "level" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
@@ -110,12 +94,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           level: "无数据",
           key: "noData",
           color: "#FFFFFF",
-          bgColor: "rgba(255, 255, 255, 0.2)"
+          bgColor: "#909399"
         }
       ]
     });
     const getDayBgColor = (item) => {
-      return Number(item.value) && Number(item.value) > 0 ? factorToColor(props.apiParams.factorCode, item.value, "day") : "rgba(255, 255, 255, 0.5)";
+      return Number(item.value) && Number(item.value) > 0 ? factorToColor(props.apiParams.factorCode, item.value, "day") : "#909399";
     };
     const getDayValue = (item) => {
       return !item.value && item.value !== 0 ? "-" : String(item.value).includes(".") ? item.value.toFixed(2) : item.value;
@@ -164,40 +148,69 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     );
     return (_ctx, _cache) => {
-      const _component_el_date_picker = ElDatePicker;
+      const _component_ElIcon = ElIcon;
+      const _component_ElDatePicker = ElDatePicker;
       return openBlock(), createElementBlock("div", _hoisted_1, [
         createElementVNode("div", _hoisted_2, [
           createElementVNode("div", _hoisted_3, [
             createElementVNode("div", {
               class: "arrow left-arrow-double",
               onClick: _cache[0] || (_cache[0] = ($event) => changeTime(-1, "year"))
-            }, _hoisted_5),
+            }, [
+              createVNode(_component_ElIcon, null, {
+                default: withCtx(() => [
+                  createVNode(unref(DArrowLeft))
+                ]),
+                _: 1
+              })
+            ]),
             createElementVNode("div", {
               class: "arrow left-arrow",
               onClick: _cache[1] || (_cache[1] = ($event) => changeTime(-1, "month"))
-            }, _hoisted_7)
+            }, [
+              createVNode(_component_ElIcon, null, {
+                default: withCtx(() => [
+                  createVNode(unref(ArrowLeft))
+                ]),
+                _: 1
+              })
+            ])
           ]),
-          createVNode(_component_el_date_picker, {
-            modelValue: dateTime.value,
-            "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => dateTime.value = $event),
+          createVNode(_component_ElDatePicker, {
+            modelValue: unref(dateTime),
+            "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(dateTime) ? dateTime.value = $event : null),
             teleported: false,
             type: "month",
             clearable: false,
             "disabled-date": pickerOptions,
             onChange: changeDatePicker
           }, null, 8, ["modelValue"]),
-          createElementVNode("div", _hoisted_8, [
+          createElementVNode("div", _hoisted_4, [
             createElementVNode("div", {
               class: "arrow right-arrow",
               onClick: _cache[3] || (_cache[3] = ($event) => changeTime(1, "month"))
-            }, _hoisted_10),
+            }, [
+              createVNode(_component_ElIcon, null, {
+                default: withCtx(() => [
+                  createVNode(unref(ArrowRight))
+                ]),
+                _: 1
+              })
+            ]),
             createElementVNode("div", {
               class: "arrow right-arrow-double",
               onClick: _cache[4] || (_cache[4] = ($event) => changeTime(1, "year"))
-            }, _hoisted_12)
+            }, [
+              createVNode(_component_ElIcon, null, {
+                default: withCtx(() => [
+                  createVNode(unref(DArrowRight))
+                ]),
+                _: 1
+              })
+            ])
           ])
         ]),
-        createElementVNode("div", _hoisted_13, [
+        createElementVNode("div", _hoisted_5, [
           (openBlock(), createElementBlock(Fragment, null, renderList(weeks, (item, index) => {
             return createElementVNode("div", {
               key: index,
@@ -205,39 +218,44 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, toDisplayString(item), 1);
           }), 64))
         ]),
-        createElementVNode("div", _hoisted_14, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(calendarData.preNullList, (item, index) => {
+        withDirectives(createElementVNode("div", _hoisted_6, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(calendarData).preNullList, (item, index) => {
             return openBlock(), createElementBlock("div", {
               key: index,
               class: "item pre-null"
             });
           }), 128)),
-          (openBlock(true), createElementBlock(Fragment, null, renderList(calendarData.list, (item, index) => {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(calendarData).list, (item, index) => {
             return openBlock(), createElementBlock("div", {
               key: index,
               class: "item",
               style: normalizeStyle({ background: getDayBgColor(item) })
             }, [
-              createElementVNode("div", _hoisted_15, toDisplayString(index + 1), 1),
-              createElementVNode("div", _hoisted_16, toDisplayString(getDayValue(item)), 1)
+              createElementVNode("div", _hoisted_7, toDisplayString(index + 1), 1),
+              createElementVNode("div", _hoisted_8, toDisplayString(getDayValue(item)), 1)
             ], 4);
           }), 128)),
-          (openBlock(true), createElementBlock(Fragment, null, renderList(calendarData.suffNullList, (item, index) => {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(calendarData).suffNullList, (item, index) => {
             return openBlock(), createElementBlock("div", {
               key: index,
               class: "item flex suff-null"
             }, [
-              createElementVNode("div", _hoisted_17, toDisplayString(index + 1 + calendarData.list.length), 1)
+              createElementVNode("div", _hoisted_9, toDisplayString(index + 1 + unref(calendarData).list.length), 1)
             ]);
           }), 128))
+        ], 512), [
+          [vShow, unref(calendarData).list.length]
+        ]),
+        withDirectives(createVNode(unref(_BasicNoData), null, null, 512), [
+          [vShow, !unref(calendarData).list.length]
         ]),
-        createElementVNode("div", _hoisted_18, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(calendarData.legends, (item, index) => {
+        createElementVNode("div", _hoisted_10, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(calendarData).legends, (item, index) => {
             return openBlock(), createElementBlock("div", {
               key: index,
               class: "item"
             }, [
-              createElementVNode("div", _hoisted_19, toDisplayString(item.level), 1),
+              createElementVNode("div", _hoisted_11, toDisplayString(item.level), 1),
               createElementVNode("div", {
                 class: "flex num",
                 style: normalizeStyle({ color: item.color, background: item.bgColor })

package/dist/es/aims/src/AirQualityLevelMonthRatio/index.vue.mjs

@@ -1,13 +1,15 @@
-import { defineComponent, ref, onMounted, watch, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, unref } from 'vue';
+import { defineComponent, ref, onMounted, watch, openBlock, createElementBlock, normalizeClass, createElementVNode, unref, createBlock } from 'vue';
 import { FACTOR_LEVEL_TEXT } from 'fpi-tg-factor-tools';
 import dayjs from 'dayjs';
 import '../common/BasicEcharts/index.mjs';
+import '../common/BasicNoData/index.mjs';
 import { getAirQualityStatis } from './api/index.mjs';
 import _sfc_main$1 from '../common/BasicEcharts/index.vue.mjs';
 import '../common/BasicEcharts/index.vue2.mjs';
+import _BasicNoData from '../common/BasicNoData/index.vue.mjs';
 
 const clsfix = "dv-aims-cieq-contributio-ratio";
-const noDataColor = "rgb(255, 255, 255, 0.5)";
+const noDataColor = "var(--dv-color-text-secondary)";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
@@ -62,7 +64,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               show: false
             },
             axisLabel: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12,
               interval: 0,
               formatter: (value) => value.substr(5)
@@ -73,7 +75,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             type: "value",
             name: "%",
             nameTextStyle: {
-              color: "rgba(255, 255, 255, 0.5)",
+              color: "var(--dv-color-text-secondary)",
               padding: [0, 30, 0, 0]
             },
             splitNumber: 3,
@@ -85,12 +87,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             },
             axisLabel: {
               show: true,
-              color: "rgba(255, 255, 255, 0.5)"
+              color: "var(--dv-color-text-secondary)"
             },
             splitLine: {
               show: true,
               lineStyle: {
-                color: ["rgba(255, 255, 255, 0.3)"]
+                color: ["var(--dv-color-border-light)"]
               }
             }
           },
@@ -99,7 +101,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             bottom: 0,
             itemGap: 4,
             textStyle: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12
             },
             itemWidth: 10,
@@ -186,11 +188,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("div", {
           class: normalizeClass(`${clsfix}-echarts`)
         }, [
-          createVNode(unref(_sfc_main$1), {
+          Boolean(unref(chartsFullOptions).options) ? (openBlock(), createBlock(unref(_sfc_main$1), {
+            key: 0,
             height: "100%",
-            "full-options": chartsFullOptions.value,
+            "full-options": unref(chartsFullOptions),
             loading: false
-          }, null, 8, ["full-options"])
+          }, null, 8, ["full-options"])) : (openBlock(), createBlock(unref(_BasicNoData), { key: 1 }))
         ], 2)
       ], 2);
     };

package/dist/es/aims/src/AirQualityLevelYearRatio/index.vue.mjs

@@ -7,7 +7,7 @@ import _sfc_main$1 from '../common/BasicEcharts/index.vue.mjs';
 import '../common/BasicEcharts/index.vue2.mjs';
 
 const clsfix = "dv-aims-cieq-contributio-ratio";
-const noDataColor = "rgb(255, 255, 255, 0.5)";
+const noDataColor = "var(--dv-color-text-secondary)";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
@@ -28,7 +28,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             bottom: -4,
             itemGap: 4,
             textStyle: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12
             },
             icon: "circle",
@@ -51,7 +51,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               data: list2,
               label: {
                 position: "outer",
-                color: "#fff",
+                color: "var(--dv-color-text-primary)",
                 overflow: "none",
                 formatter: (params) => {
                   const { name, value, value2 } = params.data;

package/dist/es/aims/src/AirQualityPresentSituation/index.vue.mjs

@@ -20,7 +20,7 @@ const _hoisted_12 = [
 ];
 const _hoisted_13 = { class: "name" };
 const clsfix = "dv-aims-air-quality-present-situation";
-const noDataColor = "rgb(255, 255, 255, 0.5)";
+const noDataColor = "var(--dv-color-text-secondary)";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
@@ -51,14 +51,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const fetchData = () => {
       getCityDetail(props.apiParams).then((res) => {
         if (res.data) {
-          realtimeData.cieqVal = Number(res.data.cieq).toFixed(2);
+          realtimeData.cieqVal = Number.isNaN(Number(res.data.cieq)) ? "--" : Number(res.data.cieq).toFixed(2);
           realtimeData.firstPollution = res.data.mainPollutants;
           realtimeData.factorList = realtimeData.factorList.map((item) => {
             const obj = res.data?.commonFactorData.find((c) => c.code === item.code);
             return {
               ...item,
               value: obj ? obj.value : "--",
-              color: obj ? factorToColor(item.code, obj.value, "day") : noDataColor
+              color: obj && obj.value !== "--" ? factorToColor(item.code, obj.value, "day") : noDataColor
             };
           });
         }

package/dist/es/aims/src/AirQualityRealTimeAndDay/index.vue.mjs

@@ -25,7 +25,7 @@ const _hoisted_14 = /* @__PURE__ */ createElementVNode("li", { class: "bottom-le
 ], -1);
 const _hoisted_15 = { class: "name" };
 const clsfix = "dv-aims-air-quality-realtime-and-day";
-const noDataColor = "rgb(255, 255, 255, 0.5)";
+const noDataColor = "var(--dv-color-text-secondary)";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {

package/dist/es/aims/src/AirTimeSeriesAnalysis/index.vue.mjs

@@ -26,9 +26,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         options: {
           grid: {
             left: 20,
-            bottom: 30,
+            bottom: 10,
             right: 20,
-            top: 30,
+            top: 60,
             containLabel: true
           },
           tooltip: {
@@ -72,7 +72,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               show: false
             },
             axisLabel: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12,
               formatter: (value) => formatterTime(value)
             },
@@ -83,7 +83,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               type: "value",
               name: "μg/m³",
               nameTextStyle: {
-                color: "rgba(255, 255, 255, 0.5)",
+                color: "var(--dv-color-text-secondary)",
                 padding: [0, 30, 0, 0]
               },
               axisTick: {
@@ -94,13 +94,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               },
               axisLabel: {
                 show: true,
-                color: "rgba(255, 255, 255, 0.5)"
+                color: "var(--dv-color-text-secondary)"
               },
               splitNumber: 3,
               splitLine: {
                 show: true,
                 lineStyle: {
-                  color: ["rgba(255, 255, 255, 0.3)"]
+                  color: ["var(--dv-color-border-light)"]
                 }
               }
             },
@@ -108,7 +108,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               type: "value",
               name: "mg/m³",
               nameTextStyle: {
-                color: "rgba(255, 255, 255, 0.5)",
+                color: "var(--dv-color-text-secondary)",
                 padding: [0, 0, 0, 30]
               },
               splitNumber: 3,
@@ -120,7 +120,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               },
               axisLabel: {
                 show: true,
-                color: "rgba(255, 255, 255, 0.5)"
+                color: "var(--dv-color-text-secondary)"
               },
               splitLine: {
                 show: true,
@@ -132,10 +132,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ],
           legend: {
             show: true,
-            bottom: 0,
+            top: 0,
             itemGap: 3,
             textStyle: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12
             },
             itemWidth: 16,

package/dist/es/aims/src/CieqContributionMonthRatio/index.vue.mjs

@@ -22,14 +22,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const generateOption = (xData, series) => {
       return {
         options: {
-          colors: [
-            "#0062FF",
-            "#0AAEFF",
-            "#2AC94F",
-            "#FF792E",
-            "#F84439",
-            "#FFB443"
-          ],
           grid: {
             left: 10,
             bottom: 30,
@@ -69,7 +61,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               show: false
             },
             axisLabel: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12,
               interval: 0,
               formatter: (value) => value.substr(5)
@@ -79,7 +71,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           yAxis: {
             type: "value",
             nameTextStyle: {
-              color: "rgba(255, 255, 255, 0.5)",
+              color: "var(--dv-color-text-secondary)",
               padding: [0, 30, 0, 0]
             },
             splitNumber: 3,
@@ -91,12 +83,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             },
             axisLabel: {
               show: true,
-              color: "rgba(255, 255, 255, 0.5)"
+              color: "var(--dv-color-text-secondary)"
             },
             splitLine: {
               show: true,
               lineStyle: {
-                color: ["rgba(255, 255, 255, 0.3)"]
+                color: ["var(--dv-color-border-light)"]
               }
             }
           },
@@ -105,7 +97,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             bottom: 0,
             itemGap: 10,
             textStyle: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12
             },
             itemWidth: 10,
@@ -119,12 +111,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       };
     };
     const fetchData = () => {
+      const colors = [
+        "#0062FF",
+        "#0AAEFF",
+        "#2AC94F",
+        "#FF792E",
+        "#F84439",
+        "#FFB443"
+      ];
       getAirQualityStatis(props.apiParams).then((res) => {
         if (res.data && res.data.CIEQ) {
           const data1 = res.data.CIEQ.CIEQMonthValueRate;
           const data2 = res.data.CIEQ.CIEQMonthValue;
           const xData = data2.times;
-          const list = BASE_FACTOR.filter((item) => item.code !== "aqi").map((item) => {
+          const list = BASE_FACTOR.filter((item) => item.code !== "aqi").map((item, index) => {
             const key = `V_ICIEQ_${item.key}`;
             const value1s = data1[key] ?? [];
             const value2s = data2[key] ?? [];
@@ -133,13 +133,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               name: item.name,
               type: "bar",
               stack: "x",
-              data: value2s.map((c, index) => {
+              data: value2s.map((c, index2) => {
                 return {
                   value: c,
-                  rate: value1s[index],
-                  cieq: cieqs[index]
+                  rate: value1s[index2],
+                  cieq: cieqs[index2]
                 };
               }),
+              color: colors[index],
               barWidth: 15
             };
           });

package/dist/es/aims/src/CieqContributionYearRatio/index.vue.mjs

@@ -23,14 +23,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const generateOption = (list, cieq) => {
       return {
         options: {
-          colors: [
-            "#0062FF",
-            "#0AAEFF",
-            "#2AC94F",
-            "#FF792E",
-            "#F84439",
-            "#FFB443"
-          ],
           title: [
             {
               show: props.showCieq,
@@ -56,7 +48,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             bottom: -4,
             itemGap: 10,
             textStyle: {
-              color: "#FFF",
+              color: "var(--dv-color-text-primary)",
               fontSize: 12
             },
             icon: "circle",
@@ -79,7 +71,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               data: list,
               label: {
                 position: "outside",
-                color: "#fff",
+                color: "var(--dv-color-text-primary)",
                 overflow: "none",
                 formatter: (params) => {
                   const { name, value, value2 } = params.data;
@@ -92,12 +84,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       };
     };
     const fetchData = () => {
+      const colors = [
+        "#0062FF",
+        "#0AAEFF",
+        "#2AC94F",
+        "#FF792E",
+        "#F84439",
+        "#FFB443"
+      ];
       getAirQualityStatis(props.apiParams).then((res) => {
         if (res.data && res.data.CIEQ) {
           const data1 = res.data.CIEQ.CIEQYearValueRate;
           const data2 = res.data.CIEQ.CIEQYearValue;
           const cieq = res.data.CIEQ.CIEQYearValue.cieq;
-          const list = BASE_FACTOR.filter((item) => item.code !== "aqi").map((item) => {
+          const list = BASE_FACTOR.filter((item) => item.code !== "aqi").map((item, index) => {
             const key = `V_ICIEQ_${item.key}`;
             const value1 = data1[key] ?? 0;
             const value2 = data2[key] ?? 0;
@@ -105,7 +105,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               name: item.name,
               code: item.code,
               value: value1,
-              value2
+              value2,
+              itemStyle: {
+                color: colors[index]
+              }
             };
           });
           chartsFullOptions.value = generateOption(list, cieq);