no message

common/task/task_ima_tab.vue

@@ -1,20 +1,10 @@
 <template>
-	<view class="task-tab">
-		<scroll-view class="scroll-Y row" scroll-x="true">
-			<view class="z-tabs-scroll-view row-justify-sb center" style="position: relative;">
-				<view class="column-c p-lr30 p-t30 p-b20" v-for="(item,index) in navList" :key="index"
-					@click="setType(index)">
-					<image class="wh-60 r-circle" :class="index===current?'double-border':''" :src="item.product_icon"
-						mode="aspectFill">
-					</image>
-					<view class="m-t16 sys-size-24 sys-weight-600" :class="{'default-text':index===current}">
-						{{item.briefness_name}}
-					</view>
-				</view>
-				<view class="half-circle m-t20"></view>
-			</view>
-		</scroll-view>
-	</view>
+  <view class="m-lr20 r-20">
+    <k-tabs-swiper class="r-20" v-model="current" :tabs="navList" :field="'name'"   bgColor="#fff" color="#444444"
+                   activeColor="#10B261" fontSize="28rpx" :bold="true" :scroll="true" height="100rpx" lineHeight="10rpx"
+                   @change="changeTab" paddingItem="0 50rpx">
+    </k-tabs-swiper>
+  </view>
 </template>
 
 <script>
@@ -27,36 +17,42 @@
     props:{
       listType:{
         default:0
+      },
+      numType:{
+        default:0
       }
     },
 		data() {
 			return {
 				current: 0,
+
 				navList: [{
-					id: 0,
-					briefness_name: '全部',
-					product_icon: '/static/img/task/task-all.png'
+          id: 0,
+          name: '全部',
+          product_name: '全部',
+          icon: '/static/img/task/task-all.png',
+          num:0
 				}],
         typeList:[
           {
             id: 2,
-            briefness_name: '垫资还款',
-            product_icon: '/static/img/task/task-refund.png'
+            name: '垫资还款',
+            icon: '/static/img/task/task-refund.png'
           },
           {
             id: 1,
-            briefness_name: '房抵业务',
-            product_icon: '/static/img/task/task-loan.png'
+            name: '房抵业务',
+            icon: '/static/img/task/task-loan.png'
           },
           {
             id: 3,
-            briefness_name: '消费金融',
-            product_icon: '/static/img/task/task-financial.png'
+            name: '消费金融',
+            icon: '/static/img/task/task-financial.png'
           },
           {
             id: 4,
-            briefness_name: '其他服务',
-            product_icon: '/static/img/task/task-else.png'
+            name: '其他服务',
+            icon: '/static/img/task/task-else.png'
           }
         ]
 			}
@@ -65,76 +61,38 @@
 
     },
 		mounted() {
-      console.log(this.listType+'----------------------------dsadsadas')
       if(this.listType===1){
         this.navList=this.typeList
-        console.log('--------------------------------')
       }else {
         this.getTaskType()
       }
 
 		},
 		methods: {
-			getTaskType() {
-				getTaskType().then(res => {
-					if (res.code === 1) {
-						this.navList.push(...res.data)
+      getTaskType() {
+        getTaskType({'numType':this.numType,'listType':this.listType}).then(res => {
+          if (res.code === 1) {
+            res.data.forEach(item=>{
+              this.navList[0].num+=item.num
+              if(this.numType>0){
+                item.name=item.product_name+'('+item.num+')'
+                this.navList[0].name=this.navList[0].product_name+'('+ this.navList[0].num+')'
+              }else {
+                item.name=item.product_name
+              }
+              this.navList.push(item)
+            })
+          }
+        })
+      },
 
-					}
-				})
-			},
-			setType(current) {
-				// this.$nextTick(() => {
-				// 	uni.createSelectorQuery().in(this).select(".z-tabs-scroll-view").fields({
-				// 		scrollOffset: true
-				// 	}, data => {
-				// 		if (data) {
-				// 			this.currentScrollLeft = data.scrollLeft;
-				// 			console.log(data);
-				// 		} else {}
-				// 	}).exec();
-				// })
-				if (current !== this.current) {
-					this.current = current
-					this.$emit('setProductId', this.navList[current].id)
-				}
+      changeTab(current) {
+        this.$emit('setProductId', this.navList[current].id)
 			},
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
-	.task-tab {
-		margin: 0 20rpx;
-		border-radius: 30rpx;
-		background: #fff;
-		width: calc(100% - 40rpx);
-	}
-
-	.default-text {
-		color: #10B261;
-	}
 
-	.half-circle {
-		width: 20rpx;
-		height: 10rpx;
-		background-color: #3eaf7c;
-		border-top-left-radius: 10rpx;
-		border-top-right-radius: 10rpx;
-		position: absolute;
-		bottom: 0;
-		left: calc(25%/2 - 10rpx);
-	}
-
-	.half-transition {
-		transition: all .5s ease;
-	}
-
-	.tab-item {
-		// width: 25%;
-	}
-
-	.double-border {
-		box-shadow: 0 0 0 6rpx #fff, 0 0 0 12rpx #10B261;
-	}
 </style>

page_task/gain_task/gain_task.vue

@@ -1,12 +1,13 @@
 <template>
 	<view class="total-page page-box gain-task">
 		<Nav :title="'领取任务'" :genre="1" is_fixed></Nav>
-		<view class="m-lr20 r-20">
-			<k-tabs-swiper class="r-20" v-model="current" :tabs="tabs" :field="'name'"   bgColor="#fff" color="#444444"
-				activeColor="#10B261" fontSize="28rpx" :bold="true" :scroll="true" height="100rpx" lineHeight="10rpx"
-				@change="changeTab" paddingItem="0 50rpx">
-			</k-tabs-swiper>
-		</view>
+<!--		<view class="m-lr20 r-20">-->
+<!--			<k-tabs-swiper class="r-20" v-model="current" :tabs="tabs" :field="'name'"   bgColor="#fff" color="#444444"-->
+<!--				activeColor="#10B261" fontSize="28rpx" :bold="true" :scroll="true" height="100rpx" lineHeight="10rpx"-->
+<!--				@change="changeTab" paddingItem="0 50rpx">-->
+<!--			</k-tabs-swiper>-->
+<!--		</view>-->
+    <task-ima-tab @setProductId="setProductId" :num-type="1"></task-ima-tab>
 		<EnScroll ref="scroll" :navHeight="110" class="main" @onRefresh="onRefresh" @onScrollBottom="onScrollBottom">
 			<TaskItem :type="2" :task-list="taskList" is_bottom @takeTask="setTakeTask"></TaskItem>
 		</EnScroll>
@@ -15,14 +16,12 @@
 
 <script>
 	import TaskItem from "@/common/task/task-item.vue"
-  import {
-    getTaskReceiving, getTaskType,
-    takeTask
-  } from "@/api/task"
-	import tools from "@/service/tools"
+  import { getTaskReceiving} from "@/api/task"
+  import TaskImaTab from "@/common/task/task_ima_tab.vue";
 
 	export default {
 		components: {
+      TaskImaTab,
 			TaskItem
 		},
 		data() {
@@ -45,27 +44,9 @@
 			}
 		},
 		mounted() {
-			this.getTaskType()
 			this.getTaskReceiving()
 		},
 		methods: {
-      getTaskType() {
-        getTaskType({'numType':1}).then(res => {
-          if (res.code === 1) {
-            res.data.forEach(item=>{
-              item.name=item.product_name+'('+item.num+')'
-              this.tabs[0].num+=item.num
-              this.tabs[0].name=this.tabs[0].product_name+'('+ this.tabs[0].num+')'
-              this.tabs.push(item)
-            })
-          }
-        })
-      },
-			changeTab(index) {
-				this.current = index
-        console.log(index)
-        this.setProductId(this.tabs[index].id)
-			},
 			setProductId(productId) {
 				console.log('productId:' + productId)
 				this.productId = productId