JS-Encoder · Longgererer · Jun 19, 2024 · Jun 18, 2024 · Jun 19, 2024 · Jun 19, 2024
diff --git a/chunks.conf.ts b/chunks.conf.ts
@@ -21,7 +21,7 @@ const compileChunk = [
 const pluginChunk = [
   "eslint4b-prebuilt", "@typescript/vfs", "hash-sum", "htmlhint", "stylelint",
   "stylelint-config-recommended-less", "stylelint-config-standard", "stylelint-config-standard-scss",
-  "jszip", "stylelint-config-standard-vue",
+  "jszip", "stylelint-config-standard-vue", "fflate",
 ]
 
 const prettierChunk = [

diff --git a/index.html b/index.html
@@ -8,7 +8,7 @@
     <title>前端在线编辑器 - JS-Encoder</title>
 
     <!-- start style -->
-    <link rel="stylesheet" href="https://at.alicdn.com/t/c/font_3456619_6bitfvodcg4.css?spm=a313x.manage_type_myprojects.i1.9.61bd3a81NyE75B&file=font_3456619_6bitfvodcg4.css">
+    <link rel="stylesheet" href="https://at.alicdn.com/t/c/font_3456619_2k8fb4xh66s.css?spm=a313x.manage_type_myprojects.i1.9.51003a81OLGjSm&file=font_3456619_2k8fb4xh66s.css">
     <link rel="icon" href="/favicon.ico" />
     <!-- font -->
     <link rel="preconnect" href="https://fonts.googleapis.com">

diff --git a/package.json b/package.json
@@ -48,6 +48,7 @@
     "eslint4b-prebuilt": "^6.7.2",
     "espree": "^10.0.1",
     "estraverse": "^5.3.0",
+    "fflate": "^0.8.2",
     "hash-sum": "^2.0.0",
     "highlight.js": "^11.9.0",
     "htmlhint": "^1.1.4",
@@ -99,6 +100,7 @@
     "unplugin-vue-define-options": "^1.4.1",
     "vite": "^5.0.11",
     "vite-plugin-compression": "^0.5.1",
+    "vite-plugin-remove-console": "^2.2.0",
     "vite-plugin-require-transform": "^1.0.21",
     "vue-tsc": "^1.8.27"
   }

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/components/icon-btn/icon-btn.vue b/src/components/icon-btn/icon-btn.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     class="fade-ease cursor-pointer flex-center"
-    :class="`${namespace} ${namespace}-${size}`"
+    :class="`${namespace} ${namespace}-${size} ${customClass}`"
     :style="{
       ...(highlight ? highlightStyle : null),
       '--hover-bg': hoverBg,
@@ -10,7 +10,7 @@
     @click="emits('click')">
     <div :class="size2ClassMap[size]">
       <slot v-if="$slots.default"></slot>
-      <i v-else class="icon iconfont font-inherit" :class="iconClass"></i>
+      <i v-else class="icon iconfont font-inherit inline-block" :class="iconClass"></i>
     </div>
   </div>
 </template>
@@ -28,6 +28,7 @@ interface IProps {
   highlight?: boolean
   highlightStyle?: AnyObject
   hoverBg?: string
+  customClass?: string
 }
 withDefaults(defineProps<IProps>(), {
   size: IconBtnSize.MD,

diff --git a/src/env.d.ts b/src/env.d.ts
@@ -2,7 +2,6 @@
 
 declare module "*.vue" {
   import type { DefineComponent } from "vue"
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
   const component: DefineComponent<{}, {}, any>
   export default component
 }
@@ -25,3 +24,9 @@ declare interface Window {
   hljs: GlobalType.hljs
 }
 
+/**
+ * vite define
+ */
+
+/** app版本 */
+declare const APP_VERSION: string
diff --git a/src/hooks/use-instance-link.ts b/src/hooks/use-instance-link.ts
@@ -0,0 +1,31 @@
+import { ITemplateBase } from "@type/template"
+import { safeJSONParse } from "@utils/tools/common"
+import { unzipString, zipString } from "@utils/tools/string"
+
+const useInstanceLink = () => {
+
+  /** 将路由中的config参数解压缩，解码 */
+  const getInstanceConfig = (data: string = ""): ITemplateBase | null => {
+    if (!data) { return null }
+    const configStr = parseInstanceConfig(data)
+    return safeJSONParse(configStr, null)
+  }
+
+  /** 字符串解压缩，解码 */
+  const parseInstanceConfig = (data: string = ""): string => {
+    return unzipString(window.atob(decodeURIComponent(data)))
+  }
+
+  /** 将字符串压缩，编码 */
+  const stringifyInstanceConfig = (config: ITemplateBase) => {
+    return encodeURIComponent(window.btoa(zipString(JSON.stringify(config))))
+  }
+
+  return {
+    getInstanceConfig,
+    parseInstanceConfig,
+    stringifyInstanceConfig,
+  }
+}
+
+export default useInstanceLink
diff --git a/src/type/template.ts b/src/type/template.ts
@@ -18,18 +18,22 @@ export const enum TemplateType {
   CUSTOM = "custom",
 }
 
-/** 模板内容 */
-export interface ITemplate {
-  /** 模板语言 */
-  lang: TemplateLang
-  /** 模板类型 */
-  type: TemplateType
+/** 模板基础配置 */
+export interface ITemplateBase {
   /** 代码 */
   codeMap: Partial<Record<OriginLang, string>>
   /** 编辑器配置 */
   editorConfig: DeepPartial<Pick<IEditorConfig, "libraries" | "prepMap">>
   /** 是否为组件 */
   isComponent?: boolean
+}
+
+/** 模板内容 */
+export interface ITemplate extends ITemplateBase {
+  /** 模板语言 */
+  lang: TemplateLang
+  /** 模板类型 */
+  type: TemplateType
   /** 模板名 */
   name?: string
 }
diff --git a/src/utils/tools/index.ts b/src/utils/tools/index.ts
@@ -48,7 +48,7 @@ export const getObjEntries = (obj: any): Array<{ key: any, value: any }> => {
           result.push({ key, value: obj[key] })
         })
       } catch (error) {
-        console.log(error)
+        console.error(error)
       }
     }
   }

diff --git a/src/utils/tools/string.ts b/src/utils/tools/string.ts
@@ -0,0 +1,37 @@
+import { strFromU8, strToU8, unzlibSync, zlibSync } from "fflate"
+
+/** 压缩字符串 */
+export const zipString = (data: string) => {
+  const buffer = strToU8(data)
+  const zipped = zlibSync(buffer, { level: 9 })
+  const binary = strFromU8(zipped, true)
+  return binary
+}
+
+/** 解压字符串 */
+export const unzipString = (data: string) => {
+  if (!data.startsWith("\x78\xDA")) { return data }
+  const buffer = strToU8(data, true)
+  const unzipped = unzlibSync(buffer)
+  return strFromU8(unzipped)
+}
+
+/** copy字符串，兼容http */
+export const copyString = (content: string = "") => {
+  if (navigator?.clipboard) {
+    return navigator.clipboard.writeText(String(content))
+  } else {
+    return new Promise<void>((resolve, reject) => {
+      const copyInput = document.createElement("input")
+      document.body.append(copyInput)
+      copyInput.setAttribute("value", String(content))
+      copyInput.select()
+      if (document.execCommand("copy")) {
+        resolve()
+      } else {
+        reject()
+      }
+      document.body.removeChild(copyInput)
+    })
+  }
+}