@pubinfo/core 2.0.12 → 2.0.13

package/src/features/components/PartyLogin/type.ts

@@ -0,0 +1,43 @@
+export type HTTPParamsLabel = 'Query' | 'Body' | 'Header' | 'Cookie';
+export type HTTPParamsValue = 'query' | 'body' | 'header' | 'cookie';
+export type HTTPMethod = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH' | 'HEAD' | 'OPTIONS';
+
+// Shared item types used by ParamsItem and Modal
+export type ItemType = 'string' | 'number' | 'boolean' | 'system' | 'request';
+export type ParamValue = string | number | 'true' | 'false';
+export interface ParamItem {
+  id: number
+  checked: boolean
+  keyName: string
+  type: ItemType
+  value: ParamValue
+  systemKey?: string // Store the selected system field key for restoration
+  requestKey?: string // Store the selected request field key for restoration
+}
+
+// Party Login configuration interface
+export interface PartyLoginStepConfig {
+  step: number
+  request?: {
+    url: string
+    method: HTTPMethod
+    params: {
+      query: PartyLoginParamItem[]
+      body: PartyLoginParamItem[]
+      header: PartyLoginParamItem[]
+      cookie: PartyLoginParamItem[]
+    }
+  }
+  oauth?: {
+    params: PartyLoginParamItem[]
+  }
+}
+
+export interface PartyLoginParamItem {
+  key: string
+  type: ItemType
+  value?: ParamValue
+  field?: string // For system/request types
+}
+
+export type PartyLoginConfig = PartyLoginStepConfig[];

package/src/features/components/PartyLogin/usePartyRequest.ts

@@ -0,0 +1,244 @@
+import type { Ref } from 'vue';
+import type { HTTPMethod } from './type';
+import { message } from 'ant-design-vue';
+import { ref } from 'vue';
+
+export interface RequestParams {
+  header?: Record<string, any>
+  body?: Record<string, any>
+  query?: Record<string, any>
+  cookie?: Record<string, any>
+}
+
+export interface UsePartyRequestOptions {
+  url: Ref<string>
+  method: Ref<HTTPMethod>
+  params: Ref<RequestParams>
+}
+
+export function usePartyRequest({ url, method, params }: UsePartyRequestOptions) {
+  const isFetching = ref(false);
+  const isFinished = ref(false);
+  const statusCode = ref<number | undefined>(undefined);
+  const data = ref<any>(undefined);
+  const elapsedTime = ref<number | undefined>(undefined); // in milliseconds
+
+  /**
+   * 深度解析对象中的 JSON 字符串字段
+   * 递归地将所有可解析的 JSON 字符串转换为对象
+   */
+  function deepParseJSON(obj: any): any {
+    if (obj === null || obj === undefined) {
+      return obj;
+    }
+
+    // 如果是字符串,尝试解析为 JSON
+    if (typeof obj === 'string') {
+      try {
+        const parsed = JSON.parse(obj);
+        // 递归解析嵌套的 JSON 字符串
+        return deepParseJSON(parsed);
+      }
+      catch {
+        // 如果解析失败,返回原始字符串
+        return obj;
+      }
+    }
+
+    // 如果是数组,递归处理每个元素
+    if (Array.isArray(obj)) {
+      return obj.map(item => deepParseJSON(item));
+    }
+
+    // 如果是对象,递归处理每个属性
+    if (typeof obj === 'object') {
+      const result: Record<string, any> = {};
+      for (const key in obj) {
+        if (Object.prototype.hasOwnProperty.call(obj, key)) {
+          result[key] = deepParseJSON(obj[key]);
+        }
+      }
+      return result;
+    }
+
+    // 其他类型(数字、布尔值等)直接返回
+    return obj;
+  }
+
+  function buildQueryString(queryObj: Record<string, any>) {
+    const usp = new URLSearchParams();
+    Object.entries(queryObj || {}).forEach(([k, v]) => {
+      if (Array.isArray(v)) {
+        v.forEach(it => usp.append(k, String(it)));
+      }
+      else if (v != null) {
+        usp.append(k, String(v));
+      }
+    });
+    const s = usp.toString();
+    return s ? `?${s}` : '';
+  }
+
+  function ensureUrlWithQuery(rawUrl: string, queryObj: Record<string, any>) {
+    try {
+      const u = new URL(rawUrl);
+      const current = new URLSearchParams(u.search);
+      Object.entries(queryObj || {}).forEach(([k, v]) => {
+        if (Array.isArray(v)) {
+          v.forEach(it => current.append(k, String(it)));
+        }
+        else if (v != null) {
+          current.set(k, String(v));
+        }
+      });
+      u.search = current.toString();
+      return u.toString();
+    }
+    catch (_e) {
+      const s = buildQueryString(queryObj);
+      if (!rawUrl.includes('?')) {
+        return `${rawUrl}${s}`;
+      }
+      return `${rawUrl}&${s.replace(/^\?/, '')}`;
+    }
+  }
+
+  function serializeBody(bodyObj: Record<string, any>, headers: Record<string, string>) {
+    const ct = Object.keys(headers).find(k => k.toLowerCase() === 'content-type');
+    const contentType = ct ? headers[ct] : 'application/json';
+    if (!ct) {
+      headers['Content-Type'] = contentType;
+    }
+
+    if (!bodyObj || Object.keys(bodyObj).length === 0) {
+      return undefined;
+    }
+
+    const type = contentType.split(';')[0].trim().toLowerCase();
+    if (type === 'application/json') {
+      return JSON.stringify(bodyObj);
+    }
+    if (type === 'application/x-www-form-urlencoded') {
+      const usp = new URLSearchParams();
+      Object.entries(bodyObj).forEach(([k, v]) => {
+        if (Array.isArray(v)) {
+          v.forEach(it => usp.append(k, String(it)));
+        }
+        else if (v != null) {
+          usp.append(k, String(v));
+        }
+      });
+      return usp.toString();
+    }
+    if (type === 'multipart/form-data') {
+      const fd = new FormData();
+      Object.entries(bodyObj).forEach(([k, v]) => {
+        if (Array.isArray(v)) {
+          v.forEach(it => fd.append(k, it as any));
+        }
+        else if (v != null) {
+          fd.append(k, v as any);
+        }
+      });
+      if (ct) {
+        delete headers[ct];
+      }
+      else {
+        delete headers['Content-Type'];
+      }
+      return fd as any;
+    }
+    return String(bodyObj);
+  }
+
+  async function send() {
+    // reset state
+    isFinished.value = false;
+    statusCode.value = undefined;
+    data.value = undefined;
+    elapsedTime.value = undefined;
+
+    const rawUrl = url.value.trim();
+    if (!rawUrl) {
+      message.error('请输入请求地址');
+      return;
+    }
+
+    const currentParams = params.value || {};
+    const { query = {}, body = {}, header = {}, cookie = {} } = currentParams;
+
+    const headers: Record<string, string> = {};
+    Object.entries(header).forEach(([k, v]) => {
+      headers[k] = String(v);
+    });
+
+    const cookiePairs = Object.entries(cookie).map(([k, v]) => `${k}=${v}`);
+    const hasCookie = cookiePairs.length > 0;
+    if (hasCookie) {
+      headers.Cookie = cookiePairs.join('; ');
+    }
+
+    const finalUrl = ensureUrlWithQuery(rawUrl, query);
+
+    let requestBody: any;
+    const m = method.value;
+    if (!['GET', 'HEAD'].includes(m)) {
+      requestBody = serializeBody(body, headers);
+    }
+
+    const startTime = Date.now();
+    isFetching.value = true;
+    try {
+      const res = await fetch(finalUrl, {
+        method: m,
+        headers,
+        body: requestBody,
+        credentials: hasCookie ? 'include' : 'same-origin',
+        mode: 'cors',
+      } as RequestInit);
+
+      elapsedTime.value = Date.now() - startTime;
+      statusCode.value = res.status;
+
+      const contentType = res.headers.get('content-type') || '';
+      if (contentType.includes('application/json')) {
+        const jsonData = await res.json();
+        // 深度解析 JSON 字符串字段
+        data.value = deepParseJSON(jsonData);
+      }
+      else {
+        const text = await res.text();
+        try {
+          const jsonData = JSON.parse(text);
+          // 深度解析 JSON 字符串字段
+          data.value = deepParseJSON(jsonData);
+        }
+        catch {
+          data.value = text;
+        }
+      }
+    }
+    catch (e: any) {
+      elapsedTime.value = Date.now() - startTime;
+      statusCode.value = 0;
+      data.value = {
+        error: e?.message || String(e),
+        message: '请求失败,可能是网络问题或 CORS 跨域限制',
+      };
+      message.error(`请求失败: ${e?.message || String(e)}`);
+    }
+    finally {
+      isFetching.value = false;
+      isFinished.value = true;
+    }
+  }
+
+  return {
+    send,
+    isFinished,
+    isFetching,
+    statusCode,
+    data,
+    elapsedTime,
+  } as const;
+}

package/src/features/components/PubinfoIcon/index.vue

@@ -242,7 +242,7 @@ const style = computed(() => {
 const bind = computed(() => {
   if (isBox.value !== 'null') {
     const result: Record<
-    '--pubinfo-box-background' | '--pubinfo-box-size' | '--pubinfo-box-radius' | '--pubinfo-box-gradient-from' | '--pubinfo-box-gradient-to' | '--pubinfo-box-angle' | '--pubinfo-box-full-background',
+    '--pubinfo-box-background' | '--pubinfo-box-size' | '--pubinfo-box-radius' | '--pubinfo-box-gradient-from' | '--pubinfo-box-gradient-to' | '--pubinfo-box-angle' | '--pubinfo-box-full-background' | '--pubinfo-box-icon-size',
     string> = {
       '--pubinfo-box-background': '',
       '--pubinfo-box-size': '',
@@ -251,6 +251,7 @@ const bind = computed(() => {
       '--pubinfo-box-gradient-to': '',
       '--pubinfo-box-angle': '',
       '--pubinfo-box-full-background': '',
+      '--pubinfo-box-icon-size': '',
     };
     if (typeof props.angle === 'string') {
       result['--pubinfo-box-angle'] = props.angle;
@@ -269,11 +270,32 @@ const bind = computed(() => {
       result['--pubinfo-box-gradient-to'] = props.background?.to || '#35C724';
     }
     result['--pubinfo-box-radius'] = props.radius !== undefined
-      ? (typeof props.radius === 'number' ? `${props.small ? props.radius / 2 : props.radius}px` : props.small ? `calc(${props.radius} / 2)` : props.radius)
+      ? (typeof props.radius === 'number' ? `${props.small ? props.radius / 2 : props.radius}px` : props.small ? `${props.radius}` : props.radius)
       : (props.box === 'prism' ? `${props.small ? '3px' : '6px'}` : `${props.small ? '7px' : '14px'}`);
     if (props.size) {
       result['--pubinfo-box-size'] = typeof props.size === 'number' ? `${props.size}px` : props.size;
     }
+    // iconSize: 支持百分比或任意 CSS 长度；number 视为百分比
+    const iconSizeProp = (props as any).iconSize as number | string | undefined;
+    if (iconSizeProp !== undefined) {
+      if (typeof iconSizeProp === 'number' && Number.isFinite(iconSizeProp)) {
+        // 数字：视为百分比，直接生成 calc(px) 表达式（相对 box 尺寸）
+        result['--pubinfo-box-icon-size'] = `calc(var(--pubinfo-box-size) * ${iconSizeProp / 100})`;
+      }
+      else if (typeof iconSizeProp === 'string') {
+        const v = iconSizeProp.trim();
+        if (v.endsWith('%')) {
+          const n = Number.parseFloat(v);
+          if (Number.isFinite(n)) {
+            result['--pubinfo-box-icon-size'] = `calc(var(--pubinfo-box-size) * ${n / 100})`;
+          }
+        }
+        else {
+          // 其他单位：直接作为绝对大小
+          result['--pubinfo-box-icon-size'] = v;
+        }
+      }
+    }
     return {
       style: { ...result, ...style.value },
     };
@@ -300,8 +322,8 @@ const bind = computed(() => {
     data-[box-type=null]:fill-current data-[box-type=null]:leading-[1]
     data-[box-type=null]:align-top
     data-[box]:size-[var(--pubinfo-box-size)]!
-    data-[box]:text-[calc(var(--pubinfo-box-size)_*_0.5)]!
-    text-[calc(var(--pubinfo-icon-size))]
+    data-[box]:font-size-[var(--pubinfo-box-icon-size,_calc(var(--pubinfo-box-size)_*_.5))]!
+    font-size-[calc(var(--pubinfo-icon-size))]
     text-[var(--pubinfo-icon-color)]
     [transform:var(--pubinfo-icon-transform)]"
     v-bind="bind"

package/src/features/components/PubinfoIcon/props.ts

@@ -33,6 +33,13 @@ export interface PubinfoIconBoxOptions extends PubinfoIconNotBoxOptions {
   radius?: number | string
   /** 背景渐变的角度 */
   angle?: number | string
+  /**
+   * 图标在盒子内的尺寸（百分比或任意 CSS 尺寸）。
+   * - 传 number：视为百分比，例如 80 => 80%
+   * - 传 '80%'：将按比例缩放相对 box 尺寸
+   * - 传其他 CSS 长度（如 '24px' / '1.2rem'）：将作为最终字体大小使用（不再与 box 关联）
+   */
+  iconSize?: number | string
   /** 是否是小 logo */
   small?: boolean
 }

package/src/features/components/index.ts

@@ -1,10 +1,11 @@
 export { default as PageHeader } from './PageHeader/index.vue';
 export { default as PageMain } from './PageMain/index.vue';
+export { default as PartyLoginModal } from './PartyLogin/Modal.vue';
 export { default as PassStrengthValidator } from './PassStrengthValidator/index.vue';
 export { default as PubinfoApp } from './PubinfoApp/index.vue';
 export { default as PubinfoIcon } from './PubinfoIcon/index.vue';
 export { default as PubinfoIconPrismBox } from './PubinfoIcon/PrismBox.vue';
 export { default as PubinfoIconSquareBox } from './PubinfoIcon/SquareBox.vue';
-export { default as PubinfoProvider } from './PubinfoProvider';
+export { default as PubinfoProvider } from './PubinfoProvider'; ;
 
 export { createPubinfoProvider, pubinfoInjectionKey } from './PubinfoProvider'; ;