diff --git a/assets/middleLayer_for_DG/scene/middleLayer_for_DG.fire b/assets/middleLayer_for_DG/scene/middleLayer_for_DG.fire
index 7fbfbe19fa24bd9622ae1e453a4ffc5ff07ac6ae..6b355e7323e0c422e93e1f9240a384ca923a5d31 100644
--- a/assets/middleLayer_for_DG/scene/middleLayer_for_DG.fire
+++ b/assets/middleLayer_for_DG/scene/middleLayer_for_DG.fire
@@ -299,25 +299,28 @@
         "__id__": 9
       },
       {
-        "__id__": 13
+        "__id__": 21
       },
       {
-        "__id__": 15
+        "__id__": 25
       },
       {
-        "__id__": 23
+        "__id__": 27
       },
       {
-        "__id__": 25
+        "__id__": 35
+      },
+      {
+        "__id__": 37
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 37
+        "__id__": 49
       },
       {
-        "__id__": 38
+        "__id__": 50
       }
     ],
     "_prefab": null,
@@ -368,6 +371,514 @@
     "groupIndex": 0,
     "_id": "c2DZ4wlX1HzbimXNoMnVZO"
   },
+  {
+    "__type__": "cc.Node",
+    "_name": "pageProgress",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 8
+    },
+    "_children": [
+      {
+        "__id__": 10
+      },
+      {
+        "__id__": 13
+      },
+      {
+        "__id__": 16
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 19
+      },
+      {
+        "__id__": 20
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 224,
+      "g": 228,
+      "b": 215,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 1000,
+      "height": 15
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -56.139999999999986,
+        -304.762,
+        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": "22lyWzojdGH49LSi24ycI8"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "bar",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 9
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 11
+      },
+      {
+        "__id__": 12
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 71,
+      "g": 170,
+      "b": 254,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 1,
+      "height": 15
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        -500,
+        0,
+        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": "8enpco6JJPNYCSRRLsU3hn"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 10
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "a23235d1-15db-4b95-8439-a2e005bfff91"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "08YS2BS/9MA4Gj2EBcQufw"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 10
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 8,
+    "_left": 0,
+    "_right": 0,
+    "_top": 0,
+    "_bottom": 0,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 0,
+    "_originalHeight": 0,
+    "_id": "2e+2thvcdExL9jDhGY5CiR"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "stage",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 9
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 14
+      },
+      {
+        "__id__": 15
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 71,
+      "g": 170,
+      "b": 253,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 65.33,
+      "height": 31.5
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        520,
+        0,
+        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": "759eYKsRNPmaSE2PxeTWZR"
+  },
+  {
+    "__type__": "cc.Label",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 13
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_string": "Stage",
+    "_N$string": "Stage",
+    "_fontSize": 25,
+    "_lineHeight": 25,
+    "_enableWrapText": true,
+    "_N$file": null,
+    "_isSystemFontUsed": true,
+    "_spacingX": 0,
+    "_batchAsBitmap": false,
+    "_styleFlags": 0,
+    "_underlineHeight": 0,
+    "_N$horizontalAlign": 1,
+    "_N$verticalAlign": 1,
+    "_N$fontFamily": "Arial",
+    "_N$overflow": 0,
+    "_N$cacheMode": 0,
+    "_id": "52euDPsjdHeKTSv0c2MEPQ"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 13
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 32,
+    "_left": 0,
+    "_right": -85.33000000000004,
+    "_top": 0,
+    "_bottom": 0,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 0,
+    "_originalHeight": 0,
+    "_id": "cfUHIY8WxDQqgMiLWO5YoC"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "page",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 9
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 17
+      },
+      {
+        "__id__": 18
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 71,
+      "g": 170,
+      "b": 253,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 34.75,
+      "height": 31.5
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        593.784,
+        0,
+        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": "10j2YoNyJGnZloObMgCuwY"
+  },
+  {
+    "__type__": "cc.Label",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 16
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_string": "1/4",
+    "_N$string": "1/4",
+    "_fontSize": 25,
+    "_lineHeight": 25,
+    "_enableWrapText": true,
+    "_N$file": null,
+    "_isSystemFontUsed": true,
+    "_spacingX": 0,
+    "_batchAsBitmap": false,
+    "_styleFlags": 0,
+    "_underlineHeight": 0,
+    "_N$horizontalAlign": 1,
+    "_N$verticalAlign": 1,
+    "_N$fontFamily": "Arial",
+    "_N$overflow": 0,
+    "_N$cacheMode": 0,
+    "_id": "82+zkn9SJIsZy6kOKuzqCD"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 16
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 32,
+    "_left": 0,
+    "_right": -128.534,
+    "_top": 0,
+    "_bottom": 0,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 0,
+    "_originalHeight": 0,
+    "_id": "e5aX1bl0JAbJiHwczFtgEr"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 9
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "a23235d1-15db-4b95-8439-a2e005bfff91"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "acbgoDusNCT5PdXJyJ+Vlj"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 9
+    },
+    "_enabled": true,
+    "alignMode": 1,
+    "_target": null,
+    "_alignFlags": 44,
+    "_left": 83.86000000000001,
+    "_right": 196.14,
+    "_top": 0,
+    "_bottom": 47.738,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 1000,
+    "_originalHeight": 0,
+    "_id": "1dGYeHvYBG557BdCrymK1R"
+  },
   {
     "__type__": "cc.Node",
     "_name": "mask",
@@ -379,13 +890,13 @@
     "_active": false,
     "_components": [
       {
-        "__id__": 10
+        "__id__": 22
       },
       {
-        "__id__": 11
+        "__id__": 23
       },
       {
-        "__id__": 12
+        "__id__": 24
       }
     ],
     "_prefab": null,
@@ -441,7 +952,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 9
+      "__id__": 21
     },
     "_enabled": true,
     "alignMode": 2,
@@ -468,7 +979,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 9
+      "__id__": 21
     },
     "_enabled": true,
     "_normalMaterial": null,
@@ -536,7 +1047,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 9
+      "__id__": 21
     },
     "_enabled": true,
     "_materials": [
@@ -574,7 +1085,7 @@
     "_active": true,
     "_components": [
       {
-        "__id__": 14
+        "__id__": 26
       }
     ],
     "_prefab": null,
@@ -630,7 +1141,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 13
+      "__id__": 25
     },
     "_enabled": true,
     "_layoutSize": {
@@ -666,7 +1177,7 @@
     },
     "_children": [
       {
-        "__id__": 16
+        "__id__": 28
       }
     ],
     "_active": false,
@@ -724,24 +1235,24 @@
     "_name": "progress",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 15
+      "__id__": 27
     },
     "_children": [
       {
-        "__id__": 17
+        "__id__": 29
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 20
+        "__id__": 32
       },
       {
-        "__id__": 21
+        "__id__": 33
       }
     ],
     "_prefab": {
-      "__id__": 22
+      "__id__": 34
     },
     "_opacity": 255,
     "_color": {
@@ -795,17 +1306,17 @@
     "_name": "bar",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 16
+      "__id__": 28
     },
     "_children": [],
     "_active": true,
     "_components": [
       {
-        "__id__": 18
+        "__id__": 30
       }
     ],
     "_prefab": {
-      "__id__": 19
+      "__id__": 31
     },
     "_opacity": 255,
     "_color": {
@@ -859,7 +1370,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 17
+      "__id__": 29
     },
     "_enabled": true,
     "_materials": [
@@ -889,7 +1400,7 @@
   {
     "__type__": "cc.PrefabInfo",
     "root": {
-      "__id__": 16
+      "__id__": 28
     },
     "asset": {
       "__uuid__": "3d356c4d-cb23-4239-aa5f-8a913f420fa4"
@@ -902,7 +1413,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 16
+      "__id__": 28
     },
     "_enabled": true,
     "_materials": [
@@ -934,7 +1445,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 16
+      "__id__": 28
     },
     "_enabled": true,
     "_id": "3eMT/DXoJNGZT/8Z3nuTUH"
@@ -942,7 +1453,7 @@
   {
     "__type__": "cc.PrefabInfo",
     "root": {
-      "__id__": 16
+      "__id__": 28
     },
     "asset": {
       "__uuid__": "3d356c4d-cb23-4239-aa5f-8a913f420fa4"
@@ -961,7 +1472,7 @@
     "_active": false,
     "_components": [
       {
-        "__id__": 24
+        "__id__": 36
       }
     ],
     "_prefab": null,
@@ -1017,7 +1528,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 23
+      "__id__": 35
     },
     "_enabled": true,
     "_materials": [
@@ -1046,29 +1557,95 @@
   },
   {
     "__type__": "cc.Node",
-    "_name": "pageProgress",
+    "_name": "preload",
     "_objFlags": 0,
     "_parent": {
       "__id__": 8
     },
     "_children": [
       {
-        "__id__": 26
+        "__id__": 38
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 47
       },
       {
-        "__id__": 29
+        "__id__": 48
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 1280,
+      "height": 720
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        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": "09nHnHDflBQIyaDqoik/Bm"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "progress",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 37
+    },
+    "_children": [
+      {
+        "__id__": 39
       },
       {
-        "__id__": 32
+        "__id__": 42
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 35
+        "__id__": 45
       },
       {
-        "__id__": 36
+        "__id__": 46
       }
     ],
     "_prefab": null,
@@ -1117,23 +1694,23 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "22lyWzojdGH49LSi24ycI8"
+    "_id": "48UXJjCM1GJJ3fDARyj6QG"
   },
   {
     "__type__": "cc.Node",
     "_name": "bar",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 25
+      "__id__": 38
     },
     "_children": [],
     "_active": true,
     "_components": [
       {
-        "__id__": 27
+        "__id__": 40
       },
       {
-        "__id__": 28
+        "__id__": 41
       }
     ],
     "_prefab": null,
@@ -1182,14 +1759,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "8enpco6JJPNYCSRRLsU3hn"
+    "_id": "b5rB+LdONCroYbKOA4nbpC"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 26
+      "__id__": 39
     },
     "_enabled": true,
     "_materials": [
@@ -1214,14 +1791,14 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "08YS2BS/9MA4Gj2EBcQufw"
+    "_id": "a7g5G+ztlG6olc9K5DSuSZ"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 26
+      "__id__": 39
     },
     "_enabled": true,
     "alignMode": 1,
@@ -1241,23 +1818,23 @@
     "_isAbsVerticalCenter": true,
     "_originalWidth": 0,
     "_originalHeight": 0,
-    "_id": "2e+2thvcdExL9jDhGY5CiR"
+    "_id": "53a9o1Yn9HQpLAYBmDWwU0"
   },
   {
     "__type__": "cc.Node",
-    "_name": "stage",
+    "_name": "page",
     "_objFlags": 0,
     "_parent": {
-      "__id__": 25
+      "__id__": 38
     },
     "_children": [],
     "_active": true,
     "_components": [
       {
-        "__id__": 30
+        "__id__": 43
       },
       {
-        "__id__": 31
+        "__id__": 44
       }
     ],
     "_prefab": null,
@@ -1271,7 +1848,7 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 65.33,
+      "width": 36.13,
       "height": 31.5
     },
     "_anchorPoint": {
@@ -1283,7 +1860,7 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        520,
+        531.228,
         0,
         0,
         0,
@@ -1306,14 +1883,14 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "759eYKsRNPmaSE2PxeTWZR"
+    "_id": "afqx9CW1BA8KtTPd5Y5D5u"
   },
   {
     "__type__": "cc.Label",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 29
+      "__id__": 42
     },
     "_enabled": true,
     "_materials": [
@@ -1323,8 +1900,8 @@
     ],
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
-    "_string": "Stage",
-    "_N$string": "Stage",
+    "_string": "0%",
+    "_N$string": "0%",
     "_fontSize": 25,
     "_lineHeight": 25,
     "_enableWrapText": true,
@@ -1339,21 +1916,21 @@
     "_N$fontFamily": "Arial",
     "_N$overflow": 0,
     "_N$cacheMode": 0,
-    "_id": "52euDPsjdHeKTSv0c2MEPQ"
+    "_id": "a5zsZjHPBAeoh5n9eFLMKT"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 29
+      "__id__": 42
     },
     "_enabled": true,
     "alignMode": 1,
     "_target": null,
     "_alignFlags": 32,
     "_left": 0,
-    "_right": -85.33000000000004,
+    "_right": -67.35799999999995,
     "_top": 0,
     "_bottom": 0,
     "_verticalCenter": 0,
@@ -1366,79 +1943,14 @@
     "_isAbsVerticalCenter": true,
     "_originalWidth": 0,
     "_originalHeight": 0,
-    "_id": "cfUHIY8WxDQqgMiLWO5YoC"
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "page",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 25
-    },
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 33
-      },
-      {
-        "__id__": 34
-      }
-    ],
-    "_prefab": null,
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 71,
-      "g": 170,
-      "b": 253,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 34.75,
-      "height": 31.5
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        593.784,
-        0,
-        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": "10j2YoNyJGnZloObMgCuwY"
+    "_id": "1b92itqzhPjLvjWf36klzI"
   },
   {
-    "__type__": "cc.Label",
+    "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 32
+      "__id__": 38
     },
     "_enabled": true,
     "_materials": [
@@ -1448,39 +1960,38 @@
     ],
     "_srcBlendFactor": 770,
     "_dstBlendFactor": 771,
-    "_string": "1/4",
-    "_N$string": "1/4",
-    "_fontSize": 25,
-    "_lineHeight": 25,
-    "_enableWrapText": true,
-    "_N$file": null,
-    "_isSystemFontUsed": true,
-    "_spacingX": 0,
-    "_batchAsBitmap": false,
-    "_styleFlags": 0,
-    "_underlineHeight": 0,
-    "_N$horizontalAlign": 1,
-    "_N$verticalAlign": 1,
-    "_N$fontFamily": "Arial",
-    "_N$overflow": 0,
-    "_N$cacheMode": 0,
-    "_id": "82+zkn9SJIsZy6kOKuzqCD"
+    "_spriteFrame": {
+      "__uuid__": "a23235d1-15db-4b95-8439-a2e005bfff91"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": null,
+    "_id": "0fhMmhwTRC97UJG2m/WjRN"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 32
+      "__id__": 38
     },
     "_enabled": true,
     "alignMode": 1,
     "_target": null,
-    "_alignFlags": 32,
-    "_left": 0,
-    "_right": -128.534,
+    "_alignFlags": 44,
+    "_left": 83.86000000000001,
+    "_right": 196.14,
     "_top": 0,
-    "_bottom": 0,
+    "_bottom": 47.738,
     "_verticalCenter": 0,
     "_horizontalCenter": 0,
     "_isAbsLeft": true,
@@ -1489,16 +2000,16 @@
     "_isAbsBottom": true,
     "_isAbsHorizontalCenter": true,
     "_isAbsVerticalCenter": true,
-    "_originalWidth": 0,
+    "_originalWidth": 1000,
     "_originalHeight": 0,
-    "_id": "e5aX1bl0JAbJiHwczFtgEr"
+    "_id": "e7QaxmoVRHaIfvr8PWXBlX"
   },
   {
     "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 25
+      "__id__": 37
     },
     "_enabled": true,
     "_materials": [
@@ -1523,23 +2034,23 @@
     "_fillRange": 0,
     "_isTrimmedMode": true,
     "_atlas": null,
-    "_id": "acbgoDusNCT5PdXJyJ+Vlj"
+    "_id": "2b1to7ep1H3qLObFYb92az"
   },
   {
     "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 25
+      "__id__": 37
     },
     "_enabled": true,
     "alignMode": 1,
     "_target": null,
-    "_alignFlags": 44,
-    "_left": 83.86000000000001,
-    "_right": 196.14,
+    "_alignFlags": 45,
+    "_left": 0,
+    "_right": 0,
     "_top": 0,
-    "_bottom": 47.738,
+    "_bottom": 0,
     "_verticalCenter": 0,
     "_horizontalCenter": 0,
     "_isAbsLeft": true,
@@ -1548,9 +2059,9 @@
     "_isAbsBottom": true,
     "_isAbsHorizontalCenter": true,
     "_isAbsVerticalCenter": true,
-    "_originalWidth": 1000,
-    "_originalHeight": 0,
-    "_id": "1dGYeHvYBG557BdCrymK1R"
+    "_originalWidth": 1280,
+    "_originalHeight": 720,
+    "_id": "d9gF393RxHcp+zqjajtXE1"
   },
   {
     "__type__": "cc.Widget",
diff --git a/assets/middleLayer_for_DG/script/middleLayer.ts b/assets/middleLayer_for_DG/script/middleLayer.ts
index 1a78887323f3bea3f90e9c0a8cdc49748b6bedb8..312f49d836b33be694ef04147984600e371a9149 100644
--- a/assets/middleLayer_for_DG/script/middleLayer.ts
+++ b/assets/middleLayer_for_DG/script/middleLayer.ts
@@ -45,91 +45,69 @@ export default class NewClass extends middleLayerBase {
   role;
 
   // 统一释放异步资源的方法
-  onLoad() {
+  async onLoad() {
     this.preloadCount = 0;
     this.loadedCount = 0;
     initAir(this);
     this.reWriteAir();
-    // this.preloadAll();
     this.role = 'student';
   }
 
-  start() {
+  async start() {
     this.node.zIndex = 9999;
     cc.game.addPersistRootNode(this.node);
     global.middleLayer = cc.find('middleLayer').getComponent('middleLayer');
 
-    this.loadOnlineCourseWare(23075);
+    // 预加载
+    // await this.preloadAll();
+    cc.find(`middleLayer/preload`).active = false;
+
+    this.loadOnlineCourseWare(23751);
   }
 
-  preloadAll() {
+  async preloadAll() {
     if ((<any>window).preloadBundleAndSourcesFlag) {
       // 只加载一次就行了
       return;
     }
     (<any>window).preloadBundleAndSourcesFlag = true;
-    cc.find("middleLayer/ui/ProgressLabel").active = true;
-    cc.find('middleLayer/ui/loadingProgress').active = true;
     let platform = "web_desktop";
     if (cc.sys.os == cc.sys.OS_IOS) {
       platform = "ios";
     } else if (cc.sys.os == cc.sys.OS_ANDROID) {
       platform = "android";
     }
-    this.callNetworkApiGet(`/api/syllabus/v1/allbundles`, { orgid: 483, platform }, (datastr) => {
-      const data = JSON.parse(datastr);
-      if (data.rows && data.rows.length > 0) {
-        this.preloadCount += data.rows.length;
-      }
-      this.callNetworkApiGet(`/api/syllabus/v1/allresources`, { orgid: 483 }, (datastr1) => {
-        const data1 = JSON.parse(datastr1);
-        if (data1.rows && data1.rows.length > 0) {
-          this.preloadCount += data1.rows.length;
-        }
-        console.log('data.rows = ' + JSON.stringify(data.rows));
-        this.batchPreloadScene(data.rows);
-        this.preloadSource(data1.rows);
-      });
-    });
+    const datastr:any = await this.asyncCallNetworkApiGet(`/api/syllabus/v1/allbundles`, { orgid: 512, platform });
+    const data = JSON.parse(datastr);
+    if (data.rows && data.rows.length > 0) {
+      this.preloadCount += data.rows.length;
+    }
+    const datastr1:any = await this.asyncCallNetworkApiGet(`/api/syllabus/v1/allresources`, { orgid: 512 });
+    const data1 = JSON.parse(datastr1);
+    if (data1.rows && data1.rows.length > 0) {
+      this.preloadCount += data1.rows.length;
+    }
+    console.log('data.rows = ' + JSON.stringify(data.rows));
+    await this.preloadSceneAndSource(data, data1);
   }
 
-  // 测试用
-  preloadSourceImman() {
-    cc.find("middleLayer/ui/ProgressLabel").active = true;
-    cc.find('middleLayer/ui/loadingProgress').active = true;
-    this.callNetworkApiGet(`/api/courseware/v1/getresources`, { courseid: 20894 }, (datastr1) => {
-      const data1 = JSON.parse(datastr1);
-      if (data1.rows && data1.rows.length > 0) {
-        this.preloadCount += data1.rows.length;
-      }
-      this.log('data1.rows = ' + JSON.stringify(data1.rows));
-      this.preloadSource(data1.rows);
-    });
+  preloadSceneAndSource(scenes, sources) {
+    const p1 = this.batchPreloadScene(scenes.rows);
+    const p2 = this.preloadSource(sources.rows);
+    return Promise.all([p1, p2]);
   }
 
   batchPreloadScene(scenes = []) {
-    const expects = [
-      // 'op_03_2',  
-      // 'OP10_online', 
-    ];
-    const _this = this;
-    let i = 0;
-    const load = function () {
-      const scene = scenes[i];
-      if (expects.includes(scene.sceneName)) {
-        _this.loadedCount++;
-        _this.updateProcessBar();
-        i++;
-        if (i < scenes.length) {
-          setTimeout(() => {
-            load();
-          }, 1);
-        }
-        return;
-      }
-      cc.assetManager.loadBundle(scene.bondleUrl, { version: scene.version }, (err, bundle) => {
-        console.log(`${scene.bondleUrl}---场景开始loadBundle----`);
-        if (!bundle) {
+    return new Promise((resolve) => {
+      const expects = [
+        // 'op_03_2',  
+        // 'OP10_online', 
+      ];
+      const _this = this;
+      let i = 0;
+      const load = function () {
+        const scene = scenes[i];
+        if (expects.includes(scene.sceneName)) {
           _this.loadedCount++;
           _this.updateProcessBar();
           i++;
@@ -137,59 +115,87 @@ export default class NewClass extends middleLayerBase {
             setTimeout(() => {
               load();
             }, 1);
+          } else {
+            resolve();
           }
           return;
         }
-        bundle.preloadScene(scene.sceneName, () => { }, () => {
-          console.log(`${scene.sceneName}场景预加载结束`);
-          _this.loadedCount++;
-          _this.updateProcessBar();
-          i++;
-          if (i < scenes.length) {
-            setTimeout(() => {
-              load();
-            }, 1);
+        cc.assetManager.loadBundle(scene.bondleUrl, { version: scene.version }, (err, bundle) => {
+          console.log(`${scene.bondleUrl}---场景开始loadBundle----`);
+          if (!bundle) {
+            _this.loadedCount++;
+            _this.updateProcessBar();
+            i++;
+            if (i < scenes.length) {
+              setTimeout(() => {
+                load();
+              }, 1);
+            } else {
+              resolve();
+            }
+            return;
           }
+          bundle.preloadScene(scene.sceneName, () => { }, () => {
+            console.log(`${scene.sceneName}场景预加载结束`);
+            _this.loadedCount++;
+            _this.updateProcessBar();
+            i++;
+            if (i < scenes.length) {
+              setTimeout(() => {
+                load();
+              }, 1);
+            } else {
+              resolve();
+            }
+          });
         });
-      });
-    }
-
-    if (scenes && scenes.length > 0) {
-      load();
-    }
+      }
+  
+      if (scenes && scenes.length > 0) {
+        load();
+      } else {
+        resolve();
+      }
+    });
   }
 
   preloadSource(array) {
-    const rows = array || [];
-    const batchLoad = () => {
-      let tempArr = rows.splice(0, 10);
-      let len = tempArr.length;
-      for (let i = 0; i < tempArr.length; i++) {
-        cc.assetManager.loadRemote(tempArr[i], (err, texture) => {
-          if (err) {
-            console.log(err)
-          }
-          this.loadedCount++;
-          this.updateProcessBar();
-          if (i === len - 1) {
-            batchLoad();
-          }
-        });
+    return new Promise((resolve) => {
+      const rows = array || [];
+      let loadFlag = 0;
+      const batchLoad = () => {
+        let tempArr = rows.splice(0, 10);
+        let len = tempArr.length;
+        for (let i = 0; i < tempArr.length; i++) {
+          cc.assetManager.loadRemote(tempArr[i], (err, texture) => {
+            if (err) {
+              console.log(err)
+            }
+            this.loadedCount++;
+            this.updateProcessBar();
+            if (i === len - 1) {
+              batchLoad();
+            }
+            loadFlag ++;
+            if (loadFlag == rows.length) {
+              resolve();
+            }
+          });
+        }
       }
-    }
-    batchLoad();
+      batchLoad();
+    });
   }
 
   updateProcessBar() {
-    const label = cc.find("middleLayer/ui/ProgressLabel").getComponent(cc.Label);
-    const loadingProgress = cc.find('middleLayer/ui/loadingProgress');
-    label.string = `正在加载:${this.loadedCount} / ${this.preloadCount}`;
-    if (this.loadedCount > this.preloadCount * 0.99) {
-      cc.find("middleLayer/ui/ProgressLabel").active = false;
-      loadingProgress.active = false;
-      this.log("资源全部加载完成");
-    }
-    loadingProgress.getComponent(cc.ProgressBar).progress = this.loadedCount / this.preloadCount;
+    const label = cc.find("middleLayer/preload/progress/page").getComponent(cc.Label);
+    label.string = `${Math.floor(this.loadedCount/this.preloadCount*100)}%`;
+    
+    // 课件加载完成的钩子
+    const process = cc.find(`middleLayer/preload/progress`);
+    const bar = cc.find(`bar`, process);
+    const barWidth = process.width / this.preloadCount * this.loadedCount;
+    bar.width = barWidth;
   }
 
   onHomeworkFinish(callBack, data = null) {