vue request底层封装

本项目使用了vue3,但也适用vue2。接口请求底层封装的好后期开发和维护成本会低,本码农开发多年一直致力于简化代码,后期维护成本低。当前的接口请求是我去其槽粕取其精华,非常推荐大家这样封装。

使用方法

<template>
template>
<script>
import api from '@/apis/getdata.js'
export default {
  data() {
    return { }
  },
  mounted() {
    this.getlist()
  },
  methods: {
    getlist() {
      api.getlist().then(res => {
        if (res.code === 200) {
        } else {
        }
      })
    },
   },
}
script>
<style lang="less" scoped>
style>

apis/getdata.js

// getdata.js
import request from '@/libs/request.js';
export default {
    // 请求方法
    'getlist': function (data) {
        return request.get('/api/getdata/getlist', data, {}, 'pro')
    }, 
    'getDIST': function (options) {
        return request.post('/api/getdata/getDIST', {}, options, 'pro')
    }, 
};
请求底层架构
下面的代码 直接复制起来,调整好每个文件对应的路径

request.js

import axios from 'axios'
import Bus from './bus'
import util from './util.js';

import ViewUI from 'view-design';

// http request 拦截器
axios.interceptors.response.use(
    response => {
        return response
    },
    //接口错误状态处理,也就是说无响应时的处理
    error => {
        if (error.response.status == 403) {
            Bus.$emit('Illegalcalls');
        } else if (error.response.status == 400) {
            ViewUI.Notice.error({ title: 'Service Error 400', desc: '参数错误,请检查参数信息' });
        } else if (error.response.status == 404) {
            ViewUI.Notice.error({ title: 'Service Error 404', desc: '未找到接口,请检查链接地址' });
        } else if (error.response.status == 500) {
            ViewUI.Notice.error({ title: 'Service Error 500', desc: '服务器出现错误' });
        } else if (error.response.status == 502) {
            ViewUI.Notice.error({ title: 'Service Error 502', desc: '服务器响应出现错误' });
        } else {
            ViewUI.Notice.error({ title: 'Service Error' + error.response.status, desc: '链接异常,请检查错误信息' });
        }
        return Promise.reject(error) // 返回接口返回的错误信息
        // return Promise.reject(error.response.status) // 返回接口返回的错误信息
    })

let AxiosEventCatch = {};

/**
 * 隐藏 loading 方法
 *
 * @param {*} id
 * @memberof Request
 */
const hideLoading = function (id) {
    delete AxiosEventCatch[id];
    if (Object.keys(AxiosEventCatch).length == 0) {
        Bus.$emit('loading-change', false)
    }
}

const Event = function (options) {
    var id = util.Guid();
    if (options.loading !== false) {
        AxiosEventCatch[id] = '';
        Bus.$emit('loading-change', true)
    }
    var baseUrlPath = ''
    if (process.env.NODE_ENV == 'development') {
        try {
            baseUrlPath = window.WIN_COMFIG.service[options.reqType]
        } catch (error) {
            baseUrlPath = window.WIN_COMFIG.service.pro
        }
    } else {
        // baseUrlPath = location.protocol
		baseUrlPath = window.WIN_COMFIG.service.pro
    }

    var _url = baseUrlPath + options.url;
    var _params = JSON.parse(JSON.stringify(options.params));
    _url = _url.replace(/\{\w+\}/g, function (i) {
        var _src = i.replace('{', '').replace('}', '');
        if (_params.hasOwnProperty(_src)) {
            var _value = _params[_src];
            delete _params[_src];
            return _value;
        }
    });

    return axios({
        method: options.type,
        url: _url,
        params: _params,
        data: options.data
    }).then(function (res) {
        if (options.loading !== false) {
            hideLoading(id);
        }
        return res.data;
    }).catch(function (err) {
        if (options.loading !== false) {
            hideLoading(id);
        }
        throw err.response
    });
}

export default {

    /**
     * apis 接口调用参数
     *
     * @param {String} url  链接地址
     * @param {Object} params Url 传参对象
     * @param {Object} data PostData 传参对象
     * @param {String} reqType 开发模式下, 链接地址指向
     * @param {Blob} loading 是否显示loading 开关
     * @return {axios} 接口异步对象
     */
    post(url, params, data, reqType, loading) {
        var _data = {};
        _data.type = 'post';
        _data.data = data || {};
        _data.reqType = reqType;
        _data.params = params;
        _data.url = url;
        _data.loading = loading
        return Event(_data)
    },
    get(url, params, data, reqType, loading) {
        var _data = {};
        _data.type = 'get';
        _data.data = data || {};
        _data.reqType = reqType;
        _data.params = params;
        _data.url = url;
        _data.loading = loading
        return Event(_data)
    },
    put(url, params, data, reqType, loading) {
        var _data = {};
        _data.type = 'put';
        _data.data = data || {};
        _data.reqType = reqType;
        _data.params = params;
        _data.url = url;
        _data.loading = loading
        return Event(_data)
    },
    delete(url, params, data, reqType, loading) {
        var _data = {};
        _data.type = 'delete';
        _data.data = data || {};
        _data.reqType = reqType;
        _data.params = params;
        _data.url = url;
        _data.loading = loading
        return Event(_data)
    }
}

bus.js 这个问题只有是为了处理 接口请求加载等待条显示和隐藏的问题

import vue from 'vue'
// 全局通知事件
export default new vue({});

全局请求地址 路径/public/config.js

// 开发模式 全局配置文件
var WIN_COMFIG = {
    // 版本号
    version: '1.0.0',
    // 地址请求环境配置 (部署模式用)
    service: {
        pro: 'http://192.168.11.51:30771'
    },
};
console.log('当前版本 : ' + WIN_COMFIG.version);

工具 util.js 可以单独把Guid()方法拿出来,使用Guid()方法主要解决加载带条的问题。

 // 整理基本库方法
/** @type {Object} 正则库 */
var regulars = {
    year: {
        regExp: /^(19|20)\d{2}$/,
        message: "只能为年份(四位,1900-2099)"
    },
    number: {
        regExp: /^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/,
        message: "只能为数字"
    },
    bankNum: {
        regExp: /^\d{16}|\d{19}$/,
        message: "格式错误"
    },
    telephone: {
        regExp: /^(0[0-9]{2,3}-)?([2-9][0-9]{6,7})+(-[0-9]{1,4})?$/,
        message: "格式错误"
    },
    int: {
        regExp: /^[0-9]*$/,
        message: "只能为正整数"
    },
    phone: {
        regExp: /^[1][0-9]{10}$/,
        message: "格式错误"
    },
    allChinese: {
        regExp: /^([\u4E00-\u9FA5]+,?)+$/,
        message: "只能为中文"
    },
    haveChinese: {
        regExp: "[\\u4E00-\\u9FFF]+",
        message: "中含有汉字"
    },
    idCard15: {
        regExp: /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/,
        message: "格式错误"
    },
    idCard18: {
        regExp: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$/,
        message: "格式错误"
    },
    url: {
        regExp: /^((https|http|ftp|rtsp|mms)?:\/\/)[^\s]+/,
        message: "格式错误"
    },
    email: {
        regExp: /^[-_A-Za-z0-9]+@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/,
        message: "格式错误"
    },
    Special: {
        regExp: ["~", "`", "!", "@", "#", "$", "%", "^", "&", "*", "{", "}", "[", "]", "(", ")", ":", ";", "'", "|", "\\", "<", ">", "?", "/", "<<", ">>", "||", "//", "administrators", "administrator", "管理员", "系统管理员", "admin", "select", "delete", "update", "insert", "create", "drop", "alter", "trancate"],
        message: "不能包含特殊字符"
    },
    null: {
        regExp: "^[ ]+$",
        message: "不能为空"
    },
};

/**
 *
 * 判断对象是否完全一致
 * @param {*} a
 * @param {*} b
 * @return {*} 
 */
const isEqual = function (a, b) {
    if (a === b) {
        return a !== 0 || 1 / a === 1 / b;
    };
    if (a == null || b == null) {
        return a === b;
    };
    var A = Object.prototype.toString.call(a);
    var B = Object.prototype.toString.call(b);
    if (A !== B) {
        return false;
    };
    switch (A) {
        case '[object RegExp]':
        case '[object String]':
            return '' + a === '' + b;
        case '[object Number]':
            if (+a !== +a) {
                return +b !== +b;
            };
            return +a === 0 ? 1 / +a === 1 / b : +a === +b;
        case '[object Date]':
        case '[object Boolean]':
            return +a === +b;
    };
    if (A == '[object Object]') {
        if (JSON.stringify(a) != JSON.stringify(b)) {
            return false;
        };
        return true;
    };
    if (A == '[object Array]') {
        if (a.toString() == b.toString()) {
            return true;
        }
        return false;
    };
};
/**
 * 判断是否在数组中,(
 *
 * @param {*} str
 * @param {*} _array
 * @return {*} 
 */
const inArray = function (str, _array) {
    let isInArray = -1;
    for (let i = 0; i < _array.length; i++) {
        const element = _array[i];
        if (isEqual(element, str)) {
            isInArray = i;
            break;
        };
    };
    return isInArray;
};

// 

/**
 * 获取对象key值列表
 *
 * @param {*} obj
 * @return {*} 
 */
const getKeyArray = function (obj) {
    var _array = [];
    eachObject(obj, function (item, key) {
        _array.push(key);
    });
    return _array;
};

// 
/**
 * 将数组以 key 对应属性 为键值 转换为对象,key值默认为ID;
 *
 * @param {*} _array
 * @param {*} key
 * @return {*} 
 */
const converArrayToObj = function (_array, key) {
    var obj = {};
    key = key || 'id';

    var canConver = true;
    for (let i = 0; i < _array.length; i++) {
        const element = _array[i];
        if (element.hasOwnProperty(key)) {
            obj[element[key].toString()] = element;
        } else {
            canConver = false;
        }
    };
    if (canConver) {
        return obj;
    } else {
        console.error('对象转换错误 :未找到对应Key值');
        return obj;
    };
};

// 

/**
 * 历遍对象,并执行方法
 *
 * @param {*} obj
 * @param {*} callback
 */
const eachObject = function (obj, callback) {
    for (const key in obj) {
        if (obj.hasOwnProperty(key)) {
            const element = obj[key];
            var value = callback(element, key);
            if (value === false) {
                break;
            };
        }
    };
};


/**
 * 验证方法
 *
 * @param {*} type
 * @param {*} str
 * @return {*} 
 */
function test(type, str) {
    var re = new RegExp(regulars[type].regExp);
    return !re.test(str) ? true : false;
};

// 验证用方法集合
var verifyObj = {
    year: {
        event: value => { return test('year', value) },
        message: regulars.year.message,
    },
    number: {
        event: value => { return test('number', value) },
        message: regulars.number.message
    },
    bankNum: {
        event: value => { return test('bankNum', value) },
        message: regulars.bankNum.message
    },
    telephone: {
        event: value => { return test('telephone', value) },
        message: regulars.telephone.message
    },
    int: {
        event: value => { return test('int', value) },
        message: regulars.int.message
    },
    phone: {
        event: value => { return test('phone', value) },
        message: regulars.phone.message
    },
    url: {
        event: value => { return test('url', value) },
        message: regulars.url.message
    },
    email: {
        event: value => { return test('email', value) },
        message: regulars.email.message
    },
    allChinese: {
        event: value => { return test('allChinese', value) },
        message: regulars.allChinese.message
    },
    haveChinese: {
        event: function (str) {
            var re = new RegExp(regulars.haveChinese.regExp);
            return re.test(str) ? true : false;
        },
        message: regulars.haveChinese.message
    },
    notNull: {
        event: function (str) {
            if (str == "" || str == undefined || str == null || str == NaN) return !false;
            var re = new RegExp(regulars.null.regExp);
            return re.test(str);
        },
        message: regulars.null.message
    },
    isSpecial: {
        event: function (str) {
            str = str.toLowerCase();
            for (var i = 0; i < regulars.Special.regExp.length; i++) {
                if (str.indexOf(regulars.Special.regExp[i]) >= 0) {
                    return false;
                }
            }
            return true;
        },
        message: regulars.Special.message
    },
    isIdCard: {
        event: function (str) {
            var re1 = new RegExp(regulars.idCard15.regExp);
            var re2 = new RegExp(regulars.idCard18.regExp);
            return !(re1.test(str) || re2.test(str) ? true : false);
        },
        message: regulars.idCard18.message
    }
};

// 

/**
 * 判断变量是否为某一值
 *
 * @param {*} obj
 * @param {*} type
 * @return {*} 
 */
const is = function (obj, type) {
    if (type) {
        var result = null;
        var objectString = Object.prototype.toString.call(obj);
        switch (type) {
            case "string":
                result = objectString == "[object String]";
                break;
            case "function":
                result = objectString == "[object Function]";
                break;
            case "array":
                result = objectString == "[object Array]";
                break;
            case "number":
                result = objectString == "[object Number]" && obj === obj;
                break;
            case "date":
                result = objectString == "[object Date]";
                break;
            case "object":
                result = objectString == "[object Object]";
                break;
            case "bool":
                result = objectString == "[object Boolean]";
                break;
            case "regExp":
                result = objectString == "[object RegExp]";
                break;
            case "null":
                result = objectString == "[object Null]";
                break;
            case "undefined":
                result = objectString == "[object Undefined]";
                break;
            case "NaN":
                result = (obj !== obj);
                break;
        };
        return result;
    } else {
        var mold = null;
        var objectString = Object.prototype.toString.call(obj);
        switch (objectString) {
            case "[object String]":
                mold = "string";
                break;
            case "[object Function]":
                mold = "function";
                break;
            case "[object Array]":
                mold = "array";
                break;
            case "[object Number]":
                if (obj !== obj) {
                    mold = "NaN";
                } else {
                    mold = "number"
                };
                break;
            case "[object Date]":
                mold = "date";
                break;
            case "[object Object]":
                mold = "object";
                break;
            case "[object Boolean]":
                mold = "bool";
                break;
            case "[object RegExp]":
                mold = "regExp";
                break;
            case "[object Null]":
                mold = "null";
                break;
            case "[object Undefined]":
                mold = "undefined";
                break;
        };
        return mold;
    };
};

/**
 * 自定义判断位数区间
 *
 * @param {*} type
 * @param {*} str
 * @return {*} 
 */
const customLength = function (type, str) {
    var name = type.split('$');
    var length = str.toString().length;
    var nums = parseInt(name[1]);
    if (name[0] == 'les') {
        return !(length > nums) ? '不能小于' + nums + '位' : false;
    } else if (name[0] == 'gre') {
        var nums = parseInt(name[1]);
        return !(length <= nums) ? '不能大于' + nums + '位' : false;
    } else {
        console.error('error => 未找到验证规则:' + type);
    };
};

// 

/**
 * 正则验证方法
 *
 * @param {*} value
 * @param {*} type
 * @return {*} 
 */
const jude = function (value, type) {
    var keyArray = getKeyArray(verifyObj);
    if (type.indexOf('$') != -1) {
        return customLength(type, value);
    } else if (inArray(type, keyArray) != -1) {
        var answer = verifyObj[type].event(value);
        return answer ? verifyObj[type].message : false;
    } else {
        console.error('error => 未找到验证规则:' + type);
    };
};


/**
 * 按照规则进行验证
 *
 * @param {*} singleRule
 * @param {*} value
 * @param {*} text
 * @return {*} 
 */
const verifyRule = function (singleRule, value, text) {
    // 返回对象类型
    var ruleType = is(singleRule);
    if (ruleType == 'string') {
        // 当为String类型时,去默认验证方法中寻找
        var result = jude(value, singleRule);
        if (result) {
            return text + result;
        } else {
            return false;
        };
    } else if (ruleType == 'function') {
        // 当为方法类型时,执行方法,并返回验证 (方法通过,返回false,否则返回错误语句);
        var result = singleRule(value);
        if (result) {
            return result;
        } else {
            return false;
        };
    } else if (ruleType == 'object' && singleRule.regExp && is(singleRule.regExp, 'regExp')) {
        // 当对象方法为正则表达式时,直接使用正则表达式进行判断
        var errorText = singleRule.errorText;
        var regular = singleRule.regExp;
        var re = new RegExp(regular);
        if (re.test(value)) {
            return false;
        } else {
            return errorText;
        };
    } else {
        // 其他类型直接跳过,控制台输出错误信息
        console.error('rule模块 : 未识别的判断类型');
        return false;
    };
};


/**
 * 规则验证
 *
 * @param {*} rulesObj
 * @param {*} value
 * @return {*} 
 */
const rules = function (rulesObj, value) {
    var text = rulesObj.text;
    var rulesArray = rulesObj.rules;
    if (!rulesArray) {
        return false;
    };
    // 判断是否为数组
    if (is(rulesArray, 'array')) {
        // 跳过非空验证
        // if ($.inArray("notNull", rulesArray) == -1 && (value == '' || value === null)) {
        //     return false;
        // };
        // 进行循环验证
        var _text = false;
        for (var i = 0; i < rulesArray.length; i++) {
            var element = rulesArray[i];
            var result = verifyRule(element, value, text);
            if (result) {
                _text = result;
                break;
            };
        };
        if (_text) {
            return _text;
        } else {
            return false;
        };
    } else if (is(rulesArray, 'string')) {
        // 进行单条验证
        var result = verifyRule(rulesArray, value, text);
        if (result) {
            return result;
        } else {
            return false;
        };
    } else if (is(rulesArray, 'function')) {
        // 进行单条验证
        var result = verifyRule(rulesArray, value, text);
        if (result) {
            return result;
        } else {
            return false;
        };
    }
};


/**
 * 深拷贝对象
 *
 * @param {*} obj
 * @return {*} 
 */
var clone = function (obj) {
    if (obj === null) return null
    if (typeof obj !== 'object') return obj;
    if (obj.constructor === Date) return new Date(obj);
    var newObj = new obj.constructor();  //保持继承链
    for (var key in obj) {
        if (obj.hasOwnProperty(key)) {   //不遍历其原型链上的属性
            var val = obj[key];
            newObj[key] = typeof val === 'object' ? clone(val) : val;
        }
    }
    return newObj;
}

// 


/**
 * 添加验证方法
 *
 * @param {*} obj
 * @param {*} key
 * @return {*} 
 */
const setJudeRule = function (obj, key) {
    if (verifyObj.hasOwnProperty(key)) {
        console.error('key值重复,不可添加');
        return;
    };
    if (obj.hasOwnProperty('event') && obj.hasOwnProperty('message')) {
        verifyObj[key] = obj;
    } else {
        console.error('添加的验证方法不符合规范');
        return;
    }
};


/**
 * 获取嵌套层级
 *
 * @param {*} treeData
 * @param {*} key
 * @return {*} 
 */
var getMaxFloor = function (treeData, key) {
    let floor = 0
    let v = this
    let max = 0
    function each(data, floor) {
        data.forEach(e => {
            e.floor = floor
            if (floor > max) {
                max = floor
            }
            if (e.hasOwnProperty(key)) {
                const element = e[key];
                if (element.length > 0) {
                    each(element, floor + 1)
                }
            };
        })
    }
    each(treeData, 1)
    return max
};

/**
 * 生成GUID
 *
 * @return {*} 
 */
var Guid = function () {
    var guid = '';
    for (var i = 1; i <= 32; i++) {
        var n = Math.floor(Math.random() * 16.0).toString(16);
        guid += n;
        if ((i == 8) || (i == 12) || (i == 16) || (i == 20))
            guid += '-';
    }
    return guid;
};


/**
 * 生成UUID
 *
 * @return {*} 
 */
var uuid = function () {
    var uuid = '';
    for (var i = 1; i <= 32; i++) {
        var n = Math.floor(Math.random() * 16.0).toString(16);
        uuid += n;
    }
    return uuid;
};

var fileType = {
    'image': ['webp', 'baidubmp', 'pcx', 'tif', 'gif', 'jpeg', 'jpg', 'tga', 'exif', 'fpx', 'svg', 'pcd', 'dxf', 'ufo', 'png', 'hdri', 'wmf', 'flic', 'emf', 'ico'],
    'psd': ['psd'],
    'cad': ['cdr', 'ai', 'eps', 'raw'],
    'text': ['txt'],
    'html': ['htm', 'html'],
    'mirror': ['iso', 'bin', 'img', 'tao', 'dao', 'cif', 'fcd'],
    'video': ['avi', 'mpeg', 'mpg', 'flv', 'dat', 'ra', 'rm', 'rmvb', 'mov', 'qt', 'asf', 'wmv', 'mkv'],
    'mp3': ['mp3', 'wma', 'mpg', 'wav', 'mv'],
    'zip': ['rar', 'zip', '7z', 'tar', 'xz', 'gz'],
    'xsl': ['xls', 'xlsx'],
    'ppt': ['ppt', 'pptx'],
    'doc': ['doc', 'docx'],
    'pdf': ['pdf'],
    'config': ['conf', 'config', 'ini'],
};

var fileTypeMapping = {};
for (const key in fileType) {
    if (fileType.hasOwnProperty(key)) {
        for (let i = 0; i < fileType[key].length; i++) {
            const element = fileType[key][i];
            fileTypeMapping[element] = key
        };
    }
}

/**
 * 获取后缀名图标类别
 *
 * @param {*} url
 * @return {*} 
 */
var getSuffixType = function (url) {
    var suffix = url.substring(url.lastIndexOf(".") + 1, url.length);
    if (fileTypeMapping.hasOwnProperty(suffix.toLowerCase())) {
        const element = fileTypeMapping[suffix.toLowerCase()];
        return element;
    } else {
        return 'file'
    }
};


/**
 * 获取Url参数
 *
 * @param {*} variable
 * @return {*} 
 */
function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (pair[0] == variable) { return pair[1]; }
    }
    return (false);
};

/**
 * 获取浏览器信息
 *
 * @param {*} key
 * @return {*} 
 */
function device(key) {
    var agent = navigator.userAgent.toLowerCase();

    //获取版本号
    var getVersion = function (label) {
        var exp = new RegExp(label + '/([^\\s\\_\\-]+)');
        label = (agent.match(exp) || [])[1];
        return label || false;
    };

    //返回结果集
    var result = {
        os: function () { //底层操作系统
            if (/windows/.test(agent)) {
                return 'windows';
            } else if (/linux/.test(agent)) {
                return 'linux';
            } else if (/iphone|ipod|ipad|ios/.test(agent)) {
                return 'ios';
            } else if (/mac/.test(agent)) {
                return 'mac';
            }
        }(),
        ie: function () { //ie版本
            return (!!window.ActiveXObject || "ActiveXObject" in window) ? (
                (agent.match(/msie\s(\d+)/) || [])[1] || '11' //由于ie11并没有msie的标识
            ) : false;
        }(),
        weixin: getVersion('micromessenger')  //是否微信
    };

    //任意的key
    if (key && !result[key]) {
        result[key] = getVersion(key);
    }

    //移动设备
    result.android = /android/.test(agent);
    result.ios = result.os === 'ios';
    result.mobile = (result.android || result.ios) ? true : false;

    return result;
};


//拆分整数与小数
function splits(tranvalue) {
    var value = new Array('', '');
    var temp = tranvalue.split(".");
    for (var i = 0; i < temp.length; i++) {
        value[i] = temp[i];
    }
    return value;
}

/**
 * 数字转汉字
 *
 * @param {*} tranvalue
 * @return {*} 
 */
function transformSmallNumber(tranvalue) {
    try {
        tranvalue = tranvalue.toString();
        var i = 1;
        var dw2 = new Array("", "万", "亿");//大单位
        var dw1 = new Array("十", "百", "千");//小单位
        var dw = new Array("零", "一", "二", "三", "四", "五", "六", "七", "八", "九");//整数部分用
        //以下是小写转换成大写显示在合计大写的文本框中     
        //分离整数与小数
        var source = splits(tranvalue);
        var num = source[0];
        var dig = source[1];

        //转换整数部分
        var k1 = 0;//计小单位
        var k2 = 0;//计大单位
        var sum = 0;
        var str = "";
        var len = source[0].length;//整数的长度
        for (i = 1; i <= len; i++) {
            var n = source[0].charAt(len - i);//取得某个位数上的数字
            var bn = 0;
            if (len - i - 1 >= 0) {
                bn = source[0].charAt(len - i - 1);//取得某个位数前一位上的数字
            }
            sum = sum + Number(n);
            if (sum != 0) {
                str = dw[Number(n)].concat(str);//取得该数字对应的大写数字,并插入到str字符串的前面
                if (n == '0') sum = 0;
            }
            if (len - i - 1 >= 0) {//在数字范围内
                if (k1 != 3) {//加小单位
                    if (bn != 0) {
                        str = dw1[k1].concat(str);
                    }
                    k1++;
                } else {//不加小单位,加大单位
                    k1 = 0;
                    var temp = str.charAt(0);
                    if (temp == "万" || temp == "亿")//若大单位前没有数字则舍去大单位
                        str = str.substr(1, str.length - 1);
                    str = dw2[k2].concat(str);
                    sum = 0;
                }
            }
            if (k1 == 3)//小单位到千则大单位进一
            { k2++; }
        };
        // //转换小数部分
        var strdig = "";
        if (dig != "") {
            var n = dig.charAt(0);
            if (n != 0) {
                strdig += '点' + dw[Number(n)];//加数字
            }
            var n = dig.charAt(1);
            if (n != 0) {
                strdig += dw[Number(n)];//加数字
            };
            var n = dig.charAt(2);
            if (n != 0) {
                strdig += dw[Number(n)];//加数字
            };
            var n = dig.charAt(3);
            if (n != 0) {
                strdig += dw[Number(n)];//加数字
            };
            var n = dig.charAt(4);
            if (n != 0) {
                strdig += dw[Number(n)];//加数字
            }
        }
        str += strdig;

        str = str.replace(/^一十/, '十');

    } catch (e) {
        return "转换错误";
    }
    return str;
};

// 定义转换函数

/**
 * 钱数转大写
 *
 * @param {*} tranvalue
 * @return {*} 
 */
function transformBigNumber(tranvalue) {
    try {
        tranvalue = tranvalue.toString();
        var i = 1;
        var dw2 = new Array("", "万", "亿");//大单位
        var dw1 = new Array("拾", "佰", "仟");//小单位
        var dw = new Array("零", "壹", "贰", "叁", "肆", "伍", "陆", "柒", "捌", "玖");//整数部分用
        //以下是小写转换成大写显示在合计大写的文本框中     
        //分离整数与小数
        var source = splits(tranvalue);
        var num = source[0];
        var dig = source[1];

        //转换整数部分
        var k1 = 0;//计小单位
        var k2 = 0;//计大单位
        var sum = 0;
        var str = "";
        var len = source[0].length;//整数的长度
        for (i = 1; i <= len; i++) {
            var n = source[0].charAt(len - i);//取得某个位数上的数字
            var bn = 0;
            if (len - i - 1 >= 0) {
                bn = source[0].charAt(len - i - 1);//取得某个位数前一位上的数字
            }
            sum = sum + Number(n);
            if (sum != 0) {
                str = dw[Number(n)].concat(str);//取得该数字对应的大写数字,并插入到str字符串的前面
                if (n == '0') sum = 0;
            }
            if (len - i - 1 >= 0) {//在数字范围内
                if (k1 != 3) {//加小单位
                    if (bn != 0) {
                        str = dw1[k1].concat(str);
                    }
                    k1++;
                } else {//不加小单位,加大单位
                    k1 = 0;
                    var temp = str.charAt(0);
                    if (temp == "万" || temp == "亿")//若大单位前没有数字则舍去大单位
                        str = str.substr(1, str.length - 1);
                    str = dw2[k2].concat(str);
                    sum = 0;
                }
            }
            if (k1 == 3)//小单位到千则大单位进一
            { k2++; }
        }

        //转换小数部分
        var strdig = "";
        if (dig != "") {
            var n = dig.charAt(0);
            if (n != 0) {
                strdig += dw[Number(n)] + "角";//加数字
            }
            var n = dig.charAt(1);
            if (n != 0) {
                strdig += dw[Number(n)] + "分";//加数字
            }
        }
        str += "元" + strdig;
    } catch (e) {
        return "0元";
    }
    return str;
}

/**
 * 是否为链接地址 验证方法
 * 
 * @param {string} path
 * @returns {Boolean}
 */
function isExternal(path) {
    return /^(https?:|mailto:|tel:)/.test(path)
}


/**
 * 通过 URL 地址获取参数
 */
function getUrlParam() {
    let href = window.location.href
    if (href.indexOf('?') > -1) {
        let paramStr = href.split('?')[1]
        let paramArr = paramStr.split('&')
        let returnObj = {}
        for (let i = 0; i < paramArr.length; i++) {
            let paramItem = paramArr[i].split('=')
            returnObj[paramItem[0]] = paramItem[1]
        }
        return returnObj
    } else {
        return {}
    }
}

/**
 * 判断是否为数字
 *
 * @param {*} obj
 * @return {*} 
 */
function isNumber(obj) {
    return obj == +obj
}


/**
     * @param {Object} fmt 如:YYYY-mm-dd HH:MM:SS表示2019-06-06 19:45:00
     * @notice 苹果环境、safari 浏览器建议日期格式使用 YYYY/mm/dd
     */
function format(date, fmt) {
    let ret
    const opt = {
        "Y+": date.getFullYear().toString(), // 年
        "m+": (date.getMonth() + 1).toString(), // 月
        "d+": date.getDate().toString(), // 日
        "H+": date.getHours().toString(), // 时
        "M+": date.getMinutes().toString(), // 分
        "S+": date.getSeconds().toString() // 秒
        // 有其他格式化字符需求可以继续添加,必须转化成字符串
    }
    for (let k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt)
        if (ret) {
            fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
        }
    }
    return fmt
}



export default {
    getUrlParam,
    device,
    rules,
    uuid,
    Guid,
    inArray,
    getKeyArray,
    eachObject,
    is,
    jude,
    isEqual,
    setJudeRule,
    converArrayToObj,
    clone,
    getMaxFloor,
    getSuffixType,// 获取文件后缀名
    getQueryVariable,
    transformBigNumber,
    transformSmallNumber,
    isExternal,
    isNumber,
    format
}

你可能感兴趣的:(es6,JavaScript,vue,vue.js,javascript,前端)