项目中的公共类封装和公共方法封装

112 阅读2分钟

公共类封装

示例一

import { Loading } from "element-ui";
class IsLoading {
  constructor() {
    this.loadingOption = {
      lock: true,
      text: "Loading",
      spinner: "el-icon-loading",
      background: "rgba(0, 0, 0, 0.7)"
    };
  }
  close() {
    this.loading.close();
  }
  open() {
    this.loading = Loading.service(this.loadingOption);//其中 this.loadingOption 参数为 Loading 的配置项
  }
}
export let MyLoading = IsLoading;

示例二

import {inIt} from '@/Acc-config/init.js'
// 及时反馈
class Feedback{
	constructor(title,icon="error"){
		this.title = title
		this.icon = icon
	}
	
	// 消息提示框
	toast(){
		wx.showToast({
		  title: this.title,
		  icon:this.icon,
		  mask:true,
		  duration: 800
		})
	}
}

// 媒体处理
class Upload{
	constructor(){}
	
	// 上传本地图片
	image(count = 1, type = 'image'){
		return new Promise((resolve,reject)=>{
			wx.chooseMedia({
			  count,
			  mediaType: [type],
			  sourceType: ['album']
			})
			.then(res=>{
				resolve(res.tempFiles)
			})
			.catch(err=>{
				reject(err)
			})
		})
	}
	
	// 上传图片或者视频到云存储
	async cloud(route){
		let imgion = route.lastIndexOf('.')
		let eximg = route.slice(imgion)
		let cloudpath = `${Date.now()}-${Math.floor(Math.random(0,1) * 10000000)}${eximg}`
		let DB = await inIt()
		return new Promise((resolve,reject)=>{
			DB.uploadFile({
			  cloudPath: 'media/' + cloudpath,
			  filePath: route, // 文件路径
			  success: async(res) => {
				const res_url = await DB.getTempFileURL({fileList:[res.fileID]})
				resolve(res_url.fileList[0].tempFileURL)
			  },
			  fail: err => {
				reject(err)
			  }
			})
		})
	}
	
	// 多图上传
	multi(uploads,key){
		let storage = []
		return new Promise((resolve,reject)=>{
			uploads.forEach(async item=>{
				let nm = await this.cloud(item.image)
				storage.push({[key]:nm})
				if(storage.length == uploads.length){
					resolve(storage)
				}
			})
		})
	}
	
	
	
	
	// 预览图片
	preview(image,arr){
		wx.previewImage({
		  current: image, // 当前显示图片的http链接
		  urls: arr // 需要预览的图片http链接列表['htt.xxx.jpg','htt.xxx.jpg']
		})
	}
}

export {Feedback,Upload}

使用

import {Feedback,Upload} from '@/Acc-config/media.js'

// 提交校验
function subMit(){
    switch(true)
    {
            case cover.goods_title == '' : new Feedback('请填写标题').toast()
            break;
            case cover.sto_image.length == 0 : new Feedback('请上传图片').toast()
            break;
            case sortdata.sort_value == '' : new Feedback('请选择分类').toast()
            break;
            case priceinv.price == '' : new Feedback('请输入价格').toast()
            break;
            case priceinv.stock == '' : new Feedback('请输入库存').toast()
            break;
            case detail.sto_detail.length == 0 : new Feedback('请上传详情图').toast()
            break;
            default:database()
    }
}

//图片预览
function preView(image){
    let arr = []
    cover.sto_image.forEach(item=>{arr.push(item.image)})
    new Upload().preview(image,arr)
}

async function upVideo(){
    const local = await new Upload().image(1,'video')
    video.sto_video = local[0].tempFilePath
}

async function database(){
    let res_banner = await new Upload().multi(cover.sto_image,'image')
}

公共方法封装

示例一

// 商户订单号
let outTradeno = function(){
  let chars = 'ABCDEFGHIJKLMNUPQRSTUVWYZabcdefghijklmn2345678'
  let maxPos = chars.length
  let res = ''
  for(let i = 0; i < 32; i++){
    res += chars.charAt(Math.floor(Math.random() * maxPos))
  }
  return res
}

// 订单编号
let coDe = function(){
	let code = ''
	for (let i = 0; i < 6; i++){
		code += Math.floor(Math.random() * 10)
	}
	code = new Date().getTime() + code
	return code
}

export {outTradeno,coDe}

使用
import {outTradeno,coDe } from '@/utils/utils.js'

示例二

export function deepClone (source) {
  if (!source && typeof source !== "object") {
    throw new Error("error arguments", "deepClone");
  }
  const targetObj = source.constructor === Array ? [] : {};
  Object.keys(source).forEach(keys => {
    if (source[keys] && typeof source[keys] === "object") {
      targetObj[keys] = deepClone(source[keys]);
    } else {
      targetObj[keys] = source[keys];
    }
  });
  return targetObj;
}

使用
import { deepClone } from '@/utils/utils.js'

示例三

export default {
    //加密
    encrypt(word, keyStr) {
        keyStr = keyStr ? keyStr : 'ciMc1p9szBqxZcL8';
        var key = CryptoJS.enc.Utf8.parse(keyStr);//Latin1 w8m31+Yy/Nw6thPsMpO5fg==
        var srcs = CryptoJS.enc.Utf8.parse(word);
        var encrypted = CryptoJS.AES.encrypt(srcs, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 });
        return encrypted.toString();
    },
    //解密
    decrypt(word, keyStr) {
        keyStr = keyStr ? keyStr : 'ciMc1p9szBqxZcL8';
        var key = CryptoJS.enc.Utf8.parse(keyStr);//Latin1 w8m31+Yy/Nw6thPsMpO5fg==
        var decrypt = CryptoJS.AES.decrypt(word, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 });
        return CryptoJS.enc.Utf8.stringify(decrypt).toString();
    }

}

使用
import aes from "@/utils/aes";
parm.oldPassword = aes.encrypt(parm.oldPassword);