fix: 修复了奖金设置模块的拖动功能
This commit is contained in:
@@ -36,8 +36,9 @@
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- 第三部分:奖金设置(图片形式) -->
|
<!-- 第三部分:奖金设置(图片形式) -->
|
||||||
<section v-if="localDisplayConfig.showBonusModule" class="bonus-section"
|
<section v-if="localDisplayConfig.showBonusModule" class="bonus-section card-game"
|
||||||
:style="{ margin: '20px 0' }">
|
@mousedown="startBonusDrag"
|
||||||
|
@click.stop>
|
||||||
<div class="bonus-awards-container">
|
<div class="bonus-awards-container">
|
||||||
<div><img src="/award1.png" alt="一等奖" class="award-image"></div>
|
<div><img src="/award1.png" alt="一等奖" class="award-image"></div>
|
||||||
<div><img src="/award2.png" alt="二等奖" class="award-image"></div>
|
<div><img src="/award2.png" alt="二等奖" class="award-image"></div>
|
||||||
@@ -462,9 +463,12 @@ const startBonusDrag = (e) => {
|
|||||||
const endDrag = (e) => {
|
const endDrag = (e) => {
|
||||||
isDragging = false;
|
isDragging = false;
|
||||||
|
|
||||||
if (isBonusDragging && e?.currentTarget) {
|
if (isBonusDragging) {
|
||||||
// 恢复动画效果
|
// 恢复动画效果
|
||||||
e.currentTarget.style.transition = '';
|
const bonusElement = document.querySelector('.bonus-section');
|
||||||
|
if (bonusElement) {
|
||||||
|
bonusElement.style.transition = '';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
isBonusDragging = false;
|
isBonusDragging = false;
|
||||||
};
|
};
|
||||||
@@ -903,6 +907,15 @@ onUnmounted(() => {
|
|||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bonus-section {
|
||||||
|
position: 'fixed';
|
||||||
|
right: '20px';
|
||||||
|
bottom: '20px';
|
||||||
|
zIndex: 100;
|
||||||
|
cursor: 'move';
|
||||||
|
transition: 'transform 0.1s ease-out' ;
|
||||||
|
}
|
||||||
|
|
||||||
/* 奖金图片容器样式 - Flex布局居中且保持一行 */
|
/* 奖金图片容器样式 - Flex布局居中且保持一行 */
|
||||||
.bonus-awards-container {
|
.bonus-awards-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -954,9 +967,13 @@ onUnmounted(() => {
|
|||||||
}
|
}
|
||||||
/* 奖金模块响应式调整 */
|
/* 奖金模块响应式调整 */
|
||||||
.bonus-section {
|
.bonus-section {
|
||||||
|
position: fixed;
|
||||||
bottom: 10px;
|
bottom: 10px;
|
||||||
right: 10px;
|
right: 10px;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
z-index: 100;
|
||||||
|
cursor: move;
|
||||||
|
transition: transform 0.2s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bonus-awards-container {
|
.bonus-awards-container {
|
||||||
|
|||||||
Reference in New Issue
Block a user