@jnrs/vue-core 1.2.28 → 1.2.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +58 -0
- package/CHANGELOG.md +22 -1
- package/README.md +19 -11
- package/dist/components/JnDateQuery.vue.d.ts +54 -0
- package/dist/components/index.d.ts +2 -1
- package/dist/components/index.js +1147 -873
- package/package.json +2 -2
package/AGENTS.md
CHANGED
|
@@ -742,6 +742,64 @@ const dialogVisible = ref(false)
|
|
|
742
742
|
|
|
743
743
|
---
|
|
744
744
|
|
|
745
|
+
#### JnDateQuery
|
|
746
|
+
|
|
747
|
+
通用时间查询组件,支持日/周/月/年/任意区间五种时间类型切换,配合快捷按钮实现前后时间段快速导航。推荐使用 `showTypeSwitcher` 模式(时间查询),可覆盖所有时间类型的查询需求。
|
|
748
|
+
|
|
749
|
+
**Props:**
|
|
750
|
+
|
|
751
|
+
| 属性名 | 类型 | 默认值 | 说明 |
|
|
752
|
+
| ---------------- | ------------------------------------------------------ | -------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
|
|
753
|
+
| modelValue | `string \| [string, string]` | — | v-model 绑定值(`type='date'/'month'/'year'` 为 string,`type='week'/'daterange'` 为 [string, string]) |
|
|
754
|
+
| type | `'date' \| 'week' \| 'month' \| 'year' \| 'daterange'` | `'date'` | 日期类型;`showTypeSwitcher=true` 时作为初始类型 |
|
|
755
|
+
| showTypeSwitcher | `boolean` | `false` | 是否显示类型切换器(推荐开启,可覆盖所有时间类型) |
|
|
756
|
+
| switcherStyle | `'select' \| 'button-group'` | `'select'` | 切换器风格(下拉选择 or 按钮组) |
|
|
757
|
+
| typeOptions | `DateType[]` | `['date','week','month','year','daterange']` | 可切换的类型选项 |
|
|
758
|
+
| quickButtons | `'none' \| 'arrows' \| 'group'` | `'none'` | 快捷按钮风格(无 / 左右箭头 / 按钮组);`arrows` 模式支持 date/week/month/year(不含 daterange) |
|
|
759
|
+
| valueFormat | `string` | `'YYYY-MM-DD'` | 日期格式 |
|
|
760
|
+
| clearable | `boolean` | `false` | 是否可清除 |
|
|
761
|
+
| size | `'' \| 'small' \| 'default' \| 'large'` | `'default'` | 尺寸 |
|
|
762
|
+
| placeholder | `string` | `'选择日期'` | 单值 placeholder |
|
|
763
|
+
| startPlaceholder | `string` | `'开始日期'` | 范围开始 placeholder |
|
|
764
|
+
| endPlaceholder | `string` | `'结束日期'` | 范围结束 placeholder |
|
|
765
|
+
| rangeSeparator | `string` | `'至'` | 范围分隔符 |
|
|
766
|
+
|
|
767
|
+
**Events:**
|
|
768
|
+
|
|
769
|
+
- `update:modelValue` - 值变化时触发
|
|
770
|
+
- `change` - 值变化时触发,参数为 `(value, type)`
|
|
771
|
+
- `type-change` - 类型切换时触发,参数为 `(type)`
|
|
772
|
+
|
|
773
|
+
**使用示例:时间查询(推荐,覆盖日/周/月/年/区间)**
|
|
774
|
+
|
|
775
|
+
```vue
|
|
776
|
+
<template>
|
|
777
|
+
<JnDateQuery
|
|
778
|
+
v-model="dateValue"
|
|
779
|
+
type="date"
|
|
780
|
+
show-type-switcher
|
|
781
|
+
switcher-style="button-group"
|
|
782
|
+
:type-options="['date', 'week', 'month', 'year', 'daterange']"
|
|
783
|
+
quick-buttons="arrows"
|
|
784
|
+
value-format="YYYY-MM-DD"
|
|
785
|
+
placeholder="选择日期"
|
|
786
|
+
start-placeholder="开始日期"
|
|
787
|
+
end-placeholder="结束日期"
|
|
788
|
+
/>
|
|
789
|
+
</template>
|
|
790
|
+
|
|
791
|
+
<script setup>
|
|
792
|
+
import { ref } from 'vue'
|
|
793
|
+
import { JnDateQuery } from '@jnrs/vue-core/components'
|
|
794
|
+
|
|
795
|
+
const dateValue = (ref < string) | ([string, string] > '')
|
|
796
|
+
</script>
|
|
797
|
+
```
|
|
798
|
+
|
|
799
|
+
> 完整案例参见模板工程 `src/views/examples/playground/index.vue` 中的「JnDateQuery 时间查询」章节。
|
|
800
|
+
|
|
801
|
+
---
|
|
802
|
+
|
|
745
803
|
#### GlobalSetting
|
|
746
804
|
|
|
747
805
|
全局设置组件(用于系统设置面板)
|
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,27 @@
|
|
|
1
1
|
# 发版日志
|
|
2
2
|
|
|
3
|
-
## [1.2.
|
|
3
|
+
## [1.2.30] - 2026-07-27 【latest】
|
|
4
|
+
|
|
5
|
+
### Fixed
|
|
6
|
+
|
|
7
|
+
- `JnDateQuery`:`arrows` 快捷切换模式现在支持 `week` 类型(上周/下周快捷导航),此前因 `isRange` 判断导致周类型下箭头按钮被隐藏
|
|
8
|
+
|
|
9
|
+
### Documentation
|
|
10
|
+
|
|
11
|
+
- `AGENTS.md` 精简 `JnDateQuery` 文档:合并为单一「时间查询」使用示例(推荐 `showTypeSwitcher` 模式),补充 `arrows` 模式类型支持范围说明,指向 playground 完整案例
|
|
12
|
+
|
|
13
|
+
## [1.2.29] - 2026-07-27
|
|
14
|
+
|
|
15
|
+
### Features
|
|
16
|
+
|
|
17
|
+
- 新增 `JnDateQuery` 通用时间查询组件:合并固定类型模式(配合快捷按钮)和可切换类型模式(内置类型切换器),通过 `type` 配置绑定值为单个时间或时间范围,支持 `arrows`/`group` 两种快捷按钮风格和 `select`/`button-group` 两种切换器风格
|
|
18
|
+
|
|
19
|
+
### Documentation
|
|
20
|
+
|
|
21
|
+
- `AGENTS.md` 新增 `JnDateQuery` 组件文档(Props 表格、Events、两个使用示例)
|
|
22
|
+
- `README.md` 组件清单新增 `JnDateQuery`(时间查询)
|
|
23
|
+
|
|
24
|
+
## [1.2.28] - 2026-07-24
|
|
4
25
|
|
|
5
26
|
### Features
|
|
6
27
|
|
package/README.md
CHANGED
|
@@ -6,16 +6,16 @@
|
|
|
6
6
|
|
|
7
7
|
### 功能模块
|
|
8
8
|
|
|
9
|
-
| 模块 | 路径 | 说明
|
|
10
|
-
| ----------- | ------------------------------ |
|
|
11
|
-
| 主模块 | `@jnrs/vue-core` | 基础类型定义(`IMenuItem`, `IPagination`, `IPageData`, `IAttachment`, `IDocument` 等)
|
|
12
|
-
| Pinia | `@jnrs/vue-core/pinia` | `useSystemStore`(主题/全屏/菜单折叠)+ `useMenuStore`(动态菜单/路由)
|
|
13
|
-
| Router | `@jnrs/vue-core/router` | `createVueRouter`(创建路由实例)+ `asyncGenerateRoute`(动态路由生成)+ `handleRouter`(跳转)+ `useRouter`/`useRoute`
|
|
14
|
-
| 组件 | `@jnrs/vue-core/components` | `JnTable`(表格)、`JnPagination`(分页)、`JnDialog`(弹窗)、`JnFileUpload`(文件上传)、`JnSelectTemplate`(选择器)、`JnDatetime`(日期格式化)、`JnImportAndExport`(导入导出)等 |
|
|
15
|
-
| Composables | `@jnrs/vue-core/composables` | `useMouseSelection`(鼠标框选)、`useReactivityTableHeight`(表格高度自适应)、`useWebSocket`(WebSocket 连接)
|
|
16
|
-
| 常量 | `@jnrs/vue-core/constants` | 主题选项配置
|
|
17
|
-
| 工具 | `@jnrs/vue-core/utils` / `lib` | 工具函数 / 类型守卫
|
|
18
|
-
| 国际化 | `@jnrs/vue-core/locales` | 组件内置文案的多语言支持
|
|
9
|
+
| 模块 | 路径 | 说明 |
|
|
10
|
+
| ----------- | ------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
11
|
+
| 主模块 | `@jnrs/vue-core` | 基础类型定义(`IMenuItem`, `IPagination`, `IPageData`, `IAttachment`, `IDocument` 等) |
|
|
12
|
+
| Pinia | `@jnrs/vue-core/pinia` | `useSystemStore`(主题/全屏/菜单折叠)+ `useMenuStore`(动态菜单/路由) |
|
|
13
|
+
| Router | `@jnrs/vue-core/router` | `createVueRouter`(创建路由实例)+ `asyncGenerateRoute`(动态路由生成)+ `handleRouter`(跳转)+ `useRouter`/`useRoute` |
|
|
14
|
+
| 组件 | `@jnrs/vue-core/components` | `JnTable`(表格)、`JnPagination`(分页)、`JnDialog`(弹窗)、`JnFileUpload`(文件上传)、`JnSelectTemplate`(选择器)、`JnDatetime`(日期格式化)、`JnDateQuery`(时间查询)、`JnImportAndExport`(导入导出)等 |
|
|
15
|
+
| Composables | `@jnrs/vue-core/composables` | `useMouseSelection`(鼠标框选)、`useReactivityTableHeight`(表格高度自适应)、`useWebSocket`(WebSocket 连接) |
|
|
16
|
+
| 常量 | `@jnrs/vue-core/constants` | 主题选项配置 |
|
|
17
|
+
| 工具 | `@jnrs/vue-core/utils` / `lib` | 工具函数 / 类型守卫 |
|
|
18
|
+
| 国际化 | `@jnrs/vue-core/locales` | 组件内置文案的多语言支持 |
|
|
19
19
|
|
|
20
20
|
## 💻 技术栈
|
|
21
21
|
|
|
@@ -40,7 +40,15 @@ import { useSystemStore, useMenuStore } from '@jnrs/vue-core/pinia'
|
|
|
40
40
|
import { useRouter, useRoute, handleRouter, createVueRouter } from '@jnrs/vue-core/router'
|
|
41
41
|
|
|
42
42
|
// 组件
|
|
43
|
-
import {
|
|
43
|
+
import {
|
|
44
|
+
JnTable,
|
|
45
|
+
JnPagination,
|
|
46
|
+
JnDialog,
|
|
47
|
+
JnFileUpload,
|
|
48
|
+
JnDatetime,
|
|
49
|
+
JnDateQuery,
|
|
50
|
+
JnImportAndExport
|
|
51
|
+
} from '@jnrs/vue-core/components'
|
|
44
52
|
|
|
45
53
|
// Composables
|
|
46
54
|
import { useWebSocket, useMouseSelection } from '@jnrs/vue-core/composables'
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
type DateType = 'date' | 'week' | 'month' | 'year' | 'daterange';
|
|
2
|
+
type QuickButtonStyle = 'none' | 'arrows' | 'group';
|
|
3
|
+
type SwitcherStyle = 'select' | 'button-group';
|
|
4
|
+
interface Props {
|
|
5
|
+
/** v-model 绑定值(单值为 string,范围为 [string, string]) */
|
|
6
|
+
modelValue: string | [string, string];
|
|
7
|
+
/** 日期类型(固定模式),showTypeSwitcher=true 时作为初始类型 */
|
|
8
|
+
type?: DateType;
|
|
9
|
+
/** 是否显示类型切换器 */
|
|
10
|
+
showTypeSwitcher?: boolean;
|
|
11
|
+
/** 切换器风格 */
|
|
12
|
+
switcherStyle?: SwitcherStyle;
|
|
13
|
+
/** 可切换的类型选项 */
|
|
14
|
+
typeOptions?: DateType[];
|
|
15
|
+
/** 快捷按钮风格 */
|
|
16
|
+
quickButtons?: QuickButtonStyle;
|
|
17
|
+
/** 日期格式 */
|
|
18
|
+
valueFormat?: string;
|
|
19
|
+
/** 是否可清除 */
|
|
20
|
+
clearable?: boolean;
|
|
21
|
+
/** 尺寸 */
|
|
22
|
+
size?: '' | 'small' | 'default' | 'large';
|
|
23
|
+
/** 单值 placeholder */
|
|
24
|
+
placeholder?: string;
|
|
25
|
+
/** 范围开始 placeholder */
|
|
26
|
+
startPlaceholder?: string;
|
|
27
|
+
/** 范围结束 placeholder */
|
|
28
|
+
endPlaceholder?: string;
|
|
29
|
+
/** 范围分隔符 */
|
|
30
|
+
rangeSeparator?: string;
|
|
31
|
+
}
|
|
32
|
+
declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
33
|
+
"update:modelValue": (value: string | [string, string]) => any;
|
|
34
|
+
change: (value: string | [string, string], type: DateType) => any;
|
|
35
|
+
"type-change": (type: DateType) => any;
|
|
36
|
+
}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
|
|
37
|
+
"onUpdate:modelValue"?: ((value: string | [string, string]) => any) | undefined;
|
|
38
|
+
onChange?: ((value: string | [string, string], type: DateType) => any) | undefined;
|
|
39
|
+
"onType-change"?: ((type: DateType) => any) | undefined;
|
|
40
|
+
}>, {
|
|
41
|
+
size: "" | "small" | "default" | "large";
|
|
42
|
+
type: DateType;
|
|
43
|
+
placeholder: string;
|
|
44
|
+
clearable: boolean;
|
|
45
|
+
showTypeSwitcher: boolean;
|
|
46
|
+
switcherStyle: SwitcherStyle;
|
|
47
|
+
typeOptions: DateType[];
|
|
48
|
+
quickButtons: QuickButtonStyle;
|
|
49
|
+
valueFormat: string;
|
|
50
|
+
startPlaceholder: string;
|
|
51
|
+
endPlaceholder: string;
|
|
52
|
+
rangeSeparator: string;
|
|
53
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
54
|
+
export default _default;
|
|
@@ -8,4 +8,5 @@ import { default as JnPagination } from './JnPagination.vue';
|
|
|
8
8
|
import { default as JnDialog } from './JnDialog.vue';
|
|
9
9
|
import { default as JnTable } from './JnTable.vue';
|
|
10
10
|
import { default as JnSelectTemplate } from './JnSelectTemplate.vue';
|
|
11
|
-
|
|
11
|
+
import { default as JnDateQuery } from './JnDateQuery.vue';
|
|
12
|
+
export { GlobalSetting, JnImageView, JnPdfView, JnImportAndExport, JnFileUpload, JnDatetime, JnPagination, JnDialog, JnTable, JnSelectTemplate, JnDateQuery };
|