工具函数

全局函数

提示

全局函数已经全部挂载至Vue的原型链上，各个组件中可以直接通过 this. 来使用全局函数，不需要额外的引用

this.msgSuccess('成功提示信息')

成功提示

msgSuccess(msg):void

说明：系统的成功提示

参数	说明	类型	必填	可选值	默认值
msg	成功提示的消息内容	String	是	——	——

错误提示

msgError(msg):void

说明：系统的错误提示

参数	说明	类型	必填	可选值	默认值
msg	错误提示的消息内容	String	是	——	——

信息提示

msgInfo(msg):void

说明：系统的信息提示

参数	说明	类型	必填	可选值	默认值
msg	信息提示的消息内容	String	是	——	——

数据字典

getDicts(dictkey):Promise<dicts>

说明：获取系统的数据字典键值对

参数	说明	类型	必填	可选值	默认值
dictkey	待获取数据字典的KEY值	String	是	——	——

返回值：当前 dictkey 的数据字典信息

this.getDicts("字典类型").then(response => {
  this.xxxxx = response.data;
});

框架配置

getConfigKey(configkey):Promise<config>

说明：获取系统框架的配置

参数	说明	类型	必填	可选值	默认值
configkey	待获取框架的KEY值	String	是	——	——

返回值：当前 configkey 的框架的配置信息

this.getConfigKey("参数键名").then(response => {
  this.xxxxx = response.msg;
});

构造树型结构数据

handleTree(data, id, parentId, children, rootId):Array<Object>

说明：将数组对象结构转为树形结构

参数	说明	类型	必填	可选值	默认值
data	数据源	Array	是	——	——
id	id字段	String	否	——	id
parentId	父节点字段	String	否	——	parentId
children	孩子节点字段	String	否	——	children
rootId	根Id	String	否	——	0

返回值：数组对象结构转为树形结构处理后结果

// 示列
const treeList = [
  {
      title: '系统管理',
      parentName: '',
      parentId: 0,
      id: 1,
  },
  {
      title: '菜单管理',
      parentName: '系统管理',
      parentId: 1,
      id: 11,
  },
  {
      title: '菜单新增',
      parentName: '菜单管理',
      parentId: 11,
      id: 111,
  }
];
// Vue原型链上已经含有 handleTree，可以在组件内部直接通过 this 调用
let ret = this.handleTree(treeList)
/* console.log(ret) 结果 
[ { title: '系统管理',
    parentName: '',
    parentId: 0,
    id: 1,
    children: [ [Object] ] } ]
*/

字典回显

selectDictLabel(datas,value):string

说明：获取字典 value 对应的 label 值,用于字典回显

参数	说明	类型	必填	可选值	默认值
datas	字典数据	Array	是	——	——
value	字典数据value值	String/Number	是	——	——

返回值：当前字典 value 对应的 label 值,用于字典回显

// 获取字典回显值
this.selectDictLabel(dictArr,1)

table 数据字典列翻译示例

// 字典回显使用场景举例，在Table表格中部分数据为数据字典的value值，需要将value转换为字典的键值(key)
// 1. 一般我们会在组件初始化后调用 getConfigKey 方法，获取数据字典的数据，这里只初始化一次，方便后面使用
created() {
  // 获取通知类型
  this.getDicts('sys_notice_type').then(response => {
    this.typeOptions = response.data
  })
}
// 2. 当 table 表格展示数据时需要转换数据字典，table的列上 含有属性 formatter，用于格式化显示数据
<el-table-column
  label="公告类型"
  align="center"
  prop="noticeType"
  :formatter="typeFormat"
  width="100"
/>
// 3. 在vue组件中定义方法 typeFormat ，并使用 selectDictLabel 方法将数据字典的 value 转换为 key。
methods：{
   // 公告状态字典翻译
    typeFormat(row, column) {
      return this.selectDictLabel(this.typeOptions, row.noticeType)
    }
}

日期格式化

parseTime(time, pattern):string

说明：日期格式化

参数	说明	类型	必填	可选值	默认值
time	待格式化的日期	String	是	——	——
pattern	自定义格式化的正则	String	否	——	{y}-{m}-{d} {h}:{i}:{s}

表单重置

resetForm(refName):void

说明：通过表单引用名称，重置当前表单项

参数	说明	类型	必填	可选值	默认值
refName	待重置的表单名称引用	String	是	——	——

日期范围

addDateRange(params, dateRange):Object

说明：通格式化处理接口参数，动态处理日期范围搜索项

参数	说明	类型	必填	可选值	默认值
params	待处理的参数	Object	是	——	——
dateRange	待格式化的时间范围	Object	是	——	——

通用下载

download(fileName, isUploadFile , rename):Promise<string>

说明：下载系统内的文件 2020/4/10 去除第三个参数需携带文件后缀，简化使用者处理逻辑

参数	说明	类型	必填	可选值	默认值
fileName	待下载的文件名称	String	是	——	——
isUpload	是否是上传的文件	Boolean	否	——	false
rename	下载后文件名称，注意不需要带文件后缀	String	否	——	fileName

文件删除

deleteFile(filePath):Promise<any>

说明：删除服务端已上传的文件

参数	说明	类型	必填	可选值	默认值
filePath	上传成功后返回的 filePath	String	是	——	——

示例

// 下载平台内部静态资源，因不是通过上传组件上传的文件所以将第二个参数设为 false,第三个参数为重命名可以不填
this.download('xxx.xls',false,'myexcel')
// 下载前端上传的文件
this.download('/upload/profile/file/aaa.jpg',true,'刚刚下载的图片')

局部函数

提示

因 局部函数 没有 全局函数 使用频率高，所以在使用 局部函数 前需要提前进行引用

// 例：引用局部函数
import { getQueryObject } from '@/utils'

获取 URL 路径 Query参数

getQueryObject(url?:string):Object

参数	说明	类型	必填	可选值	默认值
url	待解析URL	String	否	——	location.href

局部函数（ASPDEV）

提示

因 局部函数 没有 全局函数 使用频率高，所以在使用 局部函数 前需要提前进行引用

// 例：引用局部函数
import { handleClipboard,encrypt,decrypt } from '@/utils/aspdev'

复制文本

handleClipboard(text, event):void

说明：复制文本到剪切板

参数	说明	类型	必填	可选值	默认值
text	待复制的文本内容	String	是	——	——
event	当前操作的事件	Object	是	——	——

加密文本

encrypt(txt):string

参数	说明	类型	必填	可选值	默认值
txt	待加密的文本内容	String	是	——	——

解密文本

decrypt(txt):string

参数	说明	类型	必填	可选值	默认值
txt	待解密的文本内容	String	是	——	——