dlzn-ui 2.0.26 → 2.0.28

package/proj-template/.cursor/skills/refactor-page-list/examples.md

@@ -0,0 +1,261 @@
+# refactor-page-list 示例
+
+## 完整案例：system/config 参数设置
+
+| 文件 | 项目 |
+|------|------|
+| 原 | `yq-monitor-front/src/views/system/config/index.vue` |
+| 原表单 | `yq-monitor-front/src/views/system/config/modules/PageListItemForm.vue` |
+| 目标 | `qc-ui/src/views/system/config/index.vue` |
+
+## 原项目：列表 API + dateRange
+
+```typescript
+// yq-monitor-front
+urls: {
+  list: {
+    api: listConfig,
+    handleParams: (o) => {
+      const obj = {
+        ...o,
+        'params[beginTime]': o.dateRange[0],
+        'params[endTime]': o.dateRange[1],
+      }
+      delete obj.dateRange
+      return obj
+    },
+  },
+}
+```
+
+## 目标项目：等效写法
+
+```typescript
+// qc-ui
+apis: {
+  list: {
+    method: (o: Record<string, any>) =>
+      $alova.Get('system/config/list', {
+        params: {
+          ...o,
+          dateRange: undefined,
+          'params[beginTime]': o.dateRange[0],
+          'params[endTime]': o.dateRange[1],
+        },
+      }),
+  },
+}
+```
+
+## 原项目：批量删除
+
+```typescript
+delete: {
+  api: delConfig,
+  showBatch: true,
+  permission: 'system:config:remove',
+  handleParams: (rows) => ({
+    id: rows.map((item) => item.configId).join(','),
+  }),
+}
+```
+
+## 目标项目：等效写法
+
+```typescript
+apis: {
+  delete: {
+    method: 'system/config',
+    permission: 'system:config:remove',
+    showBatch: true,
+  },
+},
+tableOtherProps: { rowKey: 'configId' },
+```
+
+TPageList 自动执行 `$alova.Delete('system/config/1,2,3')`。
+
+## 原项目：刷新缓存按钮
+
+```typescript
+btns: [{
+  text: '刷新缓存',
+  permission: 'system:config:remove',
+  onClick: () => { $api(refreshConfigCache) },
+}]
+```
+
+## 目标项目：等效写法
+
+```typescript
+operations: [{
+  default: '刷新缓存',
+  permission: 'system:config:remove',
+  popconfirm: {
+    content: '确定要刷新缓存吗？',
+    onConfirm: async () => {
+      await $alova.Delete('system/config/refreshCache', undefined, {
+        meta: { useSuccessMsg: true },
+      })
+    },
+  },
+}]
+```
+
+## 原项目：字典列
+
+```typescript
+{
+  title: '系统内置',
+  field: 'configType',
+  cellRender: { name: 'c:dicLabel', dicCode: 'sys_yes_no' },
+}
+```
+
+## 目标项目：等效写法
+
+```typescript
+{
+  colKey: 'configType',
+  title: '系统内置',
+  cell: { component: 'DicLabel', dicCode: 'sys_yes_no' },
+}
+```
+
+## 原项目：PageListItemForm 新增默认值
+
+```typescript
+// PageListItemForm.vue
+const formData = reactive({ configType: 'Y', ... })
+```
+
+## 目标项目：等效写法
+
+```typescript
+h(TForm, {
+  data: reactive({ configType: 'Y' }),
+  items: [formItemMap.configName, ...],
+  ref: formRef,
+})
+```
+
+## 原项目：只读详情弹窗
+
+```typescript
+// yq-monitor-front（如 operlog）
+const { componentRef } = $dialog(
+  {
+    title: '操作日志详细',
+    width: '700',
+    noneCardTextPb: true,
+    showCancel: false,
+    confirmText: '关闭',
+  },
+  Detail,
+)
+nextTick(() => {
+  componentRef.value!.setFormData(row)
+})
+```
+
+## 目标项目：等效写法
+
+```typescript
+onClick: () => {
+  const formRef = ref<FormInstance | null>(null)
+
+  watch(formRef, () => {
+    formRef.value!.setFormData(row, {
+      override: {
+        loginInfo: `${row.operName}/${row.operIp}/${row.operLocation}`,
+      },
+    })
+  }, { once: true })
+
+  $dialog({
+    body: () =>
+      h(TForm, {
+        items: [formItemMap.title, formItemMap.businessType, /* ... */],
+        labelAlign: 'right',
+        layout: 'vertical',
+        readonly: true,
+        ref: formRef,
+      }),
+    cancelBtn: '关闭',
+    confirmBtn: null,
+    header: '操作日志详细',
+    width: 700,
+  })
+}
+```
+
+## 原项目：Input append slot
+
+```vue
+<CInput v-model="formData.costTime">
+  <template #append>毫秒</template>
+</CInput>
+```
+
+## 目标项目：等效写法
+
+```typescript
+costTime: {
+  _label: '消耗时间',
+  adornment: { append: () => '毫秒' },
+  component: 'TInput',
+  model: 'costTime',
+},
+```
+
+## 备注列宽度限制
+
+`title: '备注'` 或 `colKey: 'remark'` 的列内容可能很长，需限制宽度：
+
+```typescript
+{
+  colKey: 'remark',
+  resize: { maxWidth: 300 },
+  title: '备注',
+}
+```
+
+## 易错：HTTP 方法须查原 api 定义
+
+原项目 `unlockLogininfor` **没有** `method` 字段 → 默认 **GET**，不是 DELETE：
+
+```typescript
+// yq-monitor-front/src/api/monitor.ts
+export const unlockLogininfor: apiConfig = {
+  url: `${prefix}/logininfor/unlock/{userName}`,
+  msgOnSuccess: true,
+}
+
+// 错误 ❌
+await $alova.Delete(`monitor/logininfor/unlock/${row.userName}`, ...)
+
+// 错误 ❌ Get 不能传三个参数
+await $alova.Get(`monitor/logininfor/unlock/${row.userName}`, undefined, {
+  meta: { useSuccessMsg: true },
+})
+
+// 正确 ✅
+await $alova.Get(`monitor/logininfor/unlock/${row.userName}`, {
+  meta: { useSuccessMsg: true },
+})
+```
+
+## API 路径推导
+
+原 `@/api/system.ts`：
+
+```typescript
+export const listConfig = { url: `${prefix}/config/list` }
+export const addConfig = { url: `${prefix}/config`, method: 'post' }
+export const updateConfig = { url: `${prefix}/config`, method: 'put' }
+export const delConfig = { url: `${prefix}/config/{id}`, method: 'delete' }
+export const exportConfig = { url: `${prefix}/config/export`, method: 'post', responseType: 'blob' }
+export const refreshConfigCache = { url: `${prefix}/config/refreshCache`, method: 'delete' }
+```
+
+`prefix` 通常为 `system`，目标直接使用 `system/config/...` 路径。

package/proj-template/.vscode/settings.json

@@ -36,6 +36,7 @@
     "bprogress",
     "cronosjs",
     "cronstrue",
+    "daterange",
     "dlzn",
     "formkit",
     "iconify",

package/views/index.mjs

@@ -1,9 +1,13 @@
 import e from "virtual:dlzn-ui/app-params";
 var t = {
 	.../* @__PURE__ */ Object.assign({
+		"./monitor/logininfor/index.vue": () => import("./monitor/logininfor/index.mjs"),
+		"./monitor/operlog/index.vue": () => import("./monitor/operlog/index.mjs"),
+		"./system/config/index.vue": () => import("./system/config/index.mjs"),
 		"./system/dept/index.vue": () => import("./system/dept/index.mjs"),
 		"./system/dict/index.vue": () => import("./system/dict/index.mjs"),
 		"./system/menu/index.vue": () => import("./system/menu/index.mjs"),
+		"./system/notice/index.vue": () => import("./system/notice/index.mjs"),
 		"./system/post/index.vue": () => import("./system/post/index.mjs"),
 		"./system/role/index.vue": () => import("./system/role/index.mjs"),
 		"./system/user/index.vue": () => import("./system/user/index.mjs"),

package/views/monitor/logininfor/index.mjs

@@ -0,0 +1,151 @@
+import { createBlock as e, defineComponent as t, mergeProps as n, openBlock as r, resolveComponent as i } from "vue";
+//#endregion
+//#region ../../packages/dlzn-ui/views/monitor/logininfor/index.vue
+var a = /* @__PURE__ */ t({
+	__name: "index",
+	setup(t) {
+		let a = useTemplateRef("pageListRef"), o = ref({
+			descending: !0,
+			sortBy: "loginTime"
+		}), s = {
+			dateRange: {
+				_class: "col-span-2",
+				_label: "登录时间",
+				component: "TDatePicker",
+				model: "dateRange",
+				type: "daterange"
+			},
+			ipaddr: {
+				_label: "登录地址",
+				component: "TInput",
+				model: "ipaddr"
+			},
+			status: {
+				_label: "状态",
+				component: "TSelect",
+				dicCode: "sys_common_status",
+				model: "status"
+			},
+			userName: {
+				_label: "用户名称",
+				component: "TInput",
+				model: "userName"
+			}
+		}, c = {
+			apis: {
+				delete: {
+					method: "monitor/logininfor",
+					permission: "monitor:logininfor:remove",
+					showBatch: !0
+				},
+				export: {
+					method: "monitor/logininfor/export",
+					permission: "monitor:logininfor:export"
+				},
+				list: { method: (e) => $alova.Get("monitor/logininfor/list", { params: {
+					...e,
+					dateRange: void 0,
+					"params[beginTime]": e.dateRange[0],
+					"params[endTime]": e.dateRange[1],
+					...o.value ? {
+						isAsc: o.value.descending ? "descending" : "ascending",
+						orderByColumn: o.value.sortBy
+					} : {}
+				} }) }
+			},
+			columns: [
+				{
+					colKey: "infoId",
+					title: "访问编号"
+				},
+				{
+					colKey: "userName",
+					title: "用户名称"
+				},
+				{
+					colKey: "ipaddr",
+					title: "地址"
+				},
+				{
+					colKey: "loginLocation",
+					title: "登录地点"
+				},
+				{
+					colKey: "os",
+					title: "操作系统"
+				},
+				{
+					colKey: "browser",
+					title: "浏览器"
+				},
+				{
+					cell: {
+						component: "DicLabel",
+						dicCode: "sys_common_status"
+					},
+					colKey: "status",
+					title: "登录状态"
+				},
+				{
+					colKey: "msg",
+					resize: { maxWidth: 300 },
+					title: "描述"
+				},
+				{
+					colKey: "loginTime",
+					sorter: !0,
+					title: "访问时间"
+				},
+				{
+					cell: {
+						buttons: [({ row: e }) => ({
+							default: "解锁",
+							permission: "monitor:logininfor:unlock",
+							popconfirm: {
+								content: `是否确认解锁用户${e.userName}数据项?`,
+								onConfirm: async () => {
+									await $alova.Get(`monitor/logininfor/unlock/${e.userName}`, { meta: { useSuccessMsg: !0 } });
+								}
+							}
+						})],
+						component: "Buttons"
+					},
+					colKey: "_operation",
+					title: "操作"
+				}
+			],
+			formItems: [
+				s.ipaddr,
+				s.userName,
+				s.status,
+				s.dateRange
+			],
+			operations: [{
+				default: "清空",
+				permission: "monitor:logininfor:remove",
+				popconfirm: {
+					content: "是否确认清空所有登录日志数据项?",
+					onConfirm: async () => {
+						await $alova.Delete("monitor/logininfor/clean", void 0, { meta: { useSuccessMsg: !0 } }), a.value.reset();
+					}
+				}
+			}],
+			tableOtherProps: reactive({
+				onSortChange: (e) => {
+					o.value = e, a.value.query();
+				},
+				rowKey: "infoId",
+				sort: o
+			})
+		};
+		return (t, o) => {
+			let s = i("TPageList");
+			return r(), e(s, n({
+				ref_key: "pageListRef",
+				ref: a
+			}, c), null, 16);
+		};
+	}
+});
+//#endregion
+export { a as default };

package/views/monitor/logininfor/index.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/views/monitor/operlog/index.mjs

@@ -0,0 +1,231 @@
+import { createBlock as e, defineComponent as t, mergeProps as n, openBlock as r, resolveComponent as i } from "vue";
+//#endregion
+//#region ../../packages/dlzn-ui/views/monitor/operlog/index.vue
+var a = /* @__PURE__ */ t({
+	__name: "index",
+	setup(t) {
+		let a = useTemplateRef("pageListRef"), o = ref({
+			descending: !0,
+			sortBy: "operTime"
+		}), s = {
+			businessType: {
+				_label: "操作类型",
+				component: "TSelect",
+				dicCode: "sys_oper_type",
+				model: "businessType"
+			},
+			costTime: {
+				_label: "消耗时间",
+				adornment: { append: () => "毫秒" },
+				component: "TInput",
+				model: "costTime"
+			},
+			dateRange: {
+				_class: "col-span-2",
+				_label: "操作时间",
+				component: "TDatePicker",
+				model: "dateRange",
+				type: "daterange"
+			},
+			errorMsg: {
+				__others: ({ formData: e }) => ({ show: e.status === "1" }),
+				_label: "异常信息",
+				component: "TTextarea",
+				model: "errorMsg"
+			},
+			jsonResult: {
+				_label: "返回参数",
+				component: "TTextarea",
+				model: "jsonResult"
+			},
+			loginInfo: {
+				_label: "登录信息",
+				component: "TInput",
+				model: "loginInfo"
+			},
+			method: {
+				_label: "操作方法",
+				component: "TInput",
+				model: "method"
+			},
+			operName: {
+				_label: "操作人员",
+				component: "TInput",
+				model: "operName"
+			},
+			operParam: {
+				_label: "请求参数",
+				component: "TTextarea",
+				model: "operParam"
+			},
+			operTime: {
+				_label: "操作时间",
+				component: "TInput",
+				model: "operTime"
+			},
+			operUrl: {
+				_label: "请求地址",
+				component: "TInput",
+				model: "operUrl"
+			},
+			requestMethod: {
+				_label: "请求方式",
+				component: "TInput",
+				model: "requestMethod"
+			},
+			status: {
+				_label: "操作状态",
+				component: "TSelect",
+				dicCode: "sys_common_status",
+				model: "status"
+			},
+			title: {
+				_label: "系统模块",
+				component: "TInput",
+				model: "title"
+			}
+		}, c = {
+			apis: {
+				delete: {
+					method: "monitor/operlog",
+					permission: "monitor:operlog:remove",
+					showBatch: !0
+				},
+				export: {
+					method: "monitor/operlog/export",
+					permission: "monitor:operlog:export"
+				},
+				list: { method: (e) => $alova.Get("monitor/operlog/list", { params: {
+					...e,
+					dateRange: void 0,
+					"params[beginTime]": e.dateRange[0],
+					"params[endTime]": e.dateRange[1],
+					...o.value ? {
+						isAsc: o.value.descending ? "descending" : "ascending",
+						orderByColumn: o.value.sortBy
+					} : {}
+				} }) }
+			},
+			columns: [
+				{
+					colKey: "operId",
+					title: "日志编号"
+				},
+				{
+					colKey: "title",
+					title: "系统模块"
+				},
+				{
+					cell: {
+						component: "DicLabel",
+						dicCode: "sys_oper_type"
+					},
+					colKey: "businessType",
+					title: "操作类型"
+				},
+				{
+					colKey: "operName",
+					title: "操作人员"
+				},
+				{
+					colKey: "operIp",
+					title: "操作地址"
+				},
+				{
+					cell: {
+						component: "DicLabel",
+						dicCode: "sys_common_status"
+					},
+					colKey: "status",
+					title: "操作状态"
+				},
+				{
+					colKey: "operTime",
+					sorter: !0,
+					title: "操作日期"
+				},
+				{
+					cell: (e, { row: t }) => `${t.costTime}毫秒`,
+					colKey: "costTime",
+					sorter: !0,
+					title: "消耗时间"
+				},
+				{
+					cell: {
+						buttons: [({ row: e }) => ({
+							default: "详细",
+							onClick: () => {
+								let t = ref(null);
+								watch(t, () => {
+									t.value.setFormData(e, { override: { loginInfo: `${e.operName}/${e.operIp}/${e.operLocation}` } });
+								}, { once: !0 }), $dialog({
+									body: () => h(TForm, {
+										items: [
+											s.title,
+											s.businessType,
+											s.loginInfo,
+											s.operUrl,
+											s.requestMethod,
+											s.method,
+											s.operParam,
+											s.jsonResult,
+											s.status,
+											s.costTime,
+											s.operTime,
+											s.errorMsg
+										],
+										labelAlign: "right",
+										layout: "vertical",
+										readonly: !0,
+										ref: t
+									}),
+									cancelBtn: "关闭",
+									confirmBtn: null,
+									header: "操作日志详细",
+									width: 700
+								});
+							},
+							permission: "monitor:operlog:query"
+						})],
+						component: "Buttons"
+					},
+					colKey: "_operation",
+					title: "操作"
+				}
+			],
+			formItems: [
+				s.title,
+				s.operName,
+				s.businessType,
+				s.status,
+				s.dateRange
+			],
+			operations: [{
+				default: "清空",
+				permission: "monitor:operlog:remove",
+				popconfirm: {
+					content: "是否确认清空所有操作日志数据项?",
+					onConfirm: async () => {
+						await $alova.Delete("monitor/operlog/clean", void 0, { meta: { useSuccessMsg: !0 } }), a.value.reset();
+					}
+				}
+			}],
+			tableOtherProps: reactive({
+				onSortChange: (e) => {
+					o.value = e, a.value.query();
+				},
+				rowKey: "operId",
+				sort: o
+			})
+		};
+		return (t, o) => {
+			let s = i("TPageList");
+			return r(), e(s, n({
+				ref_key: "pageListRef",
+				ref: a
+			}, c), null, 16);
+		};
+	}
+});
+//#endregion
+export { a as default };

package/views/monitor/operlog/index.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;