瀏覽代碼

style:任务详情页面优化、审核进度组件

443166679@qq.com 1 年之前
父節點
當前提交
629b8ef446

+ 113 - 118
common/chart/circle_chart.vue

@@ -1,128 +1,123 @@
 <template>
-  <view class="charts-box" :style="[{width},{height},]">
-    <qiun-data-charts 
-	  :canvas2d='isCanvas2d'
-	  :canvasId='canvasId'
-      type="arcbar"
-      :opts="opts"
-      :chartData="chartData"
-    />
+	<view class="charts-box" :style="[{width},{height},]">
+		<qiun-data-charts :canvas2d='isCanvas2d' :canvasId='canvasId' type="arcbar" :opts="opts"
+			:chartData="chartData" />
 
-  </view>
+	</view>
 </template>
 
 <script>
-export default {
-  props:{
-	width: {
-		type: String,
-		default: '140rpx'
-	},
-	height: {
-		type: String,
-		default: '140rpx'
-	},
-	canvasId: {
-		type: String,
-		default: ''
-	},
-	bgColor: {
-		type: String,
-		default: ''
-	},	
-  },
-  data() {
-    return {
-      bgColor:["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
-      isCanvas2d:process.uniEnv.isCanvas2d,
-      chartData: {},
-      //这里的 opts 是图表类型 type="arcbar" 的全部配置参数,您可以将此配置复制到 config-ucharts.js 文件中下标为 ['arcbar'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。
-      opts: {
-        timing: "easeOut",
-        duration: 1000,
-        rotate: false,
-        rotateLock: false,
-        color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
-        padding: undefined,
-        fontSize: 13,
-        fontColor: "#666666",
-        dataLabel: true,
-        dataPointShape: true,
-        dataPointShapeType: "solid",
-        touchMoveLimit: 60,
-        enableScroll: false,
-        enableMarkLine: false,
-        title: {
-          name: "",
-          fontSize: 25,
-          color: "#00FF00",
-          offsetX: 0,
-          offsetY: 0
-        },
-        subtitle: {
-          name: "0%",
-          fontSize: 15,
-          color: "#666666",
-          offsetX: 0,
-          offsetY: 0
-        },
-        extra: {
-          arcbar: {
-            type: "circle",
-            width: 10,
-            backgroundColor: "#E9E9E9",
-            startAngle: 0.5,
-            endAngle: 0.25,
-            gap: 2,
-            direction: "cw",
-            lineCap: "round",
-            centerX: 0,
-            centerY: 0,
-            linearType: "none"
-          }
-        }
-      }
-    };
-  },
-  onReady() {
-    // this.getServerData();
-  },
-  methods: {
-    getServerData() {
-      //模拟从服务器获取数据时的延时
-      setTimeout(() => {
-        //模拟服务器返回数据,如果数据格式和标准格式不同,需自行按下面的格式拼接
-        let res = {
-            series: [
-              {
-                name:  "0%",
-                // color: this.bgColor,
-                data: 0
-              }
-            ]
-          };
-        this.chartData = JSON.parse(JSON.stringify(res));
-      }, 500);
-    },
-    setServerData(data){
-      console.log('series:'+data)
-      this.opts.subtitle.name=(data*100)+"%"
-      setTimeout(()=>{
-        let res = {
-          series: [
-            {
-              color: this.bgColor,
-              data: data
-            }
-          ]
-        };
-        this.chartData = JSON.parse(JSON.stringify(res));
-      },100)
+	export default {
+		props: {
+			width: {
+				type: String,
+				default: '140rpx'
+			},
+			height: {
+				type: String,
+				default: '140rpx'
+			},
+			canvasId: {
+				type: String,
+				default: ''
+			},
+			bgColor: {
+				type: String,
+				default: ''
+			},
+		},
+		data() {
+			return {
+				bgColor: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
+					"#ea7ccc"
+				],
+				isCanvas2d: process.uniEnv.isCanvas2d,
+				chartData: {},
+				//这里的 opts 是图表类型 type="arcbar" 的全部配置参数,您可以将此配置复制到 config-ucharts.js 文件中下标为 ['arcbar'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。
+				opts: {
+					timing: "easeOut",
+					duration: 1000,
+					rotate: false,
+					rotateLock: false,
+					color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
+						"#ea7ccc"
+					],
+					padding: undefined,
+					fontSize: 13,
+					fontColor: "#666666",
+					dataLabel: true,
+					dataPointShape: true,
+					dataPointShapeType: "solid",
+					touchMoveLimit: 60,
+					enableScroll: false,
+					enableMarkLine: false,
+					title: {
+						name: "",
+						fontSize: 25,
+						color: "#00FF00",
+						offsetX: 0,
+						offsetY: 0
+					},
+					subtitle: {
+						name: "0%",
+						fontSize: 15,
+						color: "#666666",
+						offsetX: 0,
+						offsetY: 0
+					},
+					extra: {
+						arcbar: {
+							type: "circle",
+							width: 10,
+							backgroundColor: "#E9E9E9",
+							startAngle: 0.5,
+							endAngle: 0.25,
+							gap: 2,
+							direction: "cw",
+							lineCap: "round",
+							centerX: 0,
+							centerY: 0,
+							linearType: "none"
+						}
+					}
+				}
+			};
+		},
+		onReady() {
+			// this.getServerData();
+		},
+		methods: {
+			getServerData() {
+				//模拟从服务器获取数据时的延时
+				setTimeout(() => {
+					//模拟服务器返回数据,如果数据格式和标准格式不同,需自行按下面的格式拼接
+					let res = {
+						series: [{
+							name: "0%",
+							// color: this.bgColor,
+							data: 0
+						}]
+					};
+					this.chartData = JSON.parse(JSON.stringify(res));
+				}, 500);
+			},
+			setServerData(data) {
+				console.log('series:' + data)
+				this.opts.subtitle.name = (data * 100) + "%"
+				setTimeout(() => {
+					let res = {
+						series: [{
+							color: this.bgColor,
+							data: data
+						}]
+					};
+					this.chartData = JSON.parse(JSON.stringify(res));
+				}, 100)
 
-    }
+			}
 
-  }
-};
+		}
+	};
 </script>
 
 <style scoped>

+ 2 - 2
common/chart/mixture_chart.vue

@@ -189,14 +189,14 @@
 								name: "金额(男)",
 								index: 1,
 								type: "column",
-                color: "#FFD023",
+								color: "#FFD023",
 								data: data.oneMoney
 							},
 							{
 								name: "金额(女)",
 								index: 2,
 								type: "column",
-                color: "#0CAF60",
+								color: "#0CAF60",
 								data: data.twoMoney
 							},
 							{

+ 133 - 0
common/chart/rose_chart.vue

@@ -0,0 +1,133 @@
+<template>
+	<view class="charts-box">
+		<qiun-data-charts type="rose" :opts="opts" :chartData="chartData" :canvas2d='isCanvas2d' :canvasId='canvasId' />
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				chartData: {},
+				//这里的 opts 是图表类型 type="rose" 的全部配置参数,您可以将此配置复制到 config-ucharts.js 文件中下标为 ['rose'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。
+				opts: {
+					timing: "easeOut",
+					duration: 1000,
+					rotate: false,
+					rotateLock: false,
+					color: ["#2C7DF9", "#00BF8A", "#ED9A2C", "#EE6666", "#73C0DE", "#9A60B4", "#FC8452", "#3CA272",
+						"#ea7ccc"
+					],
+					padding: [5, 5, 5, 5],
+					fontSize: 13,
+					fontColor: "#666666",
+					dataLabel: false,
+					dataPointShape: true,
+					dataPointShapeType: "solid",
+					touchMoveLimit: 60,
+					enableScroll: false,
+					enableMarkLine: false,
+					legend: {
+						show: false,
+						position: "left",
+						lineHeight: 25,
+						float: "center",
+						padding: 5,
+						margin: 5,
+						backgroundColor: "rgba(0,0,0,0)",
+						borderColor: "rgba(0,0,0,0)",
+						borderWidth: 0,
+						fontSize: 13,
+						fontColor: "#666666",
+						hiddenColor: "#CECECE",
+						itemGap: 10
+					},
+					extra: {
+						rose: {
+							type: "area",
+							minRadius: 40,
+							activeOpacity: 0.5,
+							activeRadius: 10,
+							offsetAngle: -180,
+							labelWidth: 15,
+							border: true,
+							borderWidth: 4,
+							borderColor: "#FFFFFF",
+							linearType: "none"
+						},
+						tooltip: {
+							showBox: true,
+							showArrow: true,
+							showCategory: false,
+							borderWidth: 0,
+							borderRadius: 5,
+							borderColor: "#000000",
+							borderOpacity: 0.7,
+							bgColor: "#000000",
+							bgOpacity: 0.7,
+							gridType: "solid",
+							dashLength: 4,
+							gridColor: "#CCCCCC",
+							boxPadding: 3,
+							fontSize: 13,
+							lineHeight: 20,
+							fontColor: "#FFFFFF",
+							legendShow: true,
+							legendShape: "auto",
+							splitLine: true,
+							horizentalLine: false,
+							xAxisLabel: false,
+							yAxisLabel: false,
+							labelBgColor: "#FFFFFF",
+							labelBgOpacity: 0.7,
+							labelFontColor: "#666666"
+						}
+					}
+				}
+			};
+		},
+		onReady() {
+			this.getServerData();
+		},
+		methods: {
+			getServerData() {
+				//模拟从服务器获取数据时的延时
+				setTimeout(() => {
+					//模拟服务器返回数据,如果数据格式和标准格式不同,需自行按下面的格式拼接
+					let res = {
+						series: [{
+							data: [{
+								"name": "一班",
+								"value": 50
+							}, {
+								"name": "二班",
+								"value": 30
+							}, {
+								"name": "三班",
+								"value": 20
+							}, {
+								"name": "四班",
+								"value": 18
+							}, {
+								"name": "五班",
+								"value": 8
+							}, {
+								"name": "五班",
+								"value": 8
+							}]
+						}]
+					};
+					this.chartData = JSON.parse(JSON.stringify(res));
+				}, 500);
+			},
+		}
+	};
+</script>
+
+<style scoped>
+	/* 请根据实际需求修改父元素尺寸,组件自动识别宽高 */
+	.charts-box {
+		width: 220rpx;
+		height: 220rpx;
+	}
+</style>

+ 48 - 0
components/en-utils/en-image/en-image.vue

@@ -0,0 +1,48 @@
+<template>
+	<view>
+		<view class="row">
+			<image class="image-item r-10 m-r20 m-b20" :style="[{width},{height}]" :src="item" mode="aspectFill"
+				v-for="(item,index) in list" @click="onPreviewImage(index)"></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			is_both: {
+				type: Boolean,
+				default: false
+			},
+			width: {
+				type: String,
+				default: '160rpx'
+			},
+			height: {
+				type: String,
+				default: '90rpx'
+			},
+			list: {
+				type: Array,
+				default: () => []
+			}
+		},
+		data() {
+			return {}
+		},
+		methods: {
+			onPreviewImage(index) {
+				uni.previewImage({
+					urls: this.list,
+					current: index
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.image-item {
+		display: block;
+	}
+</style>

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

@@ -47,7 +47,7 @@
 					bg_path: '',
 					nav_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-nav-bg.png'
 				}, {
-					bg_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-nav-bg.png',
+					bg_path: '',
 					nav_path: 'https://wealfavor-1257406827.cos.ap-beijing.myqcloud.com/new-xcx/task/task-nav-bg.png'
 				}, {
 					bg_path: '',

+ 8 - 8
page_task/task_details/module/apply.vue

@@ -7,22 +7,22 @@
 					<text class="sys-weight-600 m-l10">基本信息</text>
 				</view>
 				<view class="sys-from-background-color r-30 p-20 m-t30 row">
-					<view class="">
+					<view style="width: 50%;">
 						<view class="m-tb16">
 							<text class="text-color-666">是否涉农</text>
 							<text class="m-l16">{{applyFor.is_farming===1?'是':'否'}}</text>
 						</view>
 
-						<view class="m-tb16">
+						<view class="row m-tb16">
 							<text class="text-color-666">贷款类型</text>
-							<text class="m-l16">{{applyFor.loan_form_name}}</text>
+							<text class="m-l16 flex">{{applyFor.loan_form_name}}</text>
 						</view>
-						<view class="">
+						<view class="row">
 							<text class="text-color-666">投向行业</text>
-							<text class="m-l16">{{applyFor.loan_industry_name}}</text>
+							<text class="m-l16 flex">{{applyFor.loan_industry_name}}</text>
 						</view>
 					</view>
-					<view class="m-l40">
+					<view class="m-l40" style="width: 50%;">
 						<view class="m-tb16">
 							<text class="text-color-666">贷款类别</text>
 							<text class="m-l16">{{applyFor.loan_type_name}}</text>
@@ -31,9 +31,9 @@
 							<text class="text-color-666">支付状态</text>
 							<text class="m-l16">{{applyFor.pay_status===1?'已缴纳':'未缴纳'}}</text>
 						</view>
-						<view class="">
+						<view class="row">
 							<text class="text-color-666">企业类型</text>
-							<text class="m-l16">{{applyFor.enterprise_type_name}}</text>
+							<text class="m-l16 flex">{{applyFor.enterprise_type_name}}</text>
 						</view>
 					</view>
 				</view>

+ 16 - 13
page_task/task_details/module/identity.vue

@@ -10,12 +10,10 @@
 					<view class="capsule sys-bg-BFD2CC">{{business.education_name}}</view>
 					<view class="capsule sys-bg-BFD2CC m-l10">{{business.employ_type===1?'受薪':'自雇'}}</view>
 				</view>
-				<view class="row-c m-tb20">
-					<image class="card r-20" :src="business.identity_one" mode="aspectFill"></image>
-					<image class="card r-20 m-l20" :src="business.identity_two" mode="aspectFill">
-					</image>
+				<view class="row-c m-t20">
+					<EnImage :list="[business.identity_one,business.identity_two]"></EnImage>
 				</view>
-				<view class="row-c m-tb20">
+				<view class="row-c m-b20">
 					<image class="wh-30 m-r20" src="/static/img/task-details/number.png" mode="aspectFill"></image>
 					<view class="row-c">
 						<text class="text-color-666">证件号:</text>
@@ -65,18 +63,14 @@
 				<text class="size-26 sys-weight-600 m-l10">婚姻信息</text>
 			</view>
 
-
 			<view class="sys-from-background-color r-30 p-20 m-t30 size-26">
-				<view class="size-24 text-color-333">{{business.marriage_name}}</view>
-				<image class="card r-20 m-tb20" v-for="marriage_img in business.marriage_img" :src="marriage_img"
-					mode="aspectFill"></image>
+				<view class="size-24 text-color-333 m-b20">{{business.marriage_name}}</view>
+				<EnImage :list=" business.marriage_img"></EnImage>
 				<view class="spouse p-l20">
 					<text class="size-24">配偶信息</text>
 				</view>
-				<view class="row-c m-tb20">
-					<image class="card r-20" :src="business.m_identity_one" mode="aspectFill"></image>
-					<image class="card r-20 m-l20" :src="business.m_identity_two" mode="aspectFill">
-					</image>
+				<view class="row-c m-t20">
+					<EnImage :list="[business.m_identity_one,business.m_identity_two]"></EnImage>
 				</view>
 				<view class="">
 					<text class="size-26 sys-weight-600">{{business.mate_name}}</text>
@@ -106,11 +100,17 @@
 					</view>
 				</view>
 			</view>
+			<view class="row-c m-t30">
+				<view class="dot"></view>
+				<text class="size-26 sys-weight-600 m-l10">其他联系人信息</text>
+			</view>
 		</view>
 	</view>
 </template>
 
 <script>
+	import EnImage from "@/components/en-utils/en-image/en-image.vue"
+
 	export default {
 		props: {
 			business: {
@@ -120,6 +120,9 @@
 				default: {}
 			},
 		},
+		components: {
+			EnImage
+		},
 		data() {
 			return {}
 		},

+ 70 - 2
page_task/task_details/module/steps.vue

@@ -1,6 +1,25 @@
 <template>
 	<view class="">
 		<view class="sys-background-fff m-20 p-20 r-20">
+			<view class="row-c" v-for="(item,index) in list" :key="index">
+				<view class="column-c" style="position: relative;top: 45rpx;">
+					<image class="wh-36"
+						:src="item.is_dot == 1? '/static/img/login/Checked1@3x.png':'/static/img/login/Checked2@3x.png'"
+						mode="aspectFill"></image>
+					<view class="steps-line" :style="{opacity:index == list.length - 1?0:1}"></view>
+				</view>
+				<view class="sys-from-background-color steps-item p-20 r-20 column flex m-l20">
+					<text class="size-24 text-color-576">2024-12-20 12:45:00</text>
+					<view v-if="index == list.length - 1">
+						<text class="size-28 text-color-000 sys-weight-600">归档确认:</text>
+						<text class="size-28 text-color-576">-- -- -- --</text>
+					</view>
+					<view v-else>
+						<text class="size-28 text-color-666">外访:</text>
+						<text class="size-28 text-color-12 sys-weight-600">张三</text>
+					</view>
+				</view>
+			</view>
 		</view>
 	</view>
 </template>
@@ -11,10 +30,59 @@
 
 		},
 		data() {
-			return {}
+			return {
+				list2: [{
+					title: '买家下单',
+					desc: '2018-11-11'
+				}, {
+					title: '卖家发货',
+					desc: '2018-11-12'
+				}, {
+					title: '买家签收',
+					desc: '2018-11-13'
+				}, {
+					title: '交易完成',
+					desc: '2018-11-14'
+				}],
+				list: [{
+					is_dot: 1,
+					time: '2024-12-20 12:45:00',
+					type: '签约',
+					name: '张三'
+				}, {
+					is_dot: 1,
+					time: '2024-12-20 12:45:00',
+					type: '签约',
+					name: '张三'
+				}, {
+					is_dot: 1,
+					time: '2024-12-20 12:45:00',
+					type: '签约',
+					name: '张三'
+				}, {
+					is_dot: 1,
+					time: '2024-12-20 12:45:00',
+					type: '签约',
+					name: '张三'
+				}, {
+					is_dot: 0,
+					time: '2024-12-20 12:45:00',
+					type: '签约',
+					name: '张三'
+				}]
+			}
 		},
 	}
 </script>
 
-<style>
+<style lang="scss" scoped>
+	.steps-item:last-child {
+		margin-bottom: 0;
+	}
+
+	.steps-line {
+		width: 2rpx;
+		background-color: #D9D9D9;
+		height: 90rpx;
+	}
 </style>

+ 124 - 120
pages/statistics/components/consume_stat.vue

@@ -1,141 +1,145 @@
 <template>
 	<view class="">
-    <view class="tabs page-box-bg-fff  r-30 m-t30"
-          :style="[{position:is_fixed?'absolute':''}]" style="height: 100rpx;">
-      <z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
-              :bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
-              :current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
-    </view>
-    <!-- 顶部单行统计 -->
-    <StatSingleData :genre="dateTypeObj.censusUserType" :type="current+1" :total-money="moneyData.loanMoney" :total-num="moneyData.loanNum"  ></StatSingleData>
+		<view class="tabs page-box-bg-fff  r-30 m-t30" :style="[{position:is_fixed?'absolute':''}]"
+			style="height: 100rpx;">
+			<z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
+				:bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
+				:current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
+		</view>
+		<!-- 顶部单行统计 -->
+		<StatSingleData :genre="dateTypeObj.censusUserType" :type="current+1" :total-money="moneyData.loanMoney"
+			:total-num="moneyData.loanNum"></StatSingleData>
 		<StatLoanChart ref="outObj" :genre="3" :leftText="'消金汇总占比'"></StatLoanChart>
-<!--		<StatRanking :genre="3" :leftText="'消金汇总明细'"></StatRanking>-->
-<!--		<StatRanking ref="rankingObj" :genre="3" :is_type='2' :leftText="'个人业绩排行'"></StatRanking>-->
-    <stat_gather is_group :leftText="'汇总明细'"  :out-list="outList" ></stat_gather>
-    <StatRanking ref="rankingObj" :is_margin_top="false" :is_type="2" :leftText="'个人业绩排行'" :data-list="userList"></StatRanking>
-    <StatSituation ref="situationObj" :date-type-obj="selectTypeObj" :type="1"></StatSituation>
+		<!--		<StatRanking :genre="3" :leftText="'消金汇总明细'"></StatRanking>-->
+		<!--		<StatRanking ref="rankingObj" :genre="3" :is_type='2' :leftText="'个人业绩排行'"></StatRanking>-->
+		<stat_gather is_group :leftText="'汇总明细'" :out-list="outList"></stat_gather>
+		<StatRanking ref="rankingObj" :is_type="2" :leftText="'个人业绩排行'" :data-list="userList"></StatRanking>
+		<StatSituation ref="situationObj" :date-type-obj="selectTypeObj" :type="1"></StatSituation>
 	</view>
 </template>
 
 <script>
 	import StatLoanChart from "../module/stat_loan_chart.vue"
 	import StatSingleData from "../module/stat_single_data.vue"
-  import md5 from "js-md5";
-  import {getConsumeMoney, getRanking} from "@/api/statistics";
-  import Stat_gather from "@/pages/statistics/module/stat_gather.vue";
-  import StatRanking from "@/pages/statistics/module/stat_ranking.vue";
-  import StatSituation from "@/pages/statistics/module/stat_situation.vue";
+	import md5 from "js-md5";
+	import {
+		getConsumeMoney,
+		getRanking
+	} from "@/api/statistics";
+	import Stat_gather from "@/pages/statistics/module/stat_gather.vue";
+	import StatRanking from "@/pages/statistics/module/stat_ranking.vue";
+	import StatSituation from "@/pages/statistics/module/stat_situation.vue";
 
 	export default {
-    props:{
-      'dateTypeObj':{
-        default:()=>{
-          return {
-            dateType:4,
-            selectDate:'2023-02-25',
-            money_type:1,
-            censusUserType:0,
-            product_id:5,
-          }
-        }
-      }
-    },
+		props: {
+			'dateTypeObj': {
+				default: () => {
+					return {
+						dateType: 4,
+						selectDate: '2023-02-25',
+						money_type: 1,
+						censusUserType: 0,
+						product_id: 5,
+					}
+				}
+			}
+		},
 		components: {
-      Stat_gather,
-      StatSingleData,
+			Stat_gather,
+			StatSingleData,
 			StatLoanChart,
-      StatRanking,
-      StatSituation,
+			StatRanking,
+			StatSituation,
 		},
 		data() {
 			return {
-        selectTypeObj:{
-          dateType:4,
-          selectDate:'2023-02-25',
-          money_type:1,
-          censusUserType:0,
-          product_id:5,
-        },
-        tabsList: [{
-          name: '未出款',
-          dot_color: 'red',
-          disabled: false
-        }, {
-          name: '签约',
-          dot_color: 'yellow',
-          disabled: false
-        }, {
-          name: '出款',
-          dot_color: 'yellow',
-          disabled: false
-        }],
-        current: 0,
-        moneyData:{
-          loanMoney: 0,
-          loanNum: 0
-        },
-        outList:[],
-        userList:[],
+				selectTypeObj: {
+					dateType: 4,
+					selectDate: '2023-02-25',
+					money_type: 1,
+					censusUserType: 0,
+					product_id: 5,
+				},
+				tabsList: [{
+					name: '未出款',
+					dot_color: 'red',
+					disabled: false
+				}, {
+					name: '签约',
+					dot_color: 'yellow',
+					disabled: false
+				}, {
+					name: '出款',
+					dot_color: 'yellow',
+					disabled: false
+				}],
+				current: 0,
+				moneyData: {
+					loanMoney: 0,
+					loanNum: 0
+				},
+				outList: [],
+				userList: [],
+			}
+		},
+		watch: {
+			'dateTypeObj': function() {
+				this.initData()
 			}
 		},
-    watch:{
-      'dateTypeObj':function () {
-        this.initData()
-      }
-    },
-    mounted() {
-      this.initData()
-    },
-    methods: {
-      tabsChange(e) {
-        if(e!==this.current){
-          this.current = e
-          this.selectTypeObj.money_type=this.current+1
-          this.startData()
-        }
-      },
-      setSendMd5(){
-        let str=JSON.stringify(this.dateTypeObj)
-        return md5(str)
-      },
-      initData(){
-        if(this.dateTypeObj.censusUserType>0){
-          this.selectTypeObj=this.dateTypeObj
-          this.selectTypeObj.money_type=1
-          let sendMd5=this.setSendMd5()
-          if(sendMd5 !== this.sendMd5){
-            this.sendMd5=sendMd5
-            this.startData()
-          }
-        }
-      },
-      startData(){
-        this.getConsumeMoney()
-        this.setUserRanking()
-      },
-      getConsumeMoney(){
-        getConsumeMoney(this.selectTypeObj).then((res)=>{
-          if(res.code === 1){
-            this.moneyData.loanMoney=res.data.moneyData.loanMoney
-            this.moneyData.loanNum=res.data.moneyData.loanNum
-            this.outList=res.data.items
-            this.$refs.outObj.setPeakChartData(this.outList)
-          }
-        })
-      },
-      setUserRanking(){
-        let fromData = this.selectTypeObj
-        fromData.pageNum = 5
-        getRanking(fromData).then((res)=>{
-          if(res.code === 1){
-            this.userList = res.data.items
-            this.$refs.rankingObj.setDataList(this.userList)
-          }else{
-            this.userList = []
-          }
-        })
-      },
-    },
+		mounted() {
+			this.initData()
+		},
+		methods: {
+			tabsChange(e) {
+				if (e !== this.current) {
+					this.current = e
+					this.selectTypeObj.money_type = this.current + 1
+					this.startData()
+				}
+			},
+			setSendMd5() {
+				let str = JSON.stringify(this.dateTypeObj)
+				return md5(str)
+			},
+			initData() {
+				if (this.dateTypeObj.censusUserType > 0) {
+					this.selectTypeObj = this.dateTypeObj
+					this.selectTypeObj.money_type = 1
+					let sendMd5 = this.setSendMd5()
+					if (sendMd5 !== this.sendMd5) {
+						this.sendMd5 = sendMd5
+						this.startData()
+					}
+				}
+			},
+			startData() {
+				this.getConsumeMoney()
+				this.setUserRanking()
+			},
+			getConsumeMoney() {
+				getConsumeMoney(this.selectTypeObj).then((res) => {
+					if (res.code === 1) {
+						this.moneyData.loanMoney = res.data.moneyData.loanMoney
+						this.moneyData.loanNum = res.data.moneyData.loanNum
+						this.outList = res.data.items
+						this.$refs.outObj.setPeakChartData(this.outList)
+					}
+				})
+			},
+			setUserRanking() {
+				let fromData = this.selectTypeObj
+				fromData.pageNum = 5
+				getRanking(fromData).then((res) => {
+					if (res.code === 1) {
+						this.userList = res.data.items
+						this.$refs.rankingObj.setDataList(this.userList)
+					} else {
+						this.userList = []
+					}
+				})
+			},
+		},
 	}
 </script>
 

+ 121 - 117
pages/statistics/components/drawings_stat.vue

@@ -1,138 +1,142 @@
 <template>
 	<view class="">
-    <view class="tabs page-box-bg-fff  r-30 m-t30"
-          :style="[{position:is_fixed?'absolute':''}]" style="height: 100rpx;">
-      <z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
-              :bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
-              :current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
-    </view>
-    <!-- 顶部单行统计 -->
-    <StatSingleData :genre="dateTypeObj.censusUserType" :total-money="moneyData.loanMoney" :total-num="moneyData.loanNum"  ></StatSingleData>
+		<view class="tabs page-box-bg-fff  r-30 m-t30" :style="[{position:is_fixed?'absolute':''}]"
+			style="height: 100rpx;">
+			<z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
+				:bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
+				:current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
+		</view>
+		<!-- 顶部单行统计 -->
+		<StatSingleData :genre="dateTypeObj.censusUserType" :total-money="moneyData.loanMoney"
+			:total-num="moneyData.loanNum"></StatSingleData>
 		<StatLoanChart ref="outObj" :genre="1" :leftText="'提放汇总占比'"></StatLoanChart>
-    <stat_gather is_group :leftText="'提放汇总明细'"  :out-list="outList" ></stat_gather>
-    <StatRanking ref="rankingObj" :is_margin_top="false" :is_type="2" :leftText="'个人业绩排行'" :data-list="userList"></StatRanking>
-    <StatSituation ref="situationObj" :date-type-obj="selectTypeObj" :type="1"></StatSituation>
+		<stat_gather is_group :leftText="'提放汇总明细'" :out-list="outList"></stat_gather>
+		<StatRanking ref="rankingObj" :is_type="2" :leftText="'个人业绩排行'" :data-list="userList"></StatRanking>
+		<StatSituation ref="situationObj" :date-type-obj="selectTypeObj" :type="1"></StatSituation>
 	</view>
 </template>
 
 <script>
 	import StatLoanChart from "../module/stat_loan_chart.vue"
-  import md5 from "js-md5";
-  import {getRanking,getDepartmentMoney} from "@/api/statistics";
-  import StatSituation from "@/pages/statistics/module/stat_situation.vue";
-  import StatRanking from "@/pages/statistics/module/stat_ranking.vue";
-  import Stat_gather from "@/pages/statistics/module/stat_gather.vue";
-  import StatSingleData from "@/pages/statistics/module/stat_single_data.vue";
+	import md5 from "js-md5";
+	import {
+		getRanking,
+		getDepartmentMoney
+	} from "@/api/statistics";
+	import StatSituation from "@/pages/statistics/module/stat_situation.vue";
+	import StatRanking from "@/pages/statistics/module/stat_ranking.vue";
+	import Stat_gather from "@/pages/statistics/module/stat_gather.vue";
+	import StatSingleData from "@/pages/statistics/module/stat_single_data.vue";
 
 	export default {
-    props:{
-      'dateTypeObj':{
-        default:()=>{
-          return {
-            dateType:4,
-            selectDate:'2023-02-25',
-            money_type:1,
-            censusUserType:0,
-            product_id:5,
-          }
-        }
-      }
-    },
+		props: {
+			'dateTypeObj': {
+				default: () => {
+					return {
+						dateType: 4,
+						selectDate: '2023-02-25',
+						money_type: 1,
+						censusUserType: 0,
+						product_id: 5,
+					}
+				}
+			}
+		},
 		components: {
-      StatSingleData,
-      Stat_gather,
-      StatRanking,
-      StatSituation,
+			StatSingleData,
+			Stat_gather,
+			StatRanking,
+			StatSituation,
 			StatLoanChart,
 		},
 		data() {
 			return {
-        selectTypeObj:{
-          dateType:4,
-          selectDate:'2023-02-25',
-          money_type:4,
-          censusUserType:0,
-          product_id:5,
-        },
-        tabsList: [{
-          name: '汇总',
-          dot_color: 'red',
-          disabled: false
-        }, {
-          name: '银行',
-          dot_color: 'yellow',
-          disabled: false
-        }],
-        current: 0,
+				selectTypeObj: {
+					dateType: 4,
+					selectDate: '2023-02-25',
+					money_type: 4,
+					censusUserType: 0,
+					product_id: 5,
+				},
+				tabsList: [{
+					name: '汇总',
+					dot_color: 'red',
+					disabled: false
+				}, {
+					name: '银行',
+					dot_color: 'yellow',
+					disabled: false
+				}],
+				current: 0,
 
-        userList:[],
-        moneyData:{
-          loanMoney: 0,
-          loanNum: 0
-        },
-        outList:[]
+				userList: [],
+				moneyData: {
+					loanMoney: 0,
+					loanNum: 0
+				},
+				outList: []
 			}
 		},
-    watch:{
-      'dateTypeObj':function () {
-        this.initData()
-      }
-    },
-    mounted() {
-      this.initData()
-    },
-    methods:{
-      tabsChange(e) {
-        if(e!==this.current){
-          this.current = e
-          this.selectTypeObj.money_type=this.current===0?5:4
-          this.startData()
-        }
-      },
-      setSendMd5(){
-        let str=JSON.stringify(this.dateTypeObj)
-        return md5(str)
-      },
-      initData(){
-        if(this.dateTypeObj.censusUserType>0){
-          this.selectTypeObj=this.dateTypeObj
-          this.selectTypeObj.money_type=5
-          this.selectTypeObj.product_id=5
-          let sendMd5=this.setSendMd5()
-          if(sendMd5 !== this.sendMd5){
-            this.sendMd5=sendMd5
-           this.startData()
-          }
-        }
-      },
-      startData(){
-        this.getDepartmentMoney()
-        this.setUserRanking()
-        this.$refs.situationObj.startList()
-      },
-       setUserRanking(){
-        let fromData = this.selectTypeObj
-        fromData.pageNum = 5
-         getRanking(fromData).then((res)=>{
-          if(res.code === 1){
-            this.userList = res.data.items
-            this.$refs.rankingObj.setDataList(this.userList)
-          }else{
-            this.userList = []
-          }
-        })
-      },
-      getDepartmentMoney(){
-         getDepartmentMoney(this.selectTypeObj).then((res)=>{
-          if(res.code === 1){
-            this.moneyData.loanMoney=res.data.moneyData.loanMoney
-            this.moneyData.loanNum=res.data.moneyData.loanNum
-            this.outList=res.data.items
-            this.$refs.outObj.setPeakChartData(this.outList)
-          }
-        })
-      },
-    }
+		watch: {
+			'dateTypeObj': function() {
+				this.initData()
+			}
+		},
+		mounted() {
+			this.initData()
+		},
+		methods: {
+			tabsChange(e) {
+				if (e !== this.current) {
+					this.current = e
+					this.selectTypeObj.money_type = this.current === 0 ? 5 : 4
+					this.startData()
+				}
+			},
+			setSendMd5() {
+				let str = JSON.stringify(this.dateTypeObj)
+				return md5(str)
+			},
+			initData() {
+				if (this.dateTypeObj.censusUserType > 0) {
+					this.selectTypeObj = this.dateTypeObj
+					this.selectTypeObj.money_type = 5
+					this.selectTypeObj.product_id = 5
+					let sendMd5 = this.setSendMd5()
+					if (sendMd5 !== this.sendMd5) {
+						this.sendMd5 = sendMd5
+						this.startData()
+					}
+				}
+			},
+			startData() {
+				this.getDepartmentMoney()
+				this.setUserRanking()
+				this.$refs.situationObj.startList()
+			},
+			setUserRanking() {
+				let fromData = this.selectTypeObj
+				fromData.pageNum = 5
+				getRanking(fromData).then((res) => {
+					if (res.code === 1) {
+						this.userList = res.data.items
+						this.$refs.rankingObj.setDataList(this.userList)
+					} else {
+						this.userList = []
+					}
+				})
+			},
+			getDepartmentMoney() {
+				getDepartmentMoney(this.selectTypeObj).then((res) => {
+					if (res.code === 1) {
+						this.moneyData.loanMoney = res.data.moneyData.loanMoney
+						this.moneyData.loanNum = res.data.moneyData.loanNum
+						this.outList = res.data.items
+						this.$refs.outObj.setPeakChartData(this.outList)
+					}
+				})
+			},
+		}
 
 	}
 </script>

+ 6 - 6
pages/statistics/module/stat_age_chart.vue

@@ -32,12 +32,12 @@
 				}, ]
 			};
 		},
-    methods: {
-      setData(data){
-        console.log(data)
-        this.$refs.mixtureChart.setServerData(data)
-      }
-    },
+		methods: {
+			setData(data) {
+				console.log(data)
+				this.$refs.mixtureChart.setServerData(data)
+			}
+		},
 	}
 </script>
 

+ 35 - 49
pages/statistics/module/stat_industry.vue

@@ -4,10 +4,11 @@
 		</StatisticsTitle>
 		<view class="page-box-bg-fff row-justify-sb center r-30">
 			<view class="chart_item column-c m-lr20">
-				<CircleChart ref="circleChart" :bgColor="'#2B7DFA'"></CircleChart>
+				<RoseChart ref="roseChart"></RoseChart>
 			</view>
 			<view class="row industry-box m-l30">
-				<view class="row-c p-tb10 industry-item" v-if="index<=5" v-for="(item,index) in industryList.titles" :key="index">
+				<view class="row-c p-tb10 industry-item m-r30" v-if="index<=5"
+					v-for="(item,index) in industryList.titles" :key="index">
 					<view class="wh-14 m-r10" :class="'industry-icon-'+index"></view>
 					<text class="size-24 text-color-576">{{item}}</text>
 				</view>
@@ -17,13 +18,13 @@
 </template>
 
 <script>
-	import CircleChart from "@/common/chart/circle_chart.vue";
+	import RoseChart from "@/common/chart/rose_chart.vue";
 	import StatisticsTitle from "./statistics_title.vue";
 
 	export default {
 		name: 'stat-industry',
 		components: {
-			CircleChart,
+			RoseChart,
 			StatisticsTitle
 		},
 		props: {
@@ -39,37 +40,16 @@
 			}
 		},
 		data() {
-			return {
-				list: [{
-					name: '电力',
-					color: '#2B7DFA'
-				}, {
-					name: '信息传媒',
-					color: '#2B7DFA'
-				}, {
-					name: '互联网',
-					color: '#ED9A2C'
-				}, {
-					name: '电力',
-					color: '#ED9A2C'
-				}, {
-					name: '信息传媒',
-					color: '#00BF8A'
-				}, {
-					name: '互联网',
-					color: '#00BF8A'
-				}, ]
-			};
+			return {};
 		},
 		methods: {
 			onChange(e) {
 				this.current = e
 			},
-      setData(data){
-        console.log(data)
-
-        this.$refs.circleChart.setServerData(data)
-      }
+			setData(data) {
+				console.log(data)
+				this.$refs.roseChart.setServerData(data)
+			}
 		}
 	}
 </script>
@@ -79,25 +59,31 @@
 		flex-wrap: wrap;
 
 		.industry-item {
-			width: 180rpx;
-      .industry-icon-0{
-        background-color: #2C7DF9;
-      }
-      .industry-icon-1{
-        background-color: #2C7DF9;
-      }
-      .industry-icon-2{
-        background-color: #00BF8A;
-      }
-      .industry-icon-3{
-        background-color: #00BF8A;
-      }
-      .industry-icon-4{
-        background-color: #ED9A2C;
-      }
-      .industry-icon-5{
-        background-color: #ED9A2C;
-      }
+			width: 120rpx;
+
+			.industry-icon-0 {
+				background-color: #2C7DF9;
+			}
+
+			.industry-icon-1 {
+				background-color: #00BF8A;
+			}
+
+			.industry-icon-2 {
+				background-color: #ED9A2C;
+			}
+
+			.industry-icon-3 {
+				background-color: #EE6666;
+			}
+
+			.industry-icon-4 {
+				background-color: #73C0DE;
+			}
+
+			.industry-icon-5 {
+				background-color: #9A60B4;
+			}
 
 		}
 	}

+ 12 - 13
pages/statistics/module/stat_ranking.vue

@@ -27,7 +27,7 @@
 					<image class="wh-36 m-r20" :src="`/static/img/statistics/${userIconList[index]}.png`"
 						mode="aspectFill">
 					</image>
-					<image class="wh-60" :src="item.head_img" mode=""></image>
+					<image class="wh-60 r-100" :src="item.head_img" mode=""></image>
 					<view class="column m-l16">
 						<text class="size-28 text-color-000 p-b10">{{item.name}}</text>
 						<text class="size-24 text-color-666">{{item.departments_name}}</text>
@@ -35,14 +35,13 @@
 				</view>
 				<text class="size-28 color-000 sys-weight-600">{{item.total_money}}万</text>
 			</view>
-      <en-blank v-if="dataList.length<=0"></en-blank>
+			<en-blank v-if="dataList.length<=0"></en-blank>
 		</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 dataList" :key="index">
 				<view class="row-c sys-weight-400">
-					<image class="wh-60 m-r30" :src="item.product_icon"
-						mode="aspectFill">
+					<image class="wh-60 m-r30" :src="item.product_icon" mode="aspectFill">
 					</image>
 					<text class="size-28 text-color-000 p-b10">{{item.product_name}}</text>
 				</view>
@@ -57,12 +56,12 @@
 
 <script>
 	import StatisticsTitle from "./statistics_title.vue";
-  import EnBlank from "@/components/en-utils/en-blank/en-blank.vue";
+	import EnBlank from "@/components/en-utils/en-blank/en-blank.vue";
 
 	export default {
 		name: 'stat_ranking',
 		components: {
-      EnBlank,
+			EnBlank,
 			StatisticsTitle
 		},
 		props: {
@@ -91,19 +90,19 @@
 
 		data() {
 			return {
-        dataList:[],
+				dataList: [],
 				iconList: ['champion', 'runner-up', 'third'],
 				userIconList: ['one', 'two', 'three'],
 				taskIconLsit: ['task-one', 'task-two', 'task-three', 'task-four']
 			};
 		},
-    methods: {
-      setDataList(data){
+		methods: {
+			setDataList(data) {
 
-        this.dataList=data
-        console.log(this.dataList)
-      }
-    },
+				this.dataList = data
+				console.log(this.dataList)
+			}
+		},
 	}
 </script>
 

+ 17 - 17
pages/statistics/module/stat_situation.vue

@@ -34,19 +34,19 @@
 			</view>
 			<en-blank v-if="businessList.length<=0"></en-blank>
 		</view>
-    <view v-else>
-      <view class="finance_item sys-from-background-color m-b16 r-20 p-30 row-justify-sb center"
-            v-for="(item,index) in useList" :key="index" >
-        <text class="size-28 text-color-12">{{item.name}}</text>
-        <text class="size-28 text-color-E21 sys-weight-600 m-r10">{{item.total_money}}万</text>
-        <view class="size-24">
-          <text class="text-color-000">{{item.use_date}}</text>
-          <text class="text-color-666">用款</text>
-        </view>
-      </view>
-      <en-blank v-if="useList.length<=0"></en-blank>
-    </view>
-
+		<view v-else>
+			<view class="finance_item sys-from-background-color m-b16 r-20 p-30 row-justify-sb center"
+				v-for="(item,index) in useList" :key="index">
+				<view class="size-28 text-color-12" style="width: 100rpx;">{{item.name}}</view>
+				<view class="size-28 text-color-E21 sys-weight-600 m-r10">{{item.total_money}}万
+				</view>
+				<view class="size-24">
+					<text class="text-color-000">{{item.use_date}}</text>
+					<text class="text-color-666">用款</text>
+				</view>
+			</view>
+			<en-blank v-if="useList.length<=0"></en-blank>
+		</view>
 	</view>
 </template>
 
@@ -133,10 +133,10 @@
 			getUseList() {
 				this.dateTypeObj.page = 1
 				getUseList(this.dateTypeObj).then((res) => {
-          if(res.code===1){
-            this.useNum = res.data.totalNum
-            this.useList = res.data.items
-          }
+					if (res.code === 1) {
+						this.useNum = res.data.totalNum
+						this.useList = res.data.items
+					}
 
 
 				})

+ 5 - 5
pages/statistics/module/statistics_title.vue

@@ -51,13 +51,13 @@
 		data() {
 			return {
 				bgColor: ['#0FB160', '#FE7F37', '#10A2B0', '#DE2519'],
-				list: [ {
+				list: [{
+					name: '男',
+					color: '#FFD023'
+				}, {
 					name: '女',
 					color: '#00BF8A'
-				}, {
-					name: '男',
-					color: '#ED9A2C'
-				}, ]
+				}]
 			};
 		},
 		methods: {