refactor(component): 重构组件模板与样式结构

将公共样式提取至public.css，优化组件模板结构
添加图片资源与组件模板同步脚本
调整组件样式与布局，统一风格

component/item-forum/item-forum.js

@@ -1,11 +1,12 @@
 // my-component.js
 // 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
 const { defineComponent } = Vue;
-console.log("11223131321321");
+import { itemBottom } from "../item-bottom/item-bottom.js";
+import { itemHead } from "../item-head/item-head.js";
 
 // 定义组件（直接使用模板）
-export const MyComponent = defineComponent({
-    name: "MyComponent",
+export const itemForum = defineComponent({
+    name: "item-forum",
     props: {
         title: {
             type: String,
@@ -18,10 +19,11 @@ export const MyComponent = defineComponent({
             alert("组件按钮被点击");
         },
     },
-    // 直接使用template选项，包含标题、文本内容和按钮
-    template: `<div style="padding: 10px; border: 1px solid #ccc;">
-                <h3>{{ title }}</h3>
-                <p>这是从text文件加载的模板内容</p>
-                <button @click="handleClick">点击我</button>
-              </div>`,
+
+    components: {
+        itemBottom,
+        itemHead,
+    },
+
+    template: `<div class="item-box item-forum">    <item-head></item-head>    <div class="label flexflex">        <img class="item icon" src="./img/recommend-icon.png" />        <img class="item icon" src="./img/essence-icon.png" />        <div class="item blue">香港</div>        <div class="item">香港</div>    </div>    <div class="title">【干货】香港留学费用准备</div>    <div class="message">在即将赴港的时候，很多同学好奇香港一年制硕士下来的整体费用大概是多少，其实主要包括学费，租房费和生活费三部分。学费的话根据不同香港来定，大概在10-30万港币之间，比较固定…</div>    <item-bottom></item-bottom></div>`,
 });

component/item-forum/item-forum.text

@@ -1,5 +0,0 @@
-<div style="padding: 10px; border: 1px solid #ccc;">
-    <h3>{{ title }}</h3>
-    <p>这是从text文件加载的模板内容</p>
-    <button @click="handleClick">点击我</button>
-</div>

component/item-forum/item-forum.txt

@@ -0,0 +1,15 @@
+<div class="item-box item-forum">
+    <item-head></item-head>
+    <div class="label flexflex">
+        <img class="item icon" src="./img/recommend-icon.png" />
+        <img class="item icon" src="./img/essence-icon.png" />
+        <div class="item blue">香港</div>
+        <div class="item">香港</div>
+    </div>
+
+    <div class="title">【干货】香港留学费用准备</div>
+
+    <div class="message">在即将赴港的时候，很多同学好奇香港一年制硕士下来的整体费用大概是多少，其实主要包括学费，租房费和生活费三部分。学费的话根据不同香港来定，大概在10-30万港币之间，比较固定…</div>
+
+    <item-bottom></item-bottom>
+</div>