@vipl520/dk-ui 1.0.61 → 1.0.62

package/es/page-diy/src/page-diy.vue.mjs

@@ -5,7 +5,7 @@ import PreviewPhone from './components/PreviewPhone.vue.mjs';
 import { webRuleList, createWebMenu } from './config/rule/web/index.mjs';
 import { minRuleList, createMinMenu } from './config/rule/min/index.mjs';
 import './utils/index.mjs';
-import { defineComponent, toRefs, getCurrentInstance, ref, provide, toRef, computed, reactive, watch, nextTick, markRaw, createElementVNode, resolveComponent, resolveDirective, openBlock, createBlock, withCtx, createCommentVNode, createVNode, normalizeStyle, createElementBlock, Fragment, renderList, toDisplayString, normalizeClass, createTextVNode, withModifiers, renderSlot, withDirectives, vShow } from 'vue';
+import { defineComponent, toRefs, getCurrentInstance, ref, provide, toRef, computed, reactive, watch, nextTick, markRaw, resolveComponent, resolveDirective, openBlock, createBlock, withCtx, createCommentVNode, createVNode, normalizeStyle, createElementVNode, createElementBlock, Fragment, renderList, toDisplayString, normalizeClass, createTextVNode, withModifiers, renderSlot, withDirectives, vShow } from 'vue';
 import './config/base/index.mjs';
 import { isArray } from '@vipl520/utils';
 import { ElNotification } from 'element-plus';
@@ -230,6 +230,7 @@ const _sfc_main = defineComponent({
         hide: true,
         treeData: [],
       },
+      leftTabsName: 'component',
     });
 
     function cleanTreeData(node) {
@@ -1083,20 +1084,23 @@ const _hoisted_5 = {
   class: "_fc-l-count",
   style: {}
 };
-const _hoisted_6 = /*#__PURE__*/createElementVNode("span", null, "结构", -1 /* HOISTED */);
-const _hoisted_7 = { key: 0 };
+const _hoisted_6 = { class: "children-list" };
+const _hoisted_7 = {
+  key: 0,
+  class: "_fc-tree-node"
+};
 
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dk_icon = resolveComponent("dk-icon");
   const _component_draggable = resolveComponent("draggable");
+  const _component_el_tab_pane = resolveComponent("el-tab-pane");
   const _component_el_tree = resolveComponent("el-tree");
+  const _component_el_tabs = resolveComponent("el-tabs");
   const _component_el_aside = resolveComponent("el-aside");
   const _component_el_header = resolveComponent("el-header");
   const _component_DragForm = resolveComponent("DragForm");
   const _component_preview_phone = resolveComponent("preview-phone");
   const _component_el_container = resolveComponent("el-container");
-  const _component_el_tab_pane = resolveComponent("el-tab-pane");
-  const _component_el_tabs = resolveComponent("el-tabs");
   const _component_el_dialog = resolveComponent("el-dialog");
   const _component_diy_cloud = resolveComponent("diy-cloud");
   const _component_dk_dialog = resolveComponent("dk-dialog");
@@ -1110,108 +1114,115 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         style: normalizeStyle(_ctx.leftAside.style)
       }, {
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.menuList, (item, index) => {
-              return (openBlock(), createElementBlock("div", {
-                key: index,
-                class: "_fc-l-group"
-              }, [
-                createElementVNode("h4", _hoisted_2, toDisplayString(item.title), 1 /* TEXT */),
-                createVNode(_component_draggable, {
-                  group: { name: 'default', pull: 'clone', put: false },
-                  sort: false,
-                  list: item.list,
-                  "item-key": "icon",
-                  filter: ".not-drag",
-                  class: "_fc-l-items"
-                }, {
-                  item: withCtx(({ element }) => [
-                    (openBlock(), createElementBlock("div", {
-                      key: element.id,
-                      class: normalizeClass(["_fc-l-item", element.count - (_ctx.countObj[element.name] || 0) <= 0 ? 'not-drag' : ''])
-                    }, [
-                      createElementVNode("div", _hoisted_3, [
-                        createVNode(_component_dk_icon, {
-                          icon: element.icon,
-                          size: 24
-                        }, null, 8 /* PROPS */, ["icon"])
+          createVNode(_component_el_tabs, {
+            modelValue: _ctx.leftTabsName,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((_ctx.leftTabsName) = $event))
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_el_tab_pane, {
+                label: "组件列表",
+                name: "component"
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("div", _hoisted_1, [
+                    (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.menuList, (item, index) => {
+                      return (openBlock(), createElementBlock("div", {
+                        key: index,
+                        class: "_fc-l-group"
+                      }, [
+                        createElementVNode("h4", _hoisted_2, toDisplayString(item.title), 1 /* TEXT */),
+                        createVNode(_component_draggable, {
+                          group: { name: 'default', pull: 'clone', put: false },
+                          sort: false,
+                          list: item.list,
+                          "item-key": "icon",
+                          filter: ".not-drag",
+                          class: "_fc-l-items"
+                        }, {
+                          item: withCtx(({ element }) => [
+                            (openBlock(), createElementBlock("div", {
+                              key: element.id,
+                              class: normalizeClass(["_fc-l-item", element.count - (_ctx.countObj[element.name] || 0) <= 0 ? 'not-drag' : ''])
+                            }, [
+                              createElementVNode("div", _hoisted_3, [
+                                createVNode(_component_dk_icon, {
+                                  icon: element.icon,
+                                  size: 24
+                                }, null, 8 /* PROPS */, ["icon"])
+                              ]),
+                              createElementVNode("span", _hoisted_4, toDisplayString(element.label), 1 /* TEXT */),
+                              (element.count)
+                                ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(element.count - (_ctx.countObj[element.name] || 0)), 1 /* TEXT */))
+                                : createCommentVNode("v-if", true)
+                            ], 2 /* CLASS */))
+                          ]),
+                          _: 2 /* DYNAMIC */
+                        }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["list"])
+                      ]))
+                    }), 128 /* KEYED_FRAGMENT */))
+                  ])
+                ]),
+                _: 1 /* STABLE */
+              }),
+              createVNode(_component_el_tab_pane, {
+                label: "结构大纲",
+                name: "tree"
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("div", _hoisted_6, [
+                    createVNode(_component_el_tree, {
+                      draggable: "",
+                      "highlight-current": "",
+                      data: _ctx.treeAside.treeData,
+                      props: { value: 'type', label: 'type' },
+                      "allow-drop": _ctx.allowDrop,
+                      "default-expand-all": true,
+                      onNodeDrop: _ctx.nodeDrop,
+                      onNodeClick: _ctx.nodeClick
+                    }, {
+                      default: withCtx(({ data }) => [
+                        createElementVNode("div", {
+                          class: "el-tree-node-content",
+                          style: normalizeStyle(_ctx.activeRule && _ctx.activeRule._id === data._id ? 'color:#409eff' : '')
+                        }, [
+                          (data.config?.config.label)
+                            ? (openBlock(), createElementBlock("div", _hoisted_7, [
+                                createVNode(_component_dk_icon, {
+                                  icon: data.config?.config.icon,
+                                  class: "_fc-tree-icon"
+                                }, null, 8 /* PROPS */, ["icon"]),
+                                createTextVNode(" " + toDisplayString(data.config?.config.label), 1 /* TEXT */)
+                              ]))
+                            : createCommentVNode("v-if", true),
+                          createVNode(_component_dk_icon, {
+                            icon: "Close",
+                            class: "close-rule",
+                            onClick: withModifiers($event => (_ctx.delRule(data._id)), ["stop"])
+                          }, null, 8 /* PROPS */, ["onClick"])
+                        ], 4 /* STYLE */)
                       ]),
-                      createElementVNode("span", _hoisted_4, toDisplayString(element.label), 1 /* TEXT */),
-                      (element.count)
-                        ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(element.count - (_ctx.countObj[element.name] || 0)), 1 /* TEXT */))
-                        : createCommentVNode("v-if", true)
-                    ], 2 /* CLASS */))
-                  ]),
-                  _: 2 /* DYNAMIC */
-                }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["list"])
-              ]))
-            }), 128 /* KEYED_FRAGMENT */))
-          ]),
-          createElementVNode("div", {
-            class: "children-list",
-            style: normalizeStyle(_ctx.treeAside.style)
-          }, [
-            createElementVNode("div", {
-              class: "child-title",
-              onClick: _cache[0] || (_cache[0] = $event => (_ctx.hideAside('tree')))
-            }, [
-              _hoisted_6,
-              createVNode(_component_dk_icon, {
-                icon: _ctx.treeAside.hide ? 'ArrowUp' : 'ArrowDown'
-              }, null, 8 /* PROPS */, ["icon"])
+                      _: 1 /* STABLE */
+                    }, 8 /* PROPS */, ["data", "allow-drop", "onNodeDrop", "onNodeClick"])
+                  ])
+                ]),
+                _: 1 /* STABLE */
+              })
             ]),
-            createCommentVNode("        <textarea style=\"width: 100%\">{{ treeAside.treeData }}</textarea>"),
-            createVNode(_component_el_tree, {
-              draggable: "",
-              "highlight-current": "",
-              data: _ctx.treeAside.treeData,
-              props: { value: 'type', label: 'type' },
-              "allow-drop": _ctx.allowDrop,
-              "default-expand-all": true,
-              onNodeDrop: _ctx.nodeDrop,
-              onNodeClick: _ctx.nodeClick
-            }, {
-              default: withCtx(({ data }) => [
-                createElementVNode("div", {
-                  class: "el-tree-node-content",
-                  style: normalizeStyle(_ctx.activeRule && _ctx.activeRule._id === data._id ? 'color:red' : '')
-                }, [
-                  createTextVNode(toDisplayString(data.type) + " ", 1 /* TEXT */),
-                  (data.config?.config.label)
-                    ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(data.config?.config.label), 1 /* TEXT */))
-                    : createCommentVNode("v-if", true),
-                  createVNode(_component_dk_icon, {
-                    icon: "Close",
-                    class: "close-rule",
-                    onClick: withModifiers($event => (_ctx.delRule(data._id)), ["stop"])
-                  }, null, 8 /* PROPS */, ["onClick"])
-                ], 4 /* STYLE */)
-              ]),
-              _: 1 /* STABLE */
-            }, 8 /* PROPS */, ["data", "allow-drop", "onNodeDrop", "onNodeClick"]),
-            (!_ctx.treeAside.hide)
-              ? (openBlock(), createElementBlock("div", {
-                  key: 0,
-                  class: "aside-resizer",
-                  onMousedown: _cache[1] || (_cache[1] = $event => (_ctx.onResizerMouseDown('tree', $event))),
-                  onMouseup: _cache[2] || (_cache[2] = $event => (_ctx.onResizerMouseUp('tree'))),
-                  onMousemove: _cache[3] || (_cache[3] = $event => (_ctx.onResizerMouseMove('tree')))
-                }, null, 32 /* HYDRATE_EVENTS */))
-              : createCommentVNode("v-if", true)
-          ], 4 /* STYLE */),
+            _: 1 /* STABLE */
+          }, 8 /* PROPS */, ["modelValue"]),
           (!_ctx.leftAside.hide)
             ? (openBlock(), createElementBlock("div", {
                 key: 0,
                 class: "aside-resizer",
-                onMousedown: _cache[4] || (_cache[4] = $event => (_ctx.onResizerMouseDown('left', $event))),
-                onMouseup: _cache[5] || (_cache[5] = $event => (_ctx.onResizerMouseUp('left'))),
-                onMousemove: _cache[6] || (_cache[6] = $event => (_ctx.onResizerMouseMove('left')))
+                onMousedown: _cache[1] || (_cache[1] = $event => (_ctx.onResizerMouseDown('left', $event))),
+                onMouseup: _cache[2] || (_cache[2] = $event => (_ctx.onResizerMouseUp('left'))),
+                onMousemove: _cache[3] || (_cache[3] = $event => (_ctx.onResizerMouseMove('left')))
               }, null, 32 /* HYDRATE_EVENTS */))
             : createCommentVNode("v-if", true),
           createElementVNode("div", {
             class: "aside-toggle left-99%",
             style: normalizeStyle(_ctx.leftAside.hide ? 'display:block' : ''),
-            onClick: _cache[7] || (_cache[7] = $event => (_ctx.hideAside('left')))
+            onClick: _cache[4] || (_cache[4] = $event => (_ctx.hideAside('left')))
           }, [
             createVNode(_component_dk_icon, {
               icon: _ctx.leftAside.hide ? 'ArrowRight' : 'ArrowLeft'
@@ -1239,7 +1250,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             default: withCtx(() => [
               withDirectives(createVNode(_component_DragForm, {
                 api: _ctx.dragForm.api,
-                "onUpdate:api": _cache[8] || (_cache[8] = $event => ((_ctx.dragForm.api) = $event)),
+                "onUpdate:api": _cache[5] || (_cache[5] = $event => ((_ctx.dragForm.api) = $event)),
                 rule: _ctx.dragForm.rule,
                 option: _ctx.dragForm.option
               }, null, 8 /* PROPS */, ["api", "rule", "option"]), [
@@ -1260,7 +1271,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         default: withCtx(() => [
           withDirectives(createVNode(_component_el_tabs, {
             modelValue: _ctx.activeTab,
-            "onUpdate:modelValue": _cache[12] || (_cache[12] = $event => ((_ctx.activeTab) = $event))
+            "onUpdate:modelValue": _cache[9] || (_cache[9] = $event => ((_ctx.activeTab) = $event))
           }, {
             default: withCtx(() => [
               (!!_ctx.activeRule)
@@ -1272,7 +1283,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                     default: withCtx(() => [
                       createVNode(_component_DragForm, {
                         api: _ctx.propsForm.api,
-                        "onUpdate:api": _cache[9] || (_cache[9] = $event => ((_ctx.propsForm.api) = $event)),
+                        "onUpdate:api": _cache[6] || (_cache[6] = $event => ((_ctx.propsForm.api) = $event)),
                         rule: _ctx.propsForm.rule,
                         option: _ctx.propsForm.options,
                         "model-value": _ctx.propsForm.value,
@@ -1292,7 +1303,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                     default: withCtx(() => [
                       withDirectives(createVNode(_component_DragForm, {
                         api: _ctx.dkSettingForm.api,
-                        "onUpdate:api": _cache[10] || (_cache[10] = $event => ((_ctx.dkSettingForm.api) = $event)),
+                        "onUpdate:api": _cache[7] || (_cache[7] = $event => ((_ctx.dkSettingForm.api) = $event)),
                         rule: _ctx.dkSettingForm.rule,
                         option: _ctx.dkSettingForm.options,
                         "model-value": _ctx.dkSettingForm.value,
@@ -1311,7 +1322,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 default: withCtx(() => [
                   createVNode(_component_DragForm, {
                     api: _ctx.dkPageForm.api,
-                    "onUpdate:api": _cache[11] || (_cache[11] = $event => ((_ctx.dkPageForm.api) = $event)),
+                    "onUpdate:api": _cache[8] || (_cache[8] = $event => ((_ctx.dkPageForm.api) = $event)),
                     rule: _ctx.dkPageForm.rule,
                     option: _ctx.dkPageForm.options,
                     onChange: _ctx.dkPageChange
@@ -1328,15 +1339,15 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             ? (openBlock(), createElementBlock("div", {
                 key: 0,
                 class: "aside-resizer left-0",
-                onMousedown: _cache[13] || (_cache[13] = $event => (_ctx.onResizerMouseDown('right', $event))),
-                onMouseup: _cache[14] || (_cache[14] = $event => (_ctx.onResizerMouseUp('right'))),
-                onMousemove: _cache[15] || (_cache[15] = $event => (_ctx.onResizerMouseMove('right')))
+                onMousedown: _cache[10] || (_cache[10] = $event => (_ctx.onResizerMouseDown('right', $event))),
+                onMouseup: _cache[11] || (_cache[11] = $event => (_ctx.onResizerMouseUp('right'))),
+                onMousemove: _cache[12] || (_cache[12] = $event => (_ctx.onResizerMouseMove('right')))
               }, null, 32 /* HYDRATE_EVENTS */))
             : createCommentVNode("v-if", true),
           createElementVNode("div", {
             class: "aside-toggle right-99%",
             style: normalizeStyle(_ctx.rightAside.hide ? 'display:block' : ''),
-            onClick: _cache[16] || (_cache[16] = $event => (_ctx.hideAside('right')))
+            onClick: _cache[13] || (_cache[13] = $event => (_ctx.hideAside('right')))
           }, [
             createVNode(_component_dk_icon, {
               icon: _ctx.rightAside.hide ? 'ArrowLeft' : 'ArrowRight'
@@ -1348,7 +1359,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       createCommentVNode("        右边操作区结束"),
       createVNode(_component_el_dialog, {
         visible: _ctx.preview.state,
-        "onUpdate:visible": _cache[17] || (_cache[17] = $event => ((_ctx.preview.state) = $event)),
+        "onUpdate:visible": _cache[14] || (_cache[14] = $event => ((_ctx.preview.state) = $event)),
         width: "375px",
         "append-to-body": "",
         style: {"min-height":"700px"}
@@ -1364,7 +1375,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       }, 8 /* PROPS */, ["visible"]),
       createVNode(_component_dk_dialog, {
         modelValue: _ctx.diyCloud.show,
-        "onUpdate:modelValue": _cache[18] || (_cache[18] = $event => ((_ctx.diyCloud.show) = $event)),
+        "onUpdate:modelValue": _cache[15] || (_cache[15] = $event => ((_ctx.diyCloud.show) = $event)),
         width: "1200px",
         "append-to-body": "",
         title: "DIY模板市场",