update

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/index.ts

@@ -38,7 +38,7 @@ 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("/tpls");
+    this.controls.renderTaskListCtrl.setCrudPrefix("/sourceGen");
     this.controls.renderTaskListCtrl.state.size = 24;
     this.controls.matTempListCtrl.setCrudPrefix("/tpls");
     this.controls.matTempListCtrl.state.size = 20;

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

@@ -40,6 +40,7 @@ export default defineComponent({
       return (
         <PickNodeSteps
           onSubmit={submit}
+          onCancel={() => modal.cancel()}
           control={stepCtrol}
           lastStepText="发送"
           steps={[

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)}
               />
             )}
           />