更新输入参数，输入纹理链接时需指定材质名

package.json

@@ -1,7 +1,7 @@
 {
   "name": "material-editor",
   "private": true,
-  "version": "1.0.26",
+  "version": "1.0.27",
   "type": "module",
   "scripts": {
     "dev": "vite",

src/components/MaterialAdjuster.vue

@@ -135,7 +135,7 @@ const { Material, CurrGeometry, Geometries } = storeToRefs(scene);
 
 const props = defineProps<{
     name?: string;
-    textureSrcList?: string[];
+    textures?: {name: string, src: string}[];
     /** 忽略纹理参数，提交时直接输出场景内的材质，用于某些在组件外对场景进行编辑的特殊情况（例如材质编辑模式） */
     ignoreTexture?: boolean;
 }>();
@@ -144,8 +144,8 @@ const emits = defineEmits<{
     (e: 'submit', data: MaterialRequest[]): void;
 }>();
 
-const debugMode = ref(false);
+const debugMode = ref(true);
-const textureSrc = computed(() => props.textureSrcList || []);
+const Textures = computed(() => props.textures || []);
 const debugTextureSrc = ref("");
 const textureAdjustment = ref<TextureAdjustment>({
     wrapS: MirroredRepeatWrapping,
@@ -202,9 +202,9 @@ const materialInfo = reactive({
     inputText: '',
 });
 
-watch(textureSrc, async (val) => {
+watch(Textures, async (val) => {
     if (val.length == 0) return;
-    await scene.ChangeTextureFromUrlAsync(val[0]);
+    await scene.ChangeTextureFromUrlAsync(val[0].src);
 });
 
 watch(() => props.name, () => {
@@ -261,7 +261,9 @@ async function HandleUpload() {
         uploading.value = true;
         const result = [];
         if (props.ignoreTexture) {
-            // 直接将材质序列化
+            // 注意更改材质内部名称
+            Material.value.Name = materialInfo.materialName;
+            // 将材质序列化
             const mat = {
                 name: materialInfo.materialName,
                 logo: await scene.GenerateMaterialLogoAsync(),
@@ -272,11 +274,13 @@ async function HandleUpload() {
         }
         else {
             // 遍历纹理链接列表，更改纹理后将材质序列化，然后还原场景
-            let idx = 0;
+            for (const texture of Textures.value) {
-            for (const src of textureSrc.value) {
+                // 注意更改材质内部名称
-                await scene.ChangeTextureFromUrlAsync(src);
+                Material.value.Name = texture.name;
+                // 更新纹理
+                await scene.ChangeTextureFromUrlAsync(texture.src);
                 const mat = {
-                    name: textureSrc.value.length > 1 ? materialInfo.materialName + ++idx : materialInfo.materialName,
+                    name: texture.name,
                     logo: await scene.GenerateMaterialLogoAsync(),
                     // jsonString -> Deflate -> BinaryString -> Base64
                     file: ToDeflatedBase64(await scene.SerializeMaterialAsync())
@@ -285,7 +289,8 @@ async function HandleUpload() {
             }
         }
 
-        await scene.ChangeTextureFromUrlAsync(textureSrc.value[0]);
+        // 还原场景纹理
+        await scene.ChangeTextureFromUrlAsync(Textures.value[0].src);
         emits('submit', result);
         return result;
     } finally {

src/components/MaterialView.vue

@@ -1,7 +1,7 @@
 <template>
     <CfFlex class="material-view">
         <div ref="container" class="material-view-container" />
-        <MaterialAdjuster ref="adjuster" class="material-view-sider" :name="matName" :textureSrcList="textureSrc" :ignore-texture="editMode"
+        <MaterialAdjuster ref="adjuster" class="material-view-sider" :name="matName" :textures="textures" :ignore-texture="editMode"
             @cancel="config.cancelCallback" @submit="config.submitCallback" />
     </CfFlex>
 </template>
@@ -19,7 +19,7 @@ const eventbus = useEvent();
 const container = useTemplateRef('container');
 const adjusterRef = useTemplateRef('adjuster');
 const config = GetConfig();
-const textureSrc = ref<string[]>(Array.from(config.textureSrc));
+const textures = ref<{name: string, src: string}[]>(Array.from(config.textures));
 const matName = ref<string>();
 const editMode = ref(false);
 
@@ -45,7 +45,7 @@ function HandleUpload() {
 }
 
 function HandleChangeTexture() {
-    textureSrc.value = Array.from(config.textureSrc);
+    textures.value = Array.from(config.textures);
 }
 
 async function HandleUpdateConfig() {
@@ -56,9 +56,9 @@ async function HandleUpdateConfig() {
         editMode.value = true;
     }
     else { editMode.value = false; }
-    if (config.textureSrc) {
+    if (config.textures) {
-        textureSrc.value = Array.from(config.textureSrc);
+        textures.value = Array.from(config.textures);
-        await scene.ChangeTextureFromUrlAsync(textureSrc.value[0]); // 这一行是保证首次Mount组件时纹理能够立刻刷新
+        await scene.ChangeTextureFromUrlAsync(textures.value[0].src); // 这一行是保证首次Mount组件时纹理能够立刻刷新
     }
 }
 

src/lib/libOutputConfig.ts

@@ -3,7 +3,7 @@ import type { MaterialRequest } from "../components/MaterialAdjuster.vue"
 
 let _libOutputConfig = {
     host:'https://tapi.cfcad.cn:7779',
-    textureSrc: [],
+    textures: [],
     file: undefined,
     submitCallback: undefined,
     cancelCallback: undefined,
@@ -24,7 +24,12 @@ export type LibOutputConfig = {
      */
     host: string,
     /** 材质贴图链接列表，用与批量提交，场景会只会载入第一个链接作为纹理预览，但是导出提交时会为所有链接创建材质 */
-    textureSrc: Array<string>,
+    textures: Array<{
+        /** 材质名 */
+        name: string;
+        /** 纹理链接 */
+        src: string;
+    }>,
     /** 更新模型，对材质进行编辑时赋值 */
     updateModel?: {
         /** 材质名 */