diff --git a/apps/character/ProfileRank.js b/apps/character/ProfileRank.js index 84e14b3e..b92b37fb 100644 --- a/apps/character/ProfileRank.js +++ b/apps/character/ProfileRank.js @@ -43,7 +43,7 @@ export async function groupRank (e) { } } else if (type === 'list') { let uids = await ProfileRank.getGroupUidList(groupId, char.id, mode) - return renderCharRankList({ e, uids, char, mode }) + return renderCharRankList({ e, uids, char, mode, groupId }) } } @@ -73,7 +73,7 @@ export async function resetRank (e) { e.reply(`本群${charName}排名已重置...`) } -async function renderCharRankList ({ e, uids, char, mode }) { +async function renderCharRankList ({ e, uids, char, mode, groupId }) { let list = [] for (let ds of uids) { let uid = ds.value @@ -88,8 +88,14 @@ async function renderCharRankList ({ e, uids, char, mode }) { } let dmg = await profile.calcDmg({ mode: 'single' }) if (dmg && dmg.avg) { + let title = dmg.title + // 稍微缩短下title + if (title.length > 10) { + title = title.replace(/[ ·]*/g, '') + } + title = title.length > 10 ? title.replace(/伤害$/, '') : title tmp.dmg = { - title: dmg.title, + title: title, avg: Format.comma(dmg.avg, 1) } } @@ -97,6 +103,7 @@ async function renderCharRankList ({ e, uids, char, mode }) { } } let title = `#${char.name}${mode === 'mark' ? '圣遗物' : ''}排行` + const rankCfg = await ProfileRank.getGroupCfg(groupId) // 渲染图像 return await Common.render('character/rank-profile-list', { save_id: char.id, @@ -104,6 +111,7 @@ async function renderCharRankList ({ e, uids, char, mode }) { title, elem: char.elem, bodyClass: `char-${char.name}`, + rankCfg, mode }, { e, scale: 1.4 }) } diff --git a/components/Format.js b/components/Format.js index 9bf1f90f..943e7d2d 100644 --- a/components/Format.js +++ b/components/Format.js @@ -1,3 +1,5 @@ +import lodash from 'lodash' + let Format = { int: function (d) { return parseInt(d) @@ -6,7 +8,7 @@ let Format = { num = parseFloat((num * 1).toFixed(fix)) let [integer, decimal] = String.prototype.split.call(num, '.') integer = integer.replace(/\d(?=(\d{3})+$)/g, '$&,') // 正则先行断言 - return `${integer}${decimal ? '.' + decimal : ''}` + return `${integer}${fix > 0 ? '.' + (decimal || lodash.repeat('0', fix)) : ''}` }, pct: function (num, fix = 1) { return (num * 1).toFixed(fix) + '%' diff --git a/models/Avatar.js b/models/Avatar.js index c073796e..b6dc47b2 100644 --- a/models/Avatar.js +++ b/models/Avatar.js @@ -198,7 +198,8 @@ export default class Avatar extends Base { names, abbrs: [...abbrs, ...abbrs2], imgs, - name: abbrs.length > 1 ? abbrs.join('+') : abbrs2[0] + name: (abbrs.length > 1 || abbrs2[0].length > 7) ? abbrs.join('+') : abbrs2[0], + sName: abbrs.join('+') } } if (this.profile) { diff --git a/models/ProfileArtis.js b/models/ProfileArtis.js index 45d71cfc..134c167b 100644 --- a/models/ProfileArtis.js +++ b/models/ProfileArtis.js @@ -170,7 +170,8 @@ export default class ProfileArtis extends Base { names, imgs, abbrs: [...abbrs, ...abbrs2], - name: abbrs.length > 1 ? abbrs.join('+') : abbrs2[0] + name: (abbrs.length > 1 || abbrs2[0].length > 7) ? abbrs.join('+') : abbrs2[0], + sName: abbrs.join('+') } return this._setData } diff --git a/resources/character/character-card.html b/resources/character/character-card.html index d61b18b7..722ee765 100644 --- a/resources/character/character-card.html +++ b/resources/character/character-card.html @@ -73,7 +73,7 @@ {{/each}} -
{{data.artisSet?.name||'圣遗物'}}
+
{{data.artisSet?.sName||'圣遗物'}}
diff --git a/resources/character/rank-profile-list.css b/resources/character/rank-profile-list.css index ce1b50ae..0d46bb3c 100644 --- a/resources/character/rank-profile-list.css +++ b/resources/character/rank-profile-list.css @@ -13,43 +13,61 @@ body { background-size: cover; overflow: hidden; } -.char-item { +.group-rank-icon { + width: 16px; + height: 16px; + background: url("./imgs/mark-icon.png"); + background-size: auto 100%; + display: inline-block; + vertical-align: bottom; + margin: -1px 3px -1px 0; +} +.group-rank-icon.mark-icon { + background-position: 100% 0; +} +.char-list-item { height: 60px; background-size: auto 150%; display: flex; padding: 5px; overflow: visible; } -.char-item .line { - margin-left: 10px; +.char-list-item .line { + margin-left: 15px; position: relative; } -.char-item .line:before { +.char-list-item .line:before { content: ""; display: block; width: 1px; height: 40px; background: rgba(255, 255, 255, 0.8); + background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.1)); position: absolute; - left: -5px; + left: -15px; top: 5px; } +.char-idx { + width: 48px; +} .char-idx span { display: inline-block; width: 24px; height: 24px; - margin: 13px 10px; + margin: 13px 12px; background: url('./imgs/mark-icon.png'); background-size: auto 100%; text-align: center; font-size: 12px; line-height: 24px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8); } .char-idx span.idx-1 { width: 48px; margin: 13px 0; background-image: url('./imgs/mark-icon2.png'); color: rgba(0, 0, 0, 0); + text-shadow: none; } .char-idx span.mode-mark { background-position: 100% 0; @@ -70,10 +88,13 @@ body { border-radius: 50%; } .char-info .name { + margin-top: 4px; height: 24px; line-height: 24px; font-size: 18px; color: #d3bc8e; + font-weight: normal; + text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8); } .char-info .cons { height: 16px; @@ -82,9 +103,10 @@ body { width: 16px; text-align: center; padding: 0; + margin-right: -2px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8); } .char-info .info { - margin-top: 4px; height: 20px; font-size: 12px; line-height: 20px; @@ -92,37 +114,6 @@ body { .char-name { width: 100px; } -.char-weapon { - width: 130px; - display: flex; -} -.char-weapon .img { - margin: -3px 0; - width: 56px; - height: 56px; - background-size: contain; - background-position: center; - background-repeat: no-repeat; -} -.char-weapon .weapon-info { - padding-left: 5px; -} -.char-weapon .cons { - width: 28px; - font-size: 12px; - transform: scale(0.9); - transform-origin: 0 50%; -} -.char-weapon .name { - height: 20px; - line-height: 20px; - margin-bottom: 3px; -} -.char-weapon .name strong { - color: #fff; - font-size: 13px; - font-weight: normal; -} .char-talent { display: flex; padding: 0 5px; @@ -193,6 +184,50 @@ body { top: -2px; margin-left: -9px; } +.char-item { + vertical-align: middle; + height: 50px; +} +.char-item .item { + position: relative; + width: 36px; + height: 36px; + margin: 7px 5px 7px 0; + box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7); + display: inline-block; + overflow: visible; + vertical-align: middle; +} +.char-weapon { + width: 125px; + display: flex; +} +.char-weapon .img { + margin: -10px -5px; + width: 46px; + height: 56px; + background-size: contain; + background-position: center; + background-repeat: no-repeat; +} +.char-weapon .weapon-info { + padding-left: 5px; +} +.char-weapon .cons { + width: 28px; + font-size: 12px; + transform: scale(0.9); + transform-origin: 0 50%; +} +.char-weapon .name { + height: 20px; + line-height: 20px; + margin-bottom: 3px; +} +.char-weapon .name strong { + font-size: 13px; + font-weight: normal; +} .char-artis { display: flex; width: 130px; @@ -221,28 +256,16 @@ body { background: #aaa; } .char-artis .artis-mark-class { - border-radius: 5px; - display: inline-block; - text-align: center; - background: rgba(51, 51, 51, 0.68); - height: 20px; - line-height: 20px; - box-shadow: 0 0 1px 0 #ffe4b4; - position: relative; - z-index: 9; - color: #fff; width: 28px; - font-size: 12px; + margin-right: -2px; transform: scale(0.9); transform-origin: 0 50%; - margin-right: -2px; } .char-artis .artis { position: relative; width: 36px; height: 36px; margin: 7px 5px 7px 0; - box-shadow: 0 0 1px 0 #ffe4b4; display: inline-block; } .char-artis .artis.no-artis { @@ -267,21 +290,25 @@ body { } .char-artis .artis-title { font-size: 12px; + white-space: nowrap; } .char-artis .artis-mark { height: 23px; - margin-top: 5px; } .char-dmg { - text-align: right; width: 120px; } -.char-dmg .dmg { - height: 25px; - margin-top: 5px; +.char-dmg .dmg-value { + height: 30px; + line-height: 30px; font-size: 18px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8); } .char-dmg .dmg-title { + height: 15px; + line-height: 15px; + margin-top: 5px; font-size: 12px; + color: #aaa; } /*# sourceMappingURL=rank-profile-list.css.map */ \ No newline at end of file diff --git a/resources/character/rank-profile-list.html b/resources/character/rank-profile-list.html index 892e7c33..665876ee 100644 --- a/resources/character/rank-profile-list.html +++ b/resources/character/rank-profile-list.html @@ -10,8 +10,31 @@
{{title}}
+ +
+
+ 群排名说明 +
+
+
    +
  • + 综合练度排名: + 以期望伤害(计算暴击率的平均伤害,不代表实际伤害值)为排序的群内排名 +
  • +
  • + 圣遗物评分排名: + 基于角色评分规则进行圣遗物评分。评分规则为线性规则,无法体现词条平衡等实际因素,评分仅供娱乐 +
  • +
  • + 排名范围: + 本群内 / 时间点:{{rankCfg.time}} 后 / 在群内主动通过 #面板 命令查看过的面板数据 +
  • +
+
+
+ {{each list ds idx}} -
+
{{idx+1}}
@@ -19,13 +42,14 @@
-
- Uid: {{ds.uid}} -
+
{{ds.cons}} {{ds.sName}}
+
+ Uid: {{ds.uid}} +
@@ -44,48 +68,50 @@ {{/each}}
-
+
{{set w = ds.weapon }} -
+
+
+
-
- 精{{w.affix}} Lv.{{w.leve || w.level}} -
{{w.name.length > 4 ? (w.abbr||w.name) : w.name}}
+
+ 精{{w.affix}} Lv.{{w.leve || w.level}} +
{{set mark = ds.artisMark || false }} {{set aImgs = ds?.artisSet?.imgs || []}} -
-
-
- {{each aImgs img}} -
- {{/each}} - {{if aImgs.length === 0}} - - {{/if}} -
+
+
+ {{each aImgs img}} +
+ {{/each}} + {{if aImgs.length === 0}} + + {{/if}} +
-
-
- {{mark.markClass}} - {{mark.mark}} -
-
+
+
{{ds?.artisSet?.name}}
+
+ {{mark.markClass}} + {{mark.mark}} +
{{if ds.dmg}} -
{{ds.dmg?.avg}}
{{ds.dmg?.title}}
+
{{ds.dmg?.avg}}
{{else}} {{/if}}
diff --git a/resources/character/rank-profile-list.less b/resources/character/rank-profile-list.less index 5b2bc549..655cd324 100644 --- a/resources/character/rank-profile-list.less +++ b/resources/character/rank-profile-list.less @@ -11,7 +11,21 @@ body { overflow: hidden; } -.char-item { +.group-rank-icon { + width: 16px; + height: 16px; + background: url("./imgs/mark-icon.png"); + background-size: auto 100%; + display: inline-block; + vertical-align: bottom; + margin: -1px 3px -1px 0; + + &.mark-icon { + background-position: 100% 0; + } +} + +.char-list-item { height: 60px; background-size: auto 150%; display: flex; @@ -19,7 +33,7 @@ body { overflow: visible; .line { - margin-left: 10px; + margin-left: 15px; position: relative; &:before { @@ -28,24 +42,28 @@ body { width: 1px; height: 40px; background: rgba(255, 255, 255, .8); + background: linear-gradient(rgba(255, 255, 255, .1), rgba(255, 255, 255, .8), rgba(255, 255, 255, .8), rgba(255, 255, 255, .8), rgba(255, 255, 255, .1)); position: absolute; - left: -5px; + left: -15px; top: 5px; } } } .char-idx { + width: 48px; + span { display: inline-block; width: 24px; height: 24px; - margin: 13px 10px; + margin: 13px 12px; background: url('./imgs/mark-icon.png'); background-size: auto 100%; text-align: center; font-size: 12px; line-height: 24px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, .8); &.idx-1 { @@ -53,6 +71,7 @@ body { margin: 13px 0; background-image: url('./imgs/mark-icon2.png'); color: rgba(0, 0, 0, 0); + text-shadow: none; } &.mode-mark { @@ -81,10 +100,13 @@ body { .char-info { .name { + margin-top: 4px; height: 24px; line-height: 24px; font-size: 18px; color: #d3bc8e; + font-weight: normal; + text-shadow: 1px 1px 1px rgba(0, 0, 0, .8); } .cons { @@ -94,10 +116,11 @@ body { width: 16px; text-align: center; padding: 0; + margin-right: -2px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, .8); } .info { - margin-top: 4px; height: 20px; font-size: 12px; line-height: 20px; @@ -108,43 +131,6 @@ body { width: 100px; } -.char-weapon { - width: 130px; - display: flex; - - .img { - margin: -3px 0; - width: 56px; - height: 56px; - background-size: contain; - background-position: center; - background-repeat: no-repeat; - } - - .weapon-info { - padding-left: 5px; - } - - .cons { - width: 28px; - font-size: 12px; - transform: scale(.9); - transform-origin: 0 50%; - } - - .name { - height: 20px; - line-height: 20px; - margin-bottom: 3px; - - strong { - color: #fff; - font-size: 13px; - font-weight: normal; - } - } -} - .char-talent { display: flex; padding: 0 5px; @@ -223,6 +209,59 @@ body { } } +.char-item { + vertical-align: middle; + height: 50px; + + .item { + position: relative; + width: 36px; + height: 36px; + margin: 7px 5px 7px 0; + box-shadow: 0 0 0 1px rgba(255, 255, 255, .7); + display: inline-block; + overflow: visible; + vertical-align: middle; + } +} + +.char-weapon { + width: 125px; + display: flex; + + .img { + margin: -10px -5px; + width: 46px; + height: 56px; + background-size: contain; + background-position: center; + background-repeat: no-repeat; + } + + .weapon-info { + padding-left: 5px; + } + + .cons { + width: 28px; + font-size: 12px; + transform: scale(.9); + transform-origin: 0 50%; + } + + .name { + height: 20px; + line-height: 20px; + margin-bottom: 3px; + + strong { + font-size: 13px; + font-weight: normal; + } + } +} + + .char-artis { display: flex; width: 130px; @@ -261,21 +300,11 @@ body { } .artis-mark-class { - border-radius: 5px; - display: inline-block; - text-align: center; - background: rgba(51, 51, 51, 0.68); - height: 20px; - line-height: 20px; - box-shadow: 0 0 1px 0 #ffe4b4; - position: relative; - z-index: 9; - color: #fff; width: 28px; - font-size: 12px; + margin-right: -2px; transform: scale(.9); transform-origin: 0 50%; - margin-right: -2px; + } .artis { @@ -283,7 +312,6 @@ body { width: 36px; height: 36px; margin: 7px 5px 7px 0; - box-shadow: 0 0 1px 0 #ffe4b4; display: inline-block; &.no-artis { @@ -317,25 +345,29 @@ body { .artis-title { font-size: 12px; + white-space: nowrap; } .artis-mark { height: 23px; - margin-top: 5px; } } .char-dmg { - text-align: right; width: 120px; - .dmg { - height: 25px; - margin-top: 5px; + .dmg-value { + height: 30px; + line-height: 30px; font-size: 18px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, .8); } .dmg-title { + height: 15px; + line-height: 15px; + margin-top: 5px; font-size: 12px; + color: #aaa } } \ No newline at end of file