queenshow/src/pages/website/CreateMat/components/LibraryModal.tsx

import { BusController } from "@/controllers/natsController";
import { TreeController } from "@/controllers/queentreeController";
import "@/modules/_default/viewerStorage";
import { useQueditor } from "@queenjs-modules/queditor";
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, string } from "vue-types";

export default defineComponent({
  props: {
    nodeTypes: array<NodeTypes>().def(["packProd"]),
    apiName: string().isRequired,
    title:string().isRequired,
  },

  setup(props) {
    
    document.title = props.title || "queentree选择资源";
    const queditor = useQueditor();

    const stepCtrol = new StepController(1);
    // const modal = useModal();
    const _bus = new BusController();
    _bus.init(_bus.getQuery("bus"));
    const _tree = new TreeController(_bus);

    initQueentreeExplorer({
      config: {
        showNodeToolbar: true,
        nodeListColumns: 6,
      },
    });

    // 获取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 pickedNode = stepCtrol.state.data.pickNodes[0];
        const pack = await pickedNode.getAssetDetail();

        let ret;
        switch (pickedNode.nodeType) {
          case "matGroupItem":
            ret = pack.source.colorCards.find(
              (d: any) => d.id == pickedNode.state.id
            );
            break;
          case "packMat":
            ret = pack.source.mats.find(
              (d: any) => d.id == pickedNode.state.id
            );
            break;
          case "mat":
            ret = pack.source
            break;

          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(props.apiName)
    }
    
    return () => {
      const { nodeTypes } = props;
      return (
        <PickNodeSteps
          onSubmit={submit}
          onCancel={() =>{
            console.log("cancel")
            _tree.CloseTreeOpen(props.apiName);
          }}
          control={stepCtrol}
          lastStepText="确定"
          steps={[
            {
              title: "选择",
              content: () => (
                <PickNodeStep
                  control={stepCtrol}
                  options={{
                    nodeTypes: nodeTypes,
                  }}
                />
              ),
            },
          ]}
        />
      );
    };
  },
});