fangguo-component 1.1.0 → 1.1.1

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.
Files changed (67) hide show
  1. package/CHANGELOG.md +36 -1
  2. package/README.md +13 -11
  3. package/dist/{CustomInputV2-DYEcbu5_.js → CustomInputV2-uARhbFc8.js} +12 -12
  4. package/dist/CustomInputV2.css +1 -1
  5. package/dist/DragResizable.css +1 -1
  6. package/dist/DragResizable.vue_vue_type_style_index_0_lang-CHv0gJmo.js +179 -0
  7. package/dist/FgCascader.css +1 -1
  8. package/dist/FgCascader.vue_vue_type_style_index_0_lang-DXwP88Bn.js +1655 -0
  9. package/dist/{HSelect-Bqz2yTMf.js → HSelect-Drf6YBwO.js} +69 -69
  10. package/dist/{HSelectAll.vue_vue_type_script_setup_true_lang-C8i6LF_k.js → HSelectAll.vue_vue_type_script_setup_true_lang-Blq9xpfa.js} +1 -1
  11. package/dist/{HSelectSJ-BieRp2gG.js → HSelectSJ-D3GrXmvj.js} +104 -104
  12. package/dist/SelectTree-Dm5259kY.js +911 -0
  13. package/dist/SelectTree.css +1 -1
  14. package/dist/TextCopy-hOj-Wj2H.js +41 -0
  15. package/dist/TextCopy.css +1 -0
  16. package/dist/VirtualTable-BWugJiQ5.js +349 -0
  17. package/dist/VirtualTable.css +1 -1
  18. package/dist/components/VirtualTable/VirtualTable.vue.d.ts +3 -3
  19. package/dist/components/VirtualTable/index.d.ts +1 -0
  20. package/dist/components/VirtualTable/index.js +1 -1
  21. package/dist/components/cascader/cascader/ElCascader.vue.d.ts +3 -0
  22. package/dist/components/cascader/cascader/FgCascader.vue.d.ts +16 -4
  23. package/dist/components/cascader/cascader/cascader.d.ts +1 -0
  24. package/dist/components/cascader/index.js +1 -1
  25. package/dist/components/citySelect/demos/mockAddressTree.d.ts +8 -0
  26. package/dist/components/customInputV2/CustomInputV2.vue.d.ts +1 -1
  27. package/dist/components/customInputV2/index.js +1 -1
  28. package/dist/components/dragResizable/DragResizable.vue.d.ts +2 -0
  29. package/dist/components/dragResizable/index.js +1 -1
  30. package/dist/components/hSelect/demos/mockApi.d.ts +12 -0
  31. package/dist/components/hSelect/index.js +1 -1
  32. package/dist/components/hSelectAll/demos/mockApi.d.ts +10 -0
  33. package/dist/components/hSelectAll/index.js +1 -1
  34. package/dist/components/hSelectSJ/demos/mockApi.d.ts +11 -0
  35. package/dist/components/hSelectSJ/index.js +1 -1
  36. package/dist/components/index.d.ts +0 -2
  37. package/dist/components/index.js +42 -46
  38. package/dist/components/selectAddress/demos/mockAddressTree.d.ts +7 -0
  39. package/dist/components/selectTimePicker/SelectTimePicker.vue.d.ts +1 -1
  40. package/dist/components/selectTree/demos/treeData.d.ts +9 -0
  41. package/dist/components/selectTree/index.js +1 -1
  42. package/dist/components/textCopy/index.js +1 -1
  43. package/dist/index-CQzFbjNL.js +68 -0
  44. package/dist/index.css +1 -0
  45. package/dist/index.d.ts +4 -2
  46. package/dist/index.js +145 -149
  47. package/dist/vue-virtual-scroller.esm-CH-jx4ri.js +1051 -0
  48. package/package.json +8 -8
  49. package/dist/DragResizable.vue_vue_type_style_index_0_lang-DYL6TUPE.js +0 -167
  50. package/dist/FgCascader.vue_vue_type_style_index_0_lang-OnqaEAao.js +0 -1807
  51. package/dist/SelectTree-C7lBZnZH.js +0 -306
  52. package/dist/SortTransfer.css +0 -1
  53. package/dist/SortTransfer.vue_vue_type_style_index_0_lang-C5OmBF3s.js +0 -153
  54. package/dist/TextCopy.vue_vue_type_script_setup_true_lang-DbhZGH_z.js +0 -29
  55. package/dist/TipInput-CIskitOV.js +0 -117
  56. package/dist/TipInput.css +0 -1
  57. package/dist/VirtualTable-BYTfwDC1.js +0 -353
  58. package/dist/components/sortTransfer/SortTransfer.vue.d.ts +0 -97
  59. package/dist/components/sortTransfer/index.d.ts +0 -1
  60. package/dist/components/sortTransfer/index.js +0 -4
  61. package/dist/components/tipInput/TipInput.vue.d.ts +0 -56
  62. package/dist/components/tipInput/index.d.ts +0 -1
  63. package/dist/components/tipInput/index.js +0 -4
  64. package/dist/debounce-BLrZUqsA.js +0 -84
  65. package/dist/index-BKzmtfeu.js +0 -72
  66. package/dist/isEqual-qYQTJBU6.js +0 -506
  67. package/dist/isObject-CO569sPG.js +0 -35
package/CHANGELOG.md CHANGED
@@ -1,5 +1,40 @@
1
1
  # 更新日志
2
2
 
3
+ 本文件记录 **fangguo-component** 各 npm 版本变更;文档站通过 `@include` 同步展示。
4
+
5
+ ## [1.1.0] - 2026-05-20
6
+
7
+ ### 破坏性变更
8
+
9
+ - 💥 移除 **`SortTransfer`**、**`TipInput`** 组件及导出。
10
+
11
+ ### 新增
12
+
13
+ - ✨ 文档站组件 **可预览 Demo**(内嵌 + StackBlitz),目前所有组件都新增了示例demo。
14
+
15
+ ### 优化
16
+
17
+ - ♻️ 文档路由改为 **`src/docConfig.ts` 手动维护**,侧栏按 Basic / Form / Select 等二级分类。
18
+ - ♻️ **`pnpm docs:gen`** 不再自动生成 VitePress 路由,仅保留文档生成相关能力。
19
+ - ♻️ 补全并优化多组件文档 Demo(含 **SelectTree**、**SvgIcon**、**TextCopy** 等)。
20
+ - ♻️ **`FgDragResizable`**:新增 `maxWidth` / `maxHeight`(可选);非悬浮 + `parentSelector` 不再强制 `absolute` 叠层。
21
+
22
+ ### 修复
23
+
24
+ - 🐛 文档站构建 **TSX 组件**(如 VirtualTable)报 `React is not defined`,补齐 Vue JSX 与 VitePress 配置。
25
+ - 🐛 文档站 **SelectTree** 等 Demo 在 VitePress 下缺少自动导入/虚拟滚动依赖的问题。
26
+ - 🐛 文档站样式问题修复
27
+
28
+ ### 文档
29
+
30
+ - 📝 新增/完善 **部分组件** 组件说明与示例。
31
+ - 📝 更新 **COMPONENT_DOC_SKILL**、skill 更加完善。
32
+
33
+ ### 构建与工程
34
+
35
+ - 🔧 版本号升至 **1.1.0**;调整 Vite / `tsconfig`、**lint-staged** 分批 oxlint。
36
+ - 🔧 Jenkins 文档构建流程验证与依赖安装说明调整。
37
+
3
38
  ## [1.0.0] - 2026-05-13
4
39
 
5
40
  ### 新增
@@ -9,7 +44,7 @@
9
44
  - **文档路由**:`/components/`、`/tools/`、`/directives/`、`/hooks/` **聚合页**(`index.md`)及侧栏「概览」;导航不再写死单个组件/工具 slug。
10
45
  - **依赖声明**:`peerDependencies` 明确 `vue`、`element-plus`、`@element-plus/icons-vue`、`sass`、`vue-virtual-scroller`、`tailwindcss`(**optional**,由业务按需安装,不打入本库发布产物);`dependencies` 保留 `crypto-js`、`lodash-unified`。
11
46
 
12
- ### 变更
47
+ ### 优化
13
48
 
14
49
  - **`pnpm docs:gen`**:扫描并生成 Hooks 文档入口;重写 VitePress 配置(导航、侧栏、主题、搜索、版本号);工具文档目录清理时保留 `docs/tools/index.md`。
15
50
  - **指南**:安装页精简为依赖表 + 注意说明;库概览补充 Hooks、指令与文档区域说明。
package/README.md CHANGED
@@ -72,13 +72,15 @@
72
72
  ## 开发流程(面向组件、工具、指令与 Hooks 的开发者)
73
73
 
74
74
  1. **`pnpm install`**:安装依赖;运行与类型版本以 `package.json` 的 `peerDependencies` 为准。
75
- 2. **目录与导出**:在 `src/components/`、`src/tools/`(子包须含 `index.ts`)、`src/directive/`、`src/hooks/` 各建一级子目录并实现,自子包 `index.ts` 到对应聚合 `index.ts` 完成导出,风格与现有一致。(导出名目前未作强制约定,建议对外导出以 `fg` 或 `Fg` 开头,与库内既有命名习惯一致。)
76
- 3. **`pnpm dev`**:启动 Playground;在 `src/pages/` 写页面与 mock,联调 Element Plus Vue 3(偏交互调试,也可以引入文档站 demo 示例等)。
77
- 4. **各模块 `.md` 文档**:正文写在对应子目录的 `*.md`(约定见上文「文档说明」与下文「文档生成说明」)。用 AI 时到 **`ai-skill-docs/`**,按模块类型 **`@` 对应 Skill** 后再写。
78
- 5. **在线示例 `demos/`**(可选、可多个):在同目录新建 `demos/*.vue`,在 `.md` 中写 `<demo vue="demos/xxx.vue" title="…" stackblitz />`;StackBlitz 外链依赖 `docs/.vitepress` 下沙箱模板。可参考 `src/components/cascader/demos/` 与 `cascader.md`。
79
- 6. **更新日志**:有对外可见变更时维护根目录 **`CHANGELOG.md`**;用 AI 时在 **`ai-skill-docs/`** 选用变更日志相关 Skill 后撰写。
80
- 7. **`pnpm docs:gen` `pnpm docs:dev`**:`docs:gen` 生成或更新 `docs` 下各 `@include` 入口,并同步首页 `features` 链接;**不**改写 `docs/.vitepress/config.ts` 与 `src/docConfig.ts`(新条目需人工补侧栏)。`docs:dev` 本地预览文档站。
81
- 8. **`pnpm build:npm`**:构建 npm 发布产物到根目录 `dist/`(发版前执行)。
75
+ 2. **新建目录与导出**:在 `src/components/`、`src/tools/`(子包须含 `index.ts`)、`src/directive/`、`src/hooks/` 各建一级子目录并实现,自子包 `index.ts` 到对应聚合 `index.ts` 完成导出,风格与现有一致。(导出名目前未作强制约定,建议对外导出以 `fg` 或 `Fg` 开头,与库内既有命名习惯一致。)
76
+ 3. **开发与调试**:组件(工具)开发完成后,可在对应子目录下新建 `demos/` 目录,该目录既是后续编写 `.md` 文档时的在线示例 demo。也可作为调试和测试组件功能用途,也可作为可以在 `src/pages/` 对应目录下新建 `.vue` mock 页面进行单独调试(`pnpm dev` 启动 Playground)。
77
+ 4. **编写组件文档**:正文写在对应子目录的 `*.md`(约定见上文「文档说明」与下文「文档生成说明」)。用 AI 时到 **`ai-skill-docs/`**,按模块类型 **`@` 对应 Skill** 后再写。
78
+ 5. **添加文档路由**:在 `src/docConfig.ts` 中手动添加对应模块的侧边栏路由地址(文档侧边路由需手动维护,不再由脚本自动生成)。
79
+ 6. **编写在线示例 demo**:在同目录 `demos/*.vue` 中编写,在 `.md` 中用 `<demo vue="demos/xxx.vue" title="…" stackblitz />` 引用;StackBlitz 外链依赖 `docs/.vitepress` 下沙箱模板。可参考 `src/components/cascader/demos/` 与 `cascader.md`。
80
+ 7. **`pnpm docs:gen`**:同步生成/更新 `docs` 下各 `@include` 入口与首页 `features` 链接;
81
+ 8. **编写更新日志**:在根目录下 **`CHANGELOG.md`**;用 AI 时在 **`ai-skill-docs/`** 选用变更日志相关 Skill 后撰写或者手动编写。
82
+ 9. **`pnpm build:npm`**:构建 npm 发布产物到根目录 `dist/`(发版前执行)。
83
+ 10. **Jenkins 构建文档站**:在 Jenkins dev 栏目下 `fangguo-component` 项目执行构建,发布最新文档站。
82
84
 
83
85
  ## 文档站(VitePress)与相关命令
84
86
 
@@ -144,16 +146,16 @@ pnpm fmt # 格式化(oxfmt)
144
146
  开发与类型检查建议环境:
145
147
 
146
148
  - Vue 版本以本仓库 `package.json` 中 **`peerDependencies`** 为准(当前为 `^3.5.3`)
147
- - Element Plus、`@element-plus/icons-vue`、`sass`、`vue-virtual-scroller`、`tailwindcss`(**optional peer**,仅在使用 Tailwind 时安装)等同上,以 **`peerDependencies`** 为准;随包安装的 **`dependencies`** 仅 `crypto-js`、`lodash-unified`(`tailwindcss` 不参与本库产物打包,业务侧自管构建链)
149
+ - Element Plus、`@element-plus/icons-vue`、`sass`、`tailwindcss`(**optional peer**,仅在使用 Tailwind 时安装)等同上,以 **`peerDependencies`** 为准;(`tailwindcss` 不参与本库产物打包,业务侧自管构建链)
148
150
 
149
151
  文档相关命令见上文「文档站(VitePress)与相关命令」。
150
152
 
151
153
  ## 目前遇到的问题(待团队结论)
152
154
 
153
- 1. **组件库怎么发**:走 [npm](https://www.npmjs.com/) 公共包(`npm publish`),还是走私有 org(一般要掏钱)?要不业务直接用 **`git+https` / `git+ssh`** 指定仓库、某个 tag 装?
154
- 2. **带业务的组件**:涉及 **store、接口、等等**,需要讨论是放到组件库还是?以及如何放到组件库?
155
+ 1. **组件库怎么发**:走 [npm](https://www.npmjs.com/) 公共包(`npm publish`),还是走私有 org(一般要掏钱)?要不业务直接用 **`git+https` / `git+ssh`** 指定仓库、某个 tag 装(目前先发布npm)?
156
+ 2. **带业务的组件**:涉及 **store、接口、等等**,需要讨论是放到组件库还是?以及如何放到组件库(目前不放业务组件)?
155
157
  3. 哪些组件,工具,指令,hook等可以放到组件库里,如何界定?,不能为了使用组件库而过渡放到组件库
156
- 4. 静态文档dist包需要放到服务器,加上jekins配置,方便使用者查看文档(待做)
158
+ 4. 静态文档dist包需要放到服务器,加上jekins配置,方便使用者查看文档(已完成)
157
159
 
158
160
  ## 许可证
159
161
 
@@ -1,4 +1,4 @@
1
- import { defineComponent as I, useModel as S, ref as c, useSlots as _, useAttrs as E, resolveComponent as d, openBlock as r, createElementBlock as v, Fragment as b, createVNode as n, mergeProps as F, unref as s, createSlots as P, withCtx as o, renderList as R, createBlock as z, renderSlot as M, createElementVNode as V, toDisplayString as A, createTextVNode as N, createCommentVNode as D, mergeModels as H } from "vue";
1
+ import { defineComponent as I, useModel as w, ref as f, useSlots as _, useAttrs as E, resolveComponent as d, openBlock as r, createElementBlock as v, Fragment as S, createVNode as n, mergeProps as F, unref as s, createSlots as P, withCtx as o, renderList as R, createBlock as z, renderSlot as M, createElementVNode as V, toDisplayString as A, createTextVNode as N, createCommentVNode as D, mergeModels as H } from "vue";
2
2
  import { _ as L } from "./_plugin-vue_export-helper-CHgC5LLL.js";
3
3
  import './CustomInputV2.css';const T = { key: 0 }, Y = {
4
4
  class: "py-[12px] text-fill-900",
@@ -22,13 +22,13 @@ import './CustomInputV2.css';const T = { key: 0 }, Y = {
22
22
  }),
23
23
  emits: ["update:modelValue", "update:condition"],
24
24
  setup(t) {
25
- const u = S(t, "modelValue"), y = S(t, "condition"), m = t, k = c(), f = c("多个值以逗号隔开或空格隔开"), i = _(), B = E(), a = c(!1), x = (p) => {
25
+ const u = w(t, "modelValue"), y = w(t, "condition"), m = t, k = f(), c = f("多个值以逗号隔开或空格隔开"), i = _(), B = E(), a = f(!1), x = (p) => {
26
26
  const e = /,|,/;
27
27
  return p.split(e);
28
28
  };
29
- return k.value = m.name || x(m.placeholder)[0], f.value = x(m.placeholder)[1], (p, e) => {
30
- const g = d("el-option"), $ = d("el-select"), C = d("el-input"), w = d("el-button"), U = d("el-dialog");
31
- return r(), v(b, null, [
29
+ return k.value = m.name || x(m.placeholder)[0], c.value = x(m.placeholder)[1], (p, e) => {
30
+ const g = d("el-option"), $ = d("el-select"), C = d("el-input"), b = d("el-button"), U = d("el-dialog");
31
+ return r(), v(S, null, [
32
32
  n(C, F({ class: "custom-input" }, s(B), {
33
33
  modelValue: u.value,
34
34
  "onUpdate:modelValue": e[2] || (e[2] = (l) => u.value = l),
@@ -38,12 +38,12 @@ import './CustomInputV2.css';const T = { key: 0 }, Y = {
38
38
  name: "prepend",
39
39
  fn: o(() => [
40
40
  n($, {
41
- class: "w-[100px] flex-shrink-0",
41
+ class: "!w-[100px] flex-shrink-0",
42
42
  modelValue: y.value,
43
43
  "onUpdate:modelValue": e[0] || (e[0] = (l) => y.value = l)
44
44
  }, {
45
45
  default: o(() => [
46
- (r(!0), v(b, null, R(t.options, (l, h) => (r(), z(g, {
46
+ (r(!0), v(S, null, R(t.options, (l, h) => (r(), z(g, {
47
47
  key: h,
48
48
  label: l.label,
49
49
  value: l.value
@@ -91,7 +91,7 @@ import './CustomInputV2.css';const T = { key: 0 }, Y = {
91
91
  }, {
92
92
  footer: o(() => [
93
93
  V("div", j, [
94
- n(w, {
94
+ n(b, {
95
95
  type: "info",
96
96
  plain: "",
97
97
  onClick: e[4] || (e[4] = (l) => a.value = !1)
@@ -101,7 +101,7 @@ import './CustomInputV2.css';const T = { key: 0 }, Y = {
101
101
  ])]),
102
102
  _: 1
103
103
  }),
104
- n(w, {
104
+ n(b, {
105
105
  class: "!ml-[14px]",
106
106
  type: "primary",
107
107
  onClick: e[5] || (e[5] = (l) => a.value = !1)
@@ -114,13 +114,13 @@ import './CustomInputV2.css';const T = { key: 0 }, Y = {
114
114
  ])
115
115
  ]),
116
116
  default: o(() => [
117
- V("div", Y, A(f.value), 1),
117
+ V("div", Y, A(c.value), 1),
118
118
  n(C, {
119
119
  modelValue: u.value,
120
120
  "onUpdate:modelValue": e[3] || (e[3] = (l) => u.value = l),
121
121
  type: "textarea",
122
122
  autosize: { minRows: 3, maxRows: 5 },
123
- placeholder: f.value
123
+ placeholder: c.value
124
124
  }, null, 8, ["modelValue", "placeholder"])
125
125
  ]),
126
126
  _: 1
@@ -129,7 +129,7 @@ import './CustomInputV2.css';const T = { key: 0 }, Y = {
129
129
  ], 64);
130
130
  };
131
131
  }
132
- }), K = /* @__PURE__ */ L(q, [["__scopeId", "data-v-8fc92e44"]]);
132
+ }), K = /* @__PURE__ */ L(q, [["__scopeId", "data-v-ce2bdbe3"]]);
133
133
  export {
134
134
  K as C
135
135
  };
@@ -1 +1 @@
1
- .custom-input[data-v-8fc92e44] .el-input-group__append{cursor:pointer;padding-left:8px;padding-right:8px}
1
+ .custom-input[data-v-ce2bdbe3] .el-input-group__append{cursor:pointer;padding-left:8px;padding-right:8px}
@@ -1 +1 @@
1
- @charset "UTF-8";.customer-move-dialog{position:relative;z-index:99;overflow:hidden;background:#f1f3f9;border-radius:4px;box-sizing:border-box}.customer-move-dialog.floating{position:fixed;background-color:#fff;border:1px solid #B9BEC7;box-shadow:0 0 8px 2px rgba(0,0,0,.16)}.customer-move-dialog.parent-constrained{position:absolute!important}.customer-move-dialog .drag-header{width:100%;height:15px}.customer-move-dialog .drag-header.draggable{cursor:move}.resize-handle{position:absolute;z-index:99;box-sizing:border-box}.resize-handle-t{top:0;right:0;left:0;height:6px;cursor:row-resize}.resize-handle-t:hover{border-top:2px solid #2779ff}.resize-handle-t:hover .resize-handle-area{display:block}.resize-handle-r{top:0;right:0;bottom:0;width:6px;cursor:col-resize}.resize-handle-r:hover{border-right:2px solid #2779ff}.resize-handle-b{right:0;bottom:0;left:0;height:6px;cursor:row-resize}.resize-handle-b:hover{border-bottom:2px solid #2779ff}.resize-handle-l{top:0;bottom:0;left:0;width:6px;cursor:col-resize}.resize-handle-l:hover{border-left:2px solid #2779ff}.resize-handle-rt{top:0;right:0;width:8px;height:8px;cursor:ne-resize}.resize-handle-rb{right:0;bottom:0;width:8px;height:8px;cursor:se-resize}.resize-handle-lb{bottom:0;left:0;width:8px;height:8px;cursor:sw-resize}.resize-handle-lt{top:0;left:0;width:8px;height:8px;cursor:nw-resize}.resize-handle-rt:hover,.resize-handle-rb:hover,.resize-handle-lb:hover,.resize-handle-lt:hover{background-color:#2779ff}.resize-handle-rt:after,.resize-handle-rb:after,.resize-handle-lb:after,.resize-handle-lt:after{position:absolute;top:50%;left:50%;width:6px;height:6px;background-color:transparent;border-radius:50%;content:"";transform:translate(-50%,-50%)}.dialog-content{height:calc(100% - 15px)}
1
+ @charset "UTF-8";.customer-move-dialog{position:relative;z-index:99;overflow:hidden;background:#f1f3f9;border-radius:4px;box-sizing:border-box}.customer-move-dialog.floating{position:fixed;background-color:#fff;border:1px solid #b9bec7;box-shadow:0 0 8px 2px rgba(0,0,0,.16)}.customer-move-dialog.parent-constrained{position:absolute!important}.customer-move-dialog .drag-header{width:100%;height:15px}.customer-move-dialog .drag-header.draggable{cursor:move}.resize-handle{position:absolute;z-index:99;box-sizing:border-box}.resize-handle-t{top:0;right:0;left:0;height:6px;cursor:row-resize}.resize-handle-t:hover{border-top:2px solid #2779ff}.resize-handle-t:hover .resize-handle-area{display:block}.resize-handle-r{top:0;right:0;bottom:0;width:6px;cursor:col-resize}.resize-handle-r:hover{border-right:2px solid #2779ff}.resize-handle-b{right:0;bottom:0;left:0;height:6px;cursor:row-resize}.resize-handle-b:hover{border-bottom:2px solid #2779ff}.resize-handle-l{top:0;bottom:0;left:0;width:6px;cursor:col-resize}.resize-handle-l:hover{border-left:2px solid #2779ff}.resize-handle-rt{top:0;right:0;width:8px;height:8px;cursor:ne-resize}.resize-handle-rb{right:0;bottom:0;width:8px;height:8px;cursor:se-resize}.resize-handle-lb{bottom:0;left:0;width:8px;height:8px;cursor:sw-resize}.resize-handle-lt{top:0;left:0;width:8px;height:8px;cursor:nw-resize}.resize-handle-rt:hover,.resize-handle-rb:hover,.resize-handle-lb:hover,.resize-handle-lt:hover{background-color:#2779ff}.resize-handle-rt:after,.resize-handle-rb:after,.resize-handle-lb:after,.resize-handle-lt:after{position:absolute;top:50%;left:50%;width:6px;height:6px;background-color:transparent;border-radius:50%;content:"";transform:translate(-50%,-50%)}.dialog-content{height:calc(100% - 15px)}
@@ -0,0 +1,179 @@
1
+ import { defineComponent as I, ref as J, onMounted as K, openBlock as y, createElementBlock as H, normalizeClass as S, Fragment as O, renderList as Q, createElementVNode as k, createCommentVNode as C, renderSlot as q } from "vue";
2
+ import './DragResizable.css';const T = ["data-direction"], U = { class: "dialog-content" }, _ = /* @__PURE__ */ I({
3
+ __name: "DragResizable",
4
+ props: {
5
+ width: { default: 100 },
6
+ height: { default: 100 },
7
+ minWidth: { default: 100 },
8
+ minHeight: { default: 100 },
9
+ maxWidth: {},
10
+ maxHeight: {},
11
+ left: {},
12
+ top: {},
13
+ handles: { default: () => ["t", "r", "b", "l", "rt", "rb", "lb", "lt"] },
14
+ draggable: { type: Boolean, default: !0 },
15
+ resizable: { type: Boolean, default: !0 },
16
+ overflowScreen: { type: Boolean, default: !1 },
17
+ floating: { type: Boolean, default: !0 },
18
+ parentSelector: { default: "" }
19
+ },
20
+ emits: ["resizing", "dragging", "resizeStop", "dragStop"],
21
+ setup(f, { emit: N }) {
22
+ const L = J(), n = f, w = N;
23
+ let i = null, v, x, g, c, m, u, r, E, B, W = !1, z = !1;
24
+ const P = () => {
25
+ if (!n.parentSelector)
26
+ return {
27
+ left: 0,
28
+ top: 0,
29
+ right: window.innerWidth,
30
+ bottom: window.innerHeight,
31
+ width: window.innerWidth,
32
+ height: window.innerHeight
33
+ };
34
+ const t = document.querySelector(n.parentSelector);
35
+ if (!t)
36
+ return {
37
+ left: 0,
38
+ top: 0,
39
+ right: window.innerWidth,
40
+ bottom: window.innerHeight,
41
+ width: window.innerWidth,
42
+ height: window.innerHeight
43
+ };
44
+ const e = t.getBoundingClientRect();
45
+ return {
46
+ left: 0,
47
+ // 相对于父元素的左边距
48
+ top: 0,
49
+ // 相对于父元素的上边距
50
+ right: e.width,
51
+ bottom: e.height,
52
+ width: e.width,
53
+ height: e.height
54
+ };
55
+ }, V = () => {
56
+ var e, o;
57
+ if (i = L.value, !i) return;
58
+ let t = {
59
+ left: (e = n.left) != null ? e : window.innerWidth - n.width,
60
+ top: (o = n.top) != null ? o : window.innerHeight - n.height,
61
+ width: n.width,
62
+ height: n.height
63
+ };
64
+ if (t = $(t.left, t.top, t.width, t.height), t = b(t.left, t.top, t.width, t.height), t = M(t.left, t.top, t.width, t.height), n.floating ? (i.style.left = `${t.left}px`, i.style.top = `${t.top}px`, i.style.height = `${t.height}px`) : i.style.height = "100%", n.parentSelector) {
65
+ const h = document.querySelector(n.parentSelector);
66
+ h && window.getComputedStyle(h).position === "static" && (h.style.position = "relative");
67
+ }
68
+ i.style.width = `${t.width}px`, A(), t.width, t.height, t.left, t.top;
69
+ }, M = (t, e, o, h) => {
70
+ let a = Math.max(o, n.minWidth), p = Math.max(h, n.minHeight);
71
+ return n.maxWidth != null && (a = Math.min(a, n.maxWidth)), n.maxHeight != null && (p = Math.min(p, n.maxHeight)), {
72
+ left: t,
73
+ top: e,
74
+ width: a,
75
+ height: p
76
+ };
77
+ }, A = () => {
78
+ i.style.minWidth = `${n.minWidth}px`, i.style.minHeight = `${n.minHeight}px`, n.maxWidth != null && (i.style.maxWidth = `${n.maxWidth}px`), n.maxHeight != null && (i.style.maxHeight = `${n.maxHeight}px`);
79
+ };
80
+ function F(t) {
81
+ t.preventDefault(), W = !0, r = t.target.getAttribute("data-direction"), v = t.clientX, x = t.clientY, g = i.offsetWidth, c = i.offsetHeight, m = i.offsetTop, u = i.offsetLeft, document.addEventListener("mousemove", D), document.addEventListener("mouseup", R), i.classList.add("resizing");
82
+ }
83
+ function D(t) {
84
+ if (!W) return;
85
+ let e = g, o = c, h = m, a = u;
86
+ const p = t.clientX, G = t.clientY, d = p - v, s = G - x;
87
+ r.includes("t") ? (o = c - s, h = m + s) : r.includes("r") ? e = g + d : r.includes("b") ? (o = c + s, console.log(o, s, 1111)) : r.includes("l") && (e = g - d, a = u + d), r.length === 2 && (r === "rt" ? (o = c - s, h = m + s, e = g + d) : r === "rb" ? (e = g + d, o = c + s) : r === "lb" ? (e = g - d, a = u + d, o = c + s) : r === "lt" && (e = g - d, o = c - s, a = u + d, h = m + s));
88
+ let l = {
89
+ left: a,
90
+ top: h,
91
+ width: e,
92
+ height: o
93
+ };
94
+ l = $(l.left, l.top, l.width, l.height), l = b(l.left, l.top, l.width, l.height), l = M(l.left, l.top, l.width, l.height), i.style.width = `${l.width}px`, i.style.height = `${l.height}px`, console.log(l.height, 2222), n.floating && (i.style.top = `${l.top}px`, i.style.left = `${l.left}px`), l.width, l.height, l.left, l.top, w("resizing", l);
95
+ }
96
+ function R() {
97
+ W = !1, document.removeEventListener("mousemove", D), document.removeEventListener("mouseup", R), i.classList.remove("resizing"), w("resizeStop", {
98
+ width: i.offsetWidth,
99
+ height: i.offsetHeight,
100
+ left: i.offsetLeft,
101
+ top: i.offsetTop
102
+ });
103
+ }
104
+ function j(t) {
105
+ n.draggable && (t.preventDefault(), z = !0, E = i.offsetLeft, B = i.offsetTop, v = t.clientX, x = t.clientY, document.addEventListener("mousemove", X), document.addEventListener("mouseup", Y), i.classList.add("dragging"));
106
+ }
107
+ function X(t) {
108
+ if (!n.floating || !z) return;
109
+ let e = {
110
+ left: E + (t.clientX - v),
111
+ top: B + (t.clientY - x),
112
+ width: i.offsetWidth,
113
+ height: i.offsetHeight
114
+ };
115
+ e = $(e.left, e.top, e.width, e.height), e = b(e.left, e.top, e.width, e.height), e = M(e.left, e.top, e.width, e.height), i.style.left = `${e.left}px`, i.style.top = `${e.top}px`, e.left, e.top, w("dragging", {
116
+ left: e.left,
117
+ top: e.top,
118
+ width: e.width,
119
+ height: e.height
120
+ });
121
+ }
122
+ function Y() {
123
+ z = !1, document.removeEventListener("mousemove", X), document.removeEventListener("mouseup", Y), i.classList.remove("dragging"), w("dragStop", {
124
+ left: i.offsetLeft,
125
+ top: i.offsetTop,
126
+ width: i.offsetWidth,
127
+ height: i.offsetHeight
128
+ });
129
+ }
130
+ const $ = (t, e, o, h) => (!n.overflowScreen && n.floating && (t = Math.min(Math.max(t, 0), window.innerWidth - i.offsetWidth), e = Math.min(Math.max(e, 0), window.innerHeight - i.offsetHeight), o = Math.min(o, window.innerWidth - t), h = Math.min(h, window.innerHeight - e)), {
131
+ left: t,
132
+ top: e,
133
+ width: o,
134
+ height: h
135
+ }), b = (t, e, o, h) => {
136
+ if (n.parentSelector) {
137
+ const a = P();
138
+ t = Math.min(t, a.width - i.offsetWidth), e = Math.min(e, a.height - i.offsetHeight), t = Math.max(t, 0), e = Math.max(e, 0), o = Math.min(o, a.width - t), h = Math.min(h, a.height - e);
139
+ }
140
+ return {
141
+ left: t,
142
+ top: e,
143
+ width: o,
144
+ height: h
145
+ };
146
+ };
147
+ return K(() => {
148
+ V();
149
+ }), (t, e) => (y(), H("div", {
150
+ class: S(["customer-move-dialog", { floating: f.floating, "parent-constrained": f.floating && f.parentSelector }]),
151
+ ref_key: "moveDialogRef",
152
+ ref: L
153
+ }, [
154
+ f.resizable ? (y(!0), H(O, { key: 0 }, Q(f.handles, (o, h) => (y(), H("div", {
155
+ class: S(["resize-handle", `resize-handle-${o}`]),
156
+ "data-direction": o,
157
+ key: h,
158
+ onMousedown: F
159
+ }, [
160
+ k("div", {
161
+ class: S(["resize-handle-area", `resize-handle-area-${o}`])
162
+ }, null, 2)
163
+ ], 42, T))), 128)) : C("", !0),
164
+ f.floating ? (y(), H("div", {
165
+ key: 1,
166
+ class: S(["drag-header", f.draggable ? "draggable" : ""]),
167
+ onMousedown: j
168
+ }, [
169
+ q(t.$slots, "header")
170
+ ], 34)) : C("", !0),
171
+ k("div", U, [
172
+ q(t.$slots, "default")
173
+ ])
174
+ ], 2));
175
+ }
176
+ });
177
+ export {
178
+ _
179
+ };
@@ -1 +1 @@
1
- .cascader-virtual-list[data-v-a251fab9]{height:100%;min-height:204px;max-height:204px}.cascader-virtual-list[data-v-a251fab9] .vue-recycle-scroller__item-view{width:100%}.empty-panel{padding:10px 0;margin:0;text-align:center;color:#909399}.el-cascader__suggestion-item-label{font-style:normal}.cascader-popper-deep .el-cascader-panel .el-radio,.cascader-popper-deep .el-cascader-panel .el-checkbox{position:absolute;top:0;left:20px;z-index:10;width:calc(100% - 50px);height:100%}.cascader-popper-deep .el-cascader-node__label{padding:0 20px}.cascader-popper-deep .cascader-footer-slot{border-top:1px solid #e4e7ed;padding:10px}
1
+ .cascader-virtual-list[data-v-a251fab9]{height:100%;min-height:204px;max-height:204px}.cascader-virtual-list[data-v-a251fab9] .vue-recycle-scroller__item-view{width:100%}.empty-panel{padding:10px 0;margin:0;text-align:center;color:#909399}.el-cascader__suggestion-item span{white-space:nowrap}.el-cascader__suggestion-item-label{font-style:normal}.cascader-popper-deep .el-cascader-panel .el-radio,.cascader-popper-deep .el-cascader-panel .el-checkbox{position:absolute;top:0;left:20px;z-index:10;width:calc(100% - 50px);height:100%}.cascader-popper-deep .el-cascader-node__label{padding:0 20px;height:16px}.cascader-popper-deep .cascader-footer-slot{border-top:1px solid #e4e7ed;padding:10px}