Browse Source

刷新任务应该是按照最后登录的角色来刷新

接取任务的界面优化。
master
hanqin 2 weeks ago
parent
commit
8a8071035e
  1. 6
      Build_God_Api/Build_God_Api/Services/CharacterService.cs
  2. 280
      Build_God_Game/src/views/DailyMissionView.vue

6
Build_God_Api/Build_God_Api/Services/CharacterService.cs

@ -213,7 +213,11 @@ namespace Build_God_Api.Services
public async Task<Character?> GetCharacterByAccountId(int accountId) public async Task<Character?> GetCharacterByAccountId(int accountId)
{ {
return await db.Queryable<Character>().FirstAsync(x => x.AccountId == accountId && x.isLocked == false); return await db.Queryable<Character>()
.Where(x => x.AccountId == accountId && x.isLocked == false)
.OrderBy(x => x.LastLogin, OrderByType.Desc)
.OrderBy(x => x.CreatedOn, OrderByType.Asc)
.FirstAsync();
} }
public async Task<List<Character>> GetCharactersByAccountId(int accountId) public async Task<List<Character>> GetCharactersByAccountId(int accountId)

280
Build_God_Game/src/views/DailyMissionView.vue

@ -190,20 +190,26 @@ const MissionCardContent = defineComponent({
h('div', { class: 'card-header' }, [ h('div', { class: 'card-header' }, [
h('div', { class: 'card-title-row' }, [ h('div', { class: 'card-title-row' }, [
h('div', { class: 'card-icon', style: `filter: ${getMissionIconFilter(props.mission.missionType, props.mission.difficulty)}`, innerHTML: getMissionIcon(props.mission.missionType, props.mission.difficulty) }), h('div', { class: 'card-icon', style: `filter: ${getMissionIconFilter(props.mission.missionType, props.mission.difficulty)}`, innerHTML: getMissionIcon(props.mission.missionType, props.mission.difficulty) }),
h('div', { class: 'title-stack' }, [
h('span', { class: 'card-title' }, props.mission.missionTitle), h('span', { class: 'card-title' }, props.mission.missionTitle),
h('span', { class: 'card-subtitle' }, props.mission.missionName),
]),
]), ]),
h('span', { class: ['card-status', getStatusClass(props.mission.status)] }, getStatusText(props.mission.status)), h('span', { class: ['card-status', getStatusClass(props.mission.status)] }, getStatusText(props.mission.status)),
]), ]),
h('div', { class: 'card-desc' }, props.mission.missionDescription), h('div', { class: 'card-desc' }, props.mission.missionDescription),
h('div', { class: 'card-difficulty' }, [ h('div', { class: 'card-meta-row' }, [
h('span', { class: ['difficulty-badge', getDifficultyClass(props.mission.difficulty)] }, getDifficultyLabel(props.mission.difficulty)), h('span', { class: ['difficulty-badge', getDifficultyClass(props.mission.difficulty)] }, getDifficultyLabel(props.mission.difficulty)),
h('span', { class: 'time-badge' }, `预计 ${props.mission.spendTimeMinutes} 分钟`),
]), ]),
props.mission.progresses && props.mission.progresses.length > 0 props.mission.progresses && props.mission.progresses.length > 0
? h('div', { class: 'card-progress' }, [ ? h('div', { class: 'objective-panel' }, [
h('span', { class: 'progress-label' }, '目标:'), h('span', { class: 'objective-label' }, '任务目标'),
h('span', { class: 'progress-value' }, getProgressText(props.mission)), h('span', { class: 'objective-value' }, getProgressText(props.mission)),
]) ])
: null, : null,
h('div', { class: 'reward-section' }, [
h('div', { class: 'section-label' }, '任务奖励'),
h('div', { class: 'card-rewards' }, [ h('div', { class: 'card-rewards' }, [
h('span', { class: 'reward-item exp-reward' }, `${props.mission.expReward}`), h('span', { class: 'reward-item exp-reward' }, `${props.mission.expReward}`),
h('span', { class: 'reward-item money-reward' }, `💰 ${props.mission.moneyReward}`), h('span', { class: 'reward-item money-reward' }, `💰 ${props.mission.moneyReward}`),
@ -214,15 +220,30 @@ const MissionCardContent = defineComponent({
? h('span', { class: 'reward-more' }, `+${props.mission.rewards.length - 2}`) ? h('span', { class: 'reward-more' }, `+${props.mission.rewards.length - 2}`)
: null, : null,
]), ]),
]),
h('div', { class: 'card-actions' }, [ h('div', { class: 'card-actions' }, [
!canAccept(props.mission)
? h('span', { class: 'action-hint' }, canClaim(props.mission)
? '任务已完成,领取奖励'
: props.mission.status === DailyMissionStatus.InProgress
? '任务正在进行中'
: '奖励已领取'
)
: null,
canAccept(props.mission) canAccept(props.mission)
? h('button', { class: 'card-btn accept-btn', onClick: () => emit('accept') }, '接取') ? h('button', { class: 'card-btn accept-btn', type: 'button', onClick: () => emit('accept') }, [
h('span', { class: 'btn-label' }, '准备好后即可接取'),
h('span', { class: 'btn-arrow' }, '›'),
])
: canClaim(props.mission) : canClaim(props.mission)
? h('button', { class: 'card-btn claim-btn', onClick: () => emit('claim') }, '领取') ? h('button', { class: 'card-btn claim-btn', type: 'button', onClick: () => emit('claim') }, [
h('span', { class: 'btn-label' }, '领取奖励'),
h('span', { class: 'btn-arrow' }, '›'),
])
: props.mission.status === DailyMissionStatus.InProgress : props.mission.status === DailyMissionStatus.InProgress
? h('button', { class: 'card-btn disabled-btn', disabled: true }, '进行中') ? h('button', { class: 'card-btn disabled-btn', type: 'button', disabled: true }, '进行中')
: props.mission.status === DailyMissionStatus.Claimed : props.mission.status === DailyMissionStatus.Claimed
? h('button', { class: 'card-btn disabled-btn', disabled: true }, '已完成') ? h('button', { class: 'card-btn disabled-btn', type: 'button', disabled: true }, '已完成')
: null, : null,
]), ]),
]) ])
@ -409,15 +430,18 @@ const MissionCardContent = defineComponent({
} }
.mission-card { .mission-card {
background: rgba(255, 255, 255, 0.02); background:
radial-gradient(circle at top left, rgba(255, 136, 68, 0.08), transparent 34%),
rgba(255, 255, 255, 0.025);
border: 1px solid; border: 1px solid;
border-radius: 12px; border-radius: 18px;
overflow: hidden; overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
} }
.mission-card:hover { .mission-card:hover {
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
} }
.purgatory-card { .purgatory-card {
@ -425,7 +449,7 @@ const MissionCardContent = defineComponent({
} }
.card-inner { .card-inner {
padding: 16px; padding: 18px;
} }
.mission-collection { .mission-collection {
@ -447,14 +471,15 @@ const MissionCardContent = defineComponent({
.mission-card-content { .mission-card-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 10px; gap: 12px;
} }
.card-header { .card-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: flex-start;
padding-bottom: 10px; gap: 12px;
padding-bottom: 12px;
border-bottom: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08);
} }
@ -467,11 +492,16 @@ const MissionCardContent = defineComponent({
} }
.card-icon { .card-icon {
width: 24px; width: 34px;
height: 24px; height: 34px;
flex: 0 0 34px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 6px;
border-radius: 12px;
background: rgba(255, 255, 255, 0.06);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
} }
.card-icon :deep(svg) { .card-icon :deep(svg) {
@ -479,39 +509,68 @@ const MissionCardContent = defineComponent({
height: 100%; height: 100%;
} }
.title-stack {
display: flex;
flex-direction: column;
gap: 3px;
min-width: 0;
}
.card-title { .card-title {
color: #ffffff; color: #ffffff;
font-size: 1rem; font-size: 1.05rem;
font-weight: 600; font-weight: 700;
letter-spacing: 0.02em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.card-subtitle {
color: #777777;
font-size: 0.72rem;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.card-status { .card-status {
padding: 2px 8px; padding: 5px 10px;
border-radius: 8px; border-radius: 999px;
font-size: 0.7rem; font-size: 0.72rem;
font-weight: 500; font-weight: 700;
white-space: nowrap; white-space: nowrap;
letter-spacing: 0.04em;
} }
.card-desc { .card-desc {
color: #888888; color: #aaaaaa;
font-size: 0.8rem; font-size: 0.84rem;
line-height: 1.4; line-height: 1.55;
} }
.card-difficulty { .card-meta-row {
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap;
gap: 8px;
} }
.difficulty-badge { .difficulty-badge {
padding: 2px 8px; padding: 4px 10px;
border-radius: 4px; border-radius: 999px;
font-size: 0.7rem; font-size: 0.72rem;
font-weight: 500; font-weight: 700;
}
.time-badge {
padding: 4px 10px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.08);
color: #9ca3af;
font-size: 0.72rem;
font-weight: 600;
} }
.difficulty-normal { .difficulty-normal {
@ -529,39 +588,56 @@ const MissionCardContent = defineComponent({
color: #fca5a5; color: #fca5a5;
} }
.card-progress { .objective-panel {
display: flex; display: flex;
align-items: center; flex-direction: column;
gap: 6px; gap: 5px;
background: rgba(255, 255, 255, 0.03); background: linear-gradient(135deg, rgba(34, 197, 94, 0.12), rgba(255, 255, 255, 0.035));
padding: 8px 10px; border: 1px solid rgba(34, 197, 94, 0.18);
border-radius: 6px; padding: 11px 12px;
border-radius: 12px;
} }
.progress-label { .objective-label {
color: #666666; color: #86efac;
font-size: 0.75rem; font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
} }
.progress-value { .objective-value {
color: #22c55e; color: #ffffff;
font-size: 0.8rem; font-size: 0.9rem;
font-weight: 500; font-weight: 700;
}
.reward-section {
display: flex;
flex-direction: column;
gap: 8px;
}
.section-label {
color: #777777;
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
} }
.card-rewards { .card-rewards {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 4px; gap: 6px;
} }
.reward-item { .reward-item {
background: rgba(255, 136, 68, 0.1); background: rgba(255, 136, 68, 0.1);
border: 1px solid rgba(255, 136, 68, 0.2); border: 1px solid rgba(255, 136, 68, 0.2);
color: #ff8844; color: #ff8844;
padding: 2px 6px; padding: 5px 9px;
border-radius: 4px; border-radius: 999px;
font-size: 0.7rem; font-size: 0.74rem;
font-weight: 700;
} }
.exp-reward { .exp-reward {
@ -579,53 +655,111 @@ const MissionCardContent = defineComponent({
.reward-more { .reward-more {
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
color: #888888; color: #888888;
padding: 2px 6px; padding: 5px 9px;
border-radius: 4px; border-radius: 999px;
font-size: 0.7rem; font-size: 0.74rem;
font-weight: 700;
} }
.card-actions { :deep(.card-actions) {
display: flex; display: flex;
gap: 8px; flex-direction: column;
margin-top: 4px; gap: 9px;
margin-top: 6px;
padding-top: 14px;
border-top: 1px solid rgba(255, 255, 255, 0.08);
} }
.card-btn { :deep(.action-hint) {
flex: 1; color: #777777;
padding: 8px 12px; font-size: 0.75rem;
border-radius: 6px; text-align: center;
font-size: 0.8rem; }
font-weight: 500;
:deep(.card-btn) {
width: 100%;
min-height: 50px;
padding: 0 18px;
border-radius: 16px;
font-size: 0.95rem;
font-weight: 800;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
border: none; border: 1px solid transparent;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
letter-spacing: 0.08em;
} }
.card-btn.accept-btn { :deep(.btn-label) {
background: linear-gradient(135deg, #ff8844 0%, #ff6644 100%); display: inline-flex;
align-items: center;
justify-content: center;
line-height: 1;
}
:deep(.card-btn:active:not(:disabled)) {
transform: scale(0.98);
}
:deep(.btn-arrow) {
font-size: 1.3rem;
line-height: 1;
transform: translateY(-1px);
}
:deep(.card-btn.accept-btn) {
background: linear-gradient(135deg, #facc15 0%, #ff8844 45%, #ef4444 100%);
border-color: rgba(255, 214, 102, 0.55);
color: #ffffff;
box-shadow:
0 10px 24px rgba(255, 136, 68, 0.26),
inset 0 1px 0 rgba(255, 255, 255, 0.22);
text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}
:deep(.card-btn.accept-btn .btn-label) {
font-size: 1rem;
font-weight: 900;
color: #ffffff; color: #ffffff;
letter-spacing: 0.1em;
} }
.card-btn.accept-btn:hover { :deep(.card-btn.accept-btn:hover) {
transform: scale(1.02); transform: translateY(-1px);
box-shadow: 0 2px 10px rgba(255, 136, 68, 0.3); filter: brightness(1.08);
box-shadow:
0 14px 30px rgba(255, 136, 68, 0.38),
0 0 20px rgba(250, 204, 21, 0.22),
inset 0 1px 0 rgba(255, 255, 255, 0.26);
} }
.card-btn.claim-btn { :deep(.card-btn.claim-btn) {
background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%); background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
border-color: rgba(134, 239, 172, 0.4);
color: #ffffff; color: #ffffff;
box-shadow:
0 10px 24px rgba(34, 197, 94, 0.24),
inset 0 1px 0 rgba(255, 255, 255, 0.2);
} }
.card-btn.claim-btn:hover { :deep(.card-btn.claim-btn:hover) {
transform: scale(1.02); transform: translateY(-1px);
box-shadow: 0 2px 10px rgba(34, 197, 94, 0.3); filter: brightness(1.08);
box-shadow:
0 14px 30px rgba(34, 197, 94, 0.36),
0 0 18px rgba(134, 239, 172, 0.18),
inset 0 1px 0 rgba(255, 255, 255, 0.24);
} }
.card-btn.disabled-btn { :deep(.card-btn.disabled-btn) {
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
color: #555555; color: #6b7280;
cursor: not-allowed; cursor: not-allowed;
box-shadow: none;
} }
.status-pending { .status-pending {

Loading…
Cancel
Save