项目初始化
This commit is contained in:
parent
012025080d
commit
575c278572
@ -37,7 +37,7 @@ module.exports = {
|
|||||||
'@typescript-eslint/explicit-module-boundary-types': 'off',
|
'@typescript-eslint/explicit-module-boundary-types': 'off',
|
||||||
'@typescript-eslint/no-redeclare': 'error',
|
'@typescript-eslint/no-redeclare': 'error',
|
||||||
'@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
|
'@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
|
||||||
'@typescript-eslint/no-unused-vars': [2],
|
'@typescript-eslint/no-unused-vars': 'warning',
|
||||||
'vue/custom-event-name-casing': 'off',
|
'vue/custom-event-name-casing': 'off',
|
||||||
'vue/attributes-order': 'off',
|
'vue/attributes-order': 'off',
|
||||||
'vue/one-component-per-file': 'off',
|
'vue/one-component-per-file': 'off',
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
module.exports = {
|
module.exports = {
|
||||||
// 一行最多多少个字符
|
// 一行最多多少个字符
|
||||||
printWidth: 150,
|
printWidth: 100,
|
||||||
// 指定每个缩进级别的空格数
|
// 指定每个缩进级别的空格数
|
||||||
tabWidth: 2,
|
tabWidth: 2,
|
||||||
// 使用制表符而不是空格缩进行
|
// 使用制表符而不是空格缩进行
|
||||||
|
367
CHANGELOG.md
367
CHANGELOG.md
@ -1,367 +0,0 @@
|
|||||||
# <a href="https://gitee.com/lyt-top/vue-next-admin" target="_blank">vue-next-admin 更新日志</a>
|
|
||||||
|
|
||||||
🎉🎉🔥 `vue-next-admin` 基于 vue3.x 、Typescript、vite、Element plus 等,适配手机、平板、pc 的后台开源免费模板库(vue2.x 请切换 vue-prev-admin 分支)
|
|
||||||
|
|
||||||
## 2.2.0
|
|
||||||
|
|
||||||
`2022.07.10`
|
|
||||||
|
|
||||||
⚡⚡⚡ [/sec/stores/userInfo.ts](https://gitee.com/lyt-top/vue-next-admin/blob/master/src/stores/userInfo.ts) 下添加了 `getApiUserInfo` 接口模拟数据 `setTimeout` 为 3 秒
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🐞 修复 [主界面重新授权按钮点击卡死不跳转登录界面#I5C3JS](https://gitee.com/lyt-top/vue-next-admin/issues/I5C3JS),感谢[@Hero-Typ](https://gitee.com/tian_yu_peng)
|
|
||||||
- 🐞 修复 编译警告[#I5CVSB](https://gitee.com/lyt-top/vue-next-admin/issues/I5CVSB),全局替换成 `:deep(attr)`,感谢[@Linvas](https://gitee.com/linvas)。参考文档:[vue3 sfc-style](https://v3.cn.vuejs.org/api/sfc-style.html#style-scoped)。`node_modules\print-js\dist\print.js` 需 `print-js` 作者适配或去除 `package.json` 中的 `"print-js": "^1.6.0"`
|
|
||||||
- 🐞 修复 [vue-next-admin-template-js 版本前端控制路由:userInfo.js 请求用户信息接口报错,加载不到路由 可以写个定时器模拟一下接口 一样的报错#I5F1HP](https://gitee.com/lyt-top/vue-next-admin/issues/I5F1HP),感谢[@白开水](https://gitee.com/libin951223)
|
|
||||||
|
|
||||||
## 2.1.1
|
|
||||||
|
|
||||||
`2022.05.27`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 深色模式下,`<el-button text></el-button>` 时,`:active` 样式
|
|
||||||
- 🎯 优化 [页面缓存在刷新之后失效 #I58U75](https://gitee.com/lyt-top/vue-next-admin/issues/I58U75)),感谢[@ls0428](https://gitee.com/ls0428)
|
|
||||||
- 🎯 优化 [SvgIcon 对下载的 Svg 图像设置颜色无效 #I59ND0](https://gitee.com/lyt-top/vue-next-admin/issues/I59ND0)),感谢[@elus_z](https://gitee.com/elus_z)
|
|
||||||
- 🎯 优化 `/src/utils/toolsValidate.ts` 工具类
|
|
||||||
- 🐞 修复 [布局切换,TagsView 显示的 tab 会多一个出来 #I58WGM](https://gitee.com/lyt-top/vue-next-admin/issues/I58WGM),感谢[@lg_boy](https://gitee.com/lg_boy)
|
|
||||||
- 🐞 修复 [如果设置顶部面包屑导航开启图标 isBreadcrumbIcon=true 后,样式有点问题 如果不开启就是正常的 #I58VB8](https://gitee.com/lyt-top/vue-next-admin/issues/I58VB8)
|
|
||||||
- 🐞 修复 地址栏路由地址输入错误时,返回首页后,再次输入路由地址错误时,不跳转 404 问题
|
|
||||||
- 🐞 修复 [2.1.0 版本的图标选择组件多次点击后功能失效 #I590TH](https://gitee.com/lyt-top/vue-next-admin/issues/I590TH),感谢[@quber](https://gitee.com/quber)
|
|
||||||
|
|
||||||
## 2.1.0
|
|
||||||
|
|
||||||
`2022.04.18`
|
|
||||||
|
|
||||||
⚡⚡⚡ 此版本为破环性更新,优化内容如下:(谨慎更新!谨慎更新!!谨慎更新!!!)。因为 `vuex` 替换成 `pinia`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 部分界面图片不显示问题(更换 gitee 在线图片地址源)
|
|
||||||
- 🎯 优化 各界面方法引入与逻辑之间添加一行空行,方便区分内容
|
|
||||||
- 🎯 优化 图标选择器 [#I4YAHB](https://gitee.com/lyt-top/vue-next-admin/issues/I4YAHB),感谢[@真有你的](https://gitee.com/sunliusen)
|
|
||||||
- 🎯 优化 图标选择器 icon type 类型为 all 时,类型 ali、ele、awe 回显问题
|
|
||||||
- 🎯 优化 去掉开发环境 i18n 控制台警告,页面代码:[i18n/index.ts](https://gitee.com/lyt-top/vue-next-admin/blob/master/src/i18n/index.ts)
|
|
||||||
- 🎯 优化 `NextLoading.start()` 方法,防止第一次进入界面时出现短暂空白
|
|
||||||
- 🎯 优化 地址栏有参数退出登录,再次登录不跳之前界面问题 `src/layout/navBars/breadcrumb/user.vue`
|
|
||||||
- 🎯 优化 `SvgIcon` 组件,防止 `开启 Tagsview 图标` 时,`tagsView 右键菜单关闭` 报错问题,工作流不可连线、全屏时关闭按钮消失问题
|
|
||||||
- 🎯 优化 [如果 url 中有中文等特殊字符,第一次切换该 tab 时 keep-alive 失效#I55JS7](https://gitee.com/lyt-top/vue-next-admin/issues/I55JS7),感谢[yuyong1566](https://gitee.com/yuyong1566)
|
|
||||||
- 🎯 优化 [wangEditor](https://www.wangeditor.com/) 更新到 v5,[vue3 版本线上示例中 wangeditor 富文本编辑器 demo 实例,无法换行#I5565B](https://gitee.com/lyt-top/vue-next-admin/issues/I5565B),感谢@[jenchih](https://gitee.com/jenchih)
|
|
||||||
- 🎯 优化 [在关闭 tagview 时,高度刷新时会会变化,出现滚动条](https://gitee.com/lyt-top/vue-next-admin/issues/I55FHM),感谢[张松](https://gitee.com/zs310071113)
|
|
||||||
- 🎯 优化 [路由参数](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)演示
|
|
||||||
- 🎉 新增 [vuex](https://vuex.vuejs.org/) 替换成 [pinia](https://pinia.vuejs.org/getting-started.html)
|
|
||||||
- 🎉 新增 tagsView 支持自定义 tagsView 名称(文章详情时有用),前往体验:[路由参数/普通路由](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)。新增 tagsView 支持自定义名称国际化,感谢[@q7but](https://gitee.com/q7but)、[!22 add 添加自定义 tagVIewName 拓展,支持国际化](https://gitee.com/lyt-top/vue-next-admin/pulls/22/files)、感谢[@tony_tong_xin](https://gitee.com/tony_tong_xin)
|
|
||||||
- 🐞 修复 适配 `"element-plus": "^2.1.9",2.2.0` 版本
|
|
||||||
- 🐞 修复 [导航栏横向布局后,一级菜单显示问题#I4Z3M3](https://gitee.com/lyt-top/vue-next-admin/issues/I4Z3M3)
|
|
||||||
- 🐞 修复 横向布局三级及以上导航菜单高亮、导航高度不统一问题
|
|
||||||
- 🐞 修复 分栏模式下,选中的菜单是 primary 样式,鼠标移入字也变成 primary 色了,感谢群友@孤夜-流殇
|
|
||||||
- 🐞 修复 [vuex 里面改了颜色 但是不生效 #I4WFMA](https://gitee.com/lyt-top/vue-next-admin/issues/I4WFMA)
|
|
||||||
- 🐞 修复 全局主题 primary 清空颜色后报错,[#I4X0LG](https://gitee.com/lyt-top/vue-next-admin/issues/I4X0LG),感谢[面向 BUG 编程](https://gitee.com/fhtfy)
|
|
||||||
- 🐞 修复 [.eslintrc.js 文件 rules 标签名错误 #I53IPK](https://gitee.com/lyt-top/vue-next-admin/issues/I53IPK),感谢[yuyong1566](https://gitee.com/yuyong1566)
|
|
||||||
- 🐞 修复 `开启 Tagsview 图标` 时,`tagsView 右键菜单关闭` 报错问题
|
|
||||||
- 🐞 修复 `router.push` 路径找不到时报错问题,`404、401 界面` 已移入到 `main` 主布局里(之前全屏)
|
|
||||||
- 🐞 修复 [全局修改组件大小失效了](https://gitee.com/lyt-top/vue-next-admin/issues/I551RP),感谢[lg_boy](https://gitee.com/lg_boy)
|
|
||||||
- 🐞 修复 [修改一下配置时,需要每次都清理 `window.localStorage` 浏览器永久缓存,配置才会生效,问题解决#I567R1](https://gitee.com/lyt-top/vue-next-admin/issues/I567R1),感谢[@lanbao123](https://gitee.com/lanbao123)
|
|
||||||
- 🐞 修复 [标记为需要缓存的 tab 页后,再次从左侧菜单打开,还是显示被缓存的页面内容#I4UY3G](https://gitee.com/lyt-top/vue-next-admin/issues/I4UY3G),感谢@axcc1234、特别感谢群友@华仔
|
|
||||||
- 🌈 重构 路由(`/src/router/index.ts`)解决 No match found for location with path "xxx"(前端控制,后端控制未解决) 问题
|
|
||||||
|
|
||||||
## 2.0.2
|
|
||||||
|
|
||||||
`2022.03.04`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 Alert 提示添加边框
|
|
||||||
- 🎯 优化 功能 / 数字滚动 演示界面
|
|
||||||
- 🐞 修复 全局主题按钮颜色 :active 问题
|
|
||||||
- 🐞 修复 Dropdown 下拉菜单样式问题
|
|
||||||
- 🐞 修复 SvgIcon 图标组件动态切换时报警告问题,[SvgIcon 改变 name 时可能导致图像不显示](https://gitee.com/lyt-top/vue-next-admin/issues/I4VGE0),感谢@axcc1234
|
|
||||||
|
|
||||||
## 2.0.1
|
|
||||||
|
|
||||||
`2022.02.25`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 svgIcon 图标组件
|
|
||||||
- 🎯 优化 vite.config.ts 打包,感谢群友@YourObjec
|
|
||||||
- 🐞 修复 tagViews 开启图标不显示问题(风格 5),感谢群友@坏人
|
|
||||||
- 🐞 修复 [Element Plus 1.2.0-beta.6 以后的版本 el-table 在移动端无法左右滑动](https://gitee.com/lyt-top/vue-next-admin/issues/I4UPTP),感谢@YGDada
|
|
||||||
|
|
||||||
## 2.0.0
|
|
||||||
|
|
||||||
`2022.02.21`
|
|
||||||
|
|
||||||
⚡⚡⚡ 此版本为破环性更新,优化内容如下:(谨慎更新!谨慎更新!!谨慎更新!!!)。演示界面建议直接覆盖文件。如需使用之前版本,请前往[gitee 发行版](https://gitee.com/lyt-top/vue-next-admin/releases) 进行对应版本下载。基础版会基于 `master` 分支进行修改
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🌟 更新 登录页、首页
|
|
||||||
- 💔 移除 vue-web-screen-shot
|
|
||||||
- 💔 移除 城市多级联动,完整 json 数据请去 [vue-next-admin-images/menu](https://gitee.com/lyt-top/vue-next-admin-images/tree/master/menu) 仓库查看
|
|
||||||
- 💔 移除 功能/echartsTree 树图
|
|
||||||
- 💔 移除 其它设置/Tagsview 风格 2、Tagsview 风格 3
|
|
||||||
- 💔 移除 功能/验证器
|
|
||||||
- 🚧 调整 src/api 编写方式
|
|
||||||
- 🚧 调整 自定义封装公用组件演示,更好的维护
|
|
||||||
- 🎉 新增 Volar 支持,vs code 配置参考 [Vue Language Features (Volar)](https://lyt-top.gitee.io/vue-next-admin-doc-preview/home/vscode/)
|
|
||||||
- 🎉 新增 `SvgIcon` 支持本地 svg 图标使用
|
|
||||||
- 🎉 新增 表单表格验证演示
|
|
||||||
- 🎯 优化 全局主题(移除 success、info、warning、danger)
|
|
||||||
- 🎯 优化 工作流(开源)
|
|
||||||
- 🎯 优化 element plus svg 图标,`elementXXX` 改成 `ele-XXX`
|
|
||||||
- 🌈 重构 深色模式
|
|
||||||
- 🌹 合并 [处理 parent 的 h100 由于外层有 min-height 导致失效的问题](https://gitee.com/lyt-top/vue-next-admin/pulls/20),感谢@MaxNull、@21030442-mao
|
|
||||||
- 🐞 修复 element plus 升级 `^1.3.0-beta.5` 后 组件 size 大小问题(大改:涉及布局、演示界面)
|
|
||||||
- 🐞 修复 vs code 使用 Vue Language Features (Volar) 插件 代码报红问题(可以把公用的 ts 类型定义封装起来公用)
|
|
||||||
|
|
||||||
## 1.2.2
|
|
||||||
|
|
||||||
`2021.12.21`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 iframes 滚动条问题
|
|
||||||
- 🎯 优化 部署后每次都要强制刷新清浏览器缓存问题
|
|
||||||
- 🎉 新增 工具类百分比验证演示
|
|
||||||
- 🐞 修复 [tag-view 标签右键会超出浏览器 #I4KN78](https://gitee.com/lyt-top/vue-next-admin/issues/I4KN78)
|
|
||||||
|
|
||||||
## 1.2.1
|
|
||||||
|
|
||||||
`2021.12.12`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 cropper 裁剪时卡顿问题 [#I4M2VQ](https://gitee.com/lyt-top/vue-next-admin/issues/I4M2VQ)
|
|
||||||
- 🎯 优化 Wangeditor 富文本编辑器的问题 [#I4LPC1](https://gitee.com/lyt-top/vue-next-admin/issues/I4LPC1)、[#I4LM7I](https://gitee.com/lyt-top/vue-next-admin/issues/I4LM7I)
|
|
||||||
- 🐞 修复 浏览器标题问题
|
|
||||||
- 🐞 修复 element plus svg 图标引入
|
|
||||||
- 🐞 修复 工作流不可以拖线连接问题
|
|
||||||
|
|
||||||
## 1.2.0
|
|
||||||
|
|
||||||
`2021.11.28`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 深色模式
|
|
||||||
- 🎯 优化 `/@/utils` 文件夹,合并删除单一内容
|
|
||||||
- 🎯 优化 系统设置:菜单管理(新增、修改)、角色管理(新增菜单权限)、用户管理、部门管理、字典管理
|
|
||||||
- 🎯 优化 登录界面逻辑、权限管理逻辑
|
|
||||||
- 🎯 优化 同步 [vue-next-admin-images](https://gitee.com/lyt-top/vue-next-admin-images/tree/master/menu) 后端控制菜单模拟数据
|
|
||||||
- 🎉 新增 适配 Font Icon 向 SVG Icon 迁移(改动大,"element-plus": "^1.2.0-beta.4" 谨慎更新)
|
|
||||||
- 🐞 修复 热更新问题,感谢@甜蜜蜜
|
|
||||||
- 🐞 修复 页面/element 字体图标演示
|
|
||||||
- 🐞 修复 功能/图标选择器演示,新增高级功能 [issues #I4GJXQ](https://gitee.com/lyt-top/vue-next-admin/issues/I4GJXQ)
|
|
||||||
|
|
||||||
## 1.1.2
|
|
||||||
|
|
||||||
`2021.10.17`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🐞 修复 开启全屏时,刷新界面被还原成未全屏的状态
|
|
||||||
- 🎯 优化 tagsView 右键菜单关闭逻辑
|
|
||||||
- 🎯 优化 wangeditor 富文本编辑器(增加双向绑定)
|
|
||||||
- 🎉 新增 工作流(暂不开源)
|
|
||||||
- 🎉 新增 基础版 ts(不带国际化),切换 `vue-next-admin-template` 分支
|
|
||||||
|
|
||||||
## 1.1.1
|
|
||||||
|
|
||||||
`2021.09.25`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本(`"element-plus": "^1.1.0-beta.13"` 版本运行错误,`^1.1.0-beta.16`修复横向菜单卡死问题)
|
|
||||||
- 🐞 修复 Dialog 弹窗位置错误、Drawer 抽屉内边距、el-menu 菜单收起时背景色问题
|
|
||||||
- 🎯 优化 锁屏界面自动锁屏(s/秒)必须设置至少 1 秒
|
|
||||||
- 🎉 新增 分栏布局,鼠标移入当前项时,显示当前项菜单内容
|
|
||||||
- 🎉 新增 工作流(未完成)
|
|
||||||
|
|
||||||
## 1.1.0
|
|
||||||
|
|
||||||
`2021.09.10`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 小屏模式下登录页二维码遮挡标题问题
|
|
||||||
- 🎉 新增 图片验证器
|
|
||||||
- 🎉 新增 动态复杂表单
|
|
||||||
- 🎉 新增 工作流(未完成)
|
|
||||||
- 🎉 新增 深色主题(伪深色,样式变动大,谨慎更新)
|
|
||||||
|
|
||||||
## 1.0.18
|
|
||||||
|
|
||||||
`2021.08.29`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 权限组件去掉顶级 div(`/src/components/auth`)
|
|
||||||
- 🎉 新增 布局配置添加恢复默认按钮
|
|
||||||
- 🐞 修复 升级 <a href="https://element-plus.gitee.io/#/zh-CN/component/changelog" target="_blank">element plus 1.1.0-beta.7</a>后项目无法启动、el-menu 菜单
|
|
||||||
- 🐞 修复 表格固定列时的层级、设置了相对定位时,遮挡左侧导航菜单问题
|
|
||||||
|
|
||||||
## 1.0.17
|
|
||||||
|
|
||||||
`2021.08.22`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 去除设置布局切换,重置主题样式(initSetLayoutChange),切换布局需手动设置样式,设置的样式自动同步各布局
|
|
||||||
- 🎯 优化 Dropdown 下拉菜单用户账号靠边时换行问题
|
|
||||||
- 🎯 优化 左侧导航菜单,共用菜单树,防止 `布局配置` 设置 `菜单 / 顶栏` 时,样式丢失等问题
|
|
||||||
- 🐞 修复 固定 header 后没有回到顶部的 bug,拉取项目后运行不起来的 bug。<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/14" target="_blank">!14</a>,感谢<a href="https://gitee.com/wjs0509" target="_blank">@wjs0509</a>
|
|
||||||
- 🐞 修复 tagView 右键全屏后,浏览器窗口大小发生任何变化都会导致左边菜单显示出来,并且可点击打开对应页面。<a href="https://gitee.com/lyt-top/vue-next-admin/issues/I46E6T" target="_blank">I46E6T</a>
|
|
||||||
- 🐞 修复 默认设置 `菜单 / 顶栏` 样式不生效问题(/@/src/store/modules/themeConfig.ts)
|
|
||||||
|
|
||||||
## 1.0.16
|
|
||||||
|
|
||||||
`2021.08.14`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 菜单高亮(详情且详情设置了 meta.isHide 时,顶级菜单高亮),感谢群友@YourObject
|
|
||||||
- 🎯 优化 详情路径写法:如父级(/pages/filtering),那么详情为(/pages/filtering/details?id=1)。这样写可实现(详情时,父级菜单高亮),否则写成(/pages/filteringDetails?id=1)顶级菜单将不会高亮。可参考:`页面/过滤筛选组件`,点击当前图片进行测试
|
|
||||||
- 🎯 优化 tagsView 右键菜单全屏时,打开的界面高度问题
|
|
||||||
- 🎯 优化 图表批量 resize 问题
|
|
||||||
- 🐞 修复 菜单收起时(设置全局主题:primary 且有二级菜单时),文字高亮颜色不对
|
|
||||||
- 🐞 修复 国际化 <a href="https://gitee.com/lyt-top/vue-next-admin/issues/I43NPE" target="_blank">#I43NPE</a>。可参考:`页面/过滤筛选组件`,点击顶部语言切换,进行底部分页国际化查看
|
|
||||||
|
|
||||||
## 1.0.15
|
|
||||||
|
|
||||||
`2021.08.06`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 tagsView 右键菜单点击时的字段名(id 已修改成 contextMenuClickId)与路由中返回的 id 名冲突问题,感谢群友@伯牙已遇钟子期
|
|
||||||
- 🎉 新增 多个 form 表单验证界面演示
|
|
||||||
|
|
||||||
## 1.0.14
|
|
||||||
|
|
||||||
`2021.07.29`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本(vue、vuex、vue-router),出现问题,请手动降级。版本查看:<a href="https://www.npmjs.com/" target="_blank">vnpm</a>
|
|
||||||
- 🎯 优化 数据可视化图表演示加载卡顿问题、优化有图表的演示界面
|
|
||||||
- 🎯 优化 路由参数演示界面
|
|
||||||
- 🎯 优化 tagsView 操作演示界面,由于存在相同路由多标签,必须要传全部参数值(query 或者 params)
|
|
||||||
- 🎉 新增 开启 TagsView 共用,开启时:(多个路由菜单共用一个详情组件(参数为后点击的覆盖前面点击的),tagsView 中只会出现一个(不支持同时出现多个 tagsView 标签))。关闭时:(多个路由菜单共用一个详情组件,参数不同,会同时出现多个 tagsView 标签)
|
|
||||||
- 🐞 修复 tagsView 共用(单标签)时,右键菜单功能点击,参数不对的问题(第 2n+个参数未覆盖第一个参数值)
|
|
||||||
- 🐞 修复 多 tagsView 标签(参数不同)、单个 tagsView 标签公用(参数不同)所带来的刷新功能、横向自动滚动等问题
|
|
||||||
- 🐞 修复 处理全屏若干问题,<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/12" target="_blank">pr!12</a>,感谢群友@另一个前端
|
|
||||||
|
|
||||||
## 1.0.13
|
|
||||||
|
|
||||||
`2021.07.25`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎉 新增 数据可视化演示界面(/visualizingDemo1、/visualizingDemo2)
|
|
||||||
- 🎉 新增 登录页扫码登录
|
|
||||||
|
|
||||||
## 1.0.12
|
|
||||||
|
|
||||||
`2021.07.16`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎉 新增 数据可视化演示空界面(待完善)
|
|
||||||
- 🎯 优化 tagsView 动态路由(xxx/:id/:name)时的右键菜单刷新、关闭其它时参数丢失问题(2021.07.15 优化)
|
|
||||||
- 🐞 修复 路由带参数时,复制路径到登录页,跳转后参数消失的问题
|
|
||||||
- 🐞 修复 设置多个外链,点击后,页面内容停留在上一个内容(内容未改变)、国际化处理、打开新窗口 sessionStorage 共享等
|
|
||||||
|
|
||||||
## 1.0.11
|
|
||||||
|
|
||||||
`2021.07.14`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎉 新增 路由参数、图片懒加载界面演示
|
|
||||||
- ⚠️ 警告 Form 表单 `binding value must be a string or number`,解决:加上 `label-position="top"` 不报警告(等待官方修复)
|
|
||||||
- 🎯 优化 锁屏界面动画效果、首页图表显示
|
|
||||||
- 🎯 优化 tagsView 右键菜单 `关闭` 功能逻辑
|
|
||||||
- 🐞 修复 开启 TagsView 拖拽报错及小于 `1000px` 时自动设置禁止拖拽(<a href="https://gitee.com/lyt-top/vue-next-admin/issues/I3ZRRI" target="_blank">#I3ZRRI</a>)
|
|
||||||
- 🐞 修复 `iframe 内嵌、外链` 高度问题,使用 computed 进行计算
|
|
||||||
- 🐞 修复 默认布局开启 `侧边栏 Logo` 与关闭 `菜单水平折叠`,切换到横向布局时,菜单看不见的问题
|
|
||||||
- 🐞 修复 切换不同布局时,再去开启 `经典布局分割菜单` 功能不生效问题
|
|
||||||
- 🐞 修复 浏览器窗口标题中/英文切换不实时生效的问题
|
|
||||||
- 🐞 修复 切换布局时,某些功能不可以使用。部分界面不需要取消事件监听(proxy.mittBus.off('xxx'))
|
|
||||||
- 🐞 修复 动态路由带参数,router-link 跳转问题(<a href="hhttps://gitee.com/lyt-top/vue-next-admin/issues/I3YX6G" target="_blank">#I3YX6G</a>)
|
|
||||||
- 🐞 修复 横向菜单有二级菜单时,点击子级菜单不高亮问题
|
|
||||||
- 🐞 修复 功能 tagsView 操作演示不生效
|
|
||||||
|
|
||||||
## 1.0.10
|
|
||||||
|
|
||||||
`2021.07.07`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本(字体图标无问题)
|
|
||||||
- 🎯 优化 内嵌 iframe、外链,解决 tagsView 刷新问题
|
|
||||||
|
|
||||||
## 1.0.9
|
|
||||||
|
|
||||||
`2021.07.02`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎯 优化 图标选择器设置宽度、v-model 等问题
|
|
||||||
- 🎯 优化 滚动通知栏在手机上的体验
|
|
||||||
- 🎯 优化 系统管理/新增菜单(编辑菜单),使用 `图标选择器` 进行模拟
|
|
||||||
- 🎯 优化 字体图标(自动载入) 逻辑
|
|
||||||
- 🐞 修复 screenfull 全屏时,按键盘 esc 键图标不改变问题,感谢群友@伯牙已遇钟子期
|
|
||||||
|
|
||||||
## 1.0.8
|
|
||||||
|
|
||||||
`2021.06.29`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎉 新增 表单中英文切换演示
|
|
||||||
- 🎯 优化 登录页查看密码 icon 图标
|
|
||||||
- 🎯 优化 图标选择器
|
|
||||||
- 🎯 优化 拖动指令
|
|
||||||
- 🐞 修复 form 表单在页面小于 576px 时的排版问题
|
|
||||||
|
|
||||||
## 1.0.7
|
|
||||||
|
|
||||||
`2021.06.24`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🎉 新增 拖动指令及其演示界面
|
|
||||||
- 🎯 优化 锁屏界面,解锁提示
|
|
||||||
- 🎯 优化 登录页在手机上显示的效果
|
|
||||||
|
|
||||||
## 1.0.6
|
|
||||||
|
|
||||||
`2021.06.23`
|
|
||||||
|
|
||||||
- 🎯 优化 去掉内嵌 iframe 内边距(padding)
|
|
||||||
- 🎯 优化 城市多级联动组件
|
|
||||||
- 🎯 优化 Tree 树形控件改成表格组件
|
|
||||||
- 🐞 修复 Cascader 级联选择器高度问题
|
|
||||||
|
|
||||||
## 1.0.5
|
|
||||||
|
|
||||||
`2021.06.22`
|
|
||||||
|
|
||||||
- 🌟 更新 vite 降级为@vite2.3.7,降级方法 `cnpm install vite@2.3.7`,防止 element plus 字体图标消失
|
|
||||||
- 🐞 修复 开启后端控制路由(isRequestRoutes = true)时,内嵌 iframe、外链不可使用的问题
|
|
||||||
|
|
||||||
## 1.0.4
|
|
||||||
|
|
||||||
`2021.06.19`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本("vite": "^2.3.7")热更新无问题
|
|
||||||
- 🎉 新增 深克隆工具,方便开发,感谢<a href="https://gitee.com/kangert" target="_blank">@kangert</a>(<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/6" target="_blank">#6</a>)
|
|
||||||
- 🎯 优化 vuex 模块自动导入。感谢<a href="https://gitee.com/kangert" target="_blank">@kangert</a>(<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/4" target="_blank">#4</a>),感谢群友@web 小学生-第五君
|
|
||||||
- 🎯 优化 类型定义提高编码体验,修复不能将类型“string | undefined”分配给类型“string”的问题。感谢<a href="https://gitee.com/kangert" target="_blank">@kangert</a>(<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/5" target="_blank">#5</a>)
|
|
||||||
- 🎯 优化 `layout` 文件夹移动到与 `views` 文件夹同级(改动较大,`/@/views/layout` 变成 `/@/layout`)
|
|
||||||
- 🎯 优化 页面有 `console.log` 时 `eslint` 不生效问题
|
|
||||||
- 🎯 优化 页面、ts 中 `any` 类型问题(改动较大)
|
|
||||||
- 🎯 优化 登录页在手机上显示的效果
|
|
||||||
- 🎯 优化 多行注释信息,鼠标放到方法名即可查看,更加直观的知道方法参数等。引入方法时需去掉以 `.ts` 结尾的后缀(改动较大)
|
|
||||||
- 🎯 优化 移除 `utils/storage.ts` 下的旧写法(改动较大)
|
|
||||||
- 🎯 优化 拆分 `router` 下内容,路由、前端、后端控制分开写,方便理解
|
|
||||||
- 🐞 修复 鼠标移入顶部用户信息栏 `开/关全屏` 文字反向问题
|
|
||||||
- 🐞 修复 热更新时,NextLoading(界面 loading) 不消失问题 `window.nextLoading === undefined`
|
|
||||||
- 🐞 修复 vuex 中不可以使用 `/@/api/xxx` 下的接口调用问题
|
|
||||||
|
|
||||||
## 1.0.3
|
|
||||||
|
|
||||||
`2021.06.02`
|
|
||||||
|
|
||||||
- ❄️ 删除 G6 思维导图界面
|
|
||||||
- 🌟 更新 手动更新 vue、vue-router、vuex 到最近最多人使用的版本,出现不可预测的问题请降低版本。版本查看:<a href="https://www.npmjs.com/package/vue" target="_blank">vue 版本查看</a>
|
|
||||||
- 🐞 修复 开启后端控制路由 `isRequestRoutes` 在非首页刷新页面后,回到首页的问题,感谢群友@伯牙已遇钟子期
|
|
||||||
|
|
||||||
## 1.0.2
|
|
||||||
|
|
||||||
`2021.06.01`
|
|
||||||
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🐞 修复 菜单搜索中文不可以搜索的问题,感谢群友@逍遥天意
|
|
||||||
|
|
||||||
## 1.0.1
|
|
||||||
|
|
||||||
`2021.05.31`
|
|
||||||
|
|
||||||
- 🎉 新增 更新日志文件 `CHANGELOG.md`,以后每次更新都会在这里显示对应内容
|
|
||||||
- 🌟 更新 依赖更新最新版本
|
|
||||||
- 🐞 修复 分栏、经典布局路由设置 `meta.isHide` 为 `true` 时报错问题,感谢群友@29、@芭芭拉
|
|
||||||
- 🐞 修复 经典布局点击 `tagsView` 左侧菜单数据不变问题
|
|
21
LICENSE
21
LICENSE
@ -1,21 +0,0 @@
|
|||||||
MIT License
|
|
||||||
|
|
||||||
Copyright (c) 2021 lyt-Top
|
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
|
||||||
in the Software without restriction, including without limitation the rights
|
|
||||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
||||||
copies of the Software, and to permit persons to whom the Software is
|
|
||||||
furnished to do so, subject to the following conditions:
|
|
||||||
|
|
||||||
The above copyright notice and this permission notice shall be included in all
|
|
||||||
copies or substantial portions of the Software.
|
|
||||||
|
|
||||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
||||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
||||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
||||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
||||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
||||||
SOFTWARE.
|
|
57
README.md
57
README.md
@ -1,57 +0,0 @@
|
|||||||
<div align="center">
|
|
||||||
<img src="https://yxh-1301841944.cos.ap-chongqing.myqcloud.com/gfast/2022-04-19/gfastlogo.png">
|
|
||||||
<p align="center">
|
|
||||||
<a href="https://v3.vuejs.org/" target="_blank">
|
|
||||||
<img src="https://img.shields.io/badge/vue.js-vue3.x-green" alt="vue">
|
|
||||||
</a>
|
|
||||||
<a href="https://element-plus.gitee.io/#/zh-CN/component/changelog" target="_blank">
|
|
||||||
<img src="https://img.shields.io/badge/element--plus-%3E1.0.0-blue" alt="element plus">
|
|
||||||
</a>
|
|
||||||
<a href="https://www.tslang.cn/" target="_blank">
|
|
||||||
<img src="https://img.shields.io/badge/typescript-%3E4.0.0-blue" alt="typescript">
|
|
||||||
</a>
|
|
||||||
<a href="https://vitejs.dev/" target="_blank">
|
|
||||||
<img src="https://img.shields.io/badge/vite-%3E2.0.0-yellow" alt="vite">
|
|
||||||
</a>
|
|
||||||
<a href="https://gitee.com/lyt-top/vue-next-admin/blob/master/LICENSE" target="_blank">
|
|
||||||
<img src="https://img.shields.io/badge/license-MIT-success" alt="license">
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
<p> </p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
#### 🌈 介绍
|
|
||||||
|
|
||||||
基于 vue3.x + CompositionAPI + typescript + vite + element plus + vue-router-next + next.vuex,适配手机、平板、pc 的后台开源免费模板,希望减少工作量,帮助大家实现快速开发。
|
|
||||||
|
|
||||||
#### 🚧 安装 cnpm、yarn
|
|
||||||
|
|
||||||
- 复制代码(桌面 cmd 运行) `npm install -g cnpm --registry=https://registry.npm.taobao.org`
|
|
||||||
- 复制代码(桌面 cmd 运行) `npm install -g yarn`
|
|
||||||
|
|
||||||
#### 🏭 环境支持
|
|
||||||
|
|
||||||
| Edge | last 2 versions | last 2 versions | last 2 versions |
|
|
||||||
| ------------------------------------------------------------------------ | --------------------------------------------------------------------------------- | ------------------------------------------------------------------------------ | ------------------------------------------------------------------------------ |
|
|
||||||
|  |  |  |  |
|
|
||||||
|
|
||||||
> 由于 Vue3 不再支持 IE11,故而 ElementPlus 也不支持 IE11 及之前版本。
|
|
||||||
#### ⚡ 使用说明
|
|
||||||
|
|
||||||
建议使用 cnpm,因为 yarn 有时会报错。<a href="http://nodejs.cn/" target="_blank">node 版本[v16.x ~ v20.x)</a>
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# 克隆项目
|
|
||||||
git clone -b v3.2 https://gitee.com/tiger1103/gfast-ui.git
|
|
||||||
# 进入项目
|
|
||||||
cd gfast-ui
|
|
||||||
# 安装依赖
|
|
||||||
npm install --registry=https://registry.npmmirror.com
|
|
||||||
# 运行项目
|
|
||||||
npm run dev
|
|
||||||
# 打包发布
|
|
||||||
npm run build
|
|
||||||
```
|
|
||||||
## ❤特别鸣谢
|
|
||||||
|
|
||||||
* 感谢[VUE-NEXT-ADMIN](https://github.com/lyt-Top/vue-next-admin)
|
|
1500
package-lock.json
generated
1500
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -14,6 +14,7 @@
|
|||||||
"@codemirror/lang-javascript": "^6.1.1",
|
"@codemirror/lang-javascript": "^6.1.1",
|
||||||
"@codemirror/theme-one-dark": "^6.1.0",
|
"@codemirror/theme-one-dark": "^6.1.0",
|
||||||
"@element-plus/icons-vue": "^2.3.1",
|
"@element-plus/icons-vue": "^2.3.1",
|
||||||
|
"@vue/reactivity": "^3.5.18",
|
||||||
"axios": "1.8.2",
|
"axios": "1.8.2",
|
||||||
"codemirror": "^6.0.1",
|
"codemirror": "^6.0.1",
|
||||||
"countup.js": "^2.8.0",
|
"countup.js": "^2.8.0",
|
||||||
@ -46,6 +47,7 @@
|
|||||||
"vue-ueditor-wrap": "^3.0.8"
|
"vue-ueditor-wrap": "^3.0.8"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@types/js-cookie": "^3.0.6",
|
||||||
"@types/node": "^20.11.28",
|
"@types/node": "^20.11.28",
|
||||||
"@types/nprogress": "^0.2.3",
|
"@types/nprogress": "^0.2.3",
|
||||||
"@types/sortablejs": "^1.15.8",
|
"@types/sortablejs": "^1.15.8",
|
||||||
@ -61,7 +63,7 @@
|
|||||||
"sass-loader": "^16.0.3",
|
"sass-loader": "^16.0.3",
|
||||||
"typescript": "^5.4.2",
|
"typescript": "^5.4.2",
|
||||||
"vite": "6.3.4",
|
"vite": "6.3.4",
|
||||||
"vite-plugin-cdn-import": "^0.3.5",
|
"vite-plugin-cdn-import": "^1.0.1",
|
||||||
"vite-plugin-compression": "^0.5.1",
|
"vite-plugin-compression": "^0.5.1",
|
||||||
"vite-plugin-vue-setup-extend-plus": "^0.1.0",
|
"vite-plugin-vue-setup-extend-plus": "^0.1.0",
|
||||||
"vue-eslint-parser": "^9.4.1"
|
"vue-eslint-parser": "^9.4.1"
|
||||||
|
3516
pnpm-lock.yaml
generated
Normal file
3516
pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load Diff
4
pnpm-workspace.yaml
Normal file
4
pnpm-workspace.yaml
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
onlyBuiltDependencies:
|
||||||
|
- '@parcel/watcher'
|
||||||
|
- esbuild
|
||||||
|
- vue-demi
|
163
src/components/dynamicpage/ProTable/index.vue
Normal file
163
src/components/dynamicpage/ProTable/index.vue
Normal file
@ -0,0 +1,163 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-table
|
||||||
|
ref="tableRef"
|
||||||
|
:data="data"
|
||||||
|
:row-key="rowKey"
|
||||||
|
:border="border"
|
||||||
|
:stripe="stripe"
|
||||||
|
:loading="loading"
|
||||||
|
:height="tableHeight"
|
||||||
|
:size="size"
|
||||||
|
:highlight-current-row="highlightCurrentRow"
|
||||||
|
@row-dblclick="onRowDblClick"
|
||||||
|
@selection-change="onSelectionChange"
|
||||||
|
@sort-change="onSortChange"
|
||||||
|
v-bind="tableProps"
|
||||||
|
>
|
||||||
|
<!-- 选择框 -->
|
||||||
|
<el-table-column v-if="showSelection" type="selection" width="55" align="center" />
|
||||||
|
|
||||||
|
<!-- 序号 -->
|
||||||
|
<el-table-column v-if="showIndex" type="index" width="55" align="center" label="#" />
|
||||||
|
|
||||||
|
<template v-for="col in columns" :key="col.prop">
|
||||||
|
<!-- <el-table-column
|
||||||
|
v-if="col.isFormater"
|
||||||
|
:prop="col.prop"
|
||||||
|
:label="col.label"
|
||||||
|
:width="col.width"
|
||||||
|
:min-width="col.minWidth"
|
||||||
|
:align="col.align || 'center'"
|
||||||
|
:sortable="col.sortable || false"
|
||||||
|
:fixed="col.fixed || false"
|
||||||
|
:show-overflow-tooltip="col.showOverflowTooltip || true"
|
||||||
|
:formatter="(row:any,col:any)=>col.formater(row,col)"
|
||||||
|
/> -->
|
||||||
|
<div >{{col}}</div>
|
||||||
|
|
||||||
|
<!-- <el-table-column
|
||||||
|
v-else
|
||||||
|
:prop="col.prop"
|
||||||
|
:label="col.label"
|
||||||
|
:width="col.width"
|
||||||
|
:min-width="col.minWidth"
|
||||||
|
:align="col.align || 'center'"
|
||||||
|
:sortable="col.sortable || false"
|
||||||
|
:fixed="col.fixed || false"
|
||||||
|
:show-overflow-tooltip="col.showOverflowTooltip || true"
|
||||||
|
>
|
||||||
|
<template #default="scope">
|
||||||
|
<slot v-if="$slots[col.prop]" :name="col.prop" v-bind="scope" />
|
||||||
|
<component
|
||||||
|
v-else-if="col.render"
|
||||||
|
:is="col.render"
|
||||||
|
v-bind="{ row: scope.row, col, index: scope.$index }"
|
||||||
|
/>
|
||||||
|
<span v-else>{{ scope.row[col.prop] }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column> -->
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 操作列 -->
|
||||||
|
<el-table-column
|
||||||
|
v-if="$slots.actions"
|
||||||
|
label="操作"
|
||||||
|
:fixed="actionFixed"
|
||||||
|
:width="actionWidth"
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
<template #default="scope">
|
||||||
|
<slot name="actions" v-bind="scope" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue';
|
||||||
|
import { formatter, type TableColumnCtx } from 'element-plus';
|
||||||
|
import { TableColumn } from '../type';
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
columns: TableColumn[];
|
||||||
|
data: Record<string, any>[];
|
||||||
|
loading?: boolean;
|
||||||
|
rowKey?: string;
|
||||||
|
border?: boolean;
|
||||||
|
stripe?: boolean;
|
||||||
|
size?: 'small' | 'default' | 'large';
|
||||||
|
showIndex?: boolean;
|
||||||
|
showSelection?: boolean;
|
||||||
|
highlightCurrentRow?: boolean;
|
||||||
|
actionWidth?: string | number;
|
||||||
|
actionFixed?: 'left' | 'right' | boolean;
|
||||||
|
tableProps?: Record<string, any>; // 透传 Element Plus Table 所有 props
|
||||||
|
autoHeight?: boolean;
|
||||||
|
heightOffset?: number; // 距离底部的偏移量
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
columns: () => [],
|
||||||
|
data: () => [],
|
||||||
|
loading: false,
|
||||||
|
rowKey: 'id',
|
||||||
|
border: false,
|
||||||
|
stripe: true,
|
||||||
|
size: 'default',
|
||||||
|
showIndex: false,
|
||||||
|
showSelection: false,
|
||||||
|
highlightCurrentRow: false,
|
||||||
|
actionWidth: 180,
|
||||||
|
actionFixed: 'right',
|
||||||
|
tableProps: () => ({}),
|
||||||
|
autoHeight: true,
|
||||||
|
heightOffset: 360,
|
||||||
|
});
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProTable' });
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
(e: 'row-dblclick', row: any): void;
|
||||||
|
(e: 'selection-change', selection: any[]): void;
|
||||||
|
(e: 'sort-change', col: TableColumnCtx<any>): void;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
// 表格高度
|
||||||
|
const tableHeight = ref<string | number>('auto');
|
||||||
|
|
||||||
|
const calcHeight = () => {
|
||||||
|
if (props.autoHeight) {
|
||||||
|
tableHeight.value = window.innerHeight - props.heightOffset;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 监听窗口变化
|
||||||
|
onMounted(() => {
|
||||||
|
calcHeight();
|
||||||
|
window.addEventListener('resize', calcHeight);
|
||||||
|
});
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
window.removeEventListener('resize', calcHeight);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 事件处理
|
||||||
|
const onRowDblClick = (row: any) => emit('row-dblclick', row);
|
||||||
|
const onSelectionChange = (selection: any[]) => emit('selection-change', selection);
|
||||||
|
const onSortChange = (col: TableColumnCtx<any>) => emit('sort-change', col);
|
||||||
|
|
||||||
|
// 暴露 Element Plus Table API
|
||||||
|
const tableRef = ref();
|
||||||
|
const clearSelection = () => tableRef.value?.clearSelection();
|
||||||
|
const toggleRowSelection = (row: any, selected?: boolean) =>
|
||||||
|
tableRef.value?.toggleRowSelection(row, selected);
|
||||||
|
const getSelectionRows = () => tableRef.value?.getSelectionRows();
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
clearSelection,
|
||||||
|
toggleRowSelection,
|
||||||
|
getSelectionRows,
|
||||||
|
tableRef,
|
||||||
|
});
|
||||||
|
</script>
|
199
src/components/dynamicpage/queryForm/index.vue
Normal file
199
src/components/dynamicpage/queryForm/index.vue
Normal file
@ -0,0 +1,199 @@
|
|||||||
|
<template>
|
||||||
|
<div class="query-form">
|
||||||
|
<el-form ref="formRef" :model="modelValue" :label-width="labelWidth" :inline="inline">
|
||||||
|
<el-row :gutter="gutter">
|
||||||
|
<template v-for="(item, index) in fields" :key="item.prop">
|
||||||
|
<div class="form-item-wrapper" v-show="showAll || index < defaultFieldCount">
|
||||||
|
<el-form-item :label="item.label" :prop="item.prop" :rules="item.rules">
|
||||||
|
<!-- 插槽优先 -->
|
||||||
|
<slot :name="item.prop" :item="item" :form="modelValue">
|
||||||
|
<!-- 动态组件渲染 -->
|
||||||
|
<component
|
||||||
|
:is="getComponent(item.type)"
|
||||||
|
v-model="modelValue[item.prop]"
|
||||||
|
v-bind="getProps(item)"
|
||||||
|
@keyup.enter="item.type === 'input' && handleSearch()"
|
||||||
|
>
|
||||||
|
<!-- 下拉选项 -->
|
||||||
|
<template v-if="item.type === 'select'" #default>
|
||||||
|
<el-option
|
||||||
|
v-for="opt in item.options || []"
|
||||||
|
:key="opt.value"
|
||||||
|
:label="opt.label"
|
||||||
|
:value="opt.value"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</component>
|
||||||
|
</slot>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 操作按钮 -->
|
||||||
|
<div class="form-item-wrapper actions">
|
||||||
|
<el-form-item>
|
||||||
|
<slot name="actions">
|
||||||
|
<el-button type="primary" :icon="Search" size="default" @click="handleSearch">
|
||||||
|
搜索
|
||||||
|
</el-button>
|
||||||
|
<el-button :icon="Refresh" size="default" @click="handleReset">重置</el-button>
|
||||||
|
<el-button link v-if="fields.length > defaultFieldCount" @click="toggleSearch">
|
||||||
|
{{ word }}
|
||||||
|
<el-icon>
|
||||||
|
<ele-ArrowUp v-if="showAll" />
|
||||||
|
<ele-ArrowDown v-else />
|
||||||
|
</el-icon>
|
||||||
|
</el-button>
|
||||||
|
</slot>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, computed, watch, onMounted } from 'vue';
|
||||||
|
import { Search, Refresh } from '@element-plus/icons-vue';
|
||||||
|
import type { FormInstance } from 'element-plus';
|
||||||
|
import { QueryFormField } from '../type';
|
||||||
|
interface Props {
|
||||||
|
fields: QueryFormField[];
|
||||||
|
modelValue: Record<string, any>; // 双向绑定
|
||||||
|
defaultFieldCount?: number;
|
||||||
|
labelWidth?: string;
|
||||||
|
inline?: boolean;
|
||||||
|
gutter?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
fields: () => [] as QueryFormField[],
|
||||||
|
modelValue: () => ({}),
|
||||||
|
defaultFieldCount: 3,
|
||||||
|
labelWidth: '100px',
|
||||||
|
inline: true,
|
||||||
|
gutter: 20,
|
||||||
|
});
|
||||||
|
defineOptions({ name: 'QueryForm' });
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
(e: 'update:modelValue', val: Record<string, any>): void;
|
||||||
|
(e: 'search', val: Record<string, any>): void;
|
||||||
|
(e: 'reset'): void;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const formRef = ref<FormInstance>();
|
||||||
|
const showAll = ref(false);
|
||||||
|
const toggleSearch = () => (showAll.value = !showAll.value);
|
||||||
|
|
||||||
|
const word = computed(() => (showAll.value ? '收起搜索' : '展开搜索'));
|
||||||
|
|
||||||
|
const dates = ['daterange', 'datetimerange'];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 初始化表单
|
||||||
|
*/
|
||||||
|
const initForm = () => {
|
||||||
|
const form: Record<string, any> = {};
|
||||||
|
props.fields.forEach((item) => {
|
||||||
|
form[item.prop] = item.defaultValue ?? '';
|
||||||
|
});
|
||||||
|
return form;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 更新父组件的值
|
||||||
|
*/
|
||||||
|
const updateModel = (val: Record<string, any>) => {
|
||||||
|
emit('update:modelValue', val);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 动态组件映射
|
||||||
|
*/
|
||||||
|
const componentMap: Record<string, any> = {
|
||||||
|
input: 'el-input',
|
||||||
|
select: 'el-select',
|
||||||
|
daterange: 'el-date-picker',
|
||||||
|
datetimerange: 'el-date-picker',
|
||||||
|
};
|
||||||
|
|
||||||
|
const getComponent = (type: string) => componentMap[type] || 'el-input';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取组件属性
|
||||||
|
*/
|
||||||
|
const getProps = (item: QueryFormField) => {
|
||||||
|
const commonProps = {
|
||||||
|
size: item.size || 'default',
|
||||||
|
placeholder: item.placeholder || '请输入',
|
||||||
|
};
|
||||||
|
if (item.type === 'select') {
|
||||||
|
return { ...commonProps, filterable: true };
|
||||||
|
}
|
||||||
|
if (dates.includes(item.type)) {
|
||||||
|
return {
|
||||||
|
...commonProps,
|
||||||
|
type: item.type,
|
||||||
|
'value-format': item.valueFormat || 'YYYY-MM-DD',
|
||||||
|
'range-separator': '至',
|
||||||
|
'start-placeholder': item.staerPlaceholder || '开始日期',
|
||||||
|
'end-placeholder': item.endPlaceholder || '结束日期',
|
||||||
|
style: { width: '220px' },
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return commonProps;
|
||||||
|
};
|
||||||
|
|
||||||
|
const loadOptions = async () => {
|
||||||
|
let oldFetchOptions:any = [];
|
||||||
|
for (const field of props.fields) {
|
||||||
|
if (field.fetchOptions) {
|
||||||
|
if (!oldFetchOptions.includes(field.fetchOptions)) {
|
||||||
|
field.options = await field.fetchOptions();
|
||||||
|
oldFetchOptions.push(field.fetchOptions);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
loadOptions();
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 搜索事件(防抖)
|
||||||
|
*/
|
||||||
|
const handleSearch = () => emit('search', props.modelValue);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 重置事件
|
||||||
|
*/
|
||||||
|
const handleReset = () => {
|
||||||
|
const newForm = initForm();
|
||||||
|
updateModel(newForm);
|
||||||
|
emit('reset');
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 监听字段变化,保持双向绑定
|
||||||
|
*/
|
||||||
|
watch(
|
||||||
|
() => props.modelValue,
|
||||||
|
(val) => updateModel(val),
|
||||||
|
{ deep: true }
|
||||||
|
);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.form-item-wrapper {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.query-form {
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
|
.actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
34
src/components/dynamicpage/type.ts
Normal file
34
src/components/dynamicpage/type.ts
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
export interface OptionItem {
|
||||||
|
label: string;
|
||||||
|
value: string | number;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface QueryFormField {
|
||||||
|
label: string; // 显示的 label
|
||||||
|
prop: string; // 绑定的字段
|
||||||
|
type: 'input' | 'select' | 'date' | 'daterange' | 'datetimerange' | 'monthrange';
|
||||||
|
placeholder?: string;
|
||||||
|
size?: 'small' | 'default' | 'large';
|
||||||
|
defaultValue?: any;
|
||||||
|
options?: OptionItem[];
|
||||||
|
fetchOptions?: () => Promise<OptionItem[]>; // 异步加载 options
|
||||||
|
valueFormat?:string;
|
||||||
|
rules?: any[]; // 校验规则
|
||||||
|
staerPlaceholder?: string;
|
||||||
|
endPlaceholder?: string;
|
||||||
|
|
||||||
|
}
|
||||||
|
export interface TableColumn {
|
||||||
|
label: string;
|
||||||
|
prop: string;
|
||||||
|
width?: string | number;
|
||||||
|
minWidth?: string | number;
|
||||||
|
align?: 'left' | 'center' | 'right';
|
||||||
|
sortable?: boolean;
|
||||||
|
fixed?: 'left' | 'right' | boolean;
|
||||||
|
render?: any;
|
||||||
|
showOverflowTooltip?: boolean;
|
||||||
|
formater?: (row: any, column: any) => any;
|
||||||
|
isFormater?: boolean;
|
||||||
|
}
|
@ -24,18 +24,18 @@
|
|||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</template>
|
</template>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
<div class="layout-navbars-breadcrumb-user-icon" @click="onSearchClick">
|
<!-- <div class="layout-navbars-breadcrumb-user-icon" @click="onSearchClick">
|
||||||
<el-icon :title="$t('message.user.title2')">
|
<el-icon :title="$t('message.user.title2')">
|
||||||
<ele-Search />
|
<ele-Search />
|
||||||
</el-icon>
|
</el-icon>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="layout-navbars-breadcrumb-user-icon" @click="onLayoutSetingClick">
|
<!-- <div class="layout-navbars-breadcrumb-user-icon" @click="onLayoutSetingClick">
|
||||||
<i class="icon-skin iconfont" :title="$t('message.user.title3')"></i>
|
<i class="icon-skin iconfont" :title="$t('message.user.title3')"></i>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="layout-navbars-breadcrumb-user-icon" @click="removeCacheClick">
|
<div class="layout-navbars-breadcrumb-user-icon" @click="removeCacheClick">
|
||||||
<i class="fa-trash fa" title="清除缓存"></i>
|
<i class="fa-trash fa" title="清除缓存"></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="layout-navbars-breadcrumb-user-icon">
|
<!-- <div class="layout-navbars-breadcrumb-user-icon">
|
||||||
<el-popover ref="newPopoverRef" placement="bottom" trigger="click" transition="el-zoom-in-top" :width="500" :persistent="false">
|
<el-popover ref="newPopoverRef" placement="bottom" trigger="click" transition="el-zoom-in-top" :width="500" :persistent="false">
|
||||||
<template #reference>
|
<template #reference>
|
||||||
<el-badge :is-dot="true">
|
<el-badge :is-dot="true">
|
||||||
@ -48,7 +48,7 @@
|
|||||||
<UserNews @hideNews="hideNews" />
|
<UserNews @hideNews="hideNews" />
|
||||||
</template>
|
</template>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
|
<div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
|
||||||
<i
|
<i
|
||||||
class="iconfont"
|
class="iconfont"
|
||||||
@ -67,10 +67,10 @@
|
|||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<el-dropdown-menu>
|
<el-dropdown-menu>
|
||||||
<el-dropdown-item command="/home">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
|
<el-dropdown-item command="/home">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
|
||||||
<el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item>
|
<!-- <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item> -->
|
||||||
<el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>
|
<el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>
|
||||||
<el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item>
|
<!-- <el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item> -->
|
||||||
<el-dropdown-item command="/401">{{ $t('message.user.dropdown4') }}</el-dropdown-item>
|
<!-- <el-dropdown-item command="/401">{{ $t('message.user.dropdown4') }}</el-dropdown-item> -->
|
||||||
<el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
|
<el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
|
||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</template>
|
</template>
|
||||||
@ -80,7 +80,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {ref, getCurrentInstance, computed, reactive, toRefs, onMounted, defineComponent, watch} from 'vue';
|
import {ref, getCurrentInstance, computed, reactive, toRefs, onMounted, watch} from 'vue';
|
||||||
import { useRoute,useRouter } from 'vue-router';
|
import { useRoute,useRouter } from 'vue-router';
|
||||||
import {ElMessageBox, ElMessage, ElNotification} from 'element-plus';
|
import {ElMessageBox, ElMessage, ElNotification} from 'element-plus';
|
||||||
import screenfull from 'screenfull';
|
import screenfull from 'screenfull';
|
||||||
@ -90,7 +90,6 @@ import { useUserInfo } from '/@/stores/userInfo';
|
|||||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||||
import other from '/@/utils/other';
|
import other from '/@/utils/other';
|
||||||
import { Session, Local } from '/@/utils/storage';
|
import { Session, Local } from '/@/utils/storage';
|
||||||
import UserNews from '/@/layout/navBars/breadcrumb/userNews.vue';
|
|
||||||
import Search from '/@/layout/navBars/breadcrumb/search.vue';
|
import Search from '/@/layout/navBars/breadcrumb/search.vue';
|
||||||
import {logout} from "/@/api/login";
|
import {logout} from "/@/api/login";
|
||||||
import {removeCache} from "/@/api/system/cache";
|
import {removeCache} from "/@/api/system/cache";
|
||||||
@ -197,7 +196,6 @@ const onSearchClick = () => {
|
|||||||
searchRef.value.openSearch();
|
searchRef.value.openSearch();
|
||||||
};
|
};
|
||||||
const hideNews=()=>{
|
const hideNews=()=>{
|
||||||
debugger
|
|
||||||
newPopoverRef.value.hide()
|
newPopoverRef.value.hide()
|
||||||
}
|
}
|
||||||
// 组件大小改变
|
// 组件大小改变
|
||||||
@ -263,7 +261,7 @@ const noticeStoreAct = noticeStore()
|
|||||||
const getMessages = computed(() => {
|
const getMessages = computed(() => {
|
||||||
return noticeStoreAct.message;
|
return noticeStoreAct.message;
|
||||||
});
|
});
|
||||||
watch(getMessages,(nv,ov)=>{
|
watch(getMessages,(nv)=>{
|
||||||
if (!nv || !nv.id) {
|
if (!nv || !nv.id) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
14
src/main.ts
14
src/main.ts
@ -11,9 +11,7 @@ import ElementPlus from 'element-plus';
|
|||||||
import 'element-plus/dist/index.css';
|
import 'element-plus/dist/index.css';
|
||||||
import '/@/theme/index.scss';
|
import '/@/theme/index.scss';
|
||||||
import mitt from 'mitt';
|
import mitt from 'mitt';
|
||||||
import VueGridLayout from 'vue-grid-layout';
|
|
||||||
import {findChildrenByPid, flattenTree, getUpFileUrl, handleTree, parseTime, selectDictLabel} from '/@/utils/gfast';
|
import {findChildrenByPid, flattenTree, getUpFileUrl, handleTree, parseTime, selectDictLabel} from '/@/utils/gfast';
|
||||||
import Websocket from '/@/utils/websocket';
|
|
||||||
import {useDict} from '/@/api/system/dict/data';
|
import {useDict} from '/@/api/system/dict/data';
|
||||||
import {getItems, setItems, getOptionValue, isEmpty} from '/@/api/items'
|
import {getItems, setItems, getOptionValue, isEmpty} from '/@/api/items'
|
||||||
// 分页组件
|
// 分页组件
|
||||||
@ -27,17 +25,6 @@ import VueUeditorWrap from 'vue-ueditor-wrap';
|
|||||||
|
|
||||||
|
|
||||||
const app = createApp(App);
|
const app = createApp(App);
|
||||||
|
|
||||||
// 全局websocket
|
|
||||||
const onMessageList: Array<Function> = [];
|
|
||||||
app.provide('onMessageList', onMessageList);
|
|
||||||
const onMessage = (event: any) => {
|
|
||||||
onMessageList.forEach((f) => {
|
|
||||||
f.call(null, event);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
Websocket(onMessage);
|
|
||||||
|
|
||||||
directive(app);
|
directive(app);
|
||||||
other.elSvg(app);
|
other.elSvg(app);
|
||||||
|
|
||||||
@ -47,7 +34,6 @@ app.use(pinia)
|
|||||||
.use(router)
|
.use(router)
|
||||||
.use(ElementPlus)
|
.use(ElementPlus)
|
||||||
.use(i18n)
|
.use(i18n)
|
||||||
.use(VueGridLayout)
|
|
||||||
.use(VueUeditorWrap)
|
.use(VueUeditorWrap)
|
||||||
.mount('#app');
|
.mount('#app');
|
||||||
|
|
||||||
|
@ -1,10 +1,17 @@
|
|||||||
import { RouteRecordRaw } from 'vue-router';
|
import { RouteRecordRaw } from 'vue-router';
|
||||||
|
|
||||||
|
// Extend the Window interface to include nextLoading
|
||||||
|
declare global {
|
||||||
|
interface Window {
|
||||||
|
nextLoading?: any;
|
||||||
|
}
|
||||||
|
}
|
||||||
import pinia from '/@/stores/index';
|
import pinia from '/@/stores/index';
|
||||||
import { useUserInfo } from '/@/stores/userInfo';
|
import { useUserInfo } from '/@/stores/userInfo';
|
||||||
import { useRequestOldRoutes } from '/@/stores/requestOldRoutes';
|
import { useRequestOldRoutes } from '/@/stores/requestOldRoutes';
|
||||||
import { Session } from '/@/utils/storage';
|
import { Session } from '/@/utils/storage';
|
||||||
import { NextLoading } from '/@/utils/loading';
|
import { NextLoading } from '/@/utils/loading';
|
||||||
import { demoRoutes,dynamicRoutes, notFoundAndNoPower } from '/@/router/route';
|
import { dynamicRoutes, notFoundAndNoPower } from '/@/router/route';
|
||||||
import { formatTwoStageRoutes, formatFlatteningRoutes, router } from '/@/router/index';
|
import { formatTwoStageRoutes, formatFlatteningRoutes, router } from '/@/router/index';
|
||||||
import { useRoutesList } from '/@/stores/routesList';
|
import { useRoutesList } from '/@/stores/routesList';
|
||||||
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
|
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
|
||||||
@ -47,7 +54,7 @@ export async function initBackEndControlRoutes() {
|
|||||||
// 存储接口原始路由(未处理component),根据需求选择使用
|
// 存储接口原始路由(未处理component),根据需求选择使用
|
||||||
useRequestOldRoutes().setRequestOldRoutes(JSON.parse(JSON.stringify(menuRoute)));
|
useRequestOldRoutes().setRequestOldRoutes(JSON.parse(JSON.stringify(menuRoute)));
|
||||||
// 处理路由(component),替换 dynamicRoutes(/@/router/route)第一个顶级 children 的路由
|
// 处理路由(component),替换 dynamicRoutes(/@/router/route)第一个顶级 children 的路由
|
||||||
dynamicRoutes[0].children?.push(...await backEndComponent(menuRoute),...demoRoutes);
|
dynamicRoutes[0].children?.push(...await backEndComponent(menuRoute));
|
||||||
// 添加动态路由
|
// 添加动态路由
|
||||||
await setAddRoute();
|
await setAddRoute();
|
||||||
// 设置路由到 vuex routesList 中(已处理成多级嵌套路由)及缓存多级嵌套数组处理后的一维数组
|
// 设置路由到 vuex routesList 中(已处理成多级嵌套路由)及缓存多级嵌套数组处理后的一维数组
|
||||||
|
1023
src/router/route.ts
1023
src/router/route.ts
File diff suppressed because it is too large
Load Diff
43
src/types/index.ts
Normal file
43
src/types/index.ts
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
export interface DeptItem {
|
||||||
|
deptId: number;
|
||||||
|
parentId: number;
|
||||||
|
ancestors: string;
|
||||||
|
deptName: string;
|
||||||
|
orderNum: number;
|
||||||
|
leader: null;
|
||||||
|
phone: string;
|
||||||
|
email: string;
|
||||||
|
status: number;
|
||||||
|
createdBy: number;
|
||||||
|
updatedBy: number;
|
||||||
|
createdAt: string;
|
||||||
|
updatedAt: string;
|
||||||
|
deletedAt: null;
|
||||||
|
};
|
||||||
|
export interface UserItem {
|
||||||
|
id: number;
|
||||||
|
userName: string;
|
||||||
|
mobile: string;
|
||||||
|
userNickname: string;
|
||||||
|
birthday: number;
|
||||||
|
userPassword: string;
|
||||||
|
userSalt: string;
|
||||||
|
userStatus: number;
|
||||||
|
userEmail: string;
|
||||||
|
sex: number;
|
||||||
|
avatar: string;
|
||||||
|
deptId: number;
|
||||||
|
remark: string;
|
||||||
|
isAdmin: number;
|
||||||
|
address: string;
|
||||||
|
describe: string;
|
||||||
|
lastLoginIp: string;
|
||||||
|
lastLoginTime: string;
|
||||||
|
createdAt: string;
|
||||||
|
updatedAt: string;
|
||||||
|
deletedAt: null;
|
||||||
|
openId : string;
|
||||||
|
dept: DeptItem;
|
||||||
|
roleInfo: null;
|
||||||
|
post: null;
|
||||||
|
};
|
@ -0,0 +1,200 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 详情抽屉 -->
|
||||||
|
<div class="demo-speciesName-detail">
|
||||||
|
<el-drawer v-model="isShowDialog" size="80%" direction="ltr">
|
||||||
|
<template #header>
|
||||||
|
<h4>详情</h4>
|
||||||
|
</template>
|
||||||
|
<el-descriptions
|
||||||
|
class="margin-top"
|
||||||
|
:column="3"
|
||||||
|
border
|
||||||
|
style="margin: 8px;"
|
||||||
|
>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
主键
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.id }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
物种编号
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.speciesCode }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
物种名称
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.name }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
物种名称内容
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.content }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
数据来源
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.sourcesData }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
数据采集人
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.createUser }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
数据采集信息
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ proxy.parseTime(formData.createDate, '{y}-{m}-{d} {h}:{i}:{s}') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
数据核查人
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.auditUser }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
数据核查日期
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ proxy.parseTime(formData.auditDate, '{y}-{m}-{d} {h}:{i}:{s}') }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item :span="1">
|
||||||
|
<template #label>
|
||||||
|
<div class="cell-item">
|
||||||
|
备注
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
{{ formData.remark }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</el-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { reactive, toRefs, defineComponent,ref,unref,getCurrentInstance,computed } from 'vue';
|
||||||
|
import {ElMessageBox, ElMessage, FormInstance,UploadProps} from 'element-plus';
|
||||||
|
import {
|
||||||
|
listSpeciesName,
|
||||||
|
getSpeciesName,
|
||||||
|
delSpeciesName,
|
||||||
|
addSpeciesName,
|
||||||
|
updateSpeciesName,
|
||||||
|
} from "./api";
|
||||||
|
import {
|
||||||
|
SpeciesNameTableColumns,
|
||||||
|
SpeciesNameInfoData,
|
||||||
|
SpeciesNameTableDataState,
|
||||||
|
SpeciesNameEditState
|
||||||
|
} from "./type"
|
||||||
|
defineOptions({ name: "ApiV1BusinessesSpeciesNameDetail"})
|
||||||
|
const {proxy} = <any>getCurrentInstance()
|
||||||
|
const formRef = ref<HTMLElement | null>(null);
|
||||||
|
const menuRef = ref();
|
||||||
|
const state = reactive<SpeciesNameEditState>({
|
||||||
|
loading:false,
|
||||||
|
isShowDialog: false,
|
||||||
|
formData: {
|
||||||
|
id: undefined,
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
content: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
remark: undefined,
|
||||||
|
},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
id : [
|
||||||
|
{ required: true, message: "主键不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
name : [
|
||||||
|
{ required: true, message: "物种名称不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const { isShowDialog,formData } = toRefs(state);
|
||||||
|
// 打开弹窗
|
||||||
|
const openDialog = (row?: SpeciesNameInfoData) => {
|
||||||
|
resetForm();
|
||||||
|
if(row) {
|
||||||
|
getSpeciesName(row.id!).then((res:any)=>{
|
||||||
|
const data = res.data;
|
||||||
|
state.formData = data;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
state.isShowDialog = true;
|
||||||
|
};
|
||||||
|
// 关闭弹窗
|
||||||
|
const closeDialog = () => {
|
||||||
|
state.isShowDialog = false;
|
||||||
|
};
|
||||||
|
defineExpose({
|
||||||
|
openDialog,
|
||||||
|
});
|
||||||
|
// 取消
|
||||||
|
const onCancel = () => {
|
||||||
|
closeDialog();
|
||||||
|
};
|
||||||
|
const resetForm = ()=>{
|
||||||
|
state.formData = {
|
||||||
|
id: undefined,
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
content: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
remark: undefined,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.demo-speciesName-detail :deep(.el-form-item--large .el-form-item__label){
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
.pic-block{
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
.file-block{
|
||||||
|
width: 100%;
|
||||||
|
border: 1px solid var(--el-border-color);
|
||||||
|
border-radius: 6px;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
transition: var(--el-transition-duration-fast);
|
||||||
|
margin-bottom: 5px;
|
||||||
|
padding: 3px 6px;
|
||||||
|
}
|
||||||
|
.ml-2{margin-right: 5px;}
|
||||||
|
</style>
|
@ -0,0 +1,173 @@
|
|||||||
|
<template>
|
||||||
|
<div class="demo-speciesName-edit">
|
||||||
|
<!-- 添加或修改对话框 -->
|
||||||
|
<el-dialog v-model="isShowDialog" width="800px" :close-on-click-modal="false" :destroy-on-close="true">
|
||||||
|
<template #header>
|
||||||
|
<div v-drag="['.demo-speciesName-edit .el-dialog', '.demo-speciesName-edit .el-dialog__header']">{{(!formData.id || formData.id==0?'添加':'修改')+''}}</div>
|
||||||
|
</template>
|
||||||
|
<el-form ref="formRef" :model="formData" :rules="rules" label-width="120px">
|
||||||
|
<el-form-item label="物种编号" prop="speciesCode">
|
||||||
|
<el-input v-model="formData.speciesCode" placeholder="请输入物种编号" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="物种名称" prop="name">
|
||||||
|
<el-input v-model="formData.name" placeholder="请输入物种名称" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="物种名称内容" prop="content">
|
||||||
|
<el-input v-model="formData.content" placeholder="请输入物种名称内容" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据来源" prop="sourcesData">
|
||||||
|
<el-input v-model="formData.sourcesData" placeholder="请输入数据来源" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据采集人" prop="createUser">
|
||||||
|
<el-input v-model="formData.createUser" placeholder="请输入数据采集人" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据采集信息" prop="createDate">
|
||||||
|
<el-date-picker clearable style="width: 200px"
|
||||||
|
v-model="formData.createDate"
|
||||||
|
type="datetime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
placeholder="选择数据采集信息">
|
||||||
|
</el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据核查人" prop="auditUser">
|
||||||
|
<el-input v-model="formData.auditUser" placeholder="请输入数据核查人" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据核查日期" prop="auditDate">
|
||||||
|
<el-date-picker clearable style="width: 200px"
|
||||||
|
v-model="formData.auditDate"
|
||||||
|
type="datetime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
placeholder="选择数据核查日期">
|
||||||
|
</el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input v-model="formData.remark" placeholder="请输入备注" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="onSubmit" :disabled="loading">确 定</el-button>
|
||||||
|
<el-button @click="onCancel">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { reactive, toRefs, ref,unref,getCurrentInstance,computed } from 'vue';
|
||||||
|
import {ElMessageBox, ElMessage, FormInstance,UploadProps} from 'element-plus';
|
||||||
|
import {
|
||||||
|
listSpeciesName,
|
||||||
|
getSpeciesName,
|
||||||
|
delSpeciesName,
|
||||||
|
addSpeciesName,
|
||||||
|
updateSpeciesName,
|
||||||
|
} from "./api";
|
||||||
|
import {
|
||||||
|
SpeciesNameTableColumns,
|
||||||
|
SpeciesNameInfoData,
|
||||||
|
SpeciesNameTableDataState,
|
||||||
|
SpeciesNameEditState
|
||||||
|
} from "./type"
|
||||||
|
defineOptions({ name: "ApiV1BusinessesSpeciesNameEdit"})
|
||||||
|
const emit = defineEmits(['speciesNameList'])
|
||||||
|
const {proxy} = <any>getCurrentInstance()
|
||||||
|
const formRef = ref<HTMLElement | null>(null);
|
||||||
|
const menuRef = ref();
|
||||||
|
const state = reactive<SpeciesNameEditState>({
|
||||||
|
loading:false,
|
||||||
|
isShowDialog: false,
|
||||||
|
formData: {
|
||||||
|
id: undefined,
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
content: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
remark: undefined,
|
||||||
|
},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
id : [
|
||||||
|
{ required: true, message: "主键不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
name : [
|
||||||
|
{ required: true, message: "物种名称不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const { loading,isShowDialog,formData,rules } = toRefs(state);
|
||||||
|
// 打开弹窗
|
||||||
|
const openDialog = (row?: SpeciesNameInfoData) => {
|
||||||
|
resetForm();
|
||||||
|
if(row) {
|
||||||
|
getSpeciesName(row.id!).then((res:any)=>{
|
||||||
|
const data = res.data;
|
||||||
|
state.formData = data;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
state.isShowDialog = true;
|
||||||
|
};
|
||||||
|
// 关闭弹窗
|
||||||
|
const closeDialog = () => {
|
||||||
|
state.isShowDialog = false;
|
||||||
|
};
|
||||||
|
defineExpose({
|
||||||
|
openDialog,
|
||||||
|
});
|
||||||
|
// 取消
|
||||||
|
const onCancel = () => {
|
||||||
|
closeDialog();
|
||||||
|
};
|
||||||
|
// 提交
|
||||||
|
const onSubmit = () => {
|
||||||
|
const formWrap = unref(formRef) as any;
|
||||||
|
if (!formWrap) return;
|
||||||
|
formWrap.validate((valid: boolean) => {
|
||||||
|
if (valid) {
|
||||||
|
state.loading = true;
|
||||||
|
if(!state.formData.id || state.formData.id===0){
|
||||||
|
//添加
|
||||||
|
addSpeciesName(state.formData).then(()=>{
|
||||||
|
ElMessage.success('添加成功');
|
||||||
|
closeDialog(); // 关闭弹窗
|
||||||
|
emit('speciesNameList')
|
||||||
|
}).finally(()=>{
|
||||||
|
state.loading = false;
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
//修改
|
||||||
|
updateSpeciesName(state.formData).then(()=>{
|
||||||
|
ElMessage.success('修改成功');
|
||||||
|
closeDialog(); // 关闭弹窗
|
||||||
|
emit('speciesNameList')
|
||||||
|
}).finally(()=>{
|
||||||
|
state.loading = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const resetForm = ()=>{
|
||||||
|
state.formData = {
|
||||||
|
id: undefined,
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
content: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
remark: undefined,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.kv-label{margin-bottom: 15px;font-size: 14px;}
|
||||||
|
.mini-btn i.el-icon{margin: unset;}
|
||||||
|
.kv-row{margin-bottom: 12px;}
|
||||||
|
</style>
|
45
src/views/businesses/speciesName/api/index.ts
Normal file
45
src/views/businesses/speciesName/api/index.ts
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
import request from '/@/utils/request'
|
||||||
|
// 查询列表
|
||||||
|
export function listSpeciesName(query:object) {
|
||||||
|
return request({
|
||||||
|
url: '/api/v1/businesses/speciesName/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 查询详细
|
||||||
|
export function getSpeciesName(id:number) {
|
||||||
|
return request({
|
||||||
|
url: '/api/v1/businesses/speciesName/get',
|
||||||
|
method: 'get',
|
||||||
|
params: {
|
||||||
|
id: id.toString()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 新增
|
||||||
|
export function addSpeciesName(data:object) {
|
||||||
|
return request({
|
||||||
|
url: '/api/v1/businesses/speciesName/add',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 修改
|
||||||
|
export function updateSpeciesName(data:object) {
|
||||||
|
return request({
|
||||||
|
url: '/api/v1/businesses/speciesName/edit',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 删除
|
||||||
|
export function delSpeciesName(ids:number[]) {
|
||||||
|
return request({
|
||||||
|
url: '/api/v1/businesses/speciesName/delete',
|
||||||
|
method: 'delete',
|
||||||
|
data:{
|
||||||
|
ids:ids
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
273
src/views/businesses/speciesName/index.vue
Normal file
273
src/views/businesses/speciesName/index.vue
Normal file
@ -0,0 +1,273 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-card shadow="hover">
|
||||||
|
<QueryForm
|
||||||
|
v-model="searchForm"
|
||||||
|
:fields="searchFields"
|
||||||
|
@search="onSearch"
|
||||||
|
@reset="onReset"
|
||||||
|
ref="queryFormRef"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<el-row :gutter="10" style="padding-bottom: 10px">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button type="primary" @click="handleAdd" v-auth="'api/v1/businesses/speciesName/add'"
|
||||||
|
><el-icon><ele-Plus /></el-icon>新增</el-button
|
||||||
|
>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
:disabled="multiple"
|
||||||
|
@click="handleDelete(null)"
|
||||||
|
v-auth="'api/v1/businesses/speciesName/delete'"
|
||||||
|
><el-icon><ele-Delete /></el-icon>删除</el-button
|
||||||
|
>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<ProTable
|
||||||
|
ref="proTableRef"
|
||||||
|
:columns="columns"
|
||||||
|
:data="tableData.data"
|
||||||
|
:loading="loading"
|
||||||
|
:show-selection="true"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
>
|
||||||
|
</ProTable>
|
||||||
|
<!-- <el-table-column
|
||||||
|
label="操作"
|
||||||
|
align="center"
|
||||||
|
class-name="small-padding"
|
||||||
|
min-width="160px"
|
||||||
|
fixed="right"
|
||||||
|
>
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
v-auth="'api/v1/businesses/speciesName/edit'"
|
||||||
|
><el-icon><ele-EditPen /></el-icon>修改</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
link
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
v-auth="'api/v1/businesses/speciesName/delete'"
|
||||||
|
><el-icon><ele-DeleteFilled /></el-icon>删除</el-button
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</el-table-column> -->
|
||||||
|
<pagination
|
||||||
|
v-show="tableData.total > 0"
|
||||||
|
:total="tableData.total"
|
||||||
|
v-model:page="tableData.param.pageNum"
|
||||||
|
v-model:limit="tableData.param.pageSize"
|
||||||
|
@pagination="speciesNameList"
|
||||||
|
/>
|
||||||
|
</el-card>
|
||||||
|
<ApiV1BusinessesSpeciesNameEdit
|
||||||
|
ref="editRef"
|
||||||
|
@speciesNameList="speciesNameList"
|
||||||
|
></ApiV1BusinessesSpeciesNameEdit>
|
||||||
|
<ApiV1BusinessesSpeciesNameDetail
|
||||||
|
ref="detailRef"
|
||||||
|
@speciesNameList="speciesNameList"
|
||||||
|
></ApiV1BusinessesSpeciesNameDetail>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { toRefs, reactive, onMounted, ref, getCurrentInstance, toRaw, computed } from 'vue';
|
||||||
|
import { ElMessageBox, ElMessage } from 'element-plus';
|
||||||
|
import { listSpeciesName, delSpeciesName } from './api/index';
|
||||||
|
import { SpeciesNameTableColumns, SpeciesNameInfoData, SpeciesNameTableDataState } from './type';
|
||||||
|
import ApiV1BusinessesSpeciesNameDetail from './ApiV1BusinessesSpeciesNameDetail.vue';
|
||||||
|
import ApiV1BusinessesSpeciesNameEdit from './ApiV1BusinessesSpeciesNameEdit.vue';
|
||||||
|
import QueryForm from '/@/components/dynamicpage/queryForm/index.vue';
|
||||||
|
import ProTable from '/@/components/dynamicpage/ProTable/index.vue';
|
||||||
|
import { QueryFormField, TableColumn } from '/@/components/dynamicpage/type';
|
||||||
|
import { getUserList } from '/@/api/system/user/index';
|
||||||
|
import { UserItem } from '/@/types';
|
||||||
|
import { parseTime } from '/@/utils/gfast';
|
||||||
|
defineOptions({ name: 'apiV1DemoSpeciesNameList' });
|
||||||
|
const { proxy } = <any>getCurrentInstance();
|
||||||
|
const loading = ref(false);
|
||||||
|
const editRef = ref();
|
||||||
|
const detailRef = ref();
|
||||||
|
|
||||||
|
// 非单个禁用
|
||||||
|
const single = ref(true);
|
||||||
|
// 非多个禁用
|
||||||
|
const multiple = ref(true);
|
||||||
|
const userOptions = ref<UserItem[]>([]);
|
||||||
|
|
||||||
|
const onSearch = async (val: Record<string, any>) => {
|
||||||
|
console.log('搜索参数', val);
|
||||||
|
state.tableData.param = { ...state.tableData.param, ...val };
|
||||||
|
speciesNameList();
|
||||||
|
};
|
||||||
|
const onReset = () => {
|
||||||
|
state.tableData.param = {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
id: undefined,
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
content: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
dateRange: [],
|
||||||
|
};
|
||||||
|
speciesNameList();
|
||||||
|
};
|
||||||
|
const searchForm = ref<Omit<SpeciesNameInfoData, 'id' | 'remark' | 'content'>>({
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
});
|
||||||
|
const searchFields = computed<QueryFormField[]>(() => [
|
||||||
|
{ label: '物种编码', prop: 'speciesCode', type: 'input', placeholder: '请输入物种编码' },
|
||||||
|
{ label: '物种名称', prop: 'name', type: 'input', placeholder: '请输入物种名称' },
|
||||||
|
{ label: '数据来源', prop: 'sourcesData', type: 'input', placeholder: '请输入数据来源' },
|
||||||
|
{
|
||||||
|
label: '数据采集人',
|
||||||
|
prop: 'createUser',
|
||||||
|
type: 'select',
|
||||||
|
options: userOptions.value.map((i) => {
|
||||||
|
return {
|
||||||
|
label: i.userNickname,
|
||||||
|
value: i.id,
|
||||||
|
};
|
||||||
|
}),
|
||||||
|
placeholder: '请选择数据采集人',
|
||||||
|
},
|
||||||
|
{ label: '数据采集日期', prop: 'createDate', type: 'daterange', valueFormat: 'YYYY-MM-DD' },
|
||||||
|
|
||||||
|
{
|
||||||
|
label: '数据核查人',
|
||||||
|
prop: 'auditUser',
|
||||||
|
type: 'select',
|
||||||
|
options: userOptions.value.map((i) => {
|
||||||
|
return {
|
||||||
|
label: i.userNickname,
|
||||||
|
value: i.id,
|
||||||
|
};
|
||||||
|
}),
|
||||||
|
placeholder: '请选择数据核查人',
|
||||||
|
},
|
||||||
|
{ label: '数据核查日期', prop: 'auditDate', type: 'daterange', valueFormat: 'YYYY-MM-DD' },
|
||||||
|
]);
|
||||||
|
|
||||||
|
const state = reactive<SpeciesNameTableDataState>({
|
||||||
|
ids: [],
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0,
|
||||||
|
loading: false,
|
||||||
|
param: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
id: undefined,
|
||||||
|
speciesCode: undefined,
|
||||||
|
name: undefined,
|
||||||
|
content: undefined,
|
||||||
|
sourcesData: undefined,
|
||||||
|
createUser: undefined,
|
||||||
|
createDate: undefined,
|
||||||
|
auditUser: undefined,
|
||||||
|
auditDate: undefined,
|
||||||
|
dateRange: [],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const { tableData } = toRefs(state);
|
||||||
|
const columns: TableColumn[] = [
|
||||||
|
{ label: '物种编码', prop: 'speciesCode' },
|
||||||
|
{ label: '物种名称', prop: 'name' },
|
||||||
|
{ label: '物种名称内容', prop: 'content' },
|
||||||
|
{ label: '数据来源', prop: 'sourcesData' },
|
||||||
|
{ label: '数据采集人', prop: 'createUser' },
|
||||||
|
{ label: '数据采集日期', prop: 'createDate',isFormater:true,formater(row,col){
|
||||||
|
console.log(row,col);
|
||||||
|
|
||||||
|
return parseTime(row.createDate,'{y}-{m}-{d}')
|
||||||
|
} },
|
||||||
|
{ label: '数据核查人', prop: 'auditUser' },
|
||||||
|
{ label: '数据核查日期', prop: 'auditDate' },
|
||||||
|
{ label: '备注', prop: 'remark' },
|
||||||
|
];
|
||||||
|
const proTableRef = ref();
|
||||||
|
// 页面加载时
|
||||||
|
onMounted(() => {
|
||||||
|
initTableData();
|
||||||
|
});
|
||||||
|
// 初始化表格数据
|
||||||
|
const initTableData = () => {
|
||||||
|
speciesNameList();
|
||||||
|
reqGetUserList();
|
||||||
|
};
|
||||||
|
// 获取列表数据
|
||||||
|
const speciesNameList = async () => {
|
||||||
|
loading.value = true;
|
||||||
|
const res = await listSpeciesName(state.tableData.param);
|
||||||
|
let list = res.data.list ?? [];
|
||||||
|
state.tableData.data = list;
|
||||||
|
state.tableData.total = res.data.total;
|
||||||
|
loading.value = false;
|
||||||
|
};
|
||||||
|
const reqGetUserList = async () => {
|
||||||
|
if (userOptions.value.length > 0) return;
|
||||||
|
const res = await getUserList({ pageSize: 9999, pageNum: 1 });
|
||||||
|
userOptions.value = res.data.userList;
|
||||||
|
};
|
||||||
|
// 多选框选中数据
|
||||||
|
const handleSelectionChange = (selection: Array<SpeciesNameInfoData>) => {
|
||||||
|
state.ids = selection.map((item) => item.id);
|
||||||
|
single.value = selection.length != 1;
|
||||||
|
multiple.value = !selection.length;
|
||||||
|
};
|
||||||
|
const handleAdd = () => {
|
||||||
|
editRef.value.openDialog();
|
||||||
|
};
|
||||||
|
const handleUpdate = (row: SpeciesNameTableColumns | null) => {
|
||||||
|
if (!row) {
|
||||||
|
row = state.tableData.data.find((item: SpeciesNameTableColumns) => {
|
||||||
|
return item.id === state.ids[0];
|
||||||
|
}) as SpeciesNameTableColumns;
|
||||||
|
}
|
||||||
|
editRef.value.openDialog(toRaw(row));
|
||||||
|
};
|
||||||
|
const handleDelete = (row: SpeciesNameTableColumns | null) => {
|
||||||
|
let msg = '你确定要删除所选数据?';
|
||||||
|
let id: number[] = [];
|
||||||
|
if (row) {
|
||||||
|
msg = `此操作将永久删除数据,是否继续?`;
|
||||||
|
id = [row.id];
|
||||||
|
} else {
|
||||||
|
id = state.ids;
|
||||||
|
}
|
||||||
|
if (id.length === 0) {
|
||||||
|
ElMessage.error('请选择要删除的数据。');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
ElMessageBox.confirm(msg, '提示', {
|
||||||
|
confirmButtonText: '确认',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
delSpeciesName(id).then(() => {
|
||||||
|
ElMessage.success('删除成功');
|
||||||
|
speciesNameList();
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
};
|
||||||
|
</script>
|
55
src/views/businesses/speciesName/type/index.ts
Normal file
55
src/views/businesses/speciesName/type/index.ts
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
export interface SpeciesNameTableColumns {
|
||||||
|
id: number; // 主键
|
||||||
|
speciesCode: string; // 物种编号
|
||||||
|
name: string; // 物种名称
|
||||||
|
content: string; // 物种名称内容
|
||||||
|
sourcesData: string; // 数据来源
|
||||||
|
createUser: number; // 数据采集人
|
||||||
|
createDate: string; // 数据采集信息
|
||||||
|
auditUser: number; // 数据核查人
|
||||||
|
auditDate: string; // 数据核查日期
|
||||||
|
remark: string; // 备注
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SpeciesNameInfoData {
|
||||||
|
id: number | undefined; // 主键
|
||||||
|
speciesCode: string | undefined; // 物种编号
|
||||||
|
name: string | undefined; // 物种名称
|
||||||
|
content: string | undefined; // 物种名称内容
|
||||||
|
sourcesData: string | undefined; // 数据来源
|
||||||
|
createUser: number | undefined; // 数据采集人
|
||||||
|
createDate: string | undefined; // 数据采集信息
|
||||||
|
auditUser: number | undefined; // 数据核查人
|
||||||
|
auditDate: string | undefined; // 数据核查日期
|
||||||
|
remark: string | undefined; // 备注
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SpeciesNameTableDataState {
|
||||||
|
ids: any[];
|
||||||
|
tableData: {
|
||||||
|
data: Array<SpeciesNameTableColumns>;
|
||||||
|
total: number;
|
||||||
|
loading: boolean;
|
||||||
|
param: {
|
||||||
|
pageNum: number;
|
||||||
|
pageSize: number;
|
||||||
|
id: number | undefined;
|
||||||
|
speciesCode: string | undefined;
|
||||||
|
name: string | undefined;
|
||||||
|
content: string | undefined;
|
||||||
|
sourcesData: string | undefined;
|
||||||
|
createUser: number | undefined;
|
||||||
|
createDate: string | undefined;
|
||||||
|
auditUser: number | undefined;
|
||||||
|
auditDate: string | undefined;
|
||||||
|
dateRange: string[];
|
||||||
|
};
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SpeciesNameEditState {
|
||||||
|
loading: boolean;
|
||||||
|
isShowDialog: boolean;
|
||||||
|
formData: SpeciesNameInfoData;
|
||||||
|
rules: object;
|
||||||
|
}
|
@ -1,16 +0,0 @@
|
|||||||
import {defineComponent,h} from "vue";
|
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name:"baiduMap",
|
|
||||||
props:{
|
|
||||||
src:{
|
|
||||||
type:String,
|
|
||||||
default:'',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
setup(prop){
|
|
||||||
return ()=>{
|
|
||||||
return h('script',{src:prop.src,type:'text/javascript'})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
@ -117,7 +117,7 @@ const state = reactive({
|
|||||||
isShowPassword: false,
|
isShowPassword: false,
|
||||||
ruleForm: {
|
ruleForm: {
|
||||||
username: 'demo',
|
username: 'demo',
|
||||||
password: '123456',
|
password: 'Demo123',
|
||||||
verifyCode: '',
|
verifyCode: '',
|
||||||
verifyKey:''
|
verifyKey:''
|
||||||
},
|
},
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, defineComponent, onMounted } from 'vue';
|
import { ref, onMounted } from 'vue';
|
||||||
import QRCode from 'qrcodejs2-fixes';
|
import QRCode from 'qrcodejs2-fixes';
|
||||||
defineOptions({ name: "loginScan"})
|
defineOptions({ name: "loginScan"})
|
||||||
const qrcodeRef = ref<HTMLElement | null>(null);
|
const qrcodeRef = ref<HTMLElement | null>(null);
|
||||||
|
@ -14,24 +14,11 @@
|
|||||||
<el-tab-pane :label="$t('message.label.one1')" name="account">
|
<el-tab-pane :label="$t('message.label.one1')" name="account">
|
||||||
<Account />
|
<Account />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane :label="$t('message.label.two2')" name="mobile">
|
<!-- <el-tab-pane :label="$t('message.label.two2')" name="mobile">
|
||||||
<Mobile />
|
<Mobile />
|
||||||
</el-tab-pane>
|
</el-tab-pane> -->
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
<Scan v-if="isScan" />
|
|
||||||
<div class="login-content-main-sacn" @click="isScan = !isScan">
|
|
||||||
<i class="iconfont" :class="isScan ? 'icon-diannao1' : 'icon-barcode-qr'"></i>
|
|
||||||
<div class="login-content-main-sacn-delta"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="login-footer">
|
|
||||||
<div class="login-footer-content mt15">
|
|
||||||
<div class="login-footer-content-warp">
|
|
||||||
<div>Copyright © 2021-2023 g-fast.cn All Rights Reserved.</div>
|
|
||||||
<div class="mt5">云南奇讯科技有限公司版权所有</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -39,15 +26,12 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { toRefs, reactive, computed, defineComponent, onMounted } from 'vue';
|
import { toRefs, reactive, computed, onMounted } from 'vue';
|
||||||
import { storeToRefs } from 'pinia';
|
import { storeToRefs } from 'pinia';
|
||||||
import { useThemeConfig } from '/@/stores/themeConfig';
|
import { useThemeConfig } from '/@/stores/themeConfig';
|
||||||
import logoMini from '/@/assets/logo-mini.svg';
|
import logoMini from '/@/assets/logo-mini.svg';
|
||||||
import loginIconTwo from '/@/assets/login-icon-two.svg';
|
|
||||||
import { NextLoading } from '/@/utils/loading';
|
import { NextLoading } from '/@/utils/loading';
|
||||||
import Account from '/@/views/login/component/account.vue';
|
import Account from '/@/views/login/component/account.vue';
|
||||||
import Mobile from '/@/views/login/component/mobile.vue';
|
|
||||||
import Scan from '/@/views/login/component/scan.vue';
|
|
||||||
|
|
||||||
// 定义接口来定义对象的类型
|
// 定义接口来定义对象的类型
|
||||||
interface LoginState {
|
interface LoginState {
|
||||||
|
@ -1,164 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="notice-bar-container">
|
|
||||||
<el-card shadow="hover" header="滚动通知栏:默认">
|
|
||||||
<NoticeBar
|
|
||||||
text="🎉🎉🔥基于vue3.x 、Typescript、vite、Element plus等,适配手机、平板、pc
|
|
||||||
的后台开源免费模板库(vue2.x请切换vue-prev-admin分支),仓库地址:https://gitee.com/lyt-top/vue-next-admin"
|
|
||||||
/>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card shadow="hover" header="滚动通知栏:设置样式" class="mt15">
|
|
||||||
<NoticeBar
|
|
||||||
text="🎉🎉🔥基于vue3.x 、Typescript、vite、Element plus等,适配手机、平板、pc
|
|
||||||
的后台开源免费模板库(vue2.x请切换vue-prev-admin分支),仓库地址:https://gitee.com/lyt-top/vue-next-admin"
|
|
||||||
leftIcon="iconfont icon-tongzhi2"
|
|
||||||
rightIcon="ele-ArrowRight"
|
|
||||||
background="#ecf5ff"
|
|
||||||
color="#409eff"
|
|
||||||
/>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card shadow="hover" header="滚动通知栏:搭配 NoticeBar 和 Carousel 走马灯 组件可以实现垂直滚动的效果" class="mt15">
|
|
||||||
<NoticeBar :scrollable="true">
|
|
||||||
<el-carousel height="40px" direction="vertical" :autoplay="true" indicator-position="none" :interval="3000">
|
|
||||||
<el-carousel-item v-for="v in noticeList" :key="v">{{ v }} </el-carousel-item>
|
|
||||||
</el-carousel>
|
|
||||||
</NoticeBar>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card shadow="hover" header="滚动通知栏:参数" class="mt15">
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
|
||||||
<el-table-column prop="a1" label="参数"> </el-table-column>
|
|
||||||
<el-table-column prop="a2" label="说明"> </el-table-column>
|
|
||||||
<el-table-column prop="a3" label="类型"> </el-table-column>
|
|
||||||
<el-table-column prop="a4" label="可选值"> </el-table-column>
|
|
||||||
<el-table-column prop="a5" label="默认值"> </el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card shadow="hover" header="图标选择器(宽度自动):事件" class="mt15">
|
|
||||||
<el-table :data="tableData1" style="width: 100%">
|
|
||||||
<el-table-column prop="a1" label="事件名称"> </el-table-column>
|
|
||||||
<el-table-column prop="a2" label="说明"> </el-table-column>
|
|
||||||
<el-table-column prop="a3" label="类型"> </el-table-column>
|
|
||||||
<el-table-column prop="a4" label="回调参数"> </el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</el-card>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { toRefs, reactive, defineComponent } from 'vue';
|
|
||||||
import NoticeBar from '/@/components/noticeBar/index.vue';
|
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name: 'makeNoticeBar',
|
|
||||||
components: { NoticeBar },
|
|
||||||
setup() {
|
|
||||||
const state = reactive({
|
|
||||||
noticeList: [
|
|
||||||
'🎉🎉🔥基于vue3.x 、Typescript、vite、Element plus等',
|
|
||||||
'适配手机、平板、pc的后台开源免费模板库(vue2.x请切换vue-prev-admin分支)',
|
|
||||||
'仓库地址:https://gitee.com/lyt-top/vue-next-admin',
|
|
||||||
'演示地址:https://lyt-top.gitee.io/vue-next-admin-preview/#/login',
|
|
||||||
],
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
a1: 'mode',
|
|
||||||
a2: '通知栏模式,用于右侧 icon 图标点击',
|
|
||||||
a3: 'string',
|
|
||||||
a4: 'closeable / link',
|
|
||||||
a5: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'text',
|
|
||||||
a2: '通知文本内容,scrollable 为 false 时生效',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'color',
|
|
||||||
a2: '通知文本颜色',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '#e6a23c',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'background',
|
|
||||||
a2: '通知背景色',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '#fdf6ec',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'size',
|
|
||||||
a2: '字体大小,单位px',
|
|
||||||
a3: 'number / string',
|
|
||||||
a4: '',
|
|
||||||
a5: '14',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'height',
|
|
||||||
a2: '通知栏高度,单位px',
|
|
||||||
a3: 'number / string',
|
|
||||||
a4: '',
|
|
||||||
a5: '40',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'delay',
|
|
||||||
a2: '动画延迟时间 (s)',
|
|
||||||
a3: 'number / string',
|
|
||||||
a4: '',
|
|
||||||
a5: '1',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'speed',
|
|
||||||
a2: '滚动速率 (px/s)',
|
|
||||||
a3: 'number / string',
|
|
||||||
a4: '',
|
|
||||||
a5: '100',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'scrollable',
|
|
||||||
a2: '是否开启垂直滚动',
|
|
||||||
a3: 'boolean',
|
|
||||||
a4: 'true',
|
|
||||||
a5: 'false',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'leftIcon',
|
|
||||||
a2: '自定义左侧图标',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'rightIcon',
|
|
||||||
a2: '自定义右侧图标',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
tableData1: [
|
|
||||||
{
|
|
||||||
a1: 'close',
|
|
||||||
a2: '通知栏模式(mode)closeable 时回调事件',
|
|
||||||
a3: 'function',
|
|
||||||
a4: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'link',
|
|
||||||
a2: '通知栏模式(mode)link 时回调事件',
|
|
||||||
a3: 'function',
|
|
||||||
a4: '',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
return {
|
|
||||||
...toRefs(state),
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
|
@ -1,126 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="selector-container">
|
|
||||||
<el-card shadow="hover" header="图标选择器(宽度自动):">
|
|
||||||
<IconSelector @get="onGetIcon" @clear="onClearIcon" v-model="modelIcon" />
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card shadow="hover" header="图标选择器(宽度自动):参数" class="mt15">
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
|
||||||
<el-table-column prop="a1" label="参数"> </el-table-column>
|
|
||||||
<el-table-column prop="a2" label="说明"> </el-table-column>
|
|
||||||
<el-table-column prop="a3" label="类型"> </el-table-column>
|
|
||||||
<el-table-column prop="a4" label="可选值"> </el-table-column>
|
|
||||||
<el-table-column prop="a5" label="默认值"> </el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card shadow="hover" header="图标选择器(宽度自动):事件" class="mt15">
|
|
||||||
<el-table :data="tableData1" style="width: 100%">
|
|
||||||
<el-table-column prop="a1" label="事件名称"> </el-table-column>
|
|
||||||
<el-table-column prop="a2" label="说明"> </el-table-column>
|
|
||||||
<el-table-column prop="a3" label="类型"> </el-table-column>
|
|
||||||
<el-table-column prop="a4" label="回调参数"> </el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</el-card>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { toRefs, reactive, defineComponent } from 'vue';
|
|
||||||
import IconSelector from '/@/components/iconSelector/index.vue';
|
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name: 'makeSelector',
|
|
||||||
components: { IconSelector },
|
|
||||||
setup() {
|
|
||||||
const state = reactive({
|
|
||||||
modelIcon: '',
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
a1: 'prepend',
|
|
||||||
a2: '输入框前置内容,只能字体图标',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: 'ele-Pointer',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'placeholder',
|
|
||||||
a2: '输入框占位文本',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '请输入内容搜索图标或者选择图标',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'size',
|
|
||||||
a2: '尺寸',
|
|
||||||
a3: 'string',
|
|
||||||
a4: 'large / default / small',
|
|
||||||
a5: 'default',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'title',
|
|
||||||
a2: '弹窗标题',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '请选择图标',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'type',
|
|
||||||
a2: 'icon 图标类型',
|
|
||||||
a3: 'string',
|
|
||||||
a4: 'ali / ele / awe / all',
|
|
||||||
a5: 'ele',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'disabled',
|
|
||||||
a2: '禁用',
|
|
||||||
a3: 'boolean',
|
|
||||||
a4: 'true',
|
|
||||||
a5: 'false',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'clearable',
|
|
||||||
a2: '是否可清空',
|
|
||||||
a3: 'boolean',
|
|
||||||
a4: 'false',
|
|
||||||
a5: 'true',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'emptyDescription',
|
|
||||||
a2: '自定义空状态描述文字',
|
|
||||||
a3: 'String',
|
|
||||||
a4: '',
|
|
||||||
a5: '无相关图标',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
tableData1: [
|
|
||||||
{
|
|
||||||
a1: 'get',
|
|
||||||
a2: '获取当前点击的 icon 图标',
|
|
||||||
a3: 'function',
|
|
||||||
a4: '(icon: string)',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'clear',
|
|
||||||
a2: '清空当前点击的 icon 图标',
|
|
||||||
a3: 'function',
|
|
||||||
a4: '(icon: string)',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
// 获取当前点击的 icon 图标
|
|
||||||
const onGetIcon = (icon: string) => {
|
|
||||||
console.log(icon);
|
|
||||||
};
|
|
||||||
// 清空当前点击的 icon 图标
|
|
||||||
const onClearIcon = (icon: string) => {
|
|
||||||
console.log(icon);
|
|
||||||
};
|
|
||||||
return {
|
|
||||||
onGetIcon,
|
|
||||||
onClearIcon,
|
|
||||||
...toRefs(state),
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
|
@ -1,59 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="svg-demo-container">
|
|
||||||
<el-card shadow="hover" header="svgIcon:演示(支持本地svg)">
|
|
||||||
<SvgIcon name="iconfont icon-shuju1" color="red" :size="30" />
|
|
||||||
<SvgIcon name="ele-Trophy" color="var(--el-color-primary)" :size="30" />
|
|
||||||
<SvgIcon name="fa fa-flag-checkered" color="#09f" :size="30" />
|
|
||||||
<SvgIcon :name="logoMini" color="#09f" :size="30" />
|
|
||||||
</el-card>
|
|
||||||
<el-card shadow="hover" header="svgIcon:参数" class="mt15">
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
|
||||||
<el-table-column prop="a1" label="参数"> </el-table-column>
|
|
||||||
<el-table-column prop="a2" label="说明"> </el-table-column>
|
|
||||||
<el-table-column prop="a3" label="类型"> </el-table-column>
|
|
||||||
<el-table-column prop="a4" label="可选值"> </el-table-column>
|
|
||||||
<el-table-column prop="a5" label="默认值"> </el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</el-card>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { toRefs, reactive, defineComponent } from 'vue';
|
|
||||||
import logoMini from '/@/assets/logo-mini.svg';
|
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name: 'makeSvgDemo',
|
|
||||||
setup() {
|
|
||||||
const state = reactive({
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
a1: 'name',
|
|
||||||
a2: 'svg 图标组件名字 / svg 路径 url',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'size',
|
|
||||||
a2: 'svg 大小',
|
|
||||||
a3: 'number',
|
|
||||||
a4: '',
|
|
||||||
a5: 14,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
a1: 'color',
|
|
||||||
a2: 'svg 颜色',
|
|
||||||
a3: 'string',
|
|
||||||
a4: '',
|
|
||||||
a5: '',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
return {
|
|
||||||
logoMini,
|
|
||||||
...toRefs(state),
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
|
@ -1,127 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<el-card>
|
|
||||||
<el-alert type="error" title="消息队列测试,先生产一条消息再订阅,先订阅不存在的topic会失败" :closable="false"></el-alert>
|
|
||||||
<el-row :gutter="20" style="margin-top: 20px;">
|
|
||||||
<el-col :span="10">
|
|
||||||
<div class="my-title">生产者</div>
|
|
||||||
<el-form :label-width="80">
|
|
||||||
<el-form-item label="topic">
|
|
||||||
<el-input v-model="demoForm.topic" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="topic">
|
|
||||||
<el-input v-model="demoForm.body" type="textarea" :rows="6" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" size="default" @click="handleProduce">生产消息</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="14">
|
|
||||||
<div class="my-title">消费者</div>
|
|
||||||
<el-form :label-width="80">
|
|
||||||
<el-form-item label="topic">
|
|
||||||
<el-input v-model="demoForm.topic" :disabled="wsReady" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="channel">
|
|
||||||
<el-input v-model="demoForm.channel" :disabled="wsReady" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button size="default" type="primary" @click="handleStartSubscribe" :disabled="wsReady">订阅消费</el-button>
|
|
||||||
<el-button size="default" type="primary" @click="handleUnSubscribe" :disabled="!wsReady">取消订阅</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="消费结果">
|
|
||||||
<el-input :model-value="messageResult" type="textarea" :rows="12"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-card>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
import {reactive, ref} from "vue";
|
|
||||||
import {ElMessageBox} from "element-plus";
|
|
||||||
import request from "/@/utils/request";
|
|
||||||
|
|
||||||
const demoForm = reactive({
|
|
||||||
topic: "producer_topic_test",
|
|
||||||
body: "测试消息队列内容",
|
|
||||||
channel: "channel1"
|
|
||||||
})
|
|
||||||
const consumerForm = reactive({
|
|
||||||
topic:"producer_topic_test",
|
|
||||||
channel:"channel1"
|
|
||||||
})
|
|
||||||
|
|
||||||
function handleProduce(){
|
|
||||||
request({
|
|
||||||
url: '/api/v1/mqueue/demo/produce',
|
|
||||||
method: 'post',
|
|
||||||
data: {topic:demoForm.topic,body:demoForm.body}
|
|
||||||
}).then((res:any)=>{
|
|
||||||
window.console.log(res)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
const webSocketURL = import.meta.env.VITE_WEBSOCKET_URL
|
|
||||||
const messageResult = ref("")
|
|
||||||
let ws:WebSocket|null = null
|
|
||||||
const wsReady = ref(false)
|
|
||||||
function handleStartSubscribe(){
|
|
||||||
if(ws) return
|
|
||||||
const url = webSocketURL+"api/v1/mqueue/demo/subscribe?topic="+demoForm.topic+"&channel="+demoForm.channel;
|
|
||||||
ws = new WebSocket(url);
|
|
||||||
try {
|
|
||||||
// ws连接成功
|
|
||||||
ws.onopen = function () {
|
|
||||||
messageResult.value += "WebSocket Server [" + url +"] 连接成功!\r\n";
|
|
||||||
wsReady.value = true
|
|
||||||
};
|
|
||||||
// ws连接关闭
|
|
||||||
ws.onclose = function () {
|
|
||||||
if (ws) {
|
|
||||||
ws.close();
|
|
||||||
ws = null;
|
|
||||||
wsReady.value = false
|
|
||||||
}
|
|
||||||
messageResult.value += "WebSocket Server [" + url +"] 连接被服务器关闭!\r\n";
|
|
||||||
};
|
|
||||||
// ws连接错误
|
|
||||||
ws.onerror = function () {
|
|
||||||
if (ws) {
|
|
||||||
ws.close();
|
|
||||||
ws = null;
|
|
||||||
wsReady.value = false
|
|
||||||
}
|
|
||||||
messageResult.value += "WebSocket Server [" + url +"] 连接错误!\r\n";
|
|
||||||
};
|
|
||||||
// ws数据返回处理
|
|
||||||
ws.onmessage = function (result) {
|
|
||||||
window.console.log(result)
|
|
||||||
messageResult.value += " > " + result.data+"\r\n";
|
|
||||||
};
|
|
||||||
} catch (e:any) {
|
|
||||||
ElMessageBox.alert(e.message)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleUnSubscribe(){
|
|
||||||
if(ws) {
|
|
||||||
ws.close()
|
|
||||||
ws = null;
|
|
||||||
wsReady.value = false
|
|
||||||
messageResult.value += "已手动取消订阅!\r\n";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.my-title{
|
|
||||||
font-size: 16px; font-weight: bold;line-height: 2;
|
|
||||||
color: #1890ff;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -1,387 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="personal">
|
|
||||||
<el-row>
|
|
||||||
<!-- 个人信息 -->
|
|
||||||
<el-col :xs="24" :sm="16">
|
|
||||||
<el-card shadow="hover" header="个人信息">
|
|
||||||
<div class="personal-user">
|
|
||||||
<div class="personal-user-left">
|
|
||||||
<el-upload class="h100 personal-user-left-upload" action="https://jsonplaceholder.typicode.com/posts/" multiple :limit="1">
|
|
||||||
<img src="https://img2.baidu.com/it/u=1978192862,2048448374&fm=253&fmt=auto&app=138&f=JPEG?w=504&h=500" />
|
|
||||||
</el-upload>
|
|
||||||
</div>
|
|
||||||
<div class="personal-user-right">
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="24" class="personal-title mb18">{{ currentTime }},admin,生活变的再糟糕,也不妨碍我变得更好! </el-col>
|
|
||||||
<el-col :span="24">
|
|
||||||
<el-row>
|
|
||||||
<el-col :xs="24" :sm="8" class="personal-item mb6">
|
|
||||||
<div class="personal-item-label">昵称:</div>
|
|
||||||
<div class="personal-item-value">小柒</div>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="16" class="personal-item mb6">
|
|
||||||
<div class="personal-item-label">身份:</div>
|
|
||||||
<div class="personal-item-value">超级管理</div>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="24">
|
|
||||||
<el-row>
|
|
||||||
<el-col :xs="24" :sm="8" class="personal-item mb6">
|
|
||||||
<div class="personal-item-label">登录IP:</div>
|
|
||||||
<div class="personal-item-value">192.168.1.1</div>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="16" class="personal-item mb6">
|
|
||||||
<div class="personal-item-label">登录时间:</div>
|
|
||||||
<div class="personal-item-value">2021-02-05 18:47:26</div>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-card>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<!-- 消息通知 -->
|
|
||||||
<el-col :xs="24" :sm="8" class="pl15 personal-info">
|
|
||||||
<el-card shadow="hover">
|
|
||||||
<template #header>
|
|
||||||
<span>消息通知</span>
|
|
||||||
<span class="personal-info-more">更多</span>
|
|
||||||
</template>
|
|
||||||
<div class="personal-info-box">
|
|
||||||
<ul class="personal-info-ul">
|
|
||||||
<li v-for="(v, k) in newsInfoList" :key="k" class="personal-info-li">
|
|
||||||
<a :href="v.link" target="_block" class="personal-info-li-title">{{ v.title }}</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</el-card>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<!-- 营销推荐 -->
|
|
||||||
<el-col :span="24">
|
|
||||||
<el-card shadow="hover" class="mt15" header="营销推荐">
|
|
||||||
<el-row :gutter="15" class="personal-recommend-row">
|
|
||||||
<el-col :sm="6" v-for="(v, k) in recommendList" :key="k" class="personal-recommend-col">
|
|
||||||
<div class="personal-recommend" :style="{ 'background-color': v.bg }">
|
|
||||||
<SvgIcon :name="v.icon" :size="70" :style="{ color: v.iconColor }" />
|
|
||||||
<div class="personal-recommend-auto">
|
|
||||||
<div>{{ v.title }}</div>
|
|
||||||
<div class="personal-recommend-msg">{{ v.msg }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-card>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<!-- 更新信息 -->
|
|
||||||
<el-col :span="24">
|
|
||||||
<el-card shadow="hover" class="mt15 personal-edit" header="更新信息">
|
|
||||||
<div class="personal-edit-title">基本信息</div>
|
|
||||||
<el-form :model="personalForm" size="default" label-width="40px" class="mt35 mb35">
|
|
||||||
<el-row :gutter="35">
|
|
||||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
||||||
<el-form-item label="昵称">
|
|
||||||
<el-input v-model="personalForm.name" placeholder="请输入昵称" clearable></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
||||||
<el-form-item label="邮箱">
|
|
||||||
<el-input v-model="personalForm.email" placeholder="请输入邮箱" clearable></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
||||||
<el-form-item label="签名">
|
|
||||||
<el-input v-model="personalForm.autograph" placeholder="请输入签名" clearable></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
||||||
<el-form-item label="职业">
|
|
||||||
<el-select v-model="personalForm.occupation" placeholder="请选择职业" clearable class="w100">
|
|
||||||
<el-option label="计算机 / 互联网 / 通信" value="1"></el-option>
|
|
||||||
<el-option label="生产 / 工艺 / 制造" value="2"></el-option>
|
|
||||||
<el-option label="医疗 / 护理 / 制药" value="3"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
||||||
<el-form-item label="手机">
|
|
||||||
<el-input v-model="personalForm.phone" placeholder="请输入手机" clearable></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
||||||
<el-form-item label="性别">
|
|
||||||
<el-select v-model="personalForm.sex" placeholder="请选择性别" clearable class="w100">
|
|
||||||
<el-option label="男" value="1"></el-option>
|
|
||||||
<el-option label="女" value="2"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary">
|
|
||||||
<el-icon>
|
|
||||||
<ele-Position />
|
|
||||||
</el-icon>
|
|
||||||
更新个人信息
|
|
||||||
</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-form>
|
|
||||||
<div class="personal-edit-title mb15">账号安全</div>
|
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">账户密码</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">当前密码强度:强</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即修改</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">密保手机</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">已绑定手机:132****4108</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即修改</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">密保问题</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">已设置密保问题,账号安全大幅度提升</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即设置</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">绑定QQ</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">已绑定QQ:110****566</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即设置</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-card>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { toRefs, reactive, computed, defineComponent } from 'vue';
|
|
||||||
import { formatAxis } from '/@/utils/formatTime';
|
|
||||||
import { newsInfoList, recommendList } from './mock';
|
|
||||||
|
|
||||||
// 定义接口来定义对象的类型
|
|
||||||
interface PersonalState {
|
|
||||||
newsInfoList: any;
|
|
||||||
recommendList: any;
|
|
||||||
personalForm: any;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name: 'personal',
|
|
||||||
setup() {
|
|
||||||
const state = reactive<PersonalState>({
|
|
||||||
newsInfoList,
|
|
||||||
recommendList,
|
|
||||||
personalForm: {
|
|
||||||
name: '',
|
|
||||||
email: '',
|
|
||||||
autograph: '',
|
|
||||||
occupation: '',
|
|
||||||
phone: '',
|
|
||||||
sex: '',
|
|
||||||
},
|
|
||||||
});
|
|
||||||
// 当前时间提示语
|
|
||||||
const currentTime = computed(() => {
|
|
||||||
return formatAxis(new Date());
|
|
||||||
});
|
|
||||||
return {
|
|
||||||
currentTime,
|
|
||||||
...toRefs(state),
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
@use '../../theme/mixins/index.scss' as *;
|
|
||||||
.personal {
|
|
||||||
.personal-user {
|
|
||||||
height: 130px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
.personal-user-left {
|
|
||||||
width: 100px;
|
|
||||||
height: 130px;
|
|
||||||
border-radius: 3px;
|
|
||||||
:deep(.el-upload) {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.personal-user-left-upload {
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
|
||||||
&:hover {
|
|
||||||
img {
|
|
||||||
animation: logoAnimation 0.3s ease-in-out;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.personal-user-right {
|
|
||||||
flex: 1;
|
|
||||||
padding: 0 15px;
|
|
||||||
.personal-title {
|
|
||||||
font-size: 18px;
|
|
||||||
@include text-ellipsis(1);
|
|
||||||
}
|
|
||||||
.personal-item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 13px;
|
|
||||||
.personal-item-label {
|
|
||||||
color: var(--el-text-color-secondary);
|
|
||||||
@include text-ellipsis(1);
|
|
||||||
}
|
|
||||||
.personal-item-value {
|
|
||||||
@include text-ellipsis(1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.personal-info {
|
|
||||||
.personal-info-more {
|
|
||||||
float: right;
|
|
||||||
color: var(--el-text-color-secondary);
|
|
||||||
font-size: 13px;
|
|
||||||
&:hover {
|
|
||||||
color: var(--el-color-primary);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.personal-info-box {
|
|
||||||
height: 130px;
|
|
||||||
overflow: hidden;
|
|
||||||
.personal-info-ul {
|
|
||||||
list-style: none;
|
|
||||||
.personal-info-li {
|
|
||||||
font-size: 13px;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
.personal-info-li-title {
|
|
||||||
display: inline-block;
|
|
||||||
@include text-ellipsis(1);
|
|
||||||
color: var(--el-text-color-secondary);
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
& a:hover {
|
|
||||||
color: var(--el-color-primary);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.personal-recommend-row {
|
|
||||||
.personal-recommend-col {
|
|
||||||
.personal-recommend {
|
|
||||||
position: relative;
|
|
||||||
height: 100px;
|
|
||||||
border-radius: 3px;
|
|
||||||
overflow: hidden;
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover {
|
|
||||||
i {
|
|
||||||
right: 0px !important;
|
|
||||||
bottom: 0px !important;
|
|
||||||
transition: all ease 0.3s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
i {
|
|
||||||
position: absolute;
|
|
||||||
right: -10px;
|
|
||||||
bottom: -10px;
|
|
||||||
font-size: 70px;
|
|
||||||
transform: rotate(-30deg);
|
|
||||||
transition: all ease 0.3s;
|
|
||||||
}
|
|
||||||
.personal-recommend-auto {
|
|
||||||
padding: 15px;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 5%;
|
|
||||||
color: var(--next-color-white);
|
|
||||||
.personal-recommend-msg {
|
|
||||||
font-size: 12px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.personal-edit {
|
|
||||||
.personal-edit-title {
|
|
||||||
position: relative;
|
|
||||||
padding-left: 10px;
|
|
||||||
color: var(--el-text-color-regular);
|
|
||||||
&::after {
|
|
||||||
content: '';
|
|
||||||
width: 2px;
|
|
||||||
height: 10px;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
background: var(--el-color-primary);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.personal-edit-safe-box {
|
|
||||||
border-bottom: 1px solid var(--el-border-color-light, #ebeef5);
|
|
||||||
padding: 15px 0;
|
|
||||||
.personal-edit-safe-item {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
.personal-edit-safe-item-left {
|
|
||||||
flex: 1;
|
|
||||||
overflow: hidden;
|
|
||||||
.personal-edit-safe-item-left-label {
|
|
||||||
color: var(--el-text-color-regular);
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
.personal-edit-safe-item-left-value {
|
|
||||||
color: var(--el-text-color-secondary);
|
|
||||||
@include text-ellipsis(1);
|
|
||||||
margin-right: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&:last-of-type {
|
|
||||||
padding-bottom: 0;
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -1,66 +0,0 @@
|
|||||||
/**
|
|
||||||
* 消息通知
|
|
||||||
* @returns 返回模拟数据
|
|
||||||
*/
|
|
||||||
export const newsInfoList: Array<object> = [
|
|
||||||
{
|
|
||||||
title: '[发布] 2021年02月28日发布基于 vue3.x + vite v1.0.0 版本',
|
|
||||||
date: '02/28',
|
|
||||||
link: 'https://gitee.com/lyt-top/vue-next-admin',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '[发布] 2021年04月15日发布 vue2.x + webpack 重构版本',
|
|
||||||
date: '04/15',
|
|
||||||
link: 'https://gitee.com/lyt-top/vue-next-admin/tree/vue-prev-admin/',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '[重构] 2021年04月10日 重构 vue2.x + webpack v1.0.0 版本',
|
|
||||||
date: '04/10',
|
|
||||||
link: 'https://gitee.com/lyt-top/vue-next-admin/tree/vue-prev-admin/',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '[预览] 2020年12月08日,基于 vue3.x 版本后台模板的预览',
|
|
||||||
date: '12/08',
|
|
||||||
link: 'http://lyt-top.gitee.io/vue-next-admin-preview/#/login',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '[预览] 2020年11月15日,基于 vue2.x 版本后台模板的预览',
|
|
||||||
date: '11/15',
|
|
||||||
link: 'https://lyt-top.gitee.io/vue-prev-admin-preview/#/login',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 营销推荐
|
|
||||||
* @returns 返回模拟数据
|
|
||||||
*/
|
|
||||||
export const recommendList: Array<object> = [
|
|
||||||
{
|
|
||||||
title: '优惠券',
|
|
||||||
msg: '现金券、折扣券、营销必备',
|
|
||||||
icon: 'ele-Food',
|
|
||||||
bg: '#48D18D',
|
|
||||||
iconColor: '#64d89d',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '多人拼团',
|
|
||||||
msg: '社交电商、开辟流量',
|
|
||||||
icon: 'ele-ShoppingCart',
|
|
||||||
bg: '#F95959',
|
|
||||||
iconColor: '#F86C6B',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '分销中心',
|
|
||||||
msg: '轻松招募分销员,成功推广奖励',
|
|
||||||
icon: 'ele-School',
|
|
||||||
bg: '#8595F4',
|
|
||||||
iconColor: '#92A1F4',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '秒杀',
|
|
||||||
msg: '超低价抢购引导更多销量',
|
|
||||||
icon: 'ele-AlarmClock',
|
|
||||||
bg: '#FEBB50',
|
|
||||||
iconColor: '#FDC566',
|
|
||||||
},
|
|
||||||
];
|
|
@ -2,7 +2,7 @@
|
|||||||
<div class="personal">
|
<div class="personal">
|
||||||
<el-row>
|
<el-row>
|
||||||
<!-- 个人信息 -->
|
<!-- 个人信息 -->
|
||||||
<el-col :xs="24" :sm="16">
|
<el-col :xs="24" :sm="24">
|
||||||
<el-card shadow="hover" header="个人信息">
|
<el-card shadow="hover" header="个人信息">
|
||||||
<div class="personal-user">
|
<div class="personal-user">
|
||||||
<div class="personal-user-left">
|
<div class="personal-user-left">
|
||||||
@ -64,7 +64,7 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<!-- 消息通知 -->
|
<!-- 消息通知 -->
|
||||||
<el-col :xs="24" :sm="8" class="pl15 personal-info">
|
<!-- <el-col :xs="24" :sm="8" class="pl15 personal-info">
|
||||||
<el-card shadow="hover">
|
<el-card shadow="hover">
|
||||||
<template #header>
|
<template #header>
|
||||||
<span>消息通知</span>
|
<span>消息通知</span>
|
||||||
@ -78,10 +78,10 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col> -->
|
||||||
|
|
||||||
<!-- 营销推荐 -->
|
<!-- 营销推荐 -->
|
||||||
<el-col :span="24">
|
<!-- <el-col :span="24">
|
||||||
<el-card shadow="hover" class="mt15" header="营销推荐">
|
<el-card shadow="hover" class="mt15" header="营销推荐">
|
||||||
<el-row :gutter="15" class="personal-recommend-row">
|
<el-row :gutter="15" class="personal-recommend-row">
|
||||||
<el-col :sm="6" v-for="(v, k) in recommendList" :key="k" class="personal-recommend-col">
|
<el-col :sm="6" v-for="(v, k) in recommendList" :key="k" class="personal-recommend-col">
|
||||||
@ -95,7 +95,7 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col> -->
|
||||||
|
|
||||||
<!-- 更新信息 -->
|
<!-- 更新信息 -->
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
@ -164,39 +164,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">密保手机</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">已绑定手机:132****4108</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即修改</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">密保问题</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">已设置密保问题,账号安全大幅度提升</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即设置</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-box">
|
|
||||||
<div class="personal-edit-safe-item">
|
|
||||||
<div class="personal-edit-safe-item-left">
|
|
||||||
<div class="personal-edit-safe-item-left-label">绑定QQ</div>
|
|
||||||
<div class="personal-edit-safe-item-left-value">已绑定QQ:110****566</div>
|
|
||||||
</div>
|
|
||||||
<div class="personal-edit-safe-item-right">
|
|
||||||
<el-button text type="primary">立即设置</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Binary file not shown.
Before Width: | Height: | Size: 607 KiB |
Binary file not shown.
Before Width: | Height: | Size: 783 KiB |
@ -1,51 +0,0 @@
|
|||||||
// 地图模拟数据
|
|
||||||
export const echartsMapList: Array<object> = [
|
|
||||||
{ name: '深圳市人民政府', value: '100' },
|
|
||||||
{ name: '莲花山公园', value: '100' },
|
|
||||||
{ name: '世界之窗', value: '100' },
|
|
||||||
{ name: '华侨城欢乐谷', value: '100' },
|
|
||||||
{ name: '宝安区西乡', value: '100' },
|
|
||||||
];
|
|
||||||
|
|
||||||
// 地图经纬度数据
|
|
||||||
export const echartsMapData: object = {
|
|
||||||
深圳市人民政府: [114.064524, 22.549225],
|
|
||||||
莲花山公园: [114.0658, 22.560072],
|
|
||||||
世界之窗: [113.979419, 22.540579],
|
|
||||||
华侨城欢乐谷: [113.986066, 22.548056],
|
|
||||||
宝安区西乡: [113.869053, 22.581714],
|
|
||||||
};
|
|
||||||
|
|
||||||
// 地图图片显示
|
|
||||||
export const echartsMapImgs: Array<object> = [
|
|
||||||
{
|
|
||||||
url: 'https://img1.baidu.com/it/u=4244861097,3561366422&fm=11&fmt=auto&gp=0.jpg',
|
|
||||||
name: '深圳市人民政府',
|
|
||||||
add: '深圳市福田区福中三路市民中心C区',
|
|
||||||
dec: '深圳市人民政府是根据《中华人民共和国地方各级人民代表大会和地方各级人民政府组织法》设立的,是深圳市人民代表大会的执行机关,是深圳市的国家行政机关。',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: 'https://img1.baidu.com/it/u=3793608028,4006842751&fm=26&fmt=auto&gp=0.jpg',
|
|
||||||
name: '莲花山公园',
|
|
||||||
add: '广东省深圳市福田区莲花街道莲花北社区红荔路6030号',
|
|
||||||
dec: '莲花山公园筹建于1992年10月10日 ,1997年6月23日正式对外局部开放。',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: 'https://img0.baidu.com/it/u=1406340112,1927292660&fm=26&fmt=auto&gp=0.jpg',
|
|
||||||
name: '世界之窗',
|
|
||||||
add: '深圳市南山区深南大道9037号',
|
|
||||||
dec: '这里,世界首座实景拍摄悬空式球幕影院“飞跃美利坚””,为游客提供集休闲放松于一体的都市时尚生活空间。',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: 'https://img0.baidu.com/it/u=3042342330,902556630&fm=26&fmt=auto&gp=0.jpg',
|
|
||||||
name: '华侨城欢乐谷',
|
|
||||||
add: '广东省深圳市南山区沙河街道星河街社区侨城西街1号',
|
|
||||||
dec: '深圳欢乐谷注重满足人们参与、体验的新型诱游需求,营造出自然、清新、活泼、惊奇、热烈、刺激的休闲旅游氛围。',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: 'https://img2.baidu.com/it/u=1075072079,1229283519&fm=11&fmt=auto&gp=0.jpg',
|
|
||||||
name: '宝安区西乡',
|
|
||||||
add: '西乡街道下辖25个社区',
|
|
||||||
dec: '西乡街道,隶属于广东省深圳市宝安区,位于宝安区西南部,东接石岩街道,南接新安街道,西至珠江口岸边,北接航城街道。',
|
|
||||||
},
|
|
||||||
];
|
|
@ -1,131 +0,0 @@
|
|||||||
// 顶部下来菜单
|
|
||||||
export const dropdownList: Array<object> = [
|
|
||||||
{
|
|
||||||
label: '广东省农业农村厅',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '广西省农业农村厅',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '四川省农业农村厅',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '湖北省农业农村厅',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '福建省农业农村厅',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '山东省农业农村厅',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '江西省农业农村厅',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
// sky 天气
|
|
||||||
export const skyList: Array<object> = [
|
|
||||||
{
|
|
||||||
v1: '时间',
|
|
||||||
v2: '天气',
|
|
||||||
v3: '温度',
|
|
||||||
v4: '湿度',
|
|
||||||
v5: '降水概率',
|
|
||||||
v6: '风向',
|
|
||||||
v7: '风力',
|
|
||||||
type: 'title',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
v1: '今天',
|
|
||||||
v2: 'ele-Sunny',
|
|
||||||
v3: '20°/26°',
|
|
||||||
v4: '80%',
|
|
||||||
v5: '50%',
|
|
||||||
v6: '东南风',
|
|
||||||
v7: '13m/s',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
v1: '明天',
|
|
||||||
v2: 'ele-Lightning',
|
|
||||||
v3: '20°/26°',
|
|
||||||
v4: '80%',
|
|
||||||
v5: '50%',
|
|
||||||
v6: '东南风',
|
|
||||||
v7: '13m/s',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
v1: '后天',
|
|
||||||
v2: 'ele-Sunny',
|
|
||||||
v3: '20°/26°',
|
|
||||||
v4: '80%',
|
|
||||||
v5: '50%',
|
|
||||||
v6: '东南风',
|
|
||||||
v7: '13m/s',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
// 当前设置状态
|
|
||||||
export const dBtnList: Array<object> = [
|
|
||||||
{
|
|
||||||
v1: '地块A-灌溉',
|
|
||||||
v2: '阳光玫瑰种植',
|
|
||||||
v3: '126天',
|
|
||||||
v4: '设备在线',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
v1: '地块B-收割',
|
|
||||||
v2: '阳光玫瑰种植',
|
|
||||||
v3: '360天',
|
|
||||||
v4: '设备预警',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
// 当前设备监测
|
|
||||||
export const chartData4List: Array<object> = [
|
|
||||||
{
|
|
||||||
label: '温度',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '光照',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '湿度',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '风力',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '张力',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '气压',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
// 3DEarth 地图周围按钮组
|
|
||||||
export const earth3DBtnList: Array<object> = [
|
|
||||||
{
|
|
||||||
topLevelClass: 'fixed-top',
|
|
||||||
icon: 'ele-MagicStick',
|
|
||||||
label: '环境监测',
|
|
||||||
type: 0,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
topLevelClass: 'fixed-right',
|
|
||||||
icon: 'ele-MoonNight',
|
|
||||||
label: '精准管理',
|
|
||||||
type: 1,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
topLevelClass: 'fixed-bottom',
|
|
||||||
icon: 'ele-TrendCharts',
|
|
||||||
label: '数据报表',
|
|
||||||
type: 2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
topLevelClass: 'fixed-left',
|
|
||||||
icon: 'ele-Van',
|
|
||||||
label: '产品追溯',
|
|
||||||
type: 3,
|
|
||||||
},
|
|
||||||
];
|
|
@ -69,6 +69,6 @@
|
|||||||
"skipLibCheck": true /* Skip type checking of declaration files. */,
|
"skipLibCheck": true /* Skip type checking of declaration files. */,
|
||||||
"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
|
"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
|
||||||
},
|
},
|
||||||
"include": ["src/**/*.ts", "src/**/*.vue", "src/**/*.tsx", "src/**/*.d.ts"], // **Represents any directory, and * represents any file. Indicates that all files in the src directory will be compiled
|
"include": ["src/**/*.ts", "src/**/*.vue", "src/**/*.tsx", "src/**/*.d.ts", "shim.d.ts"], // **Represents any directory, and * represents any file. Indicates that all files in the src directory will be compiled
|
||||||
"exclude": ["node_modules", "dist"] // Indicates the file directory that does not need to be compiled
|
"exclude": ["node_modules", "dist"] // Indicates the file directory that does not need to be compiled
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user