1

src/views/Editor/CanvasCenter/index.vue

@@ -1,33 +1,34 @@
 <template>
-  <div 
-    ref="wrapperRef" 
-    @mousedown="addDrawAreaFocus"
-    v-contextmenu="contextMenus" 
-    v-click-outside="remDrawAreaFocus"
+  <div
+      ref="wrapperRef"
+      @mousedown="addDrawAreaFocus"
+      v-contextmenu="contextMenus"
+      v-click-outside="remDrawAreaFocus"
   >
     <canvas ref="canvasRef" class="background-grid"></canvas>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { storeToRefs } from 'pinia'
-import { onMounted, onUnmounted } from 'vue'
-import { useFabricStore, useMainStore, useTemplatesStore } from '@/store'
-import { useRouter } from 'vue-router'
-import { unzip } from "@/utils/crypto"
-import { getTemplateData } from '@/api/template'
-import { contextMenus } from '@/configs/contextMenu'
-import { initEditor } from '@/views/Canvas/useCanvas'
-import { initPixi } from '@/views/Canvas/usePixi'
-import { ElMessage, ElLoading } from 'element-plus'
+import {storeToRefs} from 'pinia'
+import {onMounted, onUnmounted} from 'vue'
+import {useFabricStore, useMainStore, useTemplatesStore} from '@/store'
+import {useRouter} from 'vue-router'
+import {unzip} from "@/utils/crypto"
+import {getTemplateData} from '@/api/template'
+import {contextMenus} from '@/configs/contextMenu'
+import {initEditor} from '@/views/Canvas/useCanvas'
+import {initPixi} from '@/views/Canvas/usePixi'
+import {ElMessage, ElLoading} from 'element-plus'
 import useCanvasHotkey from '@/hooks/useCanvasHotkey'
+
 const fabricStore = useFabricStore()
 const mainStore = useMainStore()
 const router = useRouter()
 const templatesStore = useTemplatesStore()
-const { wrapperRef, canvasRef } = storeToRefs(fabricStore)
-const { drawAreaFocus } = storeToRefs(mainStore)
-const { keydownListener, keyupListener, pasteListener } = useCanvasHotkey()
+const {wrapperRef, canvasRef} = storeToRefs(fabricStore)
+const {drawAreaFocus} = storeToRefs(mainStore)
+const {keydownListener, keyupListener, pasteListener} = useCanvasHotkey()
 
 
 const addDrawAreaFocus = () => {
@@ -46,8 +47,7 @@ const getTemplateDetail = async (pk: number) => {
       console.log('result.data.data.id:', result.data.data.id)
       const data = unzip(result.data.data.data)
       await templatesStore.changeTemplate(data)
-    } 
-    catch (error) {
+    } catch (error) {
       ElMessage({
         type: 'error',
         message: '模板加载失败,请联系管理员修改bug了',
@@ -59,7 +59,7 @@ const getTemplateDetail = async (pk: number) => {
 const initRouter = async (templateId?: number) => {
   if (templateId) {
     templatesStore.setTemplateId(templateId)
-    const loadingInstance = ElLoading.service({ fullscreen: true, background: 'rgba(122, 122, 122, 0.5)' })
+    const loadingInstance = ElLoading.service({fullscreen: true, background: 'rgba(122, 122, 122, 0.5)'})
     await getTemplateDetail(templateId)
     nextTick(() => loadingInstance.close())
   }
@@ -90,14 +90,14 @@ onUnmounted(() => {
   height: 100%;
   width: 100%;
 }
+
 .background-grid {
   --offsetX: 0px;
   --offsetY: 0px;
   --size: 8px;
   --color: #dedcdc;
-  background-image: 
-    linear-gradient(45deg, var(--color) 25%, transparent 0, transparent 75%, var(--color) 0), 
-    linear-gradient(45deg, var(--color) 25%, transparent 0, transparent 75%, var(--color) 0);
+  background-image: linear-gradient(45deg, var(--color) 25%, transparent 0, transparent 75%, var(--color) 0),
+  linear-gradient(45deg, var(--color) 25%, transparent 0, transparent 75%, var(--color) 0);
   background-position: var(--offsetX) var(--offsetY), calc(var(--size) + var(--offsetX)) calc(var(--size) + var(--offsetY));
   background-size: calc(var(--size) * 2) calc(var(--size) * 2);
 }

src/views/Editor/CanvasLeft/Label/index.vue

@@ -2,9 +2,9 @@
   <div>
     <div class="left-top-tabs" id="left-top-tabs">
       <div class="top-tab">
-        <el-tooltip placement="top" :hide-after="0" content="首页">
-          <IconHome class="handler-item" @click="goHome"/>
-        </el-tooltip>
+<!--        <el-tooltip placement="top" :hide-after="0" content="首页">-->
+<!--          <IconHome class="handler-item" @click="goHome"/>-->
+<!--        </el-tooltip>-->
       </div>
     </div>
     <div class="left-bottom-tabs">
@@ -60,11 +60,11 @@ interface TabItem {
 
 const topTabs: TabItem[] = [
   { key: "editor", label: "message.edit", icon: `editor`, index: 0 },
-  { key: "template", label: "message.template", icon: `template`, index: 1 },
+  // { key: "template", label: "message.template", icon: `template`, index: 1 },
   { key: "material", label: "message.material", icon: `material`, index: 2 },
   { key: "text", label: "message.text", icon: "text", index: 3 },
   { key: "image", label: "message.image", icon: "picture", index: 4 },
-  { key: "toolkit", label: "message.tool", icon: "toolkit", index: 5 },
+  // { key: "toolkit", label: "message.tool", icon: "toolkit", index: 5 },
   // { key: "chatgpt", label: "message.chatgpt", icon: "chatgpt", index: 6 },
 ];
 

src/views/Editor/CanvasLeft/index.vue

@@ -2,7 +2,7 @@
   <div class="flex">
     <Label class="w-[50px] h-[100vh] z-10 bg-[#fff]" />
     <Menu />
-    <Thumb class="w-[160px] h-full flex flex-shrink-0 bg-[#fff] flex-col select-none" />
+<!--    <Thumb class="w-[160px] h-full flex flex-shrink-0 bg-[#fff] flex-col select-none" />-->
   </div>
 </template>
 

src/views/Editor/computer.vue

@@ -15,7 +15,7 @@
         <CanvasCenter class="center-body" />
         <!-- <CanvasFooter class="center-footer h-[40px] relative leading-1.5 flex justify-between" /> -->
         <CanvasAffix  class="center-affix"/>
-        <CanvasICP />
+<!--        <CanvasICP />-->
       </div>
       <CanvasRight class="layout-content-right h-full w-[260px] bg-[#fff] flex flex-col" />
       <CanvasDom class="absolute -z-[200] -left-[300px]" />
@@ -41,7 +41,7 @@ import CanvasTour from "./CanvasTour/index.vue";
   height: calc(100% - 40px);
 }
 .layout-content-center {
-  width: calc(100% - 50px - 160px - 260px);
+  width: calc(100% - 50px /*- 160px*/ - 260px);
 
   .center-header {
     // border-left: 1px solid $borderColor;

vite.config.mts

@@ -10,12 +10,12 @@ export default ({ command, mode }: ConfigEnv): UserConfigExport => {
   return {
     base: "./", // publicPath
     server: {
-      host: '127.0.0.1',
-      port: 5173,
+      host: '0.0.0.0',
+      port: 9191,
       proxy: {
         '/api': {
           // target: 'https://yft.design',
-          target: 'http://127.0.0.1:8789',
+          target: 'http://192.168.1.44:9991',
           changeOrigin: true,
           rewrite: (path) => path.replace(new RegExp('^'), ''),
         },