style：修改消息页面、统计页面组件位置调整、统计页图标完善

common/task/task-item.vue

@@ -1,41 +1,45 @@
 <template>
 	<view>
 		<view class="task-body m-20">
-			<view class="row-c page-box-bg-fff m-b20 r-30 p-30 box-shadow-197" v-for="(item,index) in taskList" :key="index"
+			<view class="row-c page-box-bg-fff m-b20 r-30 box-shadow-197" v-for="(item,index) in taskList" :key="index"
 				@click="onTaskDetails(item)">
-				<image class="wh-80" :src="item.product_icon" mode=""></image>
-				<view class="flex m-l20">
-					<view class="row-justify-sb center flex">
-						<text class="text-color-333 sys-weight-600">{{item.product_name}}</text>
-						<view class="row-c line-40">
-							<text class="size-26 text-color-333">{{item.name}}</text>
-							<image class="wh-30 m-l16" src="/static/img/task/task-phone.png" mode=""></image>
+				<view class="main_string" :style="{background:lineColor[0]}"></view>
+				<view class="row-c flex p-30">
+					<image class="wh-80" :src="item.product_icon" mode=""></image>
+					<view class="flex m-l20">
+						<view class="row-justify-sb center flex">
+							<text class="text-color-333 sys-weight-600">{{item.product_name}}</text>
+							<view class="row-c line-40">
+								<text class="size-26 text-color-333">{{item.name}}</text>
+								<image class="wh-30 m-l16" src="/static/img/task/task-phone.png" mode=""></image>
+							</view>
 						</view>
-					</view>
-					<view
-						class="p-tb14 p-lr30 m-tb20 r-100 row-justify-sb center size-24 text-color-12 sys-from-background-color"
-						style="line-height: 40rpx;">
-						<text class="size-28 text-color-E21 sys-weight-600">{{item.quota}}万</text>
-						<text>{{item.stage_name}}</text>
-						<text>{{item.use_date}}用款</text>
-					</view>
-					<view class="row-justify-sb center" style="line-height: 40rpx;">
-						<text class="size-24 text-color-999 flex">{{item.created_date}}</text>
-						<image style="width: 65rpx;height: 32rpx;" :src="getIconStatus(iconStatus)" v-if="type === 1">
-						</image>
-						<button class="button-background en_button sys-weight-500 text-color-fff size-28 r-100"
-							style="width: 200rpx;height: 70rpx;line-height: 70rpx;" type="default"
-							hover-class="is-hover" v-else-if="type === 2">领取任务</button>
-            <button class="button-background en_button sys-weight-500 text-color-fff size-28 r-100"
-                    style="width: 200rpx;height: 70rpx;line-height: 70rpx;" type="default"
-                    hover-class="is-hover" v-else-if="type === 4">去处理</button>
-						<view class="row-c" v-else-if="type === 3">
-							<button
-								class="button-backgroun en_buttond left_button sys-weight-500 button_color-008FD6 size-26 r-100 m-r20"
-								type="default" hover-class="is-hover">核算</button>
-							<button
-								class="button-background en_button left_button right_button sys-weight-500 button_color-008FD6 size-26 r-100"
-								type="default" hover-class="is-hover">客户分类</button>
+						<view
+							class="p-tb14 p-lr30 m-tb20 r-100 row-justify-sb center size-24 text-color-12 sys-from-background-color"
+							style="line-height: 40rpx;">
+							<text class="size-28 text-color-E21 sys-weight-600">{{item.quota}}万</text>
+							<text>{{item.stage_name}}</text>
+							<text>{{item.use_date}}用款</text>
+						</view>
+						<view class="row-justify-sb center" style="line-height: 40rpx;">
+							<text class="size-24 text-color-999 flex">{{item.created_date}}</text>
+							<image style="width: 65rpx;height: 32rpx;" :src="getIconStatus(iconStatus)"
+								v-if="type === 1">
+							</image>
+							<button class="button-background en_button sys-weight-500 text-color-fff size-28 r-100"
+								style="width: 200rpx;height: 70rpx;line-height: 70rpx;" type="default"
+								hover-class="is-hover" v-else-if="type === 2">领取任务</button>
+							<button class="button-background en_button sys-weight-500 text-color-fff size-28 r-100"
+								style="width: 200rpx;height: 70rpx;line-height: 70rpx;" type="default"
+								hover-class="is-hover" v-else-if="type === 4">去处理</button>
+							<view class="row-c" v-else-if="type === 3">
+								<button
+									class="button-backgroun en_buttond left_button sys-weight-500 button_color-008FD6 size-26 r-100 m-r20"
+									type="default" hover-class="is-hover">核算</button>
+								<button
+									class="button-background en_button left_button right_button sys-weight-500 button_color-008FD6 size-26 r-100"
+									type="default" hover-class="is-hover">客户分类</button>
+							</view>
 						</view>
 					</view>
 				</view>
@@ -85,7 +89,8 @@
 		data() {
 			return {
 				leftImg: ['task-house', 'task-business', 'task-repayment'],
-				iconList: ['task-audit', 'task-do', 'task-stay']
+				iconList: ['task-audit', 'task-do', 'task-stay'],
+				lineColor: ['#DE5847', '#EF8F27', '#0FB160']
 			}
 		},
 		methods: {
@@ -131,6 +136,13 @@
 		height: 40rpx;
 	}
 
+	.main_string {
+		width: 6rpx;
+		height: 60rpx;
+		border-radius: 100rpx;
+		background: red;
+	}
+
 	button::after {
 		border: none;
 	}

components/en-utils/en-nav/en-nav.vue

@@ -1,5 +1,5 @@
 <template>
-	<view :class="is_fixed?getBg(type):''">
+	<view class="top-nav-bg" :style="{'background-image':`url(${bgList[genre].bg_path})`}">
 		<view class="header" style="z-index: 3;" :style="[{color},{height},{paddingTop},{justifyContent:justify}]">
 			<view class="left" :style="[{color},{paddingTop}]" v-if="back" @click="onBack">
 				<image class="back" src="/static/img/tabBar/nav-back.png"></image>
@@ -16,8 +16,9 @@
 		<!-- 带背景插槽 end-->
 		<image class="header" style="width: 100%;z-index: 2;"
 			:style="[{height:is_fixed?`${$tools.topHeight()+navsHeight}px` :`${$tools.topHeight()+fixedHeight}px`},{opacity:is_fixed?navOpacity:1},]"
-			:src="genre == 0?'/static/img/index/top-nav.png':'/static/img/enNav/tab.png'" mode="">
+			:src="bgList[genre].nav_path" mode="">
 		</image>
+		<!-- :src="genre == 0?'/static/img/index/top-nav.png':'/static/img/enNav/tab.png'" mode=""> -->
 	</view>
 </template>
 
@@ -36,6 +37,19 @@
 				paddingTop: 0,
 				navOpacity: 0,
 				navHeight: 0,
+				bgList: [{
+					bg_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/index/index-bg.png?imageMogr2/quality/20',
+					nav_path: '/static/img/index/top-nav.png '
+				}, {
+					bg_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-nav-bg.png',
+					nav_path: '/static/img/enNav/tab.png'
+				}, {
+					bg_path: '',
+					nav_path: ''
+				}, {
+					bg_path: '',
+					nav_path: ''
+				}],
 			}
 		},
 		props: {
@@ -115,7 +129,7 @@
 				uni.navigateBack()
 				this.$emit('onBack')
 			},
-			getBg(type) {
+			getTopBg(type) {
 				switch (type) {
 					case 0:
 						return 'nav-bg1'
@@ -165,9 +179,12 @@
 		}
 	}
 
-	.nav-bg1 {
-		background-image: url("https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/index/index-bg.png?imageMogr2/quality/20");
+	.top-nav-bg {
 		background-repeat: no-repeat;
 		background-size: 100% auto;
 	}
+
+	.nav-bg2 {
+		background-image: url("https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/index/index-bg.png?imageMogr2/quality/20");
+	}
 </style>

page_subpack/message/message.vue

@@ -8,18 +8,20 @@
 		</view>
 		<EnScroll ref="scroll" class="main" @onRefresh="onRefresh" @onScrollBottom="onScrollBottom">
 			<view class="m-t20" v-if="list.length <=0">
-				<Enblank :message="'暂无消息'" >
+				<Enblank :message="'暂无消息'">
 				</Enblank>
 			</view>
 			<view class="m-lr20 page-env-160">
-				<view class="row-c page-box-bg-fff m-t20 r-30 p-30 box-shadow-197" @click.stop="goToInfo(index)" v-for="(item,index) in list"
-					:key="index">
-					<image class="wh-80" :src="getLeftImg(item.type)" mode=""></image>
+				<view class="row-c page-box-bg-fff m-t20 r-30 p-30 box-shadow-197" @click.stop="goToInfo(index)"
+					v-for="(item,index) in list" :key="index">
+					<view class="icon-box">
+						<view class="read-dot" v-if="item.is_read === 0"></view>
+						<image class="wh-80" :src="getLeftImg(item.type)" mode=""></image>
+					</view>
 					<view class="flex m-l20">
 						<view class="row-justify-sb center flex">
 							<text class="text-color-333 sys-weight-400 size-30"> {{item.title}}</text>
-							<image class="wh-30 m-l16" style="margin-top: 4rpx;" src="/static/img/task/task-phone.png"
-								mode=""></image>
+							<uni-icons type="right" size="18" color="#999999"></uni-icons>
 						</view>
 						<view class="row-justify-sb center m-t10">
 							<text class="size-26 text-color-666"> {{item.content}}</text>
@@ -28,7 +30,6 @@
 					</view>
 				</view>
 			</view>
-			<!-- <view class="placeholder sys-list-background-color" style="height: 60rpx;" v-if="is_bottom"></view> -->
 		</EnScroll>
 
 	</view>
@@ -36,8 +37,11 @@
 <script>
 	// 任务列表
 	import TaskItem from "@/common/task/task-item.vue";
-  import {getNotices, setRead} from "@/api/news";
-  import tools from "@/service/tools";
+	import {
+		getNotices,
+		setRead
+	} from "@/api/news";
+	import tools from "@/service/tools";
 
 	export default {
 		components: {
@@ -48,114 +52,116 @@
 				current: 0,
 				tabsList: [{
 					name: '全部(0)',
-					// 可以禁用某个item
-					is_dot: false,
+					is_dot: true,
 					dot_color: 'red',
 					disabled: false
 				}, {
 					name: '未读(0)',
-					// 可以禁用某个item
 					is_dot: true,
 					dot_color: 'red',
 					disabled: false
 				}, {
 					name: '已读',
-					// 可以禁用某个item
 					is_dot: false,
 					dot_color: '',
 					disabled: false
 				}],
-				leftImg: ['task-house', 'task-house','task-business', 'task-repayment'],
+				leftImg: ['task-house', 'task-house', 'task-business', 'task-repayment'],
 				iconList: ['task-audit', 'task-do', 'task-stay'],
-        list:[],
-        page:1,
-        isEnd:false,
+				list: [],
+				page: 1,
+				isEnd: false,
 			}
 		},
 		watch: {
 
 
 		},
-    mounted() {
-      this.startNotices();
-    },
+		mounted() {
+			this.startNotices();
+		},
 		methods: {
-      goToInfo(index) {
+			goToInfo(index) {
 
-        let item=this.list[index];
-        if(item.type===1){
-          this.list[index].is_read=1;
-          //跳转详情
-          uni.navigateTo({
-            url: 'pages/notice/module/notice-info?id='+item.id
-          });
-        }else {
-          this.setRead(index);
-          //调用已读
-          if(item.type===2){
-            if(item.relevance_id<=0){
-              tools.error('任务信息异常')
-              return false;
-            }
-            //任务详情
-            uni.navigateTo({
-              url: '/page_task/task_details/task_details?id='+item.relevance_id
-            });
-          }else {
-            //领取列表
-            uni.navigateTo({
-              url: '/page_task/gain_task/gain_task'
-            });
-          }
-        }
+				let item = this.list[index];
+				if (item.type === 1) {
+					this.list[index].is_read = 1;
+					//跳转详情
+					uni.navigateTo({
+						url: 'pages/notice/module/notice-info?id=' + item.id
+					});
+				} else {
+					this.setRead(index);
+					//调用已读
+					if (item.type === 2) {
+						if (item.relevance_id <= 0) {
+							tools.error('任务信息异常')
+							return false;
+						}
+						//任务详情
+						uni.navigateTo({
+							url: '/page_task/task_details/task_details?id=' + item.relevance_id
+						});
+					} else {
+						//领取列表
+						uni.navigateTo({
+							url: '/page_task/gain_task/gain_task'
+						});
+					}
+				}
 
-      },
-      setRead(index){
-        setRead({'id':this.list[index].id}).then((res)=>{
-          if(res.code===1){
-            this.list[index].is_read=1;
-          }
-        })
-      },
-      startNotices(){
-        this.list=[];
-        this.page=1;
-        this.isEnd=false;
-        this.getNotices();
-      },
-      getNotices(){
-        if(this.isEnd){
-          return ;
-        }
-        getNotices({'page':this.page,'type':this.current}).then((res)=>{
-          if(res.code===1){
-            if(res.data.items.length<=0){
-              this.isEnd=true;
-            }else {
-              this.tabsList[0].name='全部（'+res.data.total+')'
-              this.tabsList[1].name='未读（'+res.data.unreadNum+')'
-              res.data.items.forEach((item)=>{
-                item.is_del=false;
-                this.list.push(item)
-              })
-              // this.list.push(...res.data)
-            }
-            ++this.page;
-          }
-        })
-      },
+			},
+			setRead(index) {
+				setRead({
+					'id': this.list[index].id
+				}).then((res) => {
+					if (res.code === 1) {
+						this.list[index].is_read = 1;
+					}
+				})
+			},
+			startNotices() {
+				this.list = [];
+				this.page = 1;
+				this.isEnd = false;
+				this.getNotices();
+			},
+			getNotices() {
+				if (this.isEnd) {
+					return;
+				}
+				getNotices({
+					'page': this.page,
+					'type': this.current
+				}).then((res) => {
+					if (res.code === 1) {
+						if (res.data.items.length <= 0) {
+							this.isEnd = true;
+						} else {
+							this.tabsList[0].name = '全部（' + res.data.total + ')'
+							this.tabsList[1].name = '未读（' + res.data.unreadNum + ')'
+							res.data.items.forEach((item) => {
+								item.is_del = false;
+								this.list.push(item)
+							})
+							// this.list.push(...res.data)
+						}
+						++this.page;
+					}
+				})
+			},
 			tabsChange(index) {
 				this.current = index;
 			},
 			getLeftImg(index) {
-        return `/static/img/task/${this.leftImg[index]}.png`
+				return `/static/img/task/${this.leftImg[index]}.png`
 			},
 			// 下拉刷新
 			onRefresh() {
 				uni.showLoading({
 					title: '数据加载中'
 				})
-        this.startNotices()
+				this.startNotices()
 				setTimeout(() => {
 					// uni.showToast({
 					// 	title: '加载完成',
@@ -170,7 +176,7 @@
 				uni.showLoading({
 					title: '数据加载中'
 				})
-        this.getNotices()
+				this.getNotices()
 				setTimeout(() => {
 					uni.showToast({
 						title: '加载完成',
@@ -183,5 +189,17 @@
 	}
 </script>
 <style lang="scss" scoped>
+	.icon-box {
+		position: relative;
 
+		.read-dot {
+			width: 14rpx;
+			height: 14rpx;
+			border-radius: 50%;
+			background-color: #E91919;
+			position: absolute;
+			top: 0rpx;
+			right: 10rpx;
+		}
+	}
 </style>

page_task/task_details/task_details.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="total-page page-env-20 page-box">
 		<Nav :title="'任务详情'" :genre="1" :fixedHeight="fixedHeight">
-			<view class="task-tabs m-b20" style="z-index: 3;" :style=" {top:`${$tools.topHeight()}px`}">
+			<view class="task-tabs m-b20" style="z-index: 9999;" :style=" {top:`${$tools.topHeight()}px`}">
 				<view class="detail-bg m-lr20 m-b10 m-t10">
 					<image class="detail-img" src="/static/img/task-details/top-bg.png" mode="aspectFill"></image>
 					<view class="detail-content">

pages/statistics/components/capital_stat.vue

@@ -0,0 +1,39 @@
+<template>
+	<view class="">
+		<StatSingleData :is_fixed="is_tabs_fixed"></StatSingleData>
+		<StatLoanChart :genre="1" :leftText="'放款汇总占比'"></StatLoanChart>
+		<StatLoanChart :genre="2" :leftText="'回款汇总占比'"></StatLoanChart>
+		<StatRanking is_group :leftText="'汇总明细'"></StatRanking>
+		<view class="sys-background-fff r-30">
+			<StatCapital :leftColor="0" :rightColor="1" :leftText="'任务资金汇总'">
+			</StatCapital>
+			<view class="view_line"></view>
+			<StatRanking :is_margin_top="false" :leftText="'个人业绩排行'"></StatRanking>
+		</view>
+		<StatSituation :type="1"></StatSituation>
+	</view>
+</template>
+
+<script>
+	import StatLoanChart from "../module/stat_loan_chart.vue"
+	import StatRanking from "../module/stat_ranking.vue"
+	import StatCapital from "../module/stat_capital.vue"
+	import StatSituation from "../module/stat_situation.vue"
+
+	export default {
+		components: {
+			StatLoanChart,
+			StatRanking,
+			StatCapital,
+			StatSituation
+		},
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

pages/statistics/components/consume_stat.vue

@@ -0,0 +1,31 @@
+<template>
+	<view class="">
+		<StatLoanChart :genre="3" :leftText="'消金汇总占比'"></StatLoanChart>
+		<StatRanking :genre="3" :leftText="'消金汇总明细'"></StatRanking>
+		<StatRanking :genre="3" :is_type='2' :leftText="'个人业绩排行'"></StatRanking>
+		<StatSituation :type="1" :genre="3" :leftText="'情况说明'"></StatSituation>
+	</view>
+</template>
+
+<script>
+	import StatLoanChart from "../module/stat_loan_chart.vue"
+	import StatRanking from "../module/stat_situation.vue"
+	import StatSituation from "../module/stat_ranking.vue"
+	import StatSingleData from "../module/stat_single_data.vue"
+
+	export default {
+		components: {
+			StatLoanChart,
+			StatRanking,
+			StatSituation,
+		},
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

pages/statistics/components/drawings_stat.vue

@@ -0,0 +1,30 @@
+<template>
+	<view class="">
+		<StatLoanChart :genre="1" :leftText="'提放汇总占比'"></StatLoanChart>
+		<StatRanking :leftText="'提放汇总明细'"></StatRanking>
+		<StatRanking :is_type='2' :leftText="'个人业绩排行'"></StatRanking>
+		<StatSituation :type="1" :leftText="'情况说明'"></StatSituation>
+	</view>
+</template>
+
+<script>
+	import StatLoanChart from "../module/stat_loan_chart.vue"
+	import StatRanking from "../module/stat_situation.vue"
+	import StatSituation from "../module/stat_ranking.vue"
+
+	export default {
+		components: {
+			StatLoanChart,
+			StatRanking,
+			StatSituation,
+		},
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

pages/statistics/components/general_stat.vue

@@ -0,0 +1,38 @@
+<template>
+	<view class="">
+		<StatLoanChart :genre="1" :leftText="'放款汇总占比'"></StatLoanChart>
+		<StatLoanChart :genre="2" :leftText="'回款汇总占比'"></StatLoanChart>
+		<StatRanking is_group :leftText="'汇总明细'"></StatRanking>
+		<view class="sys-background-fff r-30">
+			<StatCapital :leftColor="0" :rightColor="1" :leftText="'任务资金汇总'">
+			</StatCapital>
+			<view class="view_line"></view>
+			<StatRanking :is_margin_top="false" :is_type="2" :leftText="'个人业绩排行'"></StatRanking>
+		</view>
+		<StatSituation :type="1"></StatSituation>
+	</view>
+</template>
+
+<script>
+	import StatLoanChart from "../module/stat_loan_chart.vue"
+	import StatRanking from "../module/stat_ranking.vue"
+	import StatCapital from "../module/stat_capital.vue"
+	import StatSituation from "../module/stat_situation.vue"
+
+	export default {
+		components: {
+			StatLoanChart,
+			StatRanking,
+			StatCapital,
+			StatSituation
+		},
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

pages/statistics/components/performance_stat.vue

@@ -0,0 +1,26 @@
+<template>
+	<view class="">
+		<StatLoanChart :leftText="'任务汇总占比'"></StatLoanChart>
+		<StatRanking :is_type="3" :leftText="'放款汇总明细'"></StatRanking>
+	</view>
+</template>
+
+<script>
+	import StatLoanChart from "../module/stat_loan_chart.vue"
+	import StatRanking from "../module/stat_ranking.vue"
+
+	export default {
+		components: {
+			StatLoanChart,
+			StatRanking,
+		},
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

pages/statistics/components/task_stat.vue

@@ -0,0 +1,26 @@
+<template>
+	<view class="">
+		<StatLoanChart :leftText="'任务汇总占比'"></StatLoanChart>
+		<StatRanking :is_type="3" :leftText="'任务明细'"></StatRanking>
+	</view>
+</template>
+
+<script>
+	import StatLoanChart from "../module/stat_loan_chart.vue"
+	import StatRanking from "../module/stat_ranking.vue"
+
+	export default {
+		components: {
+			StatLoanChart,
+			StatRanking
+		},
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

common/statistics/stat_age_chart.vue → pages/statistics/module/stat_age_chart.vue

@@ -1,6 +1,7 @@
 <template>
 	<view class="page-box-bg-fff m-t20 r-30 p-30">
-		<StatisticsTitle :is_right="false" is_age :genre="0" :leftText="'年龄分部'" :rightText="'同比环比'" @onHandle="onHandle">
+		<StatisticsTitle :is_right="false" is_age :genre="0" :leftText="'年龄分部'" :rightText="'同比环比'"
+			@onHandle="onHandle">
 		</StatisticsTitle>
 		<view class="column-c m-30 r-30 p-l16">
 			<PeakChart></PeakChart>
@@ -10,7 +11,7 @@
 
 <script>
 	import PeakChart from "@/common/chart/peak_chart.vue";
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
+	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'stat_age_chart',

common/statistics/stat_capital.vue → pages/statistics/module/stat_capital.vue

@@ -1,7 +1,8 @@
 <template>
 	<view class="page-box-bg-fff m-t20 r-30 p-30">
 		<!-- 标题插槽 -->
-		<StatisticsTitle :genre="genre" :leftText="leftText" :rightText="rightText" @onHandle="onHandle"></StatisticsTitle>
+		<StatisticsTitle :genre="genre" :leftText="leftText" :rightText="rightText" @onHandle="onHandle">
+		</StatisticsTitle>
 		<view class="row-justify-sb center p-lr20">
 			<view class="capital_item">
 				<view class="row-c flex">
@@ -12,7 +13,8 @@
 					<text class="size-32 text-color-081">50</text>
 					<text class="size-28 text-color-081">万</text>
 				</view>
-				<text class="size-28 text-color-00B sys-weight-600 m-l20" :style="{color:bgColor[leftColor]}">29.4%</text>
+				<text class="size-28 text-color-00B sys-weight-600 m-l20"
+					:style="{color:bgColor[leftColor]}">29.4%</text>
 			</view>
 			<view class="chart_item column-c m-lr20">
 				<CircleChart :bgColor="'#2B7DFA'"></CircleChart>
@@ -26,7 +28,8 @@
 					<text class="size-32 text-color-081">50</text>
 					<text class="size-28 text-color-081">万</text>
 				</view>
-				<text class="size-28 text-color-00B sys-weight-600 m-l20" :style="{color:bgColor[rightColor]}">29.4%</text>
+				<text class="size-28 text-color-00B sys-weight-600 m-l20"
+					:style="{color:bgColor[rightColor]}">29.4%</text>
 			</view>
 		</view>
 	</view>
@@ -34,8 +37,8 @@
 
 <script>
 	import CircleChart from "@/common/chart/circle_chart.vue";
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue"
-	
+	import StatisticsTitle from "./statistics_title.vue";
+
 	export default {
 		name: 'capital_chart',
 		components: {
@@ -43,7 +46,7 @@
 			StatisticsTitle
 		},
 		props: {
-			genre:{
+			genre: {
 				type: Number,
 				default: 0
 			},
@@ -59,7 +62,7 @@
 				type: Number,
 				default: 0
 			},
-			rightColor:{
+			rightColor: {
 				type: Number,
 				default: 0
 			}
@@ -73,7 +76,7 @@
 </script>
 
 <style lang="scss" scoped>
-	.capital_item{
+	.capital_item {
 		width: 200rpx;
 		text-align: left;
 	}

common/statistics/stat_finance.vue → pages/statistics/module/stat_finance.vue

@@ -3,9 +3,9 @@
 		<StatisticsTitle :genre="0" :leftText="'财务汇总明细'" :rightText="'全部'" @onHandle="onHandle"></StatisticsTitle>
 		<view class="row-justify-c m-b25">
 			<view class="subsection">
-				<uv-subsection :list="list" :bgColor="'#DBE8DB'":activeColor="'#0FB160'" :inactiveColor="'#121212'" :fontSize="14"
-					custom-style="height: 70rpx;border-radius: 30rpx;" custom-item-style="border-radius: 30rpx;"
-					:current="current" @change="onChange"></uv-subsection>
+				<uv-subsection :list="list" :bgColor="'#DBE8DB'" :activeColor="'#0FB160'" :inactiveColor="'#121212'"
+					:fontSize="14" custom-style="height: 70rpx;border-radius: 30rpx;"
+					custom-item-style="border-radius: 30rpx;" :current="current" @change="onChange"></uv-subsection>
 			</view>
 		</view>
 		<view class="">
@@ -25,7 +25,7 @@
 </template>
 
 <script>
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
+	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'peak_chart',

common/statistics/stat_finance_chart.vue → pages/statistics/module/stat_finance_chart.vue

@@ -17,7 +17,7 @@
 
 <script>
 	import CircleChart from "@/common/chart/circle_chart.vue";
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
+	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'content_chart',

common/statistics/stat_industry.vue → pages/statistics/module/stat_industry.vue

@@ -24,7 +24,7 @@
 
 <script>
 	import CircleChart from "@/common/chart/circle_chart.vue";
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
+	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'stat_industry',
@@ -46,7 +46,7 @@
 				}, ]
 			};
 		},
-		methods:{
+		methods: {
 			onChange(e) {
 				this.current = e
 			}

common/statistics/stat_loan_chart.vue → pages/statistics/module/stat_loan_chart.vue

@@ -9,8 +9,8 @@
 
 <script>
 	import PeakChart from "@/common/chart/peak_chart.vue";
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
-	
+	import StatisticsTitle from "./statistics_title.vue";
+
 	export default {
 		name: 'peak_chart',
 		components: {
@@ -41,7 +41,7 @@
 
 	// 	.chart_item {
 	// 		width: 330rpx;
-			
+
 	// 		.num {
 	// 			width: 140rpx;
 	// 			height: 50rpx;

common/statistics/stat_ranking.vue → pages/statistics/module/stat_ranking.vue

@@ -7,7 +7,9 @@
 				:key="index">
 				<view class="row-justify-sb center sys-weight-400 size-28 color-000 r-20">
 					<view class="row-c line-40">
-						<image class="wh-30 m-r20" src="/static/img/task/task-phone.png" mode=""></image>
+						<image class="wh-36 m-r20" :src="`/static/img/statistics/${iconList[index]}.png`"
+							mode="aspectFill">
+						</image>
 						<text>综合业务部一部</text>
 					</view>
 					<text>34笔</text>
@@ -22,7 +24,9 @@
 			<view class="ranking_item sys-from-background-color m-b16 r-20 p-20 row-justify-sb center"
 				v-for="(item,index) in 3" :key="index">
 				<view class="row-c sys-weight-400">
-					<image class="wh-30 m-r20" src="/static/img/task/task-phone.png" mode=""></image>
+					<image class="wh-36 m-r20" :src="`/static/img/statistics/${userIconList[index]}.png`"
+						mode="aspectFill">
+					</image>
 					<image class="wh-60" src="/static/img/index/index-avatar.png" mode=""></image>
 					<view class="column m-l16">
 						<text class="size-28 text-color-000 p-b10">张三</text>
@@ -34,19 +38,24 @@
 		</view>
 		<view v-if="is_type == 3">
 			<view class="ranking_item sys-from-background-color m-b16 r-20 p-20 row-justify-sb center"
-				v-for="(item,index) in 3" :key="index">
+				v-for="(item,index) in 4" :key="index">
 				<view class="row-c sys-weight-400">
-					<image class="wh-60 m-r30" src="/static/img/index/index-avatar.png" mode=""></image>
+					<image class="wh-60 m-r30" :src="`/static/img/statistics/${taskIconLsit[index]}.png`"
+						mode="aspectFill">
+					</image>
 					<text class="size-28 text-color-000 p-b10">房抵业务</text>
 				</view>
-				<text class="size-28 color-000 sys-weight-600">200万</text>
+				<view class="row-c">
+					<text class="size-28 color-000 sys-weight-600 m-r10">200万</text>
+					<uni-icons type="forward" size="16" color="#8F99B1"></uni-icons>
+				</view>
 			</view>
 		</view>
 	</view>
 </template>
 
 <script>
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
+	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'stat_ranking',
@@ -77,7 +86,9 @@
 		},
 		data() {
 			return {
-
+				iconList: ['champion', 'runner-up', 'third'],
+				userIconList: ['one', 'two', 'three'],
+				taskIconLsit: ['task-one', 'task-two', 'task-three', 'task-four']
 			};
 		}
 	}

common/statistics/stat_situation.vue → pages/statistics/module/stat_situation.vue

@@ -46,7 +46,7 @@
 
 <script>
 	import PeakChart from "@/common/chart/peak_chart.vue";
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue";
+	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'stat_situation',

pages/statistics/statistics.vue

@@ -4,21 +4,18 @@
 			:navsHeight="navsHeight" :opacity="scrollTop" :justify="'left'" :color="'#fff'" :fixedHeight="160">
 			<view class="task-tabs m-t20" :style="{top:`${$tools.topHeight()}px`}">
 				<HeadFilter @onTopSelect="onTopSelect" :user-status-list="userStatusList"></HeadFilter>
-				<view class="m-lr30 m-tb30 bor-255 r-100" v-if="statType === 7">
+				<view class="m-lr30 m-tb30 bor-255 r-100" v-if="statType === 3">
 					<uv-subsection :list="list" :bgColor="'rgba(255,255,255,0.1)'" :activeColor="'#0FB160'"
 						:inactiveColor="'#004615'" :fontSize="14" custom-style="height: 70rpx;border-radius: 30rpx;"
 						custom-item-style="border-radius: 30rpx;" :current="current" @change="onChange"></uv-subsection>
 				</view>
 			</view>
 		</Nav>
-		<!-- <view class="m-t30 stat_blank" style="z-index: 999999999;" :style="{minHeight:`calc(100% - ${$tools.topHeight()}px)`}">
-				内容
-			</view> -->
 		<view class="statistics_content" :style="[{top:`${$tools.topHeight() + positionHeight}px`}]">
 
 			<view class="">
-				<HeadData v-if="statType === 3"></HeadData>
-				<view class="tabs page-box-bg-fff m-lr30 r-30" v-if="statType ===7"
+				<HeadData v-if="statType === 0 || statType === 1"></HeadData>
+				<view class="tabs page-box-bg-fff m-lr30 r-30" v-if="statType === 2 || statType === 3"
 					:style="[{position:is_fixed?'absolute':''},{top:`${$tools.topHeight() + 85}px`}]"
 					style="height: 100rpx;">
 					<z-tabs ref="tabs" :list="tabsList"
@@ -30,53 +27,17 @@
 				<StatSingleData :is_fixed="is_tabs_fixed" v-if="is_single_data"></StatSingleData>
 				<view class="sys-list-background-color p-lr30">
 					<!-- 汇总统计-公司 -->
-					<view v-if="statType === 3">
-						<StatFinanceChart></StatFinanceChart>
-						<StatFinance></StatFinance>
-						<StatCapital :leftColor="0" :rightColor="1" :leftText="'任务资金汇总'">
-						</StatCapital>
-						<StatCapital :leftColor="1" :rightColor="2" :leftText="'在途资金汇总'">
-						</StatCapital>
-						<StatIndustry></StatIndustry>
-						<StatAgeChart></StatAgeChart>
-					</view>
+					<GeneralStat v-if="statType === 0"></GeneralStat>
 					<!-- 资金统计-部门 -->
-					<view v-if="statType === 4">
-						<StatLoanChart :genre="1" :leftText="'放款汇总占比'"></StatLoanChart>
-						<StatLoanChart :genre="2" :leftText="'回款汇总占比'"></StatLoanChart>
-						<StatRanking is_group :leftText="'汇总明细'"></StatRanking>
-						<view class="sys-background-fff r-30">
-							<StatCapital :leftColor="0" :rightColor="1" :leftText="'任务资金汇总'">
-							</StatCapital>
-							<view class="view_line"></view>
-							<StatRanking :is_margin_top="false" :leftText="'个人业绩排行'"></StatRanking>
-						</view>
-						<StatSituation :type="1"></StatSituation>
-					</view>
+					<CapitalStat v-if="statType === 1"></CapitalStat>
 					<!-- 提放统计-部门 -->
-					<view class="" v-if="statType === 6">
-						<StatLoanChart :genre="1" :leftText="'提放汇总占比'"></StatLoanChart>
-						<StatRanking :leftText="'提放汇总明细'"></StatRanking>
-						<StatRanking :is_type='2' :leftText="'个人业绩排行'"></StatRanking>
-						<StatSituation :type="1" :leftText="'情况说明'"></StatSituation>
-					</view>
+					<DrawingsStat v-if="statType === 2"></DrawingsStat>
 					<!-- 消金统计-部门 -->
-					<view class="" v-if="statType === 7">
-						<StatLoanChart :genre="3" :leftText="'消金汇总占比'"></StatLoanChart>
-						<StatRanking :genre="3" :leftText="'消金汇总明细'"></StatRanking>
-						<StatRanking :genre="3" :is_type='2' :leftText="'个人业绩排行'"></StatRanking>
-						<StatSituation :type="1" :genre="3" :leftText="'情况说明'"></StatSituation>
-					</view>
+					<ConsumeStat v-if="statType === 3"></ConsumeStat>
 					<!-- 任务统计-个人 -->
-					<view class="" v-if="statType === 1">
-						<StatLoanChart :leftText="'任务汇总占比'"></StatLoanChart>
-						<StatRanking :is_type="3" :leftText="'任务明细'"></StatRanking>
-					</view>
+					<TaskStat v-if="statType === 4"></TaskStat>
 					<!-- 业绩统计-个人 -->
-					<view class="" v-if="statType === 2">
-						<StatLoanChart :leftText="'任务汇总占比'"></StatLoanChart>
-						<StatRanking :is_type="1" :leftText="'放款汇总明细'"></StatRanking>
-					</view>
+					<PerformanceStat v-if="statType === 5"></PerformanceStat>
 					<view class="bottom_view"></view>
 				</view>
 			</view>
@@ -85,45 +46,53 @@
 	</view>
 
 </template>
+
+<!-- 
+财务汇总占比 stat_finance_chart
+放款汇总占比 stat_loan_chart
+财务汇总明细 stat_finance
+任务资金汇总 stat_capital
+行业占比 stat_industry
+年龄分布 stat_age_chart
+情况说明 stat_situation
+排名 stat_rankin
+-->
+
 <script>
-	import HeadFilter from "@/common/statistics/head_filter.vue"
-	import HeadData from "@/common/statistics/head_data.vue"
+	// 顶部筛选
+	import HeadFilter from "./module/head_filter.vue"
+	// 顶部左右统计数据
+	import HeadData from "./module/head_data.vue"
 	// 顶部单统计数据
-	import StatSingleData from "@/common/statistics/stat_single_data.vue"
-	// 模块标题
-	import StatisticsTitle from "@/common/statistics/statistics_title.vue"
-	// 财务汇总占比
-	import StatFinanceChart from "@/common/statistics/stat_finance_chart.vue"
-	// 放款汇总占比
-	import StatLoanChart from "@/common/statistics/stat_loan_chart.vue"
-	// 财务汇总明细
-	import StatFinance from "@/common/statistics/stat_finance.vue"
-	// 任务资金汇总
-	import StatCapital from "@/common/statistics/stat_capital.vue"
-	// 行业占比
-	import StatIndustry from "@/common/statistics/stat_industry.vue"
-	// 年龄分布
-	import StatAgeChart from "@/common/statistics/stat_age_chart.vue"
-	// 情况说明
-	import StatSituation from "@/common/statistics/stat_situation.vue"
-	// 排名
-	import StatRanking from "@/common/statistics/stat_ranking.vue"
-  import {getUserType} from "@/api/statistics";
+	import StatSingleData from "./module/stat_single_data.vue"
+	// 汇总统计
+	import GeneralStat from "./components/general_stat.vue"
+	// 资金统计
+	import CapitalStat from "./components/capital_stat.vue"
+	// 提放统计
+	import DrawingsStat from "./components/drawings_stat.vue"
+	// 消金统计
+	import ConsumeStat from "./components/consume_stat.vue"
+	// 任务统计
+	import TaskStat from "./components/task_stat.vue"
+	// 业绩统计
+	import PerformanceStat from "./components/performance_stat.vue"
+
+	import {
+		getUserType
+	} from "@/api/statistics";
 
 	export default {
 		components: {
 			HeadFilter,
 			HeadData,
 			StatSingleData,
-			StatFinanceChart,
-			StatFinance,
-			StatCapital,
-			StatLoanChart,
-			StatisticsTitle,
-			StatIndustry,
-			StatAgeChart,
-			StatSituation,
-			StatRanking
+			CapitalStat,
+			GeneralStat,
+			ConsumeStat,
+			DrawingsStat,
+			PerformanceStat,
+			TaskStat
 		},
 		data() {
 			return {
@@ -145,7 +114,7 @@
 				navsHeight: 65,
 				positionHeight: 50,
 				list: ['中银消费', '中邮消费', '新网车抵'],
-        userStatusList:[]
+				userStatusList: []
 			}
 		},
 		onLoad() {
@@ -155,7 +124,7 @@
 			this.scrollTop = res.scrollTop / 120
 		},
 		mounted() {
-      this.getUserType()
+			// this.getUserType()
 		},
 
 		computed: {
@@ -174,15 +143,15 @@
 			// },
 		},
 		methods: {
-      getUserType(){
-        getUserType().then((res)=>{
-          if(res.code===1){
-            this.userStatusList=res.data
-            this.statType=this.userStatusList[0].id
-            console.log(this.statType)
-          }
-        })
-      },
+			getUserType() {
+				getUserType().then((res) => {
+					if (res.code === 1) {
+						this.userStatusList = res.data
+						this.statType = this.userStatusList[0].id
+						console.log(this.statType)
+					}
+				})
+			},
 			onChange(e) {
 				this.current = e
 			},

static/css/common.css

@@ -647,6 +647,12 @@
 	display: block;
 }
 
+.wh-36 {
+	width: 36rpx;
+	height: 36rpx;
+	display: block;
+}
+
 .wh-45 {
 	width: 45rpx;
 	height: 45rpx;