1.将excel文件中的日期格式的内容转回成标准时间
// 把excel文件中的日期格式的内容转回成标准时间
export function formatExcelDate(numb, format = '/') {
const time = new Date((numb - 25567) * 24 * 3600000 - 5 * 60 * 1000 - 43 * 1000 - 24 * 3600000 - 8 * 3600000)
time.setYear(time.getFullYear())
const year = time.getFullYear() + ''
const month = time.getMonth() + 1 + ''
const date = time.getDate() + ''
if (format && format.length === 1) {
return year + format + month + format + date
}
return year + (month < 10 ? '0' + month : month) + (date < 10 ? '0' + date : date)
}
2.中文key转为英文key
后端需要的数据是这样的格式的
[{'姓名':'小张', '手机号': '13712345678'}{.....}]
我们需要将他转换为
[ {'username':'小张','mobile': '13712345678'}, {.....} ]
思路:
1.定义一个数据对象 key是中文 value是英文 我们只需要对象[中文]就额可以拿到对象中的英 文value 例如 :{username:"姓名"}
2.使用Object.keys拿到么一个数组中所有的key属性 ---中文key
3.使用map循环数组 数组里面有几项就转换成几个 返回的是一个数组
4.在map定义空对象 之后循环中文key的每一项来处理每一个数据
5.给空对象的英文key进行赋值 数组里的每一项的中文key
代码如下
format(result, header) {
const mapInfo = {
'入职日期': 'timeOfEntry',
'手机号': 'mobile',
'姓名': 'username',
'转正日期': 'correctionTime',
'工号': 'workNumber',
'部门': 'departmentName',
'聘用形式': 'formOfEmployment'
}
const arr = result.map(it => {
const enobj = {}
header.forEach(zhkey => {
const enkey = mapInfo[zhkey]
if (enkey === 'timeOfEntry' || enkey === 'correctionTime') {
enobj[enkey] = new Date(formatExcelDate(it[zhkey]))
} else {
enobj[enkey] = it[zhkey]
}
})
arr.push(enobj)
})
return arr
},
3.英文key转化为中文key
formatData(list) {
const map = {
'id': '编号',
'password': '密码',
'mobile': '手机号',
'username': '姓名',
'timeOfEntry': '入职日期',
'formOfEmployment': '聘用形式',
'correctionTime': '转正日期',
'workNumber': '工号',
'departmentName': '部门',
'staffPhoto': '头像地址'
}
console.log(list)
let header = []
// header = ['id', 'mobile', 'username', .....]
// data = [
// ['65c2', '1380000002', '管理员', ....],
// ['65c3', '1380000003', '孙财', ....],
// ]
let data = []
// 开始代码
// 找到一个元素
const one = list[0]
if (!one) {
return { header, data }
}
header = Object.keys(one).map(key => {
return map[key]
})
// data把list中每一个对象转成 对应的value数组
data = list.map(obj1 => {
// 把 Obj['formOfEmployment']: 1 , 2 ---> '正式', '非正式'
const key = obj1['formOfEmployment'] // 1, 2
obj1['formOfEmployment'] = obj[key] // hireTypEnmu:{1:'正式', '2':'非正式' }
return Object.values(obj1)
})
return { header, data }
},
4.数组转换为树形
4-1递归形式实现
<script>
let arr=[
{ 'id': '29', 'pid': '', 'name': '总裁办' },
{ 'id': '2c', 'pid': '', 'name': '财务部' },
{ 'id': '2d', 'pid': '2c', 'name': '财务核算部'},
{ 'id': '2f', 'pid': '2c', 'name': '薪资管理部'},
{ 'id': 'd2', 'pid': '', 'name': '技术部'},
{ 'id': 'd3', 'pid': 'd2', 'name': 'Java研发部'}
]
function tranListToTreeData(list,pid='') {
// 先找到所有的根节点
let tranList=list.filter(it=>it.pid===pid)
tranList.forEach(itm =>{
//传入id list进行递归 在筛选出 他的父级 是一个数组
itm.children=tranListToTreeData(list,itm.id)
})
return tranList
}
console.log(tranListToTreeData(arr));
4-2 非递归方式实现
// 数组转换为树形的函数
export function tranListToTreeData(list) {
// 最终要产出的树状数据的数组
const treeList = []
// 所有项都使用对象存储起来
const map = {}
// 建立一个映射关系:通过id快速找到对应的元素
list.forEach(item => {
if (!item.children) {
item.children = []
}
map[item.id] = item
})
// map:
// {
// "312c": { 'id': '312c', 'pid': '', 'name': '财务部', children: [{ 'id': '312d', 'pid': '312c', 'name': '财务核算部',children: []}] },
// "312d": { 'id': '312d', 'pid': '312c', 'name': '财务核算部',children: []}
// }
list.forEach(item => {
// 对于每一个元素来说,先找它的上级
// 如果能找到,说明它有上级,则要把它添加到上级的children中去
// 如果找不到,说明它没有上级,直接添加到 treeList
const parent = map[item.pid]
// 如果存在则表示item不是最顶层的数据
if (parent) {
parent.children.push(item)
} else {
// 如果不存在 则是顶层数据
treeList.push(item)
}
})
// 返回出去
return treeList
}
5.重置路由
export function resetRouter() {
const newRouter = createRouter()
router.matcher = newRouter.matcher // reset router
}
6.定时器(手机验证码、5秒跳转都适用)
import { useEffect, useRef, useState } from 'react'
export default function useCountDown (initCount = 10, callBack) {
// 存入到useRef中
const refTimer = useRef()
/* 用户可以定义:
1.倒计时的时间
2.倒计时结束的动作
3.何时开始倒计时
*/
// 1. 初始化倒计时的时间
const [count, setCount] = useState(initCount)
// 2.开启定时器
const start = () => {
setCount(initCount)
refTimer.current = setInterval(() => {
setCount((count) => count - 1)
}, 1000)
}
// 2.倒计时结束做的事情
useEffect(
() => {
if (count === 0) {
clearInterval(refTimer.current)
callBack()
}
},
[count]
)
// 3.组件销毁之前清掉定时器
useEffect(() => {
return () => {
clearInterval(refTimer.current)
}
}, [])
// 3.最后会返回给用户一个倒计时的时间和何时开始倒计时
return {
count,
start
}
}
7.城市及城市下地区 封装
export const datas = [
{
city: '北京市',
area: [
'东城区',
'西城区',
'朝阳区',
...
]
},
{
city: '天津市',
area: [
'和平区',
'河东区',
'河西区',
...
]
},
...
]
// 所有城市
export const provinces = () => {
return datas.map(item => {
return item.city
})
}
// 城市下地区
export const citys = pname => {
for (const item of datas) {
if (item.city === pname) {
return item.area
}
}
return []
}
8. 通过id值查找该元素
// 通过id值查找该元素
export function getChidlren (id, data) {
var hasFound = false, // 表示是否有找到id值
result = null
var fn = function (data) {
console.log(data, hasFound)
if (Array.isArray(data) && !hasFound) {
// 判断是否是数组并且没有的情况下,
data.forEach((item) => {
if (item.id === id) {
// 数据循环每个子项,并且判断子项下边是否有id值
result = item // 返回的结果等于每一项
hasFound = true // 并且找到id值
} else if (item.children) {
fn(item.children) // 递归调用下边的子项
}
})
}
}
fn(data) // 调用一下
return result
}