fix: 编辑器联调

src/views/Creative/components/ChooseMarerial.vue

@@ -2,10 +2,10 @@
   <div>
     <div class="item" v-for="(item, index) in list" :key="index" :class="current.includes(item) ? 'selected' : ''" @click="toggle(item)">
       <div class="cover">
-        <img src="" alt="">
+        <img :src="item.material_json?.urlThumb" alt="">
       </div>
       <div class="title">
-        作品名称
+        {{item.title}}
       </div>
     </div>
     <div style="clear: both;"></div>
@@ -17,19 +17,24 @@ const { ref }=require("@vue/reactivity");
 const { onMounted }=require("@vue/runtime-core");
 import { getMaterialLibrary } from "../api";
 
-const props = defineProps(["type"])
+const props = defineProps(["type"]);
+
+const emit = defineEmits(["change"]);
 
 const list = ref([]);
 
 const current = ref([]);
 
 const toggle = (item) => {
+
   if(current.value.includes(item)){
     current.value = current.value.filter(x => x != item);
   }
   else{
     current.value.push(item);
   }
+
+  emit("change", JSON.parse(JSON.stringify(current.value)));
 };
 
 onMounted(async () => {
@@ -53,6 +58,9 @@ onMounted(async () => {
   .cover{
     width: 100%;
     height: 120px;
+    img{
+      max-width: 100%;
+    }
   }
   .title{
     line-height: 30px;

src/views/Creative/components/Create3D.constant.js

@@ -24,28 +24,40 @@ const factorys = [
   {
     type: CREATIVE_TYPE.THREE_D,
     build: (data) => {
+      
+      var pUrl = "";
+      var sUrl = "";
+      var key = new Date().getTime();
+      try{
+        data = data.data;
+        pUrl = data.panorama[0].material_json.url;
+        sUrl = data.shelves[0].material_json.url;
+      }
+      catch(e){}
+
       return {
-        "planetid": "scene1",
+        "planetid": `${key}-scene`,
-        "name": "场景1",
+        "name": `场景-${key}`,
 
         "arrangementId": "bsld2da4",
         "relShopId": "sllqkj4l",
         "panorama": {
-          "url": "",
+          "url": pUrl,
-          "urlSmall": "",
+          "urlSmall": pUrl,
           "urlThumb": "",
           "urlDepth": "",
           "urlShelfExr": "",
+          "urlHoldExr": "",
           "rotationY": 0,
           "multiply": 3
         },
         "shelves": [
           {
-            "name": "货架1",
+            "name": `货架-${key}`,
-            "planetid": "shelf1",
+            "planetid": `${key}-shelf`,
 
-            "id": "shelf1",
+            "id": `${key}-shelf`,
-            "url": "",
+            "url": sUrl,
             "urlThumb": "",
             "hideWhenSurvey": true,
             "cells": [
@@ -915,7 +927,23 @@ const factorys = [
               "z": 1
             },
 
-            "wares": []
+            "wares": [
+              {
+                "planetid": `${key}-ware`,
+                "name": `商品${key}`,
+                "surveyWare": {
+                  "id": "ware1-1",
+                  "type": 1,
+                  "commodity": {
+                    "url": "https://test-cxp-public-web-1302259445.cos.ap-beijing.myqcloud.com/uat-yls/3D/shelves/shelves-v3-store/v3.4/ware/milkpowder-can1-lod0.glb"
+                  },
+                  "texture": null,
+                  "urlThumb": "https://test-cxp-public-web-1302259445.cos.ap-beijing.myqcloud.com/uat-yls/3D/shelves/shelves-v3-store/v3.4/ware/milkpowder-can1.png"
+                },
+                "surveyLogo": "",
+                "surveyPrice": 190
+              }
+            ]
           }
         ]
       }

src/views/Creative/components/Create3D.vue

@@ -17,18 +17,18 @@
     </a-form>
     <div v-if="formData.type==CREATIVE_TYPE.THREE_D" style="margin: 20px 0;">
       <div v-if="step==1">
-        <ChooseMarerial :type="THREE_D_TYPE.PANORAMA" v-model="formData.data.panorama"/>
+        <ChooseMarerial :type="THREE_D_TYPE.PANORAMA" @change="val => formData.data.panorama = val"/>
       </div>
       <div v-if="step==2">
-        <ChooseMarerial :type="THREE_D_TYPE.SHELF" v-model="formData.data.shelves"/>
+        <ChooseMarerial :type="THREE_D_TYPE.SHELF" @change="val => formData.data.shelves = val"/>
       </div>
       <div v-if="step==3">
-        <ChooseMarerial :type="THREE_D_TYPE.WARE" v-model="formData.data.wares"/>
+        <ChooseMarerial :type="THREE_D_TYPE.WARE" @change="val => formData.data.wares = val"/>
       </div>
     </div>
     <div v-if="formData.type==CREATIVE_TYPE.MODEL_3D" style="margin: 20px 0;">
       <div v-if="step==1">
-        <ChooseMarerial :type="THREE_D_TYPE.CHARTLET" v-model="formData.data.panorama"/>
+        <ChooseMarerial :type="THREE_D_TYPE.CHARTLET" @change="val => formData.data.panorama = val"/>
       </div>
     </div>
   </a-modal>
@@ -54,7 +54,11 @@ const formData = ref({
   type: 1,
   title: '',
   cover: '',
-  data: {}
+  data: {
+    panorama: [],
+    shelves: [],
+    wares: []
+  }
 });
 
 const show = (type) => {
@@ -67,7 +71,12 @@ const show = (type) => {
   var target = JSON.parse(JSON.stringify(obj));
   target.title = "";
   target.cover = "";
-  target.data = {};
+  target.data = {
+    panorama: [],
+    shelves: [],
+    wares: []
+  };
+  target.version = new Date().getTime();
   formData.value = target;
   step.value = 0;
   visible.value = true;
@@ -77,7 +86,7 @@ const ok = async () => {
   step.value++;
   if(formData.value.type == CREATIVE_TYPE.THREE_D) {
     if(step.value >= 4) {
-      formData.value.data = buildData(formData.value)
+      formData.value.data = buildData(formData.value);
       await createMaterialCenter(formData.value);
       visible.value = false;
       emit("complete");

src/views/Creative/components/CreateMaterial.constant.js

@@ -49,10 +49,15 @@ const factorys = [
   {
     type: THREE_D_TYPE.PANORAMA,
     build(data){
+      var url = "";
+      try{
+        url = data.fileList[0].response.url;
+      }
+      catch(e){ }
       return {
         ...data, 
         data: {
-          "url": "",
+          "url": url,
           "urlSmall": "",
           "urlThumb": "",
           "urlDepth": "",
@@ -74,6 +79,11 @@ const factorys = [
   {
     type: THREE_D_TYPE.SHELF,
     build(data){
+      var url = "";
+      try{
+        url = data.fileList[0].response.url;
+      }
+      catch(e){ }
       //#region 返回值
       return {
         ...data,
@@ -81,7 +91,7 @@ const factorys = [
           "name": "货架1",
           "planetid": "shelf1",
           "id": "shelf1",
-          "url": "",
+          "url": url,
           "urlThumb": "",
           "hideWhenSurvey": true,
           "cells": [],
@@ -142,21 +152,26 @@ const factorys = [
   {
     type: THREE_D_TYPE.WARE,
     build(data){
+      var url = "";
+      try{
+        url = data.fileList[0].response.url;
+      }
+      catch(e){ }
       return {
         ...data,
+        data: {
           "planetid": "ware1-1",
           "name": "伊利",
-        "surveyWare": {
           "id": "ware1-1",
           "type": 1,
           "commodity": {
-            "url": ""
+            "url": url
           },
           "texture": null,
-          "urlThumb": ""
+          "urlThumb": "",
-        },
           "surveyLogo": "",
           "surveyPrice": 190
+        },
       };
     }
   },

src/views/planetDesign/Design/components/config/Config3D.vue

@@ -308,6 +308,7 @@ import { buildShopDataDemo } from "./config3d.utils";
 import SceneSurveyViewerPreview from "./Viewer3D/SceneSurveyViewerPreview";
 import { message } from "ant-design-vue";
 import WareViewer from "./Viewer3D/WareViewer";
+import { getMaterials } from "@/views/Creative/api";
 
 
 export default {
@@ -433,12 +434,16 @@ export default {
     };
   },
   async mounted() {
-    // 环境类型
+    
-    var type0 = process.env.VUE_APP_CURRENTMODE == "prod" ? "prod" : "test";
+    // // 环境类型
-    var type1 = process.env.VUE_APP_CURRENTMODE == "prod" ? "prod" : "uat";
+    // var type0 = process.env.VUE_APP_CURRENTMODE == "prod" ? "prod" : "test";
-    // 默认的模型接口
+    // var type1 = process.env.VUE_APP_CURRENTMODE == "prod" ? "prod" : "uat";
-    var res = await fetch(`https://${type0}-cxp-public-web-1302259445.cos.ap-beijing.myqcloud.com/${type1}-yls/3D/shelves/scenes_data/yili.json`).then(res => res.json());
+    // // 默认的模型接口
-    this.scenes = res;
+    // var res = await fetch(`https://${type0}-cxp-public-web-1302259445.cos.ap-beijing.myqcloud.com/${type1}-yls/3D/shelves/scenes_data/yili.json`).then(res => res.json());
+    // this.scenes = res;
+
+    var res = await getMaterials({ type: 1, title: ""});
+    this.scenes = res.data.map(x => x.materials[0].space_json);
   },
   methods: {
     on3DChange() {

src/views/planetDesign/Design/components/config/Viewer3D/SceneSurveyViewerPreview.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script>
-import { SurveyViewer } from "./shelves.module.js";
+import { ShopSurveyViewer as SurveyViewer } from "@/views/Creative/lib/shelves.module.js";
 
 export default {
   props: ["surveyId", "shopData", "page", "sceneAction", "elCart", "defaultWare", "isLocked", "freezeRotY"],
@@ -23,6 +23,7 @@ export default {
   methods: {
     tryInitView() {
       if (!this.viewer_) {
+        
         this.viewer_ = new SurveyViewer({
           container: this.$el,
           surveyId: this.surveyId,

src/views/planetDesign/Design/components/config/config3d.utils.js

@@ -5,6 +5,7 @@ var template = {
   "relShopId": "sllqkj4l",
   "panorama": {},
   "shelf": {},
+  "shelves": [],
 }
 export const buildShopDataDemo = (scene) => {
 
@@ -16,10 +17,10 @@ export const buildShopDataDemo = (scene) => {
     temp[key] = scene[key];
   });
 
-  var shelf = scene.shelves && scene.shelves[0];
+  // var shelf = scene.shelves && scene.shelves[0];
-  temp.shelf = shelf ? JSON.parse(JSON.stringify(shelf)) : null;
+  // temp.shelf = shelf ? JSON.parse(JSON.stringify(shelf)) : null;
 
-  // temp.shelf.cells.forEach(cell => ({...cell, ...scene.wares[0]}));
+  temp.shelves = JSON.parse(JSON.stringify(scene.shelves));
 
   return temp;
 }