请升级您的浏览器

请注意：微软公司对Windows XP 及 Internet Explorer 早期版本的支持已经结束

自 2016 年 1 月 12 日起，Microsoft 不再为 IE 11 以下版本提供相应支持和更新。没有关键的浏览器安全更新，您的电脑可能易受有害病毒、间谍软件和其他恶意软件的攻击，它们可以窃取或损害您的业务数据和信息。请参阅微软对 Internet Explorer 早期版本的支持将于 2016 年 1 月 12 日结束的说明。

您可以选择更先进的浏览器

推荐使用以下浏览器的最新版本。如果您的电脑已有以下浏览器的最新版本则直接使用该浏览器访问即可。

具身风暴后台管理系统

正在加载系统资源，请耐心等待

{{item}}	Cron 表达式
+ {{crontabValueObj.second}} + {{crontabValueObj.second}} +	+ {{crontabValueObj.min}} + {{crontabValueObj.min}} +	+ {{crontabValueObj.hour}} + {{crontabValueObj.hour}} +	+ {{crontabValueObj.day}} + {{crontabValueObj.day}} +	+ {{crontabValueObj.month}} + {{crontabValueObj.month}} +	+ {{crontabValueObj.week}} + {{crontabValueObj.week}} +	+ {{crontabValueObj.year}} + {{crontabValueObj.year}} +	+ {{crontabValueString}} + {{crontabValueString}} +

时会出现各种问题 + * query: '{"id": 1, "name": "ry"}' // 访问路由的默认传递参数 + * roles: ['admin', 'common'] // 访问路由的角色权限 + * permissions: ['a:a:a', 'b:b:b'] // 访问路由的菜单权限 + * meta : { + noCache: true // 如果设置为true，则不会被缓存(默认 false) + title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字 + icon: 'svg-name' // 设置该路由的图标，对应路径src/assets/icons/svg + breadcrumb: false // 如果设置为false，则不会在breadcrumb面包屑中显示 + activeMenu: '/system/user' // 当路由设置了该属性，则会高亮相对应的侧边栏。 + } + */ + +// 公共路由 +export const constantRoutes = [ + { + path: '/redirect', + component: Layout, + hidden: true, + children: [ + { + path: '/redirect/:path(.*)', + component: () => import('@/views/redirect/index.vue') + } + ] + }, + { + path: '/login', + component: () => import('@/views/login'), + hidden: true + }, + { + path: '/register', + component: () => import('@/views/register'), + hidden: true + }, + { + path: "/:pathMatch(.*)*", + component: () => import('@/views/error/404'), + hidden: true + }, + { + path: '/401', + component: () => import('@/views/error/401'), + hidden: true + }, + { + path: '', + component: Layout, + redirect: '/index', + children: [ + { + path: '/index', + component: () => import('@/views/index'), + name: 'Index', + meta: { title: '首页', icon: 'dashboard', affix: true } + } + ] + }, + { + path: '/user', + component: Layout, + hidden: true, + redirect: 'noredirect', + children: [ + { + path: 'profile/:activeTab?', + component: () => import('@/views/system/user/profile/index'), + name: 'Profile', + meta: { title: '个人中心', icon: 'user' } + } + ] + } +] + +// 动态路由，基于用户权限动态去加载 +export const dynamicRoutes = [ + { + path: '/system/user-auth', + component: Layout, + hidden: true, + permissions: ['system:user:edit'], + children: [ + { + path: 'role/:userId(\\d+)', + component: () => import('@/views/system/user/authRole'), + name: 'AuthRole', + meta: { title: '分配角色', activeMenu: '/system/user' } + } + ] + }, + { + path: '/system/role-auth', + component: Layout, + hidden: true, + permissions: ['system:role:edit'], + children: [ + { + path: 'user/:roleId(\\d+)', + component: () => import('@/views/system/role/authUser'), + name: 'AuthUser', + meta: { title: '分配用户', activeMenu: '/system/role' } + } + ] + }, + { + path: '/system/dict-data', + component: Layout, + hidden: true, + permissions: ['system:dict:list'], + children: [ + { + path: 'index/:dictId(\\d+)', + component: () => import('@/views/system/dict/data'), + name: 'Data', + meta: { title: '字典数据', activeMenu: '/system/dict' } + } + ] + }, + { + path: '/monitor/job-log', + component: Layout, + hidden: true, + permissions: ['monitor:job:list'], + children: [ + { + path: 'index/:jobId(\\d+)', + component: () => import('@/views/monitor/job/log'), + name: 'JobLog', + meta: { title: '调度日志', activeMenu: '/monitor/job' } + } + ] + }, + { + path: '/tool/gen-edit', + component: Layout, + hidden: true, + permissions: ['tool:gen:edit'], + children: [ + { + path: 'index/:tableId(\\d+)', + component: () => import('@/views/tool/gen/editTable'), + name: 'GenEdit', + meta: { title: '修改生成配置', activeMenu: '/tool/gen' } + } + ] + } +] + +const router = createRouter({ + history: createWebHistory(), + routes: constantRoutes, + scrollBehavior(to, from, savedPosition) { + if (savedPosition) { + return savedPosition + } + return { top: 0 } + }, +}) + +export default router diff --git a/src/settings.js b/src/settings.js new file mode 100644 index 0000000..ac1b77c --- /dev/null +++ b/src/settings.js @@ -0,0 +1,57 @@ +export default { + /** + * 网页标题 + */ + title: import.meta.env.VITE_APP_TITLE, + + /** + * 侧边栏主题深色主题theme-dark，浅色主题theme-light + */ + sideTheme: 'theme-dark', + + /** + * 是否系统布局配置 + */ + showSettings: true, + + /** + * 是否显示顶部导航 + */ + topNav: false, + + /** + * 是否显示 tagsView + */ + tagsView: true, + + /** + * 显示页签图标 + */ + tagsIcon: false, + + /** + * 是否固定头部 + */ + fixedHeader: false, + + /** + * 是否显示logo + */ + sidebarLogo: true, + + /** + * 是否显示动态标题 + */ + dynamicTitle: false, + + /** + * 是否显示底部版权 + */ + footerVisible: false, + + /** + * 底部版权文本内容 + */ + footerContent: 'Copyright © 2018-2025 RuoYi. All Rights Reserved.' +} + diff --git a/src/store/index.js b/src/store/index.js new file mode 100644 index 0000000..f10f389 --- /dev/null +++ b/src/store/index.js @@ -0,0 +1,3 @@ +const store = createPinia() + +export default store \ No newline at end of file diff --git a/src/store/modules/app.js b/src/store/modules/app.js new file mode 100644 index 0000000..9a92dd1 --- /dev/null +++ b/src/store/modules/app.js @@ -0,0 +1,46 @@ +import Cookies from 'js-cookie' + +const useAppStore = defineStore( + 'app', + { + state: () => ({ + sidebar: { + opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true, + withoutAnimation: false, + hide: false + }, + device: 'desktop', + size: Cookies.get('size') || 'default' + }), + actions: { + toggleSideBar(withoutAnimation) { + if (this.sidebar.hide) { + return false + } + this.sidebar.opened = !this.sidebar.opened + this.sidebar.withoutAnimation = withoutAnimation + if (this.sidebar.opened) { + Cookies.set('sidebarStatus', 1) + } else { + Cookies.set('sidebarStatus', 0) + } + }, + closeSideBar({ withoutAnimation }) { + Cookies.set('sidebarStatus', 0) + this.sidebar.opened = false + this.sidebar.withoutAnimation = withoutAnimation + }, + toggleDevice(device) { + this.device = device + }, + setSize(size) { + this.size = size + Cookies.set('size', size) + }, + toggleSideBarHide(status) { + this.sidebar.hide = status + } + } + }) + +export default useAppStore diff --git a/src/store/modules/dict.js b/src/store/modules/dict.js new file mode 100644 index 0000000..e58e4ec --- /dev/null +++ b/src/store/modules/dict.js @@ -0,0 +1,57 @@ +const useDictStore = defineStore( + 'dict', + { + state: () => ({ + dict: new Array() + }), + actions: { + // 获取字典 + getDict(_key) { + if (_key == null && _key == "") { + return null + } + try { + for (let i = 0; i < this.dict.length; i++) { + if (this.dict[i].key == _key) { + return this.dict[i].value + } + } + } catch (e) { + return null + } + }, + // 设置字典 + setDict(_key, value) { + if (_key !== null && _key !== "") { + this.dict.push({ + key: _key, + value: value + }) + } + }, + // 删除字典 + removeDict(_key) { + var bln = false + try { + for (let i = 0; i < this.dict.length; i++) { + if (this.dict[i].key == _key) { + this.dict.splice(i, 1) + return true + } + } + } catch (e) { + bln = false + } + return bln + }, + // 清空字典 + cleanDict() { + this.dict = new Array() + }, + // 初始字典 + initDict() { + } + } + }) + +export default useDictStore diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js new file mode 100644 index 0000000..36da015 --- /dev/null +++ b/src/store/modules/permission.js @@ -0,0 +1,127 @@ +import auth from '@/plugins/auth' +import router, { constantRoutes, dynamicRoutes } from '@/router' +import { getRouters } from '@/api/menu' +import Layout from '@/layout/index' +import ParentView from '@/components/ParentView' +import InnerLink from '@/layout/components/InnerLink' + +// 匹配views里面所有的.vue文件 +const modules = import.meta.glob('./../../views/**/*.vue') + +const usePermissionStore = defineStore( + 'permission', + { + state: () => ({ + routes: [], + addRoutes: [], + defaultRoutes: [], + topbarRouters: [], + sidebarRouters: [] + }), + actions: { + setRoutes(routes) { + this.addRoutes = routes + this.routes = constantRoutes.concat(routes) + }, + setDefaultRoutes(routes) { + this.defaultRoutes = constantRoutes.concat(routes) + }, + setTopbarRoutes(routes) { + this.topbarRouters = routes + }, + setSidebarRouters(routes) { + this.sidebarRouters = routes + }, + generateRoutes(roles) { + return new Promise(resolve => { + // 向后端请求路由数据 + getRouters().then(res => { + const sdata = JSON.parse(JSON.stringify(res.data)) + const rdata = JSON.parse(JSON.stringify(res.data)) + const defaultData = JSON.parse(JSON.stringify(res.data)) + const sidebarRoutes = filterAsyncRouter(sdata) + const rewriteRoutes = filterAsyncRouter(rdata, false, true) + const defaultRoutes = filterAsyncRouter(defaultData) + const asyncRoutes = filterDynamicRoutes(dynamicRoutes) + asyncRoutes.forEach(route => { router.addRoute(route) }) + this.setRoutes(rewriteRoutes) + this.setSidebarRouters(constantRoutes.concat(sidebarRoutes)) + this.setDefaultRoutes(sidebarRoutes) + this.setTopbarRoutes(defaultRoutes) + resolve(rewriteRoutes) + }) + }) + } + } + }) + +// 遍历后台传来的路由字符串，转换为组件对象 +function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) { + return asyncRouterMap.filter(route => { + if (type && route.children) { + route.children = filterChildren(route.children) + } + if (route.component) { + // Layout ParentView 组件特殊处理 + if (route.component === 'Layout') { + route.component = Layout + } else if (route.component === 'ParentView') { + route.component = ParentView + } else if (route.component === 'InnerLink') { + route.component = InnerLink + } else { + route.component = loadView(route.component) + } + } + if (route.children != null && route.children && route.children.length) { + route.children = filterAsyncRouter(route.children, route, type) + } else { + delete route['children'] + delete route['redirect'] + } + return true + }) +} + +function filterChildren(childrenMap, lastRouter = false) { + var children = [] + childrenMap.forEach(el => { + el.path = lastRouter ? lastRouter.path + '/' + el.path : el.path + if (el.children && el.children.length && el.component === 'ParentView') { + children = children.concat(filterChildren(el.children, el)) + } else { + children.push(el) + } + }) + return children +} + +// 动态路由遍历，验证是否具备权限 +export function filterDynamicRoutes(routes) { + const res = [] + routes.forEach(route => { + if (route.permissions) { + if (auth.hasPermiOr(route.permissions)) { + res.push(route) + } + } else if (route.roles) { + if (auth.hasRoleOr(route.roles)) { + res.push(route) + } + } + }) + return res +} + +export const loadView = (view) => { + let res + for (const path in modules) { + const dir = path.split('views/')[1].split('.vue')[0] + if (dir === view) { + res = () => modules[path]() + } + } + return res +} + +export default usePermissionStore diff --git a/src/store/modules/setColor.js b/src/store/modules/setColor.js new file mode 100644 index 0000000..592e981 --- /dev/null +++ b/src/store/modules/setColor.js @@ -0,0 +1,91 @@ +import { defineStore } from 'pinia' +import keys from 'lodash/keys' +import { LIGHT_CHART_COLORS, DARK_CHART_COLORS } from '@/utils/color' +import STYLE_CONFIG from '@/utils/colorSet' +// import { store } from '@/store' + +const state = { + ...STYLE_CONFIG, + showSettingPanel: false, + colorList: [], // 颜色列表 + chartColors: [], + requestList: [] // 当前页面下所有的请求接口列表 +} +// TState是state的类型 +// export type TState = typeof state +// 设置主题风格 +const useSettingStore = defineStore('setColor', { + state: () => state, + getters: { + showSidebarLogo: (state) => state.layout === 'side', // 侧边栏logo + showHeaderLogo: (state) => state.layout !== 'side', // 顶部栏logo + displayMode: (state) => { + if (state.mode === 'auto') { + const media = window.matchMedia('(prefers-color-scheme:black)') + if (media.matches) { + return 'black' + } + return 'light' + } + return state.mode + } + }, + actions: { + async changeMode(mode) { + let theme = mode + const media = window.matchMedia('(prefers-color-scheme:black)') + if (media.matches) { + theme = 'black' + } else { + theme = 'light' + } + const isDarkMode = theme === 'black' + + document.documentElement.setAttribute( + 'theme-mode', + isDarkMode ? 'black' : '' + ) + // 图表颜色 + this.chartColors = isDarkMode ? DARK_CHART_COLORS : LIGHT_CHART_COLORS + }, + // 改变主题颜色 + changeBrandTheme(brandTheme) { + document.documentElement.setAttribute('theme-color', brandTheme) + }, + // 添加颜色 + addColor(payload) { + this.colorList = { ...this.colorList, ...payload } + }, + // 更新配置 + updateConfig(payload) { + // 判断点击的是哪一种配置 + for (const key in payload) { + if (payload[key] !== undefined) { + // 将点击的配置赋值给this[key] + this[key] = payload[key] + } + if (key === 'mode') { + this.changeMode(payload[key]) + } + if (key === 'brandTheme') { + this.changeBrandTheme(payload[key]) + } + } + }, + // 将当前页面所有请求添加到请求队列 + addRequestList(request) { + this.requestList.push(request) + }, + addRequestListRes(index, res) { + this.requestList[index].res = res + }, + clearRequestList() { + this.requestList = [] + } + }, + persist: { + paths: [...keys(STYLE_CONFIG), 'colorList', 'chartColors'] + } +}) + +export default useSettingStore diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js new file mode 100644 index 0000000..2913564 --- /dev/null +++ b/src/store/modules/settings.js @@ -0,0 +1,51 @@ +import defaultSettings from '@/settings' +import { useDark, useToggle } from '@vueuse/core' +import { useDynamicTitle } from '@/utils/dynamicTitle' + +const isDark = useDark() +const toggleDark = useToggle(isDark) + +const { sideTheme, showSettings, topNav, tagsView, tagsIcon, fixedHeader, sidebarLogo, dynamicTitle, footerVisible, footerContent } = defaultSettings + +const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '' + +const useSettingsStore = defineStore( + 'settings', + { + state: () => ({ + title: '', + theme: storageSetting.theme || '#409EFF', + sideTheme: storageSetting.sideTheme || sideTheme, + showSettings: showSettings, + topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav, + tagsView: storageSetting.tagsView === undefined ? tagsView : storageSetting.tagsView, + tagsIcon: storageSetting.tagsIcon === undefined ? tagsIcon : storageSetting.tagsIcon, + fixedHeader: storageSetting.fixedHeader === undefined ? fixedHeader : storageSetting.fixedHeader, + sidebarLogo: storageSetting.sidebarLogo === undefined ? sidebarLogo : storageSetting.sidebarLogo, + dynamicTitle: storageSetting.dynamicTitle === undefined ? dynamicTitle : storageSetting.dynamicTitle, + footerVisible: storageSetting.footerVisible === undefined ? footerVisible : storageSetting.footerVisible, + footerContent: footerContent, + isDark: isDark.value + }), + actions: { + // 修改布局设置 + changeSetting(data) { + const { key, value } = data + if (this.hasOwnProperty(key)) { + this[key] = value + } + }, + // 设置网页标题 + setTitle(title) { + this.title = title + useDynamicTitle() + }, + // 切换暗黑模式 + toggleTheme() { + this.isDark = !this.isDark + toggleDark() + } + } + }) + +export default useSettingsStore diff --git a/src/store/modules/tagsView.js b/src/store/modules/tagsView.js new file mode 100644 index 0000000..9d07f33 --- /dev/null +++ b/src/store/modules/tagsView.js @@ -0,0 +1,182 @@ +const useTagsViewStore = defineStore( + 'tags-view', + { + state: () => ({ + visitedViews: [], + cachedViews: [], + iframeViews: [] + }), + actions: { + addView(view) { + this.addVisitedView(view) + this.addCachedView(view) + }, + addIframeView(view) { + if (this.iframeViews.some(v => v.path === view.path)) return + this.iframeViews.push( + Object.assign({}, view, { + title: view.meta.title || 'no-name' + }) + ) + }, + addVisitedView(view) { + if (this.visitedViews.some(v => v.path === view.path)) return + this.visitedViews.push( + Object.assign({}, view, { + title: view.meta.title || 'no-name' + }) + ) + }, + addCachedView(view) { + if (this.cachedViews.includes(view.name)) return + if (!view.meta.noCache) { + this.cachedViews.push(view.name) + } + }, + delView(view) { + return new Promise(resolve => { + this.delVisitedView(view) + this.delCachedView(view) + resolve({ + visitedViews: [...this.visitedViews], + cachedViews: [...this.cachedViews] + }) + }) + }, + delVisitedView(view) { + return new Promise(resolve => { + for (const [i, v] of this.visitedViews.entries()) { + if (v.path === view.path) { + this.visitedViews.splice(i, 1) + break + } + } + this.iframeViews = this.iframeViews.filter(item => item.path !== view.path) + resolve([...this.visitedViews]) + }) + }, + delIframeView(view) { + return new Promise(resolve => { + this.iframeViews = this.iframeViews.filter(item => item.path !== view.path) + resolve([...this.iframeViews]) + }) + }, + delCachedView(view) { + return new Promise(resolve => { + const index = this.cachedViews.indexOf(view.name) + index > -1 && this.cachedViews.splice(index, 1) + resolve([...this.cachedViews]) + }) + }, + delOthersViews(view) { + return new Promise(resolve => { + this.delOthersVisitedViews(view) + this.delOthersCachedViews(view) + resolve({ + visitedViews: [...this.visitedViews], + cachedViews: [...this.cachedViews] + }) + }) + }, + delOthersVisitedViews(view) { + return new Promise(resolve => { + this.visitedViews = this.visitedViews.filter(v => { + return v.meta.affix || v.path === view.path + }) + this.iframeViews = this.iframeViews.filter(item => item.path === view.path) + resolve([...this.visitedViews]) + }) + }, + delOthersCachedViews(view) { + return new Promise(resolve => { + const index = this.cachedViews.indexOf(view.name) + if (index > -1) { + this.cachedViews = this.cachedViews.slice(index, index + 1) + } else { + this.cachedViews = [] + } + resolve([...this.cachedViews]) + }) + }, + delAllViews(view) { + return new Promise(resolve => { + this.delAllVisitedViews(view) + this.delAllCachedViews(view) + resolve({ + visitedViews: [...this.visitedViews], + cachedViews: [...this.cachedViews] + }) + }) + }, + delAllVisitedViews(view) { + return new Promise(resolve => { + const affixTags = this.visitedViews.filter(tag => tag.meta.affix) + this.visitedViews = affixTags + this.iframeViews = [] + resolve([...this.visitedViews]) + }) + }, + delAllCachedViews(view) { + return new Promise(resolve => { + this.cachedViews = [] + resolve([...this.cachedViews]) + }) + }, + updateVisitedView(view) { + for (let v of this.visitedViews) { + if (v.path === view.path) { + v = Object.assign(v, view) + break + } + } + }, + delRightTags(view) { + return new Promise(resolve => { + const index = this.visitedViews.findIndex(v => v.path === view.path) + if (index === -1) { + return + } + this.visitedViews = this.visitedViews.filter((item, idx) => { + if (idx <= index || (item.meta && item.meta.affix)) { + return true + } + const i = this.cachedViews.indexOf(item.name) + if (i > -1) { + this.cachedViews.splice(i, 1) + } + if(item.meta.link) { + const fi = this.iframeViews.findIndex(v => v.path === item.path) + this.iframeViews.splice(fi, 1) + } + return false + }) + resolve([...this.visitedViews]) + }) + }, + delLeftTags(view) { + return new Promise(resolve => { + const index = this.visitedViews.findIndex(v => v.path === view.path) + if (index === -1) { + return + } + this.visitedViews = this.visitedViews.filter((item, idx) => { + if (idx >= index || (item.meta && item.meta.affix)) { + return true + } + const i = this.cachedViews.indexOf(item.name) + if (i > -1) { + this.cachedViews.splice(i, 1) + } + if(item.meta.link) { + const fi = this.iframeViews.findIndex(v => v.path === item.path) + this.iframeViews.splice(fi, 1) + } + return false + }) + resolve([...this.visitedViews]) + }) + } + } + }) + +export default useTagsViewStore diff --git a/src/store/modules/user.js b/src/store/modules/user.js new file mode 100644 index 0000000..c8db86f --- /dev/null +++ b/src/store/modules/user.js @@ -0,0 +1,89 @@ +import router from '@/router' +import { ElMessageBox, } from 'element-plus' +import { login, logout, getInfo } from '@/api/login' +import { getToken, setToken, removeToken } from '@/utils/auth' +import { isEmpty } from "@/utils/validate" +import defAva from '@/assets/images/profile.jpg' + +const useUserStore = defineStore( + 'user', + { + state: () => ({ + token: getToken(), + id: '', + name: '', + nickName: '', + avatar: '', + roles: [], + permissions: [] + }), + actions: { + // 登录 + login(userInfo) { + const username = userInfo.username.trim() + const password = userInfo.password + const code = userInfo.code + const uuid = userInfo.uuid + return new Promise((resolve, reject) => { + login(username, password, code, uuid).then(res => { + let data = res.data + setToken(data.access_token) + this.token = data.access_token + resolve() + }).catch(error => { + reject(error) + }) + }) + }, + // 获取用户信息 + getInfo() { + return new Promise((resolve, reject) => { + getInfo().then(res => { + const user = res.user + const avatar = (isEmpty(user.avatar)) ? defAva : user.avatar + if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组 + this.roles = res.roles + this.permissions = res.permissions + } else { + this.roles = ['ROLE_DEFAULT'] + } + this.id = user.userId + this.name = user.userName + this.nickName = user.nickName + this.avatar = avatar + /* 初始密码提示 */ + if(res.isDefaultModifyPwd) { + ElMessageBox.confirm('您的密码还是初始密码，请修改密码！', '安全提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { + router.push({ name: 'Profile', params: { activeTab: 'resetPwd' } }) + }).catch(() => {}) + } + /* 过期密码提示 */ + if(!res.isDefaultModifyPwd && res.isPasswordExpired) { + ElMessageBox.confirm('您的密码已过期，请尽快修改密码！', '安全提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { + router.push({ name: 'Profile', params: { activeTab: 'resetPwd' } }) + }).catch(() => {}) + } + resolve(res) + }).catch(error => { + reject(error) + }) + }) + }, + // 退出系统 + logOut() { + return new Promise((resolve, reject) => { + logout(this.token).then(() => { + this.token = '' + this.roles = [] + this.permissions = [] + removeToken() + resolve() + }).catch(error => { + reject(error) + }) + }) + } + } + }) + +export default useUserStore diff --git a/src/utils/auth.js b/src/utils/auth.js new file mode 100644 index 0000000..a673d22 --- /dev/null +++ b/src/utils/auth.js @@ -0,0 +1,29 @@ +import Cookies from 'js-cookie' + +const TokenKey = 'Admin-Token' + +const ExpiresInKey = 'Admin-Expires-In' + +export function getToken() { + return Cookies.get(TokenKey) +} + +export function setToken(token) { + return Cookies.set(TokenKey, token) +} + +export function removeToken() { + return Cookies.remove(TokenKey) +} + +export function getExpiresIn() { + return Cookies.get(ExpiresInKey) || -1 +} + +export function setExpiresIn(time) { + return Cookies.set(ExpiresInKey, time) +} + +export function removeExpiresIn() { + return Cookies.remove(ExpiresInKey) +} diff --git a/src/utils/charts.js b/src/utils/charts.js new file mode 100644 index 0000000..6941370 --- /dev/null +++ b/src/utils/charts.js @@ -0,0 +1,45 @@ +import dayjs from 'dayjs' + +/** + * 获取表头数据 + * + * @export + * @param {string[]} dateTime + * @param {number} divideNum + * @returns {string[]} + */ +export function getDateArray( + dateTime= [], + divideNum = 10 +) { + const timeArray = [] + if (dateTime.length > 0) { + for (let i = 0; i < divideNum; i++) { + const dateAbsTime = + (dayjs(dateTime[1]).valueOf() - dayjs(dateTime[0]).valueOf()) / + divideNum + const enhandTime = dayjs(dateTime[0]).valueOf() + dateAbsTime * i + timeArray.push(dayjs(enhandTime).format('YYYY-MM-DD')) + } + } + + return timeArray +} + +/** + * 获取随机数 + * + * @param {number} [num=100] + * @returns + * + * @memberOf DashboardBase + */ +export function getRandomArray(num = 100) { + let resultNum = Number((Math.random() * num).toFixed(0)) + + if (resultNum <= 1) { + resultNum = 1 + } + + return resultNum +} diff --git a/src/utils/color.js b/src/utils/color.js new file mode 100644 index 0000000..1181d66 --- /dev/null +++ b/src/utils/color.js @@ -0,0 +1,56 @@ +import * as echarts from 'echarts/core' + +export const LIGHT_CHART_COLORS = { + textColor: 'rgba(0, 0, 0, 0.9)', + placeholderColor: 'rgba(0, 0, 0, 0.35)', + borderColor: '#dcdcdc', + containerColor: '#fff' +} + +export const DARK_CHART_COLORS = { + textColor: 'rgba(255, 255, 255, 0.9)', + placeholderColor: 'rgba(255, 255, 255, 0.35)', + borderColor: '#5e5e5e', + containerColor: '#242424' +} + +// /** 图表颜色 */ +export function getChartListColor(){ + const res = [ + '#d7f1ed', + '#46CDBC', + '#00a870', + '#ebb105', + '#ed7b2f', + '#e34d59', + '#ed49b4', + '#834ec2' + ] + return res +} + +// /** +// * 更改图表主题颜色 +// * +// * @export +// * @param {Array} chartsList +// * @param {string} theme +// */ +export function changeChartsTheme(chartsList){ + if (chartsList && chartsList.length) { + const chartChangeColor = getChartListColor() + + for (let index = 0; index < chartsList.length; index++) { + const elementChart = chartsList[index] + + if (elementChart) { + const optionVal = elementChart.getOption() + + // 更改主题颜色 + optionVal.color = chartChangeColor + + elementChart.setOption(optionVal, true) + } + } + } +} diff --git a/src/utils/colorSet.js b/src/utils/colorSet.js new file mode 100644 index 0000000..31aeb32 --- /dev/null +++ b/src/utils/colorSet.js @@ -0,0 +1,14 @@ +export default { + showApiModal: false, // 是否展示接口测试工具 + showSidebar: true, // 是否显示侧边栏 + isSidebarCompact: false, // 侧边栏是否展开（这里设置没有用，在SideNav组件中再onMounted中会自动将该值设置为false，也就是默认展开侧边栏） + showBreadcrumb: true, // 是否展示面包屑 + mode: 'light', // 主题模式 light black + brandTheme: 'default', // 主题色配置(mode1/mode2/mode3/mode4/mode5) + layout: 'top', // 整体布局 'side'左右；"top" 上左右； + style: 'topMany', // 侧边栏菜单风格(noSecondMenu无二级导航菜单风格、normal正常风格、topMany(仅配合top使用)) + isHeaderFixed: true, // 头部是否固定(只针对top上左右生效，且如果修改为false需要配合top.less里的样式注释配合使用) + isUseTabsRouter: false, // 是否使用多标签页功能（tab标签方式记录） + showHeader: true // 是否展示头部（只针对top上下左右的布局生效） + } + \ No newline at end of file diff --git a/src/utils/date.js b/src/utils/date.js new file mode 100644 index 0000000..4f60284 --- /dev/null +++ b/src/utils/date.js @@ -0,0 +1,220 @@ +// 获取常用时间 +import dayjs from 'dayjs' + +export const LAST_7_DAYS = [ + dayjs().subtract(7, 'day').format('YYYY-MM-DD'), + dayjs().subtract(1, 'day').format('YYYY-MM-DD') +] + +export const LAST_30_DAYS = [ + dayjs().subtract(30, 'day').format('YYYY-MM-DD'), + dayjs().subtract(1, 'day').format('YYYY-MM-DD') +] +// 获取日期转换 +// 获取处理当前日期，时分秒以00:00:00显示 +export const getTate = (time) => { + const date = new Date() + const y = date.getFullYear() + const m = date.getMonth() + 1 + const d = date.getDate() + return `${addZero(y)}-${addZero(m)}-${addZero(d)}T${time}:00` +} +// 获取处理当前日期，去除T +export const getTateDt = (time) => { + const date = new Date(time) + const y = date.getFullYear() + const m = date.getMonth() + 1 + const d = date.getDate() + const h = date.getHours() + const min = date.getMinutes() + const Sec = date.getSeconds() + return `${addZero(y)}-${addZero(m)}-${addZero(d)} ${addZero(h)}:${addZero( + min + )}:${addZero(Sec)}` +} +// 获取处理当前日期，添加T +export const getTateAddt = (time) => { + const date = new Date(time) + const y = date.getFullYear() + const m = date.getMonth() + 1 + const d = date.getDate() + const h = date.getHours() + const min = date.getMinutes() + const Sec = date.getSeconds() + return `${addZero(y)}-${addZero(m)}-${addZero(d)}T${addZero(h)}:${addZero( + min + )}:${addZero(Sec)}` +} +// 获取时间段时分00:00 +export const getTime = (val) => { + const date = new Date(val) + const h = date.getHours() + const min = date.getMinutes() + return `${addZero(h)}:${addZero(min)}` +} +// 时间不足两位在前面补0 +export const addZero = (s) => { + return s < 10 ? `0${s}` : s +} +// 获取年月日 +export const getDateInfo = (time) => { + const date = new Date(time) + const y = date.getFullYear() + const m = date.getMonth() + 1 + const d = date.getDate() + return `${addZero(y)}-${addZero(m)}-${addZero(d)}` +} +// 获取年月日 +export const getYearMonthInfo = (time) => { + const date = new Date(time) + const y = date.getFullYear() + const m = date.getMonth() + 1 + return `${addZero(y)}-${addZero(m)}` +} +// 获取月份的天数 +export const getMonthInfo = (time) => { + const todayDate = new Date() + const date = new Date(time) + const y = date.getFullYear() + const m = date.getMonth() + 1 + const d = todayDate.getDate() + const newm = todayDate.getMonth() + 1 + const days = new Date(y, m, 0).getDate() + const dayObj = { + days, + surplusDay: m > newm ? days : days - d + } + return dayObj +} +// 获取两个日期之间的天数 +export const getDays = (startTime, endTime) => { + const start = new Date(startTime).getTime() + const end = new Date(endTime).getTime() + const days = Math.floor((end - start) / 86400000) + return days + 1 +} +// 时间戳转日期 +export const getTimestamp = (time) => { + // 此处时间戳以毫秒为单位 + const date = new Date(parseInt(time)) + const Year = date.getFullYear() + const Moth = + date.getMonth() + 1 < 10 ? `0${date.getMonth() + 1}` : date.getMonth() + 1 + const Day = date.getDate() < 10 ? `0${date.getDate()}` : date.getDate() + const Hour = date.getHours() < 10 ? `0${date.getHours()}` : date.getHours() + const Minute = + date.getMinutes() < 10 ? `0${date.getMinutes()}` : date.getMinutes() + const Sechond = + date.getSeconds() < 10 ? `0${date.getSeconds()}` : date.getSeconds() + const GMT = `${Year}-${Moth}-${Day} ${Hour}:${Minute}:${Sechond}` + return GMT +} +// 获取一个小时的 +export function getHours() { + const date = new Date() + const hour = new Date(date.getTime() - 1 * 60 * 60 * 1000) + return hour +} +// 获取24小时的 +export function getHours24() { + const date = new Date() + const hour = new Date(date.getTime() - 24 * 60 * 60 * 1000) + return hour +} +// 获取7天前的日期 +export function getDay7() { + const date = new Date() + const day = new Date(date.getTime() - 7 * 24 * 60 * 60 * 1000) + return day +} +// 获取开始时间戳 +export const getStartTimeStr = (time) => { + console.log(time) + const date = getStartTime(time) + return new Date(date).getTime() +} +// 获取结束时间戳 +export const getEndTimeStr = (time) => { + const date = getEndTime(time) + return new Date(date).getTime() +} +// 获取开始时间日期 +export const getStartTime = (time) => { + return getTateDt(new Date(`${time} 00:00:00`)) +} +// 获取结束时间日期 +export const getEndTime = (time) => { + return getTateDt(new Date(`${time} 23:59:59`)) +} +// // +// export const getStartMonthStr = (time) => { +// const date = new Date(new Date(time).getTime()) +// const y = date.getFullYear() +// const m = date.getMonth() + 1 +// return new Date(`${addZero(y)}-${addZero(m)}- 01`).getTime() +// } +// export const getEndMonthStr = (time) => { +// const date = new Date(new Date(time).getTime()) +// const y = date.getFullYear() +// const m = date.getMonth() + 1 +// const days = new Date(y, m, 0).getDate() +// return new Date(`${addZero(y)}-${addZero(m)}-${days}`).getTime() +// } + +// 根据参数日期获取具体日期信息 +export const formatDate = function (date) { + const year = date.getFullYear() + const month = date.getMonth() + 1 + const day = date.getDate() + const week = ['日', '一', '二', '三', '四', '五', '六'][date.getDay()] + + const dateInfo = { + date: new Date(date), + dateStr: `${year}-${month.toString().padStart(2, '0')}-${day + .toString() + .padStart(2, '0')}`, + year, + month, + day, + week, + isToday: false + } + + const today = new Date() + // 判断是否为当天 + if ( + today.getFullYear() === year && + today.getMonth() + 1 === month && + today.getDate() === day + ) { + dateInfo.isToday = true + } + return dateInfo +} + +// 根据基准日期，获取长度为dayLenth的日期数组 +export const setDate = function (date, step = 7) { + const weekData = [] + const week = date.getDay() - 0 // 0是从周日至周六；1是从周一至周日 + date = getDateByDate(date, week * -1) + for (let i = 0; i < step; i++) { + weekData.push(formatDate(i === 0 ? date : getDateByDate(date, 1))) + } + return weekData +} + +// 根据基准日期获取前后某天的日期对象 +export const getDateByDate = function (date, range = 0) { + date.setDate(date.getDate() + range) + return date +} + +/* + 获取以baselineDate所在周的一周、前一周、下一周的日期和星期信息(切换周期也可通过参数dayLenth自行设置) + baselineDate: 设置的基准日期(返回的日期列表的第一个日期) + range: 以 baselineDate 为基准日期的前后天数范围(如基准日期的range为0，需要返回前7天日期，则range为-7，后7天则range为7) + step: 需要获取的日期信息周期天数，默认获取baselineDate所在周的一周日期信息 + */ +export const getWeekDate = ({ baselineDate, range = 0, step = 7 }) => { + return setDate(getDateByDate(baselineDate, range), step) +} diff --git a/src/utils/dict.js b/src/utils/dict.js new file mode 100644 index 0000000..b154f72 --- /dev/null +++ b/src/utils/dict.js @@ -0,0 +1,24 @@ +import useDictStore from '@/store/modules/dict' +import { getDicts } from '@/api/system/dict/data' + +/** + * 获取字典数据 + */ +export function useDict(...args) { + const res = ref({}) + return (() => { + args.forEach((dictType, index) => { + res.value[dictType] = [] + const dicts = useDictStore().getDict(dictType) + if (dicts) { + res.value[dictType] = dicts + } else { + getDicts(dictType).then(resp => { + res.value[dictType] = resp.data.map(p => ({ label: p.dictLabel, value: p.dictValue, elTagType: p.listClass, elTagClass: p.cssClass })) + useDictStore().setDict(dictType, res.value[dictType]) + }) + } + }) + return toRefs(res.value) + })() +} \ No newline at end of file diff --git a/src/utils/dynamicTitle.js b/src/utils/dynamicTitle.js new file mode 100644 index 0000000..ca4aa5d --- /dev/null +++ b/src/utils/dynamicTitle.js @@ -0,0 +1,14 @@ +import defaultSettings from '@/settings' +import useSettingsStore from '@/store/modules/settings' + +/** + * 动态修改标题 + */ +export function useDynamicTitle() { + const settingsStore = useSettingsStore() + if (settingsStore.dynamicTitle) { + document.title = settingsStore.title + ' - ' + defaultSettings.title + } else { + document.title = defaultSettings.title + } +} \ No newline at end of file diff --git a/src/utils/errorCode.js b/src/utils/errorCode.js new file mode 100644 index 0000000..d2111ee --- /dev/null +++ b/src/utils/errorCode.js @@ -0,0 +1,6 @@ +export default { + '401': '认证失败，无法访问系统资源', + '403': '当前操作没有权限', + '404': '访问资源不存在', + 'default': '系统未知错误，请反馈给管理员' +} diff --git a/src/utils/generator/config.js b/src/utils/generator/config.js new file mode 100644 index 0000000..449715f --- /dev/null +++ b/src/utils/generator/config.js @@ -0,0 +1,452 @@ +export const formConf = { + formRef: 'formRef', + formModel: 'formData', + size: 'default', + labelPosition: 'right', + labelWidth: 100, + formRules: 'rules', + gutter: 15, + disabled: false, + span: 24, + formBtns: true, +} + +export const inputComponents = [ + { + label: '单行文本', + tag: 'el-input', + tagIcon: 'input', + type: 'text', + placeholder: '请输入', + defaultValue: undefined, + span: 24, + labelWidth: null, + style: { width: '100%' }, + clearable: true, + prepend: '', + append: '', + 'prefix-icon': '', + 'suffix-icon': '', + maxlength: null, + 'show-word-limit': false, + readonly: false, + disabled: false, + required: true, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/input', + }, + { + label: '多行文本', + tag: 'el-input', + tagIcon: 'textarea', + type: 'textarea', + placeholder: '请输入', + defaultValue: undefined, + span: 24, + labelWidth: null, + autosize: { + minRows: 4, + maxRows: 4, + }, + style: { width: '100%' }, + maxlength: null, + 'show-word-limit': false, + readonly: false, + disabled: false, + required: true, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/input', + }, + { + label: '密码', + tag: 'el-input', + tagIcon: 'password', + type: 'password', + placeholder: '请输入', + defaultValue: undefined, + span: 24, + 'show-password': true, + labelWidth: null, + style: { width: '100%' }, + clearable: true, + prepend: '', + append: '', + 'prefix-icon': '', + 'suffix-icon': '', + maxlength: null, + 'show-word-limit': false, + readonly: false, + disabled: false, + required: true, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/input', + }, + { + label: '计数器', + tag: 'el-input-number', + tagIcon: 'number', + placeholder: '', + defaultValue: undefined, + span: 24, + labelWidth: null, + min: undefined, + max: undefined, + step: undefined, + 'step-strictly': false, + precision: undefined, + 'controls-position': '', + disabled: false, + required: true, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/input-number', + }, +] + +export const selectComponents = [ + { + label: '下拉选择', + tag: 'el-select', + tagIcon: 'select', + placeholder: '请选择', + defaultValue: undefined, + span: 24, + labelWidth: null, + style: { width: '100%' }, + clearable: true, + disabled: false, + required: true, + filterable: false, + multiple: false, + options: [ + { + label: '选项一', + value: 1, + }, + { + label: '选项二', + value: 2, + }, + ], + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/select', + }, + { + label: '级联选择', + tag: 'el-cascader', + tagIcon: 'cascader', + placeholder: '请选择', + defaultValue: [], + span: 24, + labelWidth: null, + style: { width: '100%' }, + props: { + props: { + multiple: false, + }, + }, + 'show-all-levels': true, + disabled: false, + clearable: true, + filterable: false, + required: true, + options: [ + { + id: 1, + value: 1, + label: '选项1', + children: [ + { + id: 2, + value: 2, + label: '选项1-1', + }, + ], + }, + ], + dataType: 'dynamic', + labelKey: 'label', + valueKey: 'value', + childrenKey: 'children', + separator: '/', + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/cascader', + }, + { + label: '单选框组', + tag: 'el-radio-group', + tagIcon: 'radio', + defaultValue: 0, + span: 24, + labelWidth: null, + style: {}, + optionType: 'default', + border: false, + size: 'default', + disabled: false, + required: true, + options: [ + { + label: '选项一', + value: 1, + }, + { + label: '选项二', + value: 2, + }, + ], + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/radio', + }, + { + label: '多选框组', + tag: 'el-checkbox-group', + tagIcon: 'checkbox', + defaultValue: [], + span: 24, + labelWidth: null, + style: {}, + optionType: 'default', + border: false, + size: 'default', + disabled: false, + required: true, + options: [ + { + label: '选项一', + value: 1, + }, + { + label: '选项二', + value: 2, + }, + ], + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/checkbox', + }, + { + label: '开关', + tag: 'el-switch', + tagIcon: 'switch', + defaultValue: false, + span: 24, + labelWidth: null, + style: {}, + disabled: false, + required: true, + 'active-text': '', + 'inactive-text': '', + 'active-color': null, + 'inactive-color': null, + 'active-value': true, + 'inactive-value': false, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/switch', + }, + { + label: '滑块', + tag: 'el-slider', + tagIcon: 'slider', + defaultValue: null, + span: 24, + labelWidth: null, + disabled: false, + required: true, + min: 0, + max: 100, + step: 1, + 'show-stops': false, + range: false, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/slider', + }, + { + label: '时间选择', + tag: 'el-time-picker', + tagIcon: 'time', + placeholder: '请选择', + defaultValue: '', + span: 24, + labelWidth: null, + style: { width: '100%' }, + disabled: false, + clearable: true, + required: true, + format: 'HH:mm:ss', + 'value-format': 'HH:mm:ss', + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/time-picker', + }, + { + label: '时间范围', + tag: 'el-time-picker', + tagIcon: 'time-range', + defaultValue: null, + span: 24, + labelWidth: null, + style: { width: '100%' }, + disabled: false, + clearable: true, + required: true, + 'is-range': true, + 'range-separator': '至', + 'start-placeholder': '开始时间', + 'end-placeholder': '结束时间', + format: 'HH:mm:ss', + 'value-format': 'HH:mm:ss', + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/time-picker', + }, + { + label: '日期选择', + tag: 'el-date-picker', + tagIcon: 'date', + placeholder: '请选择', + defaultValue: null, + type: 'date', + span: 24, + labelWidth: null, + style: { width: '100%' }, + disabled: false, + clearable: true, + required: true, + format: 'YYYY-MM-DD', + 'value-format': 'YYYY-MM-DD', + readonly: false, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/date-picker', + }, + { + label: '日期范围', + tag: 'el-date-picker', + tagIcon: 'date-range', + defaultValue: null, + span: 24, + labelWidth: null, + style: { width: '100%' }, + type: 'daterange', + 'range-separator': '至', + 'start-placeholder': '开始日期', + 'end-placeholder': '结束日期', + disabled: false, + clearable: true, + required: true, + format: 'YYYY-MM-DD', + 'value-format': 'YYYY-MM-DD', + readonly: false, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/date-picker', + }, + { + label: '评分', + tag: 'el-rate', + tagIcon: 'rate', + defaultValue: 0, + span: 24, + labelWidth: null, + style: {}, + max: 5, + 'allow-half': false, + 'show-text': false, + 'show-score': false, + disabled: false, + required: true, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/rate', + }, + { + label: '颜色选择', + tag: 'el-color-picker', + tagIcon: 'color', + defaultValue: null, + labelWidth: null, + 'show-alpha': false, + 'color-format': '', + disabled: false, + required: true, + size: 'default', + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/color-picker', + }, + { + label: '上传', + tag: 'el-upload', + tagIcon: 'upload', + action: 'https://jsonplaceholder.typicode.com/posts/', + defaultValue: null, + labelWidth: null, + disabled: false, + required: true, + accept: '', + name: 'file', + 'auto-upload': true, + showTip: false, + buttonText: '点击上传', + fileSize: 2, + sizeUnit: 'MB', + 'list-type': 'text', + multiple: false, + regList: [], + changeTag: true, + document: 'https://element-plus.org/zh-CN/component/upload', + tip: '只能上传不超过 2MB 的文件', + style: { width: '100%' }, + }, +] + +export const layoutComponents = [ + { + layout: 'rowFormItem', + tagIcon: 'row', + type: 'default', + justify: 'start', + align: 'top', + label: '行容器', + layoutTree: true, + children: [], + document: 'https://element-plus.org/zh-CN/component/layout', + }, + { + layout: 'colFormItem', + label: '按钮', + changeTag: true, + labelWidth: null, + tag: 'el-button', + tagIcon: 'button', + span: 24, + default: '主要按钮', + type: 'primary', + icon: 'Search', + size: 'default', + disabled: false, + document: 'https://element-plus.org/zh-CN/component/button', + }, +] + +// 组件rule的触发方式，无触发方式的组件不生成rule +export const trigger = { + 'el-input': 'blur', + 'el-input-number': 'blur', + 'el-select': 'change', + 'el-radio-group': 'change', + 'el-checkbox-group': 'change', + 'el-cascader': 'change', + 'el-time-picker': 'change', + 'el-date-picker': 'change', + 'el-rate': 'change', +} diff --git a/src/utils/generator/css.js b/src/utils/generator/css.js new file mode 100644 index 0000000..c1c62e6 --- /dev/null +++ b/src/utils/generator/css.js @@ -0,0 +1,18 @@ +const styles = { + 'el-rate': '.el-rate{display: inline-block; vertical-align: text-top;}', + 'el-upload': '.el-upload__tip{line-height: 1.2;}' +} + +function addCss(cssList, el) { + const css = styles[el.tag] + css && cssList.indexOf(css) === -1 && cssList.push(css) + if (el.children) { + el.children.forEach(el2 => addCss(cssList, el2)) + } +} + +export function makeUpCss(conf) { + const cssList = [] + conf.fields.forEach(el => addCss(cssList, el)) + return cssList.join('\n') +} diff --git a/src/utils/generator/drawingDefalut.js b/src/utils/generator/drawingDefalut.js new file mode 100644 index 0000000..1105c28 --- /dev/null +++ b/src/utils/generator/drawingDefalut.js @@ -0,0 +1,29 @@ +export default [ + { + layout: 'colFormItem', + tagIcon: 'input', + label: '手机号', + vModel: 'mobile', + formId: 6, + tag: 'el-input', + placeholder: '请输入手机号', + defaultValue: '', + span: 24, + style: { width: '100%' }, + clearable: true, + prepend: '', + append: '', + 'prefix-icon': 'Cellphone', + 'suffix-icon': '', + maxlength: 11, + 'show-word-limit': true, + readonly: false, + disabled: false, + required: true, + changeTag: true, + regList: [{ + pattern: '/^1(3|4|5|7|8|9)\\d{9}$/', + message: '手机号格式错误' + }] + } +] diff --git a/src/utils/generator/html.js b/src/utils/generator/html.js new file mode 100644 index 0000000..4b29841 --- /dev/null +++ b/src/utils/generator/html.js @@ -0,0 +1,359 @@ +/* eslint-disable max-len */ +import { trigger } from './config' + +let confGlobal +let someSpanIsNot24 + +export function dialogWrapper(str) { + return ` + ${str} + + ` +} + +export function vueTemplate(str) { + return `` +} + +export function vueScript(str) { + return `` +} + +export function cssStyle(cssStr) { + return `` +} + +function buildFormTemplate(conf, child, type) { + let labelPosition = '' + if (conf.labelPosition !== 'right') { + labelPosition = `label-position="${conf.labelPosition}"` + } + const disabled = conf.disabled ? `:disabled="${conf.disabled}"` : '' + let str = ` + ${child} + ${buildFromBtns(conf, type)} + ` + if (someSpanIsNot24) { + str = ` + ${str} + ` + } + return str +} + +function buildFromBtns(conf, type) { + let str = '' + if (conf.formBtns && type === 'file') { + str = ` + 提交 + 重置 + ` + if (someSpanIsNot24) { + str = ` + ${str} + ` + } + } + return str +} + +// span不为24的用el-col包裹 +function colWrapper(element, str) { + if (someSpanIsNot24 || element.span !== 24) { + return ` + ${str} + ` + } + return str +} + +const layouts = { + colFormItem(element) { + let labelWidth = '' + if (element.labelWidth && element.labelWidth !== confGlobal.labelWidth) { + labelWidth = `label-width="${element.labelWidth}px"` + } + const required = !trigger[element.tag] && element.required ? 'required' : '' + const tagDom = tags[element.tag] ? tags[element.tag](element) : null + let str = ` + ${tagDom} + ` + str = colWrapper(element, str) + return str + }, + rowFormItem(element) { + const type = element.type === 'default' ? '' : `type="${element.type}"` + const justify = element.type === 'default' ? '' : `justify="${element.justify}"` + const align = element.type === 'default' ? '' : `align="${element.align}"` + const gutter = element.gutter ? `gutter="${element.gutter}"` : '' + const children = element.children.map(el => layouts[el.layout](el)) + let str = ` + ${children.join('\n')} + ` + str = colWrapper(element, str) + return str + } +} + +const tags = { + 'el-button': el => { + const { + tag, disabled + } = attrBuilder(el) + const type = el.type ? `type="${el.type}"` : '' + const icon = el.icon ? `icon="${el.icon}"` : '' + const size = el.size ? `size="${el.size}"` : '' + let child = buildElButtonChild(el) + + if (child) child = `\n${child}\n` // 换行 + return `<${el.tag} ${type} ${icon} ${size} ${disabled}>${child}` + }, + 'el-input': el => { + const { + disabled, vModel, clearable, placeholder, width + } = attrBuilder(el) + const maxlength = el.maxlength ? `:maxlength="${el.maxlength}"` : '' + const showWordLimit = el['show-word-limit'] ? 'show-word-limit' : '' + const readonly = el.readonly ? 'readonly' : '' + const prefixIcon = el['prefix-icon'] ? `prefix-icon='${el['prefix-icon']}'` : '' + const suffixIcon = el['suffix-icon'] ? `suffix-icon='${el['suffix-icon']}'` : '' + const showPassword = el['show-password'] ? 'show-password' : '' + const type = el.type ? `type="${el.type}"` : '' + const autosize = el.autosize && el.autosize.minRows + ? `:autosize="{minRows: ${el.autosize.minRows}, maxRows: ${el.autosize.maxRows}}"` + : '' + let child = buildElInputChild(el) + + if (child) child = `\n${child}\n` // 换行 + return `<${el.tag} ${vModel} ${type} ${placeholder} ${maxlength} ${showWordLimit} ${readonly} ${disabled} ${clearable} ${prefixIcon} ${suffixIcon} ${showPassword} ${autosize} ${width}>${child}` + }, + 'el-input-number': el => { + const { disabled, vModel, placeholder } = attrBuilder(el) + const controlsPosition = el['controls-position'] ? `controls-position=${el['controls-position']}` : '' + const min = el.min ? `:min='${el.min}'` : '' + const max = el.max ? `:max='${el.max}'` : '' + const step = el.step ? `:step='${el.step}'` : '' + const stepStrictly = el['step-strictly'] ? 'step-strictly' : '' + const precision = el.precision ? `:precision='${el.precision}'` : '' + + return `<${el.tag} ${vModel} ${placeholder} ${step} ${stepStrictly} ${precision} ${controlsPosition} ${min} ${max} ${disabled}>` + }, + 'el-select': el => { + const { + disabled, vModel, clearable, placeholder, width + } = attrBuilder(el) + const filterable = el.filterable ? 'filterable' : '' + const multiple = el.multiple ? 'multiple' : '' + let child = buildElSelectChild(el) + + if (child) child = `\n${child}\n` // 换行 + return `<${el.tag} ${vModel} ${placeholder} ${disabled} ${multiple} ${filterable} ${clearable} ${width}>${child}` + }, + 'el-radio-group': el => { + const { disabled, vModel } = attrBuilder(el) + const size = `size="${el.size}"` + let child = buildElRadioGroupChild(el) + + if (child) child = `\n${child}\n` // 换行 + return `<${el.tag} ${vModel} ${size} ${disabled}>${child}` + }, + 'el-checkbox-group': el => { + const { disabled, vModel } = attrBuilder(el) + const size = `size="${el.size}"` + const min = el.min ? `:min="${el.min}"` : '' + const max = el.max ? `:max="${el.max}"` : '' + let child = buildElCheckboxGroupChild(el) + + if (child) child = `\n${child}\n` // 换行 + return `<${el.tag} ${vModel} ${min} ${max} ${size} ${disabled}>${child}` + }, + 'el-switch': el => { + const { disabled, vModel } = attrBuilder(el) + const activeText = el['active-text'] ? `active-text="${el['active-text']}"` : '' + const inactiveText = el['inactive-text'] ? `inactive-text="${el['inactive-text']}"` : '' + const activeColor = el['active-color'] ? `active-color="${el['active-color']}"` : '' + const inactiveColor = el['inactive-color'] ? `inactive-color="${el['inactive-color']}"` : '' + const activeValue = el['active-value'] !== true ? `:active-value='${JSON.stringify(el['active-value'])}'` : '' + const inactiveValue = el['inactive-value'] !== false ? `:inactive-value='${JSON.stringify(el['inactive-value'])}'` : '' + + return `<${el.tag} ${vModel} ${activeText} ${inactiveText} ${activeColor} ${inactiveColor} ${activeValue} ${inactiveValue} ${disabled}>` + }, + 'el-cascader': el => { + const { + disabled, vModel, clearable, placeholder, width + } = attrBuilder(el) + const options = el.options ? `:options="${el.vModel}Options"` : '' + const props = el.props ? `:props="${el.vModel}Props"` : '' + const showAllLevels = el['show-all-levels'] ? '' : ':show-all-levels="false"' + const filterable = el.filterable ? 'filterable' : '' + const separator = el.separator === '/' ? '' : `separator="${el.separator}"` + + return `<${el.tag} ${vModel} ${options} ${props} ${width} ${showAllLevels} ${placeholder} ${separator} ${filterable} ${clearable} ${disabled}>` + }, + 'el-slider': el => { + const { disabled, vModel } = attrBuilder(el) + const min = el.min ? `:min='${el.min}'` : '' + const max = el.max ? `:max='${el.max}'` : '' + const step = el.step ? `:step='${el.step}'` : '' + const range = el.range ? 'range' : '' + const showStops = el['show-stops'] ? `:show-stops="${el['show-stops']}"` : '' + + return `<${el.tag} ${min} ${max} ${step} ${vModel} ${range} ${showStops} ${disabled}>` + }, + 'el-time-picker': el => { + const { + disabled, vModel, clearable, placeholder, width + } = attrBuilder(el) + const startPlaceholder = el['start-placeholder'] ? `start-placeholder="${el['start-placeholder']}"` : '' + const endPlaceholder = el['end-placeholder'] ? `end-placeholder="${el['end-placeholder']}"` : '' + const rangeSeparator = el['range-separator'] ? `range-separator="${el['range-separator']}"` : '' + const isRange = el['is-range'] ? 'is-range' : '' + const format = el.format ? `format="${el.format}"` : '' + const valueFormat = el['value-format'] ? `value-format="${el['value-format']}"` : '' + const pickerOptions = el['picker-options'] ? `:picker-options='${JSON.stringify(el['picker-options'])}'` : '' + + return `<${el.tag} ${vModel} ${isRange} ${format} ${valueFormat} ${pickerOptions} ${width} ${placeholder} ${startPlaceholder} ${endPlaceholder} ${rangeSeparator} ${clearable} ${disabled}>` + }, + 'el-date-picker': el => { + const { + disabled, vModel, clearable, placeholder, width + } = attrBuilder(el) + const startPlaceholder = el['start-placeholder'] ? `start-placeholder="${el['start-placeholder']}"` : '' + const endPlaceholder = el['end-placeholder'] ? `end-placeholder="${el['end-placeholder']}"` : '' + const rangeSeparator = el['range-separator'] ? `range-separator="${el['range-separator']}"` : '' + const format = el.format ? `format="${el.format}"` : '' + const valueFormat = el['value-format'] ? `value-format="${el['value-format']}"` : '' + const type = el.type === 'date' ? '' : `type="${el.type}"` + const readonly = el.readonly ? 'readonly' : '' + + return `<${el.tag} ${type} ${vModel} ${format} ${valueFormat} ${width} ${placeholder} ${startPlaceholder} ${endPlaceholder} ${rangeSeparator} ${clearable} ${readonly} ${disabled}>` + }, + 'el-rate': el => { + const { disabled, vModel } = attrBuilder(el) + const max = el.max ? `:max='${el.max}'` : '' + const allowHalf = el['allow-half'] ? 'allow-half' : '' + const showText = el['show-text'] ? 'show-text' : '' + const showScore = el['show-score'] ? 'show-score' : '' + + return `<${el.tag} ${vModel} ${allowHalf} ${showText} ${showScore} ${disabled}>` + }, + 'el-color-picker': el => { + const { disabled, vModel } = attrBuilder(el) + const size = `size="${el.size}"` + const showAlpha = el['show-alpha'] ? 'show-alpha' : '' + const colorFormat = el['color-format'] ? `color-format="${el['color-format']}"` : '' + + return `<${el.tag} ${vModel} ${size} ${showAlpha} ${colorFormat} ${disabled}>` + }, + 'el-upload': el => { + const disabled = el.disabled ? ':disabled=\'true\'' : '' + const action = el.action ? `:action="${el.vModel}Action"` : '' + const multiple = el.multiple ? 'multiple' : '' + const listType = el['list-type'] !== 'text' ? `list-type="${el['list-type']}"` : '' + const accept = el.accept ? `accept="${el.accept}"` : '' + const name = el.name !== 'file' ? `name="${el.name}"` : '' + const autoUpload = el['auto-upload'] === false ? ':auto-upload="false"' : '' + const beforeUpload = `:before-upload="${el.vModel}BeforeUpload"` + const fileList = `:file-list="${el.vModel}fileList"` + const ref = `ref="${el.vModel}"` + let child = buildElUploadChild(el) + + if (child) child = `\n${child}\n` // 换行 + return `<${el.tag} ${ref} ${fileList} ${action} ${autoUpload} ${multiple} ${beforeUpload} ${listType} ${accept} ${name} ${disabled}>${child}` + } +} + +function attrBuilder(el) { + return { + vModel: `v-model="${confGlobal.formModel}.${el.vModel}"`, + clearable: el.clearable ? 'clearable' : '', + placeholder: el.placeholder ? `placeholder="${el.placeholder}"` : '', + width: el.style && el.style.width ? ':style="{width: \'100%\'}"' : '', + disabled: el.disabled ? ':disabled=\'true\'' : '' + } +} + +// el-buttin 子级 +function buildElButtonChild(conf) { + const children = [] + if (conf.default) { + children.push(conf.default) + } + return children.join('\n') +} + +// el-input innerHTML +function buildElInputChild(conf) { + const children = [] + if (conf.prepend) { + children.push(``) + } + if (conf.append) { + children.push(``) + } + return children.join('\n') +} + +function buildElSelectChild(conf) { + const children = [] + if (conf.options && conf.options.length) { + children.push(``) + } + return children.join('\n') +} + +function buildElRadioGroupChild(conf) { + const children = [] + if (conf.options && conf.options.length) { + const tag = conf.optionType === 'button' ? 'el-radio-button' : 'el-radio' + const border = conf.border ? 'border' : '' + children.push(`<${tag} v-for="(item, index) in ${conf.vModel}Options" :key="index" :value="item.value" :disabled="item.disabled" ${border}>{{item.label}}`) + } + return children.join('\n') +} + +function buildElCheckboxGroupChild(conf) { + const children = [] + if (conf.options && conf.options.length) { + const tag = conf.optionType === 'button' ? 'el-checkbox-button' : 'el-checkbox' + const border = conf.border ? 'border' : '' + children.push(`<${tag} v-for="(item, index) in ${conf.vModel}Options" :key="index" :label="item.value" :value="item.label" :disabled="item.disabled" ${border} />`) + } + return children.join('\n') +} + +function buildElUploadChild(conf) { + const list = [] + if (conf['list-type'] === 'picture-card') list.push('') + else list.push(`${conf.buttonText}`) + if (conf.showTip) list.push(`

只能上传不超过 ${conf.fileSize}${conf.sizeUnit} 的${conf.accept}文件

`) + return list.join('\n') +} + +export function makeUpHtml(conf, type) { + const htmlList = [] + confGlobal = conf + someSpanIsNot24 = conf.fields.some(item => item.span !== 24) + conf.fields.forEach(el => { + htmlList.push(layouts[el.layout](el)) + }) + const htmlStr = htmlList.join('\n') + + let temp = buildFormTemplate(conf, htmlStr, type) + if (type === 'dialog') { + temp = dialogWrapper(temp) + } + confGlobal = null + return temp +} diff --git a/src/utils/generator/icon.json b/src/utils/generator/icon.json new file mode 100644 index 0000000..2d9999a --- /dev/null +++ b/src/utils/generator/icon.json @@ -0,0 +1 @@ +["platform-eleme","eleme","delete-solid","delete","s-tools","setting","user-solid","user","phone","phone-outline","more","more-outline","star-on","star-off","s-goods","goods","warning","warning-outline","question","info","remove","circle-plus","success","error","zoom-in","zoom-out","remove-outline","circle-plus-outline","circle-check","circle-close","s-help","help","minus","plus","check","close","picture","picture-outline","picture-outline-round","upload","upload2","download","camera-solid","camera","video-camera-solid","video-camera","message-solid","bell","s-cooperation","s-order","s-platform","s-fold","s-unfold","s-operation","s-promotion","s-home","s-release","s-ticket","s-management","s-open","s-shop","s-marketing","s-flag","s-comment","s-finance","s-claim","s-custom","s-opportunity","s-data","s-check","s-grid","menu","share","d-caret","caret-left","caret-right","caret-bottom","caret-top","bottom-left","bottom-right","back","right","bottom","top","top-left","top-right","arrow-left","arrow-right","arrow-down","arrow-up","d-arrow-left","d-arrow-right","video-pause","video-play","refresh","refresh-right","refresh-left","finished","sort","sort-up","sort-down","rank","loading","view","c-scale-to-original","date","edit","edit-outline","folder","folder-opened","folder-add","folder-remove","folder-delete","folder-checked","tickets","document-remove","document-delete","document-copy","document-checked","document","document-add","printer","paperclip","takeaway-box","search","monitor","attract","mobile","scissors","umbrella","headset","brush","mouse","coordinate","magic-stick","reading","data-line","data-board","pie-chart","data-analysis","collection-tag","film","suitcase","suitcase-1","receiving","collection","files","notebook-1","notebook-2","toilet-paper","office-building","school","table-lamp","house","no-smoking","smoking","shopping-cart-full","shopping-cart-1","shopping-cart-2","shopping-bag-1","shopping-bag-2","sold-out","sell","present","box","bank-card","money","coin","wallet","discount","price-tag","news","guide","male","female","thumb","cpu","link","connection","open","turn-off","set-up","chat-round","chat-line-round","chat-square","chat-dot-round","chat-dot-square","chat-line-square","message","postcard","position","turn-off-microphone","microphone","close-notification","bangzhu","time","odometer","crop","aim","switch-button","full-screen","copy-document","mic","stopwatch","medal-1","medal","trophy","trophy-1","first-aid-kit","discover","place","location","location-outline","location-information","add-location","delete-location","map-location","alarm-clock","timer","watch-1","watch","lock","unlock","key","service","mobile-phone","bicycle","truck","ship","basketball","football","soccer","baseball","wind-power","light-rain","lightning","heavy-rain","sunrise","sunrise-1","sunset","sunny","cloudy","partly-cloudy","cloudy-and-sunny","moon","moon-night","dish","dish-1","food","chicken","fork-spoon","knife-fork","burger","tableware","sugar","dessert","ice-cream","hot-water","water-cup","coffee-cup","cold-drink","goblet","goblet-full","goblet-square","goblet-square-full","refrigerator","grape","watermelon","cherry","apple","pear","orange","coffee","ice-tea","ice-drink","milk-tea","potato-strips","lollipop","ice-cream-square","ice-cream-round"] \ No newline at end of file diff --git a/src/utils/generator/js.js b/src/utils/generator/js.js new file mode 100644 index 0000000..dc38bfe --- /dev/null +++ b/src/utils/generator/js.js @@ -0,0 +1,370 @@ +import { titleCase } from '@/utils/index' +import { trigger } from './config' +// 文件大小设置 +const units = { + KB: '1024', + MB: '1024 / 1024', + GB: '1024 / 1024 / 1024', +} +/** + * @name: 生成js需要的数据 + * @description: 生成js需要的数据 + * @param {*} conf + * @param {*} type 弹窗或表单 + * @return {*} + */ +export function makeUpJs(conf, type) { + conf = JSON.parse(JSON.stringify(conf)) + const dataList = [] + const ruleList = [] + const optionsList = [] + const propsList = [] + const methodList = [] + const uploadVarList = [] + + conf.fields.forEach((el) => { + buildAttributes( + el, + dataList, + ruleList, + optionsList, + methodList, + propsList, + uploadVarList + ) + }) + + const script = buildexport( + conf, + type, + dataList.join('\n'), + ruleList.join('\n'), + optionsList.join('\n'), + uploadVarList.join('\n'), + propsList.join('\n'), + methodList.join('\n') + ) + + return script +} +/** + * @name: 生成参数 + * @description: 生成参数，包括表单数据表单验证数据，多选选项数据，上传数据等 + * @return {*} + */ +function buildAttributes( + el, + dataList, + ruleList, + optionsList, + methodList, + propsList, + uploadVarList +){ + buildData(el, dataList) + buildRules(el, ruleList) + + if (el.options && el.options.length) { + buildOptions(el, optionsList) + if (el.dataType === 'dynamic') { + const model = `${el.vModel}Options` + const options = titleCase(model) + buildOptionMethod(`get${options}`, model, methodList) + } + } + + if (el.props && el.props.props) { + buildProps(el, propsList) + } + + if (el.action && el.tag === 'el-upload') { + uploadVarList.push( + ` + // 上传请求路径 + const ${el.vModel}Action = ref('${el.action}') + // 上传文件列表 + const ${el.vModel}fileList = ref([])` + ) + methodList.push(buildBeforeUpload(el)) + if (!el['auto-upload']) { + methodList.push(buildSubmitUpload(el)) + } + } + + if (el.children) { + el.children.forEach((el2) => { + buildAttributes( + el2, + dataList, + ruleList, + optionsList, + methodList, + propsList, + uploadVarList + ) + }) + } +} +/** + * @name: 生成表单数据formData + * @description: 生成表单数据formData + * @param {*} conf + * @param {*} dataList 数据列表 + * @return {*} + */ +function buildData(conf, dataList) { + if (conf.vModel === undefined) return + let defaultValue + if (typeof conf.defaultValue === 'string' && !conf.multiple) { + defaultValue = `'${conf.defaultValue}'` + } else { + defaultValue = `${JSON.stringify(conf.defaultValue)}` + } + dataList.push(`${conf.vModel}: ${defaultValue},`) +} +/** + * @name: 生成表单验证数据rule + * @description: 生成表单验证数据rule + * @param {*} conf + * @param {*} ruleList 验证数据列表 + * @return {*} + */ +function buildRules(conf, ruleList) { + if (conf.vModel === undefined) return + const rules = [] + if (trigger[conf.tag]) { + if (conf.required) { + const type = Array.isArray(conf.defaultValue) ? "type: 'array'," : '' + let message = Array.isArray(conf.defaultValue) + ? `请至少选择一个${conf.vModel}` + : conf.placeholder + if (message === undefined) message = `${conf.label}不能为空` + rules.push( + `{ required: true, ${type} message: '${message}', trigger: '${ + trigger[conf.tag] + }' }` + ) + } + if (conf.regList && Array.isArray(conf.regList)) { + conf.regList.forEach((item) => { + if (item.pattern) { + rules.push( + `{ pattern: new RegExp(${item.pattern}), message: '${ + item.message + }', trigger: '${trigger[conf.tag]}' }` + ) + } + }) + } + ruleList.push(`${conf.vModel}: [${rules.join(',')}],`) + } +} +/** + * @name: 生成选项数据 + * @description: 生成选项数据，单选多选下拉等 + * @param {*} conf + * @param {*} optionsList 选项数据列表 + * @return {*} + */ +function buildOptions(conf, optionsList) { + if (conf.vModel === undefined) return + if (conf.dataType === 'dynamic') { + conf.options = [] + } + const str = `const ${conf.vModel}Options = ref(${JSON.stringify(conf.options)})` + optionsList.push(str) +} +/** + * @name: 生成方法 + * @description: 生成方法 + * @param {*} methodName 方法名 + * @param {*} model + * @param {*} methodList 方法列表 + * @return {*} + */ +function buildOptionMethod(methodName, model, methodList) { + const str = `function ${methodName}() { + // TODO 发起请求获取数据 + ${model}.value + }` + methodList.push(str) +} +/** + * @name: 生成表单组件需要的props设置 + * @description: 生成表单组件需要的props设置，如；级联组件 + * @param {*} conf + * @param {*} propsList + * @return {*} + */ +function buildProps(conf, propsList) { + if (conf.dataType === 'dynamic') { + conf.valueKey !== 'value' && (conf.props.props.value = conf.valueKey) + conf.labelKey !== 'label' && (conf.props.props.label = conf.labelKey) + conf.childrenKey !== 'children' && + (conf.props.props.children = conf.childrenKey) + } + const str = ` + // props设置 + const ${conf.vModel}Props = ref(${JSON.stringify(conf.props.props)})` + propsList.push(str) +} +/** + * @name: 生成上传组件的相关内容 + * @description: 生成上传组件的相关内容 + * @param {*} conf + * @return {*} + */ +function buildBeforeUpload(conf) { + const unitNum = units[conf.sizeUnit] + let rightSizeCode = '' + let acceptCode = '' + const returnList = [] + if (conf.fileSize) { + rightSizeCode = `let isRightSize = file.size / ${unitNum} < ${conf.fileSize} + if(!isRightSize){ + proxy.$modal.msgError('文件大小超过 ${conf.fileSize}${conf.sizeUnit}') + }` + returnList.push('isRightSize') + } + if (conf.accept) { + acceptCode = `let isAccept = new RegExp('${conf.accept}').test(file.type) + if(!isAccept){ + proxy.$modal.msgError('应该选择${conf.accept}类型的文件') + }` + returnList.push('isAccept') + } + const str = ` + /** + * @name: 上传之前的文件判断 + * @description: 上传之前的文件判断，判断文件大小文件类型等 + * @param {*} file + * @return {*} + */ + function ${conf.vModel}BeforeUpload(file) { + ${rightSizeCode} + ${acceptCode} + return ${returnList.join('&&')} + }` + return returnList.length ? str : '' +} +/** + * @name: 生成提交表单方法 + * @description: 生成提交表单方法 + * @param {Object} conf vModel 表单ref + * @return {*} + */ +function buildSubmitUpload(conf) { + const str = `function submitUpload() { + this.$refs['${conf.vModel}'].submit() + }` + return str +} +/** + * @name: 组装js代码 + * @description: 组装js代码方法 + * @return {*} + */ +function buildexport( + conf, + type, + data, + rules, + selectOptions, + uploadVar, + props, + methods +) { + let str = ` + const { proxy } = getCurrentInstance() + const ${conf.formRef} = ref() + const data = reactive({ + ${conf.formModel}: { + ${data} + }, + ${conf.formRules}: { + ${rules} + } + }) + + const {${conf.formModel}, ${conf.formRules}} = toRefs(data) + + ${selectOptions} + + ${uploadVar} + + ${props} + + ${methods} + ` + + if(type === 'dialog') { + str += ` + // 弹窗设置 + const dialogVisible = defineModel() + // 弹窗确认回调 + const emit = defineEmits(['confirm']) + /** + * @name: 弹窗打开后执行 + * @description: 弹窗打开后执行方法 + * @return {*} + */ + function onOpen(){ + + } + /** + * @name: 弹窗关闭时执行 + * @description: 弹窗关闭方法，重置表单 + * @return {*} + */ + function onClose(){ + ${conf.formRef}.value.resetFields() + } + /** + * @name: 弹窗取消 + * @description: 弹窗取消方法 + * @return {*} + */ + function close(){ + dialogVisible.value = false + } + /** + * @name: 弹窗表单提交 + * @description: 弹窗表单提交方法 + * @return {*} + */ + function handelConfirm(){ + ${conf.formRef}.value.validate((valid) => { + if (!valid) return + // TODO 提交表单 + + close() + // 回调父级组件 + emit('confirm') + }) + } + ` + } else { + str += ` + /** + * @name: 表单提交 + * @description: 表单提交方法 + * @return {*} + */ + function submitForm() { + ${conf.formRef}.value.validate((valid) => { + if (!valid) return + // TODO 提交表单 + }) + } + /** + * @name: 表单重置 + * @description: 表单重置方法 + * @return {*} + */ + function resetForm() { + ${conf.formRef}.value.resetFields() + } + ` + } + return str +} diff --git a/src/utils/generator/render.js b/src/utils/generator/render.js new file mode 100644 index 0000000..d6d4414 --- /dev/null +++ b/src/utils/generator/render.js @@ -0,0 +1,156 @@ +import { defineComponent, h } from 'vue' +import { makeMap } from '@/utils/index' + +const isAttr = makeMap( + 'accept,accept-charset,accesskey,action,align,alt,async,autocomplete,' + + 'autofocus,autoplay,autosave,bgcolor,border,buffered,challenge,charset,' + + 'checked,cite,class,code,codebase,color,cols,colspan,content,http-equiv,' + + 'name,contenteditable,contextmenu,controls,coords,data,datetime,default,' + + 'defer,dir,dirname,disabled,download,draggable,dropzone,enctype,method,for,' + + 'form,formaction,headers,height,hidden,high,href,hreflang,http-equiv,' + + 'icon,id,ismap,itemprop,keytype,kind,label,lang,language,list,loop,low,' + + 'manifest,max,maxlength,media,method,GET,POST,min,multiple,email,file,' + + 'muted,name,novalidate,open,optimum,pattern,ping,placeholder,poster,' + + 'preload,radiogroup,readonly,rel,required,reversed,rows,rowspan,sandbox,' + + 'scope,scoped,seamless,selected,shape,size,type,text,password,sizes,span,' + + 'spellcheck,src,srcdoc,srclang,srcset,start,step,style,summary,tabindex,' + + 'target,title,type,usemap,value,width,wrap' + 'prefix-icon' +) +const isNotProps = makeMap( + 'layout,prepend,regList,tag,document,changeTag,defaultValue' +) + +function useVModel(props, emit) { + return { + modelValue: props.defaultValue, + 'onUpdate:modelValue': (val) => emit('update:modelValue', val), + } +} +const componentChild = { + 'el-button': { + default(h, conf, key) { + return conf[key] + }, + }, + 'el-select': { + options(h, conf, key) { + return conf.options.map(item => h(resolveComponent('el-option'), { + label: item.label, + value: item.value, + })) + } + }, + 'el-radio-group': { + options(h, conf, key) { + return conf.optionType === 'button' ? conf.options.map(item => h(resolveComponent('el-checkbox-button'), { + label: item.value, + }, () => item.label)) : conf.options.map(item => h(resolveComponent('el-radio'), { + label: item.value, + border: conf.border, + }, () => item.label)) + } + }, + 'el-checkbox-group': { + options(h, conf, key) { + return conf.optionType === 'button' ? conf.options.map(item => h(resolveComponent('el-checkbox-button'), { + label: item.value, + }, () => item.label)) : conf.options.map(item => h(resolveComponent('el-checkbox'), { + label: item.value, + border: conf.border, + }, () => item.label)) + } + }, + 'el-upload': { + 'list-type': (h, conf, key) => { + const option = {} + // if (conf.showTip) { + // tip = h('div', { + // class: "el-upload__tip" + // }, () => '只能上传不超过' + conf.fileSize + conf.sizeUnit + '的' + conf.accept + '文件') + // } + if (conf['list-type'] === 'picture-card') { + return h(resolveComponent('el-icon'), option, () => h(resolveComponent('Plus'))) + } else { + // option.size = "small" + option.type = "primary" + option.icon = "Upload" + return h(resolveComponent('el-button'), option, () => conf.buttonText) + } + }, + + } +} +const componentSlot = { + 'el-upload': { + 'tip': (h, conf, key) => { + if (conf.showTip) { + return () => h('div', { + class: "el-upload__tip" + }, '只能上传不超过' + conf.fileSize + conf.sizeUnit + '的' + conf.accept + '文件') + } + }, + } +} +export default defineComponent({ + + // 使用 render 函数 + render() { + const dataObject = { + attrs: {}, + props: {}, + on: {}, + style: {} + } + const confClone = JSON.parse(JSON.stringify(this.conf)) + const children = [] + const slot = {} + const childObjs = componentChild[confClone.tag] + if (childObjs) { + Object.keys(childObjs).forEach(key => { + const childFunc = childObjs[key] + if (confClone[key]) { + children.push(childFunc(h, confClone, key)) + } + }) + } + const slotObjs = componentSlot[confClone.tag] + if (slotObjs) { + Object.keys(slotObjs).forEach(key => { + const childFunc = slotObjs[key] + if (confClone[key]) { + slot[key] = childFunc(h, confClone, key) + } + }) + } + Object.keys(confClone).forEach(key => { + const val = confClone[key] + if (dataObject[key]) { + dataObject[key] = val + } else if (isAttr(key)) { + dataObject.attrs[key] = val + } else if (!isNotProps(key)) { + dataObject.props[key] = val + } + }) + if(children.length > 0){ + slot.default = () => children + } + + return h(resolveComponent(this.conf.tag), + { + modelValue: this.$attrs.modelValue, + ...dataObject.props, + ...dataObject.attrs, + style: { + ...dataObject.style + }, + } + , slot ?? null) + }, + props: { + conf: { + type: Object, + required: true, + }, + } +}) \ No newline at end of file diff --git a/src/utils/index.js b/src/utils/index.js new file mode 100644 index 0000000..9329fe2 --- /dev/null +++ b/src/utils/index.js @@ -0,0 +1,390 @@ +import { parseTime } from './ruoyi' + +/** + * 表格时间格式化 + */ +export function formatDate(cellValue) { + if (cellValue == null || cellValue == "") return "" + var date = new Date(cellValue) + var year = date.getFullYear() + var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1 + var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() + var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() + var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() + var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds() + return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds +} + +/** + * @param {number} time + * @param {string} option + * @returns {string} + */ +export function formatTime(time, option) { + if (('' + time).length === 10) { + time = parseInt(time) * 1000 + } else { + time = +time + } + const d = new Date(time) + const now = Date.now() + + const diff = (now - d) / 1000 + + if (diff < 30) { + return '刚刚' + } else if (diff < 3600) { + // less 1 hour + return Math.ceil(diff / 60) + '分钟前' + } else if (diff < 3600 * 24) { + return Math.ceil(diff / 3600) + '小时前' + } else if (diff < 3600 * 24 * 2) { + return '1天前' + } + if (option) { + return parseTime(time, option) + } else { + return ( + d.getMonth() + + 1 + + '月' + + d.getDate() + + '日' + + d.getHours() + + '时' + + d.getMinutes() + + '分' + ) + } +} + +/** + * @param {string} url + * @returns {Object} + */ +export function getQueryObject(url) { + url = url == null ? window.location.href : url + const search = url.substring(url.lastIndexOf('?') + 1) + const obj = {} + const reg = /([^?&=]+)=([^?&=]*)/g + search.replace(reg, (rs, $1, $2) => { + const name = decodeURIComponent($1) + let val = decodeURIComponent($2) + val = String(val) + obj[name] = val + return rs + }) + return obj +} + +/** + * @param {string} input value + * @returns {number} output value + */ +export function byteLength(str) { + // returns the byte length of an utf8 string + let s = str.length + for (var i = str.length - 1; i >= 0; i--) { + const code = str.charCodeAt(i) + if (code > 0x7f && code <= 0x7ff) s++ + else if (code > 0x7ff && code <= 0xffff) s += 2 + if (code >= 0xDC00 && code <= 0xDFFF) i-- + } + return s +} + +/** + * @param {Array} actual + * @returns {Array} + */ +export function cleanArray(actual) { + const newArray = [] + for (let i = 0; i < actual.length; i++) { + if (actual[i]) { + newArray.push(actual[i]) + } + } + return newArray +} + +/** + * @param {Object} json + * @returns {Array} + */ +export function param(json) { + if (!json) return '' + return cleanArray( + Object.keys(json).map(key => { + if (json[key] === undefined) return '' + return encodeURIComponent(key) + '=' + encodeURIComponent(json[key]) + }) + ).join('&') +} + +/** + * @param {string} url + * @returns {Object} + */ +export function param2Obj(url) { + const search = decodeURIComponent(url.split('?')[1]).replace(/\+/g, ' ') + if (!search) { + return {} + } + const obj = {} + const searchArr = search.split('&') + searchArr.forEach(v => { + const index = v.indexOf('=') + if (index !== -1) { + const name = v.substring(0, index) + const val = v.substring(index + 1, v.length) + obj[name] = val + } + }) + return obj +} + +/** + * @param {string} val + * @returns {string} + */ +export function html2Text(val) { + const div = document.createElement('div') + div.innerHTML = val + return div.textContent || div.innerText +} + +/** + * Merges two objects, giving the last one precedence + * @param {Object} target + * @param {(Object|Array)} source + * @returns {Object} + */ +export function objectMerge(target, source) { + if (typeof target !== 'object') { + target = {} + } + if (Array.isArray(source)) { + return source.slice() + } + Object.keys(source).forEach(property => { + const sourceProperty = source[property] + if (typeof sourceProperty === 'object') { + target[property] = objectMerge(target[property], sourceProperty) + } else { + target[property] = sourceProperty + } + }) + return target +} + +/** + * @param {HTMLElement} element + * @param {string} className + */ +export function toggleClass(element, className) { + if (!element || !className) { + return + } + let classString = element.className + const nameIndex = classString.indexOf(className) + if (nameIndex === -1) { + classString += '' + className + } else { + classString = + classString.substr(0, nameIndex) + + classString.substr(nameIndex + className.length) + } + element.className = classString +} + +/** + * @param {string} type + * @returns {Date} + */ +export function getTime(type) { + if (type === 'start') { + return new Date().getTime() - 3600 * 1000 * 24 * 90 + } else { + return new Date(new Date().toDateString()) + } +} + +/** + * @param {Function} func + * @param {number} wait + * @param {boolean} immediate + * @return {*} + */ +export function debounce(func, wait, immediate) { + let timeout, args, context, timestamp, result + + const later = function() { + // 据上一次触发时间间隔 + const last = +new Date() - timestamp + + // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait + if (last < wait && last > 0) { + timeout = setTimeout(later, wait - last) + } else { + timeout = null + // 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用 + if (!immediate) { + result = func.apply(context, args) + if (!timeout) context = args = null + } + } + } + + return function(...args) { + context = this + timestamp = +new Date() + const callNow = immediate && !timeout + // 如果延时不存在，重新设定延时 + if (!timeout) timeout = setTimeout(later, wait) + if (callNow) { + result = func.apply(context, args) + context = args = null + } + + return result + } +} + +/** + * This is just a simple version of deep copy + * Has a lot of edge cases bug + * If you want to use a perfect deep copy, use lodash's _.cloneDeep + * @param {Object} source + * @returns {Object} + */ +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 +} + +/** + * @param {Array} arr + * @returns {Array} + */ +export function uniqueArr(arr) { + return Array.from(new Set(arr)) +} + +/** + * @returns {string} + */ +export function createUniqueString() { + const timestamp = +new Date() + '' + const randomNum = parseInt((1 + Math.random()) * 65536) + '' + return (+(randomNum + timestamp)).toString(32) +} + +/** + * Check if an element has a class + * @param {HTMLElement} elm + * @param {string} cls + * @returns {boolean} + */ +export function hasClass(ele, cls) { + return !!ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)')) +} + +/** + * Add class to element + * @param {HTMLElement} elm + * @param {string} cls + */ +export function addClass(ele, cls) { + if (!hasClass(ele, cls)) ele.className += ' ' + cls +} + +/** + * Remove class from element + * @param {HTMLElement} elm + * @param {string} cls + */ +export function removeClass(ele, cls) { + if (hasClass(ele, cls)) { + const reg = new RegExp('(\\s|^)' + cls + '(\\s|$)') + ele.className = ele.className.replace(reg, ' ') + } +} + +export function makeMap(str, expectsLowerCase) { + const map = Object.create(null) + const list = str.split(',') + for (let i = 0; i < list.length; i++) { + map[list[i]] = true + } + return expectsLowerCase + ? val => map[val.toLowerCase()] + : val => map[val] +} + +export const exportDefault = 'export default ' + +export const beautifierConf = { + html: { + indent_size: '2', + indent_char: ' ', + max_preserve_newlines: '-1', + preserve_newlines: false, + keep_array_indentation: false, + break_chained_methods: false, + indent_scripts: 'separate', + brace_style: 'end-expand', + space_before_conditional: true, + unescape_strings: false, + jslint_happy: false, + end_with_newline: true, + wrap_line_length: '110', + indent_inner_html: true, + comma_first: false, + e4x: true, + indent_empty_lines: true + }, + js: { + indent_size: '2', + indent_char: ' ', + max_preserve_newlines: '-1', + preserve_newlines: false, + keep_array_indentation: false, + break_chained_methods: false, + indent_scripts: 'normal', + brace_style: 'end-expand', + space_before_conditional: true, + unescape_strings: false, + jslint_happy: true, + end_with_newline: true, + wrap_line_length: '110', + indent_inner_html: true, + comma_first: false, + e4x: true, + indent_empty_lines: true + } +} + +// 首字母大小 +export function titleCase(str) { + return str.replace(/( |^)[a-z]/g, L => L.toUpperCase()) +} + +// 下划转驼峰 +export function camelCase(str) { + return str.replace(/_[a-z]/g, str1 => str1.substr(-1).toUpperCase()) +} + +export function isNumberStr(str) { + return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str) +} + diff --git a/src/utils/jsencrypt.js b/src/utils/jsencrypt.js new file mode 100644 index 0000000..78d9523 --- /dev/null +++ b/src/utils/jsencrypt.js @@ -0,0 +1,30 @@ +import JSEncrypt from 'jsencrypt/bin/jsencrypt.min' + +// 密钥对生成 http://web.chacuo.net/netrsakeypair + +const publicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBAKoR8mX0rGKLqzcWmOzbfj64K8ZIgOdH\n' + + 'nzkXSOVOZbFu/TJhZ7rFAN+eaGkl3C4buccQd/EjEsj9ir7ijT7h96MCAwEAAQ==' + +const privateKey = 'MIIBVAIBADANBgkqhkiG9w0BAQEFAASCAT4wggE6AgEAAkEAqhHyZfSsYourNxaY\n' + + '7Nt+PrgrxkiA50efORdI5U5lsW79MmFnusUA355oaSXcLhu5xxB38SMSyP2KvuKN\n' + + 'PuH3owIDAQABAkAfoiLyL+Z4lf4Myxk6xUDgLaWGximj20CUf+5BKKnlrK+Ed8gA\n' + + 'kM0HqoTt2UZwA5E2MzS4EI2gjfQhz5X28uqxAiEA3wNFxfrCZlSZHb0gn2zDpWow\n' + + 'cSxQAgiCstxGUoOqlW8CIQDDOerGKH5OmCJ4Z21v+F25WaHYPxCFMvwxpcw99Ecv\n' + + 'DQIgIdhDTIqD2jfYjPTY8Jj3EDGPbH2HHuffvflECt3Ek60CIQCFRlCkHpi7hthh\n' + + 'YhovyloRYsM+IS9h/0BzlEAuO0ktMQIgSPT3aFAgJYwKpqRYKlLDVcflZFCKY7u3\n' + + 'UP8iWi1Qw0Y=' + +// 加密 +export function encrypt(txt) { + const encryptor = new JSEncrypt() + encryptor.setPublicKey(publicKey) // 设置公钥 + return encryptor.encrypt(txt) // 对数据进行加密 +} + +// 解密 +export function decrypt(txt) { + const encryptor = new JSEncrypt() + encryptor.setPrivateKey(privateKey) // 设置私钥 + return encryptor.decrypt(txt) // 对数据进行解密 +} + diff --git a/src/utils/mapDiagnostics.js b/src/utils/mapDiagnostics.js new file mode 100644 index 0000000..d2c2913 --- /dev/null +++ b/src/utils/mapDiagnostics.js @@ -0,0 +1,102 @@ +// 百度地图瓦片加载诊断工具 + +/** + * 检查百度地图API是否正确加载 + */ +export const checkBMapAPI = () => { + const checks = { + bMapLoaded: typeof window.BMap !== 'undefined', + bMapVersion: window.BMap ? window.BMap.version : null, + apiScript: !!document.querySelector('script[src*="api.map.baidu.com"]'), + mapTypes: window.BMAP_NORMAL_MAP ? true : false + } + + console.log('百度地图API检查结果:', checks) + return checks +} + +/** + * 诊断地图瓦片加载问题 + */ +export const diagnoseMapTiles = (map) => { + if (!map) { + console.warn('地图实例不存在') + return + } + + const diagnostics = { + center: map.getCenter(), + zoom: map.getZoom(), + bounds: map.getBounds(), + mapType: map.getMapType(), + size: map.getSize(), + viewport: map.getViewport() + } + + console.log('地图瓦片诊断信息:', diagnostics) + + // 检查瓦片加载状态 + const tileLayer = map.getTileLayer() + if (tileLayer) { + console.log('瓦片图层信息:', tileLayer) + } + + return diagnostics +} + +/** + * 强制重新加载地图瓦片 + */ +export const forceReloadTiles = (map) => { + if (!map) return + + console.log('强制重新加载地图瓦片') + + // 方法1：临时改变地图类型 + const currentType = map.getMapType() + map.setMapType(window.BMAP_SATELLITE_MAP) + setTimeout(() => { + map.setMapType(currentType) + }, 100) +} + +/** + * 监控地图瓦片加载性能 + */ +export const monitorTileLoading = (map) => { + if (!map) return + + let tileLoadStart = Date.now() + + map.addEventListener('tilesloaded', () => { + const loadTime = Date.now() - tileLoadStart + console.log(`地图瓦片加载完成，耗时: ${loadTime}ms`) + }) + + map.addEventListener('dragstart', () => { + tileLoadStart = Date.now() + console.log('开始拖动，准备加载新瓦片') + }) + + map.addEventListener('zoomstart', () => { + tileLoadStart = Date.now() + console.log('开始缩放，准备加载新瓦片') + }) +} + +/** + * 检查网络连接状态 + */ +export const checkNetworkStatus = () => { + const status = { + online: navigator.onLine, + connection: navigator.connection ? { + effectiveType: navigator.connection.effectiveType, + downlink: navigator.connection.downlink, + rtt: navigator.connection.rtt + } : null + } + + console.log('网络状态:', status) + return status +} diff --git a/src/utils/permission.js b/src/utils/permission.js new file mode 100644 index 0000000..d354852 --- /dev/null +++ b/src/utils/permission.js @@ -0,0 +1,51 @@ +import useUserStore from '@/store/modules/user' + +/** + * 字符权限校验 + * @param {Array} value 校验值 + * @returns {Boolean} + */ +export function checkPermi(value) { + if (value && value instanceof Array && value.length > 0) { + const permissions = useUserStore().permissions + const permissionDatas = value + const all_permission = "*:*:*" + + const hasPermission = permissions.some(permission => { + return all_permission === permission || permissionDatas.includes(permission) + }) + + if (!hasPermission) { + return false + } + return true + } else { + console.error(`need roles! Like checkPermi="['system:user:add','system:user:edit']"`) + return false + } +} + +/** + * 角色权限校验 + * @param {Array} value 校验值 + * @returns {Boolean} + */ +export function checkRole(value) { + if (value && value instanceof Array && value.length > 0) { + const roles = useUserStore().roles + const permissionRoles = value + const super_admin = "admin" + + const hasRole = roles.some(role => { + return super_admin === role || permissionRoles.includes(role) + }) + + if (!hasRole) { + return false + } + return true + } else { + console.error(`need roles! Like checkRole="['admin','editor']"`) + return false + } +} \ No newline at end of file diff --git a/src/utils/request.js b/src/utils/request.js new file mode 100644 index 0000000..e2e7e49 --- /dev/null +++ b/src/utils/request.js @@ -0,0 +1,152 @@ +import axios from 'axios' +import { ElNotification , ElMessageBox, ElMessage, ElLoading } from 'element-plus' +import { getToken } from '@/utils/auth' +import errorCode from '@/utils/errorCode' +import { tansParams, blobValidate } from '@/utils/ruoyi' +import cache from '@/plugins/cache' +import { saveAs } from 'file-saver' +import useUserStore from '@/store/modules/user' + +let downloadLoadingInstance +// 是否显示重新登录 +export let isRelogin = { show: false } + +axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8' +// 创建axios实例 +const service = axios.create({ + // axios中请求配置有baseURL选项，表示请求URL公共部分 + baseURL: import.meta.env.VITE_APP_BASE_API, + // 超时 + timeout: 10000 +}) + +// request拦截器 +service.interceptors.request.use(config => { + // 是否需要设置 token + const isToken = (config.headers || {}).isToken === false + // 是否需要防止数据重复提交 + const isRepeatSubmit = (config.headers || {}).repeatSubmit === false + if (getToken() && !isToken) { + config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改 + } + // get请求映射params参数 + if (config.method === 'get' && config.params) { + let url = config.url + '?' + tansParams(config.params) + url = url.slice(0, -1) + config.params = {} + config.url = url + } + if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) { + const requestObj = { + url: config.url, + data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data, + time: new Date().getTime() + } + const requestSize = Object.keys(JSON.stringify(requestObj)).length // 请求数据大小 + const limitSize = 5 * 1024 * 1024 // 限制存放数据5M + if (requestSize >= limitSize) { + console.warn(`[${config.url}]: ` + '请求数据大小超出允许的5M限制，无法进行防重复提交验证。') + return config + } + const sessionObj = cache.session.getJSON('sessionObj') + if (sessionObj === undefined || sessionObj === null || sessionObj === '') { + cache.session.setJSON('sessionObj', requestObj) + } else { + const s_url = sessionObj.url // 请求地址 + const s_data = sessionObj.data // 请求数据 + const s_time = sessionObj.time // 请求时间 + const interval = 1000 // 间隔时间(ms)，小于此时间视为重复提交 + if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) { + const message = '数据正在处理，请勿重复提交' + console.warn(`[${s_url}]: ` + message) + return Promise.reject(new Error(message)) + } else { + cache.session.setJSON('sessionObj', requestObj) + } + } + } + return config +}, error => { + console.log(error) + Promise.reject(error) +}) + +// 响应拦截器 +service.interceptors.response.use(res => { + // 未设置状态码则默认成功状态 + const code = res.data.code || 200 + // 获取错误信息 + const msg = errorCode[code] || res.data.msg || errorCode['default'] + // 二进制数据则直接返回 + if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') { + return res.data + } + if (code === 401) { + if (!isRelogin.show) { + isRelogin.show = true + ElMessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => { + isRelogin.show = false + useUserStore().logOut().then(() => { + location.href = '/index' + }) + }).catch(() => { + isRelogin.show = false + }) + } + return Promise.reject('无效的会话，或者会话已过期，请重新登录。') + } else if (code === 500) { + ElMessage({ message: msg, type: 'error' }) + return Promise.reject(new Error(msg)) + } else if (code === 601) { + ElMessage({ message: msg, type: 'warning' }) + return Promise.reject(new Error(msg)) + } else if (code !== 200) { + ElNotification.error({ title: msg }) + return Promise.reject('error') + } else { + return Promise.resolve(res.data) + } + }, + error => { + console.log('err' + error) + let { message } = error + if (message == "Network Error") { + message = "后端接口连接异常" + } else if (message.includes("timeout")) { + message = "系统接口请求超时" + } else if (message.includes("Request failed with status code")) { + message = "系统接口" + message.substr(message.length - 3) + "异常" + } + ElMessage({ message: message, type: 'error', duration: 5 * 1000 }) + return Promise.reject(error) + } +) + +// 通用下载方法 +export function download(url, params, filename, config) { + downloadLoadingInstance = ElLoading.service({ text: "正在下载数据，请稍候", background: "rgba(0, 0, 0, 0.7)", }) + return service.post(url, params, { + transformRequest: [(params) => { return tansParams(params) }], + headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, + responseType: 'blob', + ...config + }).then(async (data) => { + const isBlob = blobValidate(data) + if (isBlob) { + const blob = new Blob([data]) + saveAs(blob, filename) + } else { + const resText = await data.text() + const rspObj = JSON.parse(resText) + const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default'] + ElMessage.error(errMsg) + } + downloadLoadingInstance.close() + }).catch((r) => { + console.error(r) + ElMessage.error('下载文件出现错误，请联系管理员！') + downloadLoadingInstance.close() + }) +} + +export default service diff --git a/src/utils/ruoyi.js b/src/utils/ruoyi.js new file mode 100644 index 0000000..3de2d98 --- /dev/null +++ b/src/utils/ruoyi.js @@ -0,0 +1,228 @@ +/** + * 通用js方法封装处理 + * Copyright (c) 2019 ruoyi + */ + +// 日期格式化 +export function parseTime(time, pattern) { + if (arguments.length === 0 || !time) { + return null + } + const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}' + let date + if (typeof time === 'object') { + date = time + } else { + if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) { + time = parseInt(time) + } else if (typeof time === 'string') { + time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '') + } + if ((typeof time === 'number') && (time.toString().length === 10)) { + time = time * 1000 + } + date = new Date(time) + } + const formatObj = { + y: date.getFullYear(), + m: date.getMonth() + 1, + d: date.getDate(), + h: date.getHours(), + i: date.getMinutes(), + s: date.getSeconds(), + a: date.getDay() + } + const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => { + let value = formatObj[key] + // Note: getDay() returns 0 on Sunday + if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] } + if (result.length > 0 && value < 10) { + value = '0' + value + } + return value || 0 + }) + return time_str +} + +// 表单重置 +export function resetForm(refName) { + if (this.$refs[refName]) { + this.$refs[refName].resetFields() + } +} + +// 添加日期范围 +export function addDateRange(params, dateRange, propName) { + let search = params + search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {} + dateRange = Array.isArray(dateRange) ? dateRange : [] + if (typeof (propName) === 'undefined') { + search.params['beginTime'] = dateRange[0] + search.params['endTime'] = dateRange[1] + } else { + search.params['begin' + propName] = dateRange[0] + search.params['end' + propName] = dateRange[1] + } + return search +} + +// 回显数据字典 +export function selectDictLabel(datas, value) { + if (value === undefined) { + return "" + } + var actions = [] + Object.keys(datas).some((key) => { + if (datas[key].value == ('' + value)) { + actions.push(datas[key].label) + return true + } + }) + if (actions.length === 0) { + actions.push(value) + } + return actions.join('') +} + +// 回显数据字典（字符串、数组） +export function selectDictLabels(datas, value, separator) { + if (value === undefined || value.length ===0) { + return "" + } + if (Array.isArray(value)) { + value = value.join(",") + } + var actions = [] + var currentSeparator = undefined === separator ? "," : separator + var temp = value.split(currentSeparator) + Object.keys(value.split(currentSeparator)).some((val) => { + var match = false + Object.keys(datas).some((key) => { + if (datas[key].value == ('' + temp[val])) { + actions.push(datas[key].label + currentSeparator) + match = true + } + }) + if (!match) { + actions.push(temp[val] + currentSeparator) + } + }) + return actions.join('').substring(0, actions.join('').length - 1) +} + +// 字符串格式化(%s ) +export function sprintf(str) { + var args = arguments, flag = true, i = 1 + str = str.replace(/%s/g, function () { + var arg = args[i++] + if (typeof arg === 'undefined') { + flag = false + return '' + } + return arg + }) + return flag ? str : '' +} + +// 转换字符串，undefined,null等转化为"" +export function parseStrEmpty(str) { + if (!str || str == "undefined" || str == "null") { + return "" + } + return str +} + +// 数据合并 +export function mergeRecursive(source, target) { + for (var p in target) { + try { + if (target[p].constructor == Object) { + source[p] = mergeRecursive(source[p], target[p]) + } else { + source[p] = target[p] + } + } catch (e) { + source[p] = target[p] + } + } + return source +} + +/** + * 构造树型结构数据 + * @param {*} data 数据源 + * @param {*} id id字段默认 'id' + * @param {*} parentId 父节点字段默认 'parentId' + * @param {*} children 孩子节点字段默认 'children' + */ +export function handleTree(data, id, parentId, children) { + let config = { + id: id || 'id', + parentId: parentId || 'parentId', + childrenList: children || 'children' + } + + var childrenListMap = {} + var tree = [] + for (let d of data) { + let id = d[config.id] + childrenListMap[id] = d + if (!d[config.childrenList]) { + d[config.childrenList] = [] + } + } + + for (let d of data) { + let parentId = d[config.parentId] + let parentObj = childrenListMap[parentId] + if (!parentObj) { + tree.push(d) + } else { + parentObj[config.childrenList].push(d) + } + } + return tree +} + +/** +* 参数处理 +* @param {*} params 参数 +*/ +export function tansParams(params) { + let result = '' + for (const propName of Object.keys(params)) { + const value = params[propName] + var part = encodeURIComponent(propName) + "=" + if (value !== null && value !== "" && typeof (value) !== "undefined") { + if (typeof value === 'object') { + for (const key of Object.keys(value)) { + if (value[key] !== null && value[key] !== "" && typeof (value[key]) !== 'undefined') { + let params = propName + '[' + key + ']' + var subPart = encodeURIComponent(params) + "=" + result += subPart + encodeURIComponent(value[key]) + "&" + } + } + } else { + result += part + encodeURIComponent(value) + "&" + } + } + } + return result +} + +// 返回项目路径 +export function getNormalPath(p) { + if (p.length === 0 || !p || p == 'undefined') { + return p + } + let res = p.replace('//', '/') + if (res[res.length - 1] === '/') { + return res.slice(0, res.length - 1) + } + return res +} + +// 验证是否为blob格式 +export function blobValidate(data) { + return data.type !== 'application/json' +} diff --git a/src/utils/scroll-to.js b/src/utils/scroll-to.js new file mode 100644 index 0000000..c5d8e04 --- /dev/null +++ b/src/utils/scroll-to.js @@ -0,0 +1,58 @@ +Math.easeInOutQuad = function(t, b, c, d) { + t /= d / 2 + if (t < 1) { + return c / 2 * t * t + b + } + t-- + return -c / 2 * (t * (t - 2) - 1) + b +} + +// requestAnimationFrame for Smart Animating http://goo.gl/sx5sts +var requestAnimFrame = (function() { + return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) { window.setTimeout(callback, 1000 / 60) } +})() + +/** + * Because it's so fucking difficult to detect the scrolling element, just move them all + * @param {number} amount + */ +function move(amount) { + document.documentElement.scrollTop = amount + document.body.parentNode.scrollTop = amount + document.body.scrollTop = amount +} + +function position() { + return document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop +} + +/** + * @param {number} to + * @param {number} duration + * @param {Function} callback + */ +export function scrollTo(to, duration, callback) { + const start = position() + const change = to - start + const increment = 20 + let currentTime = 0 + duration = (typeof (duration) === 'undefined') ? 500 : duration + var animateScroll = function() { + // increment the time + currentTime += increment + // find the value with the quadratic in-out easing function + var val = Math.easeInOutQuad(currentTime, start, change, duration) + // move the document.body + move(val) + // do the animation unless its over + if (currentTime < duration) { + requestAnimFrame(animateScroll) + } else { + if (callback && typeof (callback) === 'function') { + // the animation is done so lets callback + callback() + } + } + } + animateScroll() +} diff --git a/src/utils/store/index.js b/src/utils/store/index.js new file mode 100644 index 0000000..332b916 --- /dev/null +++ b/src/utils/store/index.js @@ -0,0 +1,15 @@ +import Vue from 'vue' +import Vuex from 'vuex' + +Vue.use(Vuex) + +export default new Vuex.Store({ + state: { + }, + mutations: { + }, + actions: { + }, + modules: { + } +}) diff --git a/src/utils/theme.js b/src/utils/theme.js new file mode 100644 index 0000000..f4badc6 --- /dev/null +++ b/src/utils/theme.js @@ -0,0 +1,49 @@ +// 处理主题样式 +export function handleThemeStyle(theme) { + document.documentElement.style.setProperty('--el-color-primary', theme) + for (let i = 1; i <= 9; i++) { + document.documentElement.style.setProperty(`--el-color-primary-light-${i}`, `${getLightColor(theme, i / 10)}`) + } + for (let i = 1; i <= 9; i++) { + document.documentElement.style.setProperty(`--el-color-primary-dark-${i}`, `${getDarkColor(theme, i / 10)}`) + } +} + +// hex颜色转rgb颜色 +export function hexToRgb(str) { + str = str.replace('#', '') + let hexs = str.match(/../g) + for (let i = 0; i < 3; i++) { + hexs[i] = parseInt(hexs[i], 16) + } + return hexs +} + +// rgb颜色转Hex颜色 +export function rgbToHex(r, g, b) { + let hexs = [r.toString(16), g.toString(16), b.toString(16)] + for (let i = 0; i < 3; i++) { + if (hexs[i].length == 1) { + hexs[i] = `0${hexs[i]}` + } + } + return `#${hexs.join('')}` +} + +// 变浅颜色值 +export function getLightColor(color, level) { + let rgb = hexToRgb(color) + for (let i = 0; i < 3; i++) { + rgb[i] = Math.floor((255 - rgb[i]) * level + rgb[i]) + } + return rgbToHex(rgb[0], rgb[1], rgb[2]) +} + +// 变深颜色值 +export function getDarkColor(color, level) { + let rgb = hexToRgb(color) + for (let i = 0; i < 3; i++) { + rgb[i] = Math.floor(rgb[i] * (1 - level)) + } + return rgbToHex(rgb[0], rgb[1], rgb[2]) +} diff --git a/src/utils/validate.js b/src/utils/validate.js new file mode 100644 index 0000000..6a4c0c5 --- /dev/null +++ b/src/utils/validate.js @@ -0,0 +1,114 @@ +/** + * 路径匹配器 + * @param {string} pattern + * @param {string} path + * @returns {Boolean} + */ +export function isPathMatch(pattern, path) { + const regexPattern = pattern.replace(/\//g, '\\/').replace(/\*\*/g, '.*').replace(/\*/g, '[^\\/]*') + const regex = new RegExp(`^${regexPattern}$`) + return regex.test(path) +} + +/** + * 判断value字符串是否为空 + * @param {string} value + * @returns {Boolean} + */ +export function isEmpty(value) { + if (value == null || value == "" || value == undefined || value == "undefined") { + return true + } + return false +} + +/** + * 判断url是否是http或https + * @param {string} url + * @returns {Boolean} + */ +export function isHttp(url) { + return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1 +} + +/** + * 判断path是否为外链 + * @param {string} path + * @returns {Boolean} + */ +export function isExternal(path) { + return /^(https?:|mailto:|tel:)/.test(path) +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validUsername(str) { + const valid_map = ['admin', 'editor'] + return valid_map.indexOf(str.trim()) >= 0 +} + +/** + * @param {string} url + * @returns {Boolean} + */ +export function validURL(url) { + const reg = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/ + return reg.test(url) +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validLowerCase(str) { + const reg = /^[a-z]+$/ + return reg.test(str) +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validUpperCase(str) { + const reg = /^[A-Z]+$/ + return reg.test(str) +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validAlphabets(str) { + const reg = /^[A-Za-z]+$/ + return reg.test(str) +} + +/** + * @param {string} email + * @returns {Boolean} + */ +export function validEmail(email) { + const reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/ + return reg.test(email) +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function isString(str) { + return typeof str === 'string' || str instanceof String +} + +/** + * @param {Array} arg + * @returns {Boolean} + */ +export function isArray(arg) { + if (typeof Array.isArray === 'undefined') { + return Object.prototype.toString.call(arg) === '[object Array]' + } + return Array.isArray(arg) +} diff --git a/src/views/dashboard/components/BodyPartChart.vue b/src/views/dashboard/components/BodyPartChart.vue new file mode 100644 index 0000000..2e421e1 --- /dev/null +++ b/src/views/dashboard/components/BodyPartChart.vue @@ -0,0 +1,174 @@ + + + + + diff --git a/src/views/dashboard/components/DeviceMap.vue b/src/views/dashboard/components/DeviceMap.vue new file mode 100644 index 0000000..eabe6b4 --- /dev/null +++ b/src/views/dashboard/components/DeviceMap.vue @@ -0,0 +1,821 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/components/HeadTypeChart.vue b/src/views/dashboard/components/HeadTypeChart.vue new file mode 100644 index 0000000..e569b17 --- /dev/null +++ b/src/views/dashboard/components/HeadTypeChart.vue @@ -0,0 +1,155 @@ + + + + + diff --git a/src/views/dashboard/components/MassageDurationChart.vue b/src/views/dashboard/components/MassageDurationChart.vue new file mode 100644 index 0000000..215a11e --- /dev/null +++ b/src/views/dashboard/components/MassageDurationChart.vue @@ -0,0 +1,181 @@ + + + + + diff --git a/src/views/dashboard/components/MiddleChart.vue b/src/views/dashboard/components/MiddleChart.vue new file mode 100644 index 0000000..8b9f749 --- /dev/null +++ b/src/views/dashboard/components/MiddleChart.vue @@ -0,0 +1,321 @@ + + + + + diff --git a/src/views/dashboard/components/RankList.vue b/src/views/dashboard/components/RankList.vue new file mode 100644 index 0000000..a8d31fe --- /dev/null +++ b/src/views/dashboard/components/RankList.vue @@ -0,0 +1,245 @@ + + + diff --git a/src/views/dashboard/components/TopPanel.vue b/src/views/dashboard/components/TopPanel.vue new file mode 100644 index 0000000..473c0c0 --- /dev/null +++ b/src/views/dashboard/components/TopPanel.vue @@ -0,0 +1,496 @@ + + + + + \ No newline at end of file diff --git a/src/views/dashboard/constants.js b/src/views/dashboard/constants.js new file mode 100644 index 0000000..5e99d4d --- /dev/null +++ b/src/views/dashboard/constants.js @@ -0,0 +1,987 @@ +// 数据概览 +// 老人数量 +export const OLDMAN_NUM_A = { + total: '643', + data: [ + { value: 21, name: '外出中' }, + { value: 622, name: '在院中' } + ] +} +export const OLDMAN_NUM_B = { + total: '655', + data: [ + { value: 11, name: '外出中' }, + { value: 644, name: '在院中' } + ] +} +export const OLDMAN_NUM_C = { + total: '649', + data: [ + { value: 17, name: '外出中' }, + { value: 632, name: '在院中' } + ] +} +// 床位数量 +export const BED_NUM_A = { + total: '812', + data: [ + { value: 169, name: '空闲中' }, + { value: 643, name: '入住中' } + ] +} +export const BED_NUM_B = { + total: '812', + data: [ + { value: 157, name: '空闲中' }, + { value: 655, name: '入住中' } + ] +} +export const BED_NUM_C = { + total: '812', + data: [ + { value: 163, name: '空闲中' }, + { value: 649, name: '入住中' } + ] +} +// 服务单数量（笔） +export const SERVE_NUM_A = { + total: 100.05, + data: [ + { value: 6.17, name: '护理计划外' }, + { value: 93.88, name: '护理计划内' } + ] +} +export const SERVE_NUM_B = { + total: 100.35, + data: [ + { value: 6.17, name: '护理计划外' }, + { value: 94.18, name: '护理计划内' } + ] +} +export const SERVE_NUM_C = { + total: 100.66, + data: [ + { value: 6.18, name: '护理计划外' }, + { value: 94.48, name: '护理计划内' } + ] +} +// 员工数量（人） +export const STAFF_NUM_A = { + total: 202, + data: [ + { value: 18, name: '管理层' }, + { value: 184, name: '普通员工' } + ] +} +export const STAFF_NUM_B = { + total: 204, + data: [ + { value: 18, name: '管理层' }, + { value: 186, name: '普通员工' } + ] +} +export const STAFF_NUM_C = { + total: 204, + data: [ + { value: 18, name: '管理层' }, + { value: 186, name: '普通员工' } + ] +} +// 收入金额（元） +export const MONEY_NUM_A = { + total: 401.23, + data: [ + { value: 92.59, name: '服务费用' }, + { value: 308.64, name: '月度费用' } + ] +} +export const MONEY_NUM_B = { + total: 410.81, + data: [ + { value: 92.85, name: '服务费用' }, + { value: 317.96, name: '月度费用' } + ] +} +export const MONEY_NUM_C = { + total: 411.92, + data: [ + { value: 93.1, name: '服务费用' }, + { value: 318.82, name: '月度费用' } + ] +} +// 今日数据 +export const TODAY_TIME = [ + '0:00', + '1:00', + '2:00', + '3:00', + '4:00', + '5:00', + '6:00', + '7:00', + '8:00', + '9:00', + '10:00', + '11:00', + '12:00', + '13:00', + '14:00', + '15:00', + '16:00', + '17:00', + '18:00', + '19:00', + '20:00', + '21:00', + '22:00', + '23:00' +] +// 收益情况 +export const TODAY_NUM_A = { + incomeData: [ + 0.0, 0.0, 0.0, 0.0, 0.0, 629.22, 450, 480.45, 2032.22, 5900.12, 4569, 3476, + 1020.22, 2409.39, 3647.13, 3838.2, 2232.29, 1753.45, 2777.93, 2459.27, + 2495.92, 722.8, 489.22, 0.0 + ], + refundData: [ + 0.0, 0.0, 0.0, 0.0, 0.0, 110, 200, 1300, 3799.22, 3567.23, 2200, 1387, + 374.33, 2389.38, 4877.13, 2890.22, 1343.73, 1347.69, 1351.83, 350.27, + 2342.86, 346.06, 350.88, 0.0 + ] +} +export const TODAY_NUM_B = { + incomeData: [ + 0.0, 0.0, 0.0, 0.0, 0.0, 778.22, 380.0, 320, 2789.09, 3767.98, 4728, + 2978.03, 1273.33, 1821.94, 2295.2, 2349.02, 3479.22, 1503.34, 2533.36, + 2602.07, 2461.21, 716.24, 276.22, 0 + ], + refundData: [ + 0.0, 0.0, 0.0, 0.0, 0.0, 255.0, 200, 1450, 2200, 3656.98, 2239.03, 1973, + 338.23, 2725.84, 2342, 1349, 1435.72, 1345.91, 1344.12, 346.82, 2346.68, + 348.09, 352.05, 0 + ] +} +export const TODAY_NUM_C = { + incomeData: [ + 0.0, 0.0, 0.0, 0.0, 0.0, 778.98, 480, 170, 290.22, 2345.98, 2387, 3746.93, + 2300.22, 2764.96, 3689.23, 3478, 2295.2, 1676.81, 2841.43, 2579.56, 2678.19, + 338.74, 256.02, 0 + ], + refundData: [ + 0.0, 0.0, 0.0, 0.0, 0.0, 300, 20.39, 1840, 1899.23, 2234.03, 2297.02, + 1298.22, 1299, 2892.88, 2390, 1344.23, 1349.02, 346.35, 1343.47, 348.42, + 2345.23, 341.19, 343.79, 0 + ] +} +// 本周 +export const WEEK_DATA = [ + '第一天', + '第二天', + '第三天', + '第四天', + '第五天', + '第六天', + '第七天' +] + +// 本周 +export const WEEK_NUM_A = { + incomeData: ['14248', '13593', '14297', '13929', '14919', '13932', '14066'], + refundData: ['3393', '3024', '2970', '3254', '3170', '3223', '2964'] +} +export const WEEK_NUM_B = { + incomeData: ['13785', '14634', '13636', '13846', '14038', '14845', '14607'], + refundData: ['2981', '3033', '3105', '3311', '3326', '3141', '3302'] +} +export const WEEK_NUM_C = { + incomeData: ['14002', '14128', '13995', '14551', '14421', '14295', '14235'], + refundData: ['3137', '3035', '3083', '3262', '3067', '3189', '3486'] +} +// 本月 +export const MONTH_NUM_A = { + incomeData: [ + '13689', + '14114', + '13872', + '14248', + '13593', + '14297', + '13929', + '14919', + '13932', + '14066', + '13816', + '13405', + '14287', + '14241', + '14382', + '14117', + '14703', + '14498', + '14674', + '13686', + '14732', + '13528', + '13994', + '13719', + '14292', + '13902', + '14321', + '14548', + '14188', + '14381', + '13547' + ], + refundData: [ + '3123', + '3107', + '3248', + '3393', + '3024', + '2970', + '3254', + '3170', + '3223', + '2964', + '3484', + '3454', + '3092', + '3213', + '3377', + '3405', + '3059', + '3033', + '3094', + '3141', + '3439', + '3489', + '3286', + '3384', + '3262', + '3347', + '2980', + '3332', + '3426', + '3429', + '3347' + ] +} +export const MONTH_NUM_B = { + incomeData: [ + 14823.0, 14596.0, 14042.0, 13785.0, 14634.0, 13636.0, 13846.0, 14038.0, + 14845.0, 14607.0, 13583.0, 13797.0, 13775.0, 14760.0, 14626.0, 13990.0, + 14265.0, 13868.0, 13781.0, 14184.0, 14542.0, 13839.0, 14358.0, 13547.0, + 13686.0, 13867.0, 14096.0, 14266.0, 14871.0, 14961.0, 13902.0 + ], + refundData: [ + 3058, 3290, 3350, 2981, 3033, 3105, 3311, 3326, 3141, 3302, 3144, 3040, + 2962, 3166, 3444, 3403, 3050, 3035, 3312, 3296, 3111, 3074, 3395, 3371, + 3360, 3172, 3461, 2969, 3253, 3092, 3371 + ] +} +export const MONTH_NUM_C = { + incomeData: [ + 14356, 14408, 13942, 14002, 14128, 13995, 14551, 14421, 14295, 14235, 13996, + 13579, 14899, 14292, 13867, 14187, 13696, 14908, 14435, 14424, 14218, 14168, + 13640, 14226, 14184, 14732, 13362, 13464, 14212, 14858, 14184 + ], + refundData: [ + 3016, 3035, 3331, 3137, 3035, 3083, 3262, 3067, 3189, 3486, 3462, 3024, + 3186, 3231, 3036, 3449, 3367, 3113, 3314, 3032, 3225, 3284, 3063, 3391, + 3063, 3173, 3327, 3271, 3306, 3425, 3360 + ] +} +// 入退情况 +// 今日 +export const TODAY_EARNING_NUM_A = { + incomeData: [ + 0, 0, 0, 0, 0, 0, 0, 0, 1, 2, 0, 2, 4, 1, 4, 3, 0, 2, 3, 1, 1, 0, 0, 0 + ], + refundData: [ + 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 2, 2, 2, 2, 1, 1, 1, 4, 4, 0, 0, 0, 0 + ] +} +export const TODAY_EARNING_NUM_B = { + incomeData: [ + 0, 0, 0, 0, 0, 0, 1, 2, 4, 3, 0, 1, 3, 3, 3, 4, 1, 2, 1, 1, 0, 0, 0, 0 + ], + refundData: [ + 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 3, 2, 1, 1, 2, 1, 1, 1, 3, 1, 1, 0, 0, 0 + ] +} +export const TODAY_EARNING_NUM_C = { + incomeData: [ + 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 0, 2, 1, 1, 1, 2, 2, 1, 1, 1, 1, 0, 0, 0 + ], + refundData: [ + 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 3, 3, 3, 2, 2, 1, 1, 1, 2, 0, 1, 0, 0 + ] +} +// 本周 +export const WEEK_EARNING_NUM_A = { + incomeData: [24, 0, 14, 13, 11, 10, 20], + refundData: [21, 17, 12, 13, 19, 24, 12] +} +export const WEEK_EARNING_NUM_B = { + incomeData: [29, 18, 26, 6, 28, 19, 18], + refundData: [17, 8, 23, 23, 22, 21, 16] +} +export const WEEK_EARNING_NUM_C = { + incomeData: [15, 16, 13, 15, 5, 19, 17], + refundData: [21, 15, 27, 20, 24, 15, 16] +} +// 本月 +export const MONTH_EARNING_NUM_A = { + incomeData: [ + 12, 19, 10, 24, 0, 14, 13, 11, 10, 20, 8, 15, 9, 9, 21, 13, 21, 21, 13, 28, + 13, 12, 14, 18, 17, 22, 10, 20, 30, 22, 17 + ], + refundData: [ + 19, 19, 27, 21, 17, 12, 13, 19, 24, 12, 11, 12, 17, 24, 8, 14, 18, 21, 9, + 33, 11, 24, 24, 18, 16, 32, 27, 25, 10, 16, 16 + ] +} +export const MONTH_EARNING_NUM_B = { + incomeData: [ + 8, 26, 22, 29, 18, 26, 6, 28, 19, 18, 23, 4, 25, 18, 18, 5, 29, 18, 28, 7, + 12, 11, 23, 8, 15, 10, 7, 25, 12, 13, 12 + ], + refundData: [ + 9, 28, 7, 17, 8, 23, 23, 22, 21, 16, 20, 20, 21, 21, 14, 7, 29, 33, 14, 9, + 25, 16, 16, 6, 12, 14, 9, 11, 9, 20, 15 + ] +} +export const MONTH_EARNING_NUM_C = { + incomeData: [ + 5, 8, 14, 15, 16, 13, 15, 5, 19, 17, 16, 14, 2, 18, 14, 6, 6, 13, 10, 16, 7, + 7, 32, 13, 6, 17, 20, 14, 24, 9, 14 + ], + refundData: [ + 14, 21, 16, 21, 15, 27, 20, 24, 15, 16, 30, 19, 25, 14, 14, 10, 16, 15, 17, + 18, 19, 11, 19, 13, 29, 8, 8, 14, 22, 26, 10 + ] +} +// 服务情况 +// 今日 +export const TODAY_SERVE_NUM_A = [ + 54, 64, 34, 50, 63, 89, 102, 132, 124, 179, 147, 142, 160, 99, 112, 138, 102, + 167, 144, 122, 94, 63, 59, 52 +] +export const TODAY_SERVE_NUM_B = [ + 74, 56, 34, 44, 62, 67, 110, 128, 137, 176, 140, 139, 157, 108, 121, 123, 117, + 143, 141, 163, 102, 61, 61, 52 +] +export const TODAY_SERVE_NUM_C = [ + 84, 60, 32, 49, 47, 67, 87, 129, 122, 164, 125, 115, 142, 97, 113, 109, 112, + 115, 129, 153, 102, 82, 46, 49 +] +// 本周 +export const WEEK_SERVE_NUM_A = [2492, 2656, 2789, 2578, 2656, 2767, 2521] +export const WEEK_SERVE_NUM_B = [2516, 2267, 2678, 2567, 2878, 2567, 2878] +export const WEEK_SERVE_NUM_C = [2330, 2467, 2565, 2376, 2567, 2545, 2754] +// 本月 +export const MONTH_SERVE_NUM_A = [ + 2720, 2713, 2728, 2492, 2656, 2789, 2578, 2656, 2767, 2521, 2672, 2773, 2890, + 2838, 2690, 2529, 2491, 2745, 2869, 2811, 2904, 2796, 2822, 2592, 2961, 2883, + 2766, 2540, 2759, 2973, 2869 +] +export const MONTH_SERVE_NUM_B = [ + 2762, 2799, 2762, 2516, 2267, 2678, 2567, 2878, 2567, 2878, 2869, 2718, 2645, + 2638, 2884, 2617, 2852, 2691, 2856, 2698, 2940, 2861, 3003, 2633, 2778, 2712, + 2780, 2846, 2686, 2812, 2566 +] +export const MONTH_SERVE_NUM_C = [ + 2760, 2776, 2513, 2330, 2467, 2565, 2376, 2567, 2545, 2754, 2856, 2688, 2800, + 2750, 2665, 2889, 2881, 2672, 2801, 2927, 2675, 2611, 2552, 2915, 3022, 2579, + 2835, 2628, 2849, 2667, 2722 +] +// 待办事项 +export const BACKLOG_DATA_A = [ + { + type: 3, + num: 'RZ202310181126491', + title: '刘信俊的入住申请', + name: '宋湘婷', + date: '2023-10-18 11:26:00' + }, + { + type: 3, + num: 'RZ202310181144772', + title: '李美治的入住申请', + name: '王姿吟', + date: '2023-10-18 11:44:00' + }, + { + type: 1, + num: 'TZ202310181217777', + title: '汤筠霞的退住申请', + name: '马荣真', + date: '2023-10-18 12:17:00' + } +] +export const BACKLOG_DATA_B = [ + { + type: 1, + num: 'TZ202310220800769', + title: '张昆元的退住申请', + name: '龚静雯', + date: '2023-10-22 08:00:00' + }, + { + type: 1, + num: 'TZ202310230932323', + title: '林国芸的退住申请', + name: '曹智强', + date: '2023-10-23 09:32:00' + }, + { + type: 3, + num: 'RZ202310232217987', + title: '游石如的入住申请', + name: '葛真珍', + date: '2023-10-23 22:17:00' + } +] +export const BACKLOG_DATA_C = [ + { + type: 3, + num: 'RZ202310131703287', + title: '陈冠廷的入住申请', + name: '叶静宜', + date: '2023-10-13 17:03:00' + }, + { + type: 1, + num: 'TZ202310131829109', + title: '庾雅婷的退住申请', + name: '曹智强', + date: '2023-10-13 18:29:00' + }, + { + type: 3, + num: 'TZ202310132102640', + title: '陈采勇的退住申请', + name: '林宜蓁', + date: '2023-10-13 21:02:00' + } +] +// 预约总览 +export const SUBSCRIBE_DATA = [ + [ + { + type: 1, + phone: '17062479244', + name: '张伟', + time: '09:00' + }, + { + type: 1, + phone: '17395096135', + name: '林建华', + time: '12:00' + }, + { + type: 2, + phone: '13470504971', + name: '马荣真', + time: '18:00' + } + ], + [ + { + type: 1, + phone: '16133295231', + name: '李思远', + time: '07:35' + }, + { + type: 1, + phone: '13505066198', + name: '王刚', + time: '11:20' + }, + { + type: 2, + phone: '15650105031', + name: '张宏伟', + time: '18:00' + } + ], + [ + { + type: 1, + phone: '17705167560', + name: '黄成立', + time: '12:00' + }, + { + type: 2, + phone: '17714515848', + name: '周安', + time: '13:00' + }, + { + type: 2, + phone: '14144928346', + name: '刘翱川云', + time: '14:00' + } + ], + [ + { + type: 2, + phone: '19424354614', + name: '杨雪莉', + time: '09:00' + }, + { + type: 2, + phone: '16472588080', + name: '陈琳', + time: '15:00' + }, + { + type: 2, + phone: '19321315213', + name: '徐秀娟', + time: '16:30' + } + ], + [ + { + type: 1, + phone: '19334274595', + name: '刘强', + time: '07:45' + }, + { + type: 2, + phone: '13267734773', + name: '陈鹏', + time: '08:00' + }, + { + type: 1, + phone: '15240724014', + name: '袁文轩', + time: '09:00' + } + ], + [ + { + type: 2, + phone: '19224279107', + name: '刘毅豪', + time: '09:50' + }, + { + type: 1, + phone: '13267739898', + name: '许浩然', + time: '10:00' + }, + { + type: 1, + phone: '15424276235', + name: '王婷', + time: '11:15' + } + ], + [ + { + type: 1, + phone: '15576572508', + name: '谢杰', + time: '11:10' + }, + { + type: 2, + phone: '14779915659', + name: '李婉娜', + time: '11:30' + }, + { + type: 2, + phone: '13047879330', + name: '陈进', + time: '11:45' + } + ], + [ + { + type: 1, + phone: '19161592761', + name: '袁洋', + time: '08:00' + }, + { + type: 1, + phone: '13348740172', + name: '张晓丽', + time: '12:00' + }, + { + type: 2, + phone: '14144969481', + name: '刘鑫', + time: '18:00' + } + ], + [ + { + type: 1, + phone: '15378283924', + name: '张雨静涵', + time: '07:00' + }, + { + type: 1, + phone: '15018246673', + name: '张豪', + time: '14:00' + }, + { + type: 1, + phone: '16157278889', + name: '刘莉', + time: '18:00' + } + ], + [ + { + type: 2, + phone: '16006983031', + name: '王美惠', + time: '09:00' + }, + { + type: 1, + phone: '14440882401', + name: '刘易空麟', + time: '09:20' + }, + { + type: 2, + phone: '19546590654', + name: '孙鹏', + time: '16:00' + } + ], + [ + { + type: 2, + phone: '18024078717', + name: '吴浩', + time: '11:10' + }, + { + type: 1, + phone: '13645156008', + name: '赵雨薇', + time: '11:15' + }, + { + type: 2, + phone: '13625298333', + name: '郑宇', + time: '11:20' + } + ], + [ + { + type: 1, + phone: '19142821142', + name: '孙佳琳', + time: '10:20' + }, + { + type: 1, + phone: '16251340113', + name: '周浩', + time: '13:05' + }, + { + type: 1, + phone: '14487596705', + name: '章美西子', + time: '17:20' + } + ], + [ + { + type: 1, + phone: '19428172648', + name: '陈琳', + time: '13:00' + }, + { + type: 2, + phone: '18024127039', + name: '赵文斌', + time: '13:30' + }, + { + type: 2, + phone: '15692374458', + name: '郭文', + time: '14:20' + } + ], + [ + { + type: 2, + phone: '14440994509', + name: '刘芳菲', + time: '10:45' + }, + { + type: 1, + phone: '19648676758', + name: '孙思怡宁', + time: '11:10' + }, + { + type: 2, + phone: '17065016573', + name: '王志强', + time: '14:20' + } + ], + [ + { + type: 1, + phone: '18726744874', + name: '徐瑶', + time: '10:00' + }, + { + type: 2, + phone: '19224335967', + name: '周雅静', + time: '11:00' + }, + { + type: 2, + phone: '16251317275', + name: '陈璐璐', + time: '17:40' + } + ], + [ + { + type: 2, + phone: '16411066720', + name: '林怡萱', + time: '08:05' + }, + { + type: 2, + phone: '13446950500', + name: '许萍', + time: '18:20' + }, + { + type: 2, + phone: '17025237863', + name: '周明轩', + time: '18:25' + } + ], + [ + { + type: 1, + phone: '13047816688', + name: '李文彬', + time: '09:00' + }, + { + type: 1, + phone: '17198850244', + name: '陈美丽', + time: '12:00' + }, + { + type: 2, + phone: '19142966809', + name: '张雪', + time: '18:00' + } + ], + [ + { + type: 1, + phone: '17124507049', + name: '周安', + time: '08:40' + }, + { + type: 2, + phone: '15424407939', + name: '孙建华', + time: '11:00' + }, + { + type: 2, + phone: '14670165974', + name: '徐秀娟', + time: '17:00' + } + ], + [ + { + type: 2, + phone: '15650156172', + name: '潘长海', + time: '07:40' + }, + { + type: 1, + phone: '13509246375', + name: '邹建林', + time: '10:25' + }, + { + type: 2, + phone: '16807345805', + name: '吴平', + time: '18:40' + } + ], + [ + { + type: 2, + phone: '19161477491', + name: '方文涛', + time: '09:00' + }, + { + type: 1, + phone: '15134262211', + name: '赵良', + time: '08:50' + }, + { + type: 2, + phone: '16736752076', + name: '田立志', + time: '20:00' + } + ] +] + +export const SALE_COLUMNS = [ + { + align: 'center', + colKey: 'index', + title: '排名', + width: 65 + }, + { + align: 'left', + ellipsis: true, + colKey: 'productName', + title: '客户名称', + width: 150 + }, + { + align: 'center', + colKey: 'growUp', + width: 100, + title: '较上周' + }, + { + align: 'center', + colKey: 'count', + title: '订单量', + width: 100 + }, + { + align: 'center', + colKey: 'date', + width: 140, + title: '合同签订日期' + }, + { + align: 'center', + colKey: 'operation', + title: '操作', + width: 74, + fixed: 'right' + } +] + +export const BUY_COLUMNS = [ + { + align: 'center', + colKey: 'index', + title: '排名', + width: 65 + }, + { + align: 'left', + ellipsis: true, + colKey: 'productName', + width: 150, + title: '供应商名称' + }, + { + align: 'center', + colKey: 'growUp', + width: 100, + title: '较上周' + }, + { + align: 'center', + colKey: 'count', + title: '订单量', + width: 100 + }, + { + align: 'center', + colKey: 'date', + width: 140, + title: '合同签订日期' + }, + { + align: 'center', + colKey: 'operation', + title: '操作', + width: 74, + fixed: 'right' + } +] + +// 老人等级分布 +export const ELDER_RANK_DATA_A = [ + { value: 43, name: '特级护理等级' }, + { value: 89, name: '一级护理等级' }, + { value: 192, name: '二级护理等级' }, + { value: 319, name: '三级护理等级' } +] + +export const ELDER_RANK_DATA_B = [ + { value: 42, name: '特级护理等级' }, + { value: 91, name: '一级护理等级' }, + { value: 191, name: '二级护理等级' }, + { value: 331, name: '三级护理等级' } +] + +export const ELDER_RANK_DATA_C = [ + { value: 37, name: '特级护理等级' }, + { value: 91, name: '一级护理等级' }, + { value: 196, name: '二级护理等级' }, + { value: 325, name: '三级护理等级' } +] +// 老人年龄分布 +export const ELDER_AGE_DATA_A = { + man: [19, 51, 124, 98, 7], + woman: [22, 40, 164, 102, 16] +} +export const ELDER_AGE_DATA_B = { + man: [19, 54, 128, 98, 8], + woman: [25, 40, 164, 102, 17] +} +export const ELDER_AGE_DATA_C = { + man: [18, 47, 128, 99, 8], + woman: [26, 38, 165, 102, 18] +} diff --git a/src/views/dashboard/index.scss b/src/views/dashboard/index.scss new file mode 100644 index 0000000..a6bc6c7 --- /dev/null +++ b/src/views/dashboard/index.scss @@ -0,0 +1,690 @@ +// base color +$blue: #324157; +$light-blue: #3A71A8; +$red: #C03639; +$pink: #E65D6E; +$green: #30B08F; +$tiffany: #4AB7BD; +$yellow: #FEC171; +$panGreen: #30B08F; +$--color-link: #008d71; +$--color-main: #00b8a0; +// 默认菜单主题风格 +$base-menu-color: #bfcbd9; +$base-menu-color-active: #f4f4f5; +$base-menu-background: #304156; +$base-logo-title-color: #ffffff; + +$base-menu-light-color: rgba(0, 0, 0, 0.7); +$base-menu-light-background: #ffffff; +$base-logo-light-title-color: #001529; + +$base-sub-menu-background: #1f2d3d; +$base-sub-menu-hover: #001528; +$base-color-bk4: #999999; +$base--color-bk2: #262626; +$--color-bk3: #595959; +$--color-black: #000; +$--color-border: #e8e8e8; +$--color-aux5: #ebf6f5; +$--color-bk6: #bfbfbf; +$--color-bk14: #f2f9f7; +$base-font-size-12: 12px; +$base-font-size-14: 14px; +$base-font-size-16: 16px; + +// 自定义暗色菜单风格 +/** +$base-menu-color:hsla(0,0%,100%,.65); +$base-menu-color-active:#fff; +$base-menu-background:#001529; +$base-logo-title-color: #ffffff; + +$base-menu-light-color:rgba(0,0,0,.70); +$base-menu-light-background:#ffffff; +$base-logo-light-title-color: #001529; + +$base-sub-menu-background:#000c17; +$base-sub-menu-hover:#001528; +*/ + +$--color-primary: #409EFF; +$--color-success: #67C23A; +$--color-warning: #E6A23C; +$--color-danger: #F56C6C; +$--color-info: #909399; + +$base-sidebar-width: 200px; + +// 从variables.module2.scss合并的变量（避免重复） +// 如果variables.module2.scss中有额外变量，在这里添加 +// 由于内容相似，主要变量已经在上方定义 + +// the :export directive is the magic sauce for webpack +// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass +:export { + menuColor: $base-menu-color; + menuLightColor: $base-menu-light-color; + menuColorActive: $base-menu-color-active; + menuBackground: $base-menu-background; + menuLightBackground: $base-menu-light-background; + subMenuBackground: $base-sub-menu-background; + subMenuHover: $base-sub-menu-hover; + sideBarWidth: $base-sidebar-width; + logoTitleColor: $base-logo-title-color; + logoLightTitleColor: $base-logo-light-title-color; + primaryColor: $--color-primary; + successColor: $--color-success; + dangerColor: $--color-danger; + infoColor: $--color-info; + warningColor: $--color-warning; +} + +.home-wrapper { + padding: 24px 15px 52px 24px; + + .el-card { + box-shadow: 0 2px 4px 0 #00000008; + } + + .el-card__header { + padding: 20px 20px 0 !important; + display: block; + font-weight: 700; + font-size: 16px; + border: 0 none; + + .el-card__body { + display: block; + } + + .tit { + font-size: 16px; + display: flex; + + span { + flex: 1; + + &.time { + font-size: $base-font-size-12; + font-weight: normal; + color: $base-color-bk4; + flex: none; + } + } + } + } + + .t-card__body { + padding: 20px; + } + + .dataCon { + display: flex; + padding-top: 18px; + } + + .dashboard-chart-container { + width: 158px; + height: 158px; + margin: 0 auto; + } + + .roleCon { + .head { + display: flex; + padding: 20px 0 15px; + + .img { + width: 49px; + height: 49px; + margin-right: 12px; + + img { + width: 49px; + height: 49px; + border-radius: 50%; + } + } + + .rText { + p { + line-height: 24px; + + &:first-child { + font-size: $base-font-size-16; + font-weight: 700; + } + + &:last-child { + font-size: $base-font-size-14; + color: $base-color-bk4; + } + } + } + } + + .userInfo { + display: flex; + flex-wrap: wrap; + padding-bottom: 5px; + + p { + width: calc(50%); + display: inline-block; + line-height: 26px; + color: $base-color-bk4; + font-size: 14px; + position: relative; + padding-left: 25px; + height: 26px; + + i { + display: inline-block; + width: 20px; + height: 20px; + vertical-align: middle; + margin-right: 5px; + position: absolute; + left: 0; + top: 3px; + } + + .icon1 { + background: url(../../assets/images/icon_yhgl2x.png) no-repeat; + background-size: contain; + } + + .icon2 { + background: url(../../assets/images/icon_jsgl2x.png) no-repeat; + background-size: contain; + } + + .icon3 { + background: url(../../assets/images/icon_bmgl2x.png) no-repeat; + background-size: contain; + } + + .icon4 { + background: url(../../assets/images/icon_gwgl2x.png) no-repeat; + background-size: contain; + } + } + + .userTit { + .textOverflow { + max-height: 24px; + overflow: hidden; + text-overflow: ellipsis; + display: block; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; + } + } + } + + .hFoot { + .fTit { + font-size: $base-font-size-14; + color: $base--color-bk2; + line-height: 26px; + padding-bottom: 10px; + } + + .imgItem { + display: flex; + padding-bottom: 5px; + + li { + margin-right: 5px; + + img, + span { + width: 32px; + height: 32px; + line-height: 32px; + border-radius: 50%; + display: inline-block; + } + + &:last-child { + span { + background: $--color-main; + font-size: $base-font-size-14; + font-weight: 700; + color: $base-logo-title-color; + text-align: center; + margin-right: 0; + } + } + } + } + } + } + + .condition { + display: flex; + position: relative; + padding: 12px 0 5px; + + .el-tabs { + flex: 1; + padding-bottom: 0; + + .el-tabs__nav-wrap{ + &::after{ + display: none; + } + } + + .el-tabs__active-bar { + height: 4px; + border-radius: 2px; + margin: 0 0 0 12px; + width: 32px !important; + } + + .el-tabs__item { + padding: 0; + margin: 0 14px 0 0; + color: $--color-bk3; + + &.is-active { + color: $base--color-bk2; + font-size: 16px; + font-weight: 700; + } + + &.t-size-m { + height: 32px; + line-height: 32px; + } + } + } + + .times { + position: absolute; + right: 0; + z-index: 9; + display: flex; + line-height: 40px; + font-size: 12px; + + .date { + display: flex; + padding-right: 15px; + + li { + padding: 0 5px; + cursor: pointer; + font-weight: normal; + } + + .active { + color: $--color-main; + } + } + } + + .t-tabs .t-tabs__nav-container.t-is-top::after { + background-color: transparent; + } + } + + .dashboard-chart-card { + padding: 0; + } + + .useList { + display: flex; + flex-wrap: wrap; + padding-top: 20px; + text-align: center; + align-items: center; + justify-content: center; + + a, + .addUser { + padding: 18px 0; + color: #332929; + width: 25%; + + &:hover { + color: #332929; + } + + span { + display: inline-block; + width: 49px; + height: 49px; + border-radius: 4px; + } + + .bedIcon { + background: url(../../assets/images/icon_cwyl.png) 50% 50% no-repeat #e0fcf3; + background-size: 80%; + } + .addIcon { + background: url(../../assets/images/icon_xzyh.png) 50% 50% no-repeat #e8fedf; + background-size: 80%; + } + .warnIcon { + background: url(../../assets/images/icon_bjsj.png) 50% 50% no-repeat #feebd3; + background-size: 80%; + } + .appointmentIcon { + background: url(../../assets/images/icon_cwbb.png) 50% 50% no-repeat #e0fcf3; + background-size: 80%; + } + .backlogIcon { + background: url(../../assets/images/icon-daiban.png) 50% 50% no-repeat #e0fcf3; + background-size: 80%; + } + .financeIcon { + background: url(../../assets/images/icon_zdgl.png) 50% 50% no-repeat #e8fedf; + background-size: 80%; + } + .refundIcon { + background: url(../../assets/images/icon_tkgl.png) 50% 50% no-repeat #eee5ff; + background-size: 80%; + } + .orderIcon { + background: url(../../assets/images/icon_ddgl2.png) 50% 50% no-repeat #e5f5ff; + background-size: 80%; + } + .checkIcon { + background: url(../../assets/images/icon_rutui2x.png) 50% 50% no-repeat #d3fbfe; + background-size: 80%; + } + .backIcon { + background: url(../../assets/images/icon_rutui.png) 50% 50% no-repeat #ffebe5; + background-size: 80%; + } + .leaveIcon { + background: url(../../assets/icon-qj.png) 50% 50% no-repeat #feebd3; + background-size: 80%; + } + .subscribeIcon { + background: url(../../assets/icon_cwbb.png) 50% 50% no-repeat #e0fcf3; + background-size: 80%; + } + } + } + + .monitorContainer { + width: 100%; + height: 234px; + + & > div { + &:first-child { + width: 100% !important; + + & > canvas { + width: 100% !important; + } + } + } + } + + .dateCon { + height: 30px; + background: #f3f8f9; + border-radius: 2px; + line-height: 30px; + margin-top: 5px; + padding: 0 10px; + font-weight: normal; + font-size: 14px; + } + + .backlogCon { + padding-top: 8px; + + ul { + li { + background: #f3f8f9; + border-radius: 2px; + padding: 14px 20px 14px; + margin-top: 10px; + line-height: 20px; + display: flex; + + .con { + flex: 1; + } + + .btn { + height: 32px; + line-height: 30px; + background: $--color-main; + border-radius: 2px; + color: $base-logo-title-color; + width: 60px; + text-align: center; + display: inline-block; + margin-top: 6px; + } + + p { + padding: 2px 0; + } + + .head { + color: $base--color-bk2; + font-weight: 700; + } + + .time { + color: $base-color-bk4; + } + } + } + } + + .typeIcon { + display: inline-block; + text-align: center; + width: 36px; + height: 18px; + line-height: 18px; + border-radius: 16px; + font-size: 12px; + color: #fff; + margin-right: 8px; + font-weight: normal; + } + + .icon1 { + background: #fe6e6e; + } + + .icon2 { + background: #ffb057; + } + + .icon3 { + background: #27ba9b; + } + + .timeTie { + display: flex; + + div { + &:last-child { + flex: 1; + text-align: right; + font-size: $base-font-size-12; + font-weight: normal; + color: $base-color-bk4; + + .goToday { + color: $--color-main; + cursor: pointer; + margin-right: 10px; + } + } + } + } + + .dateSelete { + position: relative; + padding: 10px 40px 0; + + ul { + display: flex; + flex-wrap: wrap; + + li { + flex: 1; + text-align: center; + color: $base--color-bk2; + line-height: 22px; + + p { + padding: 2px 0; + display: flex; + align-items: center; + justify-content: center; + + span { + display: inline-block; + width: 24px; + height: 24px; + line-height: 24px; + text-align: center; + } + + &:first-child { + color: $base-color-bk4; + } + + &:last-child { + span { + cursor: pointer; + + &.dayActive { + background: $--color-main; + border-radius: 12px; + color: $base-menu-light-background; + } + } + } + } + } + } + + & > span { + display: inline-block; + width: 36px; + height: 36px; + position: absolute; + top: 20px; + } + + .pre { + background: url(../../assets/images/btn_xia_nor.png) no-repeat 50% 50%; + background-size: contain; + transform: rotate(180deg); + left: 0; + } + + .next { + background: url(../../assets/images/btn_xia_nor.png) no-repeat 50% 50%; + background-size: contain; + right: 0; + } + + .forbidActive { + background: url(../../assets/images/btn_shang_nox.png) no-repeat 50% 50%; + background-size: contain; + transform: rotate(0); + } + } + + .subscribeCon { + margin-top: -5px; + + ul { + li { + background: #f3f8f9; + border-radius: 2px; + padding: 7px; + line-height: 20px; + margin: 14px 0 0; + display: flex; + align-items: center; + color: $base-color-bk4; + font-size: 14px; + + span { + &:last-child { + flex: 1; + text-align: right; + } + } + } + } + + .typeIcon { + margin-right: 8px; + } + + .time { + font-size: $base-font-size-16; + font-weight: 700; + padding-right: 25px; + color: $base--color-bk2; + } + } + + .dashboard-rank-card, + .dashboard-chart-card { + height: 278px; + + .el-card__header { + font-size: $base-font-size-16; + font-weight: 700; + } + } + + .rankCard { + min-width: 450px; + } + + .card-title { + display: flex; + flex-direction: row; + justify-content: space-between; + + .main-title { + font-size: $base-font-size-16; + font-weight: 700; + } + + .sub-title { + font-size: $base-font-size-14; + } + } + + .el-badge--circle { + background: #e34d59; + height: 14px; + line-height: 12px; + } + + .textOverflow { + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; + } + + .row-container[data-v-0d2b0973]:not(:last-child) { + margin: 0; + } +} + +.el-tooltip--default .el-popup__content { + width: 200px !important; +} \ No newline at end of file diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue new file mode 100644 index 0000000..9fa617e --- /dev/null +++ b/src/views/dashboard/index.vue @@ -0,0 +1,43 @@ + + + + + + diff --git a/src/views/dashboard/index1.js b/src/views/dashboard/index1.js new file mode 100644 index 0000000..62e196e --- /dev/null +++ b/src/views/dashboard/index1.js @@ -0,0 +1,742 @@ +import dayjs from 'dayjs' +import { getChartListColor } from '@/utils/color' +import { getRandomArray } from '@/utils/charts' +/** 首页 dashboard 折线图 */ +export function constructInitDashboardDataset(type) { + const dateArray= [ + '周一', + '周二', + '周三', + '周四', + '周五', + '周六', + '周日' + ] + const datasetAxis = { + xAxis: { + type: 'category', + show: false, + data: dateArray + }, + yAxis: { + show: false, + type: 'value' + }, + grid: { + top: 0, + left: 0, + right: 0, + bottom: 0 + } + } + + if (type === 'line') { + const lineDataset = { + ...datasetAxis, + color: ['#fff'], + series: [ + { + data: [150, 230, 224, 218, 135, 147, 260], + type, + showSymbol: true, + symbol: 'circle', + symbolSize: 0, + markPoint: { + data: [ + { type: 'max', name: '最大值' }, + { type: 'min', name: '最小值' } + ] + }, + lineStyle: { + width: 2 + } + } + ] + } + return lineDataset + } + const barDataset = { + ...datasetAxis, + color: getChartListColor(), + series: [ + { + data: [ + 100, + 130, + 184, + 218, + { + value: 135, + itemStyle: { + opacity: 0.2 + } + }, + { + value: 118, + itemStyle: { + opacity: 0.2 + } + }, + { + value: 60, + itemStyle: { + opacity: 0.2 + } + } + ], + type, + barWidth: 9 + } + ] + } + return barDataset +} + +/** 柱状图数据源 */ +export function constructInitDataset({ + dateTime = [], + placeholderColor, + borderColor +}) { + const divideNum = 10 + const timeArray = [] + const inArray = [] + const outArray = [] + for (let i = 0; i < divideNum; i++) { + if (dateTime.length > 0) { + const dateAbsTime= + (new Date(dateTime[1]).getTime() - new Date(dateTime[0]).getTime()) / + divideNum + const enhandTime= + new Date(dateTime[0]).getTime() + dateAbsTime * i + timeArray.push(dayjs(enhandTime).format('YYYY-MM-DD')) + } else { + timeArray.push( + dayjs() + .subtract(divideNum - i, 'day') + .format('YYYY-MM-DD') + ) + } + + inArray.push(getRandomArray().toString()) + outArray.push(getRandomArray().toString()) + } + + const dataset = { + color: getChartListColor(), + tooltip: { + trigger: 'item' + }, + xAxis: { + type: 'category', + data: timeArray, + axisLabel: { + color: placeholderColor + }, + axisLine: { + lineStyle: { + color: getChartListColor()[1], + width: 1 + } + } + }, + yAxis: { + type: 'value', + axisLabel: { + color: placeholderColor + }, + splitLine: { + lineStyle: { + color: borderColor + } + } + }, + grid: { + top: '5%', + left: '25px', + right: 0, + bottom: '60px' + }, + legend: { + icon: 'rect', + itemWidth: 12, + itemHeight: 4, + itemGap: 48, + textStyle: { + fontSize: 12, + color: placeholderColor + }, + left: 'center', + bottom: '0', + orient: 'horizontal', + data: ['本月', '上月'] + }, + series: [ + { + name: '本月', + data: outArray, + type: 'bar' + }, + { + name: '上月', + data: inArray, + type: 'bar' + } + ] + } + + return dataset +} + +/** + * 线性图表数据源 + */ +export function getLineChartDataSet({ borderColor }, data, time) { + const dataSet = { + color: ['#4D8DFF', '#00B8A0'], + tooltip: { + trigger: 'axis', + formatter(params) { + let relVal = params[0].name + for (let i = 0, l = params.length; i < l; i++) { + relVal += `
${params[i].marker}${params[i].seriesName} ${params[i].value}元` + } + return relVal + } + }, + grid: { + left: '0', + right: '20px', + top: '30px', + bottom: '0', + containLabel: true + }, + legend: false, // 隐藏图例 + xAxis: { + type: 'category', + data: time, + boundaryGap: false, + axisLabel: { + color: '#595959' + }, + axisLine: { + lineStyle: { + width: 1, + color: borderColor + } + } + }, + yAxis: { + type: 'value', + axisLabel: { + color: '#595959' + }, + splitLine: { + lineStyle: { + type: 'dashed', // 线的类型 + color: borderColor + } + } + }, + series: [ + { + name: '收入金额', + data: data.incomeData, + type: 'line', + smooth: true + }, + { + name: '退款金额', + data: data.refundData, + type: 'line', + smooth: true + } + ] + } + return dataSet +} +// 入退情况 +/** + * 柱状图表数据源 + */ +export function getIncomeChartDataSet({ borderColor }, data, time) { + const dataSet = { + color: ['#4D8DFF', '#00B8A0'], + tooltip: { + trigger: 'axis', + formatter(params) { + let relVal = params[0].name + for (let i = 0, l = params.length; i < l; i++) { + relVal += `
${params[i].marker}${params[i].seriesName} ${params[i].value}人` + } + return relVal + } + }, + grid: { + left: '0', + right: '20px', + top: '30px', + bottom: '0', + containLabel: true + }, + legend: false, // 隐藏图例 + xAxis: { + type: 'category', + data: time, + axisLabel: { + color: '#595959' + }, + axisLine: { + lineStyle: { + width: 1, + color: borderColor + } + } + }, + yAxis: { + type: 'value', + axisLabel: { + color: '#595959' + }, + splitLine: { + lineStyle: { + type: 'dashed', // 线的类型 + color: borderColor + } + } + }, + series: [ + { + name: '入住人数', + data: data.incomeData, + type: 'bar', + smooth: true, + barWidth: '10px' + }, + { + name: '退住人数', + data: data.refundData, + type: 'bar', + smooth: true, + barWidth: '10px' + } + ] + } + return dataSet +} +/** + * 线性图表数据源 + */ +export function getServeChartDataSet({ borderColor }, data, time) { + const dataSet = { + color: ['#00B8A0'], + tooltip: { + trigger: 'axis', + formatter(params) { + let relVal = params[0].name + for (let i = 0, l = params.length; i < l; i++) { + relVal += `
${params[i].marker}${params[i].seriesName} ${params[i].value}次` + } + return relVal + } + }, + grid: { + left: '0', + right: '20px', + top: '30px', + bottom: '0', + containLabel: true + }, + legend: false, // 隐藏图例 + xAxis: { + type: 'category', + data: time, + boundaryGap: false, + axisLabel: { + color: '#595959' + }, + axisLine: { + lineStyle: { + width: 1, + color: borderColor + } + } + }, + yAxis: { + type: 'value', + axisLabel: { + color: '#595959' + }, + splitLine: { + lineStyle: { + type: 'dashed', // 线的类型 + color: borderColor + } + } + }, + series: [ + { + name: '收入金额', + data, + type: 'line', + smooth: true + } + ] + } + return dataSet +} +/** + * 获取饼图数据 + * + * @export + * @param {number} [num=1] + * @returns {*} + */ +export function getOldPieChartDataSet({ textColor, containerColor }, data) { + return { + color: getChartListColor(), + tooltip: { + trigger: 'item', + formatter: '{b}: {c} 人' + }, + grid: { + top: '0', + right: '0' + }, + legend: false, // 隐藏图例 + series: [ + { + name: '老人数量', + type: 'pie', + radius: ['65%', '80%'], + avoidLabelOverlap: true, + itemStyle: { + borderColor: containerColor, + borderWidth: 1 + }, + label: { + show: true, + position: 'center', + formatter: [`{value|${data.total}人}`, '{name|老人数量}'].join('\n'), + rich: { + value: { + color: textColor, + fontSize: 18, + fontWeight: 'normal', + lineHeight: 46 + }, + name: { + color: '#909399', + fontSize: 14, + lineHeight: 14 + } + } + }, + labelLine: { + show: false + }, + data: data.data + } + ] + } +} +// 累计按摩时长(小时) +export function getBedPieChartDataSet({ textColor, containerColor }, data) { + return { + color: ['#d7f1ed', '#689FFF'], + tooltip: { + trigger: 'item', + formatter: '{b}: {c} 个' + }, + grid: { + top: '0', + right: '0' + }, + legend: false, // 隐藏图例 + series: [ + { + name: '累计按摩时长', + type: 'pie', + radius: ['65%', '80%'], + avoidLabelOverlap: true, + itemStyle: { + borderColor: containerColor, + borderWidth: 1 + }, + label: { + show: true, + position: 'center', + formatter: [`{value|${data.total}小时}`, '{name|累计按摩时长}'].join('\n'), + rich: { + value: { + color: textColor, + fontSize: 18, + fontWeight: 'normal', + lineHeight: 46 + }, + name: { + color: '#909399', + fontSize: 14, + lineHeight: 14 + } + } + }, + labelLine: { + show: false + }, + data: data.data + } + ] + } +} +// 服务数量 +export function getservePieChartDataSet({ textColor, containerColor }, data) { + return { + color: ['#d7f1ed', '#ADA5EE'], + tooltip: { + trigger: 'item', + formatter: '{b}: {c} w笔' + }, + grid: { + top: '0', + right: '0' + }, + legend: false, // 隐藏图例 + series: [ + { + name: '床服务单数量', + type: 'pie', + radius: ['65%', '80%'], + avoidLabelOverlap: true, + itemStyle: { + borderColor: containerColor, + borderWidth: 1 + }, + label: { + show: true, + position: 'center', + formatter: [`{value|${data.total}w笔}`, '{name|服务单数量}'].join( + '\n' + ), + rich: { + value: { + color: textColor, + fontSize: 18, + fontWeight: 'normal', + lineHeight: 46 + }, + name: { + color: '#909399', + fontSize: 14, + lineHeight: 14 + } + } + }, + labelLine: { + show: false + }, + data: data.data + } + ] + } +} +// 员工数量 +export function getStaffPieChartDataSet({ textColor, containerColor }, data) { + return { + color: ['#d7f1ed', '#FFB056'], + tooltip: { + trigger: 'item', + formatter: '{b}: {c} 人' + }, + grid: { + top: '0', + right: '0' + }, + legend: false, // 隐藏图例 + series: [ + { + name: '员工数量', + type: 'pie', + radius: ['65%', '80%'], + avoidLabelOverlap: true, + itemStyle: { + borderColor: containerColor, + borderWidth: 1 + }, + label: { + show: true, + position: 'center', + formatter: [`{value|${data.total}人}`, '{name|员工数量}'].join('\n'), + rich: { + value: { + color: textColor, + fontSize: 18, + fontWeight: 'normal', + lineHeight: 46 + }, + name: { + color: '#909399', + fontSize: 14, + lineHeight: 14 + } + } + }, + labelLine: { + show: false + }, + data: data.data + } + ] + } +} +// 收入金额 +export function getMoneyPieChartDataSet({ textColor, containerColor }, data) { + return { + color: ['#d7f1ed', '#FE8585'], + tooltip: { + trigger: 'item', + formatter: '{b}: {c} w元' + }, + grid: { + top: '0', + right: '0' + }, + legend: false, // 隐藏图例 + series: [ + { + name: '收入金额', + type: 'pie', + radius: ['65%', '80%'], + avoidLabelOverlap: true, + itemStyle: { + borderColor: containerColor, + borderWidth: 1 + }, + label: { + show: true, + position: 'center', + formatter: [`{value|${data.total}w元}`, '{name|收入金额}'].join('\n'), + rich: { + value: { + color: textColor, + fontSize: 18, + fontWeight: 'normal', + lineHeight: 46 + }, + name: { + color: '#909399', + fontSize: 14, + lineHeight: 14 + } + } + }, + labelLine: { + show: false + }, + data: data.data + } + ] + } +} + +// 老人等级分布 +export const getElderRankDistribution=(data)=> { + return { + color: ['#47CBBA', '#9891df', '#8EBEF3', '#FFB057', '#FE6E6E'], + tooltip: { + trigger: 'item', + formatter(params) { + return `

+ ${params.name}
+

${params.marker} ${params.value}人 ${params.percent}%

` + } + }, + + legend: { + icon: 'circle', + itemHeight: 6, + orient: 'vertical', + left: '60%', + top: 'center', + align: 'left' + }, + grid: { + top: '10%', + bottom: '5%' + }, + series: [ + { + name: '', + type: 'pie', + radius: ['30%', '60%'], + center: ['30%', '50%'], // 控制饼图生成在盒子的哪个位置，[左右,上下] + label: { + show: false, + position: 'center' + }, + labelLine: { + show: false + }, + startAngle: 225, // 起始角度 + data + } + ] + } +} + +// 老人年龄分布 +export const getElderAgeDistribution=(data)=> { + const xAxisData = ['60岁以下', '60-70岁', '71-80岁', '81-90岁', '90岁以上'] + return { + color: ['#27C2AE', '#FE6E6E'], + legend: { + data: ['男', '女'], + icon: 'circle', + itemHeight: 6, + top: 'bottom' + }, + tooltip: { + trigger: 'item', + formatter(params) { + return `

+ ${params.name}
+

${params.marker}${params.seriesName} ${params.value}人

` + } + }, + xAxis: { + data: xAxisData, + axisLine: { onZero: true }, + splitLine: { show: false }, + splitArea: { show: false }, + axisLabel: { + // x轴文字的配置 + show: true, + interval: 0 // 使x轴文字显示全 + } + }, + yAxis: {}, + grid: { + left: '15%', + top: '10%', + bottom: '25%' + }, + series: [ + { + name: '男', + type: 'bar', + barWidth: 20, + stack: 'one', + data: data.man + }, + { + name: '女', + type: 'bar', + barWidth: 20, + stack: 'one', + data: data.woman + } + ] + } +} diff --git a/src/views/device/index.vue b/src/views/device/index.vue new file mode 100644 index 0000000..eb86e5b --- /dev/null +++ b/src/views/device/index.vue @@ -0,0 +1,503 @@ + + + diff --git a/src/views/error/401.vue b/src/views/error/401.vue new file mode 100644 index 0000000..b361368 --- /dev/null +++ b/src/views/error/401.vue @@ -0,0 +1,82 @@ + + + + + diff --git a/src/views/error/404.vue b/src/views/error/404.vue new file mode 100644 index 0000000..f205303 --- /dev/null +++ b/src/views/error/404.vue @@ -0,0 +1,227 @@ + + + + + diff --git a/src/views/index.vue b/src/views/index.vue new file mode 100644 index 0000000..0200f2e --- /dev/null +++ b/src/views/index.vue @@ -0,0 +1,213 @@ + + + + + + diff --git a/src/views/log/index.vue b/src/views/log/index.vue new file mode 100644 index 0000000..434fe40 --- /dev/null +++ b/src/views/log/index.vue @@ -0,0 +1,293 @@ + + + diff --git a/src/views/login.vue b/src/views/login.vue new file mode 100644 index 0000000..8b64e6b --- /dev/null +++ b/src/views/login.vue @@ -0,0 +1,229 @@ + + + + + diff --git a/src/views/monitor/job/index.vue b/src/views/monitor/job/index.vue new file mode 100644 index 0000000..9e46d68 --- /dev/null +++ b/src/views/monitor/job/index.vue @@ -0,0 +1,502 @@ + + + diff --git a/src/views/monitor/job/log.vue b/src/views/monitor/job/log.vue new file mode 100644 index 0000000..8435606 --- /dev/null +++ b/src/views/monitor/job/log.vue @@ -0,0 +1,283 @@ + + + diff --git a/src/views/monitor/online/index.vue b/src/views/monitor/online/index.vue new file mode 100644 index 0000000..34d21aa --- /dev/null +++ b/src/views/monitor/online/index.vue @@ -0,0 +1,105 @@ + + + diff --git a/src/views/redirect/index.vue b/src/views/redirect/index.vue new file mode 100644 index 0000000..99dd4f5 --- /dev/null +++ b/src/views/redirect/index.vue @@ -0,0 +1,14 @@ + + + \ No newline at end of file diff --git a/src/views/register.vue b/src/views/register.vue new file mode 100644 index 0000000..badd966 --- /dev/null +++ b/src/views/register.vue @@ -0,0 +1,220 @@ + + + + + diff --git a/src/views/stats/index.vue b/src/views/stats/index.vue new file mode 100644 index 0000000..70b7610 --- /dev/null +++ b/src/views/stats/index.vue @@ -0,0 +1,313 @@ + + + diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue new file mode 100644 index 0000000..a358b0d --- /dev/null +++ b/src/views/system/config/index.vue @@ -0,0 +1,316 @@ + + + diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue new file mode 100644 index 0000000..c82e24d --- /dev/null +++ b/src/views/system/dept/index.vue @@ -0,0 +1,283 @@ + + + diff --git a/src/views/system/dict/data.vue b/src/views/system/dict/data.vue new file mode 100644 index 0000000..4869f94 --- /dev/null +++ b/src/views/system/dict/data.vue @@ -0,0 +1,362 @@ + + + diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue new file mode 100644 index 0000000..3671b74 --- /dev/null +++ b/src/views/system/dict/index.vue @@ -0,0 +1,323 @@ + + + diff --git a/src/views/system/logininfor/index.vue b/src/views/system/logininfor/index.vue new file mode 100644 index 0000000..cf2daf6 --- /dev/null +++ b/src/views/system/logininfor/index.vue @@ -0,0 +1,229 @@ + + + diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue new file mode 100644 index 0000000..ed41531 --- /dev/null +++ b/src/views/system/menu/index.vue @@ -0,0 +1,452 @@ + + + diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue new file mode 100644 index 0000000..7bb7c11 --- /dev/null +++ b/src/views/system/notice/index.vue @@ -0,0 +1,292 @@ + + + diff --git a/src/views/system/operlog/index.vue b/src/views/system/operlog/index.vue new file mode 100644 index 0000000..b4be2c2 --- /dev/null +++ b/src/views/system/operlog/index.vue @@ -0,0 +1,311 @@ + + + diff --git a/src/views/system/post/index.vue b/src/views/system/post/index.vue new file mode 100644 index 0000000..9e760d1 --- /dev/null +++ b/src/views/system/post/index.vue @@ -0,0 +1,287 @@ + + + diff --git a/src/views/system/role/authUser.vue b/src/views/system/role/authUser.vue new file mode 100644 index 0000000..c607f63 --- /dev/null +++ b/src/views/system/role/authUser.vue @@ -0,0 +1,179 @@ + + + + diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue new file mode 100644 index 0000000..793cba6 --- /dev/null +++ b/src/views/system/role/index.vue @@ -0,0 +1,584 @@ + + + diff --git a/src/views/system/role/selectUser.vue b/src/views/system/role/selectUser.vue new file mode 100644 index 0000000..0796618 --- /dev/null +++ b/src/views/system/role/selectUser.vue @@ -0,0 +1,144 @@ + + + diff --git a/src/views/system/user/authRole.vue b/src/views/system/user/authRole.vue new file mode 100644 index 0000000..a7546aa --- /dev/null +++ b/src/views/system/user/authRole.vue @@ -0,0 +1,123 @@ + + + diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue new file mode 100644 index 0000000..1118839 --- /dev/null +++ b/src/views/system/user/index.vue @@ -0,0 +1,559 @@ + + + diff --git a/src/views/system/user/profile/index.vue b/src/views/system/user/profile/index.vue new file mode 100644 index 0000000..dfb4a66 --- /dev/null +++ b/src/views/system/user/profile/index.vue @@ -0,0 +1,94 @@ + + + diff --git a/src/views/system/user/profile/resetPwd.vue b/src/views/system/user/profile/resetPwd.vue new file mode 100644 index 0000000..73c6b18 --- /dev/null +++ b/src/views/system/user/profile/resetPwd.vue @@ -0,0 +1,59 @@ + + + diff --git a/src/views/system/user/profile/userAvatar.vue b/src/views/system/user/profile/userAvatar.vue new file mode 100644 index 0000000..4b7e140 --- /dev/null +++ b/src/views/system/user/profile/userAvatar.vue @@ -0,0 +1,180 @@ + + + + + \ No newline at end of file diff --git a/src/views/system/user/profile/userInfo.vue b/src/views/system/user/profile/userInfo.vue new file mode 100644 index 0000000..5099ffa --- /dev/null +++ b/src/views/system/user/profile/userInfo.vue @@ -0,0 +1,67 @@ + + + diff --git a/src/views/task/index.vue b/src/views/task/index.vue new file mode 100644 index 0000000..2b419c0 --- /dev/null +++ b/src/views/task/index.vue @@ -0,0 +1,335 @@ + + + diff --git a/src/views/tool/build/CodeTypeDialog.vue b/src/views/tool/build/CodeTypeDialog.vue new file mode 100644 index 0000000..de0beb7 --- /dev/null +++ b/src/views/tool/build/CodeTypeDialog.vue @@ -0,0 +1,71 @@ + + + \ No newline at end of file diff --git a/src/views/tool/build/DraggableItem.vue b/src/views/tool/build/DraggableItem.vue new file mode 100644 index 0000000..9ae2354 --- /dev/null +++ b/src/views/tool/build/DraggableItem.vue @@ -0,0 +1,68 @@ + + \ No newline at end of file diff --git a/src/views/tool/build/IconsDialog.vue b/src/views/tool/build/IconsDialog.vue new file mode 100644 index 0000000..98d9c13 --- /dev/null +++ b/src/views/tool/build/IconsDialog.vue @@ -0,0 +1,115 @@ + + + diff --git a/src/views/tool/build/RightPanel.vue b/src/views/tool/build/RightPanel.vue new file mode 100644 index 0000000..5fe80fb --- /dev/null +++ b/src/views/tool/build/RightPanel.vue @@ -0,0 +1,906 @@ + + + + + \ No newline at end of file diff --git a/src/views/tool/build/TreeNodeDialog.vue b/src/views/tool/build/TreeNodeDialog.vue new file mode 100644 index 0000000..372d3af --- /dev/null +++ b/src/views/tool/build/TreeNodeDialog.vue @@ -0,0 +1,93 @@ + + diff --git a/src/views/tool/build/index.vue b/src/views/tool/build/index.vue new file mode 100644 index 0000000..e630740 --- /dev/null +++ b/src/views/tool/build/index.vue @@ -0,0 +1,653 @@ + + + + + diff --git a/src/views/tool/gen/basicInfoForm.vue b/src/views/tool/gen/basicInfoForm.vue new file mode 100644 index 0000000..92c3ca9 --- /dev/null +++ b/src/views/tool/gen/basicInfoForm.vue @@ -0,0 +1,48 @@ + + + diff --git a/src/views/tool/gen/editTable.vue b/src/views/tool/gen/editTable.vue new file mode 100644 index 0000000..0fd9d4f --- /dev/null +++ b/src/views/tool/gen/editTable.vue @@ -0,0 +1,211 @@ + + + diff --git a/src/views/tool/gen/genInfoForm.vue b/src/views/tool/gen/genInfoForm.vue new file mode 100644 index 0000000..75046e8 --- /dev/null +++ b/src/views/tool/gen/genInfoForm.vue @@ -0,0 +1,305 @@ + + + diff --git a/src/views/tool/gen/importTable.vue b/src/views/tool/gen/importTable.vue new file mode 100644 index 0000000..b28eacb --- /dev/null +++ b/src/views/tool/gen/importTable.vue @@ -0,0 +1,126 @@ + + + diff --git a/src/views/tool/gen/index.vue b/src/views/tool/gen/index.vue new file mode 100644 index 0000000..54ce8d4 --- /dev/null +++ b/src/views/tool/gen/index.vue @@ -0,0 +1,291 @@ + + + diff --git a/src/views/usage/index.vue b/src/views/usage/index.vue new file mode 100644 index 0000000..6b849b2 --- /dev/null +++ b/src/views/usage/index.vue @@ -0,0 +1,329 @@ + + + diff --git a/storm相关.md b/storm相关.md new file mode 100644 index 0000000..15779a3 --- /dev/null +++ b/storm相关.md @@ -0,0 +1,144 @@ +# 部署流程 + +### 安装docker + +``` +# 1、yum 包更新到最新 +yum -y update +# 2、安装需要的软件包，yum-utils提供yum-config-manager功能，另外两个是devicemapper驱动依赖的 +yum install -y yum-utils device-mapper-persistent-data lvm2 --skip-broken +# 3、更新本地镜像源 +yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo +sed -i 's/download.docker.com/mirrors.aliyun.com\/docker-ce/g' /etc/yum.repos.d/docker-ce.repo +或 +yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo +# 4、安装docker，出现输入的界面都按 y +yum makecache fast +yum install -y docker-ce +或 +yum install -y docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin #开启compose功能 +# 5、查看docker版本，验证是否验证成功 +docker -v + +# 6、其他 + #启动Docker + systemctl start docker + # 停止Docker + systemctl stop docker + # 重启 + systemctl restart docker + # 设置开机自启 + systemctl enable docker + # 执行docker ps命令，如果不报错，说明安装启动成功 + docker ps +``` + +### 安装DockerCompose + +``` +1、方式一：linux通过命令下载： +很慢，直接用方式二 +2、方式二：直接将docker-compose文件上传至linux目录 +具体参考docker-compose文件夹里的readme。 +``` + +### 项目相关 + +打包项目，生成jar，运行docker文件夹下的copy.sh，一键复制jar包，最后docker文件夹上传到服务器里。 + +``` +1、构建镜像 +sudo docker-compose build + +2、启动容器 +启动所有容器 +sudo docker-compose up -d +但是容器启动有顺序要求，具体看deploy.sh +给执行权限 +chmod +x deploy.sh +修改文件格式 Unix 格式 +vim deploy.sh +:set ff=unix +:wq +按顺序执行 +./deploy.sh port +./deploy.sh base +./deploy.sh modules + +3、查看容器启动情况 +docker ps + +4、设置开机自启 +docker update --restart=always 容器名 + +5、更新项目 + + +``` + +# mysql + +### 服务器 + +账号:root + +密码:123456 + +### 本机 + +账号:root + +密码:abc123456 + +# redis + +密码:123456 + +# nacos + +账号:nacos + +密码:jsfbnacos + +# 登录后台 + +使用docker-compose批量部署 + +管理员 + +admin + +admin123 + + + +普通用户 + +user + +654321 + +# 服务器 + +服务器公网地址[113.45.36.253](http://113.45.36.253) + +数据库内网地址[192.168.0.114](http://192.168.0.114) + +账号root + +密码JuShenFengBao1704 + + + +本机虚拟机 + +账号root + +密码123456 + +# 百度地图 + +后端在com.storm.device.service.impl.DeviceServiceImpl替换apiKey + +前端在src\config\map.js里替换 + diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..adb624f --- /dev/null +++ b/vite.config.js @@ -0,0 +1,73 @@ +import { defineConfig, loadEnv } from 'vite' +import path from 'path' +import createVitePlugins from './vite/plugins' + +// https://vitejs.dev/config/ +export default defineConfig(({ mode, command }) => { + const env = loadEnv(mode, process.cwd()) + const { VITE_APP_ENV } = env + return { + // 部署生产环境和开发环境下的URL。 + // 默认情况下，vite 会假设你的应用是被部署在一个域名的根路径上 + // 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。 + base: VITE_APP_ENV === 'production' ? '/' : '/', + plugins: createVitePlugins(env, command === 'build'), + resolve: { + // https://cn.vitejs.dev/config/#resolve-alias + alias: { + // 设置路径 + '~': path.resolve(__dirname, './'), + // 设置别名 + '@': path.resolve(__dirname, './src') + }, + // https://cn.vitejs.dev/config/#resolve-extensions + extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'] + }, + // 打包配置 + build: { + // https://vite.dev/config/build-options.html + sourcemap: command === 'build' ? false : 'inline', + outDir: 'dist', + assetsDir: 'assets', + chunkSizeWarningLimit: 2000, + rollupOptions: { + output: { + chunkFileNames: 'static/js/[name]-[hash].js', + entryFileNames: 'static/js/[name]-[hash].js', + assetFileNames: 'static/[ext]/[name]-[hash].[ext]' + } + } + }, + // vite 相关配置 + server: { + port: 80, + host: true, + open: true, + proxy: { + // https://cn.vitejs.dev/config/#server-proxy + '/dev-api': { + target: 'http://localhost:8080', + changeOrigin: true, + rewrite: (p) => p.replace(/^\/dev-api/, '') + } + } + }, + //fix:error:stdin>:7356:1: warning: "@charset" must be the first rule in the file + css: { + postcss: { + plugins: [ + { + postcssPlugin: 'internal:charset-removal', + AtRule: { + charset: (atRule) => { + if (atRule.name === 'charset') { + atRule.remove() + } + } + } + } + ] + } + } + } +}) diff --git a/vite/plugins/auto-import.js b/vite/plugins/auto-import.js new file mode 100644 index 0000000..a5d3576 --- /dev/null +++ b/vite/plugins/auto-import.js @@ -0,0 +1,12 @@ +import autoImport from 'unplugin-auto-import/vite' + +export default function createAutoImport() { + return autoImport({ + imports: [ + 'vue', + 'vue-router', + 'pinia' + ], + dts: false + }) +} diff --git a/vite/plugins/compression.js b/vite/plugins/compression.js new file mode 100644 index 0000000..e90aaec --- /dev/null +++ b/vite/plugins/compression.js @@ -0,0 +1,28 @@ +import compression from 'vite-plugin-compression' + +export default function createCompression(env) { + const { VITE_BUILD_COMPRESS } = env + const plugin = [] + if (VITE_BUILD_COMPRESS) { + const compressList = VITE_BUILD_COMPRESS.split(',') + if (compressList.includes('gzip')) { + // http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件 + plugin.push( + compression({ + ext: '.gz', + deleteOriginFile: false + }) + ) + } + if (compressList.includes('brotli')) { + plugin.push( + compression({ + ext: '.br', + algorithm: 'brotliCompress', + deleteOriginFile: false + }) + ) + } + } + return plugin +} diff --git a/vite/plugins/index.js b/vite/plugins/index.js new file mode 100644 index 0000000..10e17c3 --- /dev/null +++ b/vite/plugins/index.js @@ -0,0 +1,15 @@ +import vue from '@vitejs/plugin-vue' + +import createAutoImport from './auto-import' +import createSvgIcon from './svg-icon' +import createCompression from './compression' +import createSetupExtend from './setup-extend' + +export default function createVitePlugins(viteEnv, isBuild = false) { + const vitePlugins = [vue()] + vitePlugins.push(createAutoImport()) + vitePlugins.push(createSetupExtend()) + vitePlugins.push(createSvgIcon(isBuild)) + isBuild && vitePlugins.push(...createCompression(viteEnv)) + return vitePlugins +} diff --git a/vite/plugins/setup-extend.js b/vite/plugins/setup-extend.js new file mode 100644 index 0000000..ed8342e --- /dev/null +++ b/vite/plugins/setup-extend.js @@ -0,0 +1,5 @@ +import setupExtend from 'unplugin-vue-setup-extend-plus/vite' + +export default function createSetupExtend() { + return setupExtend({}) +} diff --git a/vite/plugins/svg-icon.js b/vite/plugins/svg-icon.js new file mode 100644 index 0000000..30a4140 --- /dev/null +++ b/vite/plugins/svg-icon.js @@ -0,0 +1,10 @@ +import { createSvgIconsPlugin } from 'vite-plugin-svg-icons' +import path from 'path' + +export default function createSvgIcon(isBuild) { + return createSvgIconsPlugin({ + iconDirs: [path.resolve(process.cwd(), 'src/assets/icons/svg')], + symbolId: 'icon-[dir]-[name]', + svgoOptions: isBuild + }) +} diff --git a/报错相关命令.md b/报错相关命令.md new file mode 100644 index 0000000..a8f1095 --- /dev/null +++ b/报错相关命令.md @@ -0,0 +1,64 @@ +### 删除旧容器、镜像 + +``` +sudo docker-compose stop storm-nacos + +sudo docker-compose down storm-nacos + +sudo docker image prune -a + +docker images + +sudo docker-compose build storm-nacos + +sudo docker-compose up -d storm-nacos +``` + +### JWT密钥 + +输出 **32** + +``` +openssl rand -base64 32 + +echo -n "wczCOGn5ryZtpt+MdZxv+XxmrER3sYnhE4Mefto8lmc=" | base64 -d | wc -c +``` + + + +### 日志过滤 + +``` +docker logs -f storm-nacos | \ +grep -E 'ERROR|WARN|Caused by|auth|token|JwtTokenManager|nacos.core.auth|secret key|started successfully' + + +# 检查密钥是否被正确加载 +docker logs storm-nacos | grep 'Loading nacos auth secret key' + +# 验证启动阶段鉴权初始化 +docker logs storm-nacos | grep -E 'Init jwt token manager|AuthPluginManager' + +# 确认最终启动状态 +docker logs storm-nacos | grep 'started successfully' + +docker logs storm-nacos | grep -A 50 -B 20 'JwtTokenManager' +``` + +### 验证码字体错误 + +``` +yum install -y fontconfig freetype + +yum install -y libX11 libXext libXrender xorg-x11-fonts-Type1 xorg-x11-fonts-75dpi xorg-x11-fonts-100dpi +``` + + + + + + + +### 其他 + +nacos版本前要加v，这不是装饰，例:v2.3.0， \ No newline at end of file

RuoYi v3.6.6

基于 Vue3/Element Plus 和 Spring Boot/Spring Cloud & Alibaba 前后端分离的分布式微服务架构

请升级您的浏览器，以便我们更好的为您提供服务！

请注意：微软公司对Windows XP 及 Internet Explorer 早期版本的支持已经结束

您可以选择更先进的浏览器

主题风格设置

系统布局配置

{{ title }}

{{ title }}

+ 401错误! +

您没有访问权限！

对不起，您没有访问权限，请不要进行非法操作！您可以返回主页面

具身风暴后台管理系统

技术选型

后端技术

前端技术

{{ title }}

基本信息

角色信息

其他信息

关联信息