feat: 增加商品组件

src/pages/ChatMain/ChatLongAnswer/styles/ParsedValueView.scss

@@ -14,6 +14,11 @@
   display: flex;
   flex-direction: column;
   gap: 6px;
+  margin-bottom: 8px;
+}
+
+.content-body-image-bottom {
+  margin-bottom: 8px;
 }
 
 .content-body-image {
@@ -36,6 +41,7 @@
   gap: 4px;
   padding: 12px;
   border-radius: 12px;
+  margin-bottom: 8px;
 }
 
 .content-body-list-item {
@@ -43,6 +49,14 @@
   align-items: flex-start;
 }
 
+.content-body-list-marker {
+  width: 22px;
+  flex-shrink: 0;
+  font-size: 15px;
+  font-weight: 800;
+  line-height: 20px;
+}
+
 .content-body-list-text {
   flex: 1;
   font-size: 15px;
@@ -56,7 +70,7 @@
 }
 
 .detail-action-label {
-  padding: 12px 0 12px;
+  padding: 0 0 10px;
   color: #94a3b8;
   font-size: 10px;
   font-weight: 900;
@@ -131,6 +145,87 @@
   border: 0;
 }
 
+.detail-product-scroll {
+  width: 100%;
+  white-space: nowrap;
+}
+
+.detail-product-row {
+  display: flex;
+  gap: 10px;
+}
+
+.detail-product-card {
+  width: 220px;
+  flex-shrink: 0;
+  overflow: hidden;
+  border: 1px solid #f1f5f9;
+  border-radius: 20px;
+  background: #fff;
+  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04);
+}
+
+.detail-product-image {
+  width: 100%;
+  height: 110px;
+  background: #f1f5f9;
+}
+
+.detail-product-body {
+  padding: 10px 12px 12px;
+}
+
+.detail-product-tag {
+  display: inline-flex;
+  width: fit-content;
+  margin-bottom: 4px;
+  padding: 2px 6px;
+  border-radius: 6px;
+  color: #f43f5e;
+  background: #fef2f2;
+  font-size: 9px;
+  font-weight: 900;
+}
+
+.detail-product-name {
+  overflow: hidden;
+  color: #1e293b;
+  font-size: 13px;
+  font-weight: 900;
+  line-height: 20px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.detail-product-price {
+  margin: 4px 0 8px;
+  color: #f43f5e;
+  font-size: 20px;
+  font-weight: 900;
+  line-height: 26px;
+}
+
+.detail-product-currency {
+  font-size: 12px;
+}
+
+.detail-buy-button {
+  width: 100%;
+  height: 34px;
+  padding: 0;
+  border: 0;
+  border-radius: 12px;
+  color: #451a03;
+  background: #fbbf24;
+  font-size: 12px;
+  font-weight: 900;
+  line-height: 34px;
+}
+
+.detail-buy-button::after {
+  border: 0;
+}
+
 .detail-faq-wrap {
   margin: 0;
 }