feat(service-t): 更新页面样式和布局

- 添加页面背景图和标题样式
- 调整标题区域布局，增加图片和样式
- 优化商品区域样式- 更新颜色和字体样式

src/views/service/service-t.vue

@@ -1,7 +1,8 @@
 <template>
   <div id="selectPreservation">
     <div class="title">
-      {{ title }}
+      <img src="../../assets/images/sunful/page-header.png" alt="" />
+      <h2>{{ title }}</h2>
     </div>
     <div class="commodity">
       <ul ref="shopContent">
@@ -148,22 +149,46 @@ export default {
 
 <style lang="scss" scoped>
 #selectPreservation {
+  min-height: 100vh;
+
+  display: flex;
+  flex-direction: column;
+  background-position: 100% 100%;
+  background-repeat: no-repeat;
+  background-size: cover;
   .title {
     font-size: 20px;
-    padding: 30px 20px 40px 20px;
     color: #fff;
     font-weight: 600;
-    background: #bd1c2d;
+    background: #ca2736;
+    img {
+      width: 100%;
+    }
+    h2 {
+      position: absolute;
+      top: 30px;
+      left: 15px;
+      font-family: Alibaba-PuHuiTi, Alibaba-PuHuiTi;
+      font-weight: normal;
+      font-size: 26px;
+      color: #ffffff;
+      line-height: 32px;
+      text-align: left;
+      font-style: normal;
+    }
   }
   .commodity {
     border-radius: 10px;
     position: relative;
     margin-top: -10px;
     padding-top: 30px;
+    flex: 1;
+
     background-image: url('../../assets/images/sunful/page-banner.png');
-    background-position: 100% 100%;
-    background-repeat: no-repeat;
     background-size: cover;
+    background-repeat: no-repeat;
+    //background-position: 100% 100%;
+
     .eventList {
       padding-bottom: 20px;
       margin: 0 15px;