diff --git a/src/views/public/CommentGenerator.vue b/src/views/public/CommentGenerator.vue index a62997d..0cb7459 100644 --- a/src/views/public/CommentGenerator.vue +++ b/src/views/public/CommentGenerator.vue @@ -40,24 +40,9 @@
型号/类型
-
- - 全部 - {{ ltr }} - - - 刷新 - -
-
暂无数据
-
+
暂无数据
+
{{ ltr }}
{ - return this.groupedByLetter[ltr] && this.groupedByLetter[ltr].length > 0 - }) - }, groupedByLetter() { const groups = {} const items = Array.isArray(this.typeOptions) ? this.typeOptions.slice() : [] @@ -312,23 +287,21 @@ export default { return an.localeCompare(bn) }) }) - return groups - }, - filteredGroups() { - if (this.activeLetter === 'ALL') { - const ordered = {} - this.letters.concat('#').forEach(l => { - if (this.groupedByLetter[l] && this.groupedByLetter[l].length) { - ordered[l] = this.groupedByLetter[l] - } - }) - if (this.groupedByLetter['#'] && !ordered['#']) ordered['#'] = this.groupedByLetter['#'] - return ordered - } - const letter = this.activeLetter - const res = {} - if (this.groupedByLetter[letter]) res[letter] = this.groupedByLetter[letter] - return res + // 按字母顺序排序,确保显示顺序一致 + const ordered = {} + const letters = Array.from('ABCDEFGHIJKLMNOPQRSTUVWXYZ') + letters.concat('#').forEach(l => { + if (groups[l] && groups[l].length) { + ordered[l] = groups[l] + } + }) + // 如果有其他字母(不在A-Z范围内),也添加进去 + Object.keys(groups).forEach(k => { + if (!ordered[k] && groups[k].length) { + ordered[k] = groups[k] + } + }) + return ordered }, isGenerateButtonDisabled() { // 如果正在加载、手动禁用、没有选择产品类型,或者在冷却时间内,则禁用按钮 @@ -649,20 +622,7 @@ export default { min-width: 0; } -.refresh-btn { - flex-shrink: 0; - border-radius: 8px; -} - -/* 词海字母导航与分组样式 */ -.letter-nav { - display: flex; - align-items: center; - justify-content: space-between; - flex-wrap: wrap; - gap: 8px; - margin-bottom: 8px; -} +/* 词海分组样式 */ .word-sea .group { margin-bottom: 12px; } .word-sea .group-head { font-weight: 600; margin: 6px 0; color: #606266; } .word-sea .group-items { display: flex; flex-wrap: wrap; } @@ -883,10 +843,6 @@ export default { gap: 8px; } - .refresh-btn { - width: 100%; - } - .image-grid { grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 6px; @@ -912,14 +868,6 @@ export default { font-size: 11px; border-radius: 12px; } - - .letter-nav { - flex-wrap: wrap; - } - - .letter-nav .el-button-group { - flex-wrap: wrap; - } } @media (max-width: 360px) {