diff --git a/Web/src/pages/prop/monster.vue b/Web/src/pages/prop/monster.vue
index 41a40c8..229691e 100644
--- a/Web/src/pages/prop/monster.vue
+++ b/Web/src/pages/prop/monster.vue
@@ -1 +1,82 @@
-<template></template>
\ No newline at end of file
+<template>
+    <div class="module-title ">
+        怪物资料
+    </div>
+    <div class="module-content">
+        名称:{{ monster.name }}<br>
+        等级:{{ monster.lev }}<br>
+        说明:{{ monster.remark }}<br>
+        体力:{{ monster.blood }}<br>
+        攻击:{{ monster.minAtk }}/{{ monster.maxAtk }}<br>
+        防御:{{ monster.defense }}<br>
+        敏捷:{{ monster.agility }}<br>
+    </div>
+    <div class="module-title ">
+        击杀奖励
+    </div>
+    <div class="module-content">
+        <span v-if="monster.exp > 0">
+            经验:+{{ monster.exp }}<br>
+        </span>
+        <span v-if="monster.copper > 0">
+            铜贝:+{{ monster.copper }}<br>
+        </span>
+        <span v-if="monster.petExp > 0">
+            宠物经验:+{{ monster.petExp }}<br>
+        </span>
+    </div>
+    <div class="content" v-if="AwardTips != ''">
+        <div class="module-title ">
+            掉落奖励
+        </div>
+        <div class="module-content">
+            <div style="font-size: 16px;" v-html="AwardTips"></div>
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+definePageMeta({
+    layout: layout.default,
+    middleware: 'page-loading'
+})
+const monster = ref<any>({});
+const AwardTips = ref('')
+let monsterId = PageExtend.QueryString("m");
+
+onMounted(async () => {
+    try {
+        await BindData();
+    }
+    finally {
+        PageLoading.Close();
+    }
+})
+const BindData = async (): Promise<void> => {
+    let result = await PubService.GetMonsterInfo(monsterId)
+    if (result.code == 0) {
+        monster.value = result.data;
+        if (monster.value.award != '') {
+            AwardTips.value = awardTipsStr(JSON.parse(monster.value.award))
+            console.log(result);
+        }
+    }
+    else {
+        MessageExtend.ShowDialog("异常错误", result.msg);
+    }
+}
+
+const awardTipsStr = (data: any) => {
+    let result = '';
+    if (data.type == 'Default') {
+        result += "<strong style='font-size: 14px;'>怪物掉落几率：" + (100 - data.award.empty) + "%</strong><br>"
+        let awData: Array<any> = data.award.data;
+        awData.forEach(it => {
+            result += "▸" + it.name + "(" + (data.award.code == 'Chance' ? "概率:" : "权重:") + it.chance + (data.award.code == 'Chance' ? "%" : "") + ")<br>";
+        })
+        return result;
+    }
+
+    return result;
+}
+
+</script>
\ No newline at end of file
diff --git a/Web/src/services/Index/PubService.ts b/Web/src/services/Index/PubService.ts
index 6fa32ac..691df16 100644
--- a/Web/src/services/Index/PubService.ts
+++ b/Web/src/services/Index/PubService.ts
@@ -38,4 +38,12 @@ export class PubService {
     static async GetOnAreaInfo() {
         return await ApiService.Request("get", "/Pub/GetOnAreaInfo");
     }
+
+    /**
+     * 怪物信息
+     * GET /Pub/GetMonsterInfo
+     */
+    static async GetMonsterInfo(monsterId: string) {
+        return await ApiService.Request("get", "/Pub/GetMonsterInfo", { monsterId });
+    }
 }
\ No newline at end of file