业绩目标

app.json

@@ -51,7 +51,8 @@
         "orderForm/rows",
         "dispatchBill/rows",
         "dispatchBill/sentandback",
-        "activity/selectProduct/cart/index"
+        "activity/selectProduct/cart/index",
+        "target/index"
       ]
     },
     {

packageA/market/detail.wxml

@@ -97,7 +97,7 @@
         <block wx:if="{{cLength}}">
             <view class="label custom" wx:if="{{cLength.type == '自定义'}}">
                 <view style="display: flex; align-items: center;">
-                    <view style="margin-right: 20rpx;">长:</view>
+                    <view style="margin-right: 10rpx;">长:</view>
                     <van-stepper plus-class='plus-class' value="{{ content.dlength  }}" input-width="60px" min="{{cLength.min}}" max="{{cLength.max}}" decimal-length="{{ cLength.decimalplaces }}" data-name="cLength" bind:plus='cahngeStepper' bind:blur='cahngeStepper' bind:minus='cahngeStepper' />
                     <view class="explain">{{cLength.min+'mm ~ '+ cLength.max}}mm,<text wx:if="{{cLength.decimalplaces}}">保留{{cLength.decimalplaces}}位小数</text><text wx:else>不保留小数</text></view>
                 </view>

packageA/target/index.js

@@ -0,0 +1,170 @@
+const _Http = getApp().globalData.http,
+	{
+		formatTime
+	} = require("../../utils/getTime");
+let obj = {};
+Page({
+	data: {
+
+	},
+	onLoad(options) {
+		this.getDetail()
+		let date = formatTime().split(" ")[0].split("/");
+		obj = {
+			year: date[0],
+			month: date[1],
+			day: date[2],
+			quarter: Math.ceil(date[1] / 3)
+		};
+		console.log(obj)
+	},
+	getDetail() {
+		_Http.basic({
+			"id": "20230110151902",
+			"version": 1,
+			"content": {
+				"where": {
+					"year": obj.year
+				}
+			}
+		}).then(res => {
+			console.log("业绩目标", res)
+			if (res.msg != '成功') return wx.showToast({
+				title: res.msg,
+				icon: "none"
+			})
+			if (res.data.length == 0) {
+				wx.showToast({
+					title: '未查询到内容',
+					icon: "none",
+					mask: true
+				});
+				setTimeout(() => {
+					wx.navigateBack()
+				}, 1000)
+			};
+			//l基本 h挑战 a实际 pl基础目标实际完成率 ph挑战目标实际完成率
+			let data = res.data[0];
+			let ar = [{
+					fulfill: data.m1a + data.m2a + data.m3a,
+					target: data.m3l + data.m3l + data.m3l,
+				}, {
+					fulfill: data.m4a + data.m5a + data.m6a,
+					target: data.m4l + data.m5l + data.m6l,
+				}, {
+					fulfill: data.m7a + data.m8a + data.m9a,
+					target: data.m7l + data.m8l + data.m9l,
+				}, {
+					fulfill: data.m10a + data.m11a + data.m12a,
+					target: data.m10l + data.m11l + data.m12l,
+				}].map(v => {
+					v.achievingRate = (v.fulfill / v.target) * 100 + '%'
+					return v
+				}),
+				table = [{
+					label: "年",
+					fulfill: data.y1a,
+					target: data.y1l,
+					achievingRate: data.y1pl + '%'
+				}, {
+					label: "第一季度",
+					...ar[0]
+				}, {
+					label: "1月",
+					fulfill: data.m1a,
+					target: data.m1l,
+					achievingRate: data.m1pl + '%'
+				}, {
+					label: "2月",
+					fulfill: data.m2a,
+					target: data.m2l,
+					achievingRate: data.m2pl + '%'
+				}, {
+					label: "3月",
+					fulfill: data.m3a,
+					target: data.m3l,
+					achievingRate: data.m3pl + '%'
+				}, {
+					label: "第二季度",
+					...ar[1]
+				}, {
+					label: "4月",
+					fulfill: data.m4a,
+					target: data.m4l,
+					achievingRate: data.m4pl + '%'
+				}, {
+					label: "5月",
+					fulfill: data.m5a,
+					target: data.m5l,
+					achievingRate: data.m5pl + '%'
+				}, {
+					label: "6月",
+					fulfill: data.m6a,
+					target: data.m6l,
+					achievingRate: data.m6pl + '%'
+				}, {
+					label: "第三季度",
+					...ar[2]
+				}, {
+					label: "7月",
+					fulfill: data.m7a,
+					target: data.m7l,
+					achievingRate: data.m7pl + '%'
+				}, {
+					label: "8月",
+					fulfill: data.m8a,
+					target: data.m8l,
+					achievingRate: data.m8pl + '%'
+				}, {
+					label: "9月",
+					fulfill: data.m9a,
+					target: data.m9l,
+					achievingRate: data.m9pl + '%'
+				}, {
+					label: "第四季度",
+					...ar[3]
+				}, {
+					label: "10月",
+					fulfill: data.m10a,
+					target: data.m10l,
+					achievingRate: data.m10pl + '%'
+				}, {
+					label: "11月",
+					fulfill: data.m11a,
+					target: data.m11l,
+					achievingRate: data.m11pl + '%'
+				}, {
+					label: "12月",
+					fulfill: data.m12a,
+					target: data.m12l,
+					achievingRate: data.m12pl + '%'
+				}],
+				statistics = [{
+					label: "月度",
+					fulfill: data[`m${obj.month}a`],
+					target: data[`m${obj.month}l`],
+					distance: Math.abs(data[`m${obj.month}a`] - data[`m${obj.month}l`]), //差额
+					achievingRate: data[`m${obj.month}pl`] + "%", //达成
+					color: "#FF9900"
+				}, {
+					label: "季度",
+					...ar[obj.quarter - 1],
+					distance: Math.abs(ar[obj.quarter - 1].fulfill - ar[obj.quarter - 1].target), //差额
+					color: "#2AB4A3"
+				}, {
+					...table[0],
+					label: "年度",
+					distance: Math.abs(data.y1a - data.y1l), //差额
+					color: "#FF001F"
+				}].map(v => {
+					v.achievingRate = v.achievingRate.split("%")[0] - 0
+					return v
+				})
+			this.setData({
+				table,
+				statistics
+			})
+			console.log(statistics)
+		})
+	}
+})

packageA/target/index.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

packageA/target/index.scss

@@ -0,0 +1,140 @@
+.chart {
+	width: 100vw;
+	background-color: #fff;
+	display: flex;
+	padding: 30rpx 0;
+	box-sizing: border-box;
+
+	.item {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		flex: 1;
+		justify-content: center;
+		flex-shrink: 0;
+		width: 0;
+		font-weight: bold;
+
+		.s-label,
+		.s-fulfill,
+		.s-row {
+			width: 100%;
+			text-align: center;
+			padding: 0 8rpx;
+		}
+
+		.s-label {
+			font-size: 26rpx;
+		}
+
+		.s-fulfill {
+			font-size: 34rpx;
+			margin-top: 8rpx;
+		}
+
+		.s-row {
+			font-size: 22rpx;
+			margin-top: 8rpx;
+		}
+
+
+		.circle {
+			width: 100rpx;
+			height: 100rpx;
+			position: relative;
+			border-radius: 50%;
+			margin-bottom: 25rpx;
+			transform: scale(1.15);
+
+			.ab {
+				position: absolute;
+				left: 0;
+				right: 0;
+				top: 0;
+				bottom: 0;
+				margin: auto;
+			}
+
+			&_left {
+				border: 8rpx solid #ccc;
+				border-radius: 50%;
+				clip: rect(0, 50rpx, 100rpx, 0);
+			}
+
+			&_right {
+				border: 8rpx solid #ccc;
+				border-radius: 50%;
+				clip: rect(0, 100rpx, 100rpx, 50rpx);
+			}
+
+			&_text {
+				height: 100%;
+				display: flex;
+				flex-direction: column;
+				justify-content: center;
+				align-items: center;
+				font-size: 24rpx;
+				font-family: PingFang SC-Regular, PingFang SC;
+
+				.value {
+					margin-top: -6rpx;
+				}
+
+				.name {
+					margin-top: 6rpx;
+				}
+			}
+		}
+
+	}
+}
+
+.table {
+	width: 100vw;
+	background-color: #ffffff;
+	box-sizing: border-box;
+	margin-top: 30rpx;
+
+	.label {
+		display: flex;
+		align-items: center;
+		height: 80rpx;
+		padding: 0 20rpx;
+		font-weight: bold;
+		font-size: 26rpx;
+		color: #666;
+
+		.text {
+			display: inline-block;
+			width: 14rpx;
+			height: 26rpx;
+			background: #31A7FF;
+			margin-right: 14rpx;
+		}
+	}
+
+	.row,
+	.row-label {
+		display: flex;
+		align-items: center;
+		height: 70rpx;
+		background-color: #F2F2F2;
+		font-weight: bold;
+		padding-left: 30rpx;
+
+		view {
+			flex: 1;
+			width: 0;
+			flex-shrink: 0;
+		}
+	}
+
+	.row:nth-child(odd) {
+		background-color: #fff;
+	}
+
+	.row-label {
+		font-weight: normal;
+	}
+
+}

packageA/target/index.wxml

@@ -0,0 +1,82 @@
+<view class="chart">
+
+	<view class="item" wx:for="{{statistics}}" style="color: {{item.color}} !important;">
+		<view class="circle" style="box-shadow: inset 0 0 0 8rpx  {{item.color}};">
+			<view class="circle_left ab" style="{{render.leftRate(item.achievingRate)}}" />
+			<view class="circle_right ab" style="{{render.rightRate(item.achievingRate,item.color)}}" />
+			<view class="circle_text">
+				{{item.achievingRate}}%
+			</view>
+		</view>
+
+		<view class="s-label">
+			{{item.label}}
+		</view>
+		<view class="s-fulfill line-1">
+			{{item.fulfill}}万
+		</view>
+		<view class="s-row line-1">
+			目标:{{item.target}}万
+		</view>
+		<view class="s-row line-1">
+			差额:{{item.distance}}万
+		</view>
+	</view>
+
+</view>
+
+<view class="table">
+	<view class="label">
+		<text class="text" />
+		业绩明细
+	</view>
+	<view class="row-label">
+		<view class="line-1">
+			月/季/年
+		</view>
+		<view class="line-1">
+			达成金额(万)
+		</view>
+		<view class="line-1">
+			目标金额(万)
+		</view>
+		<view class="line-1">
+			达成率
+		</view>
+	</view>
+	<view>
+		<view class="row" wx:for="{{table}}">
+			<view class="line-1">
+				{{item.label}}
+			</view>
+			<view class="line-1">
+				{{item.fulfill}}
+			</view>
+			<view class="line-1">
+				{{item.target}}
+			</view>
+			<view class="line-1">
+				{{item.achievingRate}}
+			</view>
+		</view>
+	</view>
+</view>
+
+<My_empty wx:if="{{list.length==0}}" />
+<wxs module="render">
+	module.exports = {
+		rightRate: function (rate, color) {
+			if (rate - 0 < 50) {
+				return 'transform: rotate(' + 3.6 * (rate - 0) + 'deg);';
+			} else {
+				return "transform: rotate(0);border-color:" + color + ";";
+			}
+		},
+		leftRate: function (rate) {
+			if (rate - 0 >= 50) {
+				if (rate - 0 >= 100) rate = 100;
+				return 'transform: rotate(' + 3.6 * (rate - 50) + 'deg);';
+			}
+		}
+	}
+</wxs>

pages/index/index.js

@@ -173,6 +173,10 @@ Page({
 					name: "工厂发退明细",
 					path: "/packageA/dispatchBill/sentandback",
 					icon: "icon-shouhuo"
+				}, {
+					name: "业绩目标",
+					path: "/packageA/target/index",
+					icon: "work-yejimubiao"
 				}];
 				let edd = getApp().globalData.queryPer.query(wx.getStorageSync('userauth'), ["E-订单"], ["商品档案", "销售管理", "财务管理", "售后管理", "发货管理", "业绩查询"]),
 					list = [];

project.private.config.json

@@ -71,6 +71,13 @@
           "query": "id=2660",
           "launchMode": "default",
           "scene": null
+        },
+        {
+          "name": "业绩目标",
+          "pathName": "packageA/target/index",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
         }
       ]
     }