WeWork/vs100
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: 支持配置列显示位置

Browse Source
This commit is contained in:
ZF Sun
2025-11-21 16:27:03 +08:00
parent 91e8af324d
commit 59c09546a9
3 changed files with 485 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

146
src/views/AdminPanel.vue
View File

@@ -90,8 +90,8 @@
</div>
<div class="config-item">
<label class="checkbox-label">
<span class="text-gold">移动端最大显示行数：</span>
<input type="number" v-model.number="localDisplayConfig.individual.maxDisplayRows" min="1" max="50" class="number-input">
<span class="text-gold">移动端默认显示行数：</span>
<input type="number" v-model.number="localDisplayConfig.individual.defaultDisplayRows" min="1" max="50" class="number-input">
</label>
</div>
<div class="config-item">
@@ -111,6 +111,118 @@
</label>
</div>
<div class="column-alignment-section">
<h4 class="text-gold">列对齐设置</h4>
<div class="column-alignment-item">
<label class="text-gold">排名列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.rank" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item">
<label class="text-gold">姓名列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.name" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item">
<label class="text-gold">业绩列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.score" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item" v-if="localDisplayConfig.individual.showLevel">
<label class="text-gold">等级列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.level" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item" v-if="localDisplayConfig.individual.showDepartment">
<label class="text-gold">部门列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.department" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item" v-if="localDisplayConfig.individual.showTeam">
<label class="text-gold">战区列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.team" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item">
<label class="text-gold">奖金列对齐：</label>
<select v-model="localDisplayConfig.individual.columnAlignments.bonus" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
</div>
<div class="column-alignment-section">
<h4 class="text-gold">列对齐设置</h4>
<div class="column-alignment-item">
<label class="text-gold">排名列对齐：</label>
<select v-model="localDisplayConfig.team.columnAlignments.rank" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item">
<label class="text-gold">战区名列对齐：</label>
<select v-model="localDisplayConfig.team.columnAlignments.name" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item">
<label class="text-gold">业绩列对齐：</label>
<select v-model="localDisplayConfig.team.columnAlignments.score" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item" v-if="localDisplayConfig.team.showMemberCount">
<label class="text-gold">人数列对齐：</label>
<select v-model="localDisplayConfig.team.columnAlignments.memberCount" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item" v-if="localDisplayConfig.team.showLeader">
<label class="text-gold">队长列对齐：</label>
<select v-model="localDisplayConfig.team.columnAlignments.leader" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
<div class="column-alignment-item">
<label class="text-gold">奖金列对齐：</label>
<select v-model="localDisplayConfig.team.columnAlignments.bonus" class="align-select">
<option value="left">靠左</option>
<option value="center">居中</option>
<option value="right">靠右</option>
</select>
</div>
</div>
<div class="column-widths-section">
<h4 class="text-gold">列宽设置（单位：像素）</h4>
<div class="column-width-item">
@@ -182,6 +294,12 @@
<span class="text-gold">显示队长列</span>
</label>
</div>
<div class="config-item">
<label class="checkbox-label">
<span class="text-gold">移动端默认显示行数：</span>
<input type="number" v-model.number="localDisplayConfig.team.defaultDisplayRows" min="0" max="50" class="number-input" placeholder="留空或0表示显示所有行">
</label>
</div>
<div class="config-item">
<label class="checkbox-label">
<span class="text-gold">业绩列显示名称：</span>
@@ -1472,6 +1590,30 @@ const deleteBonusRule = (index) => {
border-radius: 5px;
}
.column-alignment-section {
margin-top: 20px;
padding: 15px;
background: rgba(255, 255, 255, 0.1);
border-radius: 8px;
}
.column-alignment-item {
margin-bottom: 10px;
display: flex;
align-items: center;
gap: 10px;
}
.align-select {
padding: 8px 12px;
border: 1px solid #6c5ce7;
border-radius: 4px;
background: #2d3748;
color: white;
font-size: 0.9rem;
min-width: 100px;
}
.column-width-item label {
width: 100px;
font-weight: 500;