添加操作提示

src/components/Mine.vue

@@ -52,8 +52,11 @@
     <!--</el-row>-->
     <!--</div>-->
     <div class="mine-body" style="text-align: center;">
-      <el-tabs v-loading="loading" style="width: 90%;margin-left: 5%">
-        <el-tab-pane label="未完成任务">
+      <el-tabs @tab-click="handleTabClick" v-loading="loading" style="width: 90%;margin-left: 5%">
+        <el-tab-pane name="unFinishedTask">
+          <span slot="label">
+            <el-badge class="item" style="margin-top: 10px;margin-bottom: 10px">未完成任务</el-badge>
+          </span>
           <el-row v-if="unFinishedTaskList != null && unFinishedTaskList.length != 0" type="flex" align="middle"
                   justify="center" style="font-size: 14px;">
             <el-col :span="6">任务封面</el-col>
@@ -66,7 +69,10 @@
           <task-item v-if="unFinishedTaskList != null || unFinishedTaskList.length > 0"
                      v-for="(item,index1) in unFinishedTaskList" :key="index1" :task="item"/>
         </el-tab-pane>
-        <el-tab-pane label="已完成任务">
+        <el-tab-pane name="finishedTask">
+          <span slot="label">
+            <el-badge class="item" style="margin-top: 10px;margin-bottom: 10px">已完成任务</el-badge>
+          </span>
           <el-row v-if="finishedTaskList != null && finishedTaskList.length != 0" type="flex" align="middle"
                   justify="center" style="font-size: 14px;">
 
@@ -81,7 +87,15 @@
                      v-for="(item,index2) in finishedTaskList" :key="index2" :task="item"/>
         </el-tab-pane>
 
-        <el-tab-pane label="我的项目">
+
+        <el-tab-pane name="myProject">
+
+          <span slot="label">
+            <el-badge v-if="myProjectNoticeCount>0" :value="myProjectNoticeCount" class="item"
+                      style="height:auto;margin-top: 10px;margin-bottom: 10px">我的项目</el-badge>
+            <el-badge v-if="myProjectNoticeCount==0" class="item"
+                      style="margin-top: 10px;margin-bottom: 10px">我的项目</el-badge>
+          </span>
           <span v-if="myProjects == null || myProjects.length == 0"> 暂无项目 </span>
           <el-row v-if="myProjects != null && myProjects.length != 0" type="flex" align="middle" justify="center"
                   style="font-size: 14px;">
@@ -94,7 +108,12 @@
           <project-item v-if="myProjects != null || myProjects.length > 0"
                         v-for="(item,index3) in myProjects" :key="index3" :projectItem="item"/>
         </el-tab-pane>
-        <el-tab-pane label="处理中项目">
+        <el-tab-pane name="handlingProject">
+          <span slot="label">
+            <el-badge v-if="processProjectNoticeCount>0" :value="processProjectNoticeCount" class="item"
+                      style="margin-top: 10px;margin-bottom: 10px">处理中项目</el-badge>
+            <el-badge v-if="processProjectNoticeCount==0" class="item" style="margin-top: 10px;margin-bottom: 10px">处理中项目</el-badge>
+          </span>
           <el-row v-if="handlingProjects != null && handlingProjects.length != 0" type="flex" align="middle"
                   justify="center" style="font-size: 14px;">
             <el-col :span="6">项目图片</el-col>
@@ -107,7 +126,10 @@
           <project-item v-if="handlingProjects != null || handlingProjects.length > 0"
                         v-for="(item,index4) in handlingProjects" :key="index4" :projectItem="item"/>
         </el-tab-pane>
-        <el-tab-pane label="可接收项目">
+        <el-tab-pane name="acceptableProject">
+          <span slot="label">
+            <el-badge class="item" style="margin-top: 10px;margin-bottom: 10px">可接收项目</el-badge>
+          </span>
           <el-row v-if="acceptableProjects != null && acceptableProjects.length != 0" type="flex" align="middle"
                   justify="center" style="font-size: 14px;">
             <el-col :span="6">项目图片</el-col>
@@ -156,6 +178,8 @@ export default {
       handlingProjects: [],
       acceptableProjects: [],
       defaultValue: defaultValue,
+      myProjectNoticeCount: 0,
+      processProjectNoticeCount: 0,
       rolesPermissions: {
         isRegionManager: false,
         isIndividualUser: false,
@@ -195,6 +219,8 @@ export default {
       this.showLoading()
       Http.get(Apis.PAGE.MY_CROWD_TEST_PAGE.replace('{userId}', this.user.userVO.id)).then((res) => {
         this.hideLoading()
+        this.processProjectNoticeCount = res.processProjectNoticeCount
+        this.myProjectNoticeCount = res.myProjectNoticeCount
         if (res.unfinishedTasks != null && res.unfinishedTasks.length > 0) {
           this.unFinishedTaskList = res.unfinishedTasks
         }
@@ -302,6 +328,16 @@ export default {
     },
     hideLoading () {
       this.loading = false
+    },
+    handleTabClick (event) {
+      if (event.name == 'myProject') {
+        //this.myProjectNoticeCount = 0
+      }
+      if (event.name == 'handlingProject') {
+        //this.processProjectNoticeCount = 0
+      }
+      console.log('123')
+      console.log(event)
     }
   },
   created: function () {

src/components/commons/ProjectItem.vue

@@ -33,8 +33,11 @@
       <el-col :span="2" type="flex" align="middle" justify="center">
         <div class="badge">¥{{project.budget}}</div>
       </el-col>
-      <el-col :span="4" type="flex" align="middle" justify="center"><span class="btn btn-small btn-info"
-                                                                          @click="goToProjectDetail(project.id)">查看详情</span>
+      <el-col :span="4" type="flex" align="middle" justify="center">
+        <el-badge v-if="project.needHandle" is-dot class="item">
+          <span class="btn btn-small btn-info" @click="goToProjectDetail(project.id)">查看详情</span>
+        </el-badge>
+        <span v-if="!project.needHandle" class="btn btn-small btn-info" @click="goToProjectDetail(project.id)">查看详情</span>
       </el-col>
     </el-row>