调整台账管理页面
This commit is contained in:
guanj
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,364 +1,364 @@
|
|||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
import type { TableColumnCtx } from 'element-plus'
|
import type { TableColumnCtx } from 'element-plus'
|
||||||
import { sw } from 'element-plus/es/locale'
|
import { sw } from 'element-plus/es/locale'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 日期快捷选项适用于 el-date-picker
|
* 日期快捷选项适用于 el-date-picker
|
||||||
*/
|
*/
|
||||||
export const defaultShortcuts = [
|
export const defaultShortcuts = [
|
||||||
{
|
{
|
||||||
text: '今天',
|
text: '今天',
|
||||||
value: () => {
|
value: () => {
|
||||||
return new Date()
|
return new Date()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '昨天',
|
text: '昨天',
|
||||||
value: () => {
|
value: () => {
|
||||||
const date = new Date()
|
const date = new Date()
|
||||||
date.setTime(date.getTime() - 3600 * 1000 * 24)
|
date.setTime(date.getTime() - 3600 * 1000 * 24)
|
||||||
return [date, date]
|
return [date, date]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '最近七天',
|
text: '最近七天',
|
||||||
value: () => {
|
value: () => {
|
||||||
const date = new Date()
|
const date = new Date()
|
||||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
|
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
|
||||||
return [date, new Date()]
|
return [date, new Date()]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '最近 30 天',
|
text: '最近 30 天',
|
||||||
value: () => {
|
value: () => {
|
||||||
const date = new Date()
|
const date = new Date()
|
||||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 30)
|
date.setTime(date.getTime() - 3600 * 1000 * 24 * 30)
|
||||||
return [date, new Date()]
|
return [date, new Date()]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '本月',
|
text: '本月',
|
||||||
value: () => {
|
value: () => {
|
||||||
const date = new Date()
|
const date = new Date()
|
||||||
date.setDate(1) // 设置为当前月的第一天
|
date.setDate(1) // 设置为当前月的第一天
|
||||||
return [date, new Date()]
|
return [date, new Date()]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '今年',
|
text: '今年',
|
||||||
value: () => {
|
value: () => {
|
||||||
const date = new Date()
|
const date = new Date()
|
||||||
return [new Date(`${date.getFullYear()}-01-01`), date]
|
return [new Date(`${date.getFullYear()}-01-01`), date]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 时间日期转换
|
* 时间日期转换
|
||||||
* @param date 当前时间，new Date() 格式
|
* @param date 当前时间，new Date() 格式
|
||||||
* @param format 需要转换的时间格式字符串
|
* @param format 需要转换的时间格式字符串
|
||||||
* @description format 字符串随意，如 `YYYY-mm、YYYY-mm-dd`
|
* @description format 字符串随意，如 `YYYY-mm、YYYY-mm-dd`
|
||||||
* @description format 季度："YYYY-mm-dd HH:MM:SS QQQQ"
|
* @description format 季度："YYYY-mm-dd HH:MM:SS QQQQ"
|
||||||
* @description format 星期："YYYY-mm-dd HH:MM:SS WWW"
|
* @description format 星期："YYYY-mm-dd HH:MM:SS WWW"
|
||||||
* @description format 几周："YYYY-mm-dd HH:MM:SS ZZZ"
|
* @description format 几周："YYYY-mm-dd HH:MM:SS ZZZ"
|
||||||
* @description format 季度 + 星期 + 几周："YYYY-mm-dd HH:MM:SS WWW QQQQ ZZZ"
|
* @description format 季度 + 星期 + 几周："YYYY-mm-dd HH:MM:SS WWW QQQQ ZZZ"
|
||||||
* @returns 返回拼接后的时间字符串
|
* @returns 返回拼接后的时间字符串
|
||||||
*/
|
*/
|
||||||
export function formatDate(date: Date, format?: string): string {
|
export function formatDate(date: Date, format?: string): string {
|
||||||
// 日期不存在，则返回空
|
// 日期不存在，则返回空
|
||||||
if (!date) {
|
if (!date) {
|
||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
// 日期存在，则进行格式化
|
// 日期存在，则进行格式化
|
||||||
return date ? dayjs(date).format(format ?? 'YYYY-MM-DD HH:mm:ss') : ''
|
return date ? dayjs(date).format(format ?? 'YYYY-MM-DD HH:mm:ss') : ''
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取当前的日期+时间
|
* 获取当前的日期+时间
|
||||||
*/
|
*/
|
||||||
export function getNowDateTime() {
|
export function getNowDateTime() {
|
||||||
return dayjs()
|
return dayjs()
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取当前日期是第几周
|
* 获取当前日期是第几周
|
||||||
* @param dateTime 当前传入的日期值
|
* @param dateTime 当前传入的日期值
|
||||||
* @returns 返回第几周数字值
|
* @returns 返回第几周数字值
|
||||||
*/
|
*/
|
||||||
export function getWeek(dateTime: Date): number {
|
export function getWeek(dateTime: Date): number {
|
||||||
const temptTime = new Date(dateTime.getTime())
|
const temptTime = new Date(dateTime.getTime())
|
||||||
// 周几
|
// 周几
|
||||||
const weekday = temptTime.getDay() || 7
|
const weekday = temptTime.getDay() || 7
|
||||||
// 周1+5天=周六
|
// 周1+5天=周六
|
||||||
temptTime.setDate(temptTime.getDate() - weekday + 1 + 5)
|
temptTime.setDate(temptTime.getDate() - weekday + 1 + 5)
|
||||||
let firstDay = new Date(temptTime.getFullYear(), 0, 1)
|
let firstDay = new Date(temptTime.getFullYear(), 0, 1)
|
||||||
const dayOfWeek = firstDay.getDay()
|
const dayOfWeek = firstDay.getDay()
|
||||||
let spendDay = 1
|
let spendDay = 1
|
||||||
if (dayOfWeek != 0) spendDay = 7 - dayOfWeek + 1
|
if (dayOfWeek != 0) spendDay = 7 - dayOfWeek + 1
|
||||||
firstDay = new Date(temptTime.getFullYear(), 0, 1 + spendDay)
|
firstDay = new Date(temptTime.getFullYear(), 0, 1 + spendDay)
|
||||||
const d = Math.ceil((temptTime.valueOf() - firstDay.valueOf()) / 86400000)
|
const d = Math.ceil((temptTime.valueOf() - firstDay.valueOf()) / 86400000)
|
||||||
return Math.ceil(d / 7)
|
return Math.ceil(d / 7)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 将时间转换为 `几秒前`、`几分钟前`、`几小时前`、`几天前`
|
* 将时间转换为 `几秒前`、`几分钟前`、`几小时前`、`几天前`
|
||||||
* @param param 当前时间，new Date() 格式或者字符串时间格式
|
* @param param 当前时间，new Date() 格式或者字符串时间格式
|
||||||
* @param format 需要转换的时间格式字符串
|
* @param format 需要转换的时间格式字符串
|
||||||
* @description param 10秒： 10 * 1000
|
* @description param 10秒： 10 * 1000
|
||||||
* @description param 1分： 60 * 1000
|
* @description param 1分： 60 * 1000
|
||||||
* @description param 1小时： 60 * 60 * 1000
|
* @description param 1小时： 60 * 60 * 1000
|
||||||
* @description param 24小时：60 * 60 * 24 * 1000
|
* @description param 24小时：60 * 60 * 24 * 1000
|
||||||
* @description param 3天： 60 * 60* 24 * 1000 * 3
|
* @description param 3天： 60 * 60* 24 * 1000 * 3
|
||||||
* @returns 返回拼接后的时间字符串
|
* @returns 返回拼接后的时间字符串
|
||||||
*/
|
*/
|
||||||
export function formatPast(param: string | Date, format = 'YYYY-mm-dd HH:MM:SS'): string {
|
export function formatPast(param: string | Date, format = 'YYYY-mm-dd HH:MM:SS'): string {
|
||||||
// 传入格式处理、存储转换值
|
// 传入格式处理、存储转换值
|
||||||
let t: any, s: number
|
let t: any, s: number
|
||||||
// 获取js 时间戳
|
// 获取js 时间戳
|
||||||
let time: number = new Date().getTime()
|
let time: number = new Date().getTime()
|
||||||
// 是否是对象
|
// 是否是对象
|
||||||
typeof param === 'string' || 'object' ? (t = new Date(param).getTime()) : (t = param)
|
typeof param === 'string' || 'object' ? (t = new Date(param).getTime()) : (t = param)
|
||||||
// 当前时间戳 - 传入时间戳
|
// 当前时间戳 - 传入时间戳
|
||||||
time = Number.parseInt(`${time - t}`)
|
time = Number.parseInt(`${time - t}`)
|
||||||
if (time < 10000) {
|
if (time < 10000) {
|
||||||
// 10秒内
|
// 10秒内
|
||||||
return '刚刚'
|
return '刚刚'
|
||||||
} else if (time < 60000 && time >= 10000) {
|
} else if (time < 60000 && time >= 10000) {
|
||||||
// 超过10秒少于1分钟内
|
// 超过10秒少于1分钟内
|
||||||
s = Math.floor(time / 1000)
|
s = Math.floor(time / 1000)
|
||||||
return `${s}秒前`
|
return `${s}秒前`
|
||||||
} else if (time < 3600000 && time >= 60000) {
|
} else if (time < 3600000 && time >= 60000) {
|
||||||
// 超过1分钟少于1小时
|
// 超过1分钟少于1小时
|
||||||
s = Math.floor(time / 60000)
|
s = Math.floor(time / 60000)
|
||||||
return `${s}分钟前`
|
return `${s}分钟前`
|
||||||
} else if (time < 86400000 && time >= 3600000) {
|
} else if (time < 86400000 && time >= 3600000) {
|
||||||
// 超过1小时少于24小时
|
// 超过1小时少于24小时
|
||||||
s = Math.floor(time / 3600000)
|
s = Math.floor(time / 3600000)
|
||||||
return `${s}小时前`
|
return `${s}小时前`
|
||||||
} else if (time < 259200000 && time >= 86400000) {
|
} else if (time < 259200000 && time >= 86400000) {
|
||||||
// 超过1天少于3天内
|
// 超过1天少于3天内
|
||||||
s = Math.floor(time / 86400000)
|
s = Math.floor(time / 86400000)
|
||||||
return `${s}天前`
|
return `${s}天前`
|
||||||
} else {
|
} else {
|
||||||
// 超过3天
|
// 超过3天
|
||||||
const date = typeof param === 'string' || 'object' ? new Date(param) : param
|
const date = typeof param === 'string' || 'object' ? new Date(param) : param
|
||||||
return formatDate(date, format)
|
return formatDate(date, format)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 时间问候语
|
* 时间问候语
|
||||||
* @param param 当前时间，new Date() 格式
|
* @param param 当前时间，new Date() 格式
|
||||||
* @description param 调用 `formatAxis(new Date())` 输出 `上午好`
|
* @description param 调用 `formatAxis(new Date())` 输出 `上午好`
|
||||||
* @returns 返回拼接后的时间字符串
|
* @returns 返回拼接后的时间字符串
|
||||||
*/
|
*/
|
||||||
export function formatAxis(param: Date): string {
|
export function formatAxis(param: Date): string {
|
||||||
const hour: number = new Date(param).getHours()
|
const hour: number = new Date(param).getHours()
|
||||||
if (hour < 6) return '凌晨好'
|
if (hour < 6) return '凌晨好'
|
||||||
else if (hour < 9) return '早上好'
|
else if (hour < 9) return '早上好'
|
||||||
else if (hour < 12) return '上午好'
|
else if (hour < 12) return '上午好'
|
||||||
else if (hour < 14) return '中午好'
|
else if (hour < 14) return '中午好'
|
||||||
else if (hour < 17) return '下午好'
|
else if (hour < 17) return '下午好'
|
||||||
else if (hour < 19) return '傍晚好'
|
else if (hour < 19) return '傍晚好'
|
||||||
else if (hour < 22) return '晚上好'
|
else if (hour < 22) return '晚上好'
|
||||||
else return '夜里好'
|
else return '夜里好'
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 将毫秒，转换成时间字符串。例如说，xx 分钟
|
* 将毫秒，转换成时间字符串。例如说，xx 分钟
|
||||||
*
|
*
|
||||||
* @param ms 毫秒
|
* @param ms 毫秒
|
||||||
* @returns {string} 字符串
|
* @returns {string} 字符串
|
||||||
*/
|
*/
|
||||||
export function formatPast2(ms: number): string {
|
export function formatPast2(ms: number): string {
|
||||||
const day = Math.floor(ms / (24 * 60 * 60 * 1000))
|
const day = Math.floor(ms / (24 * 60 * 60 * 1000))
|
||||||
const hour = Math.floor(ms / (60 * 60 * 1000) - day * 24)
|
const hour = Math.floor(ms / (60 * 60 * 1000) - day * 24)
|
||||||
const minute = Math.floor(ms / (60 * 1000) - day * 24 * 60 - hour * 60)
|
const minute = Math.floor(ms / (60 * 1000) - day * 24 * 60 - hour * 60)
|
||||||
const second = Math.floor(ms / 1000 - day * 24 * 60 * 60 - hour * 60 * 60 - minute * 60)
|
const second = Math.floor(ms / 1000 - day * 24 * 60 * 60 - hour * 60 * 60 - minute * 60)
|
||||||
if (day > 0) {
|
if (day > 0) {
|
||||||
return day + ' 天' + hour + ' 小时 ' + minute + ' 分钟'
|
return day + ' 天' + hour + ' 小时 ' + minute + ' 分钟'
|
||||||
}
|
}
|
||||||
if (hour > 0) {
|
if (hour > 0) {
|
||||||
return hour + ' 小时 ' + minute + ' 分钟'
|
return hour + ' 小时 ' + minute + ' 分钟'
|
||||||
}
|
}
|
||||||
if (minute > 0) {
|
if (minute > 0) {
|
||||||
return minute + ' 分钟'
|
return minute + ' 分钟'
|
||||||
}
|
}
|
||||||
if (second > 0) {
|
if (second > 0) {
|
||||||
return second + ' 秒'
|
return second + ' 秒'
|
||||||
} else {
|
} else {
|
||||||
return 0 + ' 秒'
|
return 0 + ' 秒'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* element plus 的时间 Formatter 实现，使用 YYYY-MM-DD HH:mm:ss 格式
|
* element plus 的时间 Formatter 实现，使用 YYYY-MM-DD HH:mm:ss 格式
|
||||||
*
|
*
|
||||||
* @param row 行数据
|
* @param row 行数据
|
||||||
* @param column 字段
|
* @param column 字段
|
||||||
* @param cellValue 字段值
|
* @param cellValue 字段值
|
||||||
*/
|
*/
|
||||||
export function dateFormatter(_row: any, _column: TableColumnCtx<any>, cellValue: any): string {
|
export function dateFormatter(_row: any, _column: TableColumnCtx<any>, cellValue: any): string {
|
||||||
return cellValue ? formatDate(cellValue) : ''
|
return cellValue ? formatDate(cellValue) : ''
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* element plus 的时间 Formatter 实现，使用 YYYY-MM-DD 格式
|
* element plus 的时间 Formatter 实现，使用 YYYY-MM-DD 格式
|
||||||
*
|
*
|
||||||
* @param row 行数据
|
* @param row 行数据
|
||||||
* @param column 字段
|
* @param column 字段
|
||||||
* @param cellValue 字段值
|
* @param cellValue 字段值
|
||||||
*/
|
*/
|
||||||
export function dateFormatter2(_row: any, _column: TableColumnCtx<any>, cellValue: any): string {
|
export function dateFormatter2(_row: any, _column: TableColumnCtx<any>, cellValue: any): string {
|
||||||
return cellValue ? formatDate(cellValue, 'YYYY-MM-DD') : ''
|
return cellValue ? formatDate(cellValue, 'YYYY-MM-DD') : ''
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 设置起始日期，时间为00:00:00
|
* 设置起始日期，时间为00:00:00
|
||||||
* @param param 传入日期
|
* @param param 传入日期
|
||||||
* @returns 带时间00:00:00的日期
|
* @returns 带时间00:00:00的日期
|
||||||
*/
|
*/
|
||||||
export function beginOfDay(param: Date): Date {
|
export function beginOfDay(param: Date): Date {
|
||||||
return new Date(param.getFullYear(), param.getMonth(), param.getDate(), 0, 0, 0)
|
return new Date(param.getFullYear(), param.getMonth(), param.getDate(), 0, 0, 0)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 设置结束日期，时间为23:59:59
|
* 设置结束日期，时间为23:59:59
|
||||||
* @param param 传入日期
|
* @param param 传入日期
|
||||||
* @returns 带时间23:59:59的日期
|
* @returns 带时间23:59:59的日期
|
||||||
*/
|
*/
|
||||||
export function endOfDay(param: Date): Date {
|
export function endOfDay(param: Date): Date {
|
||||||
return new Date(param.getFullYear(), param.getMonth(), param.getDate(), 23, 59, 59)
|
return new Date(param.getFullYear(), param.getMonth(), param.getDate(), 23, 59, 59)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 计算两个日期间隔天数
|
* 计算两个日期间隔天数
|
||||||
* @param param1 日期1
|
* @param param1 日期1
|
||||||
* @param param2 日期2
|
* @param param2 日期2
|
||||||
*/
|
*/
|
||||||
export function betweenDay(param1: Date, param2: Date): number {
|
export function betweenDay(param1: Date, param2: Date): number {
|
||||||
param1 = convertDate(param1)
|
param1 = convertDate(param1)
|
||||||
param2 = convertDate(param2)
|
param2 = convertDate(param2)
|
||||||
// 计算差值
|
// 计算差值
|
||||||
return Math.floor((param2.getTime() - param1.getTime()) / (24 * 3600 * 1000))
|
return Math.floor((param2.getTime() - param1.getTime()) / (24 * 3600 * 1000))
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 日期计算
|
* 日期计算
|
||||||
* @param param1 日期
|
* @param param1 日期
|
||||||
* @param param2 添加的时间
|
* @param param2 添加的时间
|
||||||
*/
|
*/
|
||||||
export function addTime(param1: Date, param2: number): Date {
|
export function addTime(param1: Date, param2: number): Date {
|
||||||
param1 = convertDate(param1)
|
param1 = convertDate(param1)
|
||||||
return new Date(param1.getTime() + param2)
|
return new Date(param1.getTime() + param2)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 日期转换
|
* 日期转换
|
||||||
* @param param 日期
|
* @param param 日期
|
||||||
*/
|
*/
|
||||||
export function convertDate(param: Date | string): Date {
|
export function convertDate(param: Date | string): Date {
|
||||||
if (typeof param === 'string') {
|
if (typeof param === 'string') {
|
||||||
return new Date(param)
|
return new Date(param)
|
||||||
}
|
}
|
||||||
return param
|
return param
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 指定的两个日期, 是否为同一天
|
* 指定的两个日期, 是否为同一天
|
||||||
* @param a 日期 A
|
* @param a 日期 A
|
||||||
* @param b 日期 B
|
* @param b 日期 B
|
||||||
*/
|
*/
|
||||||
export function isSameDay(a: dayjs.ConfigType, b: dayjs.ConfigType): boolean {
|
export function isSameDay(a: dayjs.ConfigType, b: dayjs.ConfigType): boolean {
|
||||||
if (!a || !b) return false
|
if (!a || !b) return false
|
||||||
|
|
||||||
const aa = dayjs(a)
|
const aa = dayjs(a)
|
||||||
const bb = dayjs(b)
|
const bb = dayjs(b)
|
||||||
return aa.year() == bb.year() && aa.month() == bb.month() && aa.day() == bb.day()
|
return aa.year() == bb.year() && aa.month() == bb.month() && aa.day() == bb.day()
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取一天的开始时间、截止时间
|
* 获取一天的开始时间、截止时间
|
||||||
* @param date 日期
|
* @param date 日期
|
||||||
* @param days 天数
|
* @param days 天数
|
||||||
*/
|
*/
|
||||||
export function getDayRange(date: dayjs.ConfigType, days: number): [dayjs.ConfigType, dayjs.ConfigType] {
|
export function getDayRange(date: dayjs.ConfigType, days: number): [dayjs.ConfigType, dayjs.ConfigType] {
|
||||||
const day = dayjs(date).add(days, 'd')
|
const day = dayjs(date).add(days, 'd')
|
||||||
return getDateRange(day, day)
|
return getDateRange(day, day)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取最近7天的开始时间、截止时间
|
* 获取最近7天的开始时间、截止时间
|
||||||
*/
|
*/
|
||||||
export function getLast7Days(): [dayjs.ConfigType, dayjs.ConfigType] {
|
export function getLast7Days(): [dayjs.ConfigType, dayjs.ConfigType] {
|
||||||
const lastWeekDay = dayjs().subtract(7, 'd')
|
const lastWeekDay = dayjs().subtract(7, 'd')
|
||||||
const yesterday = dayjs().subtract(1, 'd')
|
const yesterday = dayjs().subtract(1, 'd')
|
||||||
return getDateRange(lastWeekDay, yesterday)
|
return getDateRange(lastWeekDay, yesterday)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取最近30天的开始时间、截止时间
|
* 获取最近30天的开始时间、截止时间
|
||||||
*/
|
*/
|
||||||
export function getLast30Days(): [dayjs.ConfigType, dayjs.ConfigType] {
|
export function getLast30Days(): [dayjs.ConfigType, dayjs.ConfigType] {
|
||||||
const lastMonthDay = dayjs().subtract(30, 'd')
|
const lastMonthDay = dayjs().subtract(30, 'd')
|
||||||
const yesterday = dayjs().subtract(1, 'd')
|
const yesterday = dayjs().subtract(1, 'd')
|
||||||
return getDateRange(lastMonthDay, yesterday)
|
return getDateRange(lastMonthDay, yesterday)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取最近1年的开始时间、截止时间
|
* 获取最近1年的开始时间、截止时间
|
||||||
*/
|
*/
|
||||||
export function getLast1Year(): [dayjs.ConfigType, dayjs.ConfigType] {
|
export function getLast1Year(): [dayjs.ConfigType, dayjs.ConfigType] {
|
||||||
const lastYearDay = dayjs().subtract(1, 'y')
|
const lastYearDay = dayjs().subtract(1, 'y')
|
||||||
const yesterday = dayjs().subtract(1, 'd')
|
const yesterday = dayjs().subtract(1, 'd')
|
||||||
return getDateRange(lastYearDay, yesterday)
|
return getDateRange(lastYearDay, yesterday)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取指定日期的开始时间、截止时间
|
* 获取指定日期的开始时间、截止时间
|
||||||
* @param beginDate 开始日期
|
* @param beginDate 开始日期
|
||||||
* @param endDate 截止日期
|
* @param endDate 截止日期
|
||||||
*/
|
*/
|
||||||
export function getDateRange(beginDate: dayjs.ConfigType, endDate: dayjs.ConfigType): [string, string] {
|
export function getDateRange(beginDate: dayjs.ConfigType, endDate: dayjs.ConfigType): [string, string] {
|
||||||
return [
|
return [
|
||||||
dayjs(beginDate).startOf('d').format('YYYY-MM-DD HH:mm:ss'),
|
dayjs(beginDate).startOf('d').format('YYYY-MM-DD HH:mm:ss'),
|
||||||
dayjs(endDate).endOf('d').format('YYYY-MM-DD HH:mm:ss')
|
dayjs(endDate).endOf('d').format('YYYY-MM-DD HH:mm:ss')
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 获取当月时间
|
* 获取当月时间
|
||||||
* @param beginDate 开始日期
|
* @param beginDate 开始日期
|
||||||
* @param endDate 截止日期
|
* @param endDate 截止日期
|
||||||
* @param key 1:年 2:季 3:月 4:周 5:日
|
* @param key 1:年 2:季 3:月 4:周 5:日
|
||||||
*/
|
*/
|
||||||
export function getTimeOfTheMonth(key: string): [string, string] {
|
export function getTimeOfTheMonth(key: string): [string, string] {
|
||||||
const now = new Date()
|
const now = new Date()
|
||||||
const year = now.getFullYear()
|
const year = now.getFullYear()
|
||||||
const month = now.getMonth()
|
const month = now.getMonth()
|
||||||
|
|
||||||
switch (key) {
|
switch (key) {
|
||||||
case '1': // 年
|
case '1': // 年
|
||||||
return [formatDate(new Date(year, 0, 1), 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
return [formatDate(new Date(year, 0, 1), 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
||||||
|
|
||||||
case '2': // 季
|
case '2': // 季
|
||||||
const quarterStartMonth = Math.floor(month / 3) * 3
|
const quarterStartMonth = Math.floor(month / 3) * 3
|
||||||
const quarterEndMonth = quarterStartMonth + 2
|
const quarterEndMonth = quarterStartMonth + 2
|
||||||
|
|
||||||
return [formatDate(new Date(year, quarterStartMonth, 1), 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
return [formatDate(new Date(year, quarterStartMonth, 1), 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
||||||
|
|
||||||
case '3': // 月
|
case '3': // 月
|
||||||
return [formatDate(new Date(year, month, 1), 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
return [formatDate(new Date(year, month, 1), 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
||||||
|
|
||||||
case '4': // 周
|
case '4': // 周
|
||||||
const dayOfWeek = now.getDay() // 0是周日
|
const dayOfWeek = now.getDay() // 0是周日
|
||||||
const diff = now.getDate() - dayOfWeek + (dayOfWeek === 0 ? -6 : 1) // 调整为周一
|
const diff = now.getDate() - dayOfWeek + (dayOfWeek === 0 ? -6 : 1) // 调整为周一
|
||||||
const weekStart = new Date(year, month, diff)
|
const weekStart = new Date(year, month, diff)
|
||||||
return [formatDate(weekStart, 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
return [formatDate(weekStart, 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
||||||
|
|
||||||
case '5': // 日
|
case '5': // 日
|
||||||
return [formatDate(now, 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
return [formatDate(now, 'YYYY-MM-DD'), formatDate(now, 'YYYY-MM-DD')]
|
||||||
|
|
||||||
default:
|
default:
|
||||||
throw new Error('Invalid key')
|
throw new Error('Invalid key')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -1,107 +1,107 @@
|
|||||||
<template>
|
<template>
|
||||||
<my-echart v-loading="loading" class="mt10" :style="`height: calc(${tableStore.table.height} - 135px)`"
|
<my-echart v-loading="loading" class="mt10" :style="`height: calc(${tableStore.table.height} - 135px)`"
|
||||||
:options="options" />
|
:options="options" />
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, provide, nextTick } from 'vue'
|
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import Table from '@/components/table/index.vue'
|
import Table from '@/components/table/index.vue'
|
||||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
import TableHeader from '@/components/table/header/index.vue'
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
import { useDictData } from '@/stores/dictData'
|
import { useDictData } from '@/stores/dictData'
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
const options = ref({})
|
const options = ref({})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const TableHeaderRef = ref()
|
const TableHeaderRef = ref()
|
||||||
const tableStoreParams: any = ref({})
|
const tableStoreParams: any = ref({})
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const getTableStoreParams = async (val: any) => {
|
const getTableStoreParams = async (val: any) => {
|
||||||
tableStoreParams.value = val
|
tableStoreParams.value = val
|
||||||
loading.value = true
|
loading.value = true
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
}, 1500)
|
}, 1500)
|
||||||
}
|
}
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
url: '/device-boot/terminalOnlineRateData/getOnlineRateDataCensus',
|
url: '/harmonic-boot/tHDistortion/getTHDistortionCensus',
|
||||||
showPage: false,
|
showPage: false,
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
column: [],
|
column: [],
|
||||||
beforeSearchFun: () => {
|
beforeSearchFun: () => {
|
||||||
tableStore.table.params = tableStoreParams.value
|
tableStore.table.params = tableStoreParams.value
|
||||||
},
|
},
|
||||||
loadCallback: () => {
|
loadCallback: () => {
|
||||||
// tableStore.table.data.type
|
// tableStore.table.data.type
|
||||||
let code = tableStore.table.params.statisticalType.code
|
let code = tableStore.table.params.statisticalType.code
|
||||||
let title = '',
|
let title = '',
|
||||||
titleX = ''
|
titleX = ''
|
||||||
if (code == 'Power_Network') {
|
if (code == 'Power_Network') {
|
||||||
title = '区域'
|
title = '区域'
|
||||||
titleX = '区域'
|
titleX = '区域'
|
||||||
} else if (code == 'Manufacturer') {
|
} else if (code == 'Manufacturer') {
|
||||||
title = '终端厂家'
|
title = '终端厂家'
|
||||||
titleX = '终端\n厂家'
|
titleX = '终端\n厂家'
|
||||||
} else if (code == 'Voltage_Level') {
|
} else if (code == 'Voltage_Level') {
|
||||||
title = '电压等级'
|
title = '电压等级'
|
||||||
titleX = '电压\n等级'
|
titleX = '电压\n等级'
|
||||||
} else if (code == 'Load_Type') {
|
} else if (code == 'Load_Type') {
|
||||||
title = '干扰源类型'
|
title = '干扰源类型'
|
||||||
titleX = '干扰\n源类型'
|
titleX = '干扰\n源类型'
|
||||||
} else if (code == 'Report_Type') {
|
} else if (code == 'Report_Type') {
|
||||||
title = '上报类型'
|
title = '上报类型'
|
||||||
titleX = '上报\n类型'
|
titleX = '上报\n类型'
|
||||||
}
|
}
|
||||||
options.value = {
|
options.value = {
|
||||||
title: {
|
title: {
|
||||||
text: title
|
text: title
|
||||||
},
|
},
|
||||||
|
|
||||||
// tooltip: {
|
// tooltip: {
|
||||||
// formatter: function (params: any) {
|
// formatter: function (params: any) {
|
||||||
// var tips = ''
|
// var tips = ''
|
||||||
|
|
||||||
// for (var i = 0; i < params.length; i++) {
|
// for (var i = 0; i < params.length; i++) {
|
||||||
// if (params[i].value == 1) {
|
// if (params[i].value == 1) {
|
||||||
// tips += params[i].name + '</br>'
|
// tips += params[i].name + '</br>'
|
||||||
// tips += '总畸变率:暂无数据'
|
// tips += '总畸变率:暂无数据'
|
||||||
// } else {
|
// } else {
|
||||||
// tips += params[i].name + '</br>'
|
// tips += params[i].name + '</br>'
|
||||||
// tips += '总畸变率:' + params[i].value.toFixed(2)
|
// tips += '总畸变率:' + params[i].value.toFixed(2)
|
||||||
// }
|
// }
|
||||||
// }
|
// }
|
||||||
// return tips
|
// return tips
|
||||||
// }
|
// }
|
||||||
// },
|
// },
|
||||||
|
|
||||||
xAxis: {
|
xAxis: {
|
||||||
name: titleX,
|
name: titleX,
|
||||||
data: tableStore.table.data.type
|
data: tableStore.table.data.type
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
name: '%',
|
name: '%',
|
||||||
max: 100
|
max: 100
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '总畸变率',
|
name: '总畸变率',
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
|
|
||||||
data: tableStore.table.data.single,
|
data: tableStore.table.data.single,
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
loading.value = false
|
loading.value = false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
provide('tableStore', tableStore)
|
provide('tableStore', tableStore)
|
||||||
|
|
||||||
onMounted(() => { })
|
onMounted(() => { })
|
||||||
defineExpose({ getTableStoreParams })
|
defineExpose({ getTableStoreParams })
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
|
|||||||
@@ -1,137 +1,137 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="default-main">
|
<div class="default-main">
|
||||||
<TableHeader :showSearch="false">
|
<TableHeader :showSearch="false">
|
||||||
<template v-slot:operation>
|
<template v-slot:operation>
|
||||||
<el-button type="primary" @click="add" icon="el-icon-Plus">新增</el-button>
|
<el-button type="primary" @click="add" icon="el-icon-Plus">新增</el-button>
|
||||||
</template>
|
</template>
|
||||||
</TableHeader>
|
</TableHeader>
|
||||||
<Table
|
<Table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
|
:tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
|
||||||
:scroll-y="{ enabled: true }"
|
:scroll-y="{ enabled: true }"
|
||||||
/>
|
/>
|
||||||
<Add ref="addRef" v-if="addFlag" @onSubmit="tableStore.index()" />
|
<Add ref="addRef" v-if="addFlag" @onSubmit="tableStore.index()" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, provide } from 'vue'
|
import { ref, onMounted, provide } from 'vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import Table from '@/components/table/index.vue'
|
import Table from '@/components/table/index.vue'
|
||||||
import { useDictData } from '@/stores/dictData'
|
import { useDictData } from '@/stores/dictData'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import TableHeader from '@/components/table/header/index.vue'
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
import Add from './add.vue'
|
import Add from './add.vue'
|
||||||
import { deleteSubassembly } from '@/api/user-boot/dept'
|
import { deleteSubassembly } from '@/api/user-boot/dept'
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'component'
|
name: 'component'
|
||||||
})
|
})
|
||||||
const addRef = ref()
|
const addRef = ref()
|
||||||
const addFlag = ref(false)
|
const addFlag = ref(false)
|
||||||
const tableRef = ref()
|
const tableRef = ref()
|
||||||
const treeData: any = ref([])
|
const treeData: any = ref([])
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
url: '/user-boot/component/componentTree',
|
url: '/user-boot/component/componentTree',
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
showPage: false,
|
showPage: false,
|
||||||
column: [
|
column: [
|
||||||
{ field: 'name', title: '功能组件名称', align: 'left', treeNode: true },
|
{ field: 'name', title: '功能组件名称', align: 'left', treeNode: true },
|
||||||
{
|
{
|
||||||
title: '组件图标',
|
title: '组件图标',
|
||||||
field: 'icon',
|
field: 'icon',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: '80',
|
width: '80',
|
||||||
render: 'icon'
|
render: 'icon'
|
||||||
},
|
},
|
||||||
{ field: 'code', title: '组件标识' },
|
{ field: 'code', title: '组件标识' },
|
||||||
{ field: 'path', title: '组件路径' },
|
{ field: 'path', title: '组件路径' },
|
||||||
{ field: 'image', title: '组件展示', render: 'image' },
|
{ field: 'image', title: '组件展示', render: 'image' },
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
render: 'buttons',
|
render: 'buttons',
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
name: 'edit',
|
name: 'edit',
|
||||||
title: '修改',
|
title: '修改',
|
||||||
type: 'primary',
|
type: 'primary',
|
||||||
icon: 'el-icon-Plus',
|
icon: 'el-icon-Plus',
|
||||||
render: 'basicButton',
|
render: 'basicButton',
|
||||||
disabled: row => {
|
disabled: row => {
|
||||||
return row.path == '' || row.path == null
|
return row.path == '' || row.path == null
|
||||||
},
|
},
|
||||||
click: row => {
|
click: row => {
|
||||||
addFlag.value = true
|
addFlag.value = true
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
addRef.value.open('修改组件', row)
|
addRef.value.open('修改组件', row)
|
||||||
}, 100)
|
}, 100)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'del',
|
name: 'del',
|
||||||
text: '删除',
|
text: '删除',
|
||||||
type: 'danger',
|
type: 'danger',
|
||||||
icon: 'el-icon-Delete',
|
icon: 'el-icon-Delete',
|
||||||
render: 'confirmButton',
|
render: 'confirmButton',
|
||||||
disabled: row => {
|
disabled: row => {
|
||||||
return row.path == '' || row.path == null
|
return row.path == '' || row.path == null
|
||||||
},
|
},
|
||||||
popconfirm: {
|
popconfirm: {
|
||||||
confirmButtonText: '确认',
|
confirmButtonText: '确认',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
confirmButtonType: 'danger',
|
confirmButtonType: 'danger',
|
||||||
title: '确定删除？'
|
title: '确定删除？'
|
||||||
},
|
},
|
||||||
click: row => {
|
click: row => {
|
||||||
deleteSubassembly({ id: row.id }).then(res => {
|
deleteSubassembly({ id: row.id }).then(res => {
|
||||||
ElMessage.success('删除成功!')
|
ElMessage.success('删除成功!')
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
loadCallback: () => {
|
loadCallback: () => {
|
||||||
addFlag.value = false
|
addFlag.value = false
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
tableRef.value.getRef().setAllTreeExpand(true)
|
tableRef.value.getRef().setAllTreeExpand(true)
|
||||||
}, 1000)
|
}, 0)
|
||||||
tableStore.table.data.forEach(item => {
|
tableStore.table.data.forEach(item => {
|
||||||
item.state = 0
|
item.state = 0
|
||||||
})
|
})
|
||||||
treeData.value = tree2List(tableStore.table.data, Math.random() * 1000)
|
treeData.value = tree2List(tableStore.table.data, Math.random() * 1000)
|
||||||
tableStore.table.data = treeData.value
|
tableStore.table.data = treeData.value
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const tree2List = (list: any, id: any) => {
|
const tree2List = (list: any, id: any) => {
|
||||||
//存储结果的数组
|
//存储结果的数组
|
||||||
let arr: any = []
|
let arr: any = []
|
||||||
// 遍历 tree 数组
|
// 遍历 tree 数组
|
||||||
list.forEach((item: any) => {
|
list.forEach((item: any) => {
|
||||||
item.uPid = id
|
item.uPid = id
|
||||||
item.uId = Math.random() * 1000
|
item.uId = Math.random() * 1000
|
||||||
// 判断item是否存在children
|
// 判断item是否存在children
|
||||||
if (!item.children) return arr.push(item)
|
if (!item.children) return arr.push(item)
|
||||||
// 函数递归，对children数组进行tree2List的转换
|
// 函数递归，对children数组进行tree2List的转换
|
||||||
const children = tree2List(item.children, item.uId)
|
const children = tree2List(item.children, item.uId)
|
||||||
// 删除item的children属性
|
// 删除item的children属性
|
||||||
delete item.children
|
delete item.children
|
||||||
// 把item和children数组添加至结果数组
|
// 把item和children数组添加至结果数组
|
||||||
//..children: 意思是把children数组展开
|
//..children: 意思是把children数组展开
|
||||||
arr.push(item, ...children)
|
arr.push(item, ...children)
|
||||||
})
|
})
|
||||||
// 返回结果数组
|
// 返回结果数组
|
||||||
return arr
|
return arr
|
||||||
}
|
}
|
||||||
// 新增
|
// 新增
|
||||||
const add = () => {
|
const add = () => {
|
||||||
addFlag.value = true
|
addFlag.value = true
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
addRef.value.open('新增组件')
|
addRef.value.open('新增组件')
|
||||||
}, 100)
|
}, 100)
|
||||||
}
|
}
|
||||||
provide('tableStore', tableStore)
|
provide('tableStore', tableStore)
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -29,7 +29,7 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item class="top" label="部门区域:" prop="area">
|
<el-form-item class="top" label="部门区域:" prop="area">
|
||||||
<el-select v-model="form.area" placeholder="选择子类型" style="width: 100%">
|
<el-select v-model="form.area" placeholder="选择部门区域" style="width: 100%">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in areaOption"
|
v-for="item in areaOption"
|
||||||
:key="item.id"
|
:key="item.id"
|
||||||
|
|||||||
Reference in New Issue
Block a user