活动首页样式调整

components/bussiness/status-bar.vue

@@ -23,6 +23,7 @@
 </template>
 <script>
 export default {
+  name: 'StatusBar',
   props: {
     minValue: {
       type: Number | String,

components/step.vue

@@ -30,7 +30,7 @@ export default {
     }
 }
 </script>
-<style lang="scss" scoped>
+<style lang="less" scoped>
 .step-container {
     display: flex;
     flex-direction: row;

components/task-activity.vue

@@ -5,6 +5,7 @@
             <div v-if="item.timeStatus == 1 || (item.timeStatus == 2 && item.hideEndFlag == 2)">
                 <img :src="item.defaultBackgroundImage"/>
                 <div class="task-item" @click="linkPage(item)">
+                    <img src="../static/images/task-one.png" />
                     <div class="task-l">
                         <div class="task-t">{{item.ruleName}}</div>  
                         <div class="task-b">
@@ -193,7 +194,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style lang="less" scoped>
     .task-activity {
         // padding: 0 0px 5px;
         .login-bg {
@@ -257,13 +258,17 @@ export default {
                 position: absolute;
                 left: 0;
                 top: 0;
-                width: 70%;
-                height: 100%;
-                padding: 0px 30px 0px 84px;
+                width: 94%;
+                height: 90%;
+                padding: 0px 10px;
                 display: flex;
                 flex-direction: row;
                 justify-content: space-between;
                 align-items: center;
+                img {
+                    width: 50px;
+                    height: 50px;
+                }
                 .task-l {
                     .task-t {
                         font-size: 16px;

package.json

@@ -30,8 +30,6 @@
     "nodemon": "^1.18.9",
     "postcss-pxtorem": "^4.0.1",
     "qs": "^6.7.0",
-    "vue-jest": "^3.0.3",
-    "node-sass": "^4.12.0",
-    "sass-loader": "^7.2.0"
+    "vue-jest": "^3.0.3"
   }
 }

pages/index.vue

@@ -7,7 +7,12 @@
 			:share-title2="shareTitle2"
 			:share-icon-url="shareIconUrl"
 		/>
+    <!-- 勤奋分进度 -->
+    <div>
+      <status-bar />
+    </div>
     <!-- 活动阶段 -->
+    <img class="title-text" src="../static/images/step-title.png"/>
     <div class="activity-step">
       <div class="step bt">
         <step 
@@ -36,21 +41,23 @@
         :stepTime="stepTime3"/>
       </div>
     </div>
-    <!-- 个人排名奖品 -->
+    <img class="title-text" src="../static/images/award.png"/>
   </div>
 </template>
 
 <script>
 import TaskActivity from '../components/task-activity';
-import Header from '@/components/header';
+import Header from '../components/header';
 import Step from '../components/step';
+import StatusBar from '../components/bussiness/status-bar';
 import { getNcovRealReports } from "@/service";
 
 export default {
   components: {
     TaskActivity,
     Header,
-    Step
+    Step,
+    StatusBar
   },
   data() {
     return {
@@ -105,8 +112,11 @@ export default {
   margin: 0 auto;
   min-height: 100vh;
   background: #B72541;
+  .title-text {
+    width: 100%;
+  }
   .activity-step {
-    margin: 0 10px;
+    margin: 0 10px 15px;
     border-radius: 5px;
     background: #9A1F36;
     .step {