导出excel下载完成

生成excel开发中进度 10%
修改多边形生成
2022-04-02 16:59:36 +08:00 · 2022-03-22 00:49:58 +08:00 · 2022-02-23 02:52:53 +08:00 · 2022-02-22 02:13:20 +08:00
16 changed files with 1630 additions and 1324 deletions
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
    "eslint-config-standard": "^14.1.1",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.1",
+    "file-saver": "^2.0.5",
    "global": "^4.4.0",
    "good-storage": "^1.1.1",
    "gsap": "^3.5.1",
@@ -30,6 +31,7 @@
    "postcss-px2rem-exclude": "^0.0.6",
    "postcss-viewport-units": "^0.1.6",
    "px2rem-loader": "^0.1.9",
+    "script-loader": "^0.7.2",
    "style-resources-loader": "^1.3.3",
    "swiper": "^6.2.0",
    "tinyimg-webpack-plugin": "^0.0.5",
@@ -41,7 +43,8 @@
    "vue-slider-component": "^3.2.11",
    "vuex": "^3.4.0",
    "webpack-glsl-loader": "^1.0.1",
-    "wx-jssdk": "^0.0.7"
+    "wx-jssdk": "^0.0.7",
+    "xlsx": "^0.18.4"
  },
  "devDependencies": {
    "@babel/core": "^7.13.14",
@@ -69,6 +72,7 @@
    "jsmpeg": "^1.0.0",
    "matter-js": "^0.18.0",
    "meshline": "^2.0.3",
+    "poly-decomp": "^0.3.0",
    "qrcode": "^1.4.4",
    "snapsvg-cjs": "^0.0.6",
    "stats.js": "^0.17.0",
--- a/src/assets/images/push-coin/bottom_ban.png
+++ b/src/assets/images/push-coin/bottom_ban.png
--- a/src/assets/images/push-coin/coin.png
+++ b/src/assets/images/push-coin/coin.png
--- a/src/assets/images/push-coin/pusher.png
+++ b/src/assets/images/push-coin/pusher.png
--- a/src/assets/images/push-coin/top.png
+++ b/src/assets/images/push-coin/top.png
--- a/src/page/index/Home/index.vue
+++ b/src/page/index/Home/index.vue
@@ -7,40 +7,185 @@
 * @FilePath: /xfhd-vue-scaffold/src/page/index/Home/Index.vue
 -->
 <template>
-	<div class="home">
-		<!-- <Shader class="shader"></Shader> -->
-		<div class="overlay"></div>
-		<div
-			class="page grid js_show dialog"
-			@mousedown="touchstart"
-			@mouseout="touchend"
-		>
-			<div class="page__hd" ref="header">
-				<h1 class="page__title" style="font-size: 20px">
-					Benlee's Toy
-				</h1>
-				<p class="page__desc" style="font-size: 18px">Toy list</p>
-			</div>
-			<div class="weui-grids" ref="list">
-				<div
-					@click="jump(item, $event)"
-					class="weui-grid link"
-					:class="item.active ? 'active' : ''"
-					v-for="(item, index) in menuList"
-					:key="index"
-				>
-					<div class="weui-grid__icon">
-						<span
-							class="iconfont"
-							v-html="item.fontIconCode"
-						></span>
-					</div>
-					<p class="weui-grid__label">{{ item.name }}</p>
-				</div>
-			</div>
-		</div>
-		<div class="shadow" ref="shadow" :class="shown ? 'shown' : ''"></div>
-	</div>
+    <div class="home">
+        <!-- <Shader class="shader"></Shader> -->
+        <div class="overlay"></div>
+        <div
+            class="page grid js_show dialog"
+            @mousedown="touchstart"
+            @mouseout="touchend"
+        >
+            <div class="page__hd" ref="header">
+                <h1 class="page__title" style="font-size: 20px">
+                    Benlee's Toy
+                </h1>
+                <p class="page__desc" style="font-size: 18px">Toy list</p>
+            </div>
+            <div class="weui-grids" ref="list">
+                <div
+                    @click="jump(item, $event)"
+                    class="weui-grid link"
+                    :class="item.active ? 'active' : ''"
+                    v-for="(item, index) in menuList"
+                    :key="index"
+                >
+                    <div class="weui-grid__icon">
+                        <span
+                            class="iconfont"
+                            v-html="item.fontIconCode"
+                        ></span>
+                    </div>
+                    <p class="weui-grid__label">{{ item.name }}</p>
+                </div>
+            </div>
+        </div>
+        <div class="shadow" ref="shadow" :class="shown ? 'shown' : ''"></div>
+        <div class="background">
+            <svg viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice">
+                <defs>
+                    <radialGradient
+                        id="Gradient1"
+                        cx="50%"
+                        cy="50%"
+                        fx="10%"
+                        fy="50%"
+                        r=".5"
+                    >
+                        <animate
+                            attributeName="fx"
+                            dur="34s"
+                            values="0%;3%;0%"
+                            repeatCount="indefinite"
+                        />
+                        <stop offset="0%" stop-color="#ff0" />
+                        <stop offset="100%" stop-color="#ff00" />
+                    </radialGradient>
+                    <radialGradient
+                        id="Gradient2"
+                        cx="50%"
+                        cy="50%"
+                        fx="10%"
+                        fy="50%"
+                        r=".5"
+                    >
+                        <animate
+                            attributeName="fx"
+                            dur="23.5s"
+                            values="0%;3%;0%"
+                            repeatCount="indefinite"
+                        />
+                        <stop offset="0%" stop-color="#0ff" />
+                        <stop offset="100%" stop-color="#0ff0" />
+                    </radialGradient>
+                    <radialGradient
+                        id="Gradient3"
+                        cx="50%"
+                        cy="50%"
+                        fx="50%"
+                        fy="50%"
+                        r=".5"
+                    >
+                        <animate
+                            attributeName="fx"
+                            dur="21.5s"
+                            values="0%;3%;0%"
+                            repeatCount="indefinite"
+                        />
+                        <stop offset="0%" stop-color="#f0f" />
+                        <stop offset="100%" stop-color="#f0f0" />
+                    </radialGradient>
+                </defs>
+                <rect
+                    x="0"
+                    y="0"
+                    width="100%"
+                    height="100%"
+                    fill="url(#Gradient1)"
+                >
+                    <animate
+                        attributeName="x"
+                        dur="20s"
+                        values="25%;0%;25%"
+                        repeatCount="indefinite"
+                    />
+                    <animate
+                        attributeName="y"
+                        dur="21s"
+                        values="0%;25%;0%"
+                        repeatCount="indefinite"
+                    />
+                    <animateTransform
+                        attributeName="transform"
+                        type="rotate"
+                        from="0 50 50"
+                        to="360 50 50"
+                        dur="17s"
+                        repeatCount="indefinite"
+                    />
+                </rect>
+                <rect
+                    x="0"
+                    y="0"
+                    width="100%"
+                    height="100%"
+                    fill="url(#Gradient2)"
+                >
+                    <animate
+                        attributeName="x"
+                        dur="23s"
+                        values="-25%;0%;-25%"
+                        repeatCount="indefinite"
+                    />
+                    <animate
+                        attributeName="y"
+                        dur="24s"
+                        values="0%;50%;0%"
+                        repeatCount="indefinite"
+                    />
+                    <animateTransform
+                        attributeName="transform"
+                        type="rotate"
+                        from="0 50 50"
+                        to="360 50 50"
+                        dur="18s"
+                        repeatCount="indefinite"
+                    />
+                </rect>
+                <rect
+                    x="0"
+                    y="0"
+                    width="100%"
+                    height="100%"
+                    fill="url(#Gradient3)"
+                >
+                    <animate
+                        attributeName="x"
+                        dur="25s"
+                        values="0%;25%;0%"
+                        repeatCount="indefinite"
+                    />
+                    <animate
+                        attributeName="y"
+                        dur="26s"
+                        values="0%;25%;0%"
+                        repeatCount="indefinite"
+                    />
+                    <animateTransform
+                        attributeName="transform"
+                        type="rotate"
+                        from="360 50 50"
+                        to="0 50 50"
+                        dur="19s"
+                        repeatCount="indefinite"
+                    />
+                </rect>
+            </svg>
+            <h1>
+                Rucky's<br />
+                Toy.
+            </h1>
+        </div>
+    </div>
 </template>
 <script>
 // @ is an alias to /src
@@ -48,314 +193,324 @@ import { gsap } from "gsap";
 // import Shader from "@/components/shader/index.vue";

 export default {
-	name: "Index",
-	components: {
-		// Shader,
-	},
-	data() {
-		return {
-			shown: false,
-			menuList: [
-				{
-					fontIconCode: "&#xe603;",
-					target: "Color",
-					name: "三维空间色彩粒子",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe606;",
-					target: "AR",
-					name: "AR绘制",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe605;",
-					target: "ARHit",
-					name: "AR真实空间检测",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe604;",
-					target: "Camera",
-					name: "实时合成图片",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe602;",
-					target: "HandTrack",
-					name: "手势识别",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe607;",
-					target: "Video",
-					name: "视频播放ts",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe609;",
-					target: "Curve",
-					name: "三维文字曲线运动",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe606;",
-					target: "Drawing",
-					name: "画板",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe60a;",
-					target: "ColorSort",
-					name: "颜色归类",
-					active: false,
-				},
-				{
-					fontIconCode: "&#xe60b;",
-					target: "PushCoin",
-					name: "推币游戏",
-					active: false,
-				},
-			],
-		};
-	},
-	mounted() {
-		// this.$weui.toast('即将跳转至项目列表页', {
-		//     duration: 3500,
-		//     className: "toast-warn",
-		// });
-		// setTimeout(() => {
-		//     location.href = './project-list.html'
-		// }, 3500);
-		this.initShow();
-	},
-	watch: {
-		$route: {
-			handler(to, from) {
-				console.log(to.path, from.path);
-			},
-			deep: true,
-		},
-	},
-	methods: {
-		initShow() {
-			gsap.timeline({
-				delay: window.shownIndex ? 0 : 2,
-				onComplete: () => {
-					window.shownIndex = true;
-				},
-			})
-				.fromTo(
-					this.$refs.shadow,
-					{ scale: 0, top: "45%", rotation: 0 },
-					{ scale: 10, top: "8%", rotation: 0 }
-				)
-				.fromTo(
-					this.$refs.shadow,
-					{ scale: 10 },
-					{
-						scale: 1,
-						onComplete: () => {
-							this.shown = true;
-						},
-					}
-				)
-				.fromTo(
-					this.$refs.header,
-					{ autoAlpha: 0, y: -20 },
-					{ autoAlpha: 1, y: 0 },
-					"-=.3"
-				)
-				.fromTo(
-					this.$refs.list,
-					{ autoAlpha: 0, y: -20 },
-					{ autoAlpha: 1, y: 0 },
-					"-=.2"
-				);
-		},
-		// 跳转
-		jump(item, event) {
-			// 第一个游戏
-			item.active = true;
-			this.$Utils.btnTouched(
-				event.currentTarget,
-				() => {
-					this.$router.push({
-						name: item.target,
-						params: {},
-					});
-				},
-				1.5
-			);
-		},
-		touchstart() {
-			gsap.to(this.$refs.shadow, { scale: 3 });
-		},
-		touchend() {
-			gsap.to(this.$refs.shadow, { scale: 1 });
-		},
-	},
+    name: "Index",
+    components: {
+        // Shader,
+    },
+    data() {
+        return {
+            shown: false,
+            menuList: [
+                {
+                    fontIconCode: "&#xe603;",
+                    target: "Color",
+                    name: "三维空间色彩粒子",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe606;",
+                    target: "AR",
+                    name: "AR绘制",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe605;",
+                    target: "ARHit",
+                    name: "AR真实空间检测",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe604;",
+                    target: "Camera",
+                    name: "实时合成图片",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe602;",
+                    target: "HandTrack",
+                    name: "手势识别",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe607;",
+                    target: "Video",
+                    name: "视频播放ts",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe609;",
+                    target: "Curve",
+                    name: "三维文字曲线运动",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe606;",
+                    target: "Drawing",
+                    name: "画板",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe60a;",
+                    target: "ColorSort",
+                    name: "颜色归类",
+                    active: false,
+                },
+                {
+                    fontIconCode: "&#xe60b;",
+                    target: "PushCoin",
+                    name: "推币游戏",
+                    active: false,
+                },
+            ],
+        };
+    },
+    mounted() {
+        // this.$weui.toast('即将跳转至项目列表页', {
+        //     duration: 3500,
+        //     className: "toast-warn",
+        // });
+        // setTimeout(() => {
+        //     location.href = './project-list.html'
+        // }, 3500);
+        this.initShow();
+    },
+    watch: {
+        $route: {
+            handler(to, from) {
+                console.log(to.path, from.path);
+            },
+            deep: true,
+        },
+    },
+    methods: {
+        initShow() {
+            gsap.timeline({
+                delay: window.shownIndex ? 0 : 2,
+                onComplete: () => {
+                    window.shownIndex = true;
+                },
+            })
+                .fromTo(
+                    this.$refs.shadow,
+                    { scale: 0, top: "45%", rotation: 0 },
+                    { scale: 10, top: "8%", rotation: 0 }
+                )
+                .fromTo(
+                    this.$refs.shadow,
+                    { scale: 10 },
+                    {
+                        scale: 1,
+                        onComplete: () => {
+                            this.shown = true;
+                        },
+                    }
+                )
+                .fromTo(
+                    this.$refs.header,
+                    { autoAlpha: 0, y: -20 },
+                    { autoAlpha: 1, y: 0 },
+                    "-=.3"
+                )
+                .fromTo(
+                    this.$refs.list,
+                    { autoAlpha: 0, y: -20 },
+                    { autoAlpha: 1, y: 0 },
+                    "-=.2"
+                );
+        },
+        // 跳转
+        jump(item, event) {
+            // 第一个游戏
+            item.active = true;
+            this.$Utils.btnTouched(
+                event.currentTarget,
+                () => {
+                    this.$router.push({
+                        name: item.target,
+                        params: {},
+                    });
+                },
+                1.5
+            );
+        },
+        touchstart() {
+            gsap.to(this.$refs.shadow, { scale: 3 });
+        },
+        touchend() {
+            gsap.to(this.$refs.shadow, { scale: 1 });
+        },
+    },
 };
 </script>
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="less">
 .home {
-	min-height: 100vh;
-	background: #e3e7e8;
-	color: #333;
-	// overflow: hidden;
+    min-height: 100vh;
+    background: #e3e7e8;
+    color: #333;
+    // overflow: hidden;

-	.shader {
-		visibility: hidden;
-	}
-	.overlay {
-		visibility: hidden;
-		background-color: rgba(0, 0, 0, 0.5);
-		.paLayout(0,0,100%,100%,101);
-		pointer-events: none;
-	}
-	.link {
-		cursor: pointer;
-	}
-	.shadow {
-		.paLayout(50%,80px,250px,250px,1);
-		margin-left: -125px;
-		border-radius: 100%;
-		box-shadow: 20px 20px 60px #03a9f4, -20px -20px 60px #f441a5,
-			20px -20px 60px #ffeb3b, -20px 20px 60px #03a9f4,
-			-50px -50px 100px #d3c1f8 inset, 50px 50px 100px #f441a5 inset,
-			-50px 50px 100px #ffeb3b inset, 50px -50px 100px #c2c6fd inset;
-		filter: blur(20px);
+    .shader {
+        visibility: hidden;
+    }
+    .overlay {
+        visibility: hidden;
+        background-color: rgba(0, 0, 0, 0.5);
+        .paLayout(0,0,100%,100%,101);
+        pointer-events: none;
+    }
+    .link {
+        cursor: pointer;
+    }
+    .shadow {
+        .paLayout(50%,80px,250px,250px,1);
+        margin-left: -125px;
+        border-radius: 100%;
+        box-shadow: 20px 20px 60px #03a9f4, -20px -20px 60px #f441a5,
+            20px -20px 60px #ffeb3b, -20px 20px 60px #03a9f4,
+            -50px -50px 100px #d3c1f8 inset, 50px 50px 100px #f441a5 inset,
+            -50px 50px 100px #ffeb3b inset, 50px -50px 100px #c2c6fd inset;
+        filter: blur(20px);

-		&.shown {
-			animation: rotation 5s linear infinite;
-		}
+        &.shown {
+            animation: rotation 5s linear infinite;
+        }

-		// box-shadow: 0px -20px 40px #b9d7fb, -13px -15px 40px #b8f1ee,
-		// 	20px -4px 40px #c8f8ce, 18px 10px 40px #f0dbc0,
-		// 	9px 18px 40px #f0c7cf, -6px 18px 40px #f5c5cb,
-		// 	-11px 18px 40px #f0c1ef, -22px -7px 40px #d3c1f8,
-		// 	-13px -17px 40px #c2c6fd, 0px 20px 40px #b9d7fb inset,
-		// 	13px 15px 40px #b8f1ee inset, -20px 4px 40px #c8f8ce inset,
-		// 	-18px -10px 40px #f0dbc0 inset, -9px -18px 40px #f0c7cf inset,
-		// 	6px -18px 40px #f5c5cb inset, 11px -18px 40px #f0c1ef inset,
-		// 	22px 7px 40px #d3c1f8 inset, 13px 17px 40px #c2c6fd inset;
-	}
-	.page__hd {
-		padding: 30px 0 180px 0px !important;
-		h1,
-		p {
-			position: relative;
-			z-index: 10;
-			text-align: center;
-			margin-top: 10px;
-		}
-	}
-	.dialog {
-		.paLayout(0,150px,100%,auto,102);
-		// color: #fff;
-		.weui-grids {
-			display: flex;
-			flex-direction: row;
-			justify-content: start;
-			flex-wrap: wrap;
-			font-size: 30px;
-			align-content: center;
-			align-items: center;
-			.weui-grid {
-				opacity: 0.75;
-				display: flex;
-				flex-direction: column;
-				justify-content: center;
-				align-content: center;
-				align-items: center;
-				width: 33.33%;
-				height: auto;
-				margin-top: 30px;
-				.weui-grid__icon {
-					.prLayout(125px,125px);
-					border-radius: 100%;
-					// background: #e3e7e8;
-					background-image: linear-gradient(
-						145deg,
-						#f6f6f6 0%,
-						#cfcfcf 49.99%,
-						#cfcfcf 50%,
-						#f6f6f6 100%
-					);
-					background-position: 0 0;
-					background-size: 100% 200%;
-					box-shadow: 20px 20px 60px #c4c4c4, -20px -20px 60px #ffffff;
-					transition: all 0.25s ease-in-out;
-					-webkit-transition: all 0.25s ease-in-out;
-				}
-				.iconfont {
-					font-size: 45px;
-				}
-				.weui-grid__label {
-					height: 100px;
-					line-height: 40px;
-					padding: 0 25px;
-					text-align: center;
-					text-overflow: ellipsis;
-					overflow: hidden;
-					display: flex;
-					flex-direction: column;
-					justify-content: center;
-					align-content: center;
-					align-items: center;
-					transition: all 0.5s ease;
-				}
-				&:hover {
-					.weui-grid__icon {
-						background-position: 0 -100%;
-					}
-					.weui-grid__label {
-						transform: scale(1.2) translate(0, 5px);
-					}
-				}
-				&.active {
-					.weui-grid__icon {
-						background-position: 0 -100%;
-					}
-					.weui-grid__label {
-						transform: scale(1.2) translate(0, 5px);
-					}
-				}
-			}
-		}
-		.weui-grids::before,
-		.weui-grids::after,
-		.weui-grid:before,
-		.weui-grid:after {
-			display: none;
-		}
-		.weui-grid__label {
-			// color: #fff;
-		}
-		.weui-grid__icon {
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			align-items: center;
-			.iconfont {
-				font-size: 40px;
-			}
-		}
-	}
+        // box-shadow: 0px -20px 40px #b9d7fb, -13px -15px 40px #b8f1ee,
+        // 	20px -4px 40px #c8f8ce, 18px 10px 40px #f0dbc0,
+        // 	9px 18px 40px #f0c7cf, -6px 18px 40px #f5c5cb,
+        // 	-11px 18px 40px #f0c1ef, -22px -7px 40px #d3c1f8,
+        // 	-13px -17px 40px #c2c6fd, 0px 20px 40px #b9d7fb inset,
+        // 	13px 15px 40px #b8f1ee inset, -20px 4px 40px #c8f8ce inset,
+        // 	-18px -10px 40px #f0dbc0 inset, -9px -18px 40px #f0c7cf inset,
+        // 	6px -18px 40px #f5c5cb inset, 11px -18px 40px #f0c1ef inset,
+        // 	22px 7px 40px #d3c1f8 inset, 13px 17px 40px #c2c6fd inset;
+    }
+    .background {
+        opacity: 0.15;
+        .paLayout(0,0,100%,100%,0);
+        svg {
+            .prLayout(100%,100%);
+        }
+    }
+    .page__hd {
+        padding: 30px 0 180px 0px !important;
+        h1,
+        p {
+            position: relative;
+            z-index: 10;
+            text-align: center;
+            color: #fff;
+            margin-top: 10px;
+            font-weight: 700;
+            mix-blend-mode: overlay;
+        }
+    }
+    .dialog {
+        .paLayout(0,150px,100%,auto,102);
+        // color: #fff;
+        .weui-grids {
+            display: flex;
+            flex-direction: row;
+            justify-content: start;
+            flex-wrap: wrap;
+            font-size: 30px;
+            align-content: center;
+            align-items: center;
+            .weui-grid {
+                opacity: 0.75;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-content: center;
+                align-items: center;
+                width: 33.33%;
+                height: auto;
+                margin-top: 30px;
+                .weui-grid__icon {
+                    .prLayout(125px,125px);
+                    border-radius: 100%;
+                    // background: #e3e7e8;
+                    background-image: linear-gradient(
+                        145deg,
+                        #f6f6f6 0%,
+                        #cfcfcf 49.99%,
+                        #cfcfcf 50%,
+                        #f6f6f6 100%
+                    );
+                    background-position: 0 0;
+                    background-size: 100% 200%;
+                    box-shadow: 20px 20px 60px #c4c4c4, -20px -20px 60px #ffffff;
+                    transition: all 0.25s ease-in-out;
+                    -webkit-transition: all 0.25s ease-in-out;
+                }
+                .iconfont {
+                    font-size: 45px;
+                }
+                .weui-grid__label {
+                    height: 100px;
+                    line-height: 40px;
+                    padding: 0 25px;
+                    text-align: center;
+                    text-overflow: ellipsis;
+                    overflow: hidden;
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: center;
+                    align-content: center;
+                    align-items: center;
+                    transition: all 0.5s ease;
+                }
+                &:hover {
+                    .weui-grid__icon {
+                        background-position: 0 -100%;
+                    }
+                    .weui-grid__label {
+                        transform: scale(1.2) translate(0, 5px);
+                    }
+                }
+                &.active {
+                    .weui-grid__icon {
+                        background-position: 0 -100%;
+                    }
+                    .weui-grid__label {
+                        transform: scale(1.2) translate(0, 5px);
+                    }
+                }
+            }
+        }
+        .weui-grids::before,
+        .weui-grids::after,
+        .weui-grid:before,
+        .weui-grid:after {
+            display: none;
+        }
+        .weui-grid__label {
+            // color: #fff;
+        }
+        .weui-grid__icon {
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+            .iconfont {
+                font-size: 40px;
+            }
+        }
+    }
 }
@keyframes rotation {
-	0% {
-		opacity: 1;
-		transform: rotate(0deg);
-	}
-	50% {
-		opacity: 0.5;
-		transform: rotate(180deg);
-	}
-	100% {
-		opacity: 1;
-		transform: rotate(360deg);
-	}
+    0% {
+        opacity: 1;
+        transform: rotate(0deg);
+    }
+    50% {
+        opacity: 0.5;
+        transform: rotate(180deg);
+    }
+    100% {
+        opacity: 1;
+        transform: rotate(360deg);
+    }
 }
 </style>
--- a/src/page/index/PushCoinGame/game/index.js
+++ b/src/page/index/PushCoinGame/game/index.js
@@ -4,6 +4,7 @@ import { gsap } from "gsap";
 import Resource from "./preload";
 import utils from '@/utils/index.js';
 import Matter from 'matter-js';
+import decomp from 'poly-decomp';


 class game {
@@ -44,11 +45,13 @@ class game {
        this.utils = utils;

        // init Matter
+        this.Matter = Matter;
        this.Engine = Matter.Engine,
            this.Render = Matter.Render,
            this.Runner = Matter.Runner,
            this.Bodies = Matter.Bodies,
            this.Composite = Matter.Composite;
+        Matter.Common.setDecomp(decomp)
    }

    // 初始化
@@ -104,7 +107,7 @@ class game {
                this.gameView = this.VIEW.loading(this);
                this.VIEW.createLoadingParticle();
                this.scene = 1;
-                // this.loadMainRes();
+                this.loadMainRes();
            },
        });
    }
@@ -115,10 +118,12 @@ class game {
            imgList: Resource.main.imgList,
            // audioList: Resource.main.audioList,
            loadStart: () => {
+                this.scene = 2;
                // console.log(this.VIEW.loading_progress_bar.graphics.command.w)
            },
            progressCallBack: (progress) => {
                // progress;  // 0.99
+                console.log()
                gsap.to(this.VIEW.loading_progress_bar.graphics.command, {
                    w: 30 + 432 * progress,
                    duration: 0.1,
@@ -134,7 +139,11 @@ class game {
            },
            completeCallBack: (result) => {
                // all loaded triger
-                this.VIEW.hideLoading()
+                this.VIEW.createGamePage(this);
+                setTimeout(() => {
+                    this.VIEW.hideLoading();
+                    this.webGL && this.VIEW.loadingCacheContainer.updateCache();
+                }, 100)
                // this.mainResLoaded();
            },
        });
@@ -183,61 +192,50 @@ class game {
        console.log(this.globalSpeed)
    }

-    // 
+    // 初始化物理引擎
    initMatterEngine() {
        // create an engine 
        this.myEngine = this.Engine.create();
+        this.myEngine.gravity.y = 0;
        this.myWorld = this.myEngine.world;


+
        // create a renderer
-        // this.myRender = this.Render.create({
-        //     element: this.vue.$refs.container,
-        //     engine: this.myEngine,
-        //     options: {
-        //         width: window.innerWidth,
-        //         height: window.innerHeight,
-        //         pixelRatio: 1, // 设置像素比
-        //         showAngleIndicator: true,
-        //         wireframes: true,
-        //         showDebug: true
-        //     }
-        // });
+        this.myRender = this.Render.create({
+            // element: this.vue.$refs.container,
+            engine: this.myEngine,
+            canvas: this.vue.$refs.matter,
+            options: {
+                width: 375,// 375, //window.innerWidth,
+                height: 812, //812,  //window.innerHeight,
+                pixelRatio: 1, // 设置像素比 window.devicePixelRatio
+                background: 'transparent',
+                wireframeBackground: "transparent",
+                showAngleIndicator: false,
+                wireframes: false,
+                showDebug: false,
+                showVelocity: true,
+            }
+        });

        // create two boxes and a ground
-        var boxA = this.Bodies.rectangle(100, 200, 80, 80);
-        var boxB = this.Bodies.rectangle(150, 50, 80, 80);
-        var boxC = this.Bodies.rectangle(150, 50, 80, 80);
-        var boxD = this.Bodies.rectangle(150, 50, 80, 80);
-        var ground = this.Bodies.rectangle(0, 800, 750, 10, { isStatic: true });
+        // var boxA = this.Bodies.rectangle(100, 200, 80, 80);
+        // var boxB = this.Bodies.rectangle(150, 50, 80, 80);
+        // var boxC = this.Bodies.rectangle(150, 50, 80, 80);
+        // var boxD = this.Bodies.rectangle(150, 50, 80, 80);
+        // var ground = this.Bodies.rectangle(0, 800, 750, 10, { isStatic: true });
+

-        // this.Composite.add(this.myWorld, [
-        //     this.Bodies.fromVertices(
-        //         0, 0,
-        //         [
-        //             // 顶点坐标
-        //             { x: 0, y: 0 },
-        //             { x: 0, y: 890 },
-        //             { x: 140, y: 815 },
-        //             { x: 208, y: 614 },
-        //             { x: 548, y: 614 },
-        //             { x: 612, y: 815 },
-        //             { x: 750, y: 890 },
-        //             { x: 750, y: 0 }
-        //         ],
-        //         { isStatic: true }
-        //     )
-        // ]);
        // add all of the bodies to the world
-        this.Composite.add(this.myWorld, [boxA, boxB, boxC, boxD, ground]);
+        // this.Composite.add(this.myWorld, [boxA, boxB, boxC, boxD, ground]);

        // create runner
-        // this.Render.run(this.myRender);
+        this.Render.run(this.myRender);

        // run the engine
-        // this.myRunner = this.Runner.create();
-        // this.Runner.run(this.myRunner, this.myEngine);
-        this.Engine.run(this.myEngine);
+        this.myRunner = this.Runner.create();
+        this.Runner.run(this.myRunner, this.myEngine);
    }

    //debug mode destroyed
--- a/src/page/index/PushCoinGame/game/preload.js
+++ b/src/page/index/PushCoinGame/game/preload.js
@@ -24,13 +24,22 @@ export default {
 	main: {
 		imgList: [
 			{
-				id: 'logo',
-				src: require("@/assets/images/logo.png")
+				id: 'coin',
+				src: require("@/assets/images/push-coin/coin.png")
 			},
 			{
-				id: 'logo',
-				src: require("@/assets/images/logo.png")
-			}
+				id: 'top',
+				src: require("@/assets/images/push-coin/top.png")
+			},
+			{
+				id: 'bottom_ban',
+				src: require("@/assets/images/push-coin/bottom_ban.png")
+			},
+			{
+				id: 'pusher',
+				src: require("@/assets/images/push-coin/pusher.png")
+			},
+
 		],
 		audioList: [
 		]
--- a/src/page/index/PushCoinGame/game/stage.js
+++ b/src/page/index/PushCoinGame/game/stage.js
@@ -79,10 +79,18 @@ class creater {
    //屏幕自适应 
    adaptScreen() {
        if (this.app.needAdaptScreen === false) return
-        this.currentStageWidth = window.innerWidth;
-        this.currentStageHeight = 1624 / 750 * window.innerWidth;
-        this.currentWidthHeightScale = this.currentStageWidth / this.currentStageHeight;
-
+        // 横屏模式
+        if (window.innerWidth > window.innerHeight) {
+            this.currentStageWidth = window.innerWidth;
+            this.currentStageHeight = window.innerHeight;
+            this.currentWidthHeightScale = this.currentStageWidth / this.currentStageHeight;
+            this.offsetTop = 0;
+        } else {
+            this.currentStageWidth = window.innerWidth;
+            this.currentStageHeight = 1624 / 750 * window.innerWidth;
+            this.currentWidthHeightScale = this.currentStageWidth / this.currentStageHeight;
+            this.offsetTop = (window.innerHeight - this.currentStageHeight) * this.stageCanvas.scaleY;
+        }
        if (this.currentStageWidth > this.currentStageHeight) {
            if (this.initWidthHeightScale < this.currentWidthHeightScale)
                this.stageCanvas.scaleX = this.stageCanvas.scaleY = this.currentStageWidth / this.initStageWidth;
@@ -98,13 +106,13 @@ class creater {
        this.stage.x = 0//(this.currentStageWidth - this.initStageWidth) * this.stageCanvas.scaleX / 2;
        this.stage.y = 0//(window.innerHeight - this.currentStageHeight) * this.stageCanvas.scaleY / 2;

-        this.offsetTop = (window.innerHeight - this.currentStageHeight) * this.stageCanvas.scaleY;

        if (window.innerHeight < this.currentStageHeight)
            gsap.set(this.stageCanvas, { y: this.offsetTop });  //+ (window.deviceInfo.screenSize <= 2 ? 20 : 0)
        else
            gsap.set(this.stageCanvas, { y: 0 });

+
        // console.log(this.stageCanvas.scaleX,this.stageCanvas.scaleY,window.devicePixelRatio)
        // console.log(this.stageContainer.x,this.stageContainer.y,this.currentStageHeight,this.offsetTop)

--- a/src/page/index/PushCoinGame/game/view.js
+++ b/src/page/index/PushCoinGame/game/view.js
@@ -3,6 +3,7 @@ import layoutData from './layout';
 import createLayout from './createView';
 // import maskCreater from './maskCreater';		//mask creater
 import { gsap } from "gsap";
+import decomp from 'poly-decomp';
 // import utils from '@/utils/index.js'
 // import { MotionPathPlugin } from "gsap/MotionPathPlugin.js";
 // import Soul 		 from './plugins/ScrollContainer';	//app scroll plugin module
@@ -16,8 +17,6 @@ class layout {
 	}

 	init() {
-
-
 		//update btns position by viewport
 		// this.updatePosByViewport();

@@ -65,8 +64,9 @@ class layout {
 		}
 	}

-	createBitmap(spriteSheet, name) {
-		return new createjs.Sprite(spriteSheet, name);
+	createBitmap(name) {
+		let img = this.game.mainLoader && this.game.mainLoader.getResult(name);
+		return new createjs.Bitmap(img);
 	}

 	//创建loading页
@@ -95,365 +95,125 @@ class layout {
 		// 创建粒子动画
 		this.createLoadingParticle();

-		console.log(this.loading_bg)
+		// console.log(this.loading_bg)

 		return this
 	}

 	//隐藏loading页面
-	hideLoading(step = 1) {
+	hideLoading() {
 		//create story index
-		this.game.scene = 2;
-		gsap.to(this.game.stage.loadingContainer, {
-			alpha: 0, duration: 0.65, delay: step == 3 ? 1 : 0, onComplete: () => {
-				// 将loading重置ui显示 为二次加载资源做显示
-				this.changeLoadingLayout(step);
-			}
-		})
-		gsap.to(this.game.stage.mainContainer, { alpha: 1, duration: 0.65 });
+		gsap.to(this.game.stage.loadingContainer, { alpha: 0, duration: 0.65, })
+		gsap.to([this.game.stage.mainContainer, this.gamePage], { alpha: 1, duration: 0.65 });
 	}

-	// 准备下一次loading
-	changeLoadingLayout(step) {
-		if (step == 1) {
-			// 进度归零
-			this.loading_progress_text.text = '0%';
-			// 隐藏元素
-			gsap.set([this.loading_start, this.loading_progress_bg, this.loading_progress_bar, this.loading_snow, this.loading_text], { alpha: 0 })
-			// 显示元素
-			gsap.set([this.loading_text2, this.loading_box, this.loading_light, this.loading_person], { alpha: 1 })
-			gsap.set(this.loading_progress_text, { alpha: 1, y: 1260 })
-			// 准备动画
-			this.readyLangLoaderAni();
-		} else if (step == 2) {
-			// 隐藏元素
-			gsap.set([this.loading_text2, this.loading_light, this.loading_person], { alpha: 0 })
-			gsap.set(this.loading_progress_text, { alpha: 0 })
-			// 显示元素
-			gsap.set([this.loading_text3, this.loading_light2, this.loading_arrow], { alpha: 1 })
-			// 如果是英文 显示英文文案
-			if (this.game.langConfig.id == 3) {
-				gsap.set([this.loading_text2_en, this.loading_text3], { alpha: 0 })
-				gsap.set([this.loading_text3_en], { alpha: 1 })
-			}
-			// 准备动画
-			this.readyPosterLoaderAni();
-		}
-	}
+	// 创建游戏页
+	createGamePage(game) {
+		this.game = game;
+		this.gamePage = new createjs.Container().set({ alpha: 0 });
+		this.game.stage.mainContainer.addChild(this.gamePage);

-	// 准备语言加载动画
-	readyLangLoaderAni() {
-		this.langLoaderAni = [];
-		let ani1 = new gsap.timeline({ repeat: -1, paused: true })
-			.to([this.loading_light, this.loading_person], { alpha: 0.86, duration: 0.2 })
-			.to([this.loading_light, this.loading_person], { alpha: 1, duration: 0.15 })
-			.to([this.loading_light, this.loading_person], { alpha: 0.6, duration: 0.2 })
-			.to([this.loading_light, this.loading_person], { alpha: 1, duration: 0.1 })
-
-		let ani2 = gsap.to([this.loading_person, this.loading_box], { y: '+=15', yoyo: true, repeat: -1, duration: 1.5 })
-
-
-		this.langLoaderAni.push(ani1, ani2)
-	}
-
-	// 播放语言加载时动画
-	playLangLoaderAni() {
-		this.langLoaderAni.forEach((item) => {
-			item.restart();
-		})
-	}
-
-	// 暂停语言加载时动画
-	pauseLangLoaderAni() {
-		this.langLoaderAni.forEach((item) => {
-			item.pause();
-		})
-	}
-
-	// 准备语言加载动画
-	readyPosterLoaderAni() {
-		this.posterLoaderAni = [];
-		let ani1 = new gsap.timeline({ repeat: -1, paused: true })
-			.to(this.loading_light2, { alpha: 0.86, duration: 0.2 })
-			.to(this.loading_light2, { alpha: 1, duration: 0.15 })
-			.to(this.loading_light2, { alpha: 0.6, duration: 0.2 })
-			.to(this.loading_light2, { alpha: 1, duration: 0.1 })
-
-		let ani2 = gsap.to([this.loading_box], { y: '+=15', yoyo: true, repeat: -1, duration: 1.5 })
-
-		let ani3 = gsap.to([this.loading_arrow], { y: '+=15', scaleX: 0.95, yoyo: true, repeat: -1, duration: 1.5 })
-
-
-		this.posterLoaderAni.push(ani1, ani2, ani3)
-	}
-
-	// 播放语言加载时动画
-	playPosterLoaderAni() {
-		this.posterLoaderAni.forEach((item) => {
-			item.restart();
-		})
-	}
-
-	// 暂停语言加载时动画
-	pausePosterLoaderAni() {
-		this.posterLoaderAni.forEach((item) => {
-			item.pause();
-		})
-	}
-
-
-	// 帧生成动画
-	framePlayer(config) {
-		// 图像资源
-		// 容器
-		// const container = new createjs.Container();
-
-		// loader
-		const loader = this.game[config.name];
-
-		// images 
-		const images = [];
-		config.imgIds.forEach((item) => {
-			images.push(loader.getResult(item));
-		})
-
-		// handle speed
-		Object.keys(config.sprite.animations).forEach((key) => {
-			// console.log('speed=', this.game.globalSpeed * 0.18)
-			config.sprite.animations[key].speed = this.game.globalSpeed * 0.18;
-			config.sprite.animations[key].next = 'wait'
+		let bottom = this.createBitmap('bottom_ban').set({ y: 560 });
+		let top = this.createBitmap('top');
+		// 添加推板
+		let pusher = this.createBitmap('pusher').set({
+			x: 142,
+			y: 683
 		});

-		// animation config
-		const aniData = {
-			images,
-			frames: config.sprite.frames,
-			animations: config.sprite.animations
-		}
+		// console.log(pusher)

-		const spriteSheet = new createjs.SpriteSheet(aniData);
-		const animation = new createjs.Sprite(spriteSheet);
+		gsap.to(pusher, { y: '-=202', yoyo: true, repeat: -1, ease: 'none', duration: 5 })

-		// default setting
-		if (config.name === 'guide' || config.name === 'wait') {
-			animation.set({
-				name: config.name,
-				x: 390,
-				y: 280 + 512,
-				scaleX: 1.25,
-				scaleY: 1.25,
-				regX: 750 * 0.85 / 2,
-				regY: 1624 * 0.85 / 2,
-				alpha: 0
+		// 添加到
+		this.gamePage.addChild(bottom, pusher, top);
+
+
+		// Create a concave polygon
+		var _g = [
+			// 顶点坐标
+			{ x: 0, y: 0 },
+			{ x: 0, y: 956 },
+			{ x: 141, y: 881 },
+			{ x: 206, y: 683 },
+			{ x: 548, y: 683 },
+			{ x: 614, y: 881 },
+			{ x: 750, y: 956 },
+			{ x: 750, y: 0 },
+		];
+		var concavePolygon = [
+			// 顶点坐标
+			[0, 0],
+			[0, 956],
+			[141, 881],
+			[206, 683],
+			[548, 683],
+			[614, 881],
+			[750, 956],
+			[750, 0],
+		];
+
+		// Make sure the polygon has counter-clockwise winding. Skip this step if you know it's already counter-clockwise.
+		decomp.makeCCW(concavePolygon);
+
+
+		var convexPolygons = decomp.quickDecomp(concavePolygon);
+		// ==> [  [[1,0],[1,1],[0.5,0.5]],  [[0.5,0.5],[-1,1],[-1,0],[1,0]]  ]
+
+		// // Decompose using the slow (but optimal) algorithm
+		// var convexPolygons = decomp.decomp(concavePolygon);
+
+		convexPolygons.forEach((item) => {
+			item.forEach((t, i) => {
+				item.push({
+					x: t[0],
+					y: t[1]
+				})
+				if (i == (item.length / 2) - 1) {
+					item.splice(0, item.length / 2)
+				}
 			})
-		} else {
-			animation.set({
-				name: config.name,
-				x: 220,
-				y: 565 + 512,
-				scaleX: 1,
-				scaleY: 1,
-				regX: 750 * 1 / 2,
-				regY: 1624 * 1 / 2,
-				alpha: 0
-			})
-		}
+		})

+		console.log(convexPolygons)
+		// 添加ground 
+		this.game.Composite.add(this.game.myWorld,
+			this.game.Bodies.fromVertices(
+				window.innerWidth / 2, window.innerHeight / 2,
+				_g,
+				{
+					isStatic: true,
+					scale: {
+						screenX: 0.5,
+						screenY: 0.5,
+					},
+					render: {
+						fillStyle: 'rgba(39,7,238,0.25)'
+					}
+				},

-
-
-
-		return animation
-	}
-
-	// 生成海报
-	createPoster(nickname = '', level = 1) {
-		this.posterContainer = new createjs.Container().set({ alpha: 1, name: 'posterContainer' });
-		// this.game.stage.mainContainer.addChild(this.posterContainer);
-
-		// 海报图片
-		let posterImg = this.game.posterLoader.getResult('poster_bg');
-		// 海报对象
-		let poster = new createjs.Bitmap(posterImg);
-
-		// nickname
-		let nt;
-		if (nickname) {
-			nt = this.game.vue.$Utils.cutString(nickname, 20, true);
-		}
-		let nicknameText = new createjs.Text(nt, "38px Helvetica, Arial, sans-serif", "#31425b").set({
-			x: 375,
-			y: 1086,
-			textAlign: 'center'
-		});
-
-		let levelImg = this.game.posterLoader.getResult(`word_${level}`);
-		let posConfig = [
-			{
-				x: 50,
-				y: 239
-			},
-			{
-				x: 70,
-				y: 242
-			},
-			{
-				x: 54,
-				y: 243
-			},
-			{
-				x: 57,
-				y: 224
-			},
-			{
-				x: 50,
-				y: 243
-			}
-		]
-		// 等级称号
-		let levelTitle = new createjs.Bitmap(levelImg).set(
-			this.game.langConfig.id == 3 ? posConfig[Number(level) - 1] : posConfig[4]
+			)
 		);

-
-		let personImg = this.game.posterLoader.getResult('person');
-		// 王冰冰
-		let person = new createjs.Bitmap(personImg).set({
-			x: this.game.langConfig.id == 3 ? 76 : 86,
-			y: this.game.langConfig.id == 3 ? 381 : 256
-		});
-
-		// 根据版本选择不同的二维码 目前全部选用微信版本二维码
-		let codeName = 'qrcode';
-		// switch (process.env.VUE_APP_CURRENTMODE) {
-		// 	case 'ysprod':
-		// 		codeName = 'ys_qrcode';
-		// 		break;
-		// 	case 'wbprod':
-		// 		codeName = 'wb_qrcode';
-		// 		break;
-		// 	default:
-		// 		codeName = 'qrcode';
-		// 		break;
-		// }
-		let qrcodeImg = this.game.posterLoader.getResult(codeName);
-		// 海报对象
-		let qrcode = new createjs.Bitmap(qrcodeImg).set({
-			x: this.game.langConfig.id == 3 ? 305 : 306,
-			y: this.game.langConfig.id == 3 ? 1256 : 1275,
-			scaleX: 0.34,
-			scaleY: 0.34,
-			width: 136,
-			height: 136
-		});
-
-		let logoImg = this.game.posterLoader.getResult('logo');
-		// 海报对象
-		let logo = new createjs.Bitmap(logoImg).set({
-			x: this.game.langConfig.id == 3 ? 341 : 341,
-			y: this.game.langConfig.id == 3 ? 1482 : 1482,
-		});
-
-		// 插入container
-		this.posterContainer.addChild(poster, nicknameText, qrcode, levelTitle, person, logo);
-
-		this.posterContainer.cache(0, 0, 750, 1538);
-
-		// easejs > 1.0.0 getCacheDataURL报错 0.8.2版本正常
-		let baseUrl = this.posterContainer.cacheCanvas.toDataURL('image/png');
-		// let baseUrl = this.posterContainer.getCacheDataURL();
-
-		setTimeout(() => {
-			this.destroyPosterCreater();
-		}, 1000);
-
-		return baseUrl
+		// 
+		// let bounds = pusher.getBounds();
+		// pusher.body = this.game.Bodies.trapezoid(
+		// 	pusher.x,
+		// 	pusher.y,
+		// 	bounds.width,
+		// 	bounds.height,
+		// 	1,
+		// 	{ isStatic: true }
+		// );
+		// this.game.Composite.add(this.myWorld, [pusher.body]);
 	}

-	// 销毁海报生成器
-	destroyPosterCreater() {
-		this.posterContainer.uncache();
-		this.posterContainer.removeAllChildren();
-		this.game.stage.mainContainer.removeChild(this.posterContainer);
-		this.posterContainer = null;
+	// 生成硬币
+	createCoin() {
+		let coinImg = this.game.mainLoader.getResult('coin');
+		let coin = new createjs.Bitmap(coinImg);
 	}

-	// index 粒子制造机
-	createParticle() {
-
-		// 容器
-		// const loadingContainer = this.game.stage.loadingContainer;
-
-		// loader
-		const loader = this.game.vue.$beforeLoader;
-
-		// sprite image
-		const spriteImg = loader.getResult('snowSprite');
-
-
-		const container = new createjs.Container();
-
-
-		const aniData = {
-			images: [spriteImg],
-			frames: [
-				[1, 1, 77, 82, 0, 0, 0],
-				[1, 85, 57, 55, 0, 0, 0],
-				[1, 142, 46, 45, 0, 0, 0],
-				[49, 142, 15, 15, 0, 0, 0],
-				[60, 85, 8, 12, 0, 0, 0],
-				[60, 99, 6, 6, 0, 0, 0]
-			],
-			animations: {
-				"snow-1": { "frames": [0] },
-				"snow-2": { "frames": [1] },
-				"snow-3": { "frames": [2] },
-				"snow-4": { "frames": [3] },
-				"snow-5": { "frames": [4] },
-				"snow-6": { "frames": [3] },
-				"snow-7": { "frames": [4] },
-				"snow-8": { "frames": [2] },
-				"snow-9": { "frames": [3] },
-				"snow-10": { "frames": [1] },
-			}
-		}
-
-		const spriteSheet = new createjs.SpriteSheet(aniData);
-
-		const arr = [];
-		for (let i = 0; i < (window.deviceInfo.system == 'IOS' ? 50 : 50); i++) {
-			const scale = Math.random() * 0.35 + 0.5;
-			const name = `snow-${this.game.vue.$Utils.rangeRandom(1, 10)}`;
-			const sprite = this.createBitmap(spriteSheet, name).set({
-				x: Math.random() * 750 - 30,
-				y: Math.random() * 1300,
-				ox: Math.random() * 750,
-				oy: -50,
-				// regX:14,
-				// regY:14,
-				scaleX: scale,
-				scaleY: scale,
-				speedX: (Math.random() > 0.5 ? 1 : -1) * (Math.random() * 0.5 + 0.25),
-				speedY: Math.random() * 1 + 1,
-				speedR: Math.random() * 0.5 + 0.5,
-				alpha: Math.random() * 0.3 + 0.5,
-			})
-
-			arr.push(sprite)
-		}
-		// const mask = new createjs.Shape().setTransform(0, 0, 1, 1);
-		// mask.graphics.f('#000000').drawRoundRect(0, 0, 750, 1300, 0).es();
-		// contianer.mask = mask;
-		// contianer.compositeOperation = 'darker';
-		// arr.push(mask)
-		container.children = arr;
-
-		this.prarticleContainer = container;
-		this.game.stage.mainContainer.addChild(container);
-		return container
-	}
-
-
 	// loading 粒子制造机
 	createLoadingParticle() {
 		const container = new createjs.Container();
--- a/src/page/index/PushCoinGame/index.vue
+++ b/src/page/index/PushCoinGame/index.vue
@@ -7,37 +7,45 @@
 * @FilePath: /xfhd-vue-scaffold/src/page/index/Home/Index.vue
 -->
 <template>
-	<div class="pushcoin" id="container" ref="container"></div>
+  <div class="pushcoin" id="container" ref="container">
+    <canvas ref="matter" class="matter"></canvas>
+  </div>
 </template>
 <script>
 // @ is an alias to /src
 import gsap from "gsap";
 import game from "./game/index";
 export default {
-	name: "ColorSort",
-	components: {},
-	data() {
-		return {};
-	},
-	computed: {
-		rennderCssHSL() {
-			return function (item) {
-				return `background-color: ${item.csshsl};`;
-			};
-		},
-	},
-	mounted() {
-		this.game = new game();
-		this.game.init(this);
-	},
-	methods: {},
+  name: "ColorSort",
+  components: {},
+  data() {
+    return {};
+  },
+  computed: {
+    rennderCssHSL() {
+      return function (item) {
+        return `background-color: ${item.csshsl};`;
+      };
+    },
+  },
+  mounted() {
+    this.game = new game();
+    this.game.init(this);
+  },
+  methods: {},
 };
 </script>
 <!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="less">
+<style lang="less">
 .pushcoin {
-	.prLayout(100%,100%);
-	overflow: hidden;
-	background-color: #333;
+  .prLayout(100%,100%);
+  overflow: hidden;
+  background-color: #333;
+  .matter {
+    .paPos(0,0,1);
+  }
+  #stageCanvas {
+    .paLayout(0,0,750px,1624px,0);
+  }
 }
 </style>
--- a/src/page/index/colorSort/index.vue
+++ b/src/page/index/colorSort/index.vue
--- a/src/utils/plugins/Blob.js
+++ b/src/utils/plugins/Blob.js
@@ -0,0 +1,179 @@
+/* eslint-disable */
+/* Blob.js
+ * A Blob implementation.
+ * 2014-05-27
+ *
+ * By Eli Grey, http://eligrey.com
+ * By Devin Samarin, https://github.com/eboyjr
+ * License: X11/MIT
+ *   See LICENSE.md
+ */
+
+/*global self, unescape */
+/*jslint bitwise: true, regexp: true, confusion: true, es5: true, vars: true, white: true,
+ plusplus: true */
+
+/*! @source http://purl.eligrey.com/github/Blob.js/blob/master/Blob.js */
+
+(function (view) {
+    "use strict";
+
+    view.URL = view.URL || view.webkitURL;
+
+    if (view.Blob && view.URL) {
+        try {
+            new Blob;
+            return;
+        } catch (e) {}
+    }
+
+    // Internally we use a BlobBuilder implementation to base Blob off of
+    // in order to support older browsers that only have BlobBuilder
+    var BlobBuilder = view.BlobBuilder || view.WebKitBlobBuilder || view.MozBlobBuilder || (function(view) {
+            var
+                get_class = function(object) {
+                    return Object.prototype.toString.call(object).match(/^\[object\s(.*)\]$/)[1];
+                }
+                , FakeBlobBuilder = function BlobBuilder() {
+                    this.data = [];
+                }
+                , FakeBlob = function Blob(data, type, encoding) {
+                    this.data = data;
+                    this.size = data.length;
+                    this.type = type;
+                    this.encoding = encoding;
+                }
+                , FBB_proto = FakeBlobBuilder.prototype
+                , FB_proto = FakeBlob.prototype
+                , FileReaderSync = view.FileReaderSync
+                , FileException = function(type) {
+                    this.code = this[this.name = type];
+                }
+                , file_ex_codes = (
+                    "NOT_FOUND_ERR SECURITY_ERR ABORT_ERR NOT_READABLE_ERR ENCODING_ERR "
+                    + "NO_MODIFICATION_ALLOWED_ERR INVALID_STATE_ERR SYNTAX_ERR"
+                ).split(" ")
+                , file_ex_code = file_ex_codes.length
+                , real_URL = view.URL || view.webkitURL || view
+                , real_create_object_URL = real_URL.createObjectURL
+                , real_revoke_object_URL = real_URL.revokeObjectURL
+                , URL = real_URL
+                , btoa = view.btoa
+                , atob = view.atob
+
+                , ArrayBuffer = view.ArrayBuffer
+                , Uint8Array = view.Uint8Array
+                ;
+            FakeBlob.fake = FB_proto.fake = true;
+            while (file_ex_code--) {
+                FileException.prototype[file_ex_codes[file_ex_code]] = file_ex_code + 1;
+            }
+            if (!real_URL.createObjectURL) {
+                URL = view.URL = {};
+            }
+            URL.createObjectURL = function(blob) {
+                var
+                    type = blob.type
+                    , data_URI_header
+                    ;
+                if (type === null) {
+                    type = "application/octet-stream";
+                }
+                if (blob instanceof FakeBlob) {
+                    data_URI_header = "data:" + type;
+                    if (blob.encoding === "base64") {
+                        return data_URI_header + ";base64," + blob.data;
+                    } else if (blob.encoding === "URI") {
+                        return data_URI_header + "," + decodeURIComponent(blob.data);
+                    } if (btoa) {
+                        return data_URI_header + ";base64," + btoa(blob.data);
+                    } else {
+                        return data_URI_header + "," + encodeURIComponent(blob.data);
+                    }
+                } else if (real_create_object_URL) {
+                    return real_create_object_URL.call(real_URL, blob);
+                }
+            };
+            URL.revokeObjectURL = function(object_URL) {
+                if (object_URL.substring(0, 5) !== "data:" && real_revoke_object_URL) {
+                    real_revoke_object_URL.call(real_URL, object_URL);
+                }
+            };
+            FBB_proto.append = function(data/*, endings*/) {
+                var bb = this.data;
+                // decode data to a binary string
+                if (Uint8Array && (data instanceof ArrayBuffer || data instanceof Uint8Array)) {
+                    var
+                        str = ""
+                        , buf = new Uint8Array(data)
+                        , i = 0
+                        , buf_len = buf.length
+                        ;
+                    for (; i < buf_len; i++) {
+                        str += String.fromCharCode(buf[i]);
+                    }
+                    bb.push(str);
+                } else if (get_class(data) === "Blob" || get_class(data) === "File") {
+                    if (FileReaderSync) {
+                        var fr = new FileReaderSync;
+                        bb.push(fr.readAsBinaryString(data));
+                    } else {
+                        // async FileReader won't work as BlobBuilder is sync
+                        throw new FileException("NOT_READABLE_ERR");
+                    }
+                } else if (data instanceof FakeBlob) {
+                    if (data.encoding === "base64" && atob) {
+                        bb.push(atob(data.data));
+                    } else if (data.encoding === "URI") {
+                        bb.push(decodeURIComponent(data.data));
+                    } else if (data.encoding === "raw") {
+                        bb.push(data.data);
+                    }
+                } else {
+                    if (typeof data !== "string") {
+                        data += ""; // convert unsupported types to strings
+                    }
+                    // decode UTF-16 to binary string
+                    bb.push(unescape(encodeURIComponent(data)));
+                }
+            };
+            FBB_proto.getBlob = function(type) {
+                if (!arguments.length) {
+                    type = null;
+                }
+                return new FakeBlob(this.data.join(""), type, "raw");
+            };
+            FBB_proto.toString = function() {
+                return "[object BlobBuilder]";
+            };
+            FB_proto.slice = function(start, end, type) {
+                var args = arguments.length;
+                if (args < 3) {
+                    type = null;
+                }
+                return new FakeBlob(
+                    this.data.slice(start, args > 1 ? end : this.data.length)
+                    , type
+                    , this.encoding
+                );
+            };
+            FB_proto.toString = function() {
+                return "[object Blob]";
+            };
+            FB_proto.close = function() {
+                this.size = this.data.length = 0;
+            };
+            return FakeBlobBuilder;
+        }(view));
+
+    view.Blob = function Blob(blobParts, options) {
+        var type = options ? (options.type || "") : "";
+        var builder = new BlobBuilder();
+        if (blobParts) {
+            for (var i = 0, len = blobParts.length; i < len; i++) {
+                builder.append(blobParts[i]);
+            }
+        }
+        return builder.getBlob(type);
+    };
+}(typeof self !== "undefined" && self || typeof window !== "undefined" && window || this.content || this));
--- a/src/utils/plugins/Export2Excel.js
+++ b/src/utils/plugins/Export2Excel.js
@@ -0,0 +1,143 @@
+/* eslint-disable */
+require('script-loader!file-saver');
+require('./Blob.js'); //改成相对路径
+require('script-loader!xlsx/dist/xlsx.core.min');
+function generateArray(table) {
+    var out = [];
+    var rows = table.querySelectorAll('tr');
+    var ranges = [];
+    for (var R = 0; R < rows.length; ++R) {
+        var outRow = [];
+        var row = rows[R];
+        var columns = row.querySelectorAll('td');
+        for (var C = 0; C < columns.length; ++C) {
+            var cell = columns[C];
+            var colspan = cell.getAttribute('colspan');
+            var rowspan = cell.getAttribute('rowspan');
+            var cellValue = cell.innerText;
+            if (cellValue !== "" && cellValue == +cellValue) cellValue = +cellValue;
+
+            //Skip ranges
+            ranges.forEach(function (range) {
+                if (R >= range.s.r && R <= range.e.r && outRow.length >= range.s.c && outRow.length <= range.e.c) {
+                    for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null);
+                }
+            });
+
+            //Handle Row Span
+            if (rowspan || colspan) {
+                rowspan = rowspan || 1;
+                colspan = colspan || 1;
+                ranges.push({s: {r: R, c: outRow.length}, e: {r: R + rowspan - 1, c: outRow.length + colspan - 1}});
+            }
+            ;
+
+            //Handle Value
+            outRow.push(cellValue !== "" ? cellValue : null);
+
+            //Handle Colspan
+            if (colspan) for (var k = 0; k < colspan - 1; ++k) outRow.push(null);
+        }
+        out.push(outRow);
+    }
+    return [out, ranges];
+};
+
+function datenum(v, date1904) {
+    if (date1904) v += 1462;
+    var epoch = Date.parse(v);
+    return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);
+}
+
+function sheet_from_array_of_arrays(data, opts) {
+    var ws = {};
+    var range = {s: {c: 10000000, r: 10000000}, e: {c: 0, r: 0}};
+    for (var R = 0; R != data.length; ++R) {
+        for (var C = 0; C != data[R].length; ++C) {
+            if (range.s.r > R) range.s.r = R;
+            if (range.s.c > C) range.s.c = C;
+            if (range.e.r < R) range.e.r = R;
+            if (range.e.c < C) range.e.c = C;
+            var cell = {v: data[R][C]};
+            if (cell.v == null) continue;
+            var cell_ref = XLSX.utils.encode_cell({c: C, r: R});
+
+            if (typeof cell.v === 'number') cell.t = 'n';
+            else if (typeof cell.v === 'boolean') cell.t = 'b';
+            else if (cell.v instanceof Date) {
+                cell.t = 'n';
+                cell.z = XLSX.SSF._table[14];
+                cell.v = datenum(cell.v);
+            }
+            else cell.t = 's';
+
+            ws[cell_ref] = cell;
+        }
+    }
+    if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range);
+    return ws;
+}
+
+function Workbook() {
+    if (!(this instanceof Workbook)) return new Workbook();
+    this.SheetNames = [];
+    this.Sheets = {};
+}
+
+function s2ab(s) {
+    var buf = new ArrayBuffer(s.length);
+    var view = new Uint8Array(buf);
+    for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
+    return buf;
+}
+
+export function export_table_to_excel(id) {
+    var theTable = document.getElementById(id);
+    console.log('a')
+    var oo = generateArray(theTable);
+    var ranges = oo[1];
+
+    /* original data */
+    var data = oo[0];
+    var ws_name = "SheetJS";
+    console.log(data);
+
+    var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
+
+    /* add ranges to worksheet */
+    // ws['!cols'] = ['apple', 'banan'];
+    ws['!merges'] = ranges;
+
+    /* add worksheet to workbook */
+    wb.SheetNames.push(ws_name);
+    wb.Sheets[ws_name] = ws;
+
+    var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
+
+    saveAs(new Blob([s2ab(wbout)], {type: "application/octet-stream"}), "test.xlsx")
+}
+
+function formatJson(jsonData) {
+    console.log(jsonData)
+}
+export function export_json_to_excel(th, jsonData, defaultTitle) {
+
+    /* original data */
+
+    var data = jsonData;
+    data.unshift(th);
+    var ws_name = "SheetJS";
+
+    var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
+
+    // 设置每列的宽度
+    ws['!cols'] = [{wpx:100},{wpx:100},{wpx:100},{wpx:100},{wpx:800},{wpx:100},{wpx:100},{wpx:100}];
+    /* add worksheet to workbook */
+    wb.SheetNames.push(ws_name);
+    wb.Sheets[ws_name] = ws;
+
+    var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
+    var title = defaultTitle || '列表'
+    saveAs(new Blob([s2ab(wbout)], {type: "application/octet-stream"}), title + ".xlsx")
+}
+
--- a/src/utils/plugins/stats-2d.js
+++ b/src/utils/plugins/stats-2d.js
@@ -2,7 +2,7 @@ var FPS = FPS || {};
 FPS.time = 0;
 FPS.FPS = 0;
 FPS.showText = "";
-FPS.startFPS = function (stage,pos = {x : 0, y : 0}, app){
+FPS.startFPS = function (stage, pos = { x: 0, y: 0 }, app) {
    FPS.app = app;
    FPS.pos = pos;
    FPS.shape = new createjs.Shape();
@@ -10,45 +10,40 @@ FPS.startFPS = function (stage,pos = {x : 0, y : 0}, app){
    FPS.shape.alpha = .5;
    FPS.txt = new createjs.Text("COUNT:", "24px Arial", "#ffffff");
    FPS.txt.x = 20;
-    FPS.txt.y = pos.y+10;
+    FPS.txt.y = pos.y + 10;
    FPS.container = new createjs.Container();
    if (FPS.app.debug) {
        stage.addChild(FPS.container);
    }
-    FPS.container.addChild(FPS.shape)
-    FPS.container.addChild(FPS.txt);
-    FPS.container.cache(pos.x, pos.y, 140,50);
+    // FPS.container.addChild(FPS.shape)
+    // FPS.container.addChild(FPS.txt);
+    FPS.container.cache(pos.x, pos.y, 140, 50);
    createjs.Ticker.addEventListener("tick", FPS.TickerFPS);

-//    setInterval(FPS.TickerFPS,18)
+    //    setInterval(FPS.TickerFPS,18)
 }
-FPS.TickerFPS = function (event)
-{
+FPS.TickerFPS = function (event) {
    FPS.date = new Date();
    FPS.currentTime = FPS.date.getTime();
-    if(FPS.time!=0)
-    {
-        FPS.FPS = Math.ceil(1000/(FPS.currentTime -  FPS.time));
+    if (FPS.time != 0) {
+        FPS.FPS = Math.ceil(1000 / (FPS.currentTime - FPS.time));
    }
    FPS.time = FPS.currentTime;
-    FPS.txt.text = "FPS: "+FPS.FPS + "\n" + FPS.showText;
-    FPS.container.cache(FPS.pos.x, FPS.pos.y, 140,50);
+    FPS.txt.text = "FPS: " + FPS.FPS + "\n" + FPS.showText;
+    FPS.container.cache(FPS.pos.x, FPS.pos.y, 140, 50);
 }
-FPS.startFPS2 = function (stage)
-{
+FPS.startFPS2 = function (stage) {
    FPS.txt = document.getElementById("fps");
    createjs.Ticker.addEventListener("tick", FPS.TickerFPS2);
 }
-FPS.TickerFPS2 = function (event)
-{
+FPS.TickerFPS2 = function (event) {
    FPS.date = new Date();
    FPS.currentTime = FPS.date.getTime();
-    if(FPS.time!=0)
-    {
-        FPS.FPS = Math.ceil(1000/(FPS.currentTime -  FPS.time));
+    if (FPS.time != 0) {
+        FPS.FPS = Math.ceil(1000 / (FPS.currentTime - FPS.time));
    }
    FPS.time = FPS.currentTime;
-    FPS.txt.innerText = "FPS: "+FPS.FPS;
+    FPS.txt.innerText = "FPS: " + FPS.FPS;
 }

 module.exports = FPS;
--- a/vue.config.js
+++ b/vue.config.js
@@ -40,6 +40,12 @@ module.exports = {
        // development模式时打包也带有 hash 值
        config.output.filename('static/js/[name].[hash].js').chunkFilename('static/js/[name].[hash].js').end()

+        config.module
+            .rule('images')
+            .use('url-loader')
+            .loader('url-loader')
+            .tap(options => Object.assign(options, { limit: 0 }))
+
        config.resolve.alias
            .set("@", resolve("src"))
            // .set("weui", resolve("src/utils/plugins/weui.js"))
Author	SHA1	Message	Date
rucky	d7fbe39db6	导出excel下载完成	2022-04-02 16:59:36 +08:00
rucky	a36a99c1f3	生成excel开发中进度 10%	2022-03-22 00:49:58 +08:00
rucky	8507d848b4	修改多边形生成	2022-02-23 02:52:53 +08:00
rucky	dad2d7a12d	推币添加界面	2022-02-22 02:13:20 +08:00