# `@deppon/deppon-utils`

前端工具函数库，适用于 Vue 项目。

## 功能

提供丰富的工具函数，包括：

### DOM 操作

-   `removeClass` - 移除 DOM 类名
-   `removeDom` - 移除 DOM 元素
-   `insertAfter` - 在元素后插入
-   `findParentDom` - 查找父元素

### 浏览器相关

-   `browser` - 浏览器检测
-   `setTitle` - 设置页面标题
-   `windowScrollTop` - 获取/设置滚动位置
-   `scrollTo` - 滚动到指定位置
-   `scrollToElement` - 滚动到指定元素
-   `noScroll` - 禁止滚动
-   `resolveIOSScroll` - 解决 iOS 滚动问题

### 工具函数

-   `debounce` - 防抖
-   `throttle` - 节流
-   `random` - 随机数生成
-   `isPhone` - 手机号验证
-   `isArray` - 数组判断
-   `isObject` - 对象判断
-   `isString` - 字符串判断
-   `removeSpace` - 移除空格
-   `lengthOfStr` - 字符串长度计算
-   `splitArray` - 数组分割

### URL 处理

-   `parseUrlParams` - 解析 URL 参数
-   `objectToParams` - 对象转 URL 参数
-   `replcaeUrlParam` - 替换 URL 参数
-   `replcaeUrlParams` - 替换多个 URL 参数
-   `localUrl` - 本地 URL 处理

### iframe 路由跳转

-   `isViewTabSupported` - 检查是否支持 viewTab（是否在 iframe 环境中）
-   `getParentParams` - 从父级 iframe 获取参数
-   `appendUrlParam` - 在 URL 后追加参数
-   `closeParentTab` - 关闭父级标签页
-   `viewTab` - 在 iframe 环境中打开新标签页
-   `navigate` - 智能路由跳转（优先使用 viewTab，否则使用普通跳转）
-   `isUap` - 判断系统是否在 UAP 环境内

### Cookie 相关

-   `getCookie` - 获取 Cookie
-   `setCookieDomain` - 设置 document.domain 以支持 cookie 跨域
-   `copyStr` - 复制字符串
-   `copyToClipboard` - 复制到剪贴板
-   `preloadImage` - 预加载图片
-   `Time` - 时间处理
-   `queryCode` - 查询代码
-   `login` - 登录
-   `loginCheck` - 登录检查
-   `authorize` - 授权
-   `checkName` - 名称检查
-   `open` - 打开链接
-   `openApp` - 打开 App
-   `xDomain` - 跨域处理
-   `flexible` - 移动端适配
-   `limitVersion` - 版本限制
-   `observerDom` - DOM 观察器
-   `md5` - MD5 加密
-   `getRestTimeStr` - 获取剩余时间字符串

## 使用示例

### iframe 路由跳转

```javascript
import {
    viewTab,
    navigate,
    getParentParams,
    isViewTabSupported,
    appendUrlParam,
    closeParentTab,
} from '@deppon/deppon-utils';

// 检查是否支持 viewTab
if (isViewTabSupported()) {
    // 从父级获取参数
    const params = getParentParams();
    console.log('父级参数:', params);

    // 打开新标签页
    viewTab('产品折扣新增', '/product/discount/add', 'iframe', params, {
        uumsFunction: {
            functionCode: 'CMC_FUNCTION_00002',
            sourceSystem: 'CMC',
        },
        appendIsUap: true, // 默认会在 URL 后追加 isUap=true
    });

    // 或者使用智能跳转（自动降级）
    navigate('产品折扣新增', '/product/discount/add', 'iframe', params, {
        uumsFunction: {
            functionCode: 'CMC_FUNCTION_00002',
            sourceSystem: 'CMC',
        },
    });
}

// 在 URL 后追加参数
const urlWithParam = appendUrlParam('/product/list', 'isUap=true');

// 关闭父级标签页
closeParentTab('/product/list', 'IFRAME');
```

### 实际项目中的使用方式

```javascript
// 替换原有的 top.viewTab 调用
import { viewTab, getParentParams, appendUrlParam, closeParentTab } from '@deppon/deppon-utils';

// 原有代码：
// top.viewTab && top.viewTab("CMC-产品折扣新增", url, "iframe", params, {
//     uumsFunction: {
//         functionCode: "CMC_FUNCTION_00002",
//         sourceSystem: "CMC",
//     },
// });

// 新代码：
const params = getParentParams();
viewTab('CMC-产品折扣新增', url, 'iframe', params, {
    uumsFunction: {
        functionCode: 'CMC_FUNCTION_00002',
        sourceSystem: 'CMC',
    },
});

// 如果需要先关闭标签页再打开
const tabUrl = appendUrlParam(url, 'isUap=true');
closeParentTab(tabUrl, 'IFRAME');
viewTab('CMC-产品折扣新增', url, 'iframe', params, {
    uumsFunction: {
        functionCode: 'CMC_FUNCTION_00002',
        sourceSystem: 'CMC',
    },
});
```

### UAP 环境判断

```javascript
import { isUap } from '@deppon/deppon-utils';

// 判断是否在 UAP 环境中
if (isUap()) {
    // UAP 环境下的逻辑
    console.log('当前在 UAP 环境中');
    // 隐藏头部、侧边栏等
    // 使用 UAP 特定的样式
} else {
    // 非 UAP 环境下的逻辑
    console.log('当前不在 UAP 环境中');
    // 显示完整的页面布局
}

// 在 Vue 组件中使用
export default {
    data() {
        return {
            isUapEnv: isUap(),
        };
    },
    mounted() {
        if (this.isUapEnv) {
            // UAP 环境初始化逻辑
        }
    },
};
```

**UAP 环境判断逻辑：**

1. 检查 URL 参数中是否有 `isUap=true`（支持 query 和 hash 模式）
2. 检查是否在 iframe 环境中且父级支持 `viewTab` 或 `Ext`

**使用场景：**

-   根据环境显示/隐藏页面元素（如头部、侧边栏）
-   应用不同的样式（如 UAP 环境下调整布局）
-   执行不同的初始化逻辑

### Cookie 跨域设置

```javascript
import { setCookieDomain } from '@deppon/deppon-utils';

// 在应用初始化时调用，自动设置 document.domain 以支持 cookie 跨域
setCookieDomain();

// 在 Vue 应用中使用
import { createApp } from 'vue';
import { setCookieDomain } from '@deppon/deppon-utils';

const app = createApp(App);
setCookieDomain(); // 在应用创建时调用
app.mount('#app');
```

**设置逻辑：**

-   如果 URL 包含 `deppontest.com`，自动设置 `document.domain = 'deppontest.com'`
-   如果 URL 包含 `deppon.com`，自动设置 `document.domain = 'deppon.com'`

**注意事项：**

1. `document.domain` 只能在当前域或其父域上设置
2. 设置 `document.domain` 后，端口号会被忽略
3. 如果设置失败（例如跨域限制），会静默失败，不影响其他功能