@opentiny/tiny-engine-toolbar-save 1.0.3 → 2.0.0-alpha.1

package/dist/index.js

@@ -1,171 +1,236 @@
 import "./style.css";
-import { reactive as C, ref as B, onBeforeMount as E, resolveComponent as r, openBlock as y, createElementBlock as L, Fragment as w, createVNode as l, withCtx as d, createElementVNode as b, withDirectives as M, vShow as O, createTextVNode as k, createBlock as G, createCommentVNode as V } from "vue";
-import { VueMonaco as D } from "@opentiny/tiny-engine-common";
-import { Button as R, Popover as U, DialogBox as J } from "@opentiny/vue";
-import { useCanvas as P, useLayout as S, useBlock as j, usePage as z, useNotify as F } from "@opentiny/tiny-engine-controller";
-import { theme as I } from "@opentiny/tiny-engine-controller/adapter";
-import { setSchema as q, selectNode as H, getSchema as K } from "@opentiny/tiny-engine-canvas";
+import { reactive as V, ref as T, onUnmounted as A, resolveComponent as p, openBlock as C, createElementBlock as w, Fragment as E, createElementVNode as v, createVNode as i, withCtx as l, toDisplayString as N, withModifiers as M, createTextVNode as b, createBlock as U, createCommentVNode as D } from "vue";
+import { VueMonaco as L } from "@opentiny/tiny-engine-common";
+import { Button as O, Popover as G, DialogBox as R, Checkbox as h, Select as J } from "@opentiny/vue";
+import { usePage as j, useCanvas as y, useLayout as F, useNotify as q, getMetaApi as z, META_APP as H, useBlock as K } from "@opentiny/tiny-engine-meta-register";
 import { constants as Q } from "@opentiny/tiny-engine-utils";
 import { handlePageUpdate as W } from "@opentiny/tiny-engine-common/js/http";
-const { pageState: h, isSaved: X, isBlock: Y } = P(), { PLUGIN_NAME: Z, getPluginApi: $ } = S(), { getCurrentBlock: ee } = j(), { PAGE_STATUS: a } = Q, { pageSettingState: u, isTemporaryPage: _ } = z(), m = C({
+const { PAGE_STATUS: u } = Q, g = V({
   visible: !1,
   code: "",
   originalCode: "",
   disabled: !1
-}), i = B(!1), oe = async (n) => {
-  var t;
-  const e = $(Z.BlockManage), o = ee();
-  o.label = n.fileName, o.content = n, i.value = !0, o.screenshot = await e.getBlockBase64(), await ((t = e.saveBlock) == null ? void 0 : t.call(e, o)), i.value = !1;
-}, te = async (n) => {
-  const { currentPage: e } = h, o = {
-    page_content: n
+}), _ = T(!1), X = async (a) => {
+  var n;
+  const e = z(H.BlockManage), { getCurrentBlock: o } = K(), t = o();
+  t.label = a.fileName, t.content = a, _.value = !0, t.screenshot = await e.getBlockBase64(), await ((n = e.saveBlock) == null ? void 0 : n.call(e, t)), _.value = !1;
+}, Y = async (a) => {
+  const { currentPage: e } = y().pageState, o = {
+    page_content: a
   };
-  i.value = !0, await W(e.id, { ...e, ...o }), i.value = !1;
-}, f = (n) => {
-  const e = JSON.parse(n);
-  if (h.pageSchema = e, q(e), u != null && u.isAIPage) {
-    _.saved && (_.saved = !1), _.saved = !0;
-    const o = "page_content";
-    return u.currentPageData[o] = e, Promise.resolve();
+  _.value = !0, await W(e.id, { ...e, ...o }), _.value = !1;
+}, k = (a) => {
+  const { pageSettingState: e, isTemporaryPage: o } = j(), { isBlock: t, canvasApi: n, pageState: f } = y(), s = JSON.parse(a), { setSchema: r, selectNode: d } = n.value;
+  if (f.pageSchema = s, r(s), e != null && e.isAIPage) {
+    o.saved && (o.saved = !1), o.saved = !0;
+    const c = "page_content";
+    return e.currentPageData[c] = s, Promise.resolve();
   }
-  return H(null), Y() ? oe(e) : te(e);
+  return d(null), t() ? X(s) : Y(s);
 }, x = async () => {
-  var c;
-  if (X() || m.disabled)
+  var d;
+  const { isSaved: a, canvasApi: e } = y();
+  if (a() || g.disabled)
     return;
-  const n = (c = S().layoutState) == null ? void 0 : c.pageStatus, e = n == null ? void 0 : n.state, o = n == null ? void 0 : n.data, t = {
-    [a.Release]: "当前页面未锁定，请先锁定再保存",
-    [a.Empty]: "当前应用无页面，请先新建页面再保存",
-    [a.Guest]: "官网演示应用不能保存页面，如需体验请切换应用",
-    [a.Lock]: `当前页面被 ${o == null ? void 0 : o.username} ${o == null ? void 0 : o.resetPasswordToken} 锁定，如需编辑请先联系他解锁文件，然后再锁定该页面后编辑！`
+  const o = (d = F().layoutState) == null ? void 0 : d.pageStatus, t = o == null ? void 0 : o.state, n = o == null ? void 0 : o.data, { getSchema: f } = e.value, s = {
+    [u.Release]: "当前页面未锁定，请先锁定再保存",
+    [u.Empty]: "当前应用无页面，请先新建页面再保存",
+    [u.Guest]: "官网演示应用不能保存页面，如需体验请切换应用",
+    [u.Lock]: `当前页面被 ${n == null ? void 0 : n.username} ${n == null ? void 0 : n.resetPasswordToken} 锁定，如需编辑请先联系他解锁文件，然后再锁定该页面后编辑！`
   };
-  if ([a.Release, a.Empty, a.Guest, a.Lock].includes(e)) {
-    F({
+  if ([u.Release, u.Empty, u.Guest, u.Lock].includes(t)) {
+    q({
       type: "error",
       title: "保存失败",
-      message: t[e]
+      message: s[t]
     });
     return;
   }
-  m.disabled = !0;
-  const s = K();
-  m.code = JSON.stringify(s || {}, null, 2), f(m.code).finally(() => {
-    m.disabled = !1;
+  g.disabled = !0;
+  const r = f();
+  g.code = JSON.stringify(r || {}, null, 2), k(g.code).finally(() => {
+    g.disabled = !1;
   });
 };
-const ne = (n, e) => {
-  const o = n.__vccOpts || n;
-  for (const [t, s] of e)
-    o[t] = s;
+const Z = (a, e) => {
+  const o = a.__vccOpts || a;
+  for (const [t, n] of e)
+    o[t] = n;
   return o;
-}, ae = {
-  saveCommon: f,
+}, I = {
+  saveCommon: k,
   openCommon: x
-}, se = {
+}, $ = {
   components: {
-    VueMonaco: D,
-    TinyButton: R,
-    TinyPopover: U,
-    TinyDialogBox: J
+    VueMonaco: L,
+    TinyButton: O,
+    TinyPopover: G,
+    TinyDialogBox: R,
+    TinyCheckbox: h,
+    TinySelect: J
   },
   props: {
     icon: {
       type: String,
       default: "save"
+    },
+    iconExpand: {
+      type: String,
+      default: "down-arrow"
     }
   },
   setup() {
-    const { isSaved: n } = P(), e = C({
+    const a = [
+      { value: 5, label: "5分钟" },
+      { value: 10, label: "10分钟" },
+      { value: 15, label: "15分钟" }
+    ], e = V({
       visible: !1,
       code: "",
       originalCode: "",
       disabled: !1,
-      timer: null
-    }), o = B(null), t = () => {
+      timeValue: 5,
+      saveVisible: !1,
+      checked: !1,
+      preservationTime: null
+    }), o = T(null), t = () => {
       e.visible = !1, e.originalCode = "";
-    }, s = () => {
-      i.value || x();
-    }, c = () => {
-      f();
-    }, p = {
-      theme: I(),
-      tabSize: 2,
+    }, n = () => {
+      _.value || x();
+    }, f = () => {
+      k();
+    }, s = {
       language: "json",
-      autoIndent: !0,
       lineNumbers: !0,
-      formatOnPaste: !0,
-      automaticLayout: !0,
-      roundedSelection: !0,
       minimap: {
         enabled: !1
       }
+    }, r = () => {
+      clearTimeout(e.preservationTime), e.preservationTime = setTimeout(() => {
+        n(), r();
+      }, e.timeValue * 60 * 1e3);
+    }, d = () => {
+      e.checked ? r() : clearTimeout(e.preservationTime), e.saveVisible = !1;
+    }, c = () => {
+      e.saveVisible = !1;
     };
-    return E(() => {
-      clearTimeout(e.timer);
+    return A(() => {
+      clearTimeout(e.preservationTime);
     }), {
       state: e,
       editor: o,
-      editorOptions: p,
-      isLoading: i,
+      editorOptions: s,
+      isLoading: _,
       close: t,
-      isSaved: n,
-      openApi: s,
-      saveApi: c
+      openApi: n,
+      saveApi: f,
+      options: a,
+      cancel: c,
+      autoSave: d
     };
   }
-}, ie = ["id"], ce = { class: "dots" };
-function re(n, e, o, t, s, c) {
-  const p = r("svg-icon"), N = r("tiny-popover"), A = r("vue-monaco"), g = r("tiny-button"), T = r("tiny-dialog-box");
-  return y(), L(w, null, [
-    l(N, {
-      trigger: "hover",
-      "open-delay": 1e3,
-      "popper-class": "toolbar-right-popover",
-      "append-to-body": "",
-      content: t.isLoading ? "保存中" : "保存"
-    }, {
-      reference: d(() => [
-        b("span", {
-          id: `${t.isLoading ? "saving" : ""}`,
-          class: "icon",
-          onClick: e[0] || (e[0] = (...v) => t.openApi && t.openApi(...v))
-        }, [
-          M(b("span", ce, null, 512), [
-            [O, !t.isSaved()]
-          ]),
-          l(p, { name: o.icon }, null, 8, ["name"])
-        ], 8, ie)
-      ]),
-      _: 1
-    }, 8, ["content"]),
-    l(T, {
+}, ee = { class: "toolbar-save" }, te = { class: "save-title" }, oe = { class: "save-style" }, ne = { class: "save-time" }, ae = { class: "save-button-group" };
+function se(a, e, o, t, n, f) {
+  const s = p("svg-icon"), r = p("tiny-checkbox"), d = p("tiny-select"), c = p("tiny-button"), S = p("tiny-popover"), B = p("vue-monaco"), P = p("tiny-dialog-box");
+  return C(), w(E, null, [
+    v("div", ee, [
+      i(c, {
+        class: "save-button",
+        onClick: t.openApi
+      }, {
+        default: l(() => [
+          i(s, { name: o.icon }, null, 8, ["name"]),
+          v("span", te, N(t.isLoading ? "保存中" : "保存"), 1),
+          v("span", {
+            onClick: e[3] || (e[3] = M((m) => t.state.saveVisible = !t.state.saveVisible, ["stop"]))
+          }, [
+            i(S, {
+              modelValue: t.state.saveVisible,
+              "onUpdate:modelValue": e[2] || (e[2] = (m) => t.state.saveVisible = m),
+              "visible-arrow": !1,
+              width: "203",
+              trigger: "manual"
+            }, {
+              reference: l(() => [
+                i(s, { name: o.iconExpand }, null, 8, ["name"])
+              ]),
+              default: l(() => [
+                v("div", oe, [
+                  e[9] || (e[9] = v("div", { class: "save-setting" }, "保存设置", -1)),
+                  i(r, {
+                    modelValue: t.state.checked,
+                    "onUpdate:modelValue": e[0] || (e[0] = (m) => t.state.checked = m),
+                    name: "tiny-checkbox"
+                  }, {
+                    default: l(() => e[5] || (e[5] = [
+                      b("自动保存")
+                    ])),
+                    _: 1
+                  }, 8, ["modelValue"]),
+                  v("div", ne, [
+                    e[6] || (e[6] = v("div", null, "保存间隔", -1)),
+                    i(d, {
+                      modelValue: t.state.timeValue,
+                      "onUpdate:modelValue": e[1] || (e[1] = (m) => t.state.timeValue = m),
+                      options: t.options,
+                      disabled: !t.state.checked,
+                      autocomplete: ""
+                    }, null, 8, ["modelValue", "options", "disabled"])
+                  ]),
+                  v("div", ae, [
+                    i(c, { onClick: t.cancel }, {
+                      default: l(() => e[7] || (e[7] = [
+                        b("取消")
+                      ])),
+                      _: 1
+                    }, 8, ["onClick"]),
+                    i(c, {
+                      type: "primary",
+                      onClick: t.autoSave
+                    }, {
+                      default: l(() => e[8] || (e[8] = [
+                        b("设置并保存")
+                      ])),
+                      _: 1
+                    }, 8, ["onClick"])
+                  ])
+                ])
+              ]),
+              _: 1
+            }, 8, ["modelValue"])
+          ])
+        ]),
+        _: 1
+      }, 8, ["onClick"])
+    ]),
+    i(P, {
       class: "dialog-box",
       modal: !1,
       fullscreen: !0,
       "append-to-body": !0,
       visible: t.state.visible,
       title: "Schema 本地与线上差异",
-      "onUpdate:visible": e[1] || (e[1] = (v) => t.state.visible = v)
+      "onUpdate:visible": e[4] || (e[4] = (m) => t.state.visible = m)
     }, {
-      footer: d(() => [
-        l(g, { onClick: t.close }, {
-          default: d(() => [
-            k("取 消")
-          ]),
+      footer: l(() => [
+        i(c, { onClick: t.close }, {
+          default: l(() => e[10] || (e[10] = [
+            b("取 消")
+          ])),
           _: 1
         }, 8, ["onClick"]),
-        l(g, {
+        i(c, {
           type: "primary",
           onClick: t.saveApi
         }, {
-          default: d(() => [
-            k("保 存")
-          ]),
+          default: l(() => e[11] || (e[11] = [
+            b("保 存")
+          ])),
           _: 1
         }, 8, ["onClick"])
       ]),
-      default: d(() => [
-        t.state.visible ? (y(), G(A, {
+      default: l(() => [
+        t.state.visible ? (C(), U(B, {
           key: 0,
           ref: "editor",
           class: "monaco-editor",
@@ -173,20 +238,23 @@ function re(n, e, o, t, s, c) {
           options: t.editorOptions,
           value: t.state.code,
           original: t.state.originalCode
-        }, null, 8, ["options", "value", "original"])) : V("", !0)
+        }, null, 8, ["options", "value", "original"])) : D("", !0)
       ]),
       _: 1
     }, 8, ["visible"])
   ], 64);
 }
-const le = /* @__PURE__ */ ne(se, [["render", re], ["__scopeId", "data-v-a55d2356"]]), be = {
-  id: "save",
+const ie = /* @__PURE__ */ Z($, [["render", se], ["__scopeId", "data-v-159e4497"]]), le = {
+  id: "engine.toolbars.save",
+  type: "toolbars",
   title: "save",
   icon: "",
-  align: "right",
-  component: le,
-  api: ae
+  align: "right"
+}, fe = {
+  ...le,
+  entry: ie,
+  apis: I
 };
 export {
-  be as default
+  fe as default
 };

package/dist/style.css

@@ -1 +1 @@
-.dots[data-v-a55d2356]{width:6px;height:6px;background:var(--ti-lowcode-toolbar-dot-color);border-radius:50%;display:inline-block;position:absolute;top:4px;right:3px;z-index:100}#saving[data-v-a55d2356]{cursor:not-allowed;color:var(--ti-lowcode-disabled-color)}#saving[data-v-a55d2356] svg{color:var(--ti-lowcode-disabled-color)}.dialog-box[data-v-a55d2356] .tiny-dialog-box{display:flex;flex-direction:column}.dialog-box[data-v-a55d2356] .tiny-dialog-box .tiny-dialog-box__body{flex:1}.dialog-box .monaco-editor[data-v-a55d2356]{width:100%;height:100%}.changeRole a{color:var(--ti-lowcode-canvas-handle-hover-bg);padding:0 5px}
+.dots[data-v-159e4497]{width:6px;height:6px;background:var(--ti-lowcode-toolbar-dot-color);border-radius:50%;display:inline-block;position:absolute;top:4px;right:3px;z-index:100}.toolbar-save .save-button[data-v-159e4497]{background-color:var(--ti-lowcode-toolbar-button-bg);border:none;min-width:70px;height:26px;display:flex;align-items:center;padding:0 8px;border-radius:4px}.toolbar-save .save-button[data-v-159e4497]:not(.disabled):hover{background-color:var(--ti-lowcode-toolbar-button-bg)}.toolbar-save .save-button .save-title[data-v-159e4497]{margin:0 6px}.toolbar-save[data-v-159e4497] .icon-down-arrow:focus{outline:none}.save-style[data-v-159e4497]{padding:14px;font-size:12px}.save-style .save-button-group[data-v-159e4497]{text-align:right}.save-style .save-button-group[data-v-159e4497] .tiny-button{min-width:40px;padding:0 8px;height:26px;line-height:24px;border-radius:4px}.save-time[data-v-159e4497]{line-height:24px;font-size:12px;margin:13px 0 14px;display:flex}.save-time .tiny-select[data-v-159e4497]{width:103px;margin-left:12px}.save-time .tiny-select[data-v-159e4497] .tiny-input__suffix{width:12px;top:12px}#saving[data-v-159e4497]{cursor:not-allowed;color:var(--ti-lowcode-disabled-color)}#saving[data-v-159e4497] svg{color:var(--ti-lowcode-disabled-color)}.dialog-box[data-v-159e4497] .tiny-dialog-box{display:flex;flex-direction:column}.dialog-box[data-v-159e4497] .tiny-dialog-box .tiny-dialog-box__body{flex:1}.dialog-box .monaco-editor[data-v-159e4497]{width:100%;height:100%}.changeRole a{color:var(--ti-lowcode-canvas-handle-hover-bg);padding:0 5px}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/tiny-engine-toolbar-save",
-  "version": "1.0.3",
+  "version": "2.0.0-alpha.1",
   "publishConfig": {
     "access": "public"
   },
@@ -24,19 +24,19 @@
   "license": "MIT",
   "homepage": "https://opentiny.design/tiny-engine",
   "dependencies": {
-    "@opentiny/tiny-engine-canvas": "1.0.3",
-    "@opentiny/tiny-engine-common": "1.0.2",
-    "@opentiny/tiny-engine-controller": "1.0.3",
-    "@opentiny/tiny-engine-utils": "1.0.4",
-    "@opentiny/vue": "~3.10.0"
+    "@opentiny/tiny-engine-common": "2.0.0-alpha.1",
+    "@opentiny/tiny-engine-meta-register": "2.0.0-alpha.1",
+    "@opentiny/tiny-engine-utils": "2.0.0-alpha.1"
   },
   "devDependencies": {
+    "@opentiny/tiny-engine-vite-plugin-meta-comments": "2.0.0-alpha.1",
     "@vitejs/plugin-vue": "^4.2.3",
-    "@vitejs/plugin-vue-jsx": "^1.3.10",
+    "@vitejs/plugin-vue-jsx": "^3.1.0",
     "vite": "^4.3.7"
   },
   "peerDependencies": {
+    "@opentiny/vue": "^3.14.0",
     "vue": "^3.4.15"
   },
-  "gitHead": "9a6cce3988accb39c97a9a21169c022c65a8e27f"
+  "gitHead": "f15ccc5dde391288bf4297e3ffc35aab52651f3d"
 }