diff --git a/pages/goods/components/GoodInfo/styles/index.scss b/pages/goods/components/GoodInfo/styles/index.scss
index 271933e..978e97b 100644
--- a/pages/goods/components/GoodInfo/styles/index.scss
+++ b/pages/goods/components/GoodInfo/styles/index.scss
@@ -61,8 +61,8 @@
margin-top: 12px;
.facilities-grid {
- display: grid;
- grid-template-columns: repeat(3, 1fr);
+ display: flex;
+ flex-wrap: wrap;
gap: 8px;
.facility-item {
diff --git a/pages/goods/index.vue b/pages/goods/index.vue
index 0149e9e..295f3c5 100644
--- a/pages/goods/index.vue
+++ b/pages/goods/index.vue
@@ -15,9 +15,31 @@
-
+
+
+
+
+
+
+ {{ moduleItem.moduleTitle }}
+
+ {{ moduleItem.moduleContent }}
+
+
+
-
+
diff --git a/pages/goods/styles/index.scss b/pages/goods/styles/index.scss
index d73d2cd..128ea5f 100644
--- a/pages/goods/styles/index.scss
+++ b/pages/goods/styles/index.scss
@@ -15,6 +15,50 @@ $button-hover-color: darken($button-color, 8%);
flex-shrink: 0;
}
+ // 使用须知样式
+ .use-notice {
+ margin-bottom: 16px;
+
+ .module-item {
+ display: flex;
+ align-items: flex-start;
+ flex-direction: column;
+ border-bottom: 1px solid #666;
+ padding: 12px 0;
+
+ .module-icon {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ margin-right: 8px;
+ flex-shrink: 0;
+
+ image {
+ width: 20px;
+ height: 20px;
+ object-fit: cover;
+ background-color: #f55726;
+ margin-right: 8px;
+ }
+
+ .module-title {
+ font-size: 14px;
+ color: #333;
+ text-align: center;
+ word-wrap: break-word;
+ }
+ }
+
+ .module-desc {
+ flex: 1;
+ font-size: 12px;
+ color: #666;
+ line-height: 1.5;
+ margin-top: 4px;
+ }
+ }
+ }
+
.content-wrapper {
flex: 1;
height: 0; // 关键:让flex子项能够正确计算高度