feat: 颜色转换工具&文件下载工具&元素滚动到视图工具

frontend/src/utils/dom.ts

@@ -0,0 +1,15 @@
+export interface ScrollToViewOptions {
+  behavior?: 'auto' | 'smooth';
+  block?: 'start' | 'center' | 'end' | 'nearest';
+  inline?: 'start' | 'center' | 'end' | 'nearest';
+}
+
+export function scrollIntoView(targetRef: HTMLElement | null, options: ScrollToViewOptions = {}) {
+  const scrollOptions: ScrollToViewOptions = {
+    behavior: options.behavior || 'smooth',
+    block: options.block || 'start',
+    inline: options.inline || 'nearest',
+  };
+
+  targetRef?.scrollIntoView(scrollOptions);
+}

frontend/src/utils/index.ts

@@ -56,3 +56,35 @@ export const deepMerge = <T = any>(src: any = {}, target: any = {}): T => {
   });
   return src;
 };
+
+/**
+ * rgb 颜色转换为 hex 颜色
+ * @param rgb rgb颜色字符串
+ * @returns HEX 6位颜色字符串
+ */
+export const rgbToHex = (rgb: string) => {
+  const matches = rgb.match(/^(\d+),\s*(\d+),\s*(\d+)$/);
+  if (!matches) {
+    return rgb;
+  }
+  const r = parseInt(matches[1], 10).toString(16).padStart(2, '0');
+  const g = parseInt(matches[2], 10).toString(16).padStart(2, '0');
+  const b = parseInt(matches[3], 10).toString(16).padStart(2, '0');
+  return `#${r}${g}${b}`;
+};
+
+/**
+ * 字符串内容文件下载
+ * @param content 文件内容
+ * @param fileName 文件名
+ */
+export const downloadStringFile = (type: string, content: string, fileName: string) => {
+  const fileContent = `data:${type};charset=utf-8,${encodeURIComponent(content)}`;
+  const link = document.createElement('a');
+  link.setAttribute('href', fileContent);
+  link.setAttribute('download', fileName);
+  link.style.display = 'none';
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+};