jobsys-explore 4.8.1 → 5.0.0

package/.github/workflows/npm-publish.yml

@@ -0,0 +1,40 @@
+name: NPM Publish
+
+on:
+  push:
+    tags:
+      - 'v*'
+  workflow_dispatch:
+
+permissions:
+  contents: read
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Enable Corepack
+        run: corepack enable
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          registry-url: 'https://registry.npmjs.org'
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build
+        run: pnpm run build
+
+      - name: Publish to npm
+        run: pnpm publish --access public --no-git-checks
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/.oxfmtrc.json

@@ -0,0 +1,29 @@
+{
+  "include": [
+    "**/*.js",
+    "**/*.jsx",
+    "**/*.ts",
+    "**/*.tsx",
+    "**/*.vue",
+    "**/*.json",
+    "**/*.md"
+  ],
+  "exclude": [
+    "node_modules/**",
+    "dist/**",
+    ".git/**",
+    ".github/**",
+    "coverage/**",
+    ".vite/**",
+    ".rolldown/**",
+    ".cache/**",
+    "playground/**"
+  ],
+  "lineWidth": 100,
+  "indentWidth": 4,
+  "useTabs": false,
+  "quoteStyle": "double",
+  "trailingComma": "es5",
+  "bracketSpacing": true,
+  "arrowParens": "avoid"
+}

package/.oxlintrc.json

@@ -0,0 +1,57 @@
+{
+  "env": {
+    "browser": true,
+    "node": true,
+    "es2024": true
+  },
+  "rules": {
+    "import/no-unused-modules": "warn",
+    "no-console": "off",
+    "no-debugger": "warn"
+  },
+  "categories": {
+    "correctness": "error",
+    "perf": "warn",
+    "style": "off",
+    "suspicious": "warn"
+  },
+  "ignorePatterns": [
+    "node_modules/",
+    "dist/",
+    ".git/",
+    ".github/",
+    "coverage/",
+    ".vite/",
+    ".rolldown/",
+    ".cache/",
+    "playground/"
+  ],
+  "plugins": [
+    "import",
+    "node",
+    "unicorn"
+  ],
+  "settings": {
+    "import/resolver": {
+      "node": {
+        "extensions": [
+          ".js",
+          ".jsx",
+          ".ts",
+          ".tsx",
+          ".vue"
+        ]
+      }
+    }
+  },
+  "overrides": [
+    {
+      "files": [
+        "**/*.vue"
+      ],
+      "rules": {
+        "vue/no-unused-vars": "warn"
+      }
+    }
+  ]
+}

package/DEVELOPMENT.md

@@ -0,0 +1,289 @@
+# Explore UI 开发和发布指南
+
+## 目录
+
+- [环境准备](#环境准备)
+- [开发流程](#开发流程)
+- [代码规范](#代码规范)
+- [构建和发布](#构建和发布)
+- [版本管理](#版本管理)
+- [故障排除](#故障排除)
+
+---
+
+## 环境准备
+
+### 前置要求
+
+- **Node.js**: >= 20.x
+- **pnpm**: >= 8.x
+
+```bash
+# 检查 Node.js 版本
+node -v
+
+# 检查 pnpm 版本
+pnpm -v
+
+# 如果未安装 pnpm
+npm install -g pnpm
+```
+
+### 安装依赖
+
+```bash
+# 安装项目依赖
+pnpm install
+```
+
+### Git 配置（可选）
+
+```bash
+# 配置 Git 远程仓库
+git remote add origin https://github.com/jobsys/explore-ui.git
+```
+
+---
+
+## 开发流程
+
+### 启动开发服务器
+
+```bash
+pnpm run dev
+```
+
+- 默认端口：3000
+- 自动开启 HMR（热模块替换）
+- 支持本地 network 访问
+
+### 创建新组件
+
+1. 在 `components/` 目录下创建新组件文件夹
+2. 编写组件代码和样式
+3. 确保导出组件
+
+### 创建新 Hook
+
+1. 在 `hooks/` 目录下创建新的 hook 文件
+2. 遵循 `useXxx` 命名规范
+3. 在 `hooks/index.js` 中导出
+
+### 创建新指令
+
+1. 在 `directives/` 目录下创建新的指令文件
+2. 在 `directives/index.js` 中导出
+
+---
+
+## 代码规范
+
+### 代码检查
+
+```bash
+# 运行 oxlint 检查
+pnpm run lint
+```
+
+### 代码格式化
+
+```bash
+# 格式化所有文件
+pnpm run fmt
+
+# 或使用 oxfmt 直接命令
+oxfmt write
+```
+
+### 格式化配置 (.oxfmtrc.json)
+
+| 配置项 | 值 | 说明 |
+|--------|-----|------|
+| lineWidth | 100 | 最大行宽 |
+| indentWidth | 4 | 缩进空格数 |
+| useTabs | false | 使用空格缩进 |
+| quoteStyle | double | 双引号 |
+| trailingComma | es5 | ES5 风格尾随逗号 |
+
+### Lint 配置 (.oxlintrc.json)
+
+- **correctness**: error - 正确性问题必须修复
+- **perf**: warn - 性能问题警告
+- **suspicious**: warn - 可疑代码警告
+- **style**: off - 风格问题由格式化器处理
+
+---
+
+## 构建和发布
+
+### 构建
+
+```bash
+# 生产环境构建
+pnpm run build
+```
+
+构建输出：
+- `dist/jobsys-explore.js` - ESM 格式
+- `dist/jobsys-explore.cjs` - CommonJS 格式
+- `dist/hooks.js` - Hooks 导出
+- `dist/directives.js` - 指令导出
+
+### 发布到 npm
+
+#### 方式一：手动发布
+
+```bash
+# 1. 更新 package.json 中的 version
+# 2. 提交并打标签
+git add .
+git commit -m "chore: release v1.0.0"
+git tag v1.0.0
+
+# 3. 推送代码和标签
+git push origin main
+git push origin v1.0.0
+
+# 4. 发布到 npm
+pnpm publish --no-git-checks
+```
+
+#### 方式二：GitHub Actions 自动发布
+
+推送版本标签后自动发布：
+
+```bash
+# 打版本标签
+git tag v1.0.0
+git push origin v1.0.0
+```
+
+> **注意**: 需要在 GitHub 仓库的 Settings → Secrets and variables 中配置 `NPM_TOKEN`
+
+### 获取 NPM Token
+
+1. 登录 [npmjs.com](https://www.npmjs.com/)
+2. 进入 Account Settings → Access Tokens
+3. 创建新令牌（Automation 类型）
+4. 将令牌添加到 GitHub Secrets
+
+---
+
+## 版本管理
+
+### 版本号规范
+
+遵循 [Semantic Versioning](https://semver.org/lang/zh-CN/)：
+
+- **MAJOR.MINOR.PATCH** (例如：1.0.0)
+- **Major**: 破坏性变更
+- **Minor**: 新功能（向后兼容）
+- **Patch**: Bug 修复（向后兼容）
+
+### 发布流程
+
+1. **开发阶段**: `x.x.x-alpha.0`, `x.x.x-beta.0`
+2. **候选版本**: `x.x.x-rc.0`
+3. **正式版本**: `x.x.x`
+
+### 更新 peerDependencies
+
+当 Vue 或其他核心依赖发布新版本时：
+
+```bash
+# 检查最新版本
+npm view vue version
+npm view vant version
+
+# 更新 package.json
+pnpm add -D vue@latest
+```
+
+---
+
+## 故障排除
+
+### pnpm install 失败
+
+```bash
+# 清除缓存
+pnpm store prune
+
+# 删除 node_modules 和 lock 文件
+rm -rf node_modules pnpm-lock.yaml
+pnpm install
+```
+
+### 构建失败
+
+```bash
+# 检查 Node.js 版本（需要 >= 20）
+node -v
+
+# 清除缓存重新构建
+rm -rf dist
+pnpm run build
+```
+
+### Lint 报错
+
+```bash
+# 查看详细错误信息
+pnpm run lint
+
+# 自动修复（如果支持）
+oxlint --fix
+```
+
+### 发布失败
+
+```bash
+# 检查 npm 登录状态
+npm whoami
+
+# 如果未登录
+npm login
+
+# 手动发布
+pnpm publish --no-git-checks --access public
+```
+
+---
+
+## 项目结构
+
+```
+explore-ui/
+├── components/          # Vue 组件
+├── business-components/ # 业务组件
+├── hooks/              # Composable hooks
+├── directives/         # Vue 指令
+├── utils/              # 工具函数
+├── playground/         # 开发测试目录
+├── dist/               # 构建输出
+├── .github/workflows/  # GitHub Actions
+└── package.json        # 项目配置
+```
+
+---
+
+## 常用命令速查
+
+| 命令 | 说明 |
+|------|------|
+| `pnpm run dev` | 启动开发服务器 |
+| `pnpm run build` | 生产构建 |
+| `pnpm run lint` | 代码检查 |
+| `pnpm run fmt` | 代码格式化 |
+| `pnpm install` | 安装依赖 |
+| `pnpm publish --no-git-checks` | 发布到 npm |
+
+---
+
+## 相关资源
+
+- [Vite 文档](https://vite.dev/)
+- [Vue 3 文档](https://vuejs.org/)
+- [Oxlint 文档](https://oxc.rs/docs/guide/linter)
+- [Oxfmt 文档](https://oxc.rs/docs/guide/formatter)
+- [npm 发布指南](https://docs.npmjs.com/packages-and-modules/contributing-packages-to-the-registry)

package/components/form/ExAddress.jsx

@@ -158,9 +158,9 @@ export function useAddressFullCode(code, level) {
 	code += ""
 	if (code && code.length === 6) {
 		if (!level) {
-			if (/0000$/.test(code)) {
+			if (code.endsWith('0000')) {
 				level = 1
-			} else if (/00$/.test(code)) {
+			} else if (code.endsWith('00')) {
 				level = 2
 			} else {
 				level = 3

package/components/form/ExForm.jsx

@@ -1,5 +1,5 @@
 import { computed, defineComponent, inject, nextTick, onMounted, reactive, ref, watch } from "vue"
-import { EX_UPLOADER, EX_FORM } from "../provider/ExProvider.jsx"
+import { EX_FORM, EX_UPLOADER } from "../provider/ExProvider.jsx"
 import { cloneDeep, every, isArray, isEqual, isFunction, isObject, isString, pick } from "lodash-es"
 import { initItemDefaultValue } from "./utils"
 import { useCache, useFetch, useFormFail, useFormFormat, useProcessStatusSuccess } from "../../hooks"
@@ -162,7 +162,7 @@ export default defineComponent({
 		 * 表单配置，[见下表](#form-表单配置)
 		 */
 		form: {
-			type: Array,
+			type: [Array, Function],
 			default() {
 				return []
 			},
@@ -214,7 +214,7 @@ export default defineComponent({
 			submitFormBackup: {}, //初始化后的表单数据备份，用于重置表单以及脏数据判断
 		})
 
-		const formItems = computed(() => props.form)
+		const formItems = computed(() => (isFunction(props.form) ? props.form() : props.form))
 
 		const uploaderProvider = inject(EX_UPLOADER, () => ({}))
 		const formProvider = inject(EX_FORM, () => ({}))
@@ -355,6 +355,7 @@ export default defineComponent({
 				try {
 					await showConfirmDialog({ message: props.submitConfirmText })
 				} catch (e) {
+                    console.error(e)
 					return
 				}
 			}

package/components/form/FormItem.jsx

@@ -56,9 +56,9 @@ const render = (item, submitForm, { props, slots }) => {
 					? {
 							...rule,
 							pattern: new RegExp(rule.pattern),
-					  }
+						}
 					: { ...rule },
-		  )
+			)
 		: []
 
 	// 具体组件的 props
@@ -103,91 +103,91 @@ const render = (item, submitForm, { props, slots }) => {
 		switch (item.type) {
 			case "select":
 				renderItem = (
-					<ExSelect v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExSelect key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExSelect>
 				)
 				break
 			case "date":
 				renderItem = (
-					<ExDate v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExDate key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExDate>
 				)
 				break
 			case "datetime":
 				renderItem = (
-					<ExDatetime v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExDatetime key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExDatetime>
 				)
 				break
 			case "time":
 				renderItem = (
-					<ExTime v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExTime key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExTime>
 				)
 				break
 			case "switch":
 				renderItem = (
-					<ExSwitch v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExSwitch key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExSwitch>
 				)
 				break
 			case "radio":
 				renderItem = (
-					<ExRadio v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExRadio key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExRadio>
 				)
 				break
 			case "checkbox":
 				renderItem = (
-					<ExCheckbox v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExCheckbox key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExCheckbox>
 				)
 				break
 			case "address":
 				renderItem = (
-					<ExAddress v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExAddress key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExAddress>
 				)
 				break
 			case "cascade":
 				renderItem = (
-					<ExCascader v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExCascader key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExCascader>
 				)
 				break
 			case "number":
 				renderItem = (
-					<ExNumber v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExNumber key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExNumber>
 				)
 				break
 			case "rate":
 				renderItem = (
-					<ExRate v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExRate key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExRate>
 				)
 				break
 			case "slider":
 				renderItem = (
-					<ExSlider v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExSlider key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExSlider>
 				)
 				break
 			case "uploader":
 				renderItem = (
-					<ExFieldUploader v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
+					<ExFieldUploader key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps}>
 						{componentSlots}
 					</ExFieldUploader>
 				)
@@ -230,7 +230,7 @@ const render = (item, submitForm, { props, slots }) => {
 			case "textarea":
 				fieldProps.type = "textarea"
 				renderItem = (
-					<ExField v-model={submitForm[item.key]} {...fieldProps}>
+					<ExField key={item.key} v-model={submitForm[item.key]} {...fieldProps}>
 						{componentSlots}
 					</ExField>
 				)
@@ -238,7 +238,7 @@ const render = (item, submitForm, { props, slots }) => {
 			case "password":
 				fieldProps.type = "password"
 				renderItem = (
-					<ExField v-model={submitForm[item.key]} {...fieldProps}>
+					<ExField key={item.key} v-model={submitForm[item.key]} {...fieldProps}>
 						{componentSlots}
 					</ExField>
 				)
@@ -254,7 +254,7 @@ const render = (item, submitForm, { props, slots }) => {
 						return true
 					}
 				}
-				renderItem = <ExMatrixRadio v-model={submitForm[item.key]} {...componentProps} {...fieldProps} />
+				renderItem = <ExMatrixRadio key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps} />
 				break
 			}
 			case "matrix-scale": {
@@ -268,7 +268,7 @@ const render = (item, submitForm, { props, slots }) => {
 						return true
 					}
 				}
-				renderItem = <ExMatrixScale v-model={submitForm[item.key]} {...componentProps} {...fieldProps} />
+				renderItem = <ExMatrixScale key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps} />
 				break
 			}
 			case "matrix-checkbox": {
@@ -282,12 +282,12 @@ const render = (item, submitForm, { props, slots }) => {
 						return true
 					}
 				}
-				renderItem = <ExMatrixCheckbox v-model={submitForm[item.key]} {...componentProps} {...fieldProps} />
+				renderItem = <ExMatrixCheckbox key={item.key} v-model={submitForm[item.key]} {...componentProps} {...fieldProps} />
 				break
 			}
 			default:
 				renderItem = (
-					<ExField v-model={submitForm[item.key]} {...fieldProps}>
+					<ExField key={item.key} v-model={submitForm[item.key]} {...fieldProps}>
 						{componentSlots}
 					</ExField>
 				)

package/components/pagination/ExPagination.jsx

@@ -1,6 +1,6 @@
-import { defineComponent, inject, reactive, nextTick, ref, onMounted, onUnmounted } from "vue"
-import { useFetch, useCache, useSm3 } from "../../hooks"
-import { closeToast, Empty, List, Pagination, PullRefresh, showLoadingToast, Sticky } from "vant"
+import { defineComponent, inject, nextTick, onMounted, onUnmounted, reactive, ref } from "vue"
+import { useCache, useFetch, useSm3 } from "../../hooks"
+import { closeToast, Empty, List, Pagination, PullRefresh, showLoadingToast, showToast, Sticky } from "vant"
 import ExSearch from "../search/ExSearch.jsx"
 import "./index.less"
 import { EX_PAGINATION } from "../provider/ExProvider.jsx"
@@ -206,6 +206,7 @@ export default defineComponent({
 				data = {}
 			try {
 				state.loading = true
+				state.refreshLoading = true
 
 				const method = props.method
 
@@ -224,6 +225,7 @@ export default defineComponent({
 
 				res = await useFetch()[method](props.url, data)
 			} catch (e) {
+                console.error(e)
 				state.error = true
 				state.errorMessage = "加载失败"
 				if (props.persistence) {
@@ -281,6 +283,14 @@ export default defineComponent({
 		}
 
 		const onSearch = (searchData) => {
+			if (state.loading || state.refreshLoading) {
+				showToast({
+					message: "加载中，请稍后",
+					forbidClick: true,
+				})
+				return
+			}
+
 			const isPersistence = !isUndefined(searchData.persistence) && searchData.persistence
 
 			if (isPersistence) {
@@ -387,9 +397,9 @@ export default defineComponent({
 							? slots.renderItem({
 									item,
 									index,
-							  })
+								})
 							: null,
-				  )
+					)
 				: null
 
 			nextTick(() => {