hxuanyu/obs-overlay-widget
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

链接复制按钮展示优化

Browse Source
This commit is contained in:
hxuanyu 2025-06-26 00:10:26 +08:00
parent cdf5f81601
commit de73a041b1
1 changed files with 38 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/views/ConfigView.vue
View File

@ -7,18 +7,21 @@
</el-select> </el-select>
</div> </div>
<div class="config-panel"> <div class="config-container">
<component :is="currentConfigComponent" v-if="currentConfigComponent" @update:config="updateWidgetConfig" :config="currentWidgetConfig" /> <div class="config-panel">
</div> <component :is="currentConfigComponent" v-if="currentConfigComponent" @update:config="updateWidgetConfig" :config="currentWidgetConfig" />
</div>
<div class="url-generator"> <div class="url-generator">
<el-input v-model="generatedUrl" readonly> <h3>生成的URL链接</h3>
<template #append> <el-input v-model="generatedUrl" readonly size="large">
<el-button @click="copyUrl"> <template #append>
<el-icon><CopyDocument /></el-icon> 复制 <el-button @click="copyUrl">
</el-button> <el-icon><CopyDocument /></el-icon> 复制
</template> </el-button>
</el-input> </template>
</el-input>
</div>
</div> </div>
</div> </div>
@ -204,6 +207,14 @@ watch([selectedWidget, currentWidgetConfig], () => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 20px; gap: 20px;
/* 确保底部有足够的边距 */
padding-bottom: 30px;
}
.config-container {
display: flex;
flex-direction: column;
flex: 1;
} }
.right-panel { .right-panel {
@ -226,11 +237,24 @@ watch([selectedWidget, currentWidgetConfig], () => {
} }
.config-panel { .config-panel {
flex-grow: 1; /* 配置面板可以滚动，但不挤压URL生成器 */
overflow-y: auto;
flex: 1;
margin-bottom: 20px;
} }
.url-generator { .url-generator {
margin-top: 20px; /* URL生成器固定在底部 */
margin-top: auto;
padding: 10px 0;
border-top: 1px solid #eaeaea;
}
.url-generator h3 {
margin-top: 0;
margin-bottom: 10px;
font-size: 16px;
color: #606266;
} }
.preview-container { .preview-container {