diff --git a/Build_God_Game/src/assets/images/collection.svg b/Build_God_Game/src/assets/images/collection.svg
new file mode 100644
index 0000000..d866031
--- /dev/null
+++ b/Build_God_Game/src/assets/images/collection.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/Build_God_Game/src/assets/images/hunting.svg b/Build_God_Game/src/assets/images/hunting.svg
new file mode 100644
index 0000000..2f45547
--- /dev/null
+++ b/Build_God_Game/src/assets/images/hunting.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/Build_God_Game/src/views/DailyMissionView.vue b/Build_God_Game/src/views/DailyMissionView.vue
index 86bdad1..2ab8eab 100644
--- a/Build_God_Game/src/views/DailyMissionView.vue
+++ b/Build_God_Game/src/views/DailyMissionView.vue
@@ -4,6 +4,8 @@ import { useRouter } from 'vue-router'
import { dailyMissionApi, type DailyMission, DailyMissionStatus, RewardType, MissionType, MissionDifficulty, ProgressTargetType } from '@/api/dailyMission'
import Particles from '@/components/Particles/Particles.vue'
import ElectricBorder from '@/components/ElectricBorder/ElectricBorder.vue'
+import collectionIcon from '@/assets/images/collection.svg?raw'
+import huntingNormalIcon from '@/assets/images/hunting.svg?raw'
const router = useRouter()
@@ -143,6 +145,13 @@ const getProgressText = (mission: DailyMission) => {
return `${targetType} ${progress.currentCount}/${progress.targetCount} ${targetName}`
}
+const getMissionIcon = (type: MissionType) => {
+ if (type === MissionType.Collection) {
+ return collectionIcon
+ }
+ return huntingNormalIcon
+}
+
const MissionCardContent = defineComponent({
name: 'MissionCardContent',
props: {
@@ -156,7 +165,7 @@ const MissionCardContent = defineComponent({
return () => h('div', { class: 'mission-card-content' }, [
h('div', { class: 'card-header' }, [
h('div', { class: 'card-title-row' }, [
- h('span', { class: 'card-icon' }, '📦'),
+ h('div', { class: 'card-icon', innerHTML: getMissionIcon(props.mission.missionType) }),
h('span', { class: 'card-title' }, props.mission.missionTitle),
]),
h('span', { class: ['card-status', getStatusClass(props.mission.status)] }, getStatusText(props.mission.status)),
@@ -433,7 +442,16 @@ const MissionCardContent = defineComponent({
}
.card-icon {
- font-size: 1.2rem;
+ width: 24px;
+ height: 24px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.card-icon :deep(svg) {
+ width: 100%;
+ height: 100%;
}
.card-title {