Merge branch 'master' of http://124.70.149.18:10880/lianghj/queenshow

package.json

@@ -26,9 +26,9 @@
     "@ckeditor/ckeditor5-vue": "^5.1.0",
     "@linaria/core": "^4.1.1",
     "@queenjs-modules/auth": "^0.0.18",
-    "@queenjs-modules/queditor": "^0.0.11",
+    "@queenjs-modules/queditor": "^0.0.12",
     "@queenjs-modules/queentree": "^0.0.10",
-    "@queenjs-modules/queentree-explorer": "^0.0.5",
+    "@queenjs-modules/queentree-explorer": "^0.0.6",
     "@queenjs-modules/queentree-explorer-viewer": "^0.0.3",
     "@queenjs/components": "^0.0.5",
     "@queenjs/controllers": "^0.0.6",

src/modules/_default/viewerStorage.ts

@@ -0,0 +1,85 @@
+import { Dict_Apis } from "@/dict/apis";
+import {
+  HostRootItem,
+  NodeRootItem,
+  QueentreeExplorer_Storage
+} from "@queenjs-modules/queentree-explorer";
+import { nanoid } from "nanoid";
+
+// 设置资源面板Tab页
+QueentreeExplorer_Storage.setVersion("1.0.6");
+QueentreeExplorer_Storage.setDefaultValue(() => {
+  const expHosts: { [name: string]: HostRootItem } = {};
+
+  const cloudRootNode: NodeRootItem = {
+    names: ["云盘"],
+    ids: [nanoid()],
+    nodeType: "host",
+    tabPerms: ["rename", "login"],
+    nodePerms: ["editable", "saveAs"],
+  };
+
+  const platformRootNode: NodeRootItem = {
+    names: ["平台", "楦库", "面料"],
+    ids: [
+      cloudRootNode.ids[0],
+      "628b4ae8633d10f8e3658557",
+      "62a300a0a4fd6456392ebe76",
+    ],
+    nodeType: "branch",
+    assetType: 31,
+    tabPerms: [],
+    nodePerms: ["saveAs"],
+  };
+
+  const myRootNodes = [cloudRootNode];
+
+  // if (Dict_Apis.queentree) {
+  //   const localNodeRoot: NodeRootItem = {
+  //     names: ["本地"],
+  //     ids: [nanoid()],
+  //     nodeType: "host",
+  //     tabPerms: ["rename"],
+  //     nodePerms: ["editable", "saveAs"],
+  //   };
+
+  //   myRootNodes.unshift(localNodeRoot);
+
+  //   expHosts[localNodeRoot.ids[0]] = {
+  //     baseURL: Dict_Apis.queentree,
+  //     authURL: Dict_Apis.auth,
+  //     authKey: "queentreesku3d",
+  //   };
+  // }
+
+  expHosts[cloudRootNode.ids[0]] = {
+    baseURL: Dict_Apis.queentree,
+    authURL: Dict_Apis.auth,
+    authKey: "queentreesku3d",
+  };
+
+  const expNodeRoots = [...myRootNodes, platformRootNode];
+
+  return {
+    expHosts,
+    expWindows: [
+      {
+        groupName: "我的资源",
+        rootNodeIds: myRootNodes.map((rootNode) => rootNode.ids.at(-1) || ""),
+      },
+      {
+        groupName: "平台资源",
+        rootNodeIds: [platformRootNode.ids.at(-1) as string],
+      },
+      {
+        groupName: "共享资源",
+        rootNodeIds: [],
+        showShareBtn: true,
+      },
+    ],
+    expNodeRoots,
+    expActiveState: {
+      currWindowName: "我的资源",
+    },
+  };
+});

src/modules/resource/actions/material.ts

@@ -48,8 +48,28 @@ export const materialActions = ResourceModule.action({
   async queryTplsDetail(id) {
     const res = await this.https.queryTplsDetail(id);
     this.store.setSourceDetail(res.result);
+    this.store.setSelectedId(res.result.webEditor?.meshSlots[0]?.Id);
   },
-  async submitRender() {
-    //
+  async submitRender(id: string, images: any, vidoes: any) {
+    queenApi.showLoading("任务提交中");
+
+    console.log("iamges=>", images, "videos->", vidoes);
+
+    try {
+      await this.https.sourceGen({
+        genRequest: {
+          templateId: id,
+          vidoes: vidoes,
+          images: images,
+          matSlots: this.store.matSlots,
+        },
+      });
+      queenApi.messageSuccess("任务提交成功");
+      return true;
+    } catch (error) {
+      console.error(error);
+    } finally {
+      queenApi.hideLoading();
+    }
   },
 });

src/modules/resource/components/MaterialItem.tsx

@@ -9,7 +9,7 @@ export default defineComponent({
   props: {
     active: bool().def(false),
     record: any(),
-    use: string<"show" | "select">(),
+    use: string<"show" | "select" | "task">(),
   },
   emits: ["delete", "select", "download", "use"],
   setup(props, { emit }) {
@@ -36,41 +36,43 @@ export default defineComponent({
                 class="!-mt-0.2em absolute top-0 left-0 text-20px text-red-200 z-3"
               />
             )}
-            {use == "show" && (
-              <div class="waiting absolute inset-0 z-2 flex items-center justify-center text-white hidden">
-                生成中…
+            {use == "task" && (
+              <div class="waiting absolute inset-0 z-2 flex items-center justify-center text-white">
+                渲染中…
+              </div>
+            )}
+            {use !== "task" && (
+              <div
+                class="absolute inset-0 flex items-center justify-center z-2 opacity-0 hover:opacity-100 transition-all text-white"
+                onClick={() => emit("select")}
+              >
+                {use == "show" && (
+                  <IconDelete
+                    class="icon_del absolute right-5px top-5px p-3px rounded-2px text-14px cursor-pointer"
+                    onClick={() => emit("delete")}
+                  />
+                )}
+                {use == "show" && (
+                  <div
+                    class="btn_circle rounded-1/2 text-center w-56px leading-56px cursor-pointer"
+                    onClick={() => emit("download")}
+                  >
+                    下载
+                  </div>
+                )}
+                {use == "select" && (
+                  <div
+                    class="btn_circle  rounded-1/2 text-center w-56px leading-56px cursor-pointer"
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      emit("use");
+                    }}
+                  >
+                    使用
+                  </div>
+                )}
               </div>
             )}
-            <div
-              class="absolute inset-0 flex items-center justify-center z-2 opacity-0 hover:opacity-100 transition-all text-white"
-              onClick={() => emit("select")}
-            >
-              {use == "show" && (
-                <IconDelete
-                  class="icon_del absolute right-5px top-5px p-3px rounded-2px text-14px cursor-pointer"
-                  onClick={() => emit("delete")}
-                />
-              )}
-              {use == "show" && (
-                <div
-                  class="btn_circle rounded-1/2 text-center w-56px leading-56px cursor-pointer"
-                  onClick={() => emit("download")}
-                >
-                  下载
-                </div>
-              )}
-              {use == "select" && (
-                <div
-                  class="btn_circle  rounded-1/2 text-center w-56px leading-56px cursor-pointer"
-                  onClick={(e) => {
-                    e.stopPropagation();
-                    emit("use");
-                  }}
-                >
-                  使用
-                </div>
-              )}
-            </div>
           </View>
           {record.name && (
             <div class="py-8px px-10px" style={{ backgroundColor: "#262626" }}>
@@ -105,6 +107,6 @@ const itemStyles = css`
     }
   }
   .waiting {
-    background-color: rgba(0, 0, 0, 0.2);
+    background-color: rgba(0, 0, 0, 0.3);
   }
 `;

src/modules/resource/http.ts

@@ -16,6 +16,11 @@ export const http = ResourceModule.http({
   queryTplsDetail(id: string) {
     return this.request(`/tpls/detail/${id}`, { method: "GET" });
   },
+  
+  sourceGen(data) {
+    return this.request(`/sourceGen/create`, { method: "POST", data});
+  },
+
 
   //   promotion
   createPromotion(data: any) {

src/modules/resource/index.ts

@@ -38,8 +38,10 @@ export class ResourceModule extends ModuleRoot {
     this.controls.promotionListCtrl.state.size = 12;
     this.controls.materialListCtrl.setCrudPrefix("/source");
     this.controls.materialListCtrl.state.size = 24;
+    this.controls.renderTaskListCtrl.setCrudPrefix("/sourceGen");
+    this.controls.renderTaskListCtrl.state.size = 24;
     this.controls.matTempListCtrl.setCrudPrefix("/tpls");
-    this.controls.renderTaskListCtrl.setCrudPrefix("/tpls");
+    this.controls.matTempListCtrl.state.size = 20;
   }
 }
 

src/modules/resource/store.ts

@@ -3,10 +3,25 @@ import { ResourceModule } from ".";
 export const store = ResourceModule.store({
   state: () => ({
     type: "video",
+    selectedId: "",
     sourceDetail: {
       webEditor: { pack: {} },
     } as any,
+    matSlots: [] as any[],
   }),
+  
+  getters: {
+    currentMesh(state) {
+      return state.sourceDetail.webEditor?.meshSlots?.find(
+        (e: any) => e.Id == state.selectedId
+      );
+    },
+    currentMats(state) {
+      return state.sourceDetail.webEditor?.matSlots?.filter(
+        (e: any) => e.meshSlotId == state.selectedId
+      );
+    },
+  },
   actions: {
     setSourceType(v: string) {
       this.store.type = v;
@@ -14,5 +29,8 @@ export const store = ResourceModule.store({
     setSourceDetail(data) {
       this.store.sourceDetail = data;
     },
+    setSelectedId(id: string) {
+      this.store.selectedId = id;
+    },
   },
 });

src/pages/website/EditMaterial/components/ComponentPanel.tsx

@@ -1,55 +0,0 @@
-import { useResource } from "@/modules/resource";
-import { Image, List } from "@queenjs/ui";
-import { Button } from "ant-design-vue";
-import { defineComponent } from "vue";
-import { any } from "vue-types";
-
-export default defineComponent({
-  setup() {
-    const resource = useResource();
-
-    return () => {
-      const list = resource.store.sourceDetail.webEditor?.matSlots || [];
-      return (
-        <div class="w-300px flex flex-col">
-          <div class="p-15px text-16px text-white border-dark-800 border-0 border-b-1 border-solid">
-            组件列表
-          </div>
-          <List data={list} gap="10px" class="scrollbar flex-1 py-15px px-15px">
-            {{
-              item: (record: any) => <CompItem record={record} />,
-              loadmore: () => (
-                <div class="text-center py-20px text-12px opacity-80">
-                  没有更多了
-                </div>
-              ),
-            }}
-          </List>
-        </div>
-      );
-    };
-  },
-});
-
-const CompItem = defineComponent({
-  props: {
-    record: any().isRequired,
-  },
-  setup(props) {
-    return () => {
-      const { record } = props;
-      return (
-        <div
-          class="flex items-center py-6px px-12px rounded-4px"
-          style={{ backgroundColor: "#303030" }}
-        >
-          <Image src={record.thumbnail} class="w-48px rounded-4px" />
-          <div class="ml-10px flex-1 mr-5px w-0">{record.name || "未命名"}</div>
-          <Button type="primary" ghost size="small">
-            替换
-          </Button>
-        </div>
-      );
-    };
-  },
-});

src/pages/website/EditMaterial/components/Header.tsx

@@ -4,14 +4,14 @@ import { IconMore } from "@queenjs/icons";
 import { Button, Divider } from "ant-design-vue";
 import { defineComponent } from "vue";
 import Logo from "../../components/layout/Logo";
-import SelectTemplateModal from "./SelectTemplateModal";
+import OutputTemplateModal from "./OutputTemplateModal";
 
 export default defineComponent({
   setup() {
     const resource = useResource();
 
     const showModal = () => {
-      resource.showModal(<SelectTemplateModal />, {
+      resource.showModal(<OutputTemplateModal />, {
         title: "选择模板",
         width: "900px",
       });

src/pages/website/EditMaterial/components/LeftPanel.tsx

@@ -0,0 +1,109 @@
+import { useResource } from "@/modules/resource";
+import { cx } from "@linaria/core";
+import { useQueditor } from "@queenjs-modules/queditor";
+import { switchSceneProdComp } from "@queenjs-modules/queditor/module/controls/Queen3dCtrl/actions/geom";
+import { Pack } from "@queenjs-modules/queditor/objects";
+import { AssetItemFile } from "@queenjs-modules/queentree-explorer/objects/fileSystem/assetFiles";
+import { Image, List } from "@queenjs/ui";
+import { Button } from "ant-design-vue";
+import { defineComponent } from "vue";
+import { any, bool } from "vue-types";
+import LibraryModal from "./LibraryModal";
+
+export default defineComponent({
+  setup() {
+    const resource = useResource();
+    const queditor = useQueditor();
+
+    const replaceMesh = async () => {
+      const branchFolder = await resource.showModal<AssetItemFile>(
+        <LibraryModal />,
+        {
+          width: "900px",
+        }
+      );
+
+      const pack = await branchFolder.getAssetDetail();
+      const data = queditor.helper.getRelatedSourceByProduct(
+        pack.source as Pack["source"],
+        branchFolder.state.id
+      );
+
+      queditor.actions.insertMesh(data);
+    };
+
+    return () => {
+      const list = resource.store.sourceDetail.webEditor?.meshSlots || [];
+      return (
+        <div class="w-300px flex flex-col">
+          <div class="p-15px text-16px text-white border-dark-800 border-0 border-b-1 border-solid">
+            模型列表
+          </div>
+          <List data={list} gap="10px" class="scrollbar flex-1 py-15px px-15px">
+            {{
+              item: (record: any) => (
+                <ProductItem
+                  record={record}
+                  onChange={replaceMesh}
+                  active={record.Id == resource.store.selectedId}
+                  onClick={() => {
+                    switchSceneProdComp.call(
+                      queditor.controls.queen3dCtrl,
+                      queditor.store.pack.scenes[0].products[0].id,
+                      record.meshName
+                    );
+                    resource.store.setSelectedId(record.Id);
+                  }}
+                />
+              ),
+              loadmore: () => (
+                <div class="text-center py-20px text-12px opacity-80">
+                  没有更多了
+                </div>
+              ),
+            }}
+          </List>
+        </div>
+      );
+    };
+  },
+});
+
+const ProductItem = defineComponent({
+  props: {
+    record: any().isRequired,
+    active: bool().def(false),
+  },
+  emits: ["change", "click"],
+  setup(props, { emit }) {
+    return () => {
+      const { active, record } = props;
+      return (
+        <div
+          style={{ backgroundColor: "#303030" }}
+          class={cx(
+            "flex items-center py-6px px-12px rounded-4px border-1 border-solid cursor-pointer hover:opacity-80 transition-all",
+            active ? "border-orange-200" : "border-transparent"
+          )}
+          onClick={() => emit("click", record)}
+        >
+          <Image src={record.thumbnail} class="w-48px rounded-4px" />
+          <div class="ml-10px flex-1 mr-5px truncate w-0">
+            {record.meshName || "未命名"}
+          </div>
+          <Button
+            type="primary"
+            ghost
+            size="small"
+            onClick={(e) => {
+              e.stopPropagation();
+              emit("change", record);
+            }}
+          >
+            替换
+          </Button>
+        </div>
+      );
+    };
+  },
+});

src/pages/website/EditMaterial/components/LibraryModal.tsx

@@ -0,0 +1,64 @@
+import "@/modules/_default/viewerStorage";
+import {
+  initQueentreeExplorer,
+  NodeTypes,
+} from "@queenjs-modules/queentree-explorer";
+import PickNodeSteps from "@queenjs-modules/queentree-explorer/components/PickNodeSteps";
+import PickNodeStep from "@queenjs-modules/queentree-explorer/components/PickNodeSteps/PickNodeStep";
+import { StepController } from "@queenjs-modules/queentree-explorer/components/PickNodeSteps/StepController";
+import { Exception, useModal } from "queenjs";
+import { defineComponent } from "vue";
+import { array } from "vue-types";
+
+export default defineComponent({
+  props: {
+    nodeTypes: array<NodeTypes>().def(["packProd"]),
+  },
+
+  setup(props) {
+    const stepCtrol = new StepController(1);
+    const modal = useModal();
+
+    initQueentreeExplorer({
+      config: {
+        showNodeToolbar: false,
+        nodeListColumns: 6,
+      },
+    });
+
+    async function submit() {
+      try {
+        const branchFolder = stepCtrol.state.data.pickNodes[0];
+        modal.submit(branchFolder);
+      } catch (error: any) {
+        Exception.error(error?.toString());
+      }
+    }
+
+    return () => {
+      const { nodeTypes } = props;
+      return (
+        <PickNodeSteps
+          onSubmit={submit}
+          onCancel={() => modal.cancel()}
+          control={stepCtrol}
+          lastStepText="发送"
+          steps={[
+            {
+              title: "选择",
+              content: () => (
+                <PickNodeStep
+                  control={stepCtrol}
+                  options={{
+                    nodeTypes: nodeTypes,
+                    //   childNodeType: "packProd",
+                  }}
+                />
+              ),
+            },
+          ]}
+        />
+      );
+    };
+  },
+});

src/pages/website/EditMaterial/components/ModelPanel.tsx

@@ -1,57 +0,0 @@
-import { useResource } from "@/modules/resource";
-import { Image, List } from "@queenjs/ui";
-import { Button } from "ant-design-vue";
-import { defineComponent } from "vue";
-import { any } from "vue-types";
-
-export default defineComponent({
-  setup() {
-    const resource = useResource();
-
-    return () => {
-      const list = resource.store.sourceDetail.webEditor?.meshSlots || [];
-      return (
-        <div class="w-300px flex flex-col">
-          <div class="p-15px text-16px text-white border-dark-800 border-0 border-b-1 border-solid">
-            模型列表
-          </div>
-          <List data={list} gap="10px" class="scrollbar flex-1 py-15px px-15px">
-            {{
-              item: (record: any) => <ProductItem record={record} />,
-              loadmore: () => (
-                <div class="text-center py-20px text-12px opacity-80">
-                  没有更多了
-                </div>
-              ),
-            }}
-          </List>
-        </div>
-      );
-    };
-  },
-});
-
-const ProductItem = defineComponent({
-  props: {
-    record: any().isRequired,
-  },
-  setup(props) {
-    return () => {
-      const { record } = props;
-      return (
-        <div
-          class="flex items-center py-6px px-12px rounded-4px"
-          style={{ backgroundColor: "#303030" }}
-        >
-          <Image src={record.thumbnail} class="w-48px rounded-4px" />
-          <div class="ml-10px flex-1 mr-5px truncate w-0">
-            {record.meshName || "未命名"}
-          </div>
-          <Button type="primary" ghost size="small">
-            替换
-          </Button>
-        </div>
-      );
-    };
-  },
-});

src/pages/website/EditMaterial/components/SelectTemplateModal.tsx → src/pages/website/EditMaterial/components/OutputTemplateModal.tsx

@@ -3,22 +3,27 @@ import { List } from "@queenjs/ui";
 import { Button, Empty } from "ant-design-vue";
 import { queenApi, useModal } from "queenjs";
 import { defineComponent, reactive } from "vue";
+import { useRoute } from "vue-router";
 
 export default defineComponent({
   setup() {
     const resource = useResource();
     const modal = useModal();
+    const route = useRoute();
 
     const state = reactive({
-      list: [],
+      list: [] as {id: string, qos:1}[],
     }) as any;
 
-    const submit = () => {
+    const submit =async () => {
       if (state.list.length == 0) {
         queenApi.messageError("请选择至少一个模板");
         return;
       }
-      resource.actions.submitRender();
+      const isOk = await resource.actions.submitRender(route.params.id as string, state.list, []);
+      if (isOk) {
+        modal.submit(true);
+      }
     };
 
     return () => {
@@ -31,16 +36,17 @@ export default defineComponent({
                   <resource.components.MaterialItem
                     record={record}
                     class="cursor-pointer"
-                    active={state.list.includes(record.id)}
+                    active={ !!(state.list.find((v:any)=>v.id == record.id))}
                     onSelect={() => {
-                      if (state.list.includes(record.id)) {
+                      const selected =  !!(state.list.find((v:any)=>v.id == record.id))
+                      if (selected) {
                         const index = state.list.findIndex(
-                          (d: string) => d == record.id
+                          (d: any) => d.id == record.id
                         );
                         state.list.splice(index);
                         return;
                       }
-                      state.list.push(record.id);
+                      state.list.push({id: record.id, qos:1});
                     }}
                   />
                 );

src/pages/website/EditMaterial/components/RightPanel.tsx

@@ -0,0 +1,123 @@
+import { useResource } from "@/modules/resource";
+import { useQueditor } from "@queenjs-modules/queditor";
+import { Pack, PackMat } from "@queenjs-modules/queditor/objects";
+import { IQueentree } from "@queenjs-modules/queentree";
+import { AssetItemFile } from "@queenjs-modules/queentree-explorer/objects/fileSystem/assetFiles";
+import { Image, List } from "@queenjs/ui";
+import { Button } from "ant-design-vue";
+import { defineComponent } from "vue";
+import { any } from "vue-types";
+import LibraryModal from "./LibraryModal";
+
+export default defineComponent({
+  setup() {
+    const resource = useResource();
+    const queditor = useQueditor();
+
+    const replaceMat = async (record: any) => {
+      // console.error("replace=>", record);
+      const branchFolder = await resource.showModal<AssetItemFile>(
+        <LibraryModal nodeTypes={["matGroupItem", "mat", "packMat"]} />,
+        { width: "900px" }
+      );
+      // console.error("branchFolder: ", branchFolder);
+      const data = await branchFolder.getAssetDetail();
+      // console.error("data: ", data);
+
+      let mat;
+      switch (branchFolder.nodeType) {
+        case "matGroupItem":
+          mat = (data as IQueentree.IAssetMatGroup).source.colorCards.find(
+            (d: PackMat) => d.id == branchFolder.state.id
+          );
+          break;
+        case "packMat":
+          mat = (data.source as Pack["source"]).mats.find(
+            (d: PackMat) => d.id == branchFolder.state.id
+          );
+          break;
+        case "mat":
+          mat = data.source as PackMat;
+          break;
+      }
+
+      if (data && mat) {
+        const matConf = resource.store.matSlots.find(
+          (item) => item.id == record.id
+        );
+        if (matConf) {
+          matConf.material = mat;
+        } else {
+          const matSlot = { id: record.id, material: mat };
+          resource.store.matSlots.push(matSlot);
+        }
+      }
+      // console.error("resource.store.matSlots: ", resource.store.matSlots);
+
+      const targetComp = getTargetProCom();
+      if (!targetComp || !mat) return;
+      queditor.actions.updatePackProductCompMat(targetComp, mat);
+    };
+
+    const getTargetProCom = () => {
+      const source: Pack["source"] = queditor.store.pack;
+      const targetPro = source.products[0];
+      const targetComp = targetPro?.components.find(
+        (c) => c.name == resource.store.currentMesh.meshName
+      );
+      return targetComp;
+    };
+
+    return () => {
+      const list = resource.store.currentMats || [];
+      return (
+        <div class="w-300px flex flex-col">
+          <div class="p-15px text-16px text-white border-dark-800 border-0 border-b-1 border-solid">
+            组件列表
+          </div>
+          <List data={list} gap="10px" class="scrollbar flex-1 py-15px px-15px">
+            {{
+              item: (record: any) => (
+                <CompItem record={record} onClick={() => replaceMat(record)} />
+              ),
+              loadmore: () => (
+                <div class="text-center py-20px text-12px opacity-80">
+                  没有更多了
+                </div>
+              ),
+            }}
+          </List>
+        </div>
+      );
+    };
+  },
+});
+
+const CompItem = defineComponent({
+  props: {
+    record: any().isRequired,
+  },
+  emits: ["change", "click"],
+  setup(props, { emit }) {
+    return () => {
+      const { record } = props;
+      return (
+        <div
+          class="flex items-center py-6px px-12px rounded-4px"
+          style={{ backgroundColor: "#303030" }}
+        >
+          <Image src={record.thumbnail} class="w-48px rounded-4px" />
+          <div class="ml-10px flex-1 mr-5px w-0">{record.name || "未命名"}</div>
+          <Button
+            ghost
+            type="primary"
+            size="small"
+            onClick={() => emit("click", record)}
+          >
+            替换
+          </Button>
+        </div>
+      );
+    };
+  },
+});

src/pages/website/EditMaterial/index.tsx

@@ -3,9 +3,10 @@ import { initQueditor } from "@queenjs-modules/queditor";
 import { initExpViewer } from "@queenjs-modules/queentree-explorer-viewer";
 import { defineComponent, onBeforeUnmount, onMounted } from "vue";
 import { useRoute } from "vue-router";
-import ComponentPanel from "./components/ComponentPanel";
+import RightPanel from "./components/RightPanel";
 import Header from "./components/Header";
-import ModelPanel from "./components/ModelPanel";
+import LeftPanel from "./components/LeftPanel";
+import { switchSceneProdComp } from "@queenjs-modules/queditor/module/controls/Queen3dCtrl/actions/geom";
 
 export default defineComponent({
   setup() {
@@ -29,7 +30,7 @@ export default defineComponent({
           default: Header,
         },
         EditPanel: {
-          default: ComponentPanel,
+          default: RightPanel,
         },
       },
     });
@@ -37,7 +38,7 @@ export default defineComponent({
     queditor.initComponents({
       Viewport: {
         SiderLeft: {
-          default: ModelPanel,
+          default: LeftPanel,
         },
         Toolbar: {
           default: () => null,
@@ -52,6 +53,14 @@ export default defineComponent({
       queditor.actions.initPack(resource.store.sourceDetail?.webEditor?.pack);
       queditor.store.setCurrScene(0);
       expViewer.store.setEditNodeUid(resource.store.sourceDetail._id);
+
+      queditor.actions.on("initQueen3dScene:success", () => {
+        switchSceneProdComp.call(
+          queditor.controls.queen3dCtrl,
+          queditor.store.pack.scenes[0].products[0].id,
+          resource.store.currentMesh.meshName
+        );
+      });
     };
 
     onMounted(() => init());

src/pages/website/Material/index.tsx

@@ -14,6 +14,7 @@ const materialType = [
 export default defineComponent({
   setup() {
     const resource = useResource();
+    const { store, controls, actions } = resource;
 
     const showModal = (type: string) => {
       resource.showModal(<MaterialTemplateModal type={type} />, {
@@ -24,19 +25,26 @@ export default defineComponent({
 
     const changeType = (v: string) => {
       resource.store.setSourceType(v);
+      if (v == "task") {
+        controls.renderTaskListCtrl.loadPage(1);
+        return;
+      }
       loadPage();
     };
 
     const loadPage = () => {
-      resource.controls.materialListCtrl.state.query = {
-        fileType: resource.store.type,
-      };
-      resource.controls.materialListCtrl.loadPage(1);
+      controls.materialListCtrl.state.query = { fileType: store.type };
+      controls.materialListCtrl.loadPage(1);
     };
 
     onMounted(() => loadPage());
 
     return () => {
+      const control =
+        store.type == "task"
+          ? controls.renderTaskListCtrl
+          : controls.materialListCtrl;
+
       return (
         <div class={rootStyles}>
           <h3 class="text-22px">我的素材</h3>
@@ -47,7 +55,7 @@ export default defineComponent({
                   key={d.key}
                   onClick={() => changeType(d.key)}
                   class={cx(
-                    resource.store.type == d.key && "active",
+                    store.type == d.key && "active",
                     "cursor-pointer btn_tab"
                   )}
                 >
@@ -84,13 +92,13 @@ export default defineComponent({
           <AssetsList
             columns={6}
             class="mt-30px"
-            control={resource.controls.materialListCtrl}
+            control={control}
             item={(record: any) => (
               <resource.components.MaterialItem
-                use="show"
                 record={record}
-                onDelete={() => resource.actions.deleteMaterial(record)}
-                onDownload={() => resource.actions.downloadMaterial(record)}
+                use={store.type == "task" ? "task" : "show"}
+                onDelete={() => actions.deleteMaterial(record)}
+                onDownload={() => actions.downloadMaterial(record)}
               />
             )}
           />

yarn.lock

@@ -1604,20 +1604,22 @@
   resolved "http://124.70.149.18:4873/@queenjs-modules%2fauth/-/auth-0.0.18.tgz#48a7abd1023cee213cbfdd1b822e52041a070818"
   integrity sha512-zQGPz1GUR2QE3qCkfpdQ3vDkNNuFRhvrD+ErCynnlDP/QQNgvOoHizPEO5OE4VzdBu+/psGWymQs+9zONGuO3A==
 
-"@queenjs-modules/queditor@^0.0.11":
-  version "0.0.11"
-  resolved "http://124.70.149.18:4873/@queenjs-modules%2fqueditor/-/queditor-0.0.11.tgz#05fdea6cb5dc0f9618e9c4138eaaa314cb658fd9"
-  integrity sha512-KlQ6po02/ZVBXnfzR+hZxQ3C9tcZG2EQDj0TXPjhY3J54BuxDvktIGnlXvFv8GcUpM+/bA4Ka3JPOapgR4Or2Q==
+"@queenjs-modules/queditor@^0.0.12":
+  version "0.0.12"
+  resolved "http://124.70.149.18:4873/@queenjs-modules%2fqueditor/-/queditor-0.0.12.tgz#12036f9226065cd013507742edd2624a057fd2a9"
+  integrity sha512-lkBFRbamdQVkwT0CZMlW1mTxH1N6Kp7LfTMLYGO/iVPu1QWTUiS6MOE/7yBjLmqZfSiiqzZa0QUo3Oi6u6sVJg==
 
 "@queenjs-modules/queentree-explorer-viewer@^0.0.3":
   version "0.0.3"
   resolved "http://124.70.149.18:4873/@queenjs-modules%2fqueentree-explorer-viewer/-/queentree-explorer-viewer-0.0.3.tgz#1952b50a9a0cc92b04ea24cfd3064c8d3b19bd70"
   integrity sha512-sQYuJdq46GoYIv+yyQPd5eVNKeOPgaOoBEine8PQxVFh7gLxcdRi4mfPZq7Wq92g+5juCSFwkSRavaANHrf1kA==
 
-"@queenjs-modules/queentree-explorer@^0.0.5":
-  version "0.0.5"
-  resolved "http://124.70.149.18:4873/@queenjs-modules%2fqueentree-explorer/-/queentree-explorer-0.0.5.tgz#3820f033d23e594838205c3204d7ecbe78831fa0"
-  integrity sha512-/F447pKOt0Kgq4nQqAW7w9RZlj49nhX0FQiQCtwHZVVGBPd/g8d1G4jKdpbQDGZoM2Z8yUfoei2MGnYQ5xZwnQ==
+"@queenjs-modules/queentree-explorer@^0.0.6":
+  version "0.0.6"
+  resolved "http://124.70.149.18:4873/@queenjs-modules%2fqueentree-explorer/-/queentree-explorer-0.0.6.tgz#e2ba1ba4a247a5f6ed5a9de50271315bf81e39ee"
+  integrity sha512-2efcbsCT0+4BiuRQk0SPC4cSiVenArCCFxapkgE+4mymwkiIlXBQ/s2bJNUuylLFxjQGsvW2bHdgQzA2zvRqRg==
+  dependencies:
+    "@queenjs-modules/queentree" "^0.0.10"
 
 "@queenjs-modules/queentree@^0.0.10":
   version "0.0.10"