wip: test

This commit is contained in:
2023-12-29 19:47:44 +08:00
parent 511935a6e7
commit f472206954
2 changed files with 39 additions and 32 deletions

View File

@@ -56,47 +56,48 @@
} }
.turntable { .turntable {
width: 500px; // width: 500px;
height: 500px; // height: 500px;
border: 1px solid #a6a6a6; // border: 1px solid #a6a6a6;
border-radius: 50%; // border-radius: 50%;
margin: 50px auto; margin: 30px auto;
position: relative; // position: relative;
&::before, // &::before,
&::after { // &::after {
content: ''; // content: '';
position: absolute; // position: absolute;
width: 100%; // width: 100%;
height: 100%; // height: 100%;
border-radius: 50%; // border-radius: 50%;
background-color: #a6a6a6; // background-color: #a6a6a6;
} // }
&::before { // &::before {
width: 2px; // width: 2px;
height: 100%; // height: 100%;
left: 50%; // left: 50%;
top: 0; // top: 0;
transform: translateX(-50%); // transform: translateX(-50%);
} // }
&::after { // &::after {
width: 100%; // width: 100%;
height: 2px; // height: 2px;
left: 0; // left: 0;
top: 50%; // top: 50%;
transform: translateY(-50%); // transform: translateY(-50%);
} // }
.num-box { .num-box {
display: flex; display: flex;
flex-direction: row; // flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
position: relative; position: relative;
padding: 50px; // padding: 50px;
position: relative;
.item { .item {
width: 200px; width: 200px;
@@ -104,9 +105,14 @@
text-align: center; text-align: center;
line-height: 200px; line-height: 200px;
font-size: 80px; font-size: 80px;
// background-size: cover;
background-repeat: no-repeat;
.icon { .icon {
position: absolute; position: absolute;
top: 20%;
width: 70px;
height: 70px;
} }
} }
} }

View File

@@ -27,11 +27,12 @@
:key="index" :key="index"
:style="{ :style="{
color: item.active ? '#ff0000' : '#000', color: item.active ? '#ff0000' : '#000',
backgroundImage: `url(${item.optActive ? require('../../../static/dz.png') : 'none'})`,
}" }"
@click="handleClick(item)" @click="handleClick(item)"
> >
<text>{{ item.value }}</text> <text>{{ item.value }}</text>
<image v-show="item.optActive" class="icon" src="../../../static/dz.png" /> <!-- <image class="icon" v-show="item.optActive" src="../../../static/dz.png" /> -->
</view> </view>
</view> </view>
</view> </view>