UID列表使用图像进行渲染,样式尚未完全稳定
This commit is contained in:
parent
08da5dab3f
commit
ffe7251026
|
@ -76,7 +76,20 @@ class UserDB extends BaseModel {
|
|||
}
|
||||
})
|
||||
db.ltuids = ltuids.join(',')
|
||||
db.games = user._games
|
||||
let games = {}
|
||||
lodash.forEach(user._games, (gameDs, game) => {
|
||||
games[game] = {
|
||||
uid: gameDs.uid,
|
||||
data: {}
|
||||
}
|
||||
lodash.forEach(gameDs.data, (ds, uid) => {
|
||||
games[game].data[uid] = {
|
||||
uid: ds.uid,
|
||||
type: ds.type
|
||||
}
|
||||
})
|
||||
})
|
||||
db.games = games
|
||||
await this.save()
|
||||
}
|
||||
}
|
||||
|
|
|
@ -191,7 +191,7 @@ export default class User extends base {
|
|||
}
|
||||
|
||||
/** #uid */
|
||||
async showUid () {
|
||||
async showUid_bak () {
|
||||
let user = await this.user()
|
||||
let msg = []
|
||||
let typeMap = { ck: 'CK Uid', reg: '绑定 Uid' }
|
||||
|
@ -216,7 +216,7 @@ export default class User extends base {
|
|||
}
|
||||
|
||||
/** #uid */
|
||||
async showUid2 () {
|
||||
async showUid () {
|
||||
let user = await this.user()
|
||||
let uids = [{
|
||||
key: 'gs',
|
||||
|
@ -233,6 +233,9 @@ export default class User extends base {
|
|||
if (player) {
|
||||
uidDs.name = player.name
|
||||
uidDs.level = player.level
|
||||
let imgs = player?.faceImgs || {}
|
||||
uidDs.face = imgs.face
|
||||
uidDs.banner = imgs.banner
|
||||
}
|
||||
})
|
||||
})
|
||||
|
@ -425,13 +428,14 @@ export default class User extends base {
|
|||
await user.save()
|
||||
if (fs.existsSync(`./data/MysCookie/${qq}.yaml`)) {
|
||||
try {
|
||||
let src = `./data/MysCookie/${qq}.yaml`;
|
||||
let dest = `./temp/MysCookieBak/${qq}.yaml`;
|
||||
await fs.promises.unlink(dest).catch((_) => { });
|
||||
await fs.promises.copyFile(src, dest);
|
||||
await fs.promises.unlink(src);
|
||||
let src = `./data/MysCookie/${qq}.yaml`
|
||||
let dest = `./temp/MysCookieBak/${qq}.yaml`
|
||||
await fs.promises.unlink(dest).catch((_) => {
|
||||
})
|
||||
await fs.promises.copyFile(src, dest)
|
||||
await fs.promises.unlink(src)
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
count++
|
||||
|
|
|
@ -1,21 +1,165 @@
|
|||
.uid-list {
|
||||
display: flex;
|
||||
.container {
|
||||
width: 500px;
|
||||
}
|
||||
.uid-list .cont {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
margin: 5px;
|
||||
width: 50%;
|
||||
.uid-list .game-cont {
|
||||
background: rgba(255, 255, 255, 0.65);
|
||||
margin: 0 0 10px;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.uid-list .cont .cont-body {
|
||||
.uid-list .game-cont .game-title {
|
||||
font-size: 16px;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
padding: 8px 15px 5px;
|
||||
}
|
||||
.uid-list .game-cont .game-title strong {
|
||||
margin-right: 15px;
|
||||
}
|
||||
.uid-list .game-cont .game-title span {
|
||||
font-size: 12px;
|
||||
color: #888;
|
||||
}
|
||||
.uid-list .game-cont .game-title nobr {
|
||||
font-size: 12px;
|
||||
background: #888;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
padding: 1px 2px;
|
||||
border-radius: 3px;
|
||||
margin: 0 1px;
|
||||
}
|
||||
.uid-list .game-cont .cont-body {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
.uid-list li {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
height: 30px;
|
||||
.uid-list .game-ul {
|
||||
padding: 8px;
|
||||
}
|
||||
.uid-list .game-idx {
|
||||
height: 50px;
|
||||
padding: 13px 0;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.uid-list .game-idx span {
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 22px;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.uid-list .game-bar {
|
||||
height: 50px;
|
||||
line-height: 30px;
|
||||
margin: 0;
|
||||
border-radius: 5px;
|
||||
border-radius: 25px;
|
||||
background: right top no-repeat #f0ece4;
|
||||
background-size: auto 100%;
|
||||
padding: 3px;
|
||||
width: 425px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
.uid-list .game-bar .face {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 22px;
|
||||
box-shadow: 0 0 1px #000, 0 0 5px rgba(0, 0, 0, 0.5);
|
||||
border: 1px solid #fff;
|
||||
overflow: hidden;
|
||||
background-size: cover;
|
||||
}
|
||||
.uid-list .game-bar .face span {
|
||||
display: block;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
background-size: auto 100%;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.uid-list .game-bar .info {
|
||||
padding: 4px 10px;
|
||||
line-height: 18px;
|
||||
color: #414e64;
|
||||
}
|
||||
.uid-list .game-bar .info .uid {
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
}
|
||||
.uid-list .game-bar .info .uid span {
|
||||
display: block;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.uid-list .game-bar .info .uid strong {
|
||||
width: 35px;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
background: #4a5366;
|
||||
height: 18px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
vertical-align: middle;
|
||||
transform: scale(0.9);
|
||||
}
|
||||
.uid-list .game-bar .info .uid strong.ck {
|
||||
background: #d3bc8e;
|
||||
color: #3a2702;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 0 3px 0 #000;
|
||||
}
|
||||
.uid-list .game-bar .info .uid strong.reg {
|
||||
background: #666;
|
||||
}
|
||||
.uid-list .game-bar .info .name {
|
||||
font-size: 16px;
|
||||
}
|
||||
.uid-list .game-bar .info .no-info {
|
||||
font-size: 12px;
|
||||
color: #555;
|
||||
}
|
||||
.uid-list .game-bar:after {
|
||||
display: block;
|
||||
content: "";
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
border: 2px solid #ece5d8;
|
||||
opacity: 0;
|
||||
box-shadow: 0 0 1px #000, 0 0 5px rgba(0, 0, 0, 0.5);
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 8px;
|
||||
}
|
||||
.uid-list .game-li {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.uid-list .game-li:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.uid-list .game-li.active .game-bar:after {
|
||||
opacity: 1;
|
||||
background: url('../../img/icon/check.webp') center center no-repeat #4a5366;
|
||||
background-size: 70% auto;
|
||||
}
|
||||
.tips {
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 10px;
|
||||
font-size: 12px;
|
||||
padding: 8px 12px;
|
||||
color: #555;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.tips nobr {
|
||||
font-size: 12px;
|
||||
background: #555;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
padding: 1px 2px;
|
||||
border-radius: 3px;
|
||||
margin: 0 1px;
|
||||
}
|
||||
/*# sourceMappingURL=uid-list.css.map */
|
|
@ -9,31 +9,51 @@
|
|||
gs:{mark:'#'},
|
||||
sr:{mark:'*'}
|
||||
}; }}
|
||||
<div class="head-box">
|
||||
<div class="label">111</div>
|
||||
|
||||
<div class="tips">
|
||||
#开头为原神,*开头为星穹铁道。发送CK可绑定CK对应uid<br>
|
||||
<nobr>#删除uid1</nobr>
|
||||
删除指定序号uid
|
||||
|
||||
<nobr>#绑定123456789</nobr>
|
||||
绑定对应uid
|
||||
</div>
|
||||
|
||||
<div class="uid-list">
|
||||
{{each uids game}}
|
||||
{{set mark = game.key==='gs'? '#':'*'}}
|
||||
<div class="cont">
|
||||
<div class="cont-title">{{game.name}}<span><nobr>{{mark}}uid+序号</nobr>切换</span></div>
|
||||
<div class="cont-body">
|
||||
|
||||
<div class="game-cont">
|
||||
<div class="game-title"><strong>{{game.name}}</strong><span>使用<nobr>{{mark}}uid1</nobr>切换uid
|
||||
</div>
|
||||
<div class="game-ul">
|
||||
{{each game.uidList uid idx}}
|
||||
<div class="{{game.uid === uid.uid ? 'active':''}}">
|
||||
<div class="idx">{{idx+1}}</div>
|
||||
{{if uid.name && uid.level}}
|
||||
<div>{{uid.name}} (Lv.{{uid.level}})</div>
|
||||
{{/if}}
|
||||
<div>
|
||||
<span class="{{uid.type}}">{{uid.type==='ck'?'CK':'绑定'}}</span>
|
||||
<span>{{uid.uid}}</span>
|
||||
<div class="game-li {{game.uid*1 === uid.uid*1 ? 'active':''}}">
|
||||
<div class="game-idx">
|
||||
<span>{{idx+1}}</span>
|
||||
</div>
|
||||
<div class="game-bar" style="background-image:url({{_miao_path}}{{uid.banner}})">
|
||||
<div class="face" style="background-image:url({{_miao_path}}{{uid.face}})"></div>
|
||||
<div class="info">
|
||||
<div class="uid">
|
||||
<span>{{uid.uid}}</span>
|
||||
<strong class="{{uid.type}}">{{uid.type==='ck'?'CK':'绑定'}}</strong>
|
||||
</div>
|
||||
{{if uid.name && uid.level}}
|
||||
<div class="name">
|
||||
<div>{{uid.name}} Lv.{{uid.level}}</div>
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="no-info">暂无uid信息</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
|
||||
|
||||
{{/block}}
|
|
@ -1,11 +1,40 @@
|
|||
.container {
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.uid-list {
|
||||
display: flex;
|
||||
|
||||
.cont {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
margin: 5px;
|
||||
width: 50%;
|
||||
.game-cont {
|
||||
background: rgba(255, 255, 255, .65);
|
||||
margin: 0 0 10px;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
|
||||
.game-title {
|
||||
font-size: 16px;
|
||||
background: rgba(255, 255, 255, .8);
|
||||
padding: 8px 15px 5px;
|
||||
|
||||
|
||||
strong {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 12px;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
nobr {
|
||||
font-size: 12px;
|
||||
background: #888;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
padding: 1px 2px;
|
||||
border-radius: 3px;
|
||||
margin: 0 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.cont-body {
|
||||
background: none;
|
||||
|
@ -13,16 +42,156 @@
|
|||
}
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
margin: 0;
|
||||
border-radius: 5px;
|
||||
.game-ul {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
strong {
|
||||
.game-idx {
|
||||
height: 50px;
|
||||
padding: 13px 0;
|
||||
margin-right: 5px;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 22px;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.game-bar {
|
||||
height: 50px;
|
||||
line-height: 30px;
|
||||
margin: 0;
|
||||
border-radius: 25px;
|
||||
background: right top no-repeat #f0ece4;
|
||||
background-size: auto 100%;
|
||||
padding: 3px;
|
||||
width: 425px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
.face {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 22px;
|
||||
box-shadow: 0 0 1px #000, 0 0 5px rgba(0, 0, 0, .5);
|
||||
border: 1px solid #fff;
|
||||
overflow: hidden;
|
||||
background-size: cover;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
background-size: auto 100%;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
.info {
|
||||
padding: 4px 10px;
|
||||
line-height: 18px;
|
||||
color: #414e64;
|
||||
|
||||
.uid {
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
strong {
|
||||
width: 35px;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
background: #4a5366;
|
||||
height: 18px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
vertical-align: middle;
|
||||
transform: scale(.9);
|
||||
|
||||
&.ck {
|
||||
background: #d3bc8e;
|
||||
color: #3a2702;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 0 3px 0 #000;
|
||||
}
|
||||
|
||||
&.reg {
|
||||
background: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.no-info {
|
||||
font-size: 12px;
|
||||
color: #555;
|
||||
}
|
||||
}
|
||||
|
||||
&:after {
|
||||
display: block;
|
||||
content: "";
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
border: 2px solid #ece5d8;
|
||||
opacity: 0;
|
||||
box-shadow: 0 0 1px #000, 0 0 5px rgba(0, 0, 0, .5);
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.game-li {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
.game-bar:after {
|
||||
opacity: 1;
|
||||
background: url('../../img/icon/check.webp') center center no-repeat #4a5366;
|
||||
background-size: 70% auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
background: rgba(255, 255, 255, .8);
|
||||
border-radius: 10px;
|
||||
font-size: 12px;
|
||||
padding: 8px 12px;
|
||||
color: #555;
|
||||
margin-bottom: 10px;
|
||||
|
||||
|
||||
nobr {
|
||||
font-size: 12px;
|
||||
background: #555;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
padding: 1px 2px;
|
||||
border-radius: 3px;
|
||||
margin: 0 1px;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue