publish

src/comm/controllers/ProjectCtrl/index.ts

@@ -204,6 +204,10 @@ export class ProjectController extends Controller {
     const reg = /(http:|https:)?\/\//gi;
     return !reg.test(url);
   }
+  isOnlineUrl(url: string) {
+    const index = url.indexOf("queenshow");
+    return index != -1 ? true : false;
+  }
 
   async createProject(path: string) {
     const deviceCtrl = useCtx().deviceCtrl;

src/modules/editor/components/Viewport/Header/PublishDesignModal.tsx

@@ -1,23 +1,14 @@
 import { IconNext, IconPrev } from "@/assets/icons";
 import { initEditor } from "@/modules/editor";
-import { ScreenshotCtrl } from "@/modules/editor/controllers/ScreenshotCtrl";
 import { Design_Page_Size } from "@/modules/editor/dicts/CompOptions";
 import { DesignComp } from "@/modules/editor/objects/DesignTemp/DesignComp";
 import { SelectOneImage } from "@/pages/website/Material2/modal";
 import { Image } from "@queenjs/ui";
 import { Button, Form, Input } from "ant-design-vue";
 import { cloneDeep } from "lodash";
-import { Exception, queenApi } from "queenjs";
-import {
-  defineComponent,
-  nextTick,
-  provide,
-  reactive,
-  ref,
-  onMounted,
-} from "vue";
+import { useDialog } from "queenjs/api/feedback";
+import { defineComponent, nextTick, provide, reactive, ref } from "vue";
 import { any } from "vue-types";
-import { useCompRef } from "../../CompUI/basicUI/hooks";
 const NotFoundComp = () => <div>无效的组件</div>;
 const layout = {
   labelCol: { span: 24 },
@@ -31,7 +22,7 @@ export default defineComponent({
     const editor = initEditor();
     const { helper, controls } = editor;
     const page = controls.pageCtrl;
-
+    const modal = useDialog();
     controls.pageCtrl.setDesignData(cloneDeep(props.data));
 
     const pageRef = ref();
@@ -161,7 +152,8 @@ export default defineComponent({
     };
     const submit = () => {
       validate().then(async (values) => {
-        console.log(formState);
+        const publishData = { ...props.data, ...formState };
+        modal.submit(publishData);
       });
     };
 

src/modules/editor/components/Viewport/Header/SaveOrShare.tsx

@@ -4,12 +4,14 @@ import { defineUI, queenApi } from "queenjs";
 import { TipIcons } from "../../TipIcons";
 import PreviewDesignModal from "./PreviewDesignModal";
 import PublishDesignModal from "./PublishDesignModal";
+import { DesignTemp } from "@/modules/editor/objects/DesignTemp";
+import { useCtx } from "@/comm/ctx";
 
 export default defineUI({
   setup() {
     const editor = useEditor();
     const { store, actions, controls } = editor;
-
+    const { prjCtrl } = useCtx();
     function showPreviewModal() {
       controls.screenCtrl.saveScreenPage();
       const rootPage = controls.pageCtrl.rootPage;
@@ -26,7 +28,10 @@ export default defineUI({
       );
     }
     async function showPublishModal() {
-      if (!controls.pageCtrl.designData.thumbnail) {
+      if (
+        !controls.pageCtrl.designData.thumbnail ||
+        !prjCtrl.isOnlineUrl(controls.pageCtrl.designData.thumbnail)
+      ) {
         await actions.updateThumbnailByScreenshot();
       }
 
@@ -36,13 +41,17 @@ export default defineUI({
       rootPage.value.pageSizeType =
         controls.screenCtrl.state.screen.pageSizeType;
 
-      await queenApi.dialog(
+      const res: DesignTemp = await queenApi.dialog(
         <PublishDesignModal data={controls.pageCtrl.designData} />,
         {
           fullscreen: true,
           title: "作品信息",
         }
       );
+      if (res) {
+        await actions.publishDesign(res);
+        queenApi.messageSuccess("发布成功");
+      }
     }
 
     return () => (

src/modules/editor/components/Viewport/Slider/SliderLeft/RenderImage.tsx

@@ -25,7 +25,6 @@ export default defineComponent({
       ctx.deviceCtrl
         .GetFilesInDir(ctx.prjCtrl.getOutputDir(), "\\.png$")
         .then((ret: any) => {
-          console.log(ret);
           ret &&
             ret.map((e: any) => {
               const relaUrl = ctx.prjCtrl.getRelativeUri(e.Fpath);

src/modules/editor/controllers/PageCtrl/index.ts

@@ -120,11 +120,14 @@ export class PageCtrl extends ModuleControl<EditorModule> {
         (status: string, p: any) => {
           if (status == "succ") {
             comp.value.url = fpath;
-            this.store.filesCacheUrl[assetKey] = assetUrl;
+            if (prjCtrl.isOnlineUrl(assetUrl)) {
+              this.store.filesCacheUrl[assetKey] = assetUrl;
+            }
+
             this.localFilesCacheSave();
           }
           if (status == "error") {
-            this.store.filesCacheUrl[assetKey] = undefined;
+            // this.store.filesCacheUrl[assetKey] = undefined;
           }
         }
       );
@@ -132,10 +135,13 @@ export class PageCtrl extends ModuleControl<EditorModule> {
   }
   async localFilesCacheSave() {
     const { deviceCtrl, prjCtrl } = useCtx();
-    await deviceCtrl.WriteFileText(
+    const ok = await deviceCtrl.WriteFileText(
       `${prjCtrl.RootDir}/queen5/assets.cache.queen5`,
       JSON.stringify(this.store.filesCacheUrl)
     );
+    if (!ok) {
+      return Promise.reject("缓存失败");
+    }
   }
 
   setDesignData(data: Partial<DesignTemp>) {

src/modules/editor/module/actions/edit.tsx

@@ -1,5 +1,5 @@
 import { useCtx } from "@/comm/ctx";
-import { pick } from "lodash";
+import { pick, set } from "lodash";
 import { Exception, queenApi } from "queenjs";
 import { EditorModule } from "..";
 import { ScreenshotCtrl } from "../../controllers/ScreenshotCtrl";
@@ -8,6 +8,7 @@ import { Matrix } from "../../controllers/SelectCtrl/matrix";
 import { DesignComp } from "../../objects/DesignTemp/DesignComp";
 import { cloneObj, createObj, history } from "../../objects/DesignTemp/factory";
 import { ICompKeys } from "../../typings";
+import { DesignTemp } from "../../objects/DesignTemp";
 
 const ctrlState = {
   selected: [] as string[],
@@ -725,6 +726,87 @@ export const editActions = EditorModule.action({
       return Promise.reject("保存失败");
     }
   },
+  async publishDesign(data: DesignTemp) {
+    const publish = data;
+    await this.actions.uplodThumbnail(publish);
+    await this.actions.uploadLocalAssets(publish);
+    await this.https.createDesign(publish);
+  },
+  async uplodThumbnail(data: DesignTemp) {
+    if (!data.thumbnail) {
+      return;
+    }
+    if (queenApi.isBlobURL(data.thumbnail)) {
+      queenApi.showLoading("封面上传中");
+      const blobUrl = data.thumbnail;
+      const file = queenApi.blobURLMaps.get(blobUrl);
+      const ret = await this.controls.uploader.uploadFile(
+        file,
+        "queenshow",
+        queenApi.getBlobURLExt(blobUrl)
+      );
+      if (ret.url) {
+        set(data, "thumbnail", ret.url);
+        this.controls.pageCtrl.setDesignThumbnail(ret.url);
+        URL.revokeObjectURL(blobUrl);
+        queenApi.blobURLMaps.delete(blobUrl);
+      }
+      queenApi.hideLoading();
+    }
+  },
+  async uploadLocalAssets(data: DesignTemp) {
+    const { prjCtrl } = useCtx();
+    const filesCache = this.store.filesCacheUrl;
+    const todoMap = new Map<string, string>();
+    const keys = Object.keys(data.compMap);
+    const compMap: any = {};
+    keys.forEach((k) => {
+      const compItem = data.compMap[k];
+      if (compItem.compKey == "Image" || compItem.compKey == "Video") {
+        const assetUrl = compItem.value.url;
+        const assetsName = assetUrl.replace(
+          /(.*\/)*((\S|\s)+\.*)(\?.*)?/g,
+          "$2"
+        );
+        const assetKey = assetsName.replace(/\s/g, "");
+        if (filesCache[assetKey]) {
+          compItem.value.url = filesCache[assetKey];
+        } else {
+          todoMap.set(k, prjCtrl.getHttpAbsoluteUri(compItem.value.url));
+        }
+      }
+      compMap[k] = compItem.toJson?.();
+    });
+    let err = "";
+    const todoList = todoMap.entries();
+    const len = Array.from(todoMap.entries()).length;
+
+    if (len > 0) {
+      for (const item of todoList) {
+        const [key, url] = item;
+        const blob: any = await this.helper.urlToBlob(url);
+        let ext = "png";
+        if (blob.type) {
+          ext = blob.type.split("/").pop();
+        }
+        queenApi.showLoading("图片上传中");
+        const ret = await this.controls.uploader.uploadFile(
+          blob as Blob,
+          "queenshow",
+          ext
+        );
+        if (ret.url) {
+          compMap[key].value.url = ret.url;
+        } else {
+          err = ret.error || `上传图片失败[${url}]`;
+          break;
+        }
+        queenApi.hideLoading();
+      }
+    }
+    if (err) throw err;
+    set(data, "compMap", compMap);
+  },
 
   // 截屏保存封面
   async updateThumbnailByScreenshot(autoSave?: boolean) {

src/modules/editor/module/actions/init.ts

@@ -56,6 +56,7 @@ export const initActions = EditorModule.action({
       }
     }
     const page = this.controls.pageCtrl;
+
     page.setDesignData(ret);
   },
   async initLocalFilesCache() {

src/modules/editor/module/helpers/index.ts

@@ -355,4 +355,19 @@ export const helpers = EditorModule.helper({
       img.src = url;
     });
   },
+  urlToBlob(url: string) {
+    return new Promise((resolve, reject) => {
+      let xhr = new XMLHttpRequest();
+      xhr.open("get", url, true);
+      xhr.responseType = "blob";
+      xhr.onload = function () {
+        if (this.status == 200) {
+          resolve(this.response);
+        } else {
+          reject("error");
+        }
+      };
+      xhr.send();
+    });
+  },
 });

src/modules/editor/module/https/index.ts

@@ -19,6 +19,11 @@ export const https = EditorModule.http({
       params,
     });
   },
+
+  createDesign(data: any) {
+    return this.request("/h5/create", { method: "POST", data });
+  },
+
   saveDesign(data: Partial<DesignTemp>) {
     return this.request("/h5/update", {
       method: "POST",