2

src/static/css/common.css

@@ -25,6 +25,7 @@
 }
 
 .flex_around_center {
+	display: flex;
 	justify-content: space-around;
 	align-items: center;
 	flex-flow: row wrap

src/utils/index.js

@@ -27,6 +27,7 @@ export let urlTobase64 = (file, suc) => {
 	});
 }
 
+
 /**
  * 上传文件 
  */
@@ -85,7 +86,9 @@ export function UploadFileToSystem(uploadConfig, fileFullPath, fileObj, successC
 		url: url,
 		filePath: fileObj.url,
 		name: 'file',
-        formData: { 'myfile': fileObj },
+		formData: {
+			'myfile': fileObj
+		},
 		success(res) {
 			uni.hideLoading();
 			let jsonObj = JSON.parse(res.data)
@@ -168,14 +171,15 @@ export function UploadFileToTencent(uploadConfig, fileFullPath, fileObj, success
 // 数字转汉字
 export let changeNumToHan = (num) => {
 	var arr1 = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九');
-    var arr2 = new Array('', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千', '万', '十', '百', '千', '亿');//可继续追加更高位转换值
+	var arr2 = new Array('', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千', '万', '十', '百', '千',
+		'亿'); //可继续追加更高位转换值
 	if (!num || isNaN(num)) {
 		return "零";
 	}
 	var english = num.toString().split("")
 	var result = "";
 	for (var i = 0; i < english.length; i++) {
-        var des_i = english.length - 1 - i;//倒序排列设值
+		var des_i = english.length - 1 - i; //倒序排列设值
 		result = arr2[i] + result;
 		var arr1_index = english[des_i];
 		result = arr1[arr1_index] + result;
@@ -217,3 +221,100 @@ export let isLogin = () => {
 
 	}
 }
+export let getImageColor = async (canvasID, imgID, imgSrc) => {
+	
+	let res = {
+		r: 1,
+		g: 1,
+		b: 1
+	}
+	const canvas = uni.createCanvasContext(canvasID)
+	let imgWidth
+	let imgHeight
+	 
+	await new Promise(resolve => {
+		uni.createSelectorQuery().select("#" + imgID).boundingClientRect(res => {
+			console.log(234,res)
+			imgWidth = res?.width??10;
+			imgHeight = res?.height??10;
+			resolve()
+		}).exec()
+	})
+	canvas.fillRect(0, 0, imgWidth, imgHeight)
+	let base64Img= await netUrlTobase64(imgSrc)
+	canvas.drawImage(base64Img, 0, 0, imgWidth, imgHeight)
+	res = await new Promise((resolve, reject) => {
+		canvas.draw(true, (e) => {
+			// 获取像素数据
+			uni.canvasGetImageData({
+				// #ifdef MP-WEIXIN
+				canvasId: canvas.canvasId,
+				// #endif
+				// #ifndef MP-WEIXIN
+				canvasId: canvas.id,
+				// #endif
+				x: 0,
+				y: 0,
+				width: imgWidth,
+				height: imgHeight,
+				success: (res) => {
+					let data = res.data;
+					var r = 1,
+						g = 1,
+						b = 1;
+					// 取所有像素的平均值
+					for (var row = 0; row < imgHeight; row++) {
+						for (var col = 0; col < imgWidth; col++) {
+							// console.log(data[((img.width * row) + col) * 4])
+							if (row == 0) {
+								r += data[((imgWidth * row) + col)];
+								g += data[((imgWidth * row) + col) + 1];
+								b += data[((imgWidth * row) + col) + 2];
+							} else {
+								r += data[((imgWidth * row) + col) * 4];
+								g += data[((imgWidth * row) + col) * 4 + 1];
+								b += data[((imgWidth * row) + col) * 4 + 2];
+							}
+						}
+					}
+					// 求取平均值
+					r /= (imgWidth * imgHeight);
+					g /= (imgWidth * imgHeight);
+					b /= (imgWidth * imgHeight);
+					// 将最终的值取整
+					r = Math.round(r);
+					g = Math.round(g);
+					b = Math.round(b);
+					let obj = {
+						r,
+						g,
+						b
+					}
+					resolve(obj);
+				},
+				fail: (fail) => {
+					reject(fail);
+				}
+			});
+		})
+	})
+	return res
+}
+// 网络图片转base64
+export let netUrlTobase64= async (url,suc)=> {
+	let toBase64Url=""
+	toBase64Url= await new Promise(resolve => {
+		uni.request({
+			url: url,
+			method: 'GET',
+			responseType: 'arraybuffer',
+			success(res) {
+				const base64 = wx.arrayBufferToBase64(res.data); //把arraybuffer转成base64
+				const conType =res.header['Content-Type']
+				toBase64Url = 'data:'+conType+';base64,' + base64; //不加上这串字符，在页面无法显示
+				resolve(toBase64Url)
+			}
+		});
+	})
+	return toBase64Url
+}