Skip to content

activities / web-lottery

Go to a project
Commit 4794654b by 施嘉伟
Options

refactor: 优化活动介绍组件样式逻辑

parent 602ea5e5
Showing with 338 additions and 462 deletions
components/Lottery/Instant/Introduction.vue
<template> <template>
<div class="introduction" :style="introBoxStyle"> <div class="introduction">
<div class="introduction__sec-title" :style="titleStyle">{{ titleText }}</div> <div class="introduction__sec-title">活动介绍</div>
<div class="introduction__wrap" :style="wrapStyle"> <div class="introduction__wrap">
<div class="introduction__content" :style="contentStyle"> <div class="introduction__content">
<p v-if="rule.position === 'top'" class="introduction__intro" :style="rule.style">{{ lotteryInfo.intro }}</p> <p v-if="rulePosition === 'top'" class="introduction__intro">{{ lotteryInfo.intro }}</p>
<template v-if="!!lotteryInfo.isShowPrize"> <template v-if="!!lotteryInfo.isShowPrize">
<div class="introduction__title">本场活动奖品：</div> <div class="introduction__title">本场活动奖品：</div>
<div class="introduction__prize"> <div class="introduction__prize">
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
</ul> </ul>
</div> </div>
</template> </template>
<div v-if="rule.position === 'bottom'" class="introduction__intro" :style="rule.style"> <div v-if="rulePosition === 'bottom'" class="introduction__intro">
<p class="introduction__intro-rule">活动规则</p> <p class="introduction__intro-rule">活动规则</p>
<p>{{ lotteryInfo.intro }}</p> <p>{{ lotteryInfo.intro }}</p>
</div> </div>
...@@ -35,33 +35,10 @@ import img from '@/assets/images/lottery/gift.png' ...@@ -35,33 +35,10 @@ import img from '@/assets/images/lottery/gift.png'
export default { export default {
name: 'Introduction', name: 'Introduction',
props: { props: {
rule: { rulePosition: {
type: Object,
default: () => ({
position: 'top',
style: {}
})
},
titleStyle: {
type: Object,
default: () => ({})
},
titleText: {
type: String, type: String,
default: '' default: 'top'
},
wrapStyle: {
type: Object,
default: () => ({})
}, },
contentStyle: {
type: Object,
default: () => ({})
},
introBoxStyle: {
type: Object,
default: () => ({})
}
}, },
data() { data() {
return { return {
...@@ -91,6 +68,7 @@ export default { ...@@ -91,6 +68,7 @@ export default {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: cover; background-size: cover;
font-size: 0;
} }
&__wrap { &__wrap {
width: 100%; width: 100%;
......
components/Lottery/Instant/IntroductionPopup.vue
...@@ -5,15 +5,14 @@ ...@@ -5,15 +5,14 @@
position="bottom" position="bottom"
transition="van-fade" transition="van-fade"
class="introduction-popup" class="introduction-popup"
:style="popupStyle"
> >
<div class="introduction-popup__main"> <div class="introduction-popup__main">
<div class="introduction-popup__sec-title" :style="titleStyle">活动介绍</div> <div class="introduction-popup__sec-title">活动介绍</div>
<div class="introduction-popup__wrap" :style="wrapStyle"> <div class="introduction-popup__wrap">
<div class="introduction-popup__content" :style="contentStyle"> <div class="introduction-popup__content">
<p v-if="rule.position === 'top'" class="introduction-popup__intro" :style="rule.style">{{ lotteryInfo.intro }}</p> <p v-if="rulePosition === 'top'" class="introduction-popup__intro">{{ lotteryInfo.intro }}</p>
<template v-if="!!lotteryInfo.isShowPrize"> <template v-if="!!lotteryInfo.isShowPrize">
<div class="introduction-popup__box" :style="contentBoxStyle"> <div class="introduction-popup__box">
<div class="introduction-popup__title">本场活动奖品：</div> <div class="introduction-popup__title">本场活动奖品：</div>
<div class="introduction-popup__prize"> <div class="introduction-popup__prize">
<ul <ul
...@@ -29,13 +28,13 @@ ...@@ -29,13 +28,13 @@
</div> </div>
</div> </div>
</template> </template>
<div v-if="rule.position === 'bottom'" class="introduction-popup__intro" :style="rule.style"> <div v-if="rulePosition === 'bottom'" class="introduction-popup__intro">
<p class="introduction-popup__intro-rule">活动规则</p> <p class="introduction-popup__intro-rule">活动规则</p>
<p>{{ lotteryInfo.intro }}</p> <p>{{ lotteryInfo.intro }}</p>
</div> </div>
</div> </div>
</div> </div>
<div class="introduction-popup__back" :style="backStyle" @click="visible = false">返回活动</div> <div class="introduction-popup__back" @click="visible = false">返回活动</div>
</div> </div>
</van-popup> </van-popup>
</template> </template>
...@@ -52,37 +51,10 @@ export default { ...@@ -52,37 +51,10 @@ export default {
type: Boolean, type: Boolean,
default: false default: false
}, },
rule: { rulePosition: {
type: Object, type: String,
default: () => ({ default: 'top'
position: 'top',
style: {}
})
}, },
contentBoxStyle: {
type: Object,
default: () => ({})
},
titleStyle: {
type: Object,
default: () => ({})
},
wrapStyle: {
type: Object,
default: () => ({})
},
contentStyle: {
type: Object,
default: () => ({})
},
popupStyle: {
type: Object,
default: () => ({})
},
backStyle: {
type: Object,
default: () => ({})
}
}, },
data() { data() {
return { return {
......
components/Lottery/Instant/Main.vue
...@@ -150,7 +150,7 @@ ...@@ -150,7 +150,7 @@
</div> </div>
</div> </div>
<Records></Records> <Records></Records>
<Introduction class="lottery-instant__intro" :title-style="wheelIntroductionTitleStyle"></Introduction> <Introduction class="lottery-instant__intro"></Introduction>
<WinPopup v-model="isShowWin" :info="winInfo" @winCallback="winCallback"></WinPopup> <WinPopup v-model="isShowWin" :info="winInfo" @winCallback="winCallback"></WinPopup>
<BindPhoneDialog v-model="isShowBindPhone"></BindPhoneDialog> <BindPhoneDialog v-model="isShowBindPhone"></BindPhoneDialog>
</section> </section>
...@@ -162,7 +162,6 @@ import { setLottery } from '@/api/modules/lottery' ...@@ -162,7 +162,6 @@ import { setLottery } from '@/api/modules/lottery'
import { LOTTERY_STATUS, LOTTERY_STATUS_TXT, LOTTERY_STYLE } from '@/utils/constant' import { LOTTERY_STATUS, LOTTERY_STATUS_TXT, LOTTERY_STYLE } from '@/utils/constant'
import { PrizeGrid, PrizeWheel } from 'lotteries' import { PrizeGrid, PrizeWheel } from 'lotteries'
import 'lotteries/lib/index.css' import 'lotteries/lib/index.css'
import wheelIntroductionTitleImg from '@/assets/images/lottery/intro_title.png'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
export default { export default {
...@@ -251,11 +250,6 @@ export default { ...@@ -251,11 +250,6 @@ export default {
} }
return '' return ''
}, },
wheelIntroductionTitleStyle() {
return {
backgroundImage: `url(${wheelIntroductionTitleImg})`
}
}
}, },
mounted() { mounted() {
// this.lotteryInfo.showType = 4 // this.lotteryInfo.showType = 4
......
components/Lottery/Instant/RecordsPupupNew.vue
<template> <template>
<van-popup v-model="visible" class="records-popup" swipeable> <van-popup v-model="visible" class="records-popup" swipeable>
<div class="records-popup__close" :style="closeBg" @click="closePopup"></div> <div class="records-popup__close" @click="closePopup"></div>
<div class="records-popup__title"> <div class="records-popup__title">
<div class="records-popup__title-personal" :style="personalBg" @click="changeActive('personal')"></div> <div class="records-popup__title-personal" :style="personalBg" @click="changeActive('personal')"></div>
<div class="records-popup__title-winners" :style="winnersBg" @click="changeActive('winners')"></div> <div class="records-popup__title-winners" :style="winnersBg" @click="changeActive('winners')"></div>
......
components/Lottery/Instant/type/TypeGashapon.vue
...@@ -27,15 +27,7 @@ ...@@ -27,15 +27,7 @@
</WinPopupNew> </WinPopupNew>
<BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog> <BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<Introduction <Introduction class="lottery-instant__intro" rule-position="bottom"></Introduction>
class="lottery-instant__intro"
:title-text="introConfig.titleText"
:rule="introConfig.rule"
:title-style="introConfig.introTitleStyle"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:intro-box-style="introConfig.introBoxStyle"
></Introduction>
</section> </section>
</template> </template>
...@@ -47,7 +39,6 @@ import { mapGetters } from 'vuex' ...@@ -47,7 +39,6 @@ import { mapGetters } from 'vuex'
import { LOTTERY_STATUS } from '@/utils/constant' import { LOTTERY_STATUS } from '@/utils/constant'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { import {
introductionConfigGashapon,
winConfigGashapon, winConfigGashapon,
recordsConfigGashapon, recordsConfigGashapon,
ballListGashapon, ballListGashapon,
...@@ -93,7 +84,6 @@ export default { ...@@ -93,7 +84,6 @@ export default {
stype: this.$route.query.stype || null, // 引用类型 stype: this.$route.query.stype || null, // 引用类型
recordsConfig: recordsConfigGashapon, // 中奖记录样式配置 recordsConfig: recordsConfigGashapon, // 中奖记录样式配置
winConfig: winConfigGashapon, // 开奖样式 winConfig: winConfigGashapon, // 开奖样式
introConfig: introductionConfigGashapon,
barStyle: countDownBarPurple, barStyle: countDownBarPurple,
ballListGashapon // 扭蛋球图片 ballListGashapon // 扭蛋球图片
} }
...@@ -223,4 +213,35 @@ export default { ...@@ -223,4 +213,35 @@ export default {
white-space: nowrap; white-space: nowrap;
} }
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction {
background-color: #7826A9;
padding: 8px 15px 30px 15px;
border-radius: 0;
&__sec-title {
background-image: none;
font-size: 16px;
font-weight: 700;
text-align: center;
width: 22%;
height: auto;
padding: 4px 0;
left: 50%;
color: #fff;
transform: translate(-50%, 50%);
background-color: #ffffff63;
border-radius: 2px;
}
&__wrap {
background-color: #7826a9;
padding: 2px;
}
&__content {
background: #7826a9;
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGashapon2.vue
...@@ -29,15 +29,7 @@ ...@@ -29,15 +29,7 @@
</WinPopupNew> </WinPopupNew>
<BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog> <BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<Introduction <Introduction class="lottery-instant__intro" rule-position="bottom"></Introduction>
class="lottery-instant__intro"
:title-text="introConfig.titleText"
:rule="introConfig.rule"
:title-style="introConfig.introTitleStyle"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:intro-box-style="introConfig.introBoxStyle"
></Introduction>
</section> </section>
</template> </template>
...@@ -49,7 +41,6 @@ import { mapGetters } from 'vuex' ...@@ -49,7 +41,6 @@ import { mapGetters } from 'vuex'
import { LOTTERY_STATUS } from '@/utils/constant' import { LOTTERY_STATUS } from '@/utils/constant'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { import {
introductionConfigGashapon2 as introductionConfigGashapon,
winConfigGashapon2 as winConfigGashapon, winConfigGashapon2 as winConfigGashapon,
recordsConfigGashapon2 as recordsConfigGashapon, recordsConfigGashapon2 as recordsConfigGashapon,
ballListGashapon, ballListGashapon,
...@@ -95,7 +86,6 @@ export default { ...@@ -95,7 +86,6 @@ export default {
stype: this.$route.query.stype || null, // 引用类型 stype: this.$route.query.stype || null, // 引用类型
recordsConfig: recordsConfigGashapon, // 中奖记录样式配置 recordsConfig: recordsConfigGashapon, // 中奖记录样式配置
winConfig: winConfigGashapon, // 开奖样式 winConfig: winConfigGashapon, // 开奖样式
introConfig: introductionConfigGashapon,
barStyle: countDownBarNone, barStyle: countDownBarNone,
ballListGashapon // 扭蛋球图片 ballListGashapon // 扭蛋球图片
} }
...@@ -221,4 +211,36 @@ export default { ...@@ -221,4 +211,36 @@ export default {
} }
} }
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction {
background-color: #ffbd33;
padding: 75px 11px 8px 11px;
border-radius: 0;
&__sec-title {
background-image: url('@/assets/images/lottery/gashapon2/intro-wrap-title.png');
width: 95%;
padding: 4px 0;
color: #fff;
font-size: 18px;
text-align: center;
line-height: 2;
top: -7%;
left: 50%;
transform: translate(-50%, 50%);
}
&__wrap {
background-image: url('@/assets/images/lottery/gashapon2/intro-wrap-bg.png');
background-size: 100% 100%;
padding: 15px 18px 25px 18px;
background-color: transparent;
}
&__content {
background: #fff9e9;
border-radius: 2px;
color: #000;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGashaponMini.vue
...@@ -30,12 +30,7 @@ ...@@ -30,12 +30,7 @@
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<IntroductionPopup <IntroductionPopup
:value="isShowIntro" :value="isShowIntro"
:wrap-style="introConfig.introWrapStyle" rule-position="bottom"
:content-style="introConfig.introContentStyle"
:popup-style="introConfig.introPopupStyle"
:content-box-style="introConfig.contentBoxStyle"
:back-style="introConfig.backStyle"
:rule="introConfig.rule"
></IntroductionPopup> ></IntroductionPopup>
</section> </section>
</template> </template>
...@@ -48,7 +43,6 @@ import { mapGetters } from 'vuex' ...@@ -48,7 +43,6 @@ import { mapGetters } from 'vuex'
import { LOTTERY_STATUS } from '@/utils/constant' import { LOTTERY_STATUS } from '@/utils/constant'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { import {
introductionConfigGashaponMini,
winConfigGashapon, winConfigGashapon,
recordsConfigGashapon, recordsConfigGashapon,
ballListGashapon, ballListGashapon,
...@@ -98,7 +92,6 @@ export default { ...@@ -98,7 +92,6 @@ export default {
stype: this.$route.query.stype || null, // 引用类型 stype: this.$route.query.stype || null, // 引用类型
recordsConfig: recordsConfigGashapon, // 中奖记录样式配置 recordsConfig: recordsConfigGashapon, // 中奖记录样式配置
winConfig: winConfigGashapon, // 开奖样式 winConfig: winConfigGashapon, // 开奖样式
introConfig: introductionConfigGashaponMini,
barStyle: countDownBarPurple, barStyle: countDownBarPurple,
ballListGashapon // 扭蛋球图片 ballListGashapon // 扭蛋球图片
} }
...@@ -242,4 +235,37 @@ export default { ...@@ -242,4 +235,37 @@ export default {
border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px;
} }
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction-popup {
background: url('@/assets/images/lottery/guess/intro-bg-mini.png');
&__wrap {
background-color: transparent;
padding: 2px;
}
&__content {
background-color: transparent;
color: #fff;
padding: 0;
}
&__box {
background-color: #00000030;
padding: 1px 15px 15px 15px;
border-radius: 22px;
}
&__back {
top: 10px;
right: 0;
background: linear-gradient(180deg, #ffd63e 0%, #fca60d 100%);
box-shadow: 0 1px 2px 0 rgba(202, 146, 46, 1);
border-radius: 10px 0 0 10px;
padding: 6px 3px;
border: 0;
}
&__intro {
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGashaponMini2.vue
...@@ -29,12 +29,7 @@ ...@@ -29,12 +29,7 @@
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<IntroductionPopup <IntroductionPopup
:value="isShowIntro" :value="isShowIntro"
:wrap-style="introConfig.introWrapStyle" rule-position="bottom"
:content-style="introConfig.introContentStyle"
:popup-style="introConfig.introPopupStyle"
:content-box-style="introConfig.contentBoxStyle"
:back-style="introConfig.backStyle"
:rule="introConfig.rule"
></IntroductionPopup> ></IntroductionPopup>
</section> </section>
</template> </template>
...@@ -47,7 +42,6 @@ import { mapGetters } from 'vuex' ...@@ -47,7 +42,6 @@ import { mapGetters } from 'vuex'
import { LOTTERY_STATUS } from '@/utils/constant' import { LOTTERY_STATUS } from '@/utils/constant'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { import {
introductionConfigGashaponMini2 as introductionConfigGashaponMini,
winConfigGashapon2 as winConfigGashapon, winConfigGashapon2 as winConfigGashapon,
recordsConfigGashapon2 as recordsConfigGashapon, recordsConfigGashapon2 as recordsConfigGashapon,
ballListGashapon, ballListGashapon,
...@@ -97,7 +91,6 @@ export default { ...@@ -97,7 +91,6 @@ export default {
stype: this.$route.query.stype || null, // 引用类型 stype: this.$route.query.stype || null, // 引用类型
recordsConfig: recordsConfigGashapon, // 中奖记录样式配置 recordsConfig: recordsConfigGashapon, // 中奖记录样式配置
winConfig: winConfigGashapon, // 开奖样式 winConfig: winConfigGashapon, // 开奖样式
introConfig: introductionConfigGashaponMini,
barStyle: countDownBarWhite, barStyle: countDownBarWhite,
ballListGashapon // 扭蛋球图片 ballListGashapon // 扭蛋球图片
} }
...@@ -224,4 +217,37 @@ export default { ...@@ -224,4 +217,37 @@ export default {
border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px;
} }
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction-popup {
background: url('@/assets/images/lottery/gashapon2/intro-bg-mini.png');
&__wrap {
background-color: transparent;
padding: 2px;
}
&__content {
background-color: transparent;
color: #fff;
padding: 0;
}
&__box {
background-color: #00000030;
padding: 1px 15px 15px 15px;
border-radius: 22px;
}
&__back {
top: 10px;
right: 0;
background: linear-gradient(180deg, #ffd63e 0%, #fca60d 100%);
box-shadow: 0 1px 2px 0 rgba(202, 146, 46, 1);
border-radius: 10px 0 0 10px;
padding: 6px 3px;
border: 0;
}
&__intro {
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGuess.vue
...@@ -34,15 +34,7 @@ ...@@ -34,15 +34,7 @@
</WinPopupNew> </WinPopupNew>
<BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog> <BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<Introduction <Introduction class="lottery-instant__intro" rule-position="bottom"></Introduction>
class="lottery-instant__intro"
:title-text="introConfig.titleText"
:rule="introConfig.rule"
:title-style="introConfig.introTitleStyle"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:intro-box-style="introConfig.introBoxStyle"
></Introduction>
</section> </section>
</template> </template>
...@@ -54,7 +46,6 @@ import { ...@@ -54,7 +46,6 @@ import {
blindBoxListGuess, blindBoxListGuess,
recordsConfigGuess, recordsConfigGuess,
winConfigGuess, winConfigGuess,
introductionConfigGuess,
countDownBarDeepPurple, countDownBarDeepPurple,
starConfig starConfig
} from './config' } from './config'
...@@ -101,7 +92,6 @@ export default { ...@@ -101,7 +92,6 @@ export default {
blindBoxList: blindBoxListGuess, blindBoxList: blindBoxListGuess,
recordsConfig: recordsConfigGuess, // 中奖记录样式配置 recordsConfig: recordsConfigGuess, // 中奖记录样式配置
winConfig: winConfigGuess, // 开奖样式 winConfig: winConfigGuess, // 开奖样式
introConfig: introductionConfigGuess,
barStyle: countDownBarDeepPurple, barStyle: countDownBarDeepPurple,
starConfig starConfig
} }
...@@ -254,4 +244,29 @@ export default { ...@@ -254,4 +244,29 @@ export default {
opacity: 0; opacity: 0;
top: 0 !important; top: 0 !important;
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction {
background: linear-gradient(180deg, #682ca1 0%, #a649d8 100%);
padding: 30px 15px;
border-radius: 0;
&__sec-title {
background-image: none;
font-size: 16px;
font-weight: 700;
text-align: center;
color: #fff;
padding-top: 8px;
}
&__wrap {
background-color: #7f17e3;
padding: 2px;
}
&__content {
background: linear-gradient(180deg, #7b07c5 0%, #450393 100%);
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGuess2.vue
...@@ -34,15 +34,7 @@ ...@@ -34,15 +34,7 @@
</WinPopupNew> </WinPopupNew>
<BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog> <BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<Introduction <Introduction class="lottery-instant__intro" rule-position="bottom"></Introduction>
class="lottery-instant__intro"
:title-text="introConfig.titleText"
:rule="introConfig.rule"
:title-style="introConfig.introTitleStyle"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:intro-box-style="introConfig.introBoxStyle"
></Introduction>
</section> </section>
</template> </template>
...@@ -54,7 +46,6 @@ import { ...@@ -54,7 +46,6 @@ import {
blindBoxListGuess2, blindBoxListGuess2,
recordsConfigGuess, recordsConfigGuess,
winConfigGuess, winConfigGuess,
introductionConfigGuess2 as introductionConfigGuess,
countDownBarDeepPurple, countDownBarDeepPurple,
starConfig starConfig
} from './config' } from './config'
...@@ -101,7 +92,6 @@ export default { ...@@ -101,7 +92,6 @@ export default {
blindBoxList: blindBoxListGuess2, blindBoxList: blindBoxListGuess2,
recordsConfig: recordsConfigGuess, // 中奖记录样式配置 recordsConfig: recordsConfigGuess, // 中奖记录样式配置
winConfig: winConfigGuess, // 开奖样式 winConfig: winConfigGuess, // 开奖样式
introConfig: introductionConfigGuess,
barStyle: countDownBarDeepPurple, barStyle: countDownBarDeepPurple,
starConfig starConfig
} }
...@@ -252,4 +242,33 @@ export default { ...@@ -252,4 +242,33 @@ export default {
.choose-fade-leave-to { .choose-fade-leave-to {
opacity: 0; opacity: 0;
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction {
background: linear-gradient(180deg, #682ca1 0%, #a649d8 100%);
padding: 30px 15px;
border-radius: 0;
&__sec-title {
width: 97px;
height: 20px;
left: 50%;
transform: translate(-50%, 12px);
font-size: 0;
font-weight: 700;
text-align: center;
color: #fff;
background-image: url('@/assets/images/lottery/guess2/intro-title.png');
background-size: 100% 100%;
}
&__wrap {
background-color: #7f17e3;
padding: 2px;
}
&__content {
background: linear-gradient(180deg, #7b07c5 0%, #450393 100%);
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGuessMini.vue
...@@ -35,15 +35,7 @@ ...@@ -35,15 +35,7 @@
</WinPopupNew> </WinPopupNew>
<BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog> <BindPhoneDialog :value="isShowBindPhone"></BindPhoneDialog>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<IntroductionPopup <IntroductionPopup :value="isShowIntro" rule-position="bottom"></IntroductionPopup>
:value="isShowIntro"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:popup-style="introConfig.introPopupStyle"
:content-box-style="introConfig.contentBoxStyle"
:back-style="introConfig.backStyle"
:rule="introConfig.rule"
></IntroductionPopup>
</section> </section>
</template> </template>
...@@ -51,14 +43,7 @@ ...@@ -51,14 +43,7 @@
import { PrizeGuess } from 'lotteries' import { PrizeGuess } from 'lotteries'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { import { blindBoxListGuess, recordsConfigGuess, winConfigGuess, countDownBarDeepPurple, starConfig } from './config'
blindBoxListGuess,
recordsConfigGuess,
winConfigGuess,
introductionConfigGuessMini,
countDownBarDeepPurple,
starConfig
} from './config'
export default { export default {
components: { components: {
...@@ -106,7 +91,6 @@ export default { ...@@ -106,7 +91,6 @@ export default {
blindBoxList: blindBoxListGuess, blindBoxList: blindBoxListGuess,
recordsConfig: recordsConfigGuess, // 中奖记录样式配置 recordsConfig: recordsConfigGuess, // 中奖记录样式配置
winConfig: winConfigGuess, // 开奖样式 winConfig: winConfigGuess, // 开奖样式
introConfig: introductionConfigGuessMini,
barStyle: countDownBarDeepPurple, barStyle: countDownBarDeepPurple,
starConfig starConfig
} }
...@@ -277,4 +261,37 @@ export default { ...@@ -277,4 +261,37 @@ export default {
opacity: 0; opacity: 0;
top: 0 !important; top: 0 !important;
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction-popup {
background: url('@/assets/images/lottery/guess/intro-bg-mini.png');
&__wrap {
background-color: transparent;
padding: 2px;
}
&__content {
background-color: transparent;
color: #fff;
padding: 0;
}
&__box {
background-color: #00000030;
padding: 1px 15px 15px 15px;
border-radius: 22px;
}
&__back {
top: 10px;
right: 0;
background: linear-gradient(180deg, #ffd63e 0%, #fca60d 100%);
box-shadow: 0 1px 2px 0 rgba(202, 146, 46, 1);
border-radius: 10px 0 0 10px;
padding: 6px 3px;
border: 0;
}
&__intro {
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeGuessMini2.vue
...@@ -37,12 +37,7 @@ ...@@ -37,12 +37,7 @@
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<IntroductionPopup <IntroductionPopup
:value="isShowIntro" :value="isShowIntro"
:wrap-style="introConfig.introWrapStyle" rule-position="bottom"
:content-style="introConfig.introContentStyle"
:popup-style="introConfig.introPopupStyle"
:content-box-style="introConfig.contentBoxStyle"
:back-style="introConfig.backStyle"
:rule="introConfig.rule"
></IntroductionPopup> ></IntroductionPopup>
</section> </section>
</template> </template>
...@@ -55,7 +50,6 @@ import { ...@@ -55,7 +50,6 @@ import {
blindBoxListGuess2 as blindBoxListGuess, blindBoxListGuess2 as blindBoxListGuess,
recordsConfigGuess, recordsConfigGuess,
winConfigGuess, winConfigGuess,
introductionConfigGuessMini,
countDownBarDeepPurple, countDownBarDeepPurple,
starConfig starConfig
} from './config' } from './config'
...@@ -106,7 +100,6 @@ export default { ...@@ -106,7 +100,6 @@ export default {
blindBoxList: blindBoxListGuess, blindBoxList: blindBoxListGuess,
recordsConfig: recordsConfigGuess, // 中奖记录样式配置 recordsConfig: recordsConfigGuess, // 中奖记录样式配置
winConfig: winConfigGuess, // 开奖样式 winConfig: winConfigGuess, // 开奖样式
introConfig: introductionConfigGuessMini,
barStyle: countDownBarDeepPurple, barStyle: countDownBarDeepPurple,
starConfig starConfig
} }
...@@ -275,4 +268,37 @@ export default { ...@@ -275,4 +268,37 @@ export default {
.choose-fade-leave-to { .choose-fade-leave-to {
opacity: 0; opacity: 0;
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction-popup {
background: url('@/assets/images/lottery/guess/intro-bg-mini.png');
&__wrap {
background-color: transparent;
padding: 2px;
}
&__content {
background-color: transparent;
color: #fff;
padding: 0;
}
&__box {
background-color: #00000030;
padding: 1px 15px 15px 15px;
border-radius: 22px;
}
&__back {
top: 10px;
right: 0;
background: linear-gradient(180deg, #ffd63e 0%, #fca60d 100%);
box-shadow: 0 1px 2px 0 rgba(202, 146, 46, 1);
border-radius: 10px 0 0 10px;
padding: 6px 3px;
border: 0;
}
&__intro {
color: #fff;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeScratch.vue
...@@ -48,14 +48,7 @@ ...@@ -48,14 +48,7 @@
</div> </div>
</div> </div>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<Introduction <Introduction class="lottery-instant__intro" rule-position="bottom"></Introduction>
class="lottery-instant__intro"
:rule="introConfig.rule"
:title-style="introConfig.introTitleStyle"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:intro-box-style="introConfig.introBoxStyle"
></Introduction>
</section> </section>
</template> </template>
...@@ -67,7 +60,7 @@ import coverImg from '@/assets/images/lottery/scratch/mask.png' ...@@ -67,7 +60,7 @@ import coverImg from '@/assets/images/lottery/scratch/mask.png'
import onStartImg from '@/assets/images/lottery/scratch/on-start.png' import onStartImg from '@/assets/images/lottery/scratch/on-start.png'
import onStartDidabledImg from '@/assets/images/lottery/scratch/on-start-disabled.png' import onStartDidabledImg from '@/assets/images/lottery/scratch/on-start-disabled.png'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { introductionConfigScratch, recordsConfigScratch, countDownBarBlue } from './config' import { recordsConfigScratch, countDownBarBlue } from './config'
export default { export default {
components: { components: {
...@@ -107,7 +100,6 @@ export default { ...@@ -107,7 +100,6 @@ export default {
sid: this.$route.query.sid || null, // 引用id sid: this.$route.query.sid || null, // 引用id
stype: this.$route.query.stype || null, // 引用类型 stype: this.$route.query.stype || null, // 引用类型
recordsConfig: recordsConfigScratch, // 中奖记录样式配置 recordsConfig: recordsConfigScratch, // 中奖记录样式配置
introConfig: introductionConfigScratch,
barStyle: countDownBarBlue barStyle: countDownBarBlue
} }
}, },
...@@ -297,4 +289,25 @@ export default { ...@@ -297,4 +289,25 @@ export default {
} }
} }
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction {
padding: 38px 15px;
&__sec-title {
background-image: url('@/assets/images/lottery/scratch/introduction.png');
width: 38%;
left: 50%;
transform: translateX(-50%);
}
&__wrap {
background-color: #0000001a;
border-radius: 22px;
}
&__content {
background-color: transparent;
color: #000;
}
}
}
</style> </style>
components/Lottery/Instant/type/TypeScratchMini.vue
...@@ -49,15 +49,7 @@ ...@@ -49,15 +49,7 @@
</div> </div>
<div class="lottery-instant__intro-entry" @click="changeIsShowIntro">活动介绍</div> <div class="lottery-instant__intro-entry" @click="changeIsShowIntro">活动介绍</div>
<Records :records-config="recordsConfig"></Records> <Records :records-config="recordsConfig"></Records>
<IntroductionPopup <IntroductionPopup :value="isShowIntro" rule-position="bottom"></IntroductionPopup>
:value="isShowIntro"
:wrap-style="introConfig.introWrapStyle"
:content-style="introConfig.introContentStyle"
:popup-style="introConfig.introPopupStyle"
:content-box-style="introConfig.contentBoxStyle"
:back-style="introConfig.backStyle"
:rule="introConfig.rule"
></IntroductionPopup>
</section> </section>
</template> </template>
...@@ -69,7 +61,7 @@ import coverImg from '@/assets/images/lottery/scratch/mask.png' ...@@ -69,7 +61,7 @@ import coverImg from '@/assets/images/lottery/scratch/mask.png'
import onStartImg from '@/assets/images/lottery/scratch/on-start.png' import onStartImg from '@/assets/images/lottery/scratch/on-start.png'
import onStartDidabledImg from '@/assets/images/lottery/scratch/on-start-disabled.png' import onStartDidabledImg from '@/assets/images/lottery/scratch/on-start-disabled.png'
import Bus from '@/utils/Bus' import Bus from '@/utils/Bus'
import { introductionConfigScratchMini2, recordsConfigScratch, countDownBarBlue } from './config' import { recordsConfigScratch, countDownBarBlue } from './config'
export default { export default {
components: { components: {
...@@ -113,7 +105,6 @@ export default { ...@@ -113,7 +105,6 @@ export default {
sid: this.$route.query.sid || null, // 引用id sid: this.$route.query.sid || null, // 引用id
stype: this.$route.query.stype || null, // 引用类型 stype: this.$route.query.stype || null, // 引用类型
recordsConfig: recordsConfigScratch, // 中奖记录样式配置 recordsConfig: recordsConfigScratch, // 中奖记录样式配置
introConfig: introductionConfigScratchMini2,
barStyle: countDownBarBlue barStyle: countDownBarBlue
} }
}, },
...@@ -324,4 +315,37 @@ export default { ...@@ -324,4 +315,37 @@ export default {
border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px;
} }
} }
// 样式穿透
.lottery-instant {
/deep/ .introduction-popup {
background: linear-gradient(180deg, #60bdff 0%, #aaeefb 100%);
&__wrap {
background-color: transparent;
padding: 2px;
}
&__content {
background-color: transparent;
color: #fff;
padding: 0;
}
&__box {
background-color: #00000030;
padding: 1px 15px 15px 15px;
border-radius: 22px;
}
&__back {
top: 10px;
right: 0;
background: linear-gradient(180deg, #ffd63e 0%, #fca60d 100%);
box-shadow: 0 1px 2px 0 rgba(202, 146, 46, 1);
border-radius: 10px 0 0 10px;
padding: 6px 3px;
border: 0;
}
&__intro {
color: #000;
}
}
}
</style> </style>
components/Lottery/Instant/type/config.js
...@@ -5,10 +5,6 @@ import gift2 from '@/assets/images/lottery/guess/gift_2.png' ...@@ -5,10 +5,6 @@ import gift2 from '@/assets/images/lottery/guess/gift_2.png'
import gift3 from '@/assets/images/lottery/guess/gift_3.png' import gift3 from '@/assets/images/lottery/guess/gift_3.png'
import gift4 from '@/assets/images/lottery/guess/gift_4.png' import gift4 from '@/assets/images/lottery/guess/gift_4.png'
// 介绍背景图
import introBgMiniPurple from '@/assets/images/lottery/guess/intro-bg-mini.png'
import introBgMiniYellow from '@/assets/images/lottery/gashapon2/intro-bg-mini.png'
/* 猜盲盒2 */ /* 猜盲盒2 */
// 游戏礼物样式 // 游戏礼物样式
import gift1Guess2 from '@/assets/images/lottery/guess2/gift_1.png' import gift1Guess2 from '@/assets/images/lottery/guess2/gift_1.png'
...@@ -16,7 +12,6 @@ import gift2Guess2 from '@/assets/images/lottery/guess2/gift_2.png' ...@@ -16,7 +12,6 @@ import gift2Guess2 from '@/assets/images/lottery/guess2/gift_2.png'
import gift3Guess2 from '@/assets/images/lottery/guess2/gift_3.png' import gift3Guess2 from '@/assets/images/lottery/guess2/gift_3.png'
import gift4Guess2 from '@/assets/images/lottery/guess2/gift_4.png' import gift4Guess2 from '@/assets/images/lottery/guess2/gift_4.png'
import gift5Guess2 from '@/assets/images/lottery/guess2/gift_5.png' import gift5Guess2 from '@/assets/images/lottery/guess2/gift_5.png'
import introTitleBg from '@/assets/images/lottery/guess2/intro-title.png'
/* 扭蛋机 */ /* 扭蛋机 */
import ballGashapon1 from '@/assets/images/lottery/gashapon-ball/red-blue.png' import ballGashapon1 from '@/assets/images/lottery/gashapon-ball/red-blue.png'
...@@ -25,13 +20,6 @@ import ballGashapon3 from '@/assets/images/lottery/gashapon-ball/phone.png' ...@@ -25,13 +20,6 @@ import ballGashapon3 from '@/assets/images/lottery/gashapon-ball/phone.png'
import ballGashapon4 from '@/assets/images/lottery/gashapon-ball/gift.png' import ballGashapon4 from '@/assets/images/lottery/gashapon-ball/gift.png'
import ballGashapon5 from '@/assets/images/lottery/gashapon-ball/egg-red.png' import ballGashapon5 from '@/assets/images/lottery/gashapon-ball/egg-red.png'
/* 扭蛋机2 */
import introTitleGashapon2 from '@/assets/images/lottery/gashapon2/intro-wrap-title.png'
import introWrapBgGashapon2 from '@/assets/images/lottery/gashapon2/intro-wrap-bg.png'
/* 刮刮乐 */
import IntroTitleScratch from '@/assets/images/lottery/scratch/introduction.png'
// 记录样式 // 记录样式
import recordsBgPurple from '@/assets/images/lottery/records-new/bg-purple.png' import recordsBgPurple from '@/assets/images/lottery/records-new/bg-purple.png'
import personalBgPurple from '@/assets/images/lottery/records-new/personal-purple.png' import personalBgPurple from '@/assets/images/lottery/records-new/personal-purple.png'
...@@ -92,104 +80,6 @@ const winConfigBlue = { ...@@ -92,104 +80,6 @@ const winConfigBlue = {
winClose: winCloseBlue, winClose: winCloseBlue,
winPrizeBg: winPrizeBgBlue winPrizeBg: winPrizeBgBlue
} }
const introductionConfigMiniPurple = {
introWrapStyle: {
backgroundColor: 'transparent',
padding: '0.03rem'
},
introContentStyle: {
backgroundColor: 'transparent',
color: '#fff',
padding: 0
},
introPopupStyle: {
backgroundImage: `url(${introBgMiniPurple})`
},
contentBoxStyle: {
backgroundColor: '#00000030',
padding: '0.01rem 0.2rem 0.2rem 0.2rem',
borderRadius: '0.3rem'
},
backStyle: {
top: '0.12667rem',
right: 0,
background: 'linear-gradient(180deg, #ffd63e 0%, #fca60d 100%)',
boxShadow: '0 0.01333rem 0.02667rem 0 rgba(202, 146, 46, 1)',
borderRadius: '0.13333rem 0 0 0.13333rem',
padding: '0.08rem 0.04rem',
border: 0
},
rule: {
position: 'bottom',
style: {}
}
}
const introductionConfigMiniYellow = {
introWrapStyle: {
backgroundColor: 'transparent',
padding: '0.03rem'
},
introContentStyle: {
backgroundColor: 'transparent',
color: '#fff',
padding: 0
},
introPopupStyle: {
background: `url(${introBgMiniYellow})`
},
contentBoxStyle: {
backgroundColor: '#00000030',
padding: '0.01rem 0.2rem 0.2rem 0.2rem',
borderRadius: '0.3rem'
},
backStyle: {
top: '0.12667rem',
right: 0,
background: 'linear-gradient(180deg, #ffd63e 0%, #fca60d 100%)',
boxShadow: '0 0.01333rem 0.02667rem 0 rgba(202, 146, 46, 1)',
borderRadius: '0.13333rem 0 0 0.13333rem',
padding: '0.08rem 0.04rem',
border: 0
},
rule: {
position: 'bottom',
style: {}
}
}
const introductionConfigMiniBlue = {
introWrapStyle: {
backgroundColor: 'transparent',
padding: '0.03rem'
},
introContentStyle: {
backgroundColor: 'transparent',
color: '#fff',
padding: 0
},
introPopupStyle: {
background: 'linear-gradient(180deg, #60BDFF 0%, #AAEEFB 100%)'
},
contentBoxStyle: {
backgroundColor: '#00000030',
padding: '0.01rem 0.2rem 0.2rem 0.2rem',
borderRadius: '0.3rem'
},
backStyle: {
top: '0.12667rem',
right: 0,
background: 'linear-gradient(180deg, #ffd63e 0%, #fca60d 100%)',
boxShadow: '0 0.01333rem 0.02667rem 0 rgba(202, 146, 46, 1)',
borderRadius: '0.13333rem 0 0 0.13333rem',
padding: '0.08rem 0.04rem',
border: 0
},
rule: {
position: 'bottom',
style: {
color: '#000'
}
}
}
const countDownBarBlue = { const countDownBarBlue = {
minWidth: '2.13rem', minWidth: '2.13rem',
padding: '0 0.12rem', padding: '0 0.12rem',
...@@ -209,7 +99,6 @@ const countDownBarNone = { ...@@ -209,7 +99,6 @@ const countDownBarNone = {
/* 猜盲盒 */ /* 猜盲盒 */
const recordsConfigGuess = recordsConfigPurple const recordsConfigGuess = recordsConfigPurple
const winConfigGuess = Object.assign({}, winConfigPurple, { winTitle: winTitleGuess }) const winConfigGuess = Object.assign({}, winConfigPurple, { winTitle: winTitleGuess })
const introductionConfigGuessMini = introductionConfigMiniPurple
const starConfig = [ const starConfig = [
{ {
width: '0.3rem', width: '0.3rem',
...@@ -252,37 +141,6 @@ const blindBoxListGuess = [ ...@@ -252,37 +141,6 @@ const blindBoxListGuess = [
img: gift4 img: gift4
} }
] ]
const introductionConfigGuess = {
// 标题
introTitleStyle: {
backgroundImage: 'none',
fontSize: '0.22rem',
fontWeight: '700',
textAlign: 'center',
color: '#fff',
paddingTop: '0.1rem'
},
titleText: '活动介绍',
// 外框
introWrapStyle: {
backgroundColor: '#7F17E3',
padding: '0.03rem'
},
// 内容
introContentStyle: {
background: 'linear-gradient(180deg, #7B07C5 0%, #450393 100%)',
color: '#fff'
},
introBoxStyle: {
background: 'linear-gradient(180deg, #682CA1 0%, #A649D8 100%)',
padding: '0.4rem 0.2rem',
borderRadius: 0
},
rule: {
position: 'bottom',
style: {}
}
}
// 猜盲盒2 // 猜盲盒2
const blindBoxListGuess2 = [ const blindBoxListGuess2 = [
...@@ -302,31 +160,10 @@ const blindBoxListGuess2 = [ ...@@ -302,31 +160,10 @@ const blindBoxListGuess2 = [
img: gift5Guess2 img: gift5Guess2
} }
] ]
const introductionConfigGuess2 = Object.assign({}, introductionConfigGuess, {
introTitleStyle: {
backgroundImage: `url(${introTitleBg})`,
backgroundSize: '100% 100%',
width: '1.3rem',
height: '0.27rem',
left: '50%',
transform: 'translate(-50%, 0.16rem)'
},
titleText: '',
introContentStyle: {
background: '#450393',
color: '#fff'
},
introBoxStyle: {
background: 'linear-gradient(180deg, #682CA1 0%, #A649D8 100%)',
padding: '0.4rem 0.2rem',
borderRadius: 0
}
})
/* 扭蛋机 */ /* 扭蛋机 */
const recordsConfigGashapon = recordsConfigPurple const recordsConfigGashapon = recordsConfigPurple
const winConfigGashapon = Object.assign({}, winConfigPurple, { winTitle: winTitleGashapon }) const winConfigGashapon = Object.assign({}, winConfigPurple, { winTitle: winTitleGashapon })
const introductionConfigGashaponMini = introductionConfigMiniPurple
const ballListGashapon = [ const ballListGashapon = [
{ {
img: ballGashapon1, img: ballGashapon1,
...@@ -367,144 +204,30 @@ const ballListGashapon = [ ...@@ -367,144 +204,30 @@ const ballListGashapon = [
] ]
// 扭蛋机1 // 扭蛋机1
const introductionConfigGashapon = {
// 标题
introTitleStyle: {
backgroundImage: 'none',
fontSize: '0.22rem',
fontWeight: '700',
textAlign: 'center',
width: '22%',
height: 'auto',
padding: '0.05rem 0',
left: '50%',
color: '#fff',
transform: 'translate(-50%, 50%)',
backgroundColor: '#ffffff63',
borderRadius: '0.03rem'
},
titleText: '活动介绍',
// 外框
introWrapStyle: {
backgroundColor: '#7826A9',
padding: '0.03rem'
},
// 内容
introContentStyle: {
background: '#7826A9',
color: '#fff'
},
// 外框颜色
introBoxStyle: {
backgroundColor: '#7826A9',
padding: '0.10667rem 0.2rem 0.4rem 0.2rem',
borderRadius: 0
},
rule: {
position: 'bottom',
style: {}
}
}
// 扭蛋机2 // 扭蛋机2
const introductionConfigGashapon2 = {
// 标题
introTitleStyle: {
backgroundImage: `url(${introTitleGashapon2})`,
width: '95%',
padding: '0.05rem 0',
color: '#fff',
fontSize: '0.25rem',
textAlign: 'center',
lineHeight: '2',
top: '-7%',
left: '50%',
transform: 'translate(-50%, 50%)'
},
titleText: '活动介绍',
// 内框
introWrapStyle: {
backgroundImage: `url(${introWrapBgGashapon2})`,
backgroundSize: '100% 100%',
padding: '0.2rem 0.24rem 0.34rem',
backgroundColor: 'transparent'
},
// 内容
introContentStyle: {
background: '#FFF9E9',
borderRadius: '0.03rem',
color: '#000'
},
// 外框
introBoxStyle: {
backgroundColor: '#FFBD33',
padding: '1rem 0.15rem 0.1rem',
borderRadius: 0
},
rule: {
position: 'bottom',
style: {}
}
}
const recordsConfigGashapon2 = recordsConfigBlue const recordsConfigGashapon2 = recordsConfigBlue
const winConfigGashapon2 = Object.assign({}, winConfigBlue, { winTitle: winTitleGashapon }) const winConfigGashapon2 = Object.assign({}, winConfigBlue, { winTitle: winTitleGashapon })
const introductionConfigGashaponMini2 = introductionConfigMiniYellow
// 刮刮乐
const introductionConfigScratch = {
// 介绍组件样式
introTitleStyle: {
backgroundImage: `url(${IntroTitleScratch})`,
width: '38%',
left: '50%',
transform: 'translateX(-50%)'
},
// 介绍组件外框样式
introWrapStyle: {
backgroundColor: '#0000001a',
borderRadius: '0.3rem'
},
// 介绍组件内容样式
introContentStyle: {
backgroundColor: 'transparent',
color: '#000'
},
introBoxStyle: {
padding: '0.5rem 0.2rem'
},
rule: {
position: 'bottom',
style: {}
}
}
const recordsConfigScratch = Object.assign({}, recordsConfigBlue, { textColor: '#093C85' }) const recordsConfigScratch = Object.assign({}, recordsConfigBlue, { textColor: '#093C85' })
const introductionConfigScratchMini2 = introductionConfigMiniBlue
export { export {
// 猜盲盒 // 猜盲盒
blindBoxListGuess, blindBoxListGuess,
recordsConfigGuess, recordsConfigGuess,
winConfigGuess, winConfigGuess,
introductionConfigGuess,
introductionConfigGuessMini,
// 猜盲盒2 // 猜盲盒2
blindBoxListGuess2, blindBoxListGuess2,
introductionConfigGuess2,
// 扭蛋机 // 扭蛋机
ballListGashapon, ballListGashapon,
introductionConfigGashapon,
recordsConfigGashapon, recordsConfigGashapon,
winConfigGashapon, winConfigGashapon,
introductionConfigGashaponMini,
// 扭蛋机2 // 扭蛋机2
introductionConfigGashapon2,
recordsConfigGashapon2, recordsConfigGashapon2,
winConfigGashapon2, winConfigGashapon2,
introductionConfigGashaponMini2,
// 刮刮乐 // 刮刮乐
introductionConfigScratch,
recordsConfigScratch, recordsConfigScratch,
introductionConfigScratchMini2,
// countDown // countDown
countDownBarBlue, countDownBarBlue,
countDownBarPurple, countDownBarPurple,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment