@hlw-uni/mp-vue 1.2.26 → 2.0.0

package/src/composables/format/index.ts

@@ -0,0 +1,48 @@
+/**
+ * useFormat — 格式化工具 composable
+ */
+export function useFormat() {
+    /**
+     * 按指定模板格式化日期时间。
+     */
+    function date(date: Date | number | string, format = "YYYY-MM-DD HH:mm:ss"): string {
+        const d = new Date(date);
+        if (isNaN(d.getTime())) return "";
+
+        const year = d.getFullYear();
+        const month = String(d.getMonth() + 1).padStart(2, "0");
+        const day = String(d.getDate()).padStart(2, "0");
+        const hours = String(d.getHours()).padStart(2, "0");
+        const minutes = String(d.getMinutes()).padStart(2, "0");
+        const seconds = String(d.getSeconds()).padStart(2, "0");
+
+        return format.replace("YYYY", String(year)).replace("MM", month).replace("DD", day).replace("HH", hours).replace("mm", minutes).replace("ss", seconds);
+    }
+
+    /**
+     * 将字节数格式化为更易读的文件大小。
+     */
+    function fileSize(bytes: number): string {
+        if (bytes === 0) return "0 B";
+        const k = 1024;
+        const sizes = ["B", "KB", "MB", "GB", "TB"];
+        const i = Math.floor(Math.log(bytes) / Math.log(k));
+        return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`;
+    }
+
+    /**
+     * 对手机号中间四位进行脱敏。
+     */
+    function phone(value: string): string {
+        return value.replace(/(\d{3})\d{4}(\d{4})/, "$1****$2");
+    }
+
+    /**
+     * 按指定精度与千分位格式输出金额。
+     */
+    function money(amount: number, decimals = 2, decPoint = ".", thousandsSep = ","): string {
+        return amount.toFixed(decimals).replace(/\B(?=(\d{3})+(?!\d))/g, thousandsSep);
+    }
+
+    return { date, fileSize, phone, money };
+}

package/src/composables/http/adapters/alist.ts

@@ -0,0 +1,19 @@
+/**
+ * Alist 上传适配器。
+ */
+import type { UploadAdapter } from "./base";
+
+export const alistAdapter: UploadAdapter = {
+    name: "alist",
+    /**
+     * 生成 Alist 所需的表单字段。
+     */
+    buildFormData(ctx) {
+        const c = ctx.credentials ?? {};
+        return {
+            "file-path": c["file-path"] ?? ctx.fileName,
+            authorization: c["token"] ?? "",
+            ...(ctx.extraData ?? {}),
+        };
+    },
+};

package/src/composables/http/adapters/base.ts

@@ -0,0 +1,21 @@
+/**
+ * 云存储上传适配器 - 上传上下文
+ */
+
+/** 上传上下文。 */
+export interface UploadContext {
+    filePath: string;
+    fileName: string;
+    /** 云存储密钥凭证 */
+    credentials?: Record<string, string>;
+    /** 额外表单数据 */
+    extraData?: Record<string, string>;
+}
+
+/** 云存储适配器接口。 */
+export interface UploadAdapter {
+    /** 适配器名称 */
+    name: string;
+    /** 根据上下文构建表单数据 */
+    buildFormData(ctx: UploadContext): Record<string, string | number>;
+}

package/src/composables/http/adapters/cos.ts

@@ -0,0 +1,23 @@
+/**
+ * 腾讯云 COS 上传适配器。
+ */
+import type { UploadAdapter } from "./base";
+
+export const cosAdapter: UploadAdapter = {
+    name: "cos",
+    /**
+     * 生成 COS 直传所需的表单字段。
+     */
+    buildFormData(ctx) {
+        const c = ctx.credentials ?? {};
+        return {
+            "q-ak": c["ak"] ?? "",
+            policy: c["policy"] ?? "",
+            "q-key-time": c["key-time"] ?? "",
+            "q-signature": c["signature"] ?? "",
+            "Content-Disposition": `inline;filename=${encodeURIComponent(ctx.fileName)}`,
+            success_action_status: 200,
+            ...(ctx.extraData ?? {}),
+        };
+    },
+};

package/src/composables/http/adapters/index.ts

@@ -0,0 +1,31 @@
+/**
+ * 云存储上传适配器统一导出
+ */
+export { cosAdapter } from "./cos";
+export { ossAdapter } from "./oss";
+export { qiniuAdapter } from "./qiniu";
+export { alistAdapter } from "./alist";
+export type { UploadAdapter, UploadContext } from "./base";
+
+import { cosAdapter } from "./cos";
+import { ossAdapter } from "./oss";
+import { qiniuAdapter } from "./qiniu";
+import { alistAdapter } from "./alist";
+import type { UploadAdapter } from "./base";
+
+/** 所有已注册的上传适配器。 */
+export const adapters: Record<string, UploadAdapter> = {
+    cos: cosAdapter,
+    oss: ossAdapter,
+    qiniu: qiniuAdapter,
+    alist: alistAdapter,
+};
+
+/**
+ * 按名称获取上传适配器，不存在时抛错。
+ */
+export function getAdapter(name: string): UploadAdapter {
+    const adapter = adapters[name];
+    if (!adapter) throw new Error(`[hlw] Unknown upload adapter: ${name}`);
+    return adapter;
+}

package/src/composables/http/adapters/oss.ts

@@ -0,0 +1,22 @@
+/**
+ * 阿里云 OSS 上传适配器。
+ */
+import type { UploadAdapter } from "./base";
+
+export const ossAdapter: UploadAdapter = {
+    name: "oss",
+    /**
+     * 生成 OSS 直传所需的表单字段。
+     */
+    buildFormData(ctx) {
+        const c = ctx.credentials ?? {};
+        return {
+            policy: c["policy"] ?? "",
+            signature: c["signature"] ?? "",
+            OSSAccessKeyId: c["accessKeyId"] ?? "",
+            success_action_status: 200,
+            "Content-Disposition": `inline;filename=${encodeURIComponent(ctx.fileName)}`,
+            ...(ctx.extraData ?? {}),
+        };
+    },
+};

package/src/composables/http/adapters/qiniu.ts

@@ -0,0 +1,19 @@
+/**
+ * 七牛云上传适配器。
+ */
+import type { UploadAdapter } from "./base";
+
+export const qiniuAdapter: UploadAdapter = {
+    name: "qiniu",
+    /**
+     * 生成七牛直传所需的表单字段。
+     */
+    buildFormData(ctx) {
+        const c = ctx.credentials ?? {};
+        return {
+            token: c["token"] ?? "",
+            key: c["key"] ?? ctx.fileName,
+            ...(ctx.extraData ?? {}),
+        };
+    },
+};

package/src/composables/http/client.ts

@@ -0,0 +1,237 @@
+/**
+ * HttpClient - Axios 风格的 HTTP 客户端
+ * 支持请求/响应拦截器、组件内请求 composable、上传策略模式。
+ */
+import { ref } from 'vue';
+import type {
+  ApiResponse,
+  RequestConfig,
+  RequestInterceptor,
+  ResponseInterceptor,
+  ErrorInterceptor,
+  UploadConfig,
+  UploadResult,
+} from './types';
+import { getAdapter } from './adapters';
+
+/** 组件内请求返回的状态对象。 */
+export interface UseRequestReturn<T = unknown> {
+  loading: ReturnType<typeof ref<boolean>>;
+  data: ReturnType<typeof ref<T | null>>;
+  error: ReturnType<typeof ref<Error | null>>;
+  run: (config: RequestConfig) => Promise<ApiResponse<T>>;
+  get: (url: string, data?: unknown) => Promise<ApiResponse<T>>;
+  post: (url: string, data?: unknown) => Promise<ApiResponse<T>>;
+  put: (url: string, data?: unknown) => Promise<ApiResponse<T>>;
+  del: (url: string, data?: unknown) => Promise<ApiResponse<T>>;
+}
+
+export class HttpClient {
+  private _reqInterceptors: RequestInterceptor[] = [];
+  private _resInterceptors: ResponseInterceptor[] = [];
+  private _errInterceptors: ErrorInterceptor[] = [];
+  private _baseURL: string;
+  private _defaultHeaders: Record<string, string>;
+  private _noCache: boolean;
+
+  /**
+   * 创建 HttpClient 实例并初始化默认配置。
+   */
+  constructor(options: { baseURL?: string; headers?: Record<string, string>; noCache?: boolean } = {}) {
+    this._baseURL = options.baseURL ?? '';
+    this._noCache = options.noCache ?? true;
+    this._defaultHeaders = {
+      'Content-Type': 'application/json',
+      ...options.headers,
+    };
+  }
+
+  /** 运行时设置 baseURL。 */
+  setBaseURL(url: string): void {
+    this._baseURL = url;
+  }
+
+  /** 注册请求拦截器，并返回注销函数。 */
+  onRequest(fn: RequestInterceptor): () => void {
+    this._reqInterceptors.push(fn);
+    return () => {
+      const idx = this._reqInterceptors.indexOf(fn);
+      if (idx > -1) this._reqInterceptors.splice(idx, 1);
+    };
+  }
+
+  /** 注册响应拦截器，并返回注销函数。 */
+  onResponse<T = unknown>(fn: ResponseInterceptor<T>): () => void {
+    this._resInterceptors.push(fn as ResponseInterceptor);
+    return () => {
+      const idx = this._resInterceptors.indexOf(fn as ResponseInterceptor);
+      if (idx > -1) this._resInterceptors.splice(idx, 1);
+    };
+  }
+
+  /** 注册错误拦截器，并返回注销函数。 */
+  onError(fn: ErrorInterceptor): () => void {
+    this._errInterceptors.push(fn);
+    return () => {
+      const idx = this._errInterceptors.indexOf(fn);
+      if (idx > -1) this._errInterceptors.splice(idx, 1);
+    };
+  }
+
+  /**
+   * 执行一次全局请求，自动串联请求与响应拦截器。
+   */
+  async request<T = unknown>(config: RequestConfig): Promise<ApiResponse<T>> {
+    let cfg: RequestConfig = {
+      method: 'GET',
+      ...config,
+      headers: { ...this._defaultHeaders, ...config.headers },
+    };
+
+    for (const fn of this._reqInterceptors) {
+      cfg = await fn(cfg);
+    }
+
+    try {
+      const fullUrl = this._buildUrl(cfg.url);
+      const res = await this._doRequest<T>(fullUrl, cfg);
+
+      for (const fn of this._resInterceptors) {
+        const modified = await fn(res as ApiResponse<unknown>);
+        if (modified !== undefined) return modified as ApiResponse<T>;
+      }
+      return res;
+    } catch (e) {
+      const err = e as Error;
+      await this._applyErrorInterceptors(err);
+      throw err;
+    }
+  }
+
+  /**
+   * 创建组件内可复用的请求状态对象。
+   */
+  useRequest<T = unknown>(): UseRequestReturn<T> {
+    const loading = ref(false);
+    const data = ref<T | null>(null);
+    const error = ref<Error | null>(null);
+
+    /**
+     * 执行一次请求并维护 loading、data、error 状态。
+     */
+    const run = async (cfg: RequestConfig): Promise<ApiResponse<T>> => {
+      loading.value = true;
+      error.value = null;
+      try {
+        const res = await this.request<T>(cfg);
+        data.value = res.data as T;
+        return res;
+      } catch (e) {
+        error.value = e as Error;
+        throw e;
+      } finally {
+        loading.value = false;
+      }
+    };
+
+    /** 发起 GET 请求。 */
+    const get = (url: string, d?: unknown) => run({ url, method: 'GET', data: d });
+    /** 发起 POST 请求。 */
+    const post = (url: string, d?: unknown) => run({ url, method: 'POST', data: d });
+    /** 发起 PUT 请求。 */
+    const put = (url: string, d?: unknown) => run({ url, method: 'PUT', data: d });
+    /** 发起 DELETE 请求。 */
+    const del = (url: string, d?: unknown) => run({ url, method: 'DELETE', data: d });
+
+    return { loading, data, error, run, get, post, put, del };
+  }
+
+  /**
+   * 根据上传类型选择适配器并执行文件上传。
+   */
+  upload(config: UploadConfig): Promise<UploadResult> {
+    const fileName = config.fileName ?? config.filePath.split('/').pop() ?? 'file';
+
+    let server = config.server;
+    if (config.type === 'local' && config.url) server = config.url;
+
+    const formData = config.type === 'local'
+      ? (config.credentials ?? {})
+      : getAdapter(config.type).buildFormData({
+          filePath: config.filePath,
+          fileName,
+          credentials: config.credentials,
+        });
+
+    return new Promise((resolve, reject) => {
+      uni.uploadFile({
+        url: server,
+        filePath: config.filePath,
+        name: 'file',
+        formData: formData as unknown as UniNamespace.UploadFileOption['formData'],
+        header: config.header as Record<string, string>,
+        success: (res) => {
+          if (res.statusCode === 200) {
+            try {
+              const body = JSON.parse(res.data);
+              resolve({ code: body.code ?? 1, msg: body.message ?? '上传成功', data: body.data ?? '' });
+            } catch {
+              resolve({ code: 1, msg: '上传成功', data: res.data });
+            }
+          } else {
+            reject(new Error('上传失败'));
+          }
+        },
+        fail: (err) => reject(new Error(err.errMsg || '上传失败')),
+      });
+    });
+  }
+
+  /**
+   * 拼接 baseURL，并在开启防缓存时追加时间戳参数。
+   */
+  private _buildUrl(url: string): string {
+    if (/^https?:\/\//.test(url)) return url;
+    const full = `${this._baseURL}${url}`;
+    if (!this._noCache) return full;
+    const sep = full.includes('?') ? '&' : '?';
+    return `${full}${sep}_t=${Date.now()}`;
+  }
+
+  /**
+   * 调用 uni.request 发起底层网络请求。
+   */
+  private async _doRequest<T>(url: string, cfg: RequestConfig): Promise<ApiResponse<T>> {
+    return new Promise((resolve, reject) => {
+      uni.request({
+        url,
+        method: cfg.method,
+        data: cfg.data as UniNamespace.RequestOptions['data'],
+        header: cfg.headers as Record<string, string>,
+        success: (res) => {
+          if (res.statusCode >= 200 && res.statusCode < 300) {
+            resolve(res.data as ApiResponse<T>);
+          } else {
+            const msg = (res.data as Record<string, unknown>)?.info ?? `请求失败: ${res.statusCode}`;
+            reject(new Error(String(msg)));
+          }
+        },
+        fail: (err) => reject(new Error(err.errMsg || '网络请求失败')),
+      });
+    });
+  }
+
+  /**
+   * 顺序执行已注册的错误拦截器。
+   */
+  private async _applyErrorInterceptors(err: Error): Promise<void> {
+    for (const fn of this._errInterceptors) {
+      await fn(err);
+    }
+  }
+}
+
+/**
+ * 全局 HTTP 实例。
+ */
+export const http = new HttpClient();

package/src/composables/http/index.ts

@@ -0,0 +1,8 @@
+/**
+ * HTTP 模块统一导出
+ */
+export { http, HttpClient } from "./client";
+export { useRequest, useUpload } from "./useRequest";
+export type { ApiResponse, PageResult, RequestConfig, RequestInterceptor, ResponseInterceptor, ErrorInterceptor, UploadConfig, UploadResult } from "./types";
+export type { UseRequestReturn } from "./client";
+export * from "./adapters";

package/src/composables/http/types.ts

@@ -0,0 +1,57 @@
+/**
+ * HTTP 类型定义
+ */
+
+/** API 统一响应格式 */
+export interface ApiResponse<T = unknown> {
+    code: number;
+    data: T;
+    info: string;
+}
+
+/** 分页数据 */
+export interface PageResult<T = unknown> {
+    list: T[];
+    total: number;
+    page: number;
+    pageSize: number;
+}
+
+/** 请求配置 */
+export interface RequestConfig {
+    url: string;
+    method?: "GET" | "POST" | "PUT" | "DELETE";
+    data?: unknown;
+    headers?: Record<string, string>;
+    timeout?: number;
+}
+
+/** 拦截器类型 */
+export type RequestInterceptor = (config: RequestConfig) => RequestConfig | Promise<RequestConfig>;
+export type ResponseInterceptor<T = unknown> = (res: ApiResponse<T>) => ApiResponse<T> | void | Promise<ApiResponse<T> | void>;
+export type ErrorInterceptor = (err: Error) => void | Error | Promise<void | Error>;
+
+/** 上传配置 */
+export interface UploadConfig {
+    /** 上传接口地址 */
+    server: string;
+    /** 文件路径 */
+    filePath: string;
+    /** 文件名，可选，默认取 filePath */
+    fileName?: string;
+    /** 上传类型，支持 cos | oss | qiniu | alist | local */
+    type: string;
+    /** 云存储密钥凭证 */
+    credentials?: Record<string, string>;
+    /** 自定义请求头 */
+    header?: Record<string, string>;
+    /** 上传类型为 local 时，作为最终 server */
+    url?: string;
+}
+
+/** 上传结果 */
+export interface UploadResult {
+    code: number;
+    msg: string;
+    data: string;
+}

package/src/composables/http/useRequest.ts

@@ -0,0 +1,107 @@
+/**
+ * useRequest - 组件内请求 composable
+ */
+import { http } from './client';
+import type { RequestConfig, ApiResponse } from './types';
+import { ref } from 'vue';
+
+export interface UseRequestOptions<T = unknown> {
+  /** 初始数据 */
+  initialData?: T | null;
+  /** 手动触发，不自动请求 */
+  manual?: boolean;
+  /** 成功回调 */
+  onSuccess?: (data: T, res: ApiResponse<T>) => void;
+  /** 失败回调 */
+  onError?: (err: Error) => void;
+}
+
+/**
+ * 创建带有 loading、data、error 状态的请求方法集。
+ *
+ * @example
+ * const { loading, data, error, run } = useRequest<User>();
+ * run({ url: '/user/info', method: 'GET' });
+ */
+export function useRequest<T = unknown>(options: UseRequestOptions<T> = {}) {
+  const { initialData = null, manual = false, onSuccess, onError } = options;
+
+  const loading = ref(false);
+  const data = ref<T | null>(initialData);
+  const error = ref<Error | null>(null);
+
+  /**
+   * 执行一次自定义请求配置。
+   */
+  async function run(config: RequestConfig): Promise<ApiResponse<T>> {
+    loading.value = true;
+    error.value = null;
+    try {
+      const res = await http.request<T>(config);
+      data.value = res.data as T;
+      onSuccess?.(res.data as T, res);
+      return res;
+    } catch (e) {
+      error.value = e as Error;
+      onError?.(e as Error);
+      throw e;
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  /**
+   * 发起 GET 请求。
+   */
+  function get(url: string, data?: unknown) {
+    return run({ url, method: 'GET', data });
+  }
+
+  /**
+   * 发起 POST 请求。
+   */
+  function post(url: string, data?: unknown) {
+    return run({ url, method: 'POST', data });
+  }
+
+  /**
+   * 发起 PUT 请求。
+   */
+  function put(url: string, data?: unknown) {
+    return run({ url, method: 'PUT', data });
+  }
+
+  /**
+   * 发起 DELETE 请求。
+   */
+  function del(url: string, data?: unknown) {
+    return run({ url, method: 'DELETE', data });
+  }
+
+  if (!manual) {
+    // 空配置时保持手动触发，避免误请求。
+  }
+
+  return { loading, data, error, run, get, post, put, del };
+}
+
+/**
+ * 上传文件状态管理 composable。
+ */
+export function useUpload() {
+  const uploading = ref(false);
+
+  /**
+   * 调用全局 http.upload 执行文件上传。
+   */
+  async function upload(options: Parameters<typeof http.upload>[0]) {
+    uploading.value = true;
+    try {
+      return await http.upload(options);
+    } finally {
+      uploading.value = false;
+    }
+  }
+
+  return { uploading, upload };
+}

package/src/composables/index.ts

@@ -0,0 +1,82 @@
+/**
+ * Composables 统一导出
+ */
+export * from "./http";
+export { useLoading } from "./loading";
+export { useMsg, type HlwMsg, type ToastOptions, type ModalOptions, type ToastIcon } from "./msg";
+export { useDevice, deviceToQuery, clearDeviceCache, type DeviceInfo } from "./device";
+export { useRefs } from "./refs";
+export { usePageMeta } from "./page-meta";
+export { useStorage, type StorageInstance } from "./storage";
+export { useValidate } from "./validate";
+export { useFormat } from "./format";
+export {
+    useAd,
+    configAd,
+    destroyAds,
+    confirmReward,
+    type AdType,
+    type AdConfig,
+    type AdError,
+    type AdAdapter,
+    type AdCloseResult,
+    type AdClaimResult,
+    type AdClaimFn,
+} from "./ad";
+export {
+    useShare,
+    useShareConfig,
+    configShare,
+    type ShareConfig,
+    type ShareConfigResolver,
+    type ShareFrom,
+    type ShareAppMessageContent,
+    type ShareTimelineContent,
+    type ShareConfigMap,
+    type ShareConfigAdapter,
+    type PageShareItem,
+    type PageShareFallback,
+    type SharePayload,
+} from "./share";
+export {
+    useContact,
+    configContact,
+    type ContactConfig,
+    type ContactAdapter,
+    type ContactBindProps,
+} from "./contact";
+export { useUtils, type DownloadFileOptions, type DownloadFileResult, type TapEvent } from "./utils";
+export { useColor } from "./color";
+export { useRouter, type NavigateType, type NavigateOptions } from "./navigator";
+
+// Theme（mp-vue 自带）
+export type { FontScale, FontPreset } from "./theme";
+export {
+    FONT_SCALE_KEY,
+    FONT_PRESETS,
+    getCurrentFontScale,
+    getCurrentFontVars,
+    THEME_CHANGE_EVENT,
+    buildThemeStyle,
+    useThemePageStyle,
+} from "./theme";
+export type { ThemeColor } from "./theme";
+export {
+    THEME_COLOR_KEY,
+    THEME_SEMANTIC_COLORS,
+    DEFAULT_THEMES,
+    getCurrentThemeColor,
+    getCurrentThemeVars,
+} from "./theme";
+export type { Appearance, AppearanceMode, AppearancePreset } from "./theme";
+export {
+    APPEARANCE_KEY,
+    APPEARANCE_PRESETS,
+    APPEARANCE_VAR_MAP,
+    getCurrentAppearance,
+    getCurrentAppearanceMode,
+    getCurrentAppearanceVars,
+    resolveAppearance,
+} from "./theme";
+export type { TypographyRole } from "./theme";
+export { TYPOGRAPHY_ROLES, getCurrentTypographyVars } from "./theme";