STree.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569
  1. var G = (e, f, d) => new Promise((a, l) => {
  2. var i = (r) => {
  3. try {
  4. c(d.next(r));
  5. } catch (y) {
  6. l(y);
  7. }
  8. }, o = (r) => {
  9. try {
  10. c(d.throw(r));
  11. } catch (y) {
  12. l(y);
  13. }
  14. }, c = (r) => r.done ? a(r.value) : Promise.resolve(r.value).then(i, o);
  15. c((d = d.apply(e, f)).next());
  16. });
  17. import { createVNode as S, defineComponent as oe, ref as E, computed as K, watchEffect as fe, watch as Q, onUpdated as ve, nextTick as ye, onMounted as he, openBlock as W, createElementBlock as ee, withCtx as F, createElementVNode as te, normalizeClass as pe, toDisplayString as j, createBlock as Ke, createTextVNode as xe } from "vue";
  18. import { b as de, w as me, j as ce, d as ke, _ as m, o as be, $ as X, a as P, m as se, F as Y, D as g, T as C, C as B, P as ne, e as _e, aQ as ge, aR as Ee, aS as we, r as Te, H as Ne } from "./index2.js";
  19. import { d as Se } from "./debounce.js";
  20. import { u as De, T as Ce, r as Oe, t as Ie, V as Pe } from "./index8.js";
  21. import { b as le, f as Ae, c as $e, d as Fe } from "./index4.js";
  22. const ae = 4;
  23. function je(e) {
  24. const {
  25. dropPosition: f,
  26. dropLevelOffset: d,
  27. prefixCls: a,
  28. indent: l,
  29. direction: i = "ltr"
  30. } = e, o = i === "ltr" ? "left" : "right", c = i === "ltr" ? "right" : "left", r = {
  31. [o]: `${-d * l + ae}px`,
  32. [c]: 0
  33. };
  34. switch (f) {
  35. case -1:
  36. r.top = "-3px";
  37. break;
  38. case 1:
  39. r.bottom = "-3px";
  40. break;
  41. default:
  42. r.bottom = "-3px", r[o] = `${l + ae}px`;
  43. break;
  44. }
  45. return S("div", {
  46. style: r,
  47. class: `${a}-drop-indicator`
  48. }, null);
  49. }
  50. const ie = () => {
  51. const e = Ie();
  52. return m(m({}, e), {
  53. showLine: Y([Boolean, Object]),
  54. /** 是否支持多选 */
  55. multiple: g(),
  56. /** 是否自动展开父节点 */
  57. autoExpandParent: g(),
  58. /** checkable状态下节点选择完全受控(父子节点选中状态不再关联)*/
  59. checkStrictly: g(),
  60. /** 是否支持选中 */
  61. checkable: g(),
  62. /** 是否禁用树 */
  63. disabled: g(),
  64. /** 默认展开所有树节点 */
  65. defaultExpandAll: g(),
  66. /** 默认展开对应树节点 */
  67. defaultExpandParent: g(),
  68. /** 默认展开指定的树节点 */
  69. defaultExpandedKeys: C(),
  70. /** (受控)展开指定的树节点 */
  71. expandedKeys: C(),
  72. /** (受控)选中复选框的树节点 */
  73. checkedKeys: Y([Array, Object]),
  74. /** 默认选中复选框的树节点 */
  75. defaultCheckedKeys: C(),
  76. /** (受控)设置选中的树节点 */
  77. selectedKeys: C(),
  78. /** 默认选中的树节点 */
  79. defaultSelectedKeys: C(),
  80. selectable: g(),
  81. loadedKeys: C(),
  82. draggable: g(),
  83. showIcon: g(),
  84. icon: B(),
  85. switcherIcon: ne.any,
  86. prefixCls: String,
  87. /**
  88. * @default{title,key,children}
  89. * deprecated, please use `fieldNames` instead
  90. * 替换treeNode中 title,key,children字段为treeData中对应的字段
  91. */
  92. replaceFields: _e(),
  93. blockNode: g(),
  94. openAnimation: ne.any,
  95. onDoubleclick: e.onDblclick,
  96. "onUpdate:selectedKeys": B(),
  97. "onUpdate:checkedKeys": B(),
  98. "onUpdate:expandedKeys": B()
  99. });
  100. }, U = oe({
  101. compatConfig: {
  102. MODE: 3
  103. },
  104. name: "ATree",
  105. inheritAttrs: !1,
  106. props: de(ie(), {
  107. checkable: !1,
  108. selectable: !0,
  109. showIcon: !1,
  110. blockNode: !1
  111. }),
  112. slots: Object,
  113. setup(e, f) {
  114. let {
  115. attrs: d,
  116. expose: a,
  117. emit: l,
  118. slots: i
  119. } = f;
  120. me(!(e.treeData === void 0 && i.default), "`children` of Tree is deprecated. Please use `treeData` instead.");
  121. const {
  122. prefixCls: o,
  123. direction: c,
  124. virtual: r
  125. } = ce("tree", e), [y, w] = De(o), u = E();
  126. a({
  127. treeRef: u,
  128. onNodeExpand: function() {
  129. var n;
  130. (n = u.value) === null || n === void 0 || n.onNodeExpand(...arguments);
  131. },
  132. scrollTo: (n) => {
  133. var h;
  134. (h = u.value) === null || h === void 0 || h.scrollTo(n);
  135. },
  136. selectedKeys: K(() => {
  137. var n;
  138. return (n = u.value) === null || n === void 0 ? void 0 : n.selectedKeys;
  139. }),
  140. checkedKeys: K(() => {
  141. var n;
  142. return (n = u.value) === null || n === void 0 ? void 0 : n.checkedKeys;
  143. }),
  144. halfCheckedKeys: K(() => {
  145. var n;
  146. return (n = u.value) === null || n === void 0 ? void 0 : n.halfCheckedKeys;
  147. }),
  148. loadedKeys: K(() => {
  149. var n;
  150. return (n = u.value) === null || n === void 0 ? void 0 : n.loadedKeys;
  151. }),
  152. loadingKeys: K(() => {
  153. var n;
  154. return (n = u.value) === null || n === void 0 ? void 0 : n.loadingKeys;
  155. }),
  156. expandedKeys: K(() => {
  157. var n;
  158. return (n = u.value) === null || n === void 0 ? void 0 : n.expandedKeys;
  159. })
  160. }), fe(() => {
  161. ke(e.replaceFields === void 0, "Tree", "`replaceFields` is deprecated, please use fieldNames instead");
  162. });
  163. const v = (n, h) => {
  164. l("update:checkedKeys", n), l("check", n, h);
  165. }, T = (n, h) => {
  166. l("update:expandedKeys", n), l("expand", n, h);
  167. }, k = (n, h) => {
  168. l("update:selectedKeys", n), l("select", n, h);
  169. };
  170. return () => {
  171. const {
  172. showIcon: n,
  173. showLine: h,
  174. switcherIcon: L = i.switcherIcon,
  175. icon: R = i.icon,
  176. blockNode: M,
  177. checkable: H,
  178. selectable: A,
  179. fieldNames: O = e.replaceFields,
  180. motion: z = e.openAnimation,
  181. itemHeight: t = 28,
  182. onDoubleclick: s,
  183. onDblclick: p
  184. } = e, I = m(m(m({}, d), be(e, ["onUpdate:checkedKeys", "onUpdate:expandedKeys", "onUpdate:selectedKeys", "onDoubleclick"])), {
  185. showLine: !!h,
  186. dropIndicatorRender: je,
  187. fieldNames: O,
  188. icon: R,
  189. itemHeight: t
  190. }), b = i.default ? X(i.default()) : void 0;
  191. return y(S(Ce, P(P({}, I), {}, {
  192. virtual: r.value,
  193. motion: z,
  194. ref: u,
  195. prefixCls: o.value,
  196. class: se({
  197. [`${o.value}-icon-hide`]: !n,
  198. [`${o.value}-block-node`]: M,
  199. [`${o.value}-unselectable`]: !A,
  200. [`${o.value}-rtl`]: c.value === "rtl"
  201. }, d.class, w.value),
  202. direction: c.value,
  203. checkable: H,
  204. selectable: A,
  205. switcherIcon: (D) => Oe(o.value, L, D, i.leafIcon, h),
  206. onCheck: v,
  207. onExpand: T,
  208. onSelect: k,
  209. onDblclick: p || s,
  210. children: b
  211. }), m(m({}, i), {
  212. checkable: () => S("span", {
  213. class: `${o.value}-checkbox-inner`
  214. }, null)
  215. })));
  216. };
  217. }
  218. });
  219. var N;
  220. (function(e) {
  221. e[e.None = 0] = "None", e[e.Start = 1] = "Start", e[e.End = 2] = "End";
  222. })(N || (N = {}));
  223. function Z(e, f, d) {
  224. function a(l) {
  225. const i = l[f.key], o = l[f.children];
  226. d(i, l) !== !1 && Z(o || [], f, d);
  227. }
  228. e.forEach(a);
  229. }
  230. function Be(e) {
  231. let {
  232. treeData: f,
  233. expandedKeys: d,
  234. startKey: a,
  235. endKey: l,
  236. fieldNames: i = {
  237. title: "title",
  238. key: "key",
  239. children: "children"
  240. }
  241. } = e;
  242. const o = [];
  243. let c = N.None;
  244. if (a && a === l)
  245. return [a];
  246. if (!a || !l)
  247. return [];
  248. function r(y) {
  249. return y === a || y === l;
  250. }
  251. return Z(f, i, (y) => {
  252. if (c === N.End)
  253. return !1;
  254. if (r(y)) {
  255. if (o.push(y), c === N.None)
  256. c = N.Start;
  257. else if (c === N.Start)
  258. return c = N.End, !1;
  259. } else c === N.Start && o.push(y);
  260. return d.includes(y);
  261. }), o;
  262. }
  263. function q(e, f, d) {
  264. const a = [...f], l = [];
  265. return Z(e, d, (i, o) => {
  266. const c = a.indexOf(i);
  267. return c !== -1 && (l.push(o), a.splice(c, 1)), !!a.length;
  268. }), l;
  269. }
  270. var Ue = function(e, f) {
  271. var d = {};
  272. for (var a in e) Object.prototype.hasOwnProperty.call(e, a) && f.indexOf(a) < 0 && (d[a] = e[a]);
  273. if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var l = 0, a = Object.getOwnPropertySymbols(e); l < a.length; l++)
  274. f.indexOf(a[l]) < 0 && Object.prototype.propertyIsEnumerable.call(e, a[l]) && (d[a[l]] = e[a[l]]);
  275. return d;
  276. };
  277. const Ve = () => m(m({}, ie()), {
  278. expandAction: Y([Boolean, String])
  279. });
  280. function Le(e) {
  281. const {
  282. isLeaf: f,
  283. expanded: d
  284. } = e;
  285. return f ? S(ge, null, null) : d ? S(Ee, null, null) : S(we, null, null);
  286. }
  287. const V = oe({
  288. compatConfig: {
  289. MODE: 3
  290. },
  291. name: "ADirectoryTree",
  292. inheritAttrs: !1,
  293. props: de(Ve(), {
  294. showIcon: !0,
  295. expandAction: "click"
  296. }),
  297. slots: Object,
  298. // emits: [
  299. // 'update:selectedKeys',
  300. // 'update:checkedKeys',
  301. // 'update:expandedKeys',
  302. // 'expand',
  303. // 'select',
  304. // 'check',
  305. // 'doubleclick',
  306. // 'dblclick',
  307. // 'click',
  308. // ],
  309. setup(e, f) {
  310. let {
  311. attrs: d,
  312. slots: a,
  313. emit: l,
  314. expose: i
  315. } = f;
  316. var o;
  317. const c = E(e.treeData || le(X((o = a.default) === null || o === void 0 ? void 0 : o.call(a))));
  318. Q(() => e.treeData, () => {
  319. c.value = e.treeData;
  320. }), ve(() => {
  321. ye(() => {
  322. var t;
  323. e.treeData === void 0 && a.default && (c.value = le(X((t = a.default) === null || t === void 0 ? void 0 : t.call(a))));
  324. });
  325. });
  326. const r = E(), y = E(), w = K(() => Ae(e.fieldNames)), u = E();
  327. i({
  328. scrollTo: (t) => {
  329. var s;
  330. (s = u.value) === null || s === void 0 || s.scrollTo(t);
  331. },
  332. selectedKeys: K(() => {
  333. var t;
  334. return (t = u.value) === null || t === void 0 ? void 0 : t.selectedKeys;
  335. }),
  336. checkedKeys: K(() => {
  337. var t;
  338. return (t = u.value) === null || t === void 0 ? void 0 : t.checkedKeys;
  339. }),
  340. halfCheckedKeys: K(() => {
  341. var t;
  342. return (t = u.value) === null || t === void 0 ? void 0 : t.halfCheckedKeys;
  343. }),
  344. loadedKeys: K(() => {
  345. var t;
  346. return (t = u.value) === null || t === void 0 ? void 0 : t.loadedKeys;
  347. }),
  348. loadingKeys: K(() => {
  349. var t;
  350. return (t = u.value) === null || t === void 0 ? void 0 : t.loadingKeys;
  351. }),
  352. expandedKeys: K(() => {
  353. var t;
  354. return (t = u.value) === null || t === void 0 ? void 0 : t.expandedKeys;
  355. })
  356. });
  357. const v = () => {
  358. const {
  359. keyEntities: t
  360. } = $e(c.value, {
  361. fieldNames: w.value
  362. });
  363. let s;
  364. return e.defaultExpandAll ? s = Object.keys(t) : e.defaultExpandParent ? s = Fe(e.expandedKeys || e.defaultExpandedKeys || [], t) : s = e.expandedKeys || e.defaultExpandedKeys, s;
  365. }, T = E(e.selectedKeys || e.defaultSelectedKeys || []), k = E(v());
  366. Q(() => e.selectedKeys, () => {
  367. e.selectedKeys !== void 0 && (T.value = e.selectedKeys);
  368. }, {
  369. immediate: !0
  370. }), Q(() => e.expandedKeys, () => {
  371. e.expandedKeys !== void 0 && (k.value = e.expandedKeys);
  372. }, {
  373. immediate: !0
  374. });
  375. const h = Se((t, s) => {
  376. const {
  377. isLeaf: p
  378. } = s;
  379. p || t.shiftKey || t.metaKey || t.ctrlKey || u.value.onNodeExpand(t, s);
  380. }, 200, {
  381. leading: !0
  382. }), L = (t, s) => {
  383. e.expandedKeys === void 0 && (k.value = t), l("update:expandedKeys", t), l("expand", t, s);
  384. }, R = (t, s) => {
  385. const {
  386. expandAction: p
  387. } = e;
  388. p === "click" && h(t, s), l("click", t, s);
  389. }, M = (t, s) => {
  390. const {
  391. expandAction: p
  392. } = e;
  393. (p === "dblclick" || p === "doubleclick") && h(t, s), l("doubleclick", t, s), l("dblclick", t, s);
  394. }, H = (t, s) => {
  395. const {
  396. multiple: p
  397. } = e, {
  398. node: I,
  399. nativeEvent: b
  400. } = s, D = I[w.value.key], $ = m(m({}, s), {
  401. selected: !0
  402. }), re = (b == null ? void 0 : b.ctrlKey) || (b == null ? void 0 : b.metaKey), ue = b == null ? void 0 : b.shiftKey;
  403. let _;
  404. p && re ? (_ = t, r.value = D, y.value = _, $.selectedNodes = q(c.value, _, w.value)) : p && ue ? (_ = Array.from(/* @__PURE__ */ new Set([...y.value || [], ...Be({
  405. treeData: c.value,
  406. expandedKeys: k.value,
  407. startKey: D,
  408. endKey: r.value,
  409. fieldNames: w.value
  410. })])), $.selectedNodes = q(c.value, _, w.value)) : (_ = [D], r.value = D, y.value = _, $.selectedNodes = q(c.value, _, w.value)), l("update:selectedKeys", _), l("select", _, $), e.selectedKeys === void 0 && (T.value = _);
  411. }, A = (t, s) => {
  412. l("update:checkedKeys", t), l("check", t, s);
  413. }, {
  414. prefixCls: O,
  415. direction: z
  416. } = ce("tree", e);
  417. return () => {
  418. const t = se(`${O.value}-directory`, {
  419. [`${O.value}-directory-rtl`]: z.value === "rtl"
  420. }, d.class), {
  421. icon: s = a.icon,
  422. blockNode: p = !0
  423. } = e, I = Ue(e, ["icon", "blockNode"]);
  424. return S(U, P(P(P({}, d), {}, {
  425. icon: s || Le,
  426. ref: u,
  427. blockNode: p
  428. }, I), {}, {
  429. prefixCls: O.value,
  430. class: t,
  431. expandedKeys: k.value,
  432. selectedKeys: T.value,
  433. onSelect: H,
  434. onClick: R,
  435. onDblclick: M,
  436. onExpand: L,
  437. onCheck: A
  438. }), a);
  439. };
  440. }
  441. }), J = Pe;
  442. m(U, {
  443. DirectoryTree: V,
  444. TreeNode: J,
  445. install: (e) => (e.component(U.name, U), e.component(J.name, J), e.component(V.name, V), e)
  446. });
  447. const Re = { class: "s-tree-common" }, Me = { class: "node-title" }, He = {
  448. key: 1,
  449. class: "node-title"
  450. }, ze = {
  451. __name: "STree",
  452. props: {
  453. // 是否展开所有节点
  454. expandAll: {
  455. type: Boolean,
  456. default: !1
  457. },
  458. // 树节点属性
  459. props: {
  460. type: Object,
  461. default: () => ({
  462. children: "children",
  463. label: "name",
  464. value: "value"
  465. })
  466. },
  467. // 是否添加复选框
  468. checkable: {
  469. type: Boolean,
  470. default: !1
  471. },
  472. // 树高度
  473. height: {
  474. type: Number,
  475. default: 300
  476. },
  477. // 获取一级节点数据
  478. levelOneChildren: {
  479. type: Function,
  480. default: () => {
  481. }
  482. },
  483. // 获取二级节点数据
  484. levelTwoChildren: {
  485. type: Function,
  486. default: () => {
  487. }
  488. },
  489. // 默认选中项,支持 v-model 双向绑定
  490. modelValue: {
  491. type: [String, Array],
  492. default() {
  493. return "";
  494. }
  495. },
  496. // 默认选中第一个节点
  497. selectFirstOne: {
  498. type: Boolean,
  499. default: !1
  500. },
  501. // 是否显示图标
  502. showIcon: {
  503. type: Boolean,
  504. default: !1
  505. },
  506. // 显示字数长度 超过15字符显示省略号并且鼠标悬浮tooltip显示
  507. showLength: {
  508. type: [Number, String],
  509. default: 15
  510. }
  511. },
  512. emits: ["select:modelValue"],
  513. setup(e, { emit: f }) {
  514. const d = e, a = f, l = E([]), i = E([]), o = E([]), c = E([]), r = (x, v) => G(this, null, function* () {
  515. v.expanded && (!v.node.dataRef.children || v.node.dataRef.children.length === 0) && (v.node.dataRef.children = yield d.levelOneChildren(v.node.dataRef.id)), x.value = x;
  516. }), y = (x, v) => {
  517. a("select:modelValue", x, v);
  518. }, w = () => G(this, null, function* () {
  519. var x, v, T, k;
  520. o.value = [], l.value = yield d.levelTwoChildren(), (x = l.value) != null && x.length && ((T = (v = l.value[0]) == null ? void 0 : v.children[0]) != null && T.length) && (d.selectFirstOne && (l.value[0].selected = !0, i.value.push(((k = l.value[0]) == null ? void 0 : k.id) || ""), a("select:modelValue", l.value[0].id || "", l.value[0])), o.value = [l.value[0].id]);
  521. }), u = (x) => ["D", "G", "C", "D"][x];
  522. return he(() => {
  523. w();
  524. }), (x, v) => {
  525. const T = Ne, k = V;
  526. return W(), ee("div", Re, [
  527. S(k, {
  528. selectedKeys: i.value,
  529. "onUpdate:selectedKeys": v[0] || (v[0] = (n) => i.value = n),
  530. checkedKeys: o.value,
  531. "onUpdate:checkedKeys": v[1] || (v[1] = (n) => o.value = n),
  532. expandedKeys: c.value,
  533. "onUpdate:expandedKeys": v[2] || (v[2] = (n) => c.value = n),
  534. "default-expand-all": e.expandAll,
  535. checkable: e.checkable,
  536. "tree-data": l.value,
  537. showIcon: e.showIcon,
  538. height: e.height,
  539. onExpand: r,
  540. onSelect: y
  541. }, {
  542. icon: F((n) => [
  543. te("div", {
  544. class: pe(["node-icon", u(n.type)])
  545. }, j(u(n.type)), 3)
  546. ]),
  547. title: F((n) => [
  548. n.title.length > 15 ? (W(), Ke(T, {
  549. key: 0,
  550. placement: "topLeft"
  551. }, {
  552. title: F(() => [
  553. xe(j(n.title), 1)
  554. ]),
  555. default: F(() => [
  556. te("div", Me, j(n.title.slice(0, 15)) + "... ", 1)
  557. ]),
  558. _: 2
  559. }, 1024)) : (W(), ee("div", He, j(n.title), 1))
  560. ]),
  561. _: 1
  562. }, 8, ["selectedKeys", "checkedKeys", "expandedKeys", "default-expand-all", "checkable", "tree-data", "showIcon", "height"])
  563. ]);
  564. };
  565. }
  566. }, Ye = /* @__PURE__ */ Te(ze, [["__scopeId", "data-v-aa1c998c"]]);
  567. export {
  568. Ye as default
  569. };