-
+
-
Feel free to build your oun casino!
-
-
-
-
无
-
博山区
-
张店区
-
周村区
-
淄川区
+
+
+
+ {{isDraw ? '已抽签' : '开始抽签'}}
+
+
{{item.name}}
-
+
+ 以抽签
+
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
diff --git a/src/app/ui/first-step/first-step.component.scss b/src/app/ui/first-step/first-step.component.scss
index d024bfe..dee0242 100644
--- a/src/app/ui/first-step/first-step.component.scss
+++ b/src/app/ui/first-step/first-step.component.scss
@@ -1,16 +1,17 @@
- html, body {
- width: 100%;
+
+ @import "../../../assets/css/laohujistyle.css";
+.box{
+ width: 100%;
height: 100%;
+ overflow: hidden;
background-image: url("../../../assets/images/backgroud.png");
background-size: 100%;
- //background-size: 99% 99%;
+ overflow: hidden;
}
.head{
width: 100%;
height: 50px;
- /* background-image: url("../../../assets/images/head.png");
- width: 50%; */
img{
width: 100%;
height: 100%;
@@ -39,9 +40,6 @@
height: 90%;
padding: 0.125rem 0.125rem 0;
display: flex;
-
- /* background-attachment: fixed;
- background-repeat:no-repeat; */
}
.centerLeft{
diff --git a/src/app/ui/first-step/first-step.component.ts b/src/app/ui/first-step/first-step.component.ts
index 821bdc7..37c1e9f 100644
--- a/src/app/ui/first-step/first-step.component.ts
+++ b/src/app/ui/first-step/first-step.component.ts
@@ -17,25 +17,48 @@ export class FirstStepComponent implements OnInit {
}
//支队数据和是否抽奖
choujiang=[
- {name:"南宁支队",idnum:1},
- {name:"柳州支队",idnum:2},
- {name:"桂林支队",idnum:3},
- {name:"梧州支队",idnum:4},
- {name:"北海支队",idnum:5},
- {name:"防城港支队",idnum:6},
- {name:"钦州支队",idnum:7},
- {name:"贵港支队",idnum:8},
- {name:"玉林支队",idnum:9},
- {name:"百色支队",idnum:10},
- {name:"贺州支队",idnum:11},
- {name:"河池支队",idnum:12},
- {name:"来宾支队",idnum:13},
- {name:"崇左支队",idnum:14}
+ {name:"南宁支队",id:1,result :localStorage.getItem("南宁支队") || ""},
+ {name:"柳州支队",id:2,result :localStorage.getItem("柳州支队") || ""},
+ {name:"桂林支队",id:3,result :localStorage.getItem("桂林支队") || ""},
+ {name:"梧州支队",id:4,result :localStorage.getItem("梧州支队") || ""},
+ {name:"北海支队",id:5,result :localStorage.getItem("北海支队") || ""},
+ {name:"防城港支队",id:6,result :localStorage.getItem("防城港支队") || ""},
+ {name:"钦州支队",id:7,result :localStorage.getItem("钦州支队") || ""},
+ {name:"贵港支队",id:8,result :localStorage.getItem("贵港支队") || ""},
+ {name:"玉林支队",id:9,result :localStorage.getItem("玉林支队") || ""},
+ {name:"百色支队",id:10,result :localStorage.getItem("百色支队") || ""},
+ {name:"贺州支队",id:11,result :localStorage.getItem("贺州支队") || ""},
+ {name:"河池支队",id:12,result :localStorage.getItem("河池支队") || ""},
+ {name:"来宾支队",id:13,result :localStorage.getItem("来宾支队") || ""},
+ {name:"崇左支队",id:14,result :localStorage.getItem("崇左支队") || ""}
+ ]
+ numList = [
+ {name:"1号",id:1},
+ {name:"2号",id:2},
+ {name:"3号",id:3},
+ {name:"4号",id:4},
+ {name:"5号",id:5},
+ {name:"6号",id:6},
+ {name:"7号",id:7},
+ {name:"8号",id:8},
+ {name:"9号",id:9},
+ {name:"10号",id:10},
+ {name:"11号",id:11},
+ {name:"12号",id:12},
+ {name:"13号",id:13},
+ {name:"14号",id:14}
]
//选中支队
chooseid=-1
- chosseZhidui(key){
- this.chooseid=key
+ isDraw = false
+ clickName(item){
+ this.chooseid= item.id - 1
+ localStorage.setItem("indexNum",item.id)
+ if(localStorage.getItem(item.name)){//如果已经抽过
+ this.isDraw = true
+ }else{
+ this.isDraw = false
+ }
}
turnplate={
diff --git a/src/app/ui/four-step/four-step.component.html b/src/app/ui/four-step/four-step.component.html
new file mode 100644
index 0000000..40967bc
--- /dev/null
+++ b/src/app/ui/four-step/four-step.component.html
@@ -0,0 +1,77 @@
+
+
+
+

+
+

+
+
+
+
+
+
+
请选择支队
+
{{item.name}}
+
+
+
+
+
+
+
+
+ 抽签结果:
+ {{item.result.zhi}}{{item.result.fuzhi}}
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/ui/four-step/four-step.component.scss b/src/app/ui/four-step/four-step.component.scss
new file mode 100644
index 0000000..85b9fd4
--- /dev/null
+++ b/src/app/ui/four-step/four-step.component.scss
@@ -0,0 +1,183 @@
+
+
+ @import "../../../assets/css/laohujistyle.css";
+ .box{
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ background-image: url("../../../assets/images/backgroud.png");
+ background-size: 100%;
+ overflow: hidden;
+ }
+ .head{
+ width: 100%;
+ height: 50px;
+ img{
+ width: 100%;
+ height: 100%;
+ }
+ .ziti{
+ position: relative;
+ bottom: 70%;
+ left: 40%;
+ width: 20%;
+ height: 53%;
+ }
+ span{
+ position: relative;
+ bottom: 70%;
+ left: 45%;
+ font-size: 28px;
+ background:linear-gradient(#ff4b27, #ff6e41);
+ -webkit-background-clip: text;
+ color: transparent;
+ -webkit-text-fill-color: transparent;
+ text-fill-color: transparent;
+ }
+ }
+ .mainbox {
+ width: 99%;
+ height: 90%;
+ padding: 0.125rem 0.125rem 0;
+ display: flex;
+ }
+
+ .centerLeft{
+ background-color: #FFF;
+ float: left;
+ height: 98%;
+ width: 100%;
+ position: relative;
+ flex-direction: column;
+ flex: 2%;
+ display: flex;
+ align-items:center;
+ box-sizing: border-box;
+ margin: 0 0;
+ .tanCenterbtn{
+ width: 350px;
+ height: 100%;
+ border: 1px solid #ECEDEE;
+ display: flex;
+ flex-direction: column;
+ user-select: none;
+ background-size:100% 100%;
+ span{
+ white-space: nowrap;
+ font-family: Arial;
+ color: #000;
+ z-index:99;
+ width: 300px;
+ height: 40px;
+ cursor:pointer;
+ border-bottom:1px solid #ECEDEE;
+ padding:8px 24px ;
+ text-align: center;
+ font-size: 24px;
+ }
+ }
+ }
+ .centerLefta{
+ background-color: #FFF;
+ float: left;
+ height: 98%;
+ width: 100%;
+ position: relative;
+ flex-direction: column;
+ flex: 2%;
+ display: flex;
+ align-items:center;
+ box-sizing: border-box;
+ margin: 0 0;
+ .tanCenterbtna{
+ width: 100px;
+ height: 100%;
+ border: 1px solid #ECEDEE;
+ display: flex;
+ flex-direction: column;
+ user-select: none;
+ background-size:100% 100%;
+ span{
+ white-space: nowrap;
+ font-family: Arial;
+ color: #000;
+ z-index:99;
+ width: 50px;
+ height: 40px;
+ cursor:pointer;
+ border-bottom:1px solid #ECEDEE;
+ padding:8px 24px ;
+ text-align: center;
+ font-size: 24px;
+ }
+ }
+ }
+ .colum{
+ height: 90%;
+ width: 350px;
+ margin-top: 72px;
+ display:table-cell;
+ vertical-align:middle;
+ text-align: center;
+ span{
+ font-size: 24px;
+
+ //padding-top: 50%;
+ }
+ }
+ .zhuan{
+ width: 500px;
+ margin-left: 160px;
+ margin-top: 10%;
+ }
+ .stop{
+ pointer-events: none;
+ }
+ .button {
+ height: 48px;
+ width: 130px;
+ background-color:transparent;
+ border-radius: 4px;
+ border: 1px solid #ECEDEE;
+ color: #FFF;
+ padding: 12px 32px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ font-size: 16px;
+ margin: 4px 2px;
+ cursor: pointer;
+ }
+ .chongzhi{
+ position: relative;
+ top: 85%;
+ right: 17%;
+ }
+
+ //选择后加背景色
+ .beijicolor{
+ background-color:#FE693E ;
+ }
+ body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;}
+ body{color:#333; font-size:12px;font-family:"Microsoft YaHei"}
+ ul,ol{list-style-type:none;}
+ select,input,img,select{vertical-align:middle;}
+ input{ font-size:12px;}
+ a{ text-decoration:none; color:#000;}
+ a:hover{color:#c00; text-decoration:none;}
+ .clear{clear:both;}
+
+ /* 大转盘样式 */
+ .banner{//max-height: 650px;
+ display: block;
+ width: 95%;
+ //max-width: 650px;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: 20px;
+ }
+ .banner .turnplate{display:block;width:100%;position:relative;}
+ .banner .turnplate canvas.item{width:100%;height: 100%;}
+ .banner .turnplate img.pointer{position:absolute;width:30.5%;height:36.5%;left:34.6%;top:28.5%;}
+
+
\ No newline at end of file
diff --git a/src/app/ui/four-step/four-step.component.spec.ts b/src/app/ui/four-step/four-step.component.spec.ts
new file mode 100644
index 0000000..ad67d40
--- /dev/null
+++ b/src/app/ui/four-step/four-step.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FourStepComponent } from './four-step.component';
+
+describe('FourStepComponent', () => {
+ let component: FourStepComponent;
+ let fixture: ComponentFixture
;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ FourStepComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(FourStepComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/ui/four-step/four-step.component.ts b/src/app/ui/four-step/four-step.component.ts
new file mode 100644
index 0000000..a3f2614
--- /dev/null
+++ b/src/app/ui/four-step/four-step.component.ts
@@ -0,0 +1,80 @@
+import { Component, OnInit } from '@angular/core';
+import '../../../assets/js/firststep2'
+@Component({
+ selector: 'app-four-step',
+ templateUrl: './four-step.component.html',
+ styleUrls: ['./four-step.component.scss']
+})
+export class FourStepComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit(){
+ window.setTimeout(()=>{
+ //zhuan.drawRouletteWheel()
+ },0)
+
+ }
+ //支队数据和是否抽奖
+ choujiang = [
+ {name:"南宁支队",id:1,result :JSON.parse(localStorage.getItem("南宁支队seatnumber")) || ""},
+ {name:"柳州支队",id:2,result :JSON.parse(localStorage.getItem("柳州支队seatnumber")) || ""},
+ {name:"桂林支队",id:3,result :JSON.parse(localStorage.getItem("桂林支队seatnumber")) || ""},
+ {name:"梧州支队",id:4,result :JSON.parse(localStorage.getItem("梧州支队seatnumber")) || ""},
+ {name:"北海支队",id:5,result :JSON.parse(localStorage.getItem("北海支队seatnumber")) || ""},
+ {name:"防城港支队",id:6,result :JSON.parse(localStorage.getItem("防城港支队seatnumber")) || ""},
+ {name:"钦州支队",id:7,result :JSON.parse(localStorage.getItem("钦州支队seatnumber")) || ""},
+ {name:"贵港支队",id:8,result :JSON.parse(localStorage.getItem("贵港支队seatnumber")) || ""},
+ {name:"玉林支队",id:9,result :JSON.parse(localStorage.getItem("玉林支队seatnumber")) || ""},
+ {name:"百色支队",id:10,result :JSON.parse(localStorage.getItem("百色支队seatnumber")) || ""},
+ {name:"贺州支队",id:11,result :JSON.parse(localStorage.getItem("贺州支队seatnumber")) || ""},
+ {name:"河池支队",id:12,result :JSON.parse(localStorage.getItem("河池支队seatnumber")) || ""},
+ {name:"来宾支队",id:13,result :JSON.parse(localStorage.getItem("来宾支队seatnumber")) || ""},
+ {name:"崇左支队",id:14,result :JSON.parse(localStorage.getItem("崇左支队seatnumber")) || ""}
+ ]
+ numList = [
+ {name:"1号",id:1},
+ {name:"2号",id:2},
+ {name:"3号",id:3},
+ {name:"4号",id:4},
+ {name:"5号",id:5},
+ {name:"6号",id:6},
+ {name:"7号",id:7},
+ {name:"8号",id:8},
+ {name:"9号",id:9},
+ {name:"10号",id:10},
+ {name:"11号",id:11},
+ {name:"12号",id:12},
+ {name:"13号",id:13},
+ {name:"14号",id:14}
+ ]
+ numList2 = [
+ {name:"15号",id:15},
+ {name:"16号",id:16},
+ {name:"17号",id:17},
+ {name:"18号",id:18},
+ {name:"19号",id:19},
+ {name:"20号",id:20},
+ {name:"21号",id:21},
+ {name:"22号",id:22},
+ {name:"23号",id:23},
+ {name:"24号",id:24},
+ {name:"25号",id:25},
+ {name:"26号",id:26},
+ {name:"27号",id:27},
+ {name:"28号",id:28}
+ ]
+ //选中支队
+ chooseid=-1
+ isDraw = false
+ clickName(item){
+ this.chooseid = item.id - 1
+ localStorage.setItem("indexNum",item.id)
+ if(localStorage.getItem(item.name)){//如果已经抽过
+ this.isDraw = true
+ }else{
+ this.isDraw = false
+ }
+ }
+
+}
diff --git a/src/app/ui/ui.module.ts b/src/app/ui/ui.module.ts
index b7c5d42..bafb788 100644
--- a/src/app/ui/ui.module.ts
+++ b/src/app/ui/ui.module.ts
@@ -62,9 +62,10 @@ import { CountdownModule } from 'ngx-countdown';
import { LuckDrawComponent } from './luck-draw/luck-draw.component';
import { ResetComponent } from './reset/reset.component';
import { FirstStepComponent } from './first-step/first-step.component';
+import { FourStepComponent } from './four-step/four-step.component';
@NgModule({
- declarations: [SafeHtmlPipe,UiComponent,PersonaldataComponent, ChangepasswordComponent,IsnoPipe,ConfirmpswDirective,TimePipe,WorkingAreaComponent, LuckDrawComponent, ResetComponent, FirstStepComponent],
+ declarations: [SafeHtmlPipe,UiComponent,PersonaldataComponent, ChangepasswordComponent,IsnoPipe,ConfirmpswDirective,TimePipe,WorkingAreaComponent, LuckDrawComponent, ResetComponent, FirstStepComponent, FourStepComponent],
imports: [
CommonModule,
diff --git a/src/assets/css/laohujistyle.css b/src/assets/css/laohujistyle.css
index ade2d74..8128335 100644
--- a/src/assets/css/laohujistyle.css
+++ b/src/assets/css/laohujistyle.css
@@ -1,245 +1,35 @@
@charset "utf-8";
-/* CSS Document */
-
-@import url(http://fonts.googleapis.com/css?family=Pathway+Gothic+One);
-
-a{
- color: #ccd500;
- text-decoration: none;
-}
-a:hover{
- text-decoration: underline;
- color: #a9b119;
-}
-.clear {
- clear: both;
-}
-html {
- position: relative;
- min-height: 100%;
-}
-body {
-}
-footer {
- position: absolute;
- left: 0;
- bottom: 0;
- height: 80px;
- width: 100%;
- background: black;
-}
-b{
- font-weight: 600;
-}
-
.htmldemo p{font-size: 16px;font-family: "微软雅黑"}
-/* Titulos
--------------------------------------------------------------------------*/
-h1{
- width: 100%;
- color: #000000;
- font-size: 40px;
- margin-bottom: 25px;
-}
-h2{
- color: #000000;
- display: table-cell;
- float: left;
- font-size: 45px;
- line-height: 40px;
- margin: 0 0 50px;
- text-align: center;
- width: 100%;
- font-weight: 300;
-}
-h2 span{
- font-weight: 400;
-}
-h3{
- float: left;
- width: 100%;
- margin: 0 0 20px 0;
- color: white;
- font-size:40px;
- font-family: 'Lato', 'sans-serif';
- font-weight: 300;
-}
-h4{
- color: #ffffff;
- display: table-cell;
- float: left;
- font-size: 35px;
- line-height: 31px;
- margin: 0 0 0;
- text-align: center;
- width: 100%;
- font-weight: 400;
-}
-
-p.title{
- color: #000000;
- display: table-cell;
- float: left;
- font-size: 45px;
- line-height: 40px;
- margin: 0 0 50px;
- text-align: center;
- width: 100%;
- font-weight: 300;
-}
-
-.grey { color:#444;}
-
-/* INICIO
--------------------------------------------------------------------------*/
-#header{
- margin: 0 auto 0;
- width: 100%;
- position: absolute;
- text-align: center;
- top: 0px;
- background-color: #6C5726;
- overflow: hidden;
- position: relative;
- padding: 50px 0px;
- border-top: 10px solid #A48E4E;
- border-bottom: 10px solid #A48E4E;
-}
-#header table, #footer table{
- height: 100%;
- width: 100%;
-}
-#header table td, #footer table td{
- vertical-align: middle;
-}
-#header .content{
- color: #FFFFFF;
- float: left;
- font-size: 50px;
- font-weight: 300;
- line-height: 42px;
- margin-top: 30px;
- text-align: center;
- width: 100%;
-}
-#header .content, #footer .content{
- font-family: 'Pathway Gothic One';
- color: #ffffff;
- float: left;
- font-size: 70px;
- font-weight: 300;
- line-height: 80px;
- margin-top: 2px;
- margin-bottom: 20px;
- text-align: center;
- width: 100%;
- padding: 30px 0px;
-}
-#header .content > div, #footer .content > div{
- display: inline-block;
-}
-
-#footer{
- width:100%;
- background-color: #6C5726;
- border-top: 20px dotted #A48E4E;
- height: 200px;
-}
.line{
- background-color: #DCD293;
padding: 50px 0px 25px 0px;
width:100%;
- border-top: 20px dotted #A48E4E;
+
}
-
-
-
-.machineContainer{
- background-color: #000;
- padding: 5px 1px 5px 1px;
- overflow: hidden;
- height: 135px;
+.content{
+ text-align: center;
+ background: url('../../assets/images/machine.png') no-repeat 50% 120px;
+ height: 500px;
}
.slotMachine{
- width: 32.333333%;
+ width: 40%;
border: 5px solid #000;
height: 100px;
+ line-height: 100px;
padding: 0px;
overflow: hidden;
display: inline-block;
text-align: center;
- /*margin: 0px 5px;*/
- /*border: 5px solid #000;*/
background-color: #ffffff;
-}
-.machineResult{
- color:#fff;
- text-align:center;
+ font-size: 30px;
font-weight: 900;
}
-.noBorder{
- border:none !important;
- background: transparent !important;
-}
.slotMachine .slot{
height:100px;
background-position-x: 55%;
background-repeat: no-repeat;
}
-.slot1{
- background-image: url("../img/slot1.png");
-}
-.slot2{
- background-image: url("../img/slot2.png");
-}
-.slot3{
- background-image: url("../img/slot3.png");
-}
-.slot4{
- background-image: url("../img/slot4.png");
-}
-.slot5{
- background-image: url("../img/slot5.png");
-}
-.slot6{
- background-image: url("../img/slot6.png");
-}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-#textMachine, #textMachine2{
- width:520px;
- height: 67px;
- overflow: hidden;
- display: inline-block;
- text-align: left;
-}
-#textMachine > *, #textMachine2 > *{
- padding: 0px 0px;
-}
-
-
.slotMachineButton{
@@ -250,29 +40,22 @@ p.title{
text-align: center;
}
.slotMachineButton {
- -moz-box-shadow:inset 0px 1px 0px 0px #fce2c1;
- -webkit-box-shadow:inset 0px 1px 0px 0px #fce2c1;
- box-shadow:inset 0px 1px 0px 0px #fce2c1;
- background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffc477), color-stop(1, #fb9e25) );
- background:-moz-linear-gradient( center top, #ffc477 5%, #fb9e25 100% );
- filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc477', endColorstr='#fb9e25');
- background-color:#ffc477;
- border-radius: 75px;
- text-indent:0px;
- border:6px solid #eeb44f;
+ border-radius: 3px;
+ background-color:#fb9e25;
display:inline-block;
color:#ffffff;
- font-size:40px;
+ font-size:36px;
font-weight:bold;
font-style:normal;
- height:100px;
- line-height:90px;
+ height:50px;
+ line-height:50px;
margin-top:10px;
+ margin-right:5%;
width:100px;
text-decoration:none;
text-align:center;
- text-shadow:1px 1px 0px #cc9f52;
cursor:pointer;
+ padding: 3px;
}
.slotMachineButton:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fb9e25), color-stop(1, #ffc477) );
@@ -285,6 +68,13 @@ p.title{
}
-.xxx{
+.disabled{
+ pointer-events: none;
+ background-color: grey;
+}
+.img{
display: none;
+}
+.block{
+ display: inline-block!important;
}
\ No newline at end of file
diff --git a/src/assets/js/firststep.js b/src/assets/js/firststep.js
index 438d873..bdb836a 100644
--- a/src/assets/js/firststep.js
+++ b/src/assets/js/firststep.js
@@ -1,25 +1,86 @@
$(document).ready(function(){
- var list = [ 4, 2 , 1, 3 ]
var index = 0
+ var selected = null //点击的单位名称
+ var selectedIndex = null //点击的单位index
var machine = $("#machine4").slotMachine({
active : 0,
delay : 500,
randomize : function(activeElementIndex){
- return list[index];
+ console.log("xxxxx")
+ if(selected == "南宁支队"){
+ localStorage.setItem(selected,"5号")
+ return 5;
+ }else if(selected == "柳州支队"){
+ localStorage.setItem(selected,'10号')
+ return 10;
+ }else if(selected == "桂林支队"){
+ localStorage.setItem(selected,'14号')
+ return 14;
+ }else if(selected == "梧州支队"){
+ localStorage.setItem(selected,'3号')
+ return 3;
+ }else if(selected == "北海支队"){
+ console.log(1996,)
+ localStorage.setItem(selected,'8号')
+ return 8;
+ }else if(selected == "防城港支队"){
+ localStorage.setItem(selected,'13号')
+ return 13;
+ }else if(selected == "钦州支队"){
+ localStorage.setItem(selected,'6号')
+ return 6;
+ }else if(selected == "贵港支队"){
+ localStorage.setItem(selected,'1号')
+ return 1;
+ }else if(selected == "玉林支队"){
+ localStorage.setItem(selected,'7号')
+ return 7;
+ }else if(selected == "百色支队"){
+ localStorage.setItem(selected,'12号')
+ return 12;
+ }else if(selected == "贺州支队"){
+ localStorage.setItem(selected,'2号')
+ return 2;
+ }else if(selected == "河池支队"){
+ localStorage.setItem(selected,'4号')
+ return 4;
+ }else if(selected == "来宾支队"){
+ localStorage.setItem(selected,'9号')
+ return 9;
+ }else if(selected == "崇左支队"){
+ localStorage.setItem(selected,'11号')
+ return 11;
+ }
+
}
});
$("#slotMachineButtonShuffle").click(function(){
- machine.shuffle();
- $("#slotMachineButtonShuffle").addClass("xxx");
- setTimeout(() => {
- index ++
- machine.stop();
- $("#slotMachineButtonShuffle").removeClass("xxx");
- }, 1000);
- });
-
- // $("#slotMachineButtonStop").click(function(){
+ if(!selected){
+ alert("请先选择单位")
+ }else{
+ machine.shuffle();
+ $("#slotMachineButtonShuffle").addClass("disabled");
+ setTimeout(() => {
+ machine.stop();
+ // $("#slotMachineButtonShuffle").removeClass("disabled");
+ setTimeout(() => {
+ $("#endjieguo span").eq(selectedIndex).html(window.localStorage[selected])
+ $("#chooseZhi .img").eq(selectedIndex - 1).css("display","inline-block");
+ }, 1300);
+ }, 1000);
+ }
- // });
+ });
+
+ //左侧表格点击事件
+ $("span[name='aaa']").on("click",function(e,index){
+ selected = $(this)[0].innerText
+ selectedIndex = localStorage.getItem("indexNum")
+ if($("#endjieguo span").eq(selectedIndex)[0].innerText){
+ $("#slotMachineButtonShuffle").addClass("disabled");
+ }else{
+ $("#slotMachineButtonShuffle").removeClass("disabled");
+ }
+ })
});
\ No newline at end of file
diff --git a/src/assets/js/firststep2.js b/src/assets/js/firststep2.js
new file mode 100644
index 0000000..61bad39
--- /dev/null
+++ b/src/assets/js/firststep2.js
@@ -0,0 +1,151 @@
+$(document).ready(function(){
+ var index = 0
+ var selected = null //点击的单位名称
+ var selectedtime = null //点击的单位名称 + 'time'
+ var selectedIndex = null //点击的单位index
+ var machine = $("#machine2").slotMachine({
+ active : 0,
+ delay : 500,
+ randomize : function(activeElementIndex){
+ if(selected == "南宁支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"8号",fuzhi:"21号"}))
+ return 7;
+ }else if(selected == "柳州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"12号",fuzhi:"26号"}))
+ return 11;
+ }else if(selected == "桂林支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"14号",fuzhi:"15号"}))
+ return 13;
+ }else if(selected == "梧州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"13号",fuzhi:"28号"}))
+ return 12;
+ }else if(selected == "北海支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"4号",fuzhi:"22号"}))
+ return 3;
+ }else if(selected == "防城港支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"1号",fuzhi:"16号"}))
+ return 0;
+ }else if(selected == "钦州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"10号",fuzhi:"25号"}))
+ return 9;
+ }else if(selected == "贵港支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"11号",fuzhi:"19号"}))
+ return 10;
+ }else if(selected == "玉林支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"2号",fuzhi:"27号"}))
+ return 1;
+ }else if(selected == "百色支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"9号",fuzhi:"20号"}))
+ return 8;
+ }else if(selected == "贺州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"3号",fuzhi:"24号"}))
+ return 2;
+ }else if(selected == "河池支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"6号",fuzhi:"18号"}))
+ return 5;
+ }else if(selected == "来宾支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"7号",fuzhi:"23号"}))
+ return 6;
+ }else if(selected == "崇左支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"5号",fuzhi:"17号"}))
+ return 4;
+ }
+ }
+ });
+ var machine6 = $("#machine6").slotMachine({
+ active : 1,
+ delay : 500,
+ randomize : function(activeElementIndex){
+ if(selected == "南宁支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"8号",fuzhi:"21号"}))
+ return 6;
+ }else if(selected == "柳州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"12号",fuzhi:"26号"}))
+ return 11;
+ }else if(selected == "桂林支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"14号",fuzhi:"15号"}))
+ return 0;
+ }else if(selected == "梧州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"13号",fuzhi:"28号"}))
+ return 13;
+ }else if(selected == "北海支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"4号",fuzhi:"22号"}))
+ return 7;
+ }else if(selected == "防城港支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"1号",fuzhi:"16号"}))
+ return 1;
+ }else if(selected == "钦州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"10号",fuzhi:"25号"}))
+ return 10;
+ }else if(selected == "贵港支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"11号",fuzhi:"19号"}))
+ return 4;
+ }else if(selected == "玉林支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"2号",fuzhi:"27号"}))
+ return 12;
+ }else if(selected == "百色支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"9号",fuzhi:"20号"}))
+ return 5;
+ }else if(selected == "贺州支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"3号",fuzhi:"24号"}))
+ return 9;
+ }else if(selected == "河池支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"6号",fuzhi:"18号"}))
+ return 3;
+ }else if(selected == "来宾支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"7号",fuzhi:"23号"}))
+ return 8;
+ }else if(selected == "崇左支队"){
+ localStorage.setItem(selectedtime,JSON.stringify({zhi:"5号",fuzhi:"17号"}))
+ return 2;
+ }
+ }
+ });
+ var data = [
+ {'南宁支队':'8号21号'},
+ {'柳州支队':'12号26号'},
+ {'桂林支队':'14号15号'},
+ {'梧州支队':'13号28号'},
+ {'北海支队':'4号22号'},
+ {'防城港支队':'1号16号'},
+ {'钦州支队':'10号25号'},
+ {'贵港支队':'11号19号'},
+ {'玉林支队':'2号27号'},
+ {'百色支队':'9号20号'},
+ {'贺州支队':'3号24号'},
+ {'河池支队':'6号18号'},
+ {'来宾支队':'7号23号'},
+ {'崇左支队':'5号17号'}
+ ]
+
+ $("#slotMachineButtonShuffle2").click(function(){
+ if(!selected){
+ alert("请先选择单位")
+ }else{
+ machine.shuffle();
+ machine6.shuffle();
+ $("#slotMachineButtonShuffle2").addClass("disabled");
+ setTimeout(() => {
+ machine.stop();
+ machine6.stop();
+ setTimeout(() => {
+ $("#endjieguo2 span").eq(selectedIndex).html(data[selectedIndex - 1][selected])
+ $("#chooseZhi2 .img").eq(selectedIndex - 1).css("display","inline-block");
+ }, 1300);
+ }, 1000);
+ }
+ });
+
+ //左侧表格点击事件
+ $("span[name='bbb']").on("click",function(e,index){
+ selected = $(this)[0].innerText
+ selectedtime = $(this)[0].innerText + 'seatnumber'
+ selectedIndex = localStorage.getItem("indexNum")
+ console.log(456,selected,selectedIndex)
+ if($("#endjieguo2 span").eq(selectedIndex)[0].innerText){
+ $("#slotMachineButtonShuffle2").addClass("disabled");
+ }else{
+ $("#slotMachineButtonShuffle2").removeClass("disabled");
+ }
+ })
+});
\ No newline at end of file
diff --git a/src/styles.scss b/src/styles.scss
index 33b023e..a65541a 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -5,6 +5,7 @@ html,body{
height: 100%;
margin:0 auto;
padding:0;
+ overflow: hidden;
}
ul,ol,dl,li,dt,dd,p,form,input,h1,h2,h3,h4,h5,h6,section,article,aside,header,footer,nav,figure,time,mark,main,canvas{
margin:0;