ananzhusen 2 лет назад
Родитель
Сommit
3df9a536ac
3 измененных файлов с 348 добавлено и 313 удалено
  1. 334 0
      src/services/common.ts
  2. 7 306
      src/views/components/Header.vue
  3. 7 7
      src/views/components/View.vue

+ 334 - 0
src/services/common.ts

@@ -1,4 +1,28 @@
 import { ref } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import router from "@/router/index";
+import { useUser } from "@/services/user";
+import {
+  showNotification,
+  Meta2dBackData,
+  dealwithFormatbeforeOpen,
+  gotoAccount,
+  checkData,
+} from "@/services/utils";
+import { NotifyPlugin, MessagePlugin } from "tdesign-vue-next";
+import localforage from "localforage";
+import { noLoginTip, localMeta2dDataName } from "@/services/utils";
+import { readFile, upload, dataURLtoBlob } from "@/services/file";
+import {
+  delImage,
+  getFolders,
+  addCollection,
+  updateCollection,
+  updateFolders,
+  cdn,
+  upCdn,
+} from "@/services/api";
+import { compareVersion, baseVer, upgrade } from "@/services/upgrade";
 
 const dot = ref(false);
 
@@ -16,3 +40,313 @@ export const useDot = () => {
     setDot,
   };
 };
+
+// import { noLoginTip } from "@/services/utils";
+
+const { user } = useUser();
+// const route = useRoute();
+// const router = useRouter();
+
+export enum SaveType {
+  Save,
+  SaveAs,
+}
+export const save = async (
+  type: SaveType = SaveType.Save,
+  component?: boolean
+) => {
+  meta2d.stopAnimate();
+  const data: Meta2dBackData = meta2d.data();
+  if (!(user && user.username)) {
+    MessagePlugin.warning(noLoginTip);
+    localforage.setItem(localMeta2dDataName, JSON.stringify(data));
+    return;
+  }
+  checkData(data);
+  if (!data._id && router.currentRoute.value.query.id) {
+    data._id = router.currentRoute.value.query.id as string;
+  }
+
+  if (
+    (globalThis as any).beforeSaveMeta2d &&
+    !(await (globalThis as any).beforeSaveMeta2d(data))
+  ) {
+    return;
+  }
+  if (type === SaveType.SaveAs) {
+    //另存为去掉teams信息
+    delete data.teams;
+  }
+  //如果不是自己创建的团队图纸,就不去修改缩略图(没有权限去删除缩略图)
+  if (!((data as any).teams && data.owner?.id !== user.id)) {
+    let blob: Blob;
+    try {
+      blob = dataURLtoBlob(meta2d.toPng(10) + "");
+    } catch (e) {
+      MessagePlugin.error(
+        "无法下载,宽度不合法,画布可能没有画笔/画布大小超出浏览器最大限制"
+      );
+      return;
+    }
+    if (data._id && type === SaveType.Save) {
+      if (data.image && !(await delImage(data.image))) {
+        return;
+      }
+    }
+
+    const file = await upload(blob, true);
+    if (!file) {
+      return;
+    }
+
+    // 缩略图
+    data.image = file.url;
+    (meta2d.store.data as Meta2dBackData).image = data.image;
+  }
+
+  if (component) {
+    data.component = true;
+    // pens 存储原数据用于二次编辑 ; componentDatas 组合后的数据,用于复用
+    data.componentDatas = meta2d.toComponent(
+      undefined,
+      (meta2d.store.data as Meta2dBackData).showChild,
+      false //自定义组合节点生成默认锚点
+    );
+  } else {
+    data.component = false; // 必要值
+  }
+  let collection = data.component ? "le5le2d-components" : "le5le2d";
+  let ret: any;
+  if (!data.name) {
+    // 文件名称
+    data.name = `meta2d.${new Date().toLocaleString()}`;
+    (meta2d.store.data as Meta2dBackData).name = data.name;
+  }
+  !data.version && (data.version = baseVer);
+
+  let list = undefined;
+  let folder: any = undefined;
+  let folderId = undefined;
+  if (
+    !data.component &&
+    data.folder &&
+    !(data.teams && data.owner?.id !== user.id)
+  ) {
+    //自己的图纸才允许去请求
+    folder = getFolders({
+      type: collection,
+      name: data.folder,
+    });
+    if (folder) {
+      list = folder.list; //团队图纸文件夹
+      folderId = folder._id;
+    }
+  }
+  if (!list) {
+    list = [];
+  }
+
+  if (type === SaveType.SaveAs) {
+    // 另存为一定走 新增 ,由于后端 未控制 userId 等属性,清空一下
+    const delAttrs = [
+      "userId",
+      "id",
+      "shared",
+      "star",
+      "view",
+      "username",
+      "editorName",
+      "editorId",
+      "createdAt",
+      "updatedAt",
+      "recommend",
+    ];
+    for (const k of delAttrs) {
+      delete (data as any)[k];
+    }
+    ret = addCollection(collection, data); // 新增
+    if (!data.component) {
+      list.push({
+        id: ret._id,
+        image: data.image,
+        name: data.name,
+        component: data.component,
+      });
+    }
+  } else {
+    if (data._id && data.teams && data.owner?.id !== user.id) {
+      // 团队图纸 不允许修改文件夹信息
+      delete data.folder;
+      ret = updateCollection(collection, data);
+    } else if (data._id) {
+      ret = updateCollection(collection, data);
+      if (!data.component) {
+        list.forEach((i: any) => {
+          if (i.id === data._id) {
+            i.image = data.image;
+          }
+        });
+      }
+      //TODO 处理老接口图纸情况
+      let one = list.find((item: any) => item.id === data._id);
+      if (!data.component && !one) {
+        list.push({
+          id: ret._id,
+          image: data.image,
+          name: data.name,
+          component: data.component,
+        });
+      }
+    } else {
+      ret = addCollection(collection, data); // 新增
+      if (!data.component) {
+        list.push({
+          id: ret._id,
+          image: data.image,
+          name: data.name,
+          component: data.component,
+        });
+      }
+    }
+  }
+
+  if (ret.error) {
+    return null;
+  } else {
+    if (!data.component && folderId) {
+      const updateRet: any = updateFolders({
+        _id: folderId,
+        list,
+      });
+      if (updateRet.error) {
+        return null;
+      }
+    }
+    // showModelSaveAsPop.value = false;
+  }
+  //  保存图纸之后的钩子函数
+  (window as any).afterSaveMeta2d &&
+    (await (window as any).afterSaveMeta2d(ret));
+  if (
+    !data._id ||
+    data.owner?.id !== user.id ||
+    router.currentRoute.value.query.version ||
+    type === SaveType.SaveAs // 另存为肯定走新增,也会产生新的 id
+  ) {
+    data._id = ret._id;
+    (meta2d.store.data as Meta2dBackData)._id = data._id;
+    router.replace({
+      path: "/",
+      query: {
+        id: data._id,
+        r: Date.now() + "",
+        component: data.component + "",
+      },
+    });
+  }
+
+  MessagePlugin.success("保存成功!");
+  // 保存成功,重新请求文件夹
+  meta2d.emit("t-save-success", true);
+  // 已保存,不再是新的,无需提示保存
+  // setDot(false);
+  dot.value = false;
+  localforage.removeItem(localMeta2dDataName);
+};
+const pen = ref(false);
+const drawPen = () => {
+  meta2d.inactive();
+  try {
+    if (!meta2d.canvas.drawingLineName) {
+      // 开了钢笔,需要关掉铅笔
+      meta2d.canvas.pencil && drawingPencil();
+      meta2d.drawLine(meta2d.store.options.drawingLineName);
+    } else {
+      meta2d.finishDrawLine();
+      meta2d.drawLine();
+    }
+    //钢笔
+    pen.value = !!meta2d.canvas.drawingLineName;
+  } catch (e: any) {
+    MessagePlugin.warning(e.message);
+  }
+};
+
+const pencil = ref(false);
+const drawingPencil = () => {
+  try {
+    if (!meta2d.canvas.pencil) {
+      // 开了铅笔需要关掉钢笔
+      meta2d.canvas.drawingLineName && drawPen();
+      meta2d.drawingPencil();
+    } else {
+      meta2d.stopPencil();
+    }
+    pencil.value = meta2d.canvas.pencil || false;
+  } catch (e: any) {
+    MessagePlugin.warning(e.message);
+  }
+};
+
+const magnifier = ref(false);
+export const showMagnifier = () => {
+  if (!meta2d.canvas.magnifierCanvas.magnifier) {
+    meta2d.showMagnifier();
+  } else {
+    meta2d.hideMagnifier();
+  }
+  magnifier.value = meta2d.canvas.magnifierCanvas.magnifier;
+};
+
+const map = ref(false);
+export const showMap = () => {
+  if (!meta2d.map?.isShow) {
+    meta2d.showMap();
+  } else {
+    meta2d.hideMap();
+  }
+  map.value = meta2d.map?.isShow;
+};
+
+export const title = "系统可能不会保存您所做的更改,是否继续?";
+export const newFile = async () => {
+  if (dot.value) {
+    if (await showNotification(title)) {
+      newfile(false);
+    }
+  } else {
+    newfile(false);
+  }
+};
+
+export const onScaleWindow = () => {
+  // meta2d.fitView();
+  meta2d.fitSizeView(true, 32);
+};
+
+export const onScaleView = () => {
+  meta2d.scale(1);
+  // meta2d.centerView();
+  const { x, y, origin, center } = meta2d.store.data;
+
+  meta2d.translate(-x - origin.x, -y - origin.y);
+  meta2d.translate(meta2d.store.options.x || 0, meta2d.store.options.y || 0);
+};
+
+export const newfile = async (noRouter: boolean = false) => {
+  meta2d.canvas.drawingLineName && drawPen();
+  meta2d.canvas.pencil && drawingPencil();
+  meta2d.canvas.magnifierCanvas.magnifier && showMagnifier();
+  meta2d.map?.isShow && showMap();
+  // setDot(false);
+  dot.value = false;
+  // await localforage.removeItem(localMeta2dDataName);
+  // 打开文件操作不跳转
+  // const router = useRouter();
+  console.log("router", router);
+  !noRouter &&
+    router.replace({
+      path: "/",
+      query: { r: Date.now() + "" },
+    });
+};

+ 7 - 306
src/views/components/Header.vue

@@ -288,6 +288,12 @@ import axios from "axios";
 import { switchTheme } from "@/services/theme";
 import { noLoginTip ,localMeta2dDataName} from "@/services/utils";
 import { useDot } from "@/services/common";
+import {
+  save,
+  newFile,
+  SaveType,
+  onScaleView,
+  onScaleWindow,showMagnifier,showMap,newfile,title}from "@/services/common";
 
 const router = useRouter();
 const route = useRoute();
@@ -297,7 +303,7 @@ const market = import.meta.env.VITE_MARKET;
 const baseUrl = import.meta.env.BASE_URL || "/";
 
 const { user, message, getUser, getMessage, signout } = useUser();
-
+const { dot } = useDot();
 const data = reactive({
   name: "空白文件",
 });
@@ -1012,311 +1018,6 @@ const helpList = [
   },
 ];
 </script>
-<script lang="ts">
-// import { noLoginTip } from "@/services/utils";
-
-const { user } = useUser();
-const route = useRoute();
-const router = useRouter();
-const { dot ,setDot} = useDot();
-
-export enum SaveType {
-  Save,
-  SaveAs,
-}
-export const save = async (type: SaveType = SaveType.Save, component?: boolean) => {
-  meta2d.stopAnimate();
-  const data: Meta2dBackData = meta2d.data();
-  if (!(user && user.username)) {
-    MessagePlugin.warning(noLoginTip);
-    localforage.setItem(localMeta2dDataName, JSON.stringify(data));
-    return;
-  }
-  checkData(data);
-  if (!data._id && route.query.id) {
-    data._id = route.query.id as string;
-  }
-
-  if (
-    (globalThis as any).beforeSaveMeta2d &&
-    !(await (globalThis as any).beforeSaveMeta2d(data))
-  ) {
-    return;
-  }
-  if (type === SaveType.SaveAs) {
-    //另存为去掉teams信息
-    delete data.teams;
-  }
-  //如果不是自己创建的团队图纸,就不去修改缩略图(没有权限去删除缩略图)
-  if (!((data as any).teams && data.owner?.id !== user.id)) {
-    let blob: Blob;
-    try {
-      blob = dataURLtoBlob(meta2d.toPng(10) + "");
-    } catch (e) {
-      MessagePlugin.error(
-        "无法下载,宽度不合法,画布可能没有画笔/画布大小超出浏览器最大限制"
-      );
-      return;
-    }
-    if (data._id && type === SaveType.Save) {
-      if (data.image && !(await delImage(data.image))) {
-        return;
-      }
-    }
-
-    const file = await upload(blob, true);
-    if (!file) {
-      return;
-    }
-
-    // 缩略图
-    data.image = file.url;
-    (meta2d.store.data as Meta2dBackData).image = data.image;
-  }
-
-  if (component) {
-    data.component = true;
-    // pens 存储原数据用于二次编辑 ; componentDatas 组合后的数据,用于复用
-    data.componentDatas = meta2d.toComponent(
-      undefined,
-      (meta2d.store.data as Meta2dBackData).showChild,
-      false //自定义组合节点生成默认锚点
-    );
-  } else {
-    data.component = false; // 必要值
-  }
-  let collection = data.component ? "le5le2d-components" : "le5le2d";
-  let ret: any;
-  if (!data.name) {
-    // 文件名称
-    data.name = `meta2d.${new Date().toLocaleString()}`;
-    (meta2d.store.data as Meta2dBackData).name = data.name;
-  }
-  !data.version && (data.version = baseVer);
-
-  let list = undefined;
-  let folder: any = undefined;
-  let folderId = undefined;
-  if (
-    !data.component &&
-    data.folder &&
-    !(data.teams && data.owner?.id !== user.id)
-  ) {
-    //自己的图纸才允许去请求
-    folder = getFolders({
-      type: collection,
-      name: data.folder,
-    });
-    if (folder) {
-      list = folder.list; //团队图纸文件夹
-      folderId = folder._id;
-    }
-  }
-  if (!list) {
-    list = [];
-  }
-
-  if (type === SaveType.SaveAs) {
-    // 另存为一定走 新增 ,由于后端 未控制 userId 等属性,清空一下
-    const delAttrs = [
-      "userId",
-      "id",
-      "shared",
-      "star",
-      "view",
-      "username",
-      "editorName",
-      "editorId",
-      "createdAt",
-      "updatedAt",
-      "recommend",
-    ];
-    for (const k of delAttrs) {
-      delete (data as any)[k];
-    }
-    ret = addCollection(collection, data); // 新增
-    if (!data.component) {
-      list.push({
-        id: ret._id,
-        image: data.image,
-        name: data.name,
-        component: data.component,
-      });
-    }
-  } else {
-    if (data._id && data.teams && data.owner?.id !== user.id) {
-      // 团队图纸 不允许修改文件夹信息
-      delete data.folder;
-      ret = updateCollection(collection, data);
-    } else if (data._id) {
-      ret = updateCollection(collection, data);
-      if (!data.component) {
-        list.forEach((i: any) => {
-          if (i.id === data._id) {
-            i.image = data.image;
-          }
-        });
-      }
-      //TODO 处理老接口图纸情况
-      let one = list.find((item: any) => item.id === data._id);
-      if (!data.component && !one) {
-        list.push({
-          id: ret._id,
-          image: data.image,
-          name: data.name,
-          component: data.component,
-        });
-      }
-    } else {
-      ret = addCollection(collection, data); // 新增
-      if (!data.component) {
-        list.push({
-          id: ret._id,
-          image: data.image,
-          name: data.name,
-          component: data.component,
-        });
-      }
-    }
-  }
-
-  if (ret.error) {
-    return null;
-  } else {
-    if (!data.component && folderId) {
-      const updateRet: any = updateFolders({
-        _id: folderId,
-        list,
-      });
-      if (updateRet.error) {
-        return null;
-      }
-    }
-    // showModelSaveAsPop.value = false;
-  }
-  //  保存图纸之后的钩子函数
-  (window as any).afterSaveMeta2d &&
-    (await (window as any).afterSaveMeta2d(ret));
-  if (
-    !data._id ||
-    data.owner?.id !== user.id ||
-    route.query.version ||
-    type === SaveType.SaveAs // 另存为肯定走新增,也会产生新的 id
-  ) {
-    data._id = ret._id;
-    (meta2d.store.data as Meta2dBackData)._id = data._id;
-    router.replace({
-      path: "/",
-      query: {
-        id: data._id,
-        r: Date.now() + "",
-        component: data.component + "",
-      },
-    });
-  }
-
-  MessagePlugin.success("保存成功!");
-  // 保存成功,重新请求文件夹
-  meta2d.emit("t-save-success", true);
-  // 已保存,不再是新的,无需提示保存
-  setDot(false);
-  localforage.removeItem(localMeta2dDataName);
-};
-const pen = ref(false);
-const drawPen = () => {
-  meta2d.inactive();
-  try {
-    if (!meta2d.canvas.drawingLineName) {
-      // 开了钢笔,需要关掉铅笔
-      meta2d.canvas.pencil && drawingPencil();
-      meta2d.drawLine(meta2d.store.options.drawingLineName);
-    } else {
-      meta2d.finishDrawLine();
-      meta2d.drawLine();
-    }
-    //钢笔
-    pen.value = !!meta2d.canvas.drawingLineName;
-  } catch (e: any) {
-    MessagePlugin.warning(e.message);
-  }
-};
-
-const pencil = ref(false);
-const drawingPencil = () => {
-  try {
-    if (!meta2d.canvas.pencil) {
-      // 开了铅笔需要关掉钢笔
-      meta2d.canvas.drawingLineName && drawPen();
-      meta2d.drawingPencil();
-    } else {
-      meta2d.stopPencil();
-    }
-    pencil.value = meta2d.canvas.pencil || false;
-  } catch (e: any) {
-    MessagePlugin.warning(e.message);
-  }
-};
-
-const magnifier = ref(false);
-const showMagnifier = () => {
-  if (!meta2d.canvas.magnifierCanvas.magnifier) {
-    meta2d.showMagnifier();
-  } else {
-    meta2d.hideMagnifier();
-  }
-  magnifier.value = meta2d.canvas.magnifierCanvas.magnifier;
-};
-
-const map = ref(false);
-const showMap = () => {
-  if (!meta2d.map?.isShow) {
-    meta2d.showMap();
-  } else {
-    meta2d.hideMap();
-  }
-  map.value = meta2d.map?.isShow;
-};
-
-const title = "系统可能不会保存您所做的更改,是否继续?";
-export const newFile = async () => {
-  if (dot.value) {
-    if (await showNotification(title)) {
-      newfile(false);
-    }
-  } else {
-    newfile(false);
-  }
-};
-
-export const onScaleWindow = () => {
-  // meta2d.fitView();
-  meta2d.fitSizeView(true,32);
-};
-
-export const onScaleView = () => {
-  meta2d.scale(1);
-  // meta2d.centerView();
-  const { x, y, origin ,center} = meta2d.store.data;
-
-  meta2d.translate(-x - origin.x, -y - origin.y);
-  meta2d.translate(meta2d.store.options.x||0,meta2d.store.options.y||0)
-};
-
-async function newfile(noRouter: boolean = false) {
-  meta2d.canvas.drawingLineName && drawPen();
-  meta2d.canvas.pencil && drawingPencil();
-  meta2d.canvas.magnifierCanvas.magnifier && showMagnifier();
-  meta2d.map?.isShow && showMap();
-  setDot(false);
-  // await localforage.removeItem(localMeta2dDataName);
-  // 打开文件操作不跳转
-  !noRouter &&
-    router.replace({
-      path: "/",
-      query: { r: Date.now() + "" },
-    });
-}
-</script>
 <style lang="postcss" scoped>
 .app-header {
   display: flex;

+ 7 - 7
src/views/components/View.vue

@@ -192,8 +192,7 @@ import {
   newFile,
   SaveType,
   onScaleView,
-  onScaleWindow,
-} from "./Header.vue";
+  onScaleWindow,}from "@/services/common";
 import { useSelection, SelectionMode } from "@/services/selections";
 import { defaultFormat } from "@/services/defaults";
 import { MessagePlugin } from "tdesign-vue-next";
@@ -207,6 +206,7 @@ const route = useRoute();
 const { user, message, getUser, getMessage, signout } = useUser();
 const { dot, setDot, getDot } = useDot();
 const { selections } = useSelection();
+console.log("router", router);
 
 const meta2dOptions: Options = {
   cdn,
@@ -246,8 +246,8 @@ const open = async () => {
   } else {
     meta2d.open();
   }
-  meta2d.store.data.x = meta2d.store.options.x;
-  meta2d.store.data.y = meta2d.store.options.y;
+  meta2d.store.data.x = meta2d.store.options.x||0;
+  meta2d.store.data.y = meta2d.store.options.y||0;
 };
 
 onUnmounted(() => {
@@ -402,7 +402,7 @@ const lineAdd = (pens: Pen[]) => {
   }
 };
 
-const onAddShape = (event: DragEvent, name: string) => {
+const onAddShape = (event: DragEvent|MouseEvent, name: string) => {
   let data: any;
   if (name === "text") {
     data = {
@@ -422,10 +422,10 @@ const onAddShape = (event: DragEvent, name: string) => {
       name: "line",
     };
   }
-  if (!event.dataTransfer) {
+  if (!(event as DragEvent).dataTransfer) {
     meta2d.canvas.addCaches = deepClone([data]);
   } else {
-    event.dataTransfer.setData("Meta2d", JSON.stringify(data));
+    (event as DragEvent).dataTransfer?.setData("Meta2d", JSON.stringify(data));
   }
   event.stopPropagation();
 };