Compare commits
No commits in common. "4f29a9f5ad58e6cbeb2e1de282f66499bb72d22b" and "43501524881dbe59295f8aa2a52a490d14cf2096" have entirely different histories.
4f29a9f5ad
...
4350152488
288
.vscode/launch.json
vendored
Normal file
288
.vscode/launch.json
vendored
Normal file
@ -0,0 +1,288 @@
|
||||
{
|
||||
// 使用 IntelliSense 了解相关属性。
|
||||
// 悬停以查看现有属性的描述。
|
||||
// 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
|
||||
{
|
||||
"name": "Debug Edge",
|
||||
"request": "launch",
|
||||
"type": "msedge",
|
||||
"url": "http://localhost:80",
|
||||
"webRoot": "${workspaceFolder}",
|
||||
},
|
||||
{
|
||||
"name": "dev:h5",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:h5"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:app",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:app"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:app-android",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:app-android"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:app-ios",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:app-ios"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:custom",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:custom"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:h5:ssr",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:h5:ssr"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-alipay",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-alipay"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-baidu",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-baidu"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-jd",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-jd"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-kuaishou",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-kuaishou"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-lark",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-lark"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-qq",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-qq"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-toutiao",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-toutiao"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:mp-weixin",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:mp-weixin"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:quickapp-webview",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:quickapp-webview"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:quickapp-webview-huawei",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:quickapp-webview-huawei"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "dev:quickapp-webview-union",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "dev:quickapp-webview-union"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:app",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:app"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:app-android",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:app-android"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:app-ios",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:app-ios"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:custom",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:custom"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:h5",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:h5"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:h5:ssr",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:h5:ssr"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-alipay",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-alipay"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-baidu",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-baidu"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-jd",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-jd"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-kuaishou",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-kuaishou"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-lark",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-lark"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-qq",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-qq"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-toutiao",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-toutiao"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:mp-weixin",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:mp-weixin"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:quickapp-webview",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:quickapp-webview"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:quickapp-webview-huawei",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:quickapp-webview-huawei"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
},
|
||||
{
|
||||
"name": "build:quickapp-webview-union",
|
||||
"request": "launch",
|
||||
"runtimeArgs": ["run", "build:quickapp-webview-union"],
|
||||
"runtimeExecutable": "npm",
|
||||
"skipFiles": ["<node_internals>/**"],
|
||||
"type": "node"
|
||||
}
|
||||
]
|
||||
}
|
||||
109
App.vue
109
App.vue
@ -1,109 +0,0 @@
|
||||
<script>
|
||||
import {
|
||||
ref,
|
||||
} from 'vue';
|
||||
import {
|
||||
listConvert
|
||||
} from '@/api/system/unitConverter/sysUnitConverter.js';
|
||||
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 1000,
|
||||
unitType: null,
|
||||
unitName: null,
|
||||
baseUnit: null,
|
||||
conversionFactor: null,
|
||||
unitTypeName: null,
|
||||
status: null,
|
||||
unitOrder: null
|
||||
});
|
||||
|
||||
// 保留原有单位换算方法
|
||||
const groupByUnitType = (data) => {
|
||||
if (!data || !Array.isArray(data)) {
|
||||
console.warn('groupByUnitType: 数据为空或不是数组');
|
||||
return {};
|
||||
}
|
||||
|
||||
return data.reduce((acc, unit) => {
|
||||
const type = unit.unitType;
|
||||
if (!acc[type]) acc[type] = [];
|
||||
acc[type].push({
|
||||
id: unit.id,
|
||||
unitType: unit.unitType,
|
||||
unitName: unit.unitName,
|
||||
conversionFactor: unit.conversionFactor,
|
||||
unitOrder: unit.unitOrder,
|
||||
baseUnit: unit.baseUnit,
|
||||
status: unit.status,
|
||||
unitTypeName: unit.unitTypeName
|
||||
});
|
||||
return acc;
|
||||
}, {});
|
||||
};
|
||||
|
||||
const getList = async () => {
|
||||
try {
|
||||
console.log('开始请求单位数据...');
|
||||
const response = await listConvert(queryParams.value);
|
||||
console.log('API响应:', response);
|
||||
|
||||
if (!response || !response.rows) {
|
||||
console.error('API响应格式错误');
|
||||
return;
|
||||
}
|
||||
|
||||
if (response.rows.length === 0) {
|
||||
console.warn('单位数据为空数组');
|
||||
return;
|
||||
}
|
||||
|
||||
const unitDataGrouped = groupByUnitType(response.rows);
|
||||
console.log('分组后的单位数据:', unitDataGrouped);
|
||||
|
||||
// #ifdef APP || APP-PLUS
|
||||
try {
|
||||
// 使用正确的同步写法
|
||||
uni.setStorageSync('unitData', unitDataGrouped);
|
||||
console.log('APP端缓存成功');
|
||||
|
||||
// 立即验证
|
||||
const verifyData = uni.getStorageSync('unitData');
|
||||
console.log('APP缓存验证:', verifyData ? '成功' : '失败', verifyData);
|
||||
} catch (storageError) {
|
||||
console.error('APP缓存设置失败:', storageError);
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
try {
|
||||
localStorage.setItem('unitData', JSON.stringify(unitDataGrouped));
|
||||
console.log('H5端缓存成功');
|
||||
} catch (storageError) {
|
||||
console.error('H5缓存设置失败:', storageError);
|
||||
}
|
||||
// #endif
|
||||
|
||||
} catch (error) {
|
||||
console.error('获取单位数据失败:', error);
|
||||
}
|
||||
};
|
||||
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
console.log('App Launch - 开始初始化');
|
||||
getList();
|
||||
},
|
||||
onShow: function() {
|
||||
console.log('App Show');
|
||||
},
|
||||
onHide: function() {
|
||||
console.log('App Hide');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "uview-plus/index.scss";
|
||||
@import '@/static/scss/index.scss';
|
||||
</style>
|
||||
21
LICENSE
Normal file
21
LICENSE
Normal file
@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2023 哦NO
|
||||
|
||||
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.
|
||||
269
README.md
Normal file
269
README.md
Normal file
@ -0,0 +1,269 @@
|
||||
# RuoYi-App-Geek
|
||||
|
||||
<p align="center">
|
||||
<span>
|
||||
<img alt="logo" src="https://oscimg.oschina.net/oscnet/up-d3d0a9303e11d522a06cd263f3079027715.png">
|
||||
</span>
|
||||
<span>+</span>
|
||||
<span>
|
||||
<img alt="logo" src="./doc/image/logo.png">
|
||||
</span>
|
||||
</p>
|
||||
<h1 align="center" style="margin: 30px 0 30px; font-weight: bold;">RuoYi-Geek v3.8.7.3.2</h1>
|
||||
<h4 align="center">基于SpringBoot3+Vue3前后端分离的Java快速开发框架</h4>
|
||||
<p align="center">
|
||||
<img src="https://img.shields.io/github/license/mashape/apistatus.svg">
|
||||
</p>
|
||||
|
||||
# 引言
|
||||
|
||||
RuoYi-Vue 与 RuoYi-App 是基于 SpringBoot2+Vue2 打造的企业级开发框架，得到了广大开发者的喜爱和积极反馈。随着技术的迭代进步，SpringBoot3 与 Vue3 逐渐进入开发者的视野。为了满足开发者对于新技术的追求，RuoYi 官方文档提供了 SpringBoot2 至 SpringBoot3 的升级方法。与此同时，社区也涌现出了 RuoYi-Vue3、RuoYi-App-Vue3 的版本，展现了开发者社区对于技术升级的热情与努力。
|
||||
|
||||
然而，在升级的过程中，官方的方法为了兼顾 Java1.8 的特性与一些老旧的方法，未完全拥抱**SpringBoot3 与 Java17**的全部特性。而社区的 RuoYi-Vue3、RuoYi-App-Vue3 版本由于出自不同的团队之手，**兼容性及整合性**上存在些许**不足**。更为关键的是，尽管这些版本**支持 TypeScript**，但**缺乏与之相匹配的 tsconfig.json 配置文件**，这使得在主流编辑器如 VSCode 中，TypeScript 的语法提示环境并未达到最佳状态。
|
||||
|
||||
鉴于此，**RuoYi-Geek 生态**应运而生。它旨在为广大开发者提供一个既保留原版本核心特性，又整合社区版优点的全新解决方案。在**RuoYi-Geek**中，我们深入调研了企业开发中常用的 RuoYi 扩展，并直接在框架中集成，确保开发者能够快速上手，高效开发。同时，我们采用了最新的**SpringBoot3+Vue3**技术栈，彻底移除了为了兼容 Java1.8 而保留的老旧方法。更为重要的是，我们为 TypeScript 开发环境加入了常用的 tsconfig.json 配置，使得开发者在 VSCode 等编辑器中能够获得更为舒适、便捷的语法提示体验。
|
||||
|
||||
**RuoYi-Geek**不仅仅是一个简单的升级版本，更是对于 RuoYi 生态的一次全面优化与整合。我们相信，通过**RuoYi-Geek 生态**，开发者将能够更为高效、愉悦地开发出优秀的企业级应用。
|
||||
|
||||
本项目为**RuoYi-Geek 生态**的 RuoYi-App 部分。
|
||||
**注意：**
|
||||
本人的其他两个推荐搭配的项目
|
||||
|
||||
1. [Ruoyi-SpringBoot3-Geek: 这是若依极客生态的后端 Springboot3 版本 (gitee.com)](https://gitee.com/geek-xd/ruoyi-spring-boot3-geek)
|
||||
2. [RuoYi-Vue3-Geek: 这是若依极客生态的 Vue3 版本 (gitee.com)](https://gitee.com/geek-xd/ruo-yi-vue3-geek)
|
||||
|
||||
**与 Ruoyi-App 相比较**
|
||||
|
||||
1. 使用 UniApp+Vue3 的最新框架
|
||||
2. 支持 TS、SCSS、LESS 等对 js 和 css 的扩充语言
|
||||
3. 使用 Pinia 代替 Vuex，更加轻巧简单
|
||||
4. 使用 uView-Plus（好看的 ui） 代替 uView-ui 的 ui 组件库
|
||||
5. 使用 uCharts（方便的图表）画图工具
|
||||
6. 已经完成了分包操作
|
||||
7. 提供了颜色选择器、二维码等常用组件
|
||||
8. 将原有内置工具进行类型标定
|
||||
9. 分别提供了 uview-plus 和 ucharts 的模板（可以直接使用或者用于学习）
|
||||
|
||||
# 快速开始
|
||||
|
||||
**注意：** node 版本需要 16+
|
||||
|
||||
## 迁移到Hbuilder（不依赖Hbuilder的项目不需要迁移）
|
||||
|
||||
1. src路径作为项目根路径
|
||||
2. 将index.html、package.json、vite.config.js、tsconfig.json、.gitignore粘贴到src目录下
|
||||
3. 在src目录下运行npm install
|
||||
4. 修改index.html中的./src/main.js为./main.js
|
||||
5. 在HBuilderX中运行时注意观察是否使用的是Vue3的编译器（若不是请自行查找方法解决，本人对HbuilderX使用不多）
|
||||
|
||||
|
||||
## 安装
|
||||
|
||||
一下三种方式均可，感觉速度 pnpm > yarn > cnpm > npm
|
||||
|
||||
**_Vue3/Vite 版要求 node 版本^14.18.0 || >=16.0.0_**
|
||||
|
||||
```shell
|
||||
npm install
|
||||
cnpm install
|
||||
yarn
|
||||
pnpm install
|
||||
```
|
||||
|
||||
# 启动
|
||||
|
||||
1. 将项目下载到本地
|
||||
2. 初始化项目---进入项目根路径运行指令初始化项目
|
||||
`npm install`
|
||||
3. 运行项目---进入项目根路径运行指令（在 package.json 能找到所有指令）：
|
||||
以微信小程序为例：`npm run dev:mp-weixin`
|
||||
以 H5 为例 ` npm run dev:h5`
|
||||
4. 查看项目 以微信小程序为例：
|
||||
打开微信开发者工具，导入项目路径 dist\dev\mp-weixin
|
||||
以 H5 为例：打开浏览器，输入控制台输出的地址
|
||||
注：公众号属于 H5，以微信公众号为例，打开微信开发者工具，输入控制台输出的地址
|
||||
5. 打包项目---进入项目根路径运行指令（在 package.json 能找到所有指令）：
|
||||
以微信小程序为例：`npm run build:mp-weixin`
|
||||
以 H5 为例： `npm run build:h5`
|
||||
|
||||
### 代码压缩
|
||||
|
||||
默认是启动代码压缩的，
|
||||
|
||||
如果需要关闭代码压缩，可以将 vite.config.js 中的 build.minify 赋值为 false。
|
||||
|
||||
如果需要打开代码压缩，可以将 vite.config.js 中的 build.minify 赋值为 true。
|
||||
|
||||
# 内置组件(geek-xd)
|
||||
|
||||
1. 颜色选择器组件
|
||||
2. 二维码组件
|
||||
3. 圆形菜单组件
|
||||
4. 常用的订单组件
|
||||
5. 信息展示组件
|
||||
|
||||
# 插件的使用
|
||||
|
||||
#### tab - 页面插件
|
||||
|
||||
可以通过设置参数中的 config.data 来实现页面传参
|
||||
|
||||
| 方法 | 作用 | 参数 |
|
||||
| ------------ | ------------------------------------------------ | ----------- |
|
||||
| getData | 可以拿到上个页面通过 tab 传递的参数 | 无 |
|
||||
| reLaunch | 关闭所有页面，打开到应用内的某个页面 | url、config |
|
||||
| switchTab | 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面 | url、config |
|
||||
| redirectTo | 关闭当前页面，跳转到应用内的某个页面 | url、config |
|
||||
| navigateTo | 保留当前页面，跳转到应用内的某个页面 | url、config |
|
||||
| navigateBack | 关闭当前页面，返回上一页面或多级页面 | config |
|
||||
|
||||
#### auth - 鉴权插件
|
||||
|
||||
下面所有方法返回值都是布尔值，permission 代表权限字符串，role 代表角色字符串，复数形式代表数组。
|
||||
|
||||
| 方法 | 作用 | 参数 |
|
||||
| ----------- | ------------------------------------------ | ----------- |
|
||||
| hasPermi | 验证用户是否具备某权限 | permission |
|
||||
| hasPermiOr | 验证用户是否含有指定权限，只需包含其中一个 | permissions |
|
||||
| hasPermiAnd | 验证用户是否含有指定权限，必须全部拥有 | permissions |
|
||||
| hasRole | 验证用户是否具备某角色 | role |
|
||||
| hasRoleOr | 验证用户是否含有指定角色，只需包含其中一个 | roles |
|
||||
| hasRoleAnd | roles | roles |
|
||||
|
||||
#### modal - 弹窗插件
|
||||
|
||||
content 是消息内容，option 是详细配置。
|
||||
|
||||
| 方法 | 作用 | 参数 |
|
||||
| ------------ | ------------------------------ | ------- |
|
||||
| msg | 消息提示 | content |
|
||||
| msgError | 错误消息 | content |
|
||||
| msgSuccess | 成功消息 | content |
|
||||
| hideMsg | 隐藏消息 | 无 |
|
||||
| alert | 弹出提示 | content |
|
||||
| confirm | 确认窗体 | content |
|
||||
| showToast | 提示信息 | option |
|
||||
| loading | 打开遮罩层，需要手动关闭遮罩层 | content |
|
||||
| closeLoading | 关闭遮罩层 | 无 |
|
||||
|
||||
#### bus - 事件插件
|
||||
|
||||
eventName 是事件名称，eventFun 是事件处理函数，请尽量避免事件插件的使用，请在组件销毁是解绑素有该组件有关的事件，避免产生 bug。
|
||||
|
||||
| 方法 | 作用 | 参数 |
|
||||
| ----- | ------------ | ------------------- |
|
||||
| $on | 绑定一个事件 | eventName、eventFun |
|
||||
| $off | 解绑一个事件 | eventName |
|
||||
| $emit | 触发一个事件 | eventName、...args |
|
||||
|
||||
#### socket
|
||||
|
||||
设置项 enableUUID，是否启用基于 uuid 的消息处理机制，要求当发送的消息携带 uuid 字段时，返回的消息也要携带 uuid 字段。
|
||||
|
||||
设置项 enableEvent，是否启用基于事件的消息处理机制，要求当希望被事件处理函数处理的消息需要携带 event 字段。
|
||||
|
||||
| 方法 | 作用 | 参数 |
|
||||
| --------- | ----------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| connect | 连接 websocke，当连接成功后触发回调函数 | 最简单的用法就是传入{url:"ws://demo"} |
|
||||
| send | 发送信息，当 uuid 不为空且不为 false 时，当收到携带相同 uuid 的消息时触发回调函数，只触发一次。否则由默认处理函数处理。 | msg 消息内容，会被处理成 json 字符串 uuid 唯一标识符，可以手动传入，也可以设置为 true 当为 true 时会自动生成一个 uuid 并添加到 msg 中。 |
|
||||
| close | 关闭连接，会触发回调函数的内容，不会触发默认关闭事件的处理函数，也不会修改默认关闭事件的处理函数。 | 无 |
|
||||
| on | 监听事件，当收到携带 event 的消息时会调用回调函数。 | event 事件的名称 |
|
||||
| off | 取消监听事件 | |
|
||||
| onMessage | 定义默认监听事件 | callback 默认监听事件的处理函数 |
|
||||
| onError | 定义异常事件 | callback 默认异常事件的处理函数 |
|
||||
| onClose | 定义关闭事件 | callback 默认关闭事件的处理函数 |
|
||||
|
||||
# 作者建议
|
||||
|
||||
### 对于选项式
|
||||
|
||||
```js
|
||||
this.$tab; // 建议使用this.$tab进行页面跳转，理由：便于在跳转前处理其他事务
|
||||
this.$auth; // 建议使用this.$auth进行鉴权操作
|
||||
this.$modal; // 建议使用this.$modal打开弹窗，理由：便于以后想要使用自定义弹窗
|
||||
```
|
||||
|
||||
### 对于组合式
|
||||
|
||||
```js
|
||||
import tab from "@/plugins/tab"; // 建议使用tab进行页面跳转，理由：便于在跳转前处理其他事务
|
||||
import auth from "@/plugins/auth"; // 建议使用auth进行鉴权操作
|
||||
import modal from "@/plugins/modal"; // 建议使用modal打开弹窗，理由：便于以后想要使用自定义弹窗
|
||||
|
||||
// 也可以使用下面的方式
|
||||
import { tab, auth, modal } from "@/plugins";
|
||||
```
|
||||
|
||||
### 对于 ucharts
|
||||
|
||||
建议即便暂时不使用图表也不要删除它，以后可能会用到。
|
||||
|
||||
# 压缩内存
|
||||
|
||||
(主包最低 809kb 左右)
|
||||
|
||||
### 删除 geek 组件
|
||||
|
||||
1. 删除 pages_geek 和 components/geek-xd 文件夹
|
||||
2. 删除 pages.json 中 subPackages 的 root 值为“pages_geek/pages”的配置
|
||||
3. 删除 pages/template.config.js 中 geek 组件
|
||||
|
||||
### 去除模板
|
||||
|
||||
（占用主包 582kb 左右）
|
||||
|
||||
1. 删除 pages_template、pages_qiun 两个文件夹
|
||||
2. 删除 pages.json 中 subPackages 的 root 值为“pages_qiun/pages”、“pages_template/pages”的两个配置
|
||||
3. 删除 pages/template.config.js 和 pages/template.vue
|
||||
4. 删除 pages.json 中 subPackages 的“tabBar”中的模板一项和“pages”中模板的一项
|
||||
5. 删除 static 中的 uview，里面都是示例图片。
|
||||
6. 删除 plugins 中的 config.js 和 common.js，并在 plugins/index.js 中删除相关配置
|
||||
|
||||
### 删除 uchart
|
||||
|
||||
（占用主包 175kb 左右，不建议删除，以防以后会用）
|
||||
|
||||
1. 删除 components/qiun-data-charts 文件夹
|
||||
2. 删除 pages.json 中的 easycom 下的 custom 中的"qiun-(.\*)"的那一行
|
||||
3. 删除 pages/index 中使用 “qiun-data-charts” 的部分
|
||||
|
||||
### 删除 uview
|
||||
|
||||
（按需引入，没必要删除）
|
||||
|
||||
1. main.js 或者 main.ts 中删除
|
||||
|
||||
```js
|
||||
import uviewPlus from "uview-plus";
|
||||
// ......
|
||||
app.use(uviewPlus);
|
||||
```
|
||||
|
||||
2. uni.scss 中删除 @import 'uview-plus/theme.scss';
|
||||
3. App.vue 中删除 @import '@/static/scss/index.scss';
|
||||
4. package.json 中删除 "clipboard": "^2.0.11","dayjs": "^1.11.9","uview-plus": "^3.1.36",
|
||||
|
||||
# 功能演示
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td><img src="./doc/image/template1.png" /></td>
|
||||
<td><img src="./doc/image/template2.png" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><img src="./doc/image/index.png" /></td>
|
||||
<td><img src="./doc/image/mallMenu.png"/></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
# 附录
|
||||
|
||||
[Vue3 官网](https://cn.vuejs.org/)；
|
||||
[uniapp 官网](https://uniapp.dcloud.net.cn/)；
|
||||
[uView-plus 官网](https://uiadmin.net/uview-plus/)；
|
||||
[uCharts 官网](https://www.ucharts.cn/v2/#/)；
|
||||
[RuoYi 官网](http://ruoyi.vip/)；
|
||||
|
||||
# 联系我们：
|
||||
|
||||
QQ 交流群：744785891
|
||||
BIN
doc/image/index.png
Normal file
BIN
doc/image/index.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
BIN
doc/image/logo.png
Normal file
BIN
doc/image/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
BIN
doc/image/mallMenu.png
Normal file
BIN
doc/image/mallMenu.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 127 KiB |
BIN
doc/image/template1.png
Normal file
BIN
doc/image/template1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 41 KiB |
BIN
doc/image/template2.png
Normal file
BIN
doc/image/template2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
@ -16,6 +16,6 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="./main.js"></script>
|
||||
<script type="module" src="./src/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
58
package.json
58
package.json
@ -1,13 +1,13 @@
|
||||
{
|
||||
"name": "ruoyi-geek-app",
|
||||
"name": "NGToolsBox",
|
||||
"version": "1.0.0",
|
||||
"description": "若依Geek管理系统",
|
||||
"description": "天然气工具箱",
|
||||
"author": "Geek-XD",
|
||||
"license": "MIT",
|
||||
"homepage": "https://gitee.com/geek-xd",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://gitee.com/geek-xd/ruoyi-geek-app.git"
|
||||
"url": "https://gitee.com/geek-xd/NGToolsBox.git"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^18.0.0 || >=20.0.0"
|
||||
@ -34,7 +34,7 @@
|
||||
"build:app-android": "uni build -p app-android",
|
||||
"build:app-ios": "uni build -p app-ios",
|
||||
"build:custom": "uni build -p",
|
||||
"build:h5": "uni build",
|
||||
"build:h5": "uni build --platform h5",
|
||||
"build:h5:ssr": "uni build --ssr",
|
||||
"build:mp-alipay": "uni build -p mp-alipay",
|
||||
"build:mp-baidu": "uni build -p mp-baidu",
|
||||
@ -52,22 +52,22 @@
|
||||
"clean:windows": "rd /s /q dist || rd /s /q node_modules"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-app-harmony": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-components": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-h5": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-harmony": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-xhs": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-app": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-app-harmony": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-components": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-h5": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-harmony": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-mp-xhs": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uvm": "^0.3.1",
|
||||
"@jridgewell/sourcemap-codec": "^1.5.0",
|
||||
"@qiun/wx-ucharts": "2.5.0-20230101",
|
||||
@ -78,25 +78,25 @@
|
||||
"pinia": "2.2.2",
|
||||
"tslib": "^2.7.0",
|
||||
"uview-plus": "^3.3.32",
|
||||
"vue": "3.4.21",
|
||||
"vue-i18n": "^9.14.2",
|
||||
"vue": "^3.4.21",
|
||||
"vue-i18n": "^9.1.9",
|
||||
"vue-router": "4.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/types": "^3.4.14",
|
||||
"@dcloudio/uni-automator": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-4060420250429001",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-4060420250429001",
|
||||
"@dcloudio/types": "^3.4.8",
|
||||
"@dcloudio/uni-automator": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-4080520251106001",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-4080520251106001",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-4080520251106001",
|
||||
"@types/html5plus": "^1.0.5",
|
||||
"@vue/runtime-core": "^3.5.12",
|
||||
"@vue/runtime-core": "^3.4.21",
|
||||
"@vue/tsconfig": "^0.5.1",
|
||||
"less": "^4.2.0",
|
||||
"miniprogram-api-typings": "^4.1.0",
|
||||
"sass": "1.78.0",
|
||||
"sass-loader": "^16.0.1",
|
||||
"typescript": "^5.6.2",
|
||||
"vite": "5.4.10",
|
||||
"vite": "5.2.8",
|
||||
"vue-tsc": "2.1.6"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,266 +0,0 @@
|
||||
<script setup>
|
||||
import modal from '@/plugins/modal'
|
||||
import { getCodeImg } from '@/api/login'
|
||||
import { ref } from "vue";
|
||||
import config from '@/config.js'
|
||||
import useUserStore from '@/store/modules/user'
|
||||
import { getWxCode } from '@/utils/geek';
|
||||
import { wxLogin } from '@/api/oauth';
|
||||
import { setToken } from '@/utils/auth';
|
||||
const userStore = useUserStore()
|
||||
const codeUrl = ref("");
|
||||
const captchaEnabled = ref(true); // 是否开启验证码
|
||||
const useWxLogin = ref(false); // 是否使用微信登录
|
||||
// #if MP-WEIXIN
|
||||
useWxLogin.value = true
|
||||
// #endif
|
||||
const globalConfig = ref(config);
|
||||
const loginForm = ref({
|
||||
username: "admin",
|
||||
password: "admin123",
|
||||
code: "",
|
||||
uuid: ''
|
||||
});
|
||||
|
||||
function handleLoginByWx() {
|
||||
getWxCode("__UNI__A6541FF").then(res => {
|
||||
console.log(res);
|
||||
wxLogin('miniapp', res).then(res => {
|
||||
if (res.token != null) {
|
||||
setToken(res.token);
|
||||
loginSuccess()
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 获取图形验证码
|
||||
function getCode() {
|
||||
getCodeImg().then(res => {
|
||||
captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled
|
||||
if (captchaEnabled.value) {
|
||||
codeUrl.value = 'data:image/gif;base64,' + res.img
|
||||
loginForm.value.uuid = res.uuid
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
async function handleLogin() {
|
||||
if (loginForm.value.username === "") {
|
||||
modal.msgError("请输入您的账号")
|
||||
} else if (loginForm.value.password === "") {
|
||||
modal.msgError("请输入您的密码")
|
||||
} else if (loginForm.value.code === "" && captchaEnabled.value) {
|
||||
modal.msgError("请输入验证码")
|
||||
} else {
|
||||
modal.loading("登录中，请耐心等待...")
|
||||
pwdLogin()
|
||||
}
|
||||
};
|
||||
// 密码登录
|
||||
async function pwdLogin() {
|
||||
userStore.login(loginForm.value).then(() => {
|
||||
modal.closeLoading()
|
||||
loginSuccess()
|
||||
}).catch(() => {
|
||||
if (captchaEnabled.value) {
|
||||
modal.closeLoading()
|
||||
getCode()
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
function loginSuccess(result) {
|
||||
// 设置用户信息
|
||||
userStore.getInfo().then(res => {
|
||||
uni.switchTab({
|
||||
url: '/pages/index'
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
// 隐私协议
|
||||
function handlePrivacy() {
|
||||
let site = globalConfig.value.appInfo.agreements[0];
|
||||
uni.navigateTo({
|
||||
url: `/pages/common/webview/index?title=${site.title}&url=${site.url}`
|
||||
});
|
||||
};
|
||||
// 用户协议
|
||||
function handleUserAgrement() {
|
||||
let site = globalConfig.value.appInfo.agreements[1]
|
||||
uni.navigateTo({
|
||||
url: `/pages/common/webview/index?title=${site.title}&url=${site.url}`
|
||||
});
|
||||
};
|
||||
|
||||
getCode();
|
||||
</script>
|
||||
<template>
|
||||
<view class="normal-login-container">
|
||||
<view class="logo-content align-center justify-center flex">
|
||||
<image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
|
||||
</image>
|
||||
<text class="title">登录</text>
|
||||
</view>
|
||||
<view class="login-form-content">
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-user icon"></view>
|
||||
<input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30" />
|
||||
</view>
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-password icon"></view>
|
||||
<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" />
|
||||
</view>
|
||||
<view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
|
||||
<view class="iconfont icon-code icon"></view>
|
||||
<input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4" />
|
||||
<view class="login-code">
|
||||
<image :src="codeUrl" @click="getCode" class="login-code-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="action-btn">
|
||||
<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg round">登录</button>
|
||||
<button @click="handleLoginByWx" v-if="useWxLogin"
|
||||
class="login-btn cu-btn block bg-green lg round">微信一键登录</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="register-link" >
|
||||
<text class="question-text">没有账号？</text>
|
||||
<navigator class="link-type" url="/pages_mine/pages/register/index">立即注册</navigator>
|
||||
</view>
|
||||
|
||||
<view class="xieyi text-center">
|
||||
<text class="text-grey1">登录即代表同意</text>
|
||||
<text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
|
||||
<text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.normal-login-container {
|
||||
width: 100%;
|
||||
|
||||
.logo-content {
|
||||
width: 100%;
|
||||
font-size: 21px;
|
||||
text-align: center;
|
||||
padding-top: 15%;
|
||||
|
||||
image {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-form-content {
|
||||
text-align: center;
|
||||
margin: 20px auto;
|
||||
margin-top: 15%;
|
||||
width: 80%;
|
||||
|
||||
.input-item {
|
||||
margin: 20px auto;
|
||||
background-color: #f5f6f7;
|
||||
height: 45px;
|
||||
border-radius: 20px;
|
||||
|
||||
.icon {
|
||||
font-size: 38rpx;
|
||||
margin-left: 10px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.input {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
margin-top: 40px;
|
||||
|
||||
.login-btn {
|
||||
height: 45px;
|
||||
|
||||
&+.login-btn {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.xieyi {
|
||||
color: #333;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.login-code {
|
||||
height: 38px;
|
||||
float: right;
|
||||
|
||||
.login-code-img {
|
||||
height: 38px;
|
||||
position: absolute;
|
||||
margin-left: 10px;
|
||||
width: 200rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.register-link {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 15px;
|
||||
|
||||
.question-text {
|
||||
color: #606266;
|
||||
margin-right: 8px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.link-type {
|
||||
color: #409EFF;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
background-color: #409EFF;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #66b1ff;
|
||||
|
||||
&::after {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
53
src/.gitignore
vendored
Normal file
53
src/.gitignore
vendored
Normal file
@ -0,0 +1,53 @@
|
||||
# 忽略生成的文件
|
||||
build/
|
||||
dist/
|
||||
unpackage/
|
||||
*.class
|
||||
*.jar
|
||||
*.war
|
||||
*.ear
|
||||
|
||||
# 忽略编辑器/IDE生成的文件和目录
|
||||
.idea/
|
||||
.hbuilderx
|
||||
*.swp
|
||||
*.swo
|
||||
*~
|
||||
|
||||
# 忽略依赖管理工具生成的目录
|
||||
node_modules/
|
||||
bower_components/
|
||||
vendor/
|
||||
|
||||
# 忽略操作系统文件
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
|
||||
# 忽略日志文件
|
||||
*.log
|
||||
|
||||
# 忽略敏感或包含个人信息的文件（根据需要添加更多）
|
||||
credentials.json
|
||||
config.ini
|
||||
secrets.txt
|
||||
|
||||
# 忽略其他自定义的文件或目录
|
||||
/custom_directory/
|
||||
|
||||
# 排除特定扩展名的文件（根据需要添加更多）
|
||||
*.bak
|
||||
*.tmp
|
||||
|
||||
# 排除特定文件名（根据需要添加更多）
|
||||
debug.log
|
||||
|
||||
# 不排除下列扩展名的文件
|
||||
!*.allowed_extension
|
||||
|
||||
# 不排除下列文件名
|
||||
!important_file.txt
|
||||
|
||||
# 忽略由于node版本不同导致lock文件不同，只需要保留package.json即可
|
||||
package-lock.json
|
||||
yarn.lock
|
||||
pnpm-lock.yaml
|
||||
25
src/App.vue
Normal file
25
src/App.vue
Normal file
@ -0,0 +1,25 @@
|
||||
<script>
|
||||
import {
|
||||
ref,
|
||||
} from 'vue';
|
||||
|
||||
|
||||
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
console.log('App Launch - 开始初始化');
|
||||
|
||||
},
|
||||
onShow: function() {
|
||||
console.log('App Show');
|
||||
},
|
||||
onHide: function() {
|
||||
console.log('App Hide');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "uview-plus/index.scss";
|
||||
@import '@/static/scss/index.scss';
|
||||
</style>
|
||||
@ -1,78 +1,78 @@
|
||||
# uni-app 二维码生成器
|
||||
|
||||
改自作者诗小柒的tki-qrcode二维码生成器
|
||||
|
||||
### 作者：Dftre
|
||||
|
||||
1. H5、微信小程序、支付宝小程序、APP，其它平台的小程序没有测试
|
||||
2. 使用canvas生成
|
||||
3. 可设置二维码背景色，前景色，角标色
|
||||
4. 可设置二维码logo
|
||||
|
||||
### 使用方法
|
||||
|
||||
在 `template` 中使用
|
||||
|
||||
```javascript
|
||||
<view class="qrimg">
|
||||
<geek-qrcode
|
||||
ref="qrcode"
|
||||
:cid="cid"
|
||||
:val="val"
|
||||
:size="size"
|
||||
:unit="unit"
|
||||
:background="background"
|
||||
:foreground="foreground"
|
||||
:pdground="pdground"
|
||||
:icon="icon"
|
||||
:iconSize="iconsize"
|
||||
:lv="lv"
|
||||
:onval="onval"
|
||||
:loadMake="loadMake"
|
||||
:usingComponents="usingComponents"
|
||||
:showLoading="showLoading"
|
||||
:loadingText="loadingText"
|
||||
@result="qrR" />
|
||||
</view>
|
||||
```
|
||||
|
||||
### 属性
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 可选值 | 说明 |
|
||||
| :-------------- | :-----: | :---------------: | :----: | :-------------------------------------------------------------------------------------------------- |
|
||||
| cid | String | tki-qrcode-canvas | | canvasId，页面存在多个二维码组件时需设置不同的ID |
|
||||
| size | Number | 200 | | 生成的二维码大小 |
|
||||
| unit | String | upx | px | 大小单位尺寸 |
|
||||
| show | Boolean | true | | 默认使用组件中的image标签显示二维码 |
|
||||
| val | String | 二维码 | | 要生成的内容 |
|
||||
| background | String | #000000 | | 二维码背景色 |
|
||||
| foreground | String | #ffffff | | 二维码前景色 |
|
||||
| pdground | String | #ffffff | | 二维码角标色 |
|
||||
| icon | String | | | 二维码图标URL（必须是本地图片，网络图需要先下载至本地） |
|
||||
| iconSize | Number | 40 | | 二维码图标大小（注意此大小不会跟随二维码size 动态变化，设置时需要注意大小，不要太大，以免无法识别） |
|
||||
| lv | Number | 3 | | 容错级别（一般不用设置） |
|
||||
| onval | Boolean | false | | 监听val值变化自动重新生成二维码 |
|
||||
| loadMake | Boolean | false | | 组件初始化完成后自动生成二维码，val需要有值 |
|
||||
| usingComponents | Boolean | true | false | 是否使用了自定义组件模式（主要是为了修复非自定义组件模式时 v-if 无法生成二维码的问题） |
|
||||
| showLoading | Boolean | true | false | 是否显示loading |
|
||||
| loadingText | String | 二维码生成中 | | loading文字 |
|
||||
|
||||
### 方法
|
||||
|
||||
| 方法名 | 参数 | 默认值 | 说明 |
|
||||
| :----------- | :--: | :----: | :-------------------------------------------------- |
|
||||
| _makeCode() | | | 生成二维码 |
|
||||
| _clearCode() | | | 清空二维码（清空二维码会触发result回调 返回值为空） |
|
||||
| _saveCode() | | | 保存二维码到图库 |
|
||||
|
||||
### 事件
|
||||
|
||||
| 事件名 | 返回值 | 说明 |
|
||||
| :----- | :----------------------------: | --------------------------------------: |
|
||||
| result | 生成的图片base64或图片临时地址 | 返回二维码路径 注：_clearCode()后返回空 |
|
||||
|
||||
### 感谢
|
||||
|
||||
[uni-app](https://uniapp.dcloud.io/ "uni-app")
|
||||
[qrcode](https://github.com/aralejs/qrcode "qrcode")
|
||||
tki-qrcode
|
||||
# uni-app 二维码生成器
|
||||
|
||||
改自作者诗小柒的tki-qrcode二维码生成器
|
||||
|
||||
### 作者：Dftre
|
||||
|
||||
1. H5、微信小程序、支付宝小程序、APP，其它平台的小程序没有测试
|
||||
2. 使用canvas生成
|
||||
3. 可设置二维码背景色，前景色，角标色
|
||||
4. 可设置二维码logo
|
||||
|
||||
### 使用方法
|
||||
|
||||
在 `template` 中使用
|
||||
|
||||
```javascript
|
||||
<view class="qrimg">
|
||||
<geek-qrcode
|
||||
ref="qrcode"
|
||||
:cid="cid"
|
||||
:val="val"
|
||||
:size="size"
|
||||
:unit="unit"
|
||||
:background="background"
|
||||
:foreground="foreground"
|
||||
:pdground="pdground"
|
||||
:icon="icon"
|
||||
:iconSize="iconsize"
|
||||
:lv="lv"
|
||||
:onval="onval"
|
||||
:loadMake="loadMake"
|
||||
:usingComponents="usingComponents"
|
||||
:showLoading="showLoading"
|
||||
:loadingText="loadingText"
|
||||
@result="qrR" />
|
||||
</view>
|
||||
```
|
||||
|
||||
### 属性
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 可选值 | 说明 |
|
||||
| :-------------- | :-----: | :---------------: | :----: | :-------------------------------------------------------------------------------------------------- |
|
||||
| cid | String | tki-qrcode-canvas | | canvasId，页面存在多个二维码组件时需设置不同的ID |
|
||||
| size | Number | 200 | | 生成的二维码大小 |
|
||||
| unit | String | upx | px | 大小单位尺寸 |
|
||||
| show | Boolean | true | | 默认使用组件中的image标签显示二维码 |
|
||||
| val | String | 二维码 | | 要生成的内容 |
|
||||
| background | String | #000000 | | 二维码背景色 |
|
||||
| foreground | String | #ffffff | | 二维码前景色 |
|
||||
| pdground | String | #ffffff | | 二维码角标色 |
|
||||
| icon | String | | | 二维码图标URL（必须是本地图片，网络图需要先下载至本地） |
|
||||
| iconSize | Number | 40 | | 二维码图标大小（注意此大小不会跟随二维码size 动态变化，设置时需要注意大小，不要太大，以免无法识别） |
|
||||
| lv | Number | 3 | | 容错级别（一般不用设置） |
|
||||
| onval | Boolean | false | | 监听val值变化自动重新生成二维码 |
|
||||
| loadMake | Boolean | false | | 组件初始化完成后自动生成二维码，val需要有值 |
|
||||
| usingComponents | Boolean | true | false | 是否使用了自定义组件模式（主要是为了修复非自定义组件模式时 v-if 无法生成二维码的问题） |
|
||||
| showLoading | Boolean | true | false | 是否显示loading |
|
||||
| loadingText | String | 二维码生成中 | | loading文字 |
|
||||
|
||||
### 方法
|
||||
|
||||
| 方法名 | 参数 | 默认值 | 说明 |
|
||||
| :----------- | :--: | :----: | :-------------------------------------------------- |
|
||||
| _makeCode() | | | 生成二维码 |
|
||||
| _clearCode() | | | 清空二维码（清空二维码会触发result回调 返回值为空） |
|
||||
| _saveCode() | | | 保存二维码到图库 |
|
||||
|
||||
### 事件
|
||||
|
||||
| 事件名 | 返回值 | 说明 |
|
||||
| :----- | :----------------------------: | --------------------------------------: |
|
||||
| result | 生成的图片base64或图片临时地址 | 返回二维码路径 注：_clearCode()后返回空 |
|
||||
|
||||
### 感谢
|
||||
|
||||
[uni-app](https://uniapp.dcloud.io/ "uni-app")
|
||||
[qrcode](https://github.com/aralejs/qrcode "qrcode")
|
||||
tki-qrcode
|
||||
@ -1,205 +1,205 @@
|
||||
<template xlang="wxml" minapp="mpvue">
|
||||
<view class="geek-qrcode">
|
||||
<canvas class="geek-qrcode-canvas" :canvas-id="cid" :style="{width:cpSize+'px',height:cpSize+'px'}" />
|
||||
<image v-show="show" :src="result" :style="{width:cpSize+'px',height:cpSize+'px'}" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import QRCode from "./qrcode.js"
|
||||
let qrcode
|
||||
export default {
|
||||
name: "geek-qrcode",
|
||||
props: {
|
||||
cid: {
|
||||
type: String,
|
||||
default: 'geek-qrcode-canvas'
|
||||
},
|
||||
size: {
|
||||
type: Number,
|
||||
default: 200
|
||||
},
|
||||
unit: {
|
||||
type: String,
|
||||
default: 'upx'
|
||||
},
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
val: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
background: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
foreground: {
|
||||
type: String,
|
||||
default: '#000000'
|
||||
},
|
||||
pdground: {
|
||||
type: String,
|
||||
default: '#000000'
|
||||
},
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
iconSize: {
|
||||
type: Number,
|
||||
default: 40
|
||||
},
|
||||
lv: {
|
||||
type: Number,
|
||||
default: 3
|
||||
},
|
||||
onval: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
loadMake: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
usingComponents: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoading: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
loadingText: {
|
||||
type: String,
|
||||
default: '二维码生成中'
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
result: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
_makeCode() {
|
||||
let that = this
|
||||
if (!this._empty(this.val)) {
|
||||
qrcode = new QRCode({
|
||||
context: that, // 上下文环境
|
||||
canvasId:that.cid, // canvas-id
|
||||
usingComponents: that.usingComponents, // 是否是自定义组件
|
||||
showLoading: that.showLoading, // 是否显示loading
|
||||
loadingText: that.loadingText, // loading文字
|
||||
text: that.val, // 生成内容
|
||||
size: that.cpSize, // 二维码大小
|
||||
background: that.background, // 背景色
|
||||
foreground: that.foreground, // 前景色
|
||||
pdground: that.pdground, // 定位角点颜色
|
||||
correctLevel: that.lv, // 容错级别
|
||||
image: that.icon, // 二维码图标
|
||||
imageSize: that.iconSize,// 二维码图标大小
|
||||
cbResult: function (res) { // 生成二维码的回调
|
||||
that._result(res)
|
||||
},
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '二维码内容不能为空',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
},
|
||||
_clearCode() {
|
||||
this._result('')
|
||||
qrcode.clear()
|
||||
},
|
||||
_saveCode() {
|
||||
let that = this;
|
||||
if (this.result != "") {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: that.result,
|
||||
success: function () {
|
||||
uni.showToast({
|
||||
title: '二维码保存成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
_result(res) {
|
||||
this.result = res;
|
||||
this.$emit('result', res)
|
||||
},
|
||||
_empty(v) {
|
||||
let tp = typeof v,
|
||||
rt = false;
|
||||
if (tp == "number" && String(v) == "") {
|
||||
rt = true
|
||||
} else if (tp == "undefined") {
|
||||
rt = true
|
||||
} else if (tp == "object") {
|
||||
if (JSON.stringify(v) == "{}" || JSON.stringify(v) == "[]" || v == null) rt = true
|
||||
} else if (tp == "string") {
|
||||
if (v == "" || v == "undefined" || v == "null" || v == "{}" || v == "[]") rt = true
|
||||
} else if (tp == "function") {
|
||||
rt = false
|
||||
}
|
||||
return rt
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
size: function (n, o) {
|
||||
if (n != o && !this._empty(n)) {
|
||||
this.cSize = n
|
||||
if (!this._empty(this.val)) {
|
||||
setTimeout(() => {
|
||||
this._makeCode()
|
||||
}, 100);
|
||||
}
|
||||
}
|
||||
},
|
||||
val: function (n, o) {
|
||||
if (this.onval) {
|
||||
if (n != o && !this._empty(n)) {
|
||||
setTimeout(() => {
|
||||
this._makeCode()
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
cpSize() {
|
||||
if(this.unit == "upx"){
|
||||
return uni.upx2px(this.size)
|
||||
}else{
|
||||
return this.size
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
if (this.loadMake) {
|
||||
if (!this._empty(this.val)) {
|
||||
setTimeout(() => {
|
||||
this._makeCode()
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.geek-qrcode {
|
||||
position: relative;
|
||||
}
|
||||
.geek-qrcode-canvas {
|
||||
position: fixed;
|
||||
top: -99999upx;
|
||||
left: -99999upx;
|
||||
z-index: -99999;
|
||||
}
|
||||
</style>
|
||||
<template xlang="wxml" minapp="mpvue">
|
||||
<view class="geek-qrcode">
|
||||
<canvas class="geek-qrcode-canvas" :canvas-id="cid" :style="{width:cpSize+'px',height:cpSize+'px'}" />
|
||||
<image v-show="show" :src="result" :style="{width:cpSize+'px',height:cpSize+'px'}" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import QRCode from "./qrcode.js"
|
||||
let qrcode
|
||||
export default {
|
||||
name: "geek-qrcode",
|
||||
props: {
|
||||
cid: {
|
||||
type: String,
|
||||
default: 'geek-qrcode-canvas'
|
||||
},
|
||||
size: {
|
||||
type: Number,
|
||||
default: 200
|
||||
},
|
||||
unit: {
|
||||
type: String,
|
||||
default: 'upx'
|
||||
},
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
val: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
background: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
foreground: {
|
||||
type: String,
|
||||
default: '#000000'
|
||||
},
|
||||
pdground: {
|
||||
type: String,
|
||||
default: '#000000'
|
||||
},
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
iconSize: {
|
||||
type: Number,
|
||||
default: 40
|
||||
},
|
||||
lv: {
|
||||
type: Number,
|
||||
default: 3
|
||||
},
|
||||
onval: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
loadMake: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
usingComponents: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoading: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
loadingText: {
|
||||
type: String,
|
||||
default: '二维码生成中'
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
result: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
_makeCode() {
|
||||
let that = this
|
||||
if (!this._empty(this.val)) {
|
||||
qrcode = new QRCode({
|
||||
context: that, // 上下文环境
|
||||
canvasId:that.cid, // canvas-id
|
||||
usingComponents: that.usingComponents, // 是否是自定义组件
|
||||
showLoading: that.showLoading, // 是否显示loading
|
||||
loadingText: that.loadingText, // loading文字
|
||||
text: that.val, // 生成内容
|
||||
size: that.cpSize, // 二维码大小
|
||||
background: that.background, // 背景色
|
||||
foreground: that.foreground, // 前景色
|
||||
pdground: that.pdground, // 定位角点颜色
|
||||
correctLevel: that.lv, // 容错级别
|
||||
image: that.icon, // 二维码图标
|
||||
imageSize: that.iconSize,// 二维码图标大小
|
||||
cbResult: function (res) { // 生成二维码的回调
|
||||
that._result(res)
|
||||
},
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '二维码内容不能为空',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
},
|
||||
_clearCode() {
|
||||
this._result('')
|
||||
qrcode.clear()
|
||||
},
|
||||
_saveCode() {
|
||||
let that = this;
|
||||
if (this.result != "") {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: that.result,
|
||||
success: function () {
|
||||
uni.showToast({
|
||||
title: '二维码保存成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
_result(res) {
|
||||
this.result = res;
|
||||
this.$emit('result', res)
|
||||
},
|
||||
_empty(v) {
|
||||
let tp = typeof v,
|
||||
rt = false;
|
||||
if (tp == "number" && String(v) == "") {
|
||||
rt = true
|
||||
} else if (tp == "undefined") {
|
||||
rt = true
|
||||
} else if (tp == "object") {
|
||||
if (JSON.stringify(v) == "{}" || JSON.stringify(v) == "[]" || v == null) rt = true
|
||||
} else if (tp == "string") {
|
||||
if (v == "" || v == "undefined" || v == "null" || v == "{}" || v == "[]") rt = true
|
||||
} else if (tp == "function") {
|
||||
rt = false
|
||||
}
|
||||
return rt
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
size: function (n, o) {
|
||||
if (n != o && !this._empty(n)) {
|
||||
this.cSize = n
|
||||
if (!this._empty(this.val)) {
|
||||
setTimeout(() => {
|
||||
this._makeCode()
|
||||
}, 100);
|
||||
}
|
||||
}
|
||||
},
|
||||
val: function (n, o) {
|
||||
if (this.onval) {
|
||||
if (n != o && !this._empty(n)) {
|
||||
setTimeout(() => {
|
||||
this._makeCode()
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
cpSize() {
|
||||
if(this.unit == "upx"){
|
||||
return uni.upx2px(this.size)
|
||||
}else{
|
||||
return this.size
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
if (this.loadMake) {
|
||||
if (!this._empty(this.val)) {
|
||||
setTimeout(() => {
|
||||
this._makeCode()
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.geek-qrcode {
|
||||
position: relative;
|
||||
}
|
||||
.geek-qrcode-canvas {
|
||||
position: fixed;
|
||||
top: -99999upx;
|
||||
left: -99999upx;
|
||||
z-index: -99999;
|
||||
}
|
||||
</style>
|
||||
0
env.d.ts → src/env.d.ts
vendored
0
env.d.ts → src/env.d.ts
vendored
21
src/index.html
Normal file
21
src/index.html
Normal file
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Ruoyi-App-Geek</title>
|
||||
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="./main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -49,7 +49,8 @@
|
||||
"ios" : {
|
||||
"weixin" : {
|
||||
"appid" : "wx97a8f7019d175ced"
|
||||
}
|
||||
},
|
||||
"dSYMs" : false
|
||||
},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {
|
||||
102
src/package.json
Normal file
102
src/package.json
Normal file
@ -0,0 +1,102 @@
|
||||
{
|
||||
"name": "NGToolsBox",
|
||||
"version": "1.0.0",
|
||||
"description": "天然气工具箱",
|
||||
"author": "Geek-XD",
|
||||
"license": "MIT",
|
||||
"homepage": "https://gitee.com/geek-xd",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://gitee.com/geek-xd/NGToolsBox.git"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^18.0.0 || >=20.0.0"
|
||||
},
|
||||
"scripts": {
|
||||
"dev:app": "uni -p app",
|
||||
"dev:app-android": "uni -p app-android",
|
||||
"dev:app-ios": "uni -p app-ios",
|
||||
"dev:custom": "uni -p",
|
||||
"dev:h5": "uni",
|
||||
"dev:h5:ssr": "uni --ssr",
|
||||
"dev:mp-alipay": "uni -p mp-alipay",
|
||||
"dev:mp-baidu": "uni -p mp-baidu",
|
||||
"dev:mp-jd": "uni -p mp-jd",
|
||||
"dev:mp-kuaishou": "uni -p mp-kuaishou",
|
||||
"dev:mp-lark": "uni -p mp-lark",
|
||||
"dev:mp-qq": "uni -p mp-qq",
|
||||
"dev:mp-toutiao": "uni -p mp-toutiao",
|
||||
"dev:mp-weixin": "uni -p mp-weixin",
|
||||
"dev:quickapp-webview": "uni -p quickapp-webview",
|
||||
"dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
|
||||
"dev:quickapp-webview-union": "uni -p quickapp-webview-union",
|
||||
"build:app": "uni build -p app",
|
||||
"build:app-android": "uni build -p app-android",
|
||||
"build:app-ios": "uni build -p app-ios",
|
||||
"build:custom": "uni build -p",
|
||||
"build:h5": "uni build --platform h5",
|
||||
"build:h5:ssr": "uni build --ssr",
|
||||
"build:mp-alipay": "uni build -p mp-alipay",
|
||||
"build:mp-baidu": "uni build -p mp-baidu",
|
||||
"build:mp-jd": "uni build -p mp-jd",
|
||||
"build:mp-kuaishou": "uni build -p mp-kuaishou",
|
||||
"build:mp-lark": "uni build -p mp-lark",
|
||||
"build:mp-qq": "uni build -p mp-qq",
|
||||
"build:mp-toutiao": "uni build -p mp-toutiao",
|
||||
"build:mp-weixin": "uni build -p mp-weixin",
|
||||
"build:quickapp-webview": "uni build -p quickapp-webview",
|
||||
"build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
|
||||
"build:quickapp-webview-union": "uni build -p quickapp-webview-union",
|
||||
"type-check": "vue-tsc --noEmit",
|
||||
"clean:linux": "rm -rf dist || rm -rf node_modules",
|
||||
"clean:windows": "rd /s /q dist || rd /s /q node_modules"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-app-harmony": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-components": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-h5": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-harmony": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-mp-xhs": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uvm": "^0.3.1",
|
||||
"@jridgewell/sourcemap-codec": "^1.5.0",
|
||||
"@qiun/wx-ucharts": "2.5.0-20230101",
|
||||
"@uview-plus/types": "^3.2.5",
|
||||
"clipboard": "^2.0.11",
|
||||
"dayjs": "^1.11.13",
|
||||
"mqtt": "4.1.0",
|
||||
"pinia": "2.2.2",
|
||||
"tslib": "^2.7.0",
|
||||
"uview-plus": "^3.3.32",
|
||||
"vue": "3.4.21",
|
||||
"vue-i18n": "^9.14.2",
|
||||
"vue-router": "4.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/types": "^3.4.14",
|
||||
"@dcloudio/uni-automator": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-4060420250429001",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-4060420250429001",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-4060420250429001",
|
||||
"@types/html5plus": "^1.0.5",
|
||||
"@vue/runtime-core": "^3.5.12",
|
||||
"@vue/tsconfig": "^0.5.1",
|
||||
"less": "^4.2.0",
|
||||
"miniprogram-api-typings": "^4.1.0",
|
||||
"sass": "1.78.0",
|
||||
"sass-loader": "^16.0.1",
|
||||
"typescript": "^5.6.2",
|
||||
"vite": "5.4.10",
|
||||
"vue-tsc": "2.1.6"
|
||||
}
|
||||
}
|
||||
@ -23,12 +23,7 @@
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/work",
|
||||
"style": {
|
||||
"navigationBarTitleText": "天然气工具箱"
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path": "pages/template",
|
||||
"style": {
|
||||
@ -1,235 +1,302 @@
|
||||
<template>
|
||||
<view class="work-container">
|
||||
<!-- 轮播图 -->
|
||||
<uni-swiper-dot class="uni-swiper-dot-box" :info="data" :current="current" field="content">
|
||||
<swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper">
|
||||
<swiper-item v-for="(item, index) in data" :key="index">
|
||||
<view class="swiper-item" @click="clickBannerItem(item)">
|
||||
<image :src="item.image" mode="aspectFill" :draggable="false" />
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</uni-swiper-dot>
|
||||
|
||||
<!-- 宫格组件 -->
|
||||
<!-- 使用原生 view 实现网格布局 -->
|
||||
<view class="grid-body" v-for="(group, groupIndex) in moudlesGroups" :key="groupIndex">
|
||||
<uni-section :title="group.name" type="line"></uni-section>
|
||||
<view class="custom-grid-view">
|
||||
<view v-for="(item, itemIndex) in group.items" :key="itemIndex" class="custom-grid-item"
|
||||
@click="navigateToMoudles(item)">
|
||||
<view class="grid-item-box">
|
||||
<uni-icons :type="item.icon" size="30"></uni-icons>
|
||||
<text class="text">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
onMounted
|
||||
} from "vue";
|
||||
import modal from "@/plugins/modal"
|
||||
|
||||
import {
|
||||
extractModuleData
|
||||
} from '@/utils/moudlesData.ts';
|
||||
|
||||
const current = ref(0);
|
||||
const swiperDotIndex = ref(0);
|
||||
const data = ref([{
|
||||
image: '/static/images/banner/banner01.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner02.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner03.jpg'
|
||||
}
|
||||
]);
|
||||
|
||||
// 核心数据：计算分组和功能项定义
|
||||
const moudlesGroups = ref([]);
|
||||
|
||||
onMounted(() => {
|
||||
moudlesGroups.value = extractModuleData(['流量计算', '参数计算'], false)
|
||||
})
|
||||
|
||||
function navigateToMoudles(item) {
|
||||
console.log(item)
|
||||
uni.navigateTo({
|
||||
url: item.path+"?dMeterType="+ item.params
|
||||
});
|
||||
};
|
||||
|
||||
function clickBannerItem(item) {
|
||||
console.info(item)
|
||||
};
|
||||
|
||||
function changeSwiper(e) {
|
||||
current.value = e.detail.current
|
||||
}
|
||||
|
||||
function changeGrid(e) {
|
||||
modal.showToast({
|
||||
title: '模块建设中',
|
||||
mask: false,
|
||||
icon: 'loading',
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* 原生网格布局样式 */
|
||||
.custom-grid-view {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.custom-grid-item {
|
||||
width: 25%;
|
||||
box-sizing: border-box;
|
||||
padding: 10rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.grid-item-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20rpx 0;
|
||||
width: 100%;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
view {
|
||||
font-size: 14px;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.work-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
margin-top: 10rpx;
|
||||
/* #ifdef MP-WEIXIN */
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
width: 100%;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.grid-item-box {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 15px 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 修复小程序中的网格布局 */
|
||||
/* #ifdef MP-WEIXIN */
|
||||
.custom-grid {
|
||||
width: 100% !important;
|
||||
display: flex !important;
|
||||
flex-wrap: wrap !important;
|
||||
}
|
||||
|
||||
.custom-grid .uni-grid-item {
|
||||
width: 25% !important;
|
||||
box-sizing: border-box !important;
|
||||
flex: none !important;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: 25% !important;
|
||||
flex-shrink: 0 !important;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.uni-margin-wrap {
|
||||
width: 690rpx;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
height: 300rpx;
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
height: 300rpx;
|
||||
line-height: 300rpx;
|
||||
}
|
||||
|
||||
.grid-body {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) {
|
||||
.uni-swiper-dot-box {
|
||||
width: 400px;
|
||||
/* #ifndef APP-NVUE */
|
||||
margin: 0 auto;
|
||||
/* #endif */
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
<template>
|
||||
<view class="work-container">
|
||||
<!-- 轮播图 -->
|
||||
<uni-swiper-dot class="uni-swiper-dot-box" :info="data" :current="current" field="content">
|
||||
<swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper">
|
||||
<swiper-item v-for="(item, index) in data" :key="index">
|
||||
<view class="swiper-item" @click="clickBannerItem(item)">
|
||||
<image :src="item.image" mode="aspectFill" :draggable="false" />
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</uni-swiper-dot>
|
||||
|
||||
<!-- 宫格组件 -->
|
||||
<!-- 使用原生 view 实现网格布局 -->
|
||||
<view class="grid-body" v-for="(group, groupIndex) in moudlesGroups" :key="groupIndex">
|
||||
<uni-section :title="group.name" type="line"></uni-section>
|
||||
<view class="custom-grid-view">
|
||||
<view v-for="(item, itemIndex) in group.items" :key="itemIndex" class="custom-grid-item"
|
||||
@click="navigateToMoudles(item)">
|
||||
<view class="grid-item-box">
|
||||
<uni-icons :type="item.icon" size="30"></uni-icons>
|
||||
<text class="text">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
onMounted
|
||||
} from "vue";
|
||||
import modal from "@/plugins/modal"
|
||||
import {
|
||||
listConvert
|
||||
} from '@/api/system/unitConverter/sysUnitConverter.js';
|
||||
import {
|
||||
storage
|
||||
} from '@/utils/storageUnit.ts';
|
||||
import {
|
||||
extractModuleData
|
||||
} from '@/utils/moudlesData.ts';
|
||||
|
||||
const current = ref(0);
|
||||
const swiperDotIndex = ref(0);
|
||||
const data = ref([{
|
||||
image: '/static/images/banner/banner01.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner02.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner03.jpg'
|
||||
}
|
||||
]);
|
||||
|
||||
// 核心数据：计算分组和功能项定义
|
||||
const moudlesGroups = ref([]);
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 1000,
|
||||
unitType: null,
|
||||
unitName: null,
|
||||
baseUnit: null,
|
||||
conversionFactor: null,
|
||||
unitTypeName: null,
|
||||
status: null,
|
||||
unitOrder: null
|
||||
});
|
||||
|
||||
// 保留原有单位换算方法
|
||||
const groupByUnitType = (data) => {
|
||||
if (!data || !Array.isArray(data)) {
|
||||
console.warn('groupByUnitType: 数据为空或不是数组');
|
||||
return {};
|
||||
}
|
||||
|
||||
return data.reduce((acc, unit) => {
|
||||
const type = unit.unitType;
|
||||
if (!acc[type]) acc[type] = [];
|
||||
acc[type].push({
|
||||
id: unit.id,
|
||||
unitType: unit.unitType,
|
||||
unitName: unit.unitName,
|
||||
conversionFactor: unit.conversionFactor,
|
||||
unitOrder: unit.unitOrder,
|
||||
baseUnit: unit.baseUnit,
|
||||
status: unit.status,
|
||||
unitTypeName: unit.unitTypeName
|
||||
});
|
||||
return acc;
|
||||
}, {});
|
||||
};
|
||||
|
||||
const getList = () => {
|
||||
try {
|
||||
console.log('开始请求单位数据...');
|
||||
const response = listConvert(queryParams.value);
|
||||
console.log('API响应:', JSON.stringify(response));
|
||||
|
||||
if (!response || !response.rows) {
|
||||
console.error('API响应格式错误');
|
||||
return;
|
||||
}
|
||||
|
||||
if (response.rows.length === 0) {
|
||||
console.warn('单位数据为空数组');
|
||||
return;
|
||||
}
|
||||
|
||||
const unitDataGrouped = groupByUnitType(response.rows);
|
||||
console.log('分组后的单位数据:', unitDataGrouped);
|
||||
// 使用统一的存储方法
|
||||
storage.setItem('unitData', unitDataGrouped);
|
||||
console.log('数据存储成功');
|
||||
|
||||
} catch (error) {
|
||||
console.error('获取单位数据失败:', error);
|
||||
}
|
||||
};
|
||||
onMounted(() => {
|
||||
moudlesGroups.value = extractModuleData(['流量计算', '参数计算'], false)
|
||||
getList();
|
||||
})
|
||||
|
||||
function navigateToMoudles(item) {
|
||||
console.log(item)
|
||||
uni.navigateTo({
|
||||
url: item.path + "?dMeterType=" + item.params
|
||||
});
|
||||
};
|
||||
|
||||
function clickBannerItem(item) {
|
||||
console.info(item)
|
||||
};
|
||||
|
||||
function changeSwiper(e) {
|
||||
current.value = e.detail.current
|
||||
}
|
||||
|
||||
function changeGrid(e) {
|
||||
modal.showToast({
|
||||
title: '模块建设中',
|
||||
mask: false,
|
||||
icon: 'loading',
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* 原生网格布局样式 */
|
||||
.custom-grid-view {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.custom-grid-item {
|
||||
width: 25%;
|
||||
box-sizing: border-box;
|
||||
padding: 10rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.grid-item-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20rpx 0;
|
||||
width: 100%;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
view {
|
||||
font-size: 14px;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.work-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
margin-top: 10rpx;
|
||||
/* #ifdef MP-WEIXIN */
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
width: 100%;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.grid-item-box {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 15px 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 修复小程序中的网格布局 */
|
||||
/* #ifdef MP-WEIXIN */
|
||||
.custom-grid {
|
||||
width: 100% !important;
|
||||
display: flex !important;
|
||||
flex-wrap: wrap !important;
|
||||
}
|
||||
|
||||
.custom-grid .uni-grid-item {
|
||||
width: 25% !important;
|
||||
box-sizing: border-box !important;
|
||||
flex: none !important;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: 25% !important;
|
||||
flex-shrink: 0 !important;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.uni-margin-wrap {
|
||||
width: 690rpx;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
height: 300rpx;
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
height: 300rpx;
|
||||
line-height: 300rpx;
|
||||
}
|
||||
|
||||
.grid-body {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) {
|
||||
.uni-swiper-dot-box {
|
||||
width: 400px;
|
||||
/* #ifndef APP-NVUE */
|
||||
margin: 0 auto;
|
||||
/* #endif */
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,221 +1,221 @@
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import useUserStore from '@/store/modules/user'
|
||||
const userStore = useUserStore()
|
||||
const name = userStore.name;
|
||||
|
||||
const avatar = ref(userStore.avatar);
|
||||
const windowHeight = ref(uni.getSystemInfoSync().windowHeight - 50);
|
||||
const popup = ref(null);
|
||||
|
||||
uni.$on('refresh', () => {
|
||||
avatar.value = userStore.avatar;
|
||||
})
|
||||
|
||||
function handleToInfo() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/info/index'
|
||||
});
|
||||
};
|
||||
function handleToEditInfo() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/info/edit'
|
||||
});
|
||||
};
|
||||
function handleToSetting() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/setting/index'
|
||||
});
|
||||
};
|
||||
function handleToLogin() {
|
||||
uni.reLaunch({
|
||||
url: '/pages/login'
|
||||
});
|
||||
};
|
||||
function handleToAvatar() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/avatar/index'
|
||||
});
|
||||
};
|
||||
function handleLogout() {
|
||||
popup.value.open();
|
||||
};
|
||||
function dialogConfirm() {
|
||||
//console.log('----------------点击确认------------')
|
||||
|
||||
userStore.logOut().then(() => {
|
||||
uni.reLaunch({
|
||||
url: '/pages/login'
|
||||
});
|
||||
})
|
||||
};
|
||||
function dialogClose() {
|
||||
//console.log('点击关闭')
|
||||
};
|
||||
function handleHelp() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/help/index'
|
||||
});
|
||||
};
|
||||
function handleAbout() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/about/index'
|
||||
});
|
||||
};
|
||||
function handleJiaoLiuQun() {
|
||||
uni.showToast({
|
||||
title: 'QQ群：133713780',
|
||||
mask: false,
|
||||
icon: "none",
|
||||
duration: 1000
|
||||
});
|
||||
};
|
||||
function handleBuilding() {
|
||||
uni.showToast({
|
||||
title: '模块建设中~',
|
||||
mask: false,
|
||||
icon: "none",
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
|
||||
<!--顶部个人信息栏-->
|
||||
<view class="header-section">
|
||||
<view class="flex padding justify-between">
|
||||
<view class="flex align-center">
|
||||
<view v-if="!avatar" class="cu-avatar xl round bg-white">
|
||||
<view class="iconfont icon-people text-gray icon"></view>
|
||||
</view>
|
||||
<image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round" mode="widthFix">
|
||||
</image>
|
||||
<view v-if="!name" @click="handleToLogin" class="login-tip">
|
||||
点击登录
|
||||
</view>
|
||||
<view v-if="name" @click="handleToInfo" class="user-info">
|
||||
<view class="u_title">
|
||||
用户名：{{ name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="handleToInfo" class="flex align-center">
|
||||
<text>个人信息</text>
|
||||
<view class="iconfont icon-right"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="content-section">
|
||||
<view class="mine-actions grid col-4 text-center">
|
||||
<view class="action-item" @click="handleJiaoLiuQun">
|
||||
<view class="iconfont icon-friendfill text-pink icon"></view>
|
||||
<text class="text">交流群</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-service text-blue icon"></view>
|
||||
<text class="text">在线客服</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-community text-mauve icon"></view>
|
||||
<text class="text">反馈社区</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-dianzan text-green icon"></view>
|
||||
<text class="text">点赞我们</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow" @click="handleToEditInfo">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-user menu-icon"></view>
|
||||
<view>编辑资料</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleHelp">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-help menu-icon"></view>
|
||||
<view>常见问题</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleAbout">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-aixin menu-icon"></view>
|
||||
<view>关于我们</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleToSetting">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-setting menu-icon"></view>
|
||||
<view>应用设置</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f5f6f7;
|
||||
}
|
||||
|
||||
.mine-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
|
||||
.header-section {
|
||||
padding: 15px 15px 45px 15px;
|
||||
background-color: #3c96f3;
|
||||
color: white;
|
||||
|
||||
.login-tip {
|
||||
font-size: 18px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.cu-avatar {
|
||||
border: 2px solid #eaeaea;
|
||||
|
||||
.icon {
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-info {
|
||||
margin-left: 15px;
|
||||
|
||||
.u_title {
|
||||
font-size: 18px;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-section {
|
||||
position: relative;
|
||||
top: -50px;
|
||||
|
||||
.mine-actions {
|
||||
margin: 15px 15px;
|
||||
padding: 20px 0px;
|
||||
border-radius: 8px;
|
||||
background-color: white;
|
||||
|
||||
.action-item {
|
||||
.icon {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.text {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
margin: 8px 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import useUserStore from '@/store/modules/user'
|
||||
const userStore = useUserStore()
|
||||
const name = userStore.name;
|
||||
|
||||
const avatar = ref(userStore.avatar);
|
||||
const windowHeight = ref(uni.getSystemInfoSync().windowHeight - 50);
|
||||
const popup = ref(null);
|
||||
|
||||
uni.$on('refresh', () => {
|
||||
avatar.value = userStore.avatar;
|
||||
})
|
||||
|
||||
function handleToInfo() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/info/index'
|
||||
});
|
||||
};
|
||||
function handleToEditInfo() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/info/edit'
|
||||
});
|
||||
};
|
||||
function handleToSetting() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/setting/index'
|
||||
});
|
||||
};
|
||||
function handleToLogin() {
|
||||
uni.reLaunch({
|
||||
url: '/pages/login'
|
||||
});
|
||||
};
|
||||
function handleToAvatar() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/avatar/index'
|
||||
});
|
||||
};
|
||||
function handleLogout() {
|
||||
popup.value.open();
|
||||
};
|
||||
function dialogConfirm() {
|
||||
//console.log('----------------点击确认------------')
|
||||
|
||||
userStore.logOut().then(() => {
|
||||
uni.reLaunch({
|
||||
url: '/pages/login'
|
||||
});
|
||||
})
|
||||
};
|
||||
function dialogClose() {
|
||||
//console.log('点击关闭')
|
||||
};
|
||||
function handleHelp() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/help/index'
|
||||
});
|
||||
};
|
||||
function handleAbout() {
|
||||
uni.navigateTo({
|
||||
url: '/pages_mine/pages/about/index'
|
||||
});
|
||||
};
|
||||
function handleJiaoLiuQun() {
|
||||
uni.showToast({
|
||||
title: 'QQ群：133713780',
|
||||
mask: false,
|
||||
icon: "none",
|
||||
duration: 1000
|
||||
});
|
||||
};
|
||||
function handleBuilding() {
|
||||
uni.showToast({
|
||||
title: '模块建设中~',
|
||||
mask: false,
|
||||
icon: "none",
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
|
||||
<!--顶部个人信息栏-->
|
||||
<view class="header-section">
|
||||
<view class="flex padding justify-between">
|
||||
<view class="flex align-center">
|
||||
<view v-if="!avatar" class="cu-avatar xl round bg-white">
|
||||
<view class="iconfont icon-people text-gray icon"></view>
|
||||
</view>
|
||||
<image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round" mode="widthFix">
|
||||
</image>
|
||||
<view v-if="!name" @click="handleToLogin" class="login-tip">
|
||||
点击登录
|
||||
</view>
|
||||
<view v-if="name" @click="handleToInfo" class="user-info">
|
||||
<view class="u_title">
|
||||
用户名：{{ name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="handleToInfo" class="flex align-center">
|
||||
<text>个人信息</text>
|
||||
<view class="iconfont icon-right"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="content-section">
|
||||
<view class="mine-actions grid col-4 text-center">
|
||||
<view class="action-item" @click="handleJiaoLiuQun">
|
||||
<view class="iconfont icon-friendfill text-pink icon"></view>
|
||||
<text class="text">交流群</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-service text-blue icon"></view>
|
||||
<text class="text">在线客服</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-community text-mauve icon"></view>
|
||||
<text class="text">反馈社区</text>
|
||||
</view>
|
||||
<view class="action-item" @click="handleBuilding">
|
||||
<view class="iconfont icon-dianzan text-green icon"></view>
|
||||
<text class="text">点赞我们</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow" @click="handleToEditInfo">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-user menu-icon"></view>
|
||||
<view>编辑资料</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleHelp">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-help menu-icon"></view>
|
||||
<view>常见问题</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleAbout">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-aixin menu-icon"></view>
|
||||
<view>关于我们</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleToSetting">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-setting menu-icon"></view>
|
||||
<view>应用设置</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f5f6f7;
|
||||
}
|
||||
|
||||
.mine-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
|
||||
.header-section {
|
||||
padding: 15px 15px 45px 15px;
|
||||
background-color: #3c96f3;
|
||||
color: white;
|
||||
|
||||
.login-tip {
|
||||
font-size: 18px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.cu-avatar {
|
||||
border: 2px solid #eaeaea;
|
||||
|
||||
.icon {
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-info {
|
||||
margin-left: 15px;
|
||||
|
||||
.u_title {
|
||||
font-size: 18px;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-section {
|
||||
position: relative;
|
||||
top: -50px;
|
||||
|
||||
.mine-actions {
|
||||
margin: 15px 15px;
|
||||
padding: 20px 0px;
|
||||
border-radius: 8px;
|
||||
background-color: white;
|
||||
|
||||
.action-item {
|
||||
.icon {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.text {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
margin: 8px 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,71 +1,71 @@
|
||||
<template>
|
||||
<view class="about-container">
|
||||
<view class="header-section text-center">
|
||||
<image style="width: 150rpx;height: 150rpx;" src="/static/logo.png" mode="widthFix">
|
||||
</image>
|
||||
<uni-title type="h2" title="若依移动端"></uni-title>
|
||||
</view>
|
||||
|
||||
<view class="content-section">
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>版本信息</view>
|
||||
<view class="text-right">v{{version}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>官方邮箱</view>
|
||||
<view class="text-right">ruoyi@xx.com</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>服务热线</view>
|
||||
<view class="text-right">400-999-9999</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>公司网站</view>
|
||||
<view class="text-right">
|
||||
<uni-link :href="url" :text="url" showUnderLine="false"></uni-link>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="copyright">
|
||||
<view>Copyright © 2022 ruoyi.vip All Rights Reserved.</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import config from '@/config.js'
|
||||
const url=config.appInfo.site_url;
|
||||
const version=config.appInfo.version;
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
margin-top: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.header-section {
|
||||
display: flex;
|
||||
padding: 30rpx 0 0;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="about-container">
|
||||
<view class="header-section text-center">
|
||||
<image style="width: 150rpx;height: 150rpx;" src="/static/logo.png" mode="widthFix">
|
||||
</image>
|
||||
<uni-title type="h2" title="若依移动端"></uni-title>
|
||||
</view>
|
||||
|
||||
<view class="content-section">
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>版本信息</view>
|
||||
<view class="text-right">v{{version}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>官方邮箱</view>
|
||||
<view class="text-right">ruoyi@xx.com</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>服务热线</view>
|
||||
<view class="text-right">400-999-9999</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>公司网站</view>
|
||||
<view class="text-right">
|
||||
<uni-link :href="url" :text="url" showUnderLine="false"></uni-link>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="copyright">
|
||||
<view>Copyright © 2022 ruoyi.vip All Rights Reserved.</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import config from '@/config.js'
|
||||
const url=config.appInfo.site_url;
|
||||
const version=config.appInfo.version;
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
margin-top: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.header-section {
|
||||
display: flex;
|
||||
padding: 30rpx 0 0;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user