diff --git a/assets/NJ_YueDuJiaYouZhan/audios/OPW_SB1_Disc1_Track01.mp3 b/assets/NJ_YueDuJiaYouZhan/audios/OPW_SB1_Disc1_Track01.mp3
new file mode 100644
index 0000000000000000000000000000000000000000..d8e584ba65f4d0ddf8d1c03a37d1a3aa457a1e9e
Binary files /dev/null and b/assets/NJ_YueDuJiaYouZhan/audios/OPW_SB1_Disc1_Track01.mp3 differ
diff --git a/assets/NJ_YueDuJiaYouZhan/audios/OPW_SB1_Disc1_Track01.mp3.meta b/assets/NJ_YueDuJiaYouZhan/audios/OPW_SB1_Disc1_Track01.mp3.meta
new file mode 100644
index 0000000000000000000000000000000000000000..ee8131bb7918a147a056e6cf7fc35d939dace599
--- /dev/null
+++ b/assets/NJ_YueDuJiaYouZhan/audios/OPW_SB1_Disc1_Track01.mp3.meta
@@ -0,0 +1,7 @@
+{
+  "ver": "2.0.1",
+  "uuid": "90f94989-cb3e-49e2-9452-757d066f2144",
+  "downloadMode": 0,
+  "duration": 19.435102,
+  "subMetas": {}
+}
\ No newline at end of file
diff --git a/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.fire b/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.fire
index d0636a0a8824ad0a6c55a224c74eabc28645906e..cf584111cee02b36717f22a6776b9f86873b6ce0 100644
--- a/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.fire
+++ b/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.fire
@@ -78,13 +78,13 @@
     "_active": true,
     "_components": [
       {
-        "__id__": 29
+        "__id__": 77
       },
       {
-        "__id__": 30
+        "__id__": 78
       },
       {
-        "__id__": 31
+        "__id__": 79
       }
     ],
     "_prefab": null,
@@ -245,31 +245,34 @@
         "__id__": 6
       },
       {
-        "__id__": 9
+        "__id__": 18
       },
       {
-        "__id__": 12
+        "__id__": 30
       },
       {
-        "__id__": 15
+        "__id__": 42
       },
       {
-        "__id__": 18
+        "__id__": 54
       },
       {
-        "__id__": 21
+        "__id__": 66
       },
       {
-        "__id__": 24
+        "__id__": 69
+      },
+      {
+        "__id__": 72
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 27
+        "__id__": 75
       },
       {
-        "__id__": 28
+        "__id__": 76
       }
     ],
     "_prefab": null,
@@ -327,14 +330,24 @@
     "_parent": {
       "__id__": 5
     },
-    "_children": [],
+    "_children": [
+      {
+        "__id__": 7
+      },
+      {
+        "__id__": 10
+      },
+      {
+        "__id__": 13
+      }
+    ],
     "_active": true,
     "_components": [
       {
-        "__id__": 7
+        "__id__": 16
       },
       {
-        "__id__": 8
+        "__id__": 17
       }
     ],
     "_prefab": null,
@@ -385,12 +398,77 @@
     "groupIndex": 0,
     "_id": "fdy94CGuJJebL0i6UN62s7"
   },
+  {
+    "__type__": "cc.Node",
+    "_name": "book1",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 6
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 8
+      },
+      {
+        "__id__": 9
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -175,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "a9J2MTtFJPkre0wNsHshdv"
+  },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 6
+      "__id__": 7
     },
     "_enabled": true,
     "_materials": [
@@ -401,10 +479,10 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "73ee82cc-cc95-4a87-aaeb-1b23510cd553"
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
     },
     "_type": 0,
-    "_sizeMode": 1,
+    "_sizeMode": 0,
     "_fillType": 0,
     "_fillCenter": {
       "__type__": "cc.Vec2",
@@ -415,50 +493,91 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "484ut7LpdAwb1xQR7W/dxt"
+    "_id": "eeHpfzAHZJaLE4kDa/1qOU"
   },
   {
-    "__type__": "cc.Widget",
+    "__type__": "cc.Button",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 6
+      "__id__": 7
     },
     "_enabled": true,
-    "alignMode": 1,
-    "_target": null,
-    "_alignFlags": 44,
-    "_left": 261,
-    "_right": 261,
-    "_top": 5.783999999999992,
-    "_bottom": 56,
-    "_verticalCenter": 0,
-    "_horizontalCenter": 0,
-    "_isAbsLeft": true,
-    "_isAbsRight": true,
-    "_isAbsTop": true,
-    "_isAbsBottom": true,
-    "_isAbsHorizontalCenter": true,
-    "_isAbsVerticalCenter": true,
-    "_originalWidth": 758,
-    "_originalHeight": 658,
-    "_id": "07THWDGGZAipiEgNUBeRP+"
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "daojXCoExOKaQbPAFTF7g3"
   },
   {
     "__type__": "cc.Node",
-    "_name": "L2",
+    "_name": "book2",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 5
+      "__id__": 6
     },
     "_children": [],
     "_active": true,
     "_components": [
       {
-        "__id__": 10
+        "__id__": 11
       },
       {
-        "__id__": 11
+        "__id__": 12
       }
     ],
     "_prefab": null,
@@ -472,8 +591,2524 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 758,
-      "height": 654
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -3,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "b7mU2bFddGKpz1zZi9DOhi"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 10
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "43Vhzl7zRJuaonqz9sUZ3V"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 10
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "02mVtZWU1FgZRMlIC6u/i2"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book3",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 6
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 14
+      },
+      {
+        "__id__": 15
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        169,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "2fh7Vut7RDca42IM6hO13B"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 13
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "e1ltvoiopI5pD9zf2aAu6m"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 13
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "3aRHFAq+ROE748l692CgKw"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 6
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "73ee82cc-cc95-4a87-aaeb-1b23510cd553"
+    },
+    "_type": 0,
+    "_sizeMode": 1,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "484ut7LpdAwb1xQR7W/dxt"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 6
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 44,
+    "_left": 261,
+    "_right": 261,
+    "_top": 5.783999999999992,
+    "_bottom": 56,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 758,
+    "_originalHeight": 658,
+    "_id": "07THWDGGZAipiEgNUBeRP+"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "L2",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 5
+    },
+    "_children": [
+      {
+        "__id__": 19
+      },
+      {
+        "__id__": 22
+      },
+      {
+        "__id__": 25
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 28
+      },
+      {
+        "__id__": 29
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 758,
+      "height": 654
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        4000,
+        25,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "f4lt3B7w1KS6z0pujvvqW8"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book1",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 18
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 20
+      },
+      {
+        "__id__": 21
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -175,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "fdwFVIOKND4KCiiWxXuRCi"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 19
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "56mNI2z5VCoqqLlGYccw7W"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 19
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "f51W51IetAjLwT3LquyIBp"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book2",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 18
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 23
+      },
+      {
+        "__id__": 24
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -3,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "f5RD99HHBE3YOI4GWX9HmE"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 22
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "9esUcYeMhP67lY8seQFSNq"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 22
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "e33PAvlqhBMYLaKUOU+Tkm"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book3",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 18
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 26
+      },
+      {
+        "__id__": 27
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        169,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "768w65+sVAsZ2qB+OWscGb"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 25
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "d3X/rBWFxBvLqDgnO5ZxeR"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 25
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "341gk0W/lGgqSwIjSNrwAR"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 18
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "c05bf4f2-9a22-42bb-b96a-2c42af2bff94"
+    },
+    "_type": 0,
+    "_sizeMode": 1,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "e8/bKe8khIm5owbGqKU2SM"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 18
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 44,
+    "_left": 4261,
+    "_right": -3739,
+    "_top": 0,
+    "_bottom": 58,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 758,
+    "_originalHeight": 0,
+    "_id": "0fEyIAf7xC15e3sRmX1PQY"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "L3",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 5
+    },
+    "_children": [
+      {
+        "__id__": 31
+      },
+      {
+        "__id__": 34
+      },
+      {
+        "__id__": 37
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 40
+      },
+      {
+        "__id__": 41
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 758,
+      "height": 663
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        4000,
+        25,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "bcUe2b05pJpZ/iWGCwATKw"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book1",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 30
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 32
+      },
+      {
+        "__id__": 33
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -175,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "4d84JF1dNFdp4B10yFTWhk"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 31
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "5fIzJd7xJEopBpzWnb3RCO"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 31
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "62VlTLX6JBw6zGfkL6QOJr"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book2",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 30
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 35
+      },
+      {
+        "__id__": 36
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -3,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "0e7oLyGzdBq4U6Ce2dScle"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 34
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "04J0kYmrBNaKEOi/KKZkfl"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 34
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "14qwc/5FBFt50slQTbEikM"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book3",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 30
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 38
+      },
+      {
+        "__id__": 39
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        169,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "4flbh9PIdJ2IRPfONIZKuC"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 37
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "f4Qb8AKDdORLiQS6W0LO8F"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 37
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "4eXdShNnBCR4TgBsAvX0zZ"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 30
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "c7f0e5e8-9863-4a07-bc17-728bc32aa3aa"
+    },
+    "_type": 0,
+    "_sizeMode": 1,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "beHq9/TI9GdYQp5+HfdCLb"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 30
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 44,
+    "_left": 4261,
+    "_right": -3739,
+    "_top": 0,
+    "_bottom": 53.5,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 758,
+    "_originalHeight": 0,
+    "_id": "d4lSBj2OVKq7de9EJc/vXX"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "L4",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 5
+    },
+    "_children": [
+      {
+        "__id__": 43
+      },
+      {
+        "__id__": 46
+      },
+      {
+        "__id__": 49
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 52
+      },
+      {
+        "__id__": 53
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 758,
+      "height": 652
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        4000,
+        25.100000000000023,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "79X54yKPpPJImkq7+/+nIt"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book1",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 42
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 44
+      },
+      {
+        "__id__": 45
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -175,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "ad2RLaxedFg5L5mYxj5bAj"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 43
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "2aTMuiVQ9CpZyrvXWAzEwM"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 43
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "4eAnOLNIhPmbTa791fabhq"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book2",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 42
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 47
+      },
+      {
+        "__id__": 48
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -3,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "e0Sc3ZfVtMz7Qe0ULmOjw/"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 46
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "a8LqcSDrhDzbeKgBCWQnni"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 46
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "d4swJRbzxOBYvGqIXQSbaW"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book3",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 42
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 50
+      },
+      {
+        "__id__": 51
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        169,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "48zLfexLVJdJS4h1Vu7sXW"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 49
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "571UuYsRZNOZ+98LjuiDDS"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 49
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "0abA+06s1Hl5/aLD3WZhHp"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 42
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "6151ff0a-a839-42c0-a350-799d435d48e1"
+    },
+    "_type": 0,
+    "_sizeMode": 1,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "7ap36dY3xGNpWw5UUzsTt/"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 42
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 44,
+    "_left": 4261,
+    "_right": -3739,
+    "_top": 0,
+    "_bottom": 59.10000000000002,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 758,
+    "_originalHeight": 0,
+    "_id": "6bADrYUGhKGqLkqvUeg1To"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "L5",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 5
+    },
+    "_children": [
+      {
+        "__id__": 55
+      },
+      {
+        "__id__": 58
+      },
+      {
+        "__id__": 61
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 64
+      },
+      {
+        "__id__": 65
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 758,
+      "height": 651
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        4000,
+        21.5,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "4fc7tUSV9FF6SK45Eaw8DM"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book1",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 54
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 56
+      },
+      {
+        "__id__": 57
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -175,
+        51,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "6a5yC2LIdH6q74wy1ioHfe"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 55
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "e0ibi7tFlAM6s8iSbJPEnM"
+  },
+  {
+    "__type__": "cc.Button",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 55
+    },
+    "_enabled": true,
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "fecOwE+1FFxJgz4+XNic7S"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "book2",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 54
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 59
+      },
+      {
+        "__id__": 60
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 180
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -484,8 +3119,8 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        4000,
-        25,
+        -3,
+        51,
         0,
         0,
         0,
@@ -507,14 +3142,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "f4lt3B7w1KS6z0pujvvqW8"
+    "_id": "41o2ZJP7lCkr3299ezTR8i"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 9
+      "__id__": 58
     },
     "_enabled": true,
     "_materials": [
@@ -525,10 +3160,10 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "c05bf4f2-9a22-42bb-b96a-2c42af2bff94"
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
     },
     "_type": 0,
-    "_sizeMode": 1,
+    "_sizeMode": 0,
     "_fillType": 0,
     "_fillCenter": {
       "__type__": "cc.Vec2",
@@ -539,50 +3174,91 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "e8/bKe8khIm5owbGqKU2SM"
+    "_id": "acCbMlHm1NN5yMEUpdo7+B"
   },
   {
-    "__type__": "cc.Widget",
+    "__type__": "cc.Button",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 9
+      "__id__": 58
     },
     "_enabled": true,
-    "alignMode": 1,
-    "_target": null,
-    "_alignFlags": 44,
-    "_left": 4261,
-    "_right": -3739,
-    "_top": 0,
-    "_bottom": 58,
-    "_verticalCenter": 0,
-    "_horizontalCenter": 0,
-    "_isAbsLeft": true,
-    "_isAbsRight": true,
-    "_isAbsTop": true,
-    "_isAbsBottom": true,
-    "_isAbsHorizontalCenter": true,
-    "_isAbsVerticalCenter": true,
-    "_originalWidth": 758,
-    "_originalHeight": 0,
-    "_id": "0fEyIAf7xC15e3sRmX1PQY"
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
+    },
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "23J/bgYKRFD6/3eYe72Hq2"
   },
   {
     "__type__": "cc.Node",
-    "_name": "L3",
+    "_name": "book3",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 5
+      "__id__": 54
     },
     "_children": [],
     "_active": true,
     "_components": [
       {
-        "__id__": 13
+        "__id__": 62
       },
       {
-        "__id__": 14
+        "__id__": 63
       }
     ],
     "_prefab": null,
@@ -596,8 +3272,8 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 758,
-      "height": 663
+      "width": 150,
+      "height": 180
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -608,8 +3284,8 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        4000,
-        25,
+        169,
+        51,
         0,
         0,
         0,
@@ -631,14 +3307,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "bcUe2b05pJpZ/iWGCwATKw"
+    "_id": "6eQZRI08FFobCR9V8pBaMH"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 12
+      "__id__": 61
     },
     "_enabled": true,
     "_materials": [
@@ -649,10 +3325,10 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "c7f0e5e8-9863-4a07-bc17-728bc32aa3aa"
+      "__uuid__": "8cdb44ac-a3f6-449f-b354-7cd48cf84061"
     },
     "_type": 0,
-    "_sizeMode": 1,
+    "_sizeMode": 0,
     "_fillType": 0,
     "_fillCenter": {
       "__type__": "cc.Vec2",
@@ -663,106 +3339,82 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "beHq9/TI9GdYQp5+HfdCLb"
+    "_id": "4fgcUZM/tIdJpLAkmT6+jo"
   },
   {
-    "__type__": "cc.Widget",
+    "__type__": "cc.Button",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 12
+      "__id__": 61
     },
     "_enabled": true,
-    "alignMode": 1,
-    "_target": null,
-    "_alignFlags": 44,
-    "_left": 4261,
-    "_right": -3739,
-    "_top": 0,
-    "_bottom": 53.5,
-    "_verticalCenter": 0,
-    "_horizontalCenter": 0,
-    "_isAbsLeft": true,
-    "_isAbsRight": true,
-    "_isAbsTop": true,
-    "_isAbsBottom": true,
-    "_isAbsHorizontalCenter": true,
-    "_isAbsVerticalCenter": true,
-    "_originalWidth": 758,
-    "_originalHeight": 0,
-    "_id": "d4lSBj2OVKq7de9EJc/vXX"
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "L4",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 5
-    },
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 16
-      },
-      {
-        "__id__": 17
-      }
-    ],
-    "_prefab": null,
-    "_opacity": 255,
-    "_color": {
+    "_normalMaterial": null,
+    "_grayMaterial": null,
+    "duration": 0.1,
+    "zoomScale": 1.2,
+    "clickEvents": [],
+    "_N$interactable": true,
+    "_N$enableAutoGrayEffect": false,
+    "_N$transition": 0,
+    "transition": 0,
+    "_N$normalColor": {
       "__type__": "cc.Color",
       "r": 255,
       "g": 255,
       "b": 255,
       "a": 255
     },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 758,
-      "height": 652
+    "_N$pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
     },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
+    "pressedColor": {
+      "__type__": "cc.Color",
+      "r": 211,
+      "g": 211,
+      "b": 211,
+      "a": 255
     },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        4000,
-        25.100000000000023,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
+    "_N$hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
     },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
+    "hoverColor": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
     },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": "79X54yKPpPJImkq7+/+nIt"
+    "_N$disabledColor": {
+      "__type__": "cc.Color",
+      "r": 124,
+      "g": 124,
+      "b": 124,
+      "a": 255
+    },
+    "_N$normalSprite": null,
+    "_N$pressedSprite": null,
+    "pressedSprite": null,
+    "_N$hoverSprite": null,
+    "hoverSprite": null,
+    "_N$disabledSprite": null,
+    "_N$target": null,
+    "_id": "ceAMIEZYhC/ZICHIf01HRX"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 15
+      "__id__": 54
     },
     "_enabled": true,
     "_materials": [
@@ -773,7 +3425,7 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "6151ff0a-a839-42c0-a350-799d435d48e1"
+      "__uuid__": "6784fe91-2825-4714-93a4-17fdf3136770"
     },
     "_type": 0,
     "_sizeMode": 1,
@@ -787,14 +3439,14 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "7ap36dY3xGNpWw5UUzsTt/"
+    "_id": "aa946bn2lEqZo267Nqperc"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 15
+      "__id__": 54
     },
     "_enabled": true,
     "alignMode": 1,
@@ -803,7 +3455,7 @@
     "_left": 4261,
     "_right": -3739,
     "_top": 0,
-    "_bottom": 59.10000000000002,
+    "_bottom": 56,
     "_verticalCenter": 0,
     "_horizontalCenter": 0,
     "_isAbsLeft": true,
@@ -814,23 +3466,23 @@
     "_isAbsVerticalCenter": true,
     "_originalWidth": 758,
     "_originalHeight": 0,
-    "_id": "6bADrYUGhKGqLkqvUeg1To"
+    "_id": "96t8kRxu1CVqkSs7uNhULW"
   },
   {
     "__type__": "cc.Node",
-    "_name": "L5",
+    "_name": "left",
     "_objFlags": 0,
     "_parent": {
       "__id__": 5
     },
     "_children": [],
-    "_active": true,
+    "_active": false,
     "_components": [
       {
-        "__id__": 19
+        "__id__": 67
       },
       {
-        "__id__": 20
+        "__id__": 68
       }
     ],
     "_prefab": null,
@@ -844,8 +3496,8 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 758,
-      "height": 651
+      "width": 97,
+      "height": 83
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -856,8 +3508,8 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        4000,
-        21.5,
+        -495,
+        35,
         0,
         0,
         0,
@@ -879,14 +3531,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "4fc7tUSV9FF6SK45Eaw8DM"
+    "_id": "eeEy3oiwZCnq6hGOreHlWY"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 18
+      "__id__": 66
     },
     "_enabled": true,
     "_materials": [
@@ -897,7 +3549,7 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "6784fe91-2825-4714-93a4-17fdf3136770"
+      "__uuid__": "b54dc5ad-f87a-4546-902a-7489f01aefab"
     },
     "_type": 0,
     "_sizeMode": 1,
@@ -911,23 +3563,23 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "aa946bn2lEqZo267Nqperc"
+    "_id": "04frnoIpRMNZ6B26DyGhav"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 18
+      "__id__": 66
     },
     "_enabled": true,
     "alignMode": 1,
     "_target": null,
-    "_alignFlags": 44,
-    "_left": 4261,
-    "_right": -3739,
-    "_top": 0,
-    "_bottom": 56,
+    "_alignFlags": 12,
+    "_left": 96.5,
+    "_right": 0,
+    "_top": 283.5,
+    "_bottom": 353.5,
     "_verticalCenter": 0,
     "_horizontalCenter": 0,
     "_isAbsLeft": true,
@@ -936,25 +3588,25 @@
     "_isAbsBottom": true,
     "_isAbsHorizontalCenter": true,
     "_isAbsVerticalCenter": true,
-    "_originalWidth": 758,
-    "_originalHeight": 0,
-    "_id": "96t8kRxu1CVqkSs7uNhULW"
+    "_originalWidth": 0,
+    "_originalHeight": 83,
+    "_id": "bckqPuJrlNW4z66BNltLcH"
   },
   {
     "__type__": "cc.Node",
-    "_name": "left",
+    "_name": "right",
     "_objFlags": 0,
     "_parent": {
       "__id__": 5
     },
     "_children": [],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
-        "__id__": 22
+        "__id__": 70
       },
       {
-        "__id__": 23
+        "__id__": 71
       }
     ],
     "_prefab": null,
@@ -968,8 +3620,8 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 97,
-      "height": 83
+      "width": 98,
+      "height": 84
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -980,7 +3632,7 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        -495,
+        475,
         35,
         0,
         0,
@@ -1003,14 +3655,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "eeEy3oiwZCnq6hGOreHlWY"
+    "_id": "28bCD+ru1Jd6lxFHiEBmmR"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 21
+      "__id__": 69
     },
     "_enabled": true,
     "_materials": [
@@ -1021,7 +3673,7 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "b54dc5ad-f87a-4546-902a-7489f01aefab"
+      "__uuid__": "a0e0bf64-61fd-4600-8e32-40232e778401"
     },
     "_type": 0,
     "_sizeMode": 1,
@@ -1035,23 +3687,23 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "04frnoIpRMNZ6B26DyGhav"
+    "_id": "81h5tyJo5OvI2doq/H6aN3"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 21
+      "__id__": 69
     },
     "_enabled": true,
     "alignMode": 1,
     "_target": null,
-    "_alignFlags": 12,
-    "_left": 96.5,
-    "_right": 0,
-    "_top": 283.5,
-    "_bottom": 353.5,
+    "_alignFlags": 36,
+    "_left": 0,
+    "_right": 116,
+    "_top": 283,
+    "_bottom": 353,
     "_verticalCenter": 0,
     "_horizontalCenter": 0,
     "_isAbsLeft": true,
@@ -1061,12 +3713,12 @@
     "_isAbsHorizontalCenter": true,
     "_isAbsVerticalCenter": true,
     "_originalWidth": 0,
-    "_originalHeight": 83,
-    "_id": "bckqPuJrlNW4z66BNltLcH"
+    "_originalHeight": 84,
+    "_id": "970IOH5qhBBoOe8jBaFZ8/"
   },
   {
     "__type__": "cc.Node",
-    "_name": "right",
+    "_name": "btn_return",
     "_objFlags": 0,
     "_parent": {
       "__id__": 5
@@ -1075,10 +3727,10 @@
     "_active": true,
     "_components": [
       {
-        "__id__": 25
+        "__id__": 73
       },
       {
-        "__id__": 26
+        "__id__": 74
       }
     ],
     "_prefab": null,
@@ -1092,8 +3744,8 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 98,
-      "height": 84
+      "width": 64.2,
+      "height": 67.2
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -1104,8 +3756,8 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        475,
-        35,
+        -578,
+        302,
         0,
         0,
         0,
@@ -1127,14 +3779,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "28bCD+ru1Jd6lxFHiEBmmR"
+    "_id": "8aIpF4o5xMZpUtVpa/bE17"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 24
+      "__id__": 72
     },
     "_enabled": true,
     "_materials": [
@@ -1145,10 +3797,10 @@
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
     "_spriteFrame": {
-      "__uuid__": "a0e0bf64-61fd-4600-8e32-40232e778401"
+      "__uuid__": "55438c5a-174d-4da0-96b2-e11ea29bd18f"
     },
     "_type": 0,
-    "_sizeMode": 1,
+    "_sizeMode": 0,
     "_fillType": 0,
     "_fillCenter": {
       "__type__": "cc.Vec2",
@@ -1159,23 +3811,23 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "81h5tyJo5OvI2doq/H6aN3"
+    "_id": "6covTnFIpLFItL+ZQRLfGP"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 24
+      "__id__": 72
     },
     "_enabled": true,
     "alignMode": 1,
     "_target": null,
-    "_alignFlags": 36,
-    "_left": 0,
-    "_right": 116,
-    "_top": 283,
-    "_bottom": 353,
+    "_alignFlags": 9,
+    "_left": 29.9,
+    "_right": 0,
+    "_top": 24.4,
+    "_bottom": 0,
     "_verticalCenter": 0,
     "_horizontalCenter": 0,
     "_isAbsLeft": true,
@@ -1185,8 +3837,8 @@
     "_isAbsHorizontalCenter": true,
     "_isAbsVerticalCenter": true,
     "_originalWidth": 0,
-    "_originalHeight": 84,
-    "_id": "970IOH5qhBBoOe8jBaFZ8/"
+    "_originalHeight": 0,
+    "_id": "ebSH1GmZNP4Z0BvEZ/1k98"
   },
   {
     "__type__": "cc.Sprite",
@@ -1299,6 +3951,9 @@
       "__id__": 2
     },
     "_enabled": true,
+    "bgMusic1": {
+      "__uuid__": "90f94989-cb3e-49e2-9452-757d066f2144"
+    },
     "_id": "eaTVUpqahPfZeO9+sUI7RP"
   }
 ]
\ No newline at end of file
diff --git a/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.ts b/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.ts
index d883094f66c0313e72d5647287dc8bf2e4ba3b83..b97b8211171d70cb36ad03bdfab60709c4e76a36 100644
--- a/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.ts
+++ b/assets/NJ_YueDuJiaYouZhan/scene/NJ_YueDuJiaYouZhan.ts
@@ -1,4 +1,4 @@
-import { asyncDelay, onHomeworkFinish } from "../script/util";
+import { asyncDelay, onHomeworkFinish, asyncCallNetworkApiGet, asyncCallNetworkApiPost, buttonOnClick, jumpToCourseWare } from "../script/util";
 import { MyCocosSceneComponent } from "../script/MyCocosSceneComponent";
 
 const { ccclass, property } = cc._decorator;
@@ -6,48 +6,135 @@ const { ccclass, property } = cc._decorator;
 @ccclass
 export default class SceneComponent extends MyCocosSceneComponent {
 
+    @property(cc.AudioClip)
+    bgMusic1: cc.AudioClip = null;
+
+    async getKidInfo() {
+        const kidDataStr = await asyncCallNetworkApiGet('/api/oxford/v1/kid/info', {
+            token: cc.sys.localStorage.getItem('token')
+        });
+        if (kidDataStr) {
+            return JSON.parse(kidDataStr).data;
+        }
+        return null;
+    }
+
     addPreloadImage() {
-        // TODO 根据自己的配置预加载图片资源
     }
 
     addPreloadAudio() {
-        // TODO 根据自己的配置预加载音频资源
     }
 
     addPreloadAnima() {
 
     }
-
-    onLoadEnd() {
-        // TODO 加载完成后的逻辑写在这里, 下面的代码仅供参考
-        this.initData();
-        this.initView();
-        this.initListener();
-    }
-
     _cantouch = null;
-    initData() {
-        // 所有全局变量 默认都是null 
+    async onLoadEnd() {
         this._cantouch = true;
-    }
+        this.initListener();
 
-    initView() {
-        this.initBg();
-        this.initBtn();
-    }
+        // 浏览记录
+        this.currentIndex = this.getStoreCurrentIndex();
+        const node = cc.find(`Canvas/bg/L${this.currentIndex + 1}`);
+        node.x = 0;
 
-    initBg() {
-    }
+        const middleLayer = cc.find('middleLayer');
+        if (!middleLayer) {
+            cc.sys.localStorage.setItem('token', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6NCwicGhvbmUiOiIxNTUwMDAwMDAwMSIsInNpZ24iOiI0OTliYjg5Yy1lYjI5LTQ2M2EtYjk5ZS0zNDg2NDUwMGEyOTkiLCJpYXQiOjE2NTQ2NzY4MzMsImV4cCI6MTY1NzI2ODgzM30.MacCd_XUhvpNrMukYu8YNRVSbc-hju_WBN_FeiRACuc');
+        }
+        const kidDataStr = await asyncCallNetworkApiGet('/api/oxford/v1/kid/info', {
+            token: cc.sys.localStorage.getItem('token')
+        });
+        const kidData = JSON.parse(kidDataStr);
+        if (!kidData.data || !kidData.data.id) {
+            middleLayer.getComponent('middleLayer').showTips("用户登录失效,请重新登录");
+            middleLayer.getComponent('middleLayer').loadOnlineBundle("NJ_login");
+            return;
+        }
 
+        const btnReturn = cc.find('Canvas/bg/btn_return');
+        buttonOnClick(btnReturn, () => {
+            const middleLayer = cc.find('middleLayer');
+            if (middleLayer) {
+                middleLayer.getComponent('middleLayer').loadOnlineBundle('NJ_YouLeChang');
+            }
+        });
+        const pid = middleLayer.getComponent('middleLayer').getData('NJ_YueDuJiaYouZhan');
 
-    initBtn() {
+        const classDataStr = await asyncCallNetworkApiGet('/api/syllabus/v1/tree', {
+            pid: pid, deep: 2
+        });
+        const ballData = JSON.parse(classDataStr);
 
+        ballData.forEach((data, idx) => {
+            if (idx >= 5) {
+                console.warn('idx >= 5');
+                return;
+            }
+            const level = cc.find(`Canvas/bg/L${idx+1}`);
+            data.children.forEach((book, i) => {
+                if (i >= 3) {
+                    console.warn('book >= 3');
+                    return;
+                }
+                const bookNode = cc.find(`book${i+1}`, level);
+                bookNode.attr({syllabus_id: book.id, pid: book.pid});
+
+                buttonOnClick(bookNode, async () => {
+                    const kidInfo = await this.getKidInfo();
+                    const activeLevels = kidInfo ? kidInfo.active_levels : [];
+                    const activeItem = activeLevels.find(item => item.syllabus_id == data.id);
+                    if (middleLayer && !activeItem) {
+                        // 弹出激活码
+                        middleLayer.getComponent('middleLayer').showActiveWindow();
+                        return;
+                    }
+                    if (middleLayer) {
+                        const middleLayerComponent = middleLayer.getComponent('middleLayer');
+                        const row = book.children.find(row => row.name == '索引页');
+                        if (!row) {
+                            middleLayerComponent.showTips("未配置‘索引页’");
+                            return;
+                        }
+                        middleLayerComponent.setData('NJ_BookTable', {
+                            folderId: book.id,
+                            courseId: row.id,
+                        });
+                        jumpToCourseWare(row.id);
+                    }
+                });
+            });
+        });
+
+        // 播放背景音乐
+        cc.audioEngine.stopMusic();
+        cc.audioEngine.playMusic(this.bgMusic1, true);
     }
 
+    storeCurrentIndex() {
+        const middleLayer = cc.find('middleLayer');
+        if (!middleLayer) {
+            return;
+        }
+        const middleLayerComponent = middleLayer.getComponent('middleLayer');
+        middleLayerComponent.setData('NJ_YueDuJiaYouZhan_select_idx', this.currentIndex);
+    }
+
+    getStoreCurrentIndex() {
+        const middleLayer = cc.find('middleLayer');
+        if (!middleLayer) {
+            return 0;
+        }
+        const middleLayerComponent = middleLayer.getComponent('middleLayer');
+        const index = middleLayerComponent.getData('NJ_YueDuJiaYouZhan_select_idx');
+        return index || 0;
+    }
+
+
     currentIndex = 0;
     leftMove() {
-        const node = cc.find(`Canvas/bg/L${this.currentIndex+1}`);
-        const nextNode = cc.find(`Canvas/bg/L${this.currentIndex+2}`);
+        const node = cc.find(`Canvas/bg/L${this.currentIndex + 1}`);
+        const nextNode = cc.find(`Canvas/bg/L${this.currentIndex + 2}`);
         this._cantouch = false;
         cc.tween(node)
             .to(.3, { x: -4000 }, { easing: 'cubicInOut' })
@@ -55,9 +142,10 @@ export default class SceneComponent extends MyCocosSceneComponent {
                 cc.tween(nextNode)
                     .to(.3, { x: 0 }, { easing: 'cubicInOut' })
                     .call(() => {
-                        this.currentIndex ++;
-                        cc.find(`Canvas/bg/right`).active = this.currentIndex<4;
-                        cc.find(`Canvas/bg/left`).active = this.currentIndex>0;
+                        this.currentIndex++;
+                        this.storeCurrentIndex();
+                        cc.find(`Canvas/bg/right`).active = this.currentIndex < 4;
+                        cc.find(`Canvas/bg/left`).active = this.currentIndex > 0;
                         this._cantouch = true;
                     })
                     .start();
@@ -66,7 +154,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
     }
 
     rightMove() {
-        const node = cc.find(`Canvas/bg/L${this.currentIndex+1}`);
+        const node = cc.find(`Canvas/bg/L${this.currentIndex + 1}`);
         const beforeNode = cc.find(`Canvas/bg/L${this.currentIndex}`);
         this._cantouch = false;
         cc.tween(node)
@@ -75,9 +163,10 @@ export default class SceneComponent extends MyCocosSceneComponent {
                 cc.tween(beforeNode)
                     .to(.3, { x: 0 }, { easing: 'cubicInOut' })
                     .call(() => {
-                        this.currentIndex --;
-                        cc.find(`Canvas/bg/right`).active = this.currentIndex<4;
-                        cc.find(`Canvas/bg/left`).active = this.currentIndex>0;
+                        this.currentIndex--;
+                        this.storeCurrentIndex();
+                        cc.find(`Canvas/bg/right`).active = this.currentIndex < 4;
+                        cc.find(`Canvas/bg/left`).active = this.currentIndex > 0;
                         this._cantouch = true;
                     })
                     .start();
@@ -101,16 +190,16 @@ export default class SceneComponent extends MyCocosSceneComponent {
         const worldPoint = event.getLocation();
         const x = worldPoint.x;
         if (x > this.touchX + 100) {
-            if (this.currentIndex<=0) {
+            if (this.currentIndex <= 0) {
                 // 已经是第一个了
                 return;
             }
             console.log("======向右滑动=======");
             this.rightMove();
 
-        } 
+        }
         if (x < this.touchX - 100) {
-            if (this.currentIndex>=4) {
+            if (this.currentIndex >= 4) {
                 // 已经是最后一个了
                 return;
             }
diff --git a/assets/NJ_YueDuJiaYouZhan/script/MyCocosSceneComponent.ts b/assets/NJ_YueDuJiaYouZhan/script/MyCocosSceneComponent.ts
index 293015c9cc8c5896304cf36ceedf9d20e1bfb687..99989df0598eaf011ba64ba33c5cea795b1fe5d6 100644
--- a/assets/NJ_YueDuJiaYouZhan/script/MyCocosSceneComponent.ts
+++ b/assets/NJ_YueDuJiaYouZhan/script/MyCocosSceneComponent.ts
@@ -87,7 +87,7 @@ export class MyCocosSceneComponent extends cc.Component {
 
   preload() {
     const preloadArr = this._imageResList.concat(this._audioResList).concat(this._animaResList);
-    cc.assetManager.loadAny(preloadArr, null, null, (err, data) => {
+    cc.assetManager.loadAny(preloadArr, null, null, async (err, data) => {
 
       if (window && window["air"]) {
         // window["air"].onCourseInScreen = (next) => {
@@ -95,7 +95,7 @@ export class MyCocosSceneComponent extends cc.Component {
         //   this.onLoadEnd();
         //   next();
         // };
-        this.onLoadEnd();
+        await this.onLoadEnd();
         window["air"].hideAirClassLoading();
       } else {
         this.onLoadEnd();
diff --git a/assets/NJ_YueDuJiaYouZhan/script/util.ts b/assets/NJ_YueDuJiaYouZhan/script/util.ts
index 4a88100ddb7a6dbe49273353f09738a50a998b10..058274c0d1e8236ecd89538d10262b58acb5647e 100644
--- a/assets/NJ_YueDuJiaYouZhan/script/util.ts
+++ b/assets/NJ_YueDuJiaYouZhan/script/util.ts
@@ -71,64 +71,64 @@ export function setSprNodeMaxLen(sprNode, maxW, maxH) {
 }
 
 export function localPosTolocalPos(baseNode, targetNode) {
-	const worldPos = targetNode.parent.convertToWorldSpaceAR(cc.v2(targetNode.x, targetNode.y));
-	const localPos = baseNode.parent.convertToNodeSpaceAR(cc.v2(worldPos.x, worldPos.y));
-	return localPos;
+  const worldPos = targetNode.parent.convertToWorldSpaceAR(cc.v2(targetNode.x, targetNode.y));
+  const localPos = baseNode.parent.convertToNodeSpaceAR(cc.v2(worldPos.x, worldPos.y));
+  return localPos;
 }
 
 export function worldPosToLocalPos(worldPos, baseNode) {
-	const localPos = baseNode.parent.convertToNodeSpaceAR(cc.v2(worldPos.x, worldPos.y));
-	return localPos;
+  const localPos = baseNode.parent.convertToNodeSpaceAR(cc.v2(worldPos.x, worldPos.y));
+  return localPos;
 }
 
 export function getScaleRateBy2Node(baseNode, targetNode, maxFlag = true) {
-	const worldRect1 = targetNode.getBoundingBoxToWorld();
-	const worldRect2 = baseNode.getBoundingBoxToWorld();
+  const worldRect1 = targetNode.getBoundingBoxToWorld();
+  const worldRect2 = baseNode.getBoundingBoxToWorld();
 
-	const sx = worldRect1.width / worldRect2.width;
-	const sy = worldRect1.height / worldRect2.height;
-	if (maxFlag) {
-		return Math.max(sx, sy);
-	} else {
-		return Math.min(sx, sy);
-	}
+  const sx = worldRect1.width / worldRect2.width;
+  const sy = worldRect1.height / worldRect2.height;
+  if (maxFlag) {
+    return Math.max(sx, sy);
+  } else {
+    return Math.min(sx, sy);
+  }
 }
 
-export function getDistance (start, end){
-    var pos = cc.v2(start.x - end.x, start.y - end.y);
-    var dis = Math.sqrt(pos.x*pos.x + pos.y*pos.y);
-    return dis;
+export function getDistance(start, end) {
+  var pos = cc.v2(start.x - end.x, start.y - end.y);
+  var dis = Math.sqrt(pos.x * pos.x + pos.y * pos.y);
+  return dis;
 }
 
-export function playAudioByUrl(audio_url, cb=null) {
-	if (audio_url) {
-		cc.assetManager.loadRemote(audio_url, (err, audioClip) => {
+export function playAudioByUrl(audio_url, cb = null) {
+  if (audio_url) {
+    cc.assetManager.loadRemote(audio_url, (err, audioClip) => {
       const audioId = cc.audioEngine.play(audioClip, false, 0.8);
       if (cb) {
         cc.audioEngine.setFinishCallback(audioId, () => {
           cb();
         });
       }
-		});
-	}
+    });
+  }
 }
 
 
-export function btnClickAnima(btn, time=0.15, rate=1.05) {
+export function btnClickAnima(btn, time = 0.15, rate = 1.05) {
   btn.tmpScale = btn.scale;
   btn.on(cc.Node.EventType.TOUCH_START, () => {
     cc.tween(btn)
-      .to(time / 2, {scale: btn.scale * rate})
+      .to(time / 2, { scale: btn.scale * rate })
       .start()
   })
   btn.on(cc.Node.EventType.TOUCH_CANCEL, () => {
     cc.tween(btn)
-      .to(time / 2, {scale: btn.tmpScale})
+      .to(time / 2, { scale: btn.tmpScale })
       .start()
   })
   btn.on(cc.Node.EventType.TOUCH_END, () => {
     cc.tween(btn)
-      .to(time / 2, {scale: btn.tmpScale})
+      .to(time / 2, { scale: btn.tmpScale })
       .start()
   })
 }
@@ -179,7 +179,7 @@ export async function asyncDelay(time) {
     try {
       cc.tween(cc.find('Canvas'))
         .delay(time)
-        .call(()=>{
+        .call(() => {
           resolve(null);
         })
         .start();
@@ -191,69 +191,69 @@ export async function asyncDelay(time) {
 
 export async function asyncLoadDragonBoneAnime(node, { skeJsonData: { url: skeJsonDataUrl }, texJsonData: { url: texJsonDataUrl }, texPngData: { url: texPngDataUrl } }) {
 
-    if (!texPngDataUrl || !texJsonDataUrl || !texPngDataUrl
-        || texPngDataUrl == '' || texJsonDataUrl == '' || texPngDataUrl == '') {
-        return;
-    }
+  if (!texPngDataUrl || !texJsonDataUrl || !texPngDataUrl
+    || texPngDataUrl == '' || texJsonDataUrl == '' || texPngDataUrl == '') {
+    return;
+  }
 
-    return new Promise((resolve, reject) => {
-        if (node.animaNode) {
-            node.animaNode.removeFromParent();
+  return new Promise((resolve, reject) => {
+    if (node.animaNode) {
+      node.animaNode.removeFromParent();
+    }
+    const animaNode = new cc.Node();
+    animaNode.name = 'animaNode';
+    animaNode.parent = node;
+    animaNode.active = true;
+    node.animaNode = animaNode;
+
+    const dragonDisplay = animaNode.addComponent(dragonBones.ArmatureDisplay);
+
+    const loadTexture = new Promise((resolve, reject) => {
+      cc.assetManager.loadRemote(texPngDataUrl, (error, texture) => {
+        if (error) {
+          reject(error);
         }
-        const animaNode = new cc.Node();
-        animaNode.name = 'animaNode';
-        animaNode.parent = node;
-        animaNode.active = true;
-        node.animaNode = animaNode;
-
-        const dragonDisplay = animaNode.addComponent(dragonBones.ArmatureDisplay);
-
-        const loadTexture = new Promise((resolve, reject) => {
-            cc.assetManager.loadRemote(texPngDataUrl, (error, texture) => {
-                if (error) {
-                    reject(error);
-                }
-                resolve(texture);
-            });
-        });
+        resolve(texture);
+      });
+    });
 
-        const loadTexJsonData = new Promise((resolve, reject) => {
-            cc.assetManager.loadAny({ url: texJsonDataUrl }, (error, atlasJson) => {
-                if (error) {
-                    reject(error);
-                }
-                resolve(atlasJson);
-            });
-        });
+    const loadTexJsonData = new Promise((resolve, reject) => {
+      cc.assetManager.loadAny({ url: texJsonDataUrl }, (error, atlasJson) => {
+        if (error) {
+          reject(error);
+        }
+        resolve(atlasJson);
+      });
+    });
 
-        const loadSkeJsonData = new Promise((resolve, reject) => {
-            cc.assetManager.loadAny({ url: skeJsonDataUrl }, (error, dragonBonesJson) => {
-                if (error) {
-                    reject(error);
-                }
-                resolve(dragonBonesJson);
-            });
-        });
+    const loadSkeJsonData = new Promise((resolve, reject) => {
+      cc.assetManager.loadAny({ url: skeJsonDataUrl }, (error, dragonBonesJson) => {
+        if (error) {
+          reject(error);
+        }
+        resolve(dragonBonesJson);
+      });
+    });
 
-        Promise.all([loadTexture, loadTexJsonData, loadSkeJsonData]).then(([texture, atlasJson, dragonBonesJson]) => {
-            const atlas = new dragonBones.DragonBonesAtlasAsset();
-            atlas.atlasJson = JSON.stringify(atlasJson);
-            atlas.texture = texture;
+    Promise.all([loadTexture, loadTexJsonData, loadSkeJsonData]).then(([texture, atlasJson, dragonBonesJson]) => {
+      const atlas: any = new dragonBones.DragonBonesAtlasAsset();
+      atlas.atlasJson = JSON.stringify(atlasJson);
+      atlas.texture = texture;
 
-            const asset = new dragonBones.DragonBonesAsset();
-            asset.dragonBonesJson = JSON.stringify(dragonBonesJson);
+      const asset = new dragonBones.DragonBonesAsset();
+      asset.dragonBonesJson = JSON.stringify(dragonBonesJson);
 
-            dragonDisplay.dragonAtlasAsset = atlas;
-            dragonDisplay.dragonAsset = asset;
+      dragonDisplay.dragonAtlasAsset = atlas;
+      dragonDisplay.dragonAsset = asset;
 
-            let armatureNames = dragonBonesJson.armature.map(data => data.name);
+      let armatureNames = (<any>dragonBonesJson).armature.map(data => data.name);
 
-            if (armatureNames.length > 0) {
-                dragonDisplay.armatureName = armatureNames[0];
-            }
-            resolve(animaNode);
-        });
+      if (armatureNames.length > 0) {
+        dragonDisplay.armatureName = armatureNames[0];
+      }
+      resolve(animaNode);
     });
+  });
 }
 
 export class FireworkSettings {
@@ -411,56 +411,112 @@ export function showTrebleFirework(baseNode, rabbonList) {
   showFireworks(right);
 }
 
-export function httpHeadCall(requsetUrl: string, callback) {
-  let xhr = new XMLHttpRequest();
-  console.log("Status: Send Post Request to " + requsetUrl);
-  try {
-    xhr.onreadystatechange = () => {
-      try {
-        console.log('xhr.readyState: ', xhr.readyState);
-        if (xhr.readyState == 4) {
-          if ((xhr.status >= 200 && xhr.status < 400)) {
-            callback(true);
-          } else {
-            callback(false);
-          }
-        }
+export function onHomeworkFinish() {
+  const middleLayer = cc.find('middleLayer');
+  if (middleLayer) {
+    const middleLayerComponent = middleLayer.getComponent('middleLayer');
+    if (middleLayerComponent.role == 'student') {
+      middleLayerComponent.onHomeworkFinish(() => { });
+    }
+  } else {
+    console.log('onHomeworkFinish');
+  }
+}
 
-      } catch (e) {
-        console.log(e)
-      }
-    };
-    xhr.open("HEAD", requsetUrl, true);
-    xhr.send();
-    xhr.timeout = 15000;
-    xhr.onerror = (e) => {
-      callback(false);
-    };
-    xhr.ontimeout = (e) => {
-      callback(false);
-    };
-  } catch (e) {
-    console.log("Send Get Request error: ", e);
+export function asyncCallNetworkApiGet(apiName, data): Promise<any> {
+  return new Promise((resolve, reject) => {
+    callNetworkApiGet(apiName, data, (res => {
+      resolve(res);
+    }));
+  });
+}
+export function asyncCallNetworkApiPost(uri, data): Promise<any> {
+  return new Promise((resolve, reject) => {
+    callNetworkApiPost(uri, data, (res) => {
+      resolve(res);
+    });
+  });
+}
+
+export function callNetworkApiPost(uri, data, callBack) {
+  const middleLayer = cc.find('middleLayer')?.getComponent('middleLayer');
+  if (middleLayer) {
+    middleLayer.callNetworkApiPost(uri, data, callBack);
+    return;
+  }
+  const baseUrl = 'http://staging-openapi.iteachabc.com';
+  const xhr = new XMLHttpRequest();
+  const url = `${baseUrl}${uri}`;
+  xhr.open("POST", url, true);
+  xhr.setRequestHeader('content-type', 'application/json');
+  xhr.onreadystatechange = () => {
+    if (xhr.readyState == 4) {
+      callBack(JSON.parse(xhr.responseText));
+    }
+  }
+  xhr.send(JSON.stringify(data));
+}
+
+export function callNetworkApiGet(uri, data, callBack) {
+  const middleLayer = cc.find('middleLayer')?.getComponent('middleLayer');
+  if (middleLayer) {
+    middleLayer.callNetworkApiGet(uri, data, callBack);
+    return;
+  }
+  const baseUrl = 'http://staging-openapi.iteachabc.com';
+  let queryStr = '?';
+  const params = [];
+  for (const key in data) {
+    if (Object.hasOwnProperty.call(data, key)) {
+      params.push(`${key}=${data[key]}`);
+    }
   }
+  queryStr += params.join("&");
+  const xhr = new XMLHttpRequest();
+  xhr.onreadystatechange = () => {
+    if (xhr.readyState == 4 && (xhr.status >= 200 && xhr.status < 400)) {
+      callBack(xhr.responseText);
+    }
+  };
+  const url = `${baseUrl}${uri}${queryStr}`;
+  console.log('url = ' + url);
+  xhr.open('GET', url, true);
+  xhr.send();
 }
 
-export function onHomeworkFinish(data = "", callback = ()=>{}) {
+export function jumpToBundle(bundleName: string) {
   const middleLayer = cc.find('middleLayer');
   if (middleLayer) {
     const middleLayerComponent = middleLayer.getComponent('middleLayer');
-    middleLayerComponent.onHomeworkFinish(callback, data);
+    middleLayerComponent.loadOnlineBundle(bundleName);
   } else {
-    console.log('onHomeworkFinish', JSON.stringify(data));
+    console.log('jump to bundle: ' + bundleName);
   }
 }
 
-export function callMiddleLayerFunction(apiName: string, data: any, callback: Function) {
+export function jumpToCourseWare(courseWareId: number) {
   const middleLayer = cc.find('middleLayer');
   if (middleLayer) {
     const middleLayerComponent = middleLayer.getComponent('middleLayer');
-    middleLayerComponent.callMiddleLayerFunction(apiName, data, callback);
+    middleLayerComponent.loadOnlineCourseWare(courseWareId);
   } else {
-    console.log('callMiddleLayerFunction: ' + apiName);
+    console.log('jump to CourseWare: ' + courseWareId);
   }
 }
 
+export function buttonOnClick(button: cc.Node, callback: Function, scale = 1.0) {
+  button.on('click', () => {
+    if (button['cantClick']) {
+      return;
+    }
+    button['cantClick'] = true;
+    cc.tween(button)
+      .to(0.1, { scale: scale * 1.1 })
+      .to(0.1, { scale: scale })
+      .call(() => {
+        button['cantClick'] = false;
+        callback && callback();
+      })
+      .start();
+  });
+}
diff --git a/assets/NJ_YueDuJiaYouZhan/textures/btn_return.png b/assets/NJ_YueDuJiaYouZhan/textures/btn_return.png
new file mode 100644
index 0000000000000000000000000000000000000000..11257732a5671459c44f2423810f7a2c3dcade1e
Binary files /dev/null and b/assets/NJ_YueDuJiaYouZhan/textures/btn_return.png differ
diff --git a/assets/NJ_YueDuJiaYouZhan/textures/btn_return.png.meta b/assets/NJ_YueDuJiaYouZhan/textures/btn_return.png.meta
new file mode 100644
index 0000000000000000000000000000000000000000..8988fb1409e4c0262375a44dd80da496aa2a7855
--- /dev/null
+++ b/assets/NJ_YueDuJiaYouZhan/textures/btn_return.png.meta
@@ -0,0 +1,36 @@
+{
+  "ver": "2.3.5",
+  "uuid": "71877d61-effa-4495-acaa-306fe0f14a4a",
+  "type": "sprite",
+  "wrapMode": "clamp",
+  "filterMode": "bilinear",
+  "premultiplyAlpha": false,
+  "genMipmaps": false,
+  "packable": true,
+  "width": 107,
+  "height": 112,
+  "platformSettings": {},
+  "subMetas": {
+    "btn_return": {
+      "ver": "1.0.4",
+      "uuid": "55438c5a-174d-4da0-96b2-e11ea29bd18f",
+      "rawTextureUuid": "71877d61-effa-4495-acaa-306fe0f14a4a",
+      "trimType": "auto",
+      "trimThreshold": 1,
+      "rotated": false,
+      "offsetX": 0,
+      "offsetY": 0,
+      "trimX": 0,
+      "trimY": 0,
+      "width": 107,
+      "height": 112,
+      "rawWidth": 107,
+      "rawHeight": 112,
+      "borderTop": 0,
+      "borderBottom": 0,
+      "borderLeft": 0,
+      "borderRight": 0,
+      "subMetas": {}
+    }
+  }
+}
\ No newline at end of file