修复材质加载与导出

2025-05-27 16:54:25 +08:00 · 2025-05-27 16:54:25 +08:00 · 16fac2ab19
commit 16fac2ab19
parent a1a541fff0
8 changed files with 50 additions and 197 deletions
--- a/package.json
+++ b/package.json
@ -29,7 +29,6 @@
  "dependencies": {
    "@jscad/modeling": "^2.11.0",
    "csstype": "^3.1.3",
-    "fflate": "^0.8.2",
    "flatbush": "^3.3.0",
    "js-angusj-clipper": "^1.2.1",
    "pako": "^1.0.11",
@ -37,11 +36,12 @@
    "polylabel": "^1.1.0",
    "three": "npm:three-cf@^0.122.9",
    "vue": "^3.5.13",
-    "webcad_ue4_api": "http://gitea.cf/cx/webcad-ue4-api/archive/3.20.0.tar.gz",
+    "webcad_ue4_api": "http://gitea.cf/cx/webcad-ue4-api/archive/3.26.0.tar.gz",
    "xaop": "^2.0.0"
  },
  "devDependencies": {
    "@types/node": "^22.14.1",
+    "@types/pako": "1.0.3",
    "@vitejs/plugin-vue": "^5.2.3",
    "@vue/tsconfig": "^0.7.0",
    "sass-embedded": "^1.87.0",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -14,9 +14,6 @@ importers:
      csstype:
        specifier: ^3.1.3
        version: 3.1.3
-      fflate:
-        specifier: ^0.8.2
-        version: 0.8.2
      flatbush:
        specifier: ^3.3.0
        version: 3.3.1
@ -39,8 +36,8 @@ importers:
        specifier: ^3.5.13
        version: 3.5.13(typescript@5.7.3)
      webcad_ue4_api:
-        specifier: http://gitea.cf/cx/webcad-ue4-api/archive/3.20.0.tar.gz
-        version: http://gitea.cf/cx/webcad-ue4-api/archive/3.20.0.tar.gz
+        specifier: http://gitea.cf/cx/webcad-ue4-api/archive/3.26.0.tar.gz
+        version: http://gitea.cf/cx/webcad-ue4-api/archive/3.26.0.tar.gz
      xaop:
        specifier: ^2.0.0
        version: 2.1.0
@ -48,6 +45,9 @@ importers:
      '@types/node':
        specifier: ^22.14.1
        version: 22.14.1
+      '@types/pako':
+        specifier: 1.0.3
+        version: 1.0.3
      '@vitejs/plugin-vue':
        specifier: ^5.2.3
        version: 5.2.3(vite@6.2.6(@types/node@22.14.1)(sass-embedded@1.87.0))(vue@3.5.13(typescript@5.7.3))
@ -412,6 +412,9 @@ packages:
  '@types/node@22.14.1':
    resolution: {integrity: sha512-u0HuPQwe/dHrItgHHpmw3N2fYCR6x4ivMNbPHRkBVP4CvN+kiRrKHWk3i8tXiO/joPwXLMYvF9TTF0eqgHIuOw==}

+  '@types/pako@1.0.3':
+    resolution: {integrity: sha512-EDxOsHAD5dqjbjEUM1xwa7rpKPFb8ECBE5irONTQU7/OsO3thI5YrNEWSPNMvYmvFM0l/OLQJ6Mgw7PEdXSjhg==}
+
  '@vitejs/plugin-vue@5.2.3':
    resolution: {integrity: sha512-IYSLEQj4LgZZuoVpdSUCw3dIynTWQgPlaRP6iAvMle4My0HdYwr5g5wQAfwOeHQBmYwEkqF70nRpSilr6PoUDg==}
    engines: {node: ^18.0.0 || >=20.0.0}
@ -599,9 +602,6 @@ packages:
  fast-deep-equal@3.1.3:
    resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}

-  fflate@0.8.2:
-    resolution: {integrity: sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==}
-
  flatbush@3.3.1:
    resolution: {integrity: sha512-oKuPbtT+DS2CxH+9Vhbsq8HifmSCuOw+3Cy5zt/vCIrZl5KyengoTHDBLmtpZoBhcwa7/biNjgL1DwdLMJYm1A==}

@ -1051,9 +1051,9 @@ packages:
      typescript:
        optional: true

-  webcad_ue4_api@http://gitea.cf/cx/webcad-ue4-api/archive/3.20.0.tar.gz:
-    resolution: {tarball: http://gitea.cf/cx/webcad-ue4-api/archive/3.20.0.tar.gz}
-    version: 0.3.19
+  webcad_ue4_api@http://gitea.cf/cx/webcad-ue4-api/archive/3.26.0.tar.gz:
+    resolution: {tarball: http://gitea.cf/cx/webcad-ue4-api/archive/3.26.0.tar.gz}
+    version: 0.3.20

  xaop@2.1.0:
    resolution: {integrity: sha512-/ovWCaQIet3a3VnoVeN1/pNPqCrS/JifF28N7crPhq8BXEWx4Da2o+LYCCxnTWGAjGp5+2W2hd0HIpVESounSQ==}
@ -1302,6 +1302,8 @@ snapshots:
    dependencies:
      undici-types: 6.21.0

+  '@types/pako@1.0.3': {}
+
  '@vitejs/plugin-vue@5.2.3(vite@6.2.6(@types/node@22.14.1)(sass-embedded@1.87.0))(vue@3.5.13(typescript@5.7.3))':
    dependencies:
      vite: 6.2.6(@types/node@22.14.1)(sass-embedded@1.87.0)
@ -1532,8 +1534,6 @@ snapshots:

  fast-deep-equal@3.1.3: {}

-  fflate@0.8.2: {}
-
  flatbush@3.3.1:
    dependencies:
      flatqueue: 1.2.1
@ -1906,7 +1906,7 @@ snapshots:
    optionalDependencies:
      typescript: 5.7.3

-  webcad_ue4_api@http://gitea.cf/cx/webcad-ue4-api/archive/3.20.0.tar.gz: {}
+  webcad_ue4_api@http://gitea.cf/cx/webcad-ue4-api/archive/3.26.0.tar.gz: {}

  xaop@2.1.0: {}

--- a/src/common/MaterialSerializer.ts
+++ b/src/common/MaterialSerializer.ts
@ -1,4 +1,4 @@
-import { CADFactory, CADFiler, CADObject, Database, DuplicateRecordCloning, Factory, LayerNode, ObjectId, PhysicalMaterialRecord } from "webcad_ue4_api";
+import {  CADFiler, CADObject, Database, DuplicateRecordCloning, Factory, LayerNode, ObjectId, PhysicalMaterialRecord } from "webcad_ue4_api";

 // TODO: Danger: 注意入侵性代码
 // 疑似是WebCAD中的漏洞，当传入new Database()时，
--- a/src/components/MaterialAdjuster.vue
+++ b/src/components/MaterialAdjuster.vue
@ -6,12 +6,15 @@
                <legend>DEBUG</legend>
                <label>上传路径ID</label>
                <input v-model="materialInfo.dirId" type="text" placeholder="材质路径ID" />
+                <label>配置JSON</label>
+                <input v-model="materialInfo.inputText" type="text"  />
+                <button class="btn-success" style="min-width: 110px;" @click="loadData">加载</button>
            </fieldset>
            <label>材质名</label>
            <input v-model.trim="materialInfo.materialName" type="text" placeholder="材质名" />

            <CfFlex gap="1em" v-if="debugMode">
-                <button class="btn-success" style="min-width: 110px;" @click="HandleUpload">上传</button>
+                <button class="btn-success" style="min-width: 110px;" @click="HandleUpload">保存</button>
                <button class="btn-danger" style="min-width: 110px;" @click="HandleCancel">取消</button>
            </CfFlex>
        </div>
@ -111,8 +114,8 @@ import { storeToRefs } from "pinia";
 import CfFlex from "./CfFlex.vue";
 import { DirectoryId } from "../api/Request";
 import { IsNullOrWhitespace } from "../helpers/helper.string";
-import { DeflateAsync } from "../helpers/helper.compression";
-import { ToDeflatedBase64 } from "../helpers/helper.material";
+import { FromDeflateBase64, ToDeflatedBase64 } from "../helpers/helper.material";
+import { MaterialIn } from "../common/MaterialSerializer";

 export interface MaterialRequest {
    /** 材质名 */
@ -133,7 +136,7 @@ const emits = defineEmits<{
    (e: 'submit', data: MaterialRequest): void; 
 }>();

-const debugMode = ref(false);
+const debugMode = ref(true);
 const { CurrGeometry, Geometries, Material } = storeToRefs(scene);
 const enableTexture = ref(Material.value.useMap);
 const _textureSrc = ref(props.textureSrc);
@ -155,7 +158,8 @@ const model = reactive({
 });
 const materialInfo = reactive({
    dirId: DirectoryId.MaterialDir, // 正常来说是2
-    materialName: '材质1'
+    materialName: '材质1',
+    inputText:'',
 });

 onMounted(() => {
@ -220,6 +224,14 @@ async function EnableTexture(enable: boolean) {
    await scene.UpdateMaterialAsync();
 }

+async function loadData() {
+    if(!materialInfo.inputText) return;
+    const json = JSON.parse(materialInfo.inputText);
+    const cadFile = FromDeflateBase64(json.file);
+    MaterialIn(JSON.parse(cadFile));
+    
+}
+
 async function HandleUpload() {
    try {
        if (IsNullOrWhitespace(materialInfo.materialName)) {
@ -250,6 +262,7 @@ defineExpose({
    Cancel: HandleCancel
 })

+
 </script>

 <style scoped>
--- a/src/helpers/helper.compression.ts
+++ b/src/helpers/helper.compression.ts
@ -1,155 +0,0 @@
-import * as fflate from 'fflate'
-
-/**
- * 使用deflate算法压缩文件
- * @param data 
- */
-export function Deflate(data: Uint8Array | string): Uint8Array {
-    if (typeof data === 'string')
-        data = StrToU8(data);
-    return fflate.deflateSync(data);
-}
-
-/**
- * 异步地使用deflate算法压缩文件
- * @param data 
- */
-export function DeflateAsync(data: Uint8Array | string): Promise<Uint8Array> {
-    if (typeof data === 'string')
-        data = StrToU8(data);
-    return new Promise<Uint8Array>((resolve, reject) => {
-        const termiante = fflate.deflate(data as Uint8Array, (err, result) => {
-            if (err)
-                reject(err.message);
-            else
-                resolve(result);
-        })
-    })
-}
-
-
-/**
- * 使用Zlib压缩文件
- * @param data 
- */
-export function Zlib(data: Uint8Array | string): Uint8Array {
-    if (typeof data === "string")
-        data = fflate.strToU8(data);
-    return fflate.zlibSync(data);
-}
-
-/**
- * 异步地使用Zlib压缩文件
- * @param data 
- */
-export async function ZlibAsync(data: Uint8Array | string): Promise<Uint8Array> {
-    if (typeof data === 'string')
-        data = StrToU8(data);
-    return new Promise<Uint8Array>((resolve, reject) => {
-        const terminate = fflate.zlib(data as Uint8Array, (err, result) => {
-            if (err)
-                reject(err.message);
-            else
-                resolve(result);
-        });
-
-    })
-}
-
-/**
- * 创建zip文件
- * @param data Zip格式对象
- */
-export function Zip(data: fflate.Zippable): Uint8Array {
-    return fflate.zipSync(data);
-}
-
-/**
- * 异步地创建zip文件
- * @param data Zip格式对象
- */
-export async function ZipAsync(data: fflate.Zippable): Promise<Uint8Array> {
-    return new Promise<Uint8Array>((resolve, reject) => {
-        const terminate = fflate.zip(data, (err, result) => {
-            if (err)
-                reject(err.message);
-            else
-                resolve(result);
-        });
-    });
-}
-
-/**
- * 解压Zip文件
- * @param data 
- */
-export function Unzip(data: Uint8Array): fflate.Unzipped {
-    return fflate.unzipSync(data);
-}
-
-/**
- * 异步地解压Zip文件
- * @param data 
- */
-export function UnzipAsync(data: Uint8Array): Promise<fflate.Unzipped> {
-    return new Promise<fflate.Unzipped>((resolve, reject) => {
-        const terminate = fflate.unzip(data, (err, result) => {
-            if (err)
-                reject(err.message);
-            else
-                resolve(result);
-        })
-    });
-}
-
-/**
- * 解压缩文件，支持GZip，Zlib或DEFLATE数据
- * @param data 
- */
-export function Decompress(data: Uint8Array): string | undefined {
-    // decompressSync 存在eof问题
-    let stringData: string | undefined = undefined;
-    const utfDecode = new fflate.DecodeUTF8((data) => {
-        stringData = data;
-    });
-    const dcmpStrm = new fflate.Decompress((chunk, final) => {
-        utfDecode.push(chunk, final);
-    });
-    try {
-        dcmpStrm.push(data);
-    } catch (error) {
-        console.log(error)
-    }
-    return stringData;
-}
-
-/**
- * 异步地解压缩文件，支持GZip，Zlib或DEFLATE数据
- * @param data 
- */
-export async function DecompressAsync(data: Uint8Array, size: number | undefined = undefined): Promise<Uint8Array> {
-    return new Promise<Uint8Array>((resolve, reject) => {
-        const terminate = fflate.decompress(data, { size: size }, (err, result) => {
-            if (err)
-                reject(err.message);
-            else
-                resolve(result);
-        });
-    })
-}
-
-/**
- * 将字符串转换为8位无符号整型数组
- * @param str 
- */
-export function StrToU8(str: string): Uint8Array {
-    return fflate.strToU8(str);
-}
-
-/**
- * 将8位无符号整形数组转换为字符串
- * @param u8arr 
- */
-export function U8ToStr(u8arr: Uint8Array): string {
-    return fflate.strFromU8(u8arr);
-}
--- a/src/helpers/helper.material.ts
+++ b/src/helpers/helper.material.ts
@ -1,9 +1,10 @@
 import Pako from "pako";
-import { Decompress, DecompressAsync, Deflate, DeflateAsync, StrToU8, U8ToStr } from "./helper.compression";

 export function ToDeflatedBase64(materialJson: string)
 {
-    return btoa(String.fromCharCode(...Deflate(materialJson)))
+    // return btoa(String.fromCharCode(...Deflate(materialJson)))
+    const bin = Pako.deflate(materialJson,{to:"string"});
+    return btoa(bin); 
 }

 export function FromDeflateBase64(base64: string) {
--- a/src/lib/entry.ts
+++ b/src/lib/entry.ts
@ -6,8 +6,8 @@ import { createPinia, disposePinia } from 'pinia';
 import { ConfigureLibOutput, type LibOutputConfig } from './libOutputConfig';
 import { useEvent } from '../stores/eventStore';
 import { useScene, useSceneRaw } from '../stores/sceneStore';
-import { DeflateAsync } from '../helpers/helper.compression';
-import { CADFactory, Factory, LayerNode } from 'webcad_ue4_api';
+import { CADFactory, LayerNode, PhysicalMaterialRecord, TextureTableRecord } from 'webcad_ue4_api';
+import { ToDeflatedBase64 } from '../helpers/helper.material';

 let app: VueApp<Element> = undefined;

@ -16,15 +16,17 @@ let app: VueApp<Element> = undefined;
 *  @param element 要挂载的HTML元素
 * @param options 程序配置
 */
-export function Mount(element: Element, options: Partial<LibOutputConfig>) {
-    ConfigureLibOutput(options);
+export function Mount(element: string | Element, options?: Partial<LibOutputConfig>) {
+    options && ConfigureLibOutput(options);

    const pinia = createPinia();

    // TODO: Warn: 有BUG，部分实体的构造函数名带_1后缀，原因未知，这会导致CADFactory在创建实体时找不到注册的类名
    // @ts-ignore
-    // console.log(CADFactory.factory.objectNameMap); // 为什么Map中的构造函数名带_1后缀？
+    console.log(CADFactory['factory'].objectNameMap); // 为什么Map中的构造函数名带_1后缀？
    CADFactory.RegisterObjectAlias(LayerNode, "LayerNode");
+    CADFactory.RegisterObjectAlias(TextureTableRecord, "TextureTableRecord");
+    CADFactory.RegisterObjectAlias(PhysicalMaterialRecord, "PhysicalMaterialRecord");

    app = createApp(App);
    app.use(pinia)
@ -52,8 +54,7 @@ export function UpdateTexture() {
    useEvent().Publish('update-texture');
 }

-export async function SubmitRawAsync(options: { textureSrc: string }): Promise<{ file: string }>
-{
+export async function SubmitRawAsync(options: { textureSrc: string }): Promise<{ file: string }> {
    let pinia = createPinia();
    const scene = useSceneRaw(pinia);

@ -61,7 +62,7 @@ export async function SubmitRawAsync(options: { textureSrc: string }): Promise<{
    virtualDom.style.display = 'none';
    scene.Initial(virtualDom);
    await scene.ChangeTextureFromUrlAsync(options.textureSrc);
-    var json = btoa(String.fromCharCode(...await DeflateAsync(await scene.SerializeMaterialAsync())));
+    var json = ToDeflatedBase64(await scene.SerializeMaterialAsync());

    scene.Dispose();
    virtualDom.remove();
--- a/src/main.ts
+++ b/src/main.ts
@ -1,12 +1,5 @@
-import { createApp } from 'vue'
-
-import App from './App.vue'
 import './assets/main.css'
-import { createPinia } from 'pinia';
+import { Mount } from './lib';

-const pinia = createPinia();
-
-createApp(App)
-    .use(pinia)
-    .mount('#app')
+Mount("#app");