..

src/components/Mine.vue

@@ -52,13 +52,19 @@
     <div class="mine-body">
       <el-tabs tabPosition="top" type="card">
         <el-tab-pane label="未完成任务">
-          <task-item v-for="(item,index) in unFinishedTaskList" :key="index" :task="item"/>
+          <span v-if="unFinishedTaskList == null || unFinishedTaskList.length == 0"> 暂无任务 </span>
+          <task-item v-if="unFinishedTaskList != null || unFinishedTaskList.length > 0"
+                     v-for="(item,index) in unFinishedTaskList" :key="index" :task="item"/>
         </el-tab-pane>
         <el-tab-pane label="已完成任务">
-          <task-item v-for="(item,index) in finishedTaskList" :key="index" :task="item"/>
+          <span v-if="finishedTaskList == null || finishedTaskList.length == 0"> 暂无任务 </span>
+          <task-item v-if="finishedTaskList != null || finishedTaskList.length > 0"
+                     v-for="(item,index) in finishedTaskList" :key="index" :task="item"/>
         </el-tab-pane>
         <el-tab-pane label="已申请项目">
-          <project-item v-for="(item,index) in appliedProjectList" :key="index" :projectId="item.id"/>
+          <span v-if="appliedProjectList == null || appliedProjectList.length == 0"> 暂无项目 </span>
+          <project-item v-if="appliedProjectList != null || appliedProjectList.length > 0"
+                        v-for="(item,index) in appliedProjectList" :key="index" :projectItem="item"/>
         </el-tab-pane>
       </el-tabs>
     </div>
@@ -85,10 +91,18 @@ export default {
   methods: {
     loadData () {
       Http.get(Apis.PAGE.MY_CROWD_TEST_PAGE.replace('{userId}', 3), {}).then((res) => {
-        this.finishedTaskList = res.crowdProjectVOList
-        this.unFinishedTaskList = res.unfinishedTasks
-        this.appliedProjectList = res.finishedTasks
-        this.user = res.userVO
+        if (res.unfinishedTasks != null && res.unfinishedTasks.length > 0) {
+          this.unFinishedTaskList = res.unfinishedTasks
+        }
+        if (res.finishedTasks != null && res.finishedTasks.length > 0) {
+          this.finishedTaskList = res.finishedTasks
+        }
+        if (res.crowdProjectVOList != null && res.crowdProjectVOList.length > 0) {
+          this.appliedProjectList = res.crowdProjectVOList
+        }
+        if (res.userVO != null && res.userVO.length > 0) {
+          this.user = res.userVO
+        }
       })
     }
   },

src/components/commons/ProjectItem.vue

@@ -4,12 +4,12 @@
       <img class="project-cover" src="@/assets/img/home_ban1.jpg">
     </span>
     <span class="project-title col-md-2 col-sm-10">{{project.name}}</span>
-    <span class="project-title col-md-2 col-sm-10">{{project.code}}</span>
-    <span class="col-md-1 col-sm-5">
+    <span class="project-title col-md-2 col-sm-10">{{project.id}}</span>
+    <span class="col-md-2 col-sm-10">
       <span
-        v-bind:class="['badge',{ 'ios-platform': item.toLowerCase()=='ios','android-platform': item.toLowerCase()=='android','web-platform': item.toLowerCase()=='web'}]"
-        v-for="item in platformType"
-      >{{item}}</span>
+        v-bind:class="['badge',{ 'ios-platform': item=='0','android-platform': item=='1','web-platform': item=='2'}]"
+        v-for="item in project.platform"
+      >{{platformType[item]}}</span>
     </span>
     <span class="col-md-1 col-sm-5">¥{{project.price}}</span>
     <span class="project-td">
@@ -19,57 +19,54 @@
 </template>
 
 <script>
-import PlatformType from "@/constants/enum/platform-type";
+import PlatformType from '@/constants/enum/platform-type'
+
 export default {
-  name: "Project-Item",
+  name: 'Project-Item',
   props: {
-    projectId: Number
+    projectItem: {}
   },
-  data() {
+  data () {
     return {
-      project: {
-        id: 1,
-        code: "27382hdsjkfdskfK",
-        name: "多人聊天发送文件测试",
-        platform: [0],
-        description: "任务描述文字xxxx",
-        price: "10"
-      },
-      platformType: []
-    };
+      project: this.projectItem,
+      platformType: PlatformType
+    }
   },
-  mounted() {
-    this.project.platform.map(item => {
-      this.platformType.push(PlatformType[item]);
-    });
+  mounted () {
+    // this.project.platform.map(item => {
+    //   this.platformType.push(PlatformType[item]);
+    // });
   },
   methods: {
-    goToProjectDetail(id) {
-      console.log(id);
-      this.$router.push({ name: "Project", params: { projectId: id } });
+    goToProjectDetail (id) {
+      console.log(id)
+      this.$router.push({name: 'Project', params: {projectId: id}})
     }
   }
-};
+}
 </script>
 
 <style lang="less" scoped>
-.project-item-container {
-  padding: 20px;
-  border: 1px solid #eee;
-  margin: 15px 5px;
-  span {
-    display: inline-block;
+  .project-item-container {
+    padding: 20px;
+    border: 1px solid #eee;
+    margin: 15px 5px;
+    span {
+      display: inline-block;
+    }
+  }
+
+  .project-cover {
+    width: 200px;
+    height: 130px;
+    vertical-align: middle;
+  }
+
+  .project-title {
+    font-weight: 700;
+  }
+
+  .project-td {
+    padding: 15px;
   }
-}
-.project-cover {
-  width: 200px;
-  height: 130px;
-  vertical-align: middle;
-}
-.project-title {
-  font-weight: 700;
-}
-.project-td {
-  padding: 15px;
-}
 </style>

src/components/commons/TaskItem.vue

@@ -4,10 +4,10 @@
         <img class="task-cover" src="@/assets/img/home_ban1.jpg">
       </span>
     <span class="task-title col-md-2 col-sm-10">{{taskTable.title}}</span>
-    <span class="col-md-1 col-sm-5 ">{{serviceType}}</span>
+    <span class="col-md-1 col-sm-5 ">{{serviceType[taskTable.serviceType]}}</span>
     <span class="col-md-1 col-sm-5 ">¥{{taskTable.price}}</span>
     <!--<span class="col-md-1 col-sm-5 ">{{platformType}}</span>-->
-    <span class="col-md-1 col-sm-5 ">{{taskStatus}}</span>
+    <span class="col-md-1 col-sm-5 ">{{taskStatus[taskTable.status]}}</span>
     <span class="task-td">
        <span class="btn btn-medium btn-info" @click="goToTaskDetail(taskTable.projectId,taskTable.id)">查看详情</span>
        </span>
@@ -28,8 +28,8 @@ export default {
   data () {
     return {
       taskTable: this.task,
-      taskStatus: TaskStatus[this.task.status],
-      serviceType: ServiceType[this.task.serviceType],
+      taskStatus: TaskStatus,//TaskStatus[this.task.status],
+      serviceType: ServiceType,//[this.task.serviceType],
       platformType: []
     }
   },