hydro-graph 1.0.0

package/src/api/index.js

@@ -0,0 +1,9 @@
+// API函数
+export const GetCotwlTransformation = (params) => {
+  return new Promise((resolve) => {
+    // 模拟API调用，返回一个默认值
+    setTimeout(() => {
+      resolve({ statusCode: 200, data: params.rzw * 1000 });
+    }, 100);
+  });
+};

package/src/index.js

@@ -0,0 +1,4 @@
+import HydroGraph from './HydroGraph.vue'
+
+export default HydroGraph
+export { HydroGraph }

package/src/index.scss

@@ -0,0 +1,86 @@
+.box {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+
+    .title {
+        color: red;
+        font-size: 25px;
+        font-weight: bold;
+        text-align: center;
+        height: 25px;
+        line-height: 25px;
+    }
+
+    .subTitle {
+        color: #3a4ce1;
+        font-size: 14px;
+        font-weight: bold;
+        text-align: center;
+        height: 25px;
+        line-height: 25px;
+    }
+
+    .legend-box {
+        margin-left: 33px;
+        z-index: 10;
+
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+
+        &>.el-checkbox {
+            margin-right: 8px;
+        }
+
+        :deep(.el-dropdown) {
+            margin-right: 8px;
+
+            .el-tooltip__trigger {
+                display: flex;
+                align-items: center;
+            }
+        }
+    }
+
+    .mychart {
+        flex: 1;
+        position: relative;
+
+        :deep(.line-name-tooltip-style) {
+            position: absolute;
+            padding: 8px;
+            background: rgba(255, 255, 255, 0.95);
+            border-radius: 4px;
+            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+            font-size: 14px;
+            pointer-events: none;
+            opacity: 0;
+            transform: translate(-100%, -120%);
+            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+            z-index: 1000;
+        }
+    }
+}
+
+:deep(.el-checkbox) {
+    .el-checkbox__label {
+        color: var(--fill-color);
+        display: flex;
+        align-items: center;
+        padding-left: 3px;
+    }
+
+    .el-checkbox__input.is-checked .el-checkbox__inner,
+    .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+        background-color: var(--fill-color);
+        border-color: var(--fill-color) !important;
+    }
+
+    .el-checkbox__input.is-focus .el-checkbox__inner,
+    .el-checkbox__inner:hover {
+        border-color: var(--fill-color) !important;
+    }
+}

package/src/main.js

@@ -0,0 +1,6 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
+
+createApp(App).use(ElementPlus).mount('#app')

package/src/utils/ruoyi.js

@@ -0,0 +1,228 @@
+// 工具函数
+import dayjs from "dayjs";
+
+export function generateGUID() {
+  let d = new Date().getTime();
+  if (window.performance && typeof window.performance.now === "function") {
+    d += performance.now();
+  }
+  const uuid = "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
+    /[xy]/g,
+    function (c) {
+      const r = ((d + Math.random() * 16) % 16) | 0;
+      d = Math.floor(d / 16);
+      return (c == "x" ? r : (r & 0x3) | 0x8).toString(16);
+    },
+  );
+  return uuid;
+}
+
+export const getColors = [
+  "#E3A8F7",
+  "#5C2D91",
+  "#8AE2C2",
+  "#FF6B8B",
+  "#3A7BD5",
+  "#F9D423",
+  "#7B4397",
+  "#40E0D0",
+  "#FF416C",
+  "#11998E",
+  "#C94B4B",
+  "#4CA1AF",
+  "#FF8008",
+  "#8A2387",
+  "#8EC5FC",
+  "#E0C3FC",
+  "#74EBD5",
+  "#FFD89B",
+  "#FD6585",
+  "#A3CB38",
+  "#6A11CB",
+  "#FF5E62",
+  "#3494E6",
+  "#EC6EAD",
+  "#FFE000",
+  "#799F0C",
+  "#00416A",
+  "#834D9B",
+  "#0052D4",
+  "#43C6AC",
+  "#8E2DE2",
+  "#4A00E0",
+  "#FF4B1F",
+  "#1CB5E0",
+  "#FF7E5F",
+  "#FBD3E9",
+  "#BB377D",
+  "#FF5F6D",
+  "#FFC371",
+  "#159957",
+  "#155799",
+  "#3CA55C",
+  "#D66D75",
+  "#F3904F",
+  "#B3FFAB",
+  "#12FFF7",
+  "#AA076B",
+  "#61045F",
+  "#FF7A00",
+  "#FFD200",
+  "#00B4DB",
+  "#0083B0",
+];
+
+export function isTimeFormat(time) {
+  let nyrsf = /^(\d{4})-(\d{2})-(\d{2}) ([01]\d|2[0-3]):[0-5]\d$/;
+  let yrsf = /^(\d{2})-(\d{2}) ([01]\d|2[0-3]):[0-5]\d$/;
+  let nyr = /^(\d{4})-(\d{2})-(\d{2})$/;
+  return nyrsf.test(time) || yrsf.test(time) || nyr.test(time);
+}
+
+export function getInterval(min, max, type) {
+  let value = "";
+  if (max - min <= 1) {
+    value = 0.1;
+  } else if (max - min <= 5) {
+    value = 0.5;
+  } else if (max - min <= 10) {
+    value = 1;
+  } else if (max - min <= 25) {
+    value = 2.5;
+  } else if (max - min <= 50) {
+    value = 5;
+  } else if (max - min <= 100) {
+    value = 10;
+  } else if (max - min <= 250) {
+    value = 25;
+  } else if (max - min <= 500) {
+    value = 50;
+  } else if (max - min <= 1000) {
+    value = 100;
+  } else if (max - min <= 2500) {
+    value = 250;
+  } else if (max - min <= 5000) {
+    value = 500;
+  } else if (max - min <= 10000) {
+    value = 1000;
+  } else if (max - min <= 20000) {
+    value = 2000;
+  } else if (max - min <= 30000) {
+    value = 3000;
+  } else if (max - min <= 40000) {
+    value = 4000;
+  } else if (max - min <= 50000) {
+    value = 5000;
+  } else if (max - min <= 60000) {
+    value = 6000;
+  } else if (max - min <= 70000) {
+    value = 7000;
+  } else if (max - min <= 80000) {
+    value = 8000;
+  } else if (max - min <= 90000) {
+    value = 9000;
+  } else if (max - min <= 100000) {
+    value = 10000;
+  } else if (max - min <= 110000) {
+    value = 11000;
+  } else if (max - min <= 120000) {
+    value = 12000;
+  } else if (max - min <= 130000) {
+    value = 13000;
+  } else if (max - min <= 140000) {
+    value = 14000;
+  } else if (max - min <= 150000) {
+    value = 15000;
+  } else if (max - min <= 160000) {
+    value = 16000;
+  } else if (max - min <= 170000) {
+    value = 17000;
+  } else if (max - min <= 180000) {
+    value = 18000;
+  } else if (max - min <= 190000) {
+    value = 19000;
+  } else if (max - min <= 200000) {
+    value = 20000;
+  }
+  if (type == 1) {
+    value = value * 2;
+  }
+  return value;
+}
+
+export function formatToFlowValue(f) {
+  if (isNaN(f)) {
+    return "";
+  }
+  var value = parseFloat(f);
+  if (value > 1) {
+    var n = 0;
+    var Arrange = [
+      1, 10, 100, 1000, 10000, 100000, 1000000, 10000000, 100000000, 1000000000,
+    ];
+    for (var i = 0; i < Arrange.length; i++) {
+      if (value >= Arrange[i] && value < Arrange[i + 1]) n = Arrange[i];
+    }
+    if (n == 0) {
+      return value.toString();
+    }
+
+    var d = Math.round((value / n) * 100) / 100;
+    d = d * n;
+    if (d >= 100) {
+      return d.toFixed(0);
+    } else if (d >= 10) {
+      return d.toFixed(1);
+    } else {
+      return d.toFixed(2);
+    }
+  } else if (value >= 0) {
+    return value.toFixed(3);
+  } else if (value < 0) {
+    return "-" + formatToFlowValue(Math.abs(value));
+  }
+}
+
+export function getTimeRange(start, end, interval) {
+  const times = [];
+  let current = new Date(start);
+  while (current <= end) {
+    const minutes = current.getMinutes();
+    if (minutes % interval === 0) {
+      times.push(dayjs(new Date(current)).format("YYYY-MM-DD HH:mm"));
+    }
+    current.setMinutes(minutes + 1);
+  }
+  return times;
+}
+
+export function getMultipleTimeRange(arr, step) {
+  arr = arr.sort((a, b) => Date.parse(a) - Date.parse(b));
+  let startTM,
+    _pieces = [];
+  for (let i = 0; i < arr.length; i++) {
+    if (i == 0) {
+      startTM = arr[i];
+    }
+    let currentTM = dayjs(arr[i])
+      .add(step, "minute")
+      .format("YYYY-MM-DD HH:mm");
+    if (!arr.includes(currentTM)) {
+      _pieces.push({ startTm: startTM, endTm: arr[i] });
+
+      if (i + 1 < arr.length) {
+        startTM = arr[i + 1];
+      }
+    }
+  }
+  return _pieces;
+}
+
+export const isAnnualFirstDay = (dateToCheck) => {
+  return (
+    dateToCheck.month() === 0 &&
+    dateToCheck.date() === 1 &&
+    dateToCheck.hour() === 0 &&
+    dateToCheck.minute() === 0
+  );
+};