Ver Fonte

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

lianghongjie há 1 ano atrás
pai
commit
a63814cd64
34 ficheiros alterados com 443 adições e 93 exclusões
  1. BIN
      src/assets/thumbnails/1.png
  2. 11 0
      src/controllers/queentreeController.ts
  3. 3 2
      src/modules/editor/components/Canvas/index.tsx
  4. 2 0
      src/modules/editor/components/CompUI/basicUI/Container/index.ts
  5. 1 0
      src/modules/editor/components/CompUI/basicUI/Image/index.ts
  6. 2 0
      src/modules/editor/components/CompUI/basicUI/Text/index.ts
  7. 1 0
      src/modules/editor/components/CompUI/customUI/Cards/Card/index.tsx
  8. 28 0
      src/modules/editor/components/CompUI/customUI/Cards/Card2/component.tsx
  9. 27 0
      src/modules/editor/components/CompUI/customUI/Cards/Card2/index.tsx
  10. 1 0
      src/modules/editor/components/CompUI/customUI/Cards/CardList/index.tsx
  11. 2 0
      src/modules/editor/components/CompUI/customUI/Cover/index.ts
  12. 2 0
      src/modules/editor/components/CompUI/customUI/Titles/Title1/index.ts
  13. 52 0
      src/modules/editor/components/CompUI/customUI/Titles/Title2/component.tsx
  14. 20 0
      src/modules/editor/components/CompUI/customUI/Titles/Title2/index.tsx
  15. BIN
      src/modules/editor/components/CompUI/customUI/Titles/Title2/thumbnail.jpg
  16. 1 0
      src/modules/editor/components/CompUI/defines/createOptions.ts
  17. 3 0
      src/modules/editor/components/CompUI/index.ts
  18. 7 0
      src/modules/editor/components/CompUI/placeHoder.tsx
  19. 5 3
      src/modules/editor/components/Viewport/Content/index.tsx
  20. 7 6
      src/modules/editor/components/Viewport/Slider/SliderLeft.tsx
  21. 11 6
      src/modules/editor/stores/index.ts
  22. 1 0
      src/modules/resource/actions/editor.ts
  23. 2 5
      src/modules/resource/actions/promotion.ts
  24. 6 0
      src/modules/resource/helper.ts
  25. 5 3
      src/pages/queentree/router.ts
  26. 1 1
      src/pages/queentree/selectMat.tsx
  27. 19 0
      src/pages/queentree/selectPackScene.tsx
  28. 40 0
      src/pages/website/CreateMat/components/AttrPanel/BaseInfo.tsx
  29. 84 11
      src/pages/website/CreateMat/components/AttrPanel/MatAttr.tsx
  30. 9 4
      src/pages/website/CreateMat/components/AttrPanel/MeshAttr.tsx
  31. 6 14
      src/pages/website/CreateMat/components/AttrPanel/index.tsx
  32. 48 16
      src/pages/website/CreateMat/components/LibraryModal.tsx
  33. 30 16
      src/pages/website/CreateMat/components/TreePanel/index.tsx
  34. 6 6
      vue.config.js

BIN
src/assets/thumbnails/1.png


+ 11 - 0
src/controllers/queentreeController.ts

@@ -18,6 +18,17 @@ export class  TreeController {
         return ret.payload;
     }
 
+    async selectOnePackScene() {
+        const bus = this._bus;
+        const route = await bus.requestApi("queentree.local.router", {name:"selpacksceneblack"})
+        if (!route || !route.Url ) return;
+        const url = route.Url;
+        const payload = {}
+        const ret:any = await bus.RequestWebView("selpacksceneblack", {dev:true, height: 600, width: 900, payload, url, alwaysOnTop:true,})
+        console.log("selpackprodblack=>", ret);
+        return ret.payload;
+    }
+
     async  SelectedPackComp(pack:any, prodId:string, compId:string) {
         queenApi.showLoading("数据发送中")
         const bus = this._bus;

+ 3 - 2
src/modules/editor/components/Canvas/index.tsx

@@ -1,5 +1,6 @@
 import { defineUI } from "queenjs";
 import { useEditor } from "../..";
+import ErrorComp from "../CompUI/placeHoder";
 
 export default defineUI({
   setup() {
@@ -7,8 +8,8 @@ export default defineUI({
     return () => (
       <div>
         {store.designData.content.map((d) => {
-          const Comp: any = config.compUI[d.compKey].Component;
-          return <Comp key={d.id} compId={d.id} />;
+          const Comp: any = config.compUI[d.compKey]?.Component;
+          return Comp && <Comp key={d.id} compId={d.id} />;
         })}
       </div>
     );

+ 2 - 0
src/modules/editor/components/CompUI/basicUI/Container/index.ts

@@ -1,3 +1,4 @@
+import { Dict_Imgs } from "@/dict";
 import { createAttrsForm } from "../../defines/createAttrsForm";
 import { createOptions } from "../../defines/createOptions";
 import { GroupNumber } from "../../formItems/GroupNumber";
@@ -6,6 +7,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "定位容器",
+  thumbnail: Dict_Imgs.Default,
   value: {
     position: [0, 0],
   },

+ 1 - 0
src/modules/editor/components/CompUI/basicUI/Image/index.ts

@@ -6,6 +6,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "图片",
+  thumbnail: Dict_Imgs.Default,
   value: Dict_Imgs.Default,
 });
 

+ 2 - 0
src/modules/editor/components/CompUI/basicUI/Text/index.ts

@@ -1,3 +1,4 @@
+import { Dict_Imgs } from "@/dict";
 import { createAttrsForm } from "../../defines/createAttrsForm";
 import { createOptions } from "../../defines/createOptions";
 
@@ -5,6 +6,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "文本",
+  thumbnail: Dict_Imgs.Default,
   value: "请输入内容",
 });
 

+ 1 - 0
src/modules/editor/components/CompUI/customUI/Cards/Card/index.tsx

@@ -7,6 +7,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "卡片",
+  thumbnail: Dict_Imgs.Default,
   value: {
     img: Dict_Imgs.Default,
     imgSize: [240, 240],

+ 28 - 0
src/modules/editor/components/CompUI/customUI/Cards/Card2/component.tsx

@@ -0,0 +1,28 @@
+import { string } from "vue-types";
+import { useCompData } from ".";
+import { Image, Text } from "../../..";
+import { useEditor } from "../../../../..";
+import { createUIComp } from "../../../defines/createUIComp";
+
+export const Component = createUIComp({
+  props: {
+    compId: string().isRequired,
+  },
+  setup(props) {
+    const { designToNaturalSize } = useEditor().helper;
+    const { value } = useCompData(props.compId);
+
+    return () => (
+      <div class="flex">
+        <Image.Component
+          style={{
+            width: designToNaturalSize(value.imgSize[0]),
+            height: designToNaturalSize(value.imgSize[1]),
+          }}
+          v-model={[value.img, "value"]}
+        />
+        <Text.Component class="flex-1 ml-0.1rem" v-model={[value.desc, "value"]} />
+      </div>
+    );
+  },
+});

+ 27 - 0
src/modules/editor/components/CompUI/customUI/Cards/Card2/index.tsx

@@ -0,0 +1,27 @@
+import { Dict_Imgs } from "@/dict";
+import { createAttrsForm } from "../../../defines/createAttrsForm";
+import { createOptions } from "../../../defines/createOptions";
+import { GroupNumber } from "../../../formItems/GroupNumber";
+
+export { Component } from "./component";
+
+export const { options, useCompData } = createOptions({
+  name: "卡片2",
+  thumbnail: require("@/assets/thumbnails/1.png"),
+  value: {
+    img: Dict_Imgs.Default,
+    imgSize: [240, 240],
+    desc: "描述",
+  },
+});
+
+export const Form = createAttrsForm([
+  {
+    label: "图片尺寸",
+    dataIndex: "value.imgSize",
+    component: GroupNumber,
+    props: {
+      labels: ["宽", "高"],
+    },
+  },
+]);

+ 1 - 0
src/modules/editor/components/CompUI/customUI/Cards/CardList/index.tsx

@@ -7,6 +7,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "卡片列表",
+  thumbnail: Dict_Imgs.Default,
   value: {
     gap: 10,
     columns: 3,

+ 2 - 0
src/modules/editor/components/CompUI/customUI/Cover/index.ts

@@ -1,3 +1,4 @@
+import { Dict_Imgs } from "@/dict";
 import { createAttrsForm } from "../../defines/createAttrsForm";
 import { createOptions } from "../../defines/createOptions";
 
@@ -5,6 +6,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "封面",
+  thumbnail: Dict_Imgs.Default,
   value: {},
   background: {
     image:

+ 2 - 0
src/modules/editor/components/CompUI/customUI/Titles/Title1/index.ts

@@ -1,3 +1,4 @@
+import { Dict_Imgs } from "@/dict";
 import { createAttrsForm } from "../../../defines/createAttrsForm";
 import { createOptions } from "../../../defines/createOptions";
 import { createColorOpts } from "../../../defines/formOpts/createColorOpts";
@@ -6,6 +7,7 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "标题",
+  thumbnail: Dict_Imgs.Default,
   value: {
     themeColor: "#666666",
   },

+ 52 - 0
src/modules/editor/components/CompUI/customUI/Titles/Title2/component.tsx

@@ -0,0 +1,52 @@
+import { string } from "vue-types";
+import { useCompData } from ".";
+import { Text } from "../../..";
+import { createUIComp } from "../../../defines/createUIComp";
+import { css, cx } from "@linaria/core";
+
+export const Component = createUIComp({
+  props: {
+    compId: string().isRequired,
+  },
+  setup(props) {
+    const { children } = useCompData(props.compId);
+
+    return () => (
+      <div class="flex items-center justify-center px-0.1rem">
+        <div class={cx(border, "left w-1rem text-0.34rem text-right")}>
+          &frasl; &frasl;
+        </div>
+        <Text.Component
+          class="px-0.5rem max-w-4.8rem"
+          compId={children.title?.id}
+        />
+        <div class={cx(border, "right w-1rem text-0.34rem")}>
+          &frasl; &frasl;
+        </div>
+      </div>
+    );
+  },
+});
+
+const border = css`
+  position: relative;
+  color: #999;
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: 50%;
+    width: 100%;
+    height: 1px;
+    background-color: currentColor;
+  }
+  &.left {
+    &::after {
+      left: 0.06rem;
+    }
+  }
+  &.right {
+    &::after {
+      left: -0.06rem;
+    }
+  }
+`;

+ 20 - 0
src/modules/editor/components/CompUI/customUI/Titles/Title2/index.tsx

@@ -0,0 +1,20 @@
+import { createAttrsForm } from "../../../defines/createAttrsForm";
+import { createOptions } from "../../../defines/createOptions";
+
+export { Component } from "./component";
+
+export const { options, useCompData } = createOptions({
+  name: "标题",
+  thumbnail: require("./thumbnail.jpg"),
+  value: {},
+  children: {
+    title: {
+      value: `<p style="text-align:center;"><span style="color:#333;font-size:20px;font-weight: bold;">产品信息</span></p>`,
+      layout: {
+        textAlign: "center",
+      },
+    },
+  },
+});
+
+export const Form = createAttrsForm([]);

BIN
src/modules/editor/components/CompUI/customUI/Titles/Title2/thumbnail.jpg


+ 1 - 0
src/modules/editor/components/CompUI/defines/createOptions.ts

@@ -4,6 +4,7 @@ import { DesignComp } from "@/modules/editor/defines/DesignTemp/DesignComp";
 
 type IOptions<T, C> = {
   name: string;
+  thumbnail: string;
   value: T;
   layout?: Layout;
   background?: Background;

+ 3 - 0
src/modules/editor/components/CompUI/index.ts

@@ -5,3 +5,6 @@ export * as Card from "./customUI/Cards/Card";
 export * as CardList from "./customUI/Cards/CardList";
 export * as Cover from "./customUI/Cover";
 export * as Title1 from "./customUI/Titles/Title1";
+export * as Title2 from "./customUI/Titles/Title2";
+export * as Card2 from "./customUI/Cards/Card2";
+

+ 7 - 0
src/modules/editor/components/CompUI/placeHoder.tsx

@@ -0,0 +1,7 @@
+import { defineComponent } from "vue";
+
+export default defineComponent({
+     setup() {
+        return ()=><div>组件已被删除</div>
+     }
+})

+ 5 - 3
src/modules/editor/components/Viewport/Content/index.tsx

@@ -6,6 +6,7 @@ import { Container, Draggable } from "vue-dndrop";
 import { useEditor } from "../../..";
 import { HotKeyCtrl } from "../../../controllers/HotKeyCtrl";
 import Canvas from "../../Canvas";
+import ErrorComp from "../../CompUI/placeHoder";
 
 export default defineUI({
   setup() {
@@ -50,12 +51,13 @@ export default defineUI({
             non-drag-area-selector={".drag-disable"}
           >
             {compsGroup.value.normalArr.map((d) => {
-              const Comp: any = config.compUI[d.compKey]?.Component;
-              return Comp ? (
+              const Comp: any =
+                config.compUI[d.compKey]?.Component || ErrorComp;
+              return (
                 <Draggable key={d.id}>
                   <Comp compId={d.id} />
                 </Draggable>
-              ) : undefined;
+              );
             })}
           </Container>
         ) : (

+ 7 - 6
src/modules/editor/components/Viewport/Slider/SliderLeft.tsx

@@ -8,24 +8,25 @@ export default defineUI({
     const editor = useEditor();
 
     return () => (
-      <div>
+      <div class="h-full flex flex-col">
         <div class="p-16px border-bottom !border-2px">资源中心</div>
-        <div class="m-16px">
-          <Radio.Group>
+        <div class="my-16px flex-1 flex flex-col h-0">
+          <Radio.Group  class="!mx-16px">
             <Radio.Button>模板</Radio.Button>
             <Radio.Button>组件</Radio.Button>
           </Radio.Group>
-          <div class="py-16px space-y-10px">
+          <div class="p-16px space-y-10px flex-1 scrollbar ">
             {Object.entries(editor.config.compUI).map(([compKey, uiOpt], i) => {
               return (
                 <div
-                  class="text-center leading-50px h-50px bg-dark-50 rounded"
+                  class="text-center leading-50px bg-dark-50 rounded"
                   key={i}
                   onClick={() =>
                     editor.actions.addCompToDesign(compKey as ICompKeys)
                   }
                 >
-                  {uiOpt.options.name}
+                  <img class="w-full rounded" src={uiOpt.options.thumbnail} alt="封面图" />
+                  {/* {uiOpt.options.name} */}
                 </div>
               );
             })}

+ 11 - 6
src/modules/editor/stores/index.ts

@@ -64,7 +64,7 @@ export const store = EditorModule.store({
         children: options?.children as any,
       });
       container.children || (container.children = {});
-      container.children[nanoid()] = comp;
+      container.children[comp.id] = comp;
       this.store.initDesignCompMap();
       return comp;
     },
@@ -72,11 +72,16 @@ export const store = EditorModule.store({
       this.store.currCompId = compId;
     },
     deleteComp(compId: string) {
-      const index = this.store.designData.content.findIndex(
-        (d) => d.id === compId
-      );
-      if (index !== -1) {
-        this.store.designData.content.splice(index, 1);
+      const parentComp = this.helper.findParentComp(compId);
+      if (parentComp) {
+        delete parentComp.children[compId];
+      } else {
+        const index = this.store.designData.content.findIndex(
+          (d) => d.id === compId
+        );
+        if (index !== -1) {
+          this.store.designData.content.splice(index, 1);
+        }
       }
     },
     moveComp(selIndex: number, targetIndex: number) {

+ 1 - 0
src/modules/resource/actions/editor.ts

@@ -32,6 +32,7 @@ export const editorActions = ResourceModule.action({
           vidoes: vidoes,
           images: images,
           matSlots: this.store.matSlots,
+          meshSlots: this.store.meshSlots,
         },
       });
       queenApi.messageSuccess("任务提交成功");

+ 2 - 5
src/modules/resource/actions/promotion.ts

@@ -1,7 +1,5 @@
 import { queenApi } from "queenjs";
 import { ResourceModule } from "..";
-import { PromotionController } from "../controllers/PromotionController";
-import { PageListController } from "@queenjs/controllers";
 
 export const promotionAction = ResourceModule.action({
   async renamePromotion(record: any) {
@@ -21,7 +19,7 @@ export const promotionAction = ResourceModule.action({
     });
     if (!res) return;
     await this.https.deletePromotion(record._id);
-    this.controls.promotionListCtrl.fresh();
+    // this.controls.promotionListCtrl.fresh();
   },
 
   async createPromotion() {
@@ -32,6 +30,5 @@ export const promotionAction = ResourceModule.action({
     const res = await this.https.createPromotion({ title });
     const url = `${location.origin}/editor.html#/?id=${res.result}`;
     location.href = url;
-  }
-
+  },
 });

+ 6 - 0
src/modules/resource/helper.ts

@@ -19,6 +19,12 @@ export const helper = ResourceModule.helper({
     ctrl.ListCtrl = new PageListController(this.config?.httpConfig);
     ctrl.ListCtrl.setCrudPrefix("/h5")
     ctrl.createPromotion = this.actions.createPromotion;
+    ctrl.onMenuClick = async (name, record) => {
+      if(name == "delete") {
+       await this.actions.deletePromotion(record);
+       ctrl.ListCtrl.fresh();
+      }
+    }
 
     return ctrl;
   },

+ 5 - 3
src/pages/queentree/router.ts

@@ -3,11 +3,13 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: "/selmat",
     name: "home",
-    // meta: {
-    //   needAuth: true,
-    // },
     component: () => import("./selectMat"),
   },
+  {
+    path: "/selpackscene",
+    name: "selpackscene",
+    component: () => import("./selectPackScene"),
+  },
 ];
 
 const router = createRouter({

+ 1 - 1
src/pages/queentree/selectMat.tsx

@@ -8,7 +8,7 @@ export default defineComponent({
 
     return () =>(
         <div class={rootStyles}>
-            <LibraryModal nodeTypes={["matGroupItem", "mat", "packMat"]} />
+            <LibraryModal title="选择材质球" nodeTypes={["matGroupItem", "mat", "packMat"]} apiName="selmatblack"/>
         </div>
         
         // <div>hello</div>

+ 19 - 0
src/pages/queentree/selectPackScene.tsx

@@ -0,0 +1,19 @@
+import { computed, defineComponent, reactive } from "vue";
+import LibraryModal from "../website/CreateMat/components/LibraryModal";
+import { css, cx } from "@linaria/core";
+
+export default defineComponent({
+  setup() {
+    return () =>(
+        <div class={rootStyles}>
+            <LibraryModal title="选择模型包场景" nodeTypes={["packItem"]} apiName="selpacksceneblack" />
+        </div>
+      );
+  },
+});
+
+const rootStyles = css`
+  > div {
+    margin: unset !important;
+  }
+`;

+ 40 - 0
src/pages/website/CreateMat/components/AttrPanel/BaseInfo.tsx

@@ -0,0 +1,40 @@
+import { css } from "@linaria/core";
+import { useImage } from "@queenjs/use";
+import { defineUI } from "queenjs";
+import { object } from "vue-types";
+
+export const BaseInfo = defineUI({
+  props: {
+    data: object().def({}),
+  },
+  setup(props) {
+    const bgImg = useImage(() => props.data.thumbnail || { url: "" });
+
+    return () => {
+      return (
+        <div class={baseInfoStyle}>
+          <div class="baseInfo_thumbnail">
+            <img class="w-1/1 h-1/1 object-cover" src={bgImg.url} />
+          </div>
+          <div class="flex-1">
+            <div>{props.data.name || "未命名"}</div>
+            <div>{`编号:${props.data.cusNum || "未命名"}`}</div>
+          </div>
+        </div>
+      );
+    };
+  },
+});
+
+const baseInfoStyle = css`
+  display: flex;
+
+  .baseInfo_thumbnail {
+    position: relative;
+    width: 80px;
+    height: 80px;
+    margin-right: 14px;
+    border-radius: 2px;
+    color: #ccc;
+  }
+`;

+ 84 - 11
src/pages/website/CreateMat/components/AttrPanel/MatAttr.tsx

@@ -1,29 +1,102 @@
-import { useResource } from "@/modules/resource";
 import { useQueditor } from "@queenjs-modules/queditor";
+import FormUI, { ColumnItem } from "@queenjs/components/FormUI";
+import { set } from "lodash";
 import { defineUI } from "queenjs";
+import { any } from "vue-types";
+import { BaseInfo } from "./BaseInfo";
+
+const matColumns: ColumnItem[] = [
+  {
+    label: "缩放",
+    dataIndex: "uv.scale",
+    component: "Slider",
+    props: {
+      max: 5,
+      min: 0,
+      step: 0.1,
+    },
+  },
+  {
+    label: "X轴偏移",
+    dataIndex: "uv.offsetX",
+    component: "Slider",
+    props: {
+      max: 1,
+      min: -1,
+      step: 0.01,
+    },
+  },
+  {
+    label: "Y轴偏移",
+    dataIndex: "uv.offsetY",
+    component: "Slider",
+    props: {
+      max: 1,
+      min: -1,
+      step: 0.01,
+    },
+  },
+  {
+    label: "旋转",
+    dataIndex: "uv.rotate",
+    component: "Slider",
+    props: {
+      max: 360,
+      min: 0,
+    },
+  },
+  {
+    label: "金属度",
+    dataIndex: "metalness.factor",
+    component: "Slider",
+    props: {
+      max: 1,
+      min: 0,
+      step: 0.01,
+    },
+  },
+  {
+    label: "粗糙度",
+    dataIndex: "roughness.factor",
+    component: "Slider",
+    props: {
+      max: 1,
+      min: 0,
+      step: 0.01,
+    },
+  },
+];
 
 export default defineUI({
-  setup() {
-    const resource = useResource();
+  props: {
+    data: any(),
+  },
+  setup(props) {
     const queditor = useQueditor();
 
-    queditor.actions.on("updateCurrPackFormData:success", () => {
-      const matConf = resource.store.matSlots.find(
-        (item) => item.id == resource.store.activeKeys.id
+    function changeVal(e: { dataIndex: string; value: any }) {
+      set(props.data, e.dataIndex, e.value);
+      queditor.actions.updateCurrPackFormData(
+        queditor.store.currActiveMat,
+        e.dataIndex,
+        e.value,
+        { combine: true }
       );
-      if (matConf) {
-        matConf.material = queditor.store.currActiveMat;
-      }
-    });
+    }
 
     return () => {
+      const { data } = props;
       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>
           <div class="px-15px py-15px flex-1 overflow-y-auto scrollbar">
-            <queditor.components.Panel.CurrEdit />
+            <BaseInfo data={data} />
+            <div class="border-bottom my-16px"></div>
+            <div class="-mx-15px">
+              <FormUI data={data} columns={matColumns} onChange={changeVal} />
+            </div>
           </div>
         </div>
       );

+ 9 - 4
src/pages/website/CreateMat/components/AttrPanel/MeshAttr.tsx

@@ -3,8 +3,9 @@ import { useQueditor } from "@queenjs-modules/queditor";
 import FormUI, { ColumnItem } from "@queenjs/components/FormUI";
 import { set } from "lodash";
 import { defineUI } from "queenjs";
+import { any } from "vue-types";
 
-const bgColumns: ColumnItem[] = [
+const meshColumns: ColumnItem[] = [
   {
     label: "缩放",
     dataIndex: "background.image",
@@ -35,22 +36,26 @@ const bgColumns: ColumnItem[] = [
 ];
 
 export default defineUI({
-  setup() {
+  props: {
+    data: any(),
+  },
+  setup(props) {
     const resource = useResource();
     const queditor = useQueditor();
 
     function changeVal(e: { dataIndex: string; value: any }) {
-      set({}, e.dataIndex, e.value);
+      set(props.data, e.dataIndex, e.value);
     }
 
     return () => {
+      const { data } = props;
       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>
           <div class="py-15px flex-1 overflow-y-auto scrollbar">
-            <FormUI data={{}} columns={bgColumns} onChange={changeVal} />
+            <FormUI data={data} columns={meshColumns} onChange={changeVal} />
           </div>
         </div>
       );

+ 6 - 14
src/pages/website/CreateMat/components/AttrPanel/index.tsx

@@ -3,30 +3,22 @@ import { useQueditor } from "@queenjs-modules/queditor";
 import { Empty } from "ant-design-vue";
 import { defineUI } from "queenjs";
 import MatAttr from "./MatAttr";
-import { upperFirst } from "lodash";
 import MeshAttr from "./MeshAttr";
 
 export default defineUI({
-  slots: {
-    MatAttr,
-    MeshAttr,
-  },
-  setup(props, { slots }) {
+  setup() {
     const resource = useResource();
     const queditor = useQueditor();
 
     return () => {
-      console.error(resource.store.currentSlot);
       const { activeKeys } = resource.store;
       if (!resource.store.currentSlot)
         return <Empty class="pt-80px" description="暂无数据" />;
-      else {
-        const CurrComp = (slots as any)[`${upperFirst(activeKeys.type)}Attr`];
-        return (
-          <CurrComp
-          // data={resource.store.currentSlot}
-          />
-        );
+      else if (activeKeys.type == "mat") {
+        const data = resource.store.currentSlot.material;
+        return <MatAttr data={data} />;
+      } else if (activeKeys.type == "mesh") {
+        return <MeshAttr data={{}} />;
       }
     };
   },

+ 48 - 16
src/pages/website/CreateMat/components/LibraryModal.tsx

@@ -1,6 +1,7 @@
 import { BusController } from "@/controllers/natsController";
 import { TreeController } from "@/controllers/queentreeController";
 import "@/modules/_default/viewerStorage";
+import { useQueditor } from "@queenjs-modules/queditor";
 import {
   initQueentreeExplorer,
   NodeTypes,
@@ -10,15 +11,19 @@ import PickNodeStep from "@queenjs-modules/queentree-explorer/components/PickNod
 import { StepController } from "@queenjs-modules/queentree-explorer/components/PickNodeSteps/StepController";
 import { Exception, useModal } from "queenjs";
 import { defineComponent } from "vue";
-import { array } from "vue-types";
+import { array, string } from "vue-types";
 
 export default defineComponent({
   props: {
     nodeTypes: array<NodeTypes>().def(["packProd"]),
+    apiName: string().isRequired,
+    title:string().isRequired,
   },
 
   setup(props) {
-    document.title = "选择材质球";
+    
+    document.title = props.title || "queentree选择资源";
+    const queditor = useQueditor();
 
     const stepCtrol = new StepController(1);
     // const modal = useModal();
@@ -33,33 +38,61 @@ export default defineComponent({
       },
     });
 
+    // 获取Pack中场景相关的资源
+  function getRelatedSourceByScene(
+    pack: any,
+    sceneId: any
+  ) {
+    
+    const packNew = {...pack};
+    const scenes = packNew.scenes.filter((item:any)=>item.id==sceneId);
+    packNew.scenes = scenes;
+    return packNew;
+  }
+
     async function submit() {
      try {
-        const branchFolder = stepCtrol.state.data.pickNodes[0];
-        const pack = await branchFolder.getAssetDetail();
+        const pickedNode = stepCtrol.state.data.pickNodes[0];
+        const pack = await pickedNode.getAssetDetail();
 
-        let mat;
-        switch (branchFolder.nodeType) {
+        let ret;
+        switch (pickedNode.nodeType) {
           case "matGroupItem":
-            mat = pack.source.colorCards.find(
-              (d: any) => d.id == branchFolder.state.id
+            ret = pack.source.colorCards.find(
+              (d: any) => d.id == pickedNode.state.id
             );
             break;
           case "packMat":
-            mat = pack.source.mats.find(
-              (d: any) => d.id == branchFolder.state.id
+            ret = pack.source.mats.find(
+              (d: any) => d.id == pickedNode.state.id
             );
             break;
           case "mat":
-            mat = pack.source
+            ret = pack.source
             break;
-        }
-        _tree.CloseTreeOpen("selmatblack", mat)
+
+          case "packProd":
+            ret = queditor.helper.getRelatedSourceByProduct(
+              pack.source as any,
+              pickedNode.state.id
+            );
+            break;
+          case "packItem":
+            ret = getRelatedSourceByScene(
+              pack.source as any,
+              pickedNode.state.id
+            );
+            break;
+        }        
+        console.log( props.apiName, ret);
+        
+        _tree.CloseTreeOpen(props.apiName, ret)
+
         return;
       } catch (error: any) {
         Exception.error(error?.toString());
       }
-      _tree.CloseTreeOpen("selmatblack")
+      _tree.CloseTreeOpen(props.apiName)
     }
     
     return () => {
@@ -69,7 +102,7 @@ export default defineComponent({
           onSubmit={submit}
           onCancel={() =>{
             console.log("cancel")
-            _tree.CloseTreeOpen("selmatblack");
+            _tree.CloseTreeOpen(props.apiName);
           }}
           control={stepCtrol}
           lastStepText="确定"
@@ -81,7 +114,6 @@ export default defineComponent({
                   control={stepCtrol}
                   options={{
                     nodeTypes: nodeTypes,
-                    //   childNodeType: "packProd",
                   }}
                 />
               ),

+ 30 - 16
src/pages/website/CreateMat/components/TreePanel/index.tsx

@@ -2,10 +2,8 @@ import { useResource } from "@/modules/resource";
 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 { List } from "@queenjs/ui";
 import { defineComponent } from "vue";
-import LibraryModal from "../LibraryModal";
 import MatItem from "./MatItem";
 import MeshItem from "./MeshItem";
 
@@ -15,16 +13,22 @@ export default defineComponent({
     const resource = useResource();
     const { store } = resource;
 
-    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
+    const replaceMesh = async (record: any) => {
+      const data = await resource.treeController.selectOnePackScene();
+      if (!data) return;
+
+      const slotId = record.Id || record.id;
+      const meshConf = resource.store.meshSlots.find(
+        (item) => item.id == slotId
       );
+      if (meshConf) {
+        meshConf.pack = data;
+      } else {
+        const meshSlot = { id: slotId, pack: data };
+        resource.store.meshSlots.push(meshSlot);
+      }
+      console.log("replaceMesh=>", data);
+
       queditor.actions.insertMesh(data);
     };
 
@@ -76,11 +80,21 @@ export default defineComponent({
       resource.store.setActiveKey({ type: "mat", id: item.id });
     };
 
-    //     const mesh: any = resource.store.treeData.find(
-    //       (d: any) => d.meshName == queditor.store.currActiveProdComp?.name
-    //     );
-    //     if (!mesh) return;
-    //     clickMat(mesh.children[0]);
+    queditor.actions.on("initQueen3dScene:success", () => {
+      const app = queditor.controls.queen3dCtrl.queen3d.getAppInstance();
+      app.on("tap:click", (geom: any) => {
+        const compName = geom?._userdata?.name;
+        if (!compName) return;
+        const mesh: any = resource.store.treeData.find(
+          (d: any) => d.meshName == compName
+        );
+        if (!mesh) {
+          resource.store.setActiveKey({ type: "" });
+        } else {
+          clickMat(mesh.children[0]);
+        }
+      });
+    });
 
     return () => {
       const Meshlist = store.treeData || [];

+ 6 - 6
vue.config.js

@@ -7,17 +7,17 @@ const {
 } = require("@ckeditor/ckeditor5-dev-translations");
 const { styles } = require("@ckeditor/ckeditor5-dev-utils");
 
-const publicPath =
-  process.env.NODE_ENV === "production"
-    ? `//infishwaibao.oss-cn-chengdu.aliyuncs.com/queenshow/`
-    : "./";
-// const publicPath = "./";
+// const publicPath =
+//   process.env.NODE_ENV === "production"
+//     ? `//infishwaibao.oss-cn-chengdu.aliyuncs.com/queenshow/`
+//     : "./";
+const publicPath = "./";
 
 module.exports = defineConfig({
   pages: {
     index: "src/pages/website/index.ts",
     editor: "src/pages/editor/index.ts",
-    selmat: "src/pages/queentree/index.ts",
+    treeapi: "src/pages/queentree/index.ts",
   },
   publicPath: publicPath,
   transpileDependencies: [/ckeditor5-[^/\\]+[/\\]src[/\\].+\.js$/],