更新文档

This commit is contained in:
技术老胡 2024-11-28 17:01:13 +08:00
parent 1c165cddff
commit bd2428b191
16 changed files with 421 additions and 206 deletions

221
README.md
View File

@ -1,81 +1,152 @@
# 码支付
#### 介绍
**码支付[mpay]是一款便捷收款工具,专注于个人免签收款,通过普通收款码即可实现收款通知自动回调,支持绝大多数商城系统**
聚合收款码收款回调工具,主要支持第四方收款服务商的聚合收款码。
可以添加多个收款平台,每个平台添加多个账户,每个账户绑定多个收款码,收款码按照使用时间轮询。
## 项目地址
| gitee | github |
| ---------- | ------------ |
|[![](public/doc/assets/20241122_113208_gitee.png)](https://gitee.com/technical-laohu/mpay)|[![](public/doc/assets/20241122_113331_github.png)](https://github.com/techhaha/mpay)|
点以上图标进入项目页面,可查看最新发行版
## 项目说明
### 原因
之前在工作之余,尝试过很多副业项目,基本都是跟互联网相关的。例如使用**Wordpress和zibll主题**建资源站点,用**微擎**和**微课堂V2**卖课程,使用**异次元发卡**和**独角数卡**程序卖代理的**微信营销软件**,其中遇到的让我最头痛的问题就是收款问题。
正规官方渠道,如微信支付宝申请相关支付接口,必须要签约,且有营业执照等相关资质,这对于只想搞想副业的我实在是没必要,也麻烦,后期的事情也多。于是在网上找到了一些解决方案来解决我的在线收款问题。
### 方案
市场也有很多针对此类需求的平台,也有不少合适的解决方案
#### 虎皮椒/迅虎/蓝兔支付
这些平台都是微信支付宝等官方平台的支付服务商能签约个人商户实现在线收款一些API支付接口可以直接调用跟官方自己申请的几乎差不多。
优点是跟官方申请的支付接口差不多N+1到账
缺点就是审核比较严动不动投诉封商户号一些羊毛党就爱整你你是一点办法没有另外开户基本都要交开户费50-200不等且还需要额外收取手续费。
#### 彩虹易支付
彩虹易支付是一套收款程序,有专门的公司或平台用这套程序搭建一个收款平台,使用自己的微信或支付宝等官方账户来进行收款,你自己注商户号,运营方提供代收款服务,然后给你打款结算。
优点是审核不严,处理比较灵活,适合个人,技术支持比较好,注册可使用(有些需要注册费)
缺点就是平台容易卷款跑路,也没有什么有效监管,钱收不回来就亏大了(这也是最大的问题)
#### 源支付
源支付也是一套收款程序,有个人版和商户版,市面上能搜到的大部分都是商户版,可以入驻,使用自己的个人微信支付宝二维码收款。
源支付程序的设计思路主要是通过在手机或电脑上安装消息监听软件,用来监听获取微信和支付宝的收款到账通知来实现的支付成功回调的。**方法很实用,本程序也添加了该功能插件,免费**。
只是这种思路,有一些小问题:
* 平台容易因为资质问题导致关站;
* 收取的手续费价格偏高;
* 个人码在微信H5环境无法长按识别付款能只技术PC端相机扫码付款。
#### 码支付(mpay)
**本程序暂只提供个人版,开源免费使用。**
码支付是在源支付的设计思路基础上进行的改进,利用第四方**聚合收款码**来进行收款保证收款稳定和便捷。聚合收款码个人可以申请不需求相关资质不用申请API接口收银服务平台众多且实力雄厚如拉卡拉、收钱吧等不怕跑路。
特点如下:
* 免监听,不需要手机或电脑挂机监听消息,即可实现支付回调,只需要设置一个定时任务就行
* 支持微信、支付宝、云闪付的H5环境能正常长按识别扫码支付域名防红
* 个人搭建的收款系统,收款稳定,安全可控,不需要额外手续费
* 支持多平台(聚合码服务商),多账号(聚合码商户),多渠道(门店码/店员码/桌号码等),降低异地线上收款风控风险
### 思路
码支付说到底就是通过二维码来进行收款,日常使用的除了微信支付宝生成的二维码外,还有一类二维码是由收款服务商提供的,它能通过一张收款二维码,同时支持**微信**、**支付宝**、**云闪付**等多渠道付款,一般称为**聚合收款码**。
![聚合收款码](public/doc/assets/20241128_164241_image.png)
这类收款码扫码之后需要用户自己输入指定金额来过行付款,然后查看收款通知,确认是否到账,最后确认订单支付成功。
就像你去店子里买一瓶水,你扫二维码进去付款界面,就生成了一个订单,你付款成功之后,商店老板会去查看一下商户后台流水,确认订单是否支付成功,这是一个人工审核的过程。
![商户后台订单流水](public/doc/assets/20241128_164817_image.png)
那么码支付的作用,就是让人工审核变成自动审核的,当用户通过网站购买商品的时候,码支付会生成一个订单并展示收钱台界面,用户再扫码进入聚合码付款页面。
![码支付收银台](public/doc/assets/20241128_164952_image.png)
同一时间码支付后台会自动通过账号密码登陆聚合码服务平台的管理后台并通过API接口循环查询最近的收款明细通过比对金额和时间确认是否付款到账最后确认成功收款。
![收款成功](public/doc/assets/20241128_165320_image.png)
当用户付款成功,并且后台检测到收款成功消息后,收钱台就会提示收款成功,并最终确认收款。
> 只有存在新订单时,且该订单与当前收款账号一致时,码支付后台才会主动登陆该账号,查询收款流水,减少频繁查询导致的可能风险
> 另外,在账号设置里也有两个模式可选,`单次监听`和`连续监听`,根据业务场景可以自行选择,具体使用,下面有介绍
## 开源声明
### 内置插件
码支付收款管理系统开源免费使用,支付插件有免费和付费版本,按需使用购买
1. **微信**插件`wxpay`默认安装,支持`赞赏码`、`个人码|经营码|商家码`2个通道需挂机监听
2. **支付宝**插件`alipay`默认安装,支持`收钱码`、`经营码`2个通道需挂机监听
3. **收钱吧**聚合码插件`sqbpay`默认安装,无需挂机,设置定时任务即可
### 技术架构
须用`Thinkphp8`框架前端UI使用`Layui 2.9`+`PearAdmin`后台
## 安装和使用
### 全新安装
#### 源码下载
#### 安装配置
以**宝塔面板**示例,其他服务器管理面板可以参考
##### 新建站点与数据库
#### 仿静态配置
#### 安装步骤
### 聚合码使用
#### 申请收款码
#### 安装插件
#### 添加账号
#### 添加收款码
#### 设置监听
##### 订单监听
##### 账号收款监听
#### 支付测试
#### 服务商支持
### 微信/支付宝使用
#### 添加账号
#### 添加收钱码
#### 挂机监听收款通知
##### 软件下软(安卓)
##### 功能配置
##### 收款通知测试
### 补充说明
### 页面展示
之前做过一些个人的付费项目,因为收款接触过源支付相关产品,产品是非常不错的,但是实际使用体验,是真的一言难尽。
基本网上搜索到的提供能提供服务的平台,大多存续都很不稳定,关站跑路,且收款回调都需要挂机宝之类的工具,经常因为网络问题和登陆问题,导致收款失败,所以就没有再考虑使用此类产品了。
当然,还有彩虹易支付之类的产品,也了解过,连收款安全都无法保证,就更不用考虑了。
后来利用 SmsForwarder短信转发器 做过一个自己使用的工具,但在电池优化,程序稳定通知方面一直不是很满意,就放弃了,转向了其他方向了。
于是就有了这个项目,利用随处可申请的第四收款服务商来达到收款加回调的目的,线上或线下的第四方收款服务提供方,大多都是提供收银终端设备,面向小微商户会提供聚合收款码服务,支持微信和支付宝等
同时提供web版的商户管理后台也就可以支持回调。当有新订单时程序会自动登陆商户管理后台查询收款订单明细并核验是否收款成功。
这样,只要账户、密码没有问题,就不存在监听掉线的情况,也就非常稳定了。
**博客文章介绍** [记录我的第一个thinkphp项目实现聚合码支付收款回调无需挂机](https://blog.csdn.net/weixin_44177222/article/details/141722951?fromshare=blogdetail&sharetype=blogdetail&sharerId=141722951&sharerefer=PC&sharesource=weixin_44177222&sharefrom=from_link)
目前已支持的收款平台: **收钱吧****码钱****小Y经营****数字门店** 等。
正在开发的收款平台: **拉卡拉****云闪付盛意旺**
**平台介绍**
| 平台 | 官网 |
|------|-------------------------------------|
| 收钱吧 | https://www.shouqianba.com/ |
| 数字门店 | https://store.zhihuijingyingba.com/ |
| 小Y经营 | https://xym.ysepay.com/ |
| 码钱 | https://m.hkrt.cn/ |
| 拉卡拉 | https://customer.lakala.com/ |
| 盛付通 | https://b.shengpay.com/ |
#### 软件架构
项目采用 THINKPHP8 + layui 2.9 + PearAdmin后台UI 开发
#### 安装教程
![输入图片说明](public/admin/data/1.png)
![输入图片说明](public/admin/data/2.png)
![输入图片说明](public/admin/data/3.png)
![输入图片说明](public/admin/data/4.png)
![输入图片说明](public/admin/data/5.png)
![输入图片说明](public/admin/data/6.png)
![输入图片说明](public/admin/data/7.png)
#### 使用说明
因为个人使用并未做什么发行版主要是学习交流分享和记录一下自己的首个THINKPHP项目里面的设计思路和规范如果有什么好建议欢迎各位同学留言交流
学习交流+ K103516
#### 参与贡献
1. Fork 本仓库
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request
#### 特技
1. 使用 Readme\_XXX.md 来支持不同的语言,例如 Readme\_en.md, Readme\_zh.md
2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目,是综合评定出的优秀开源项目
5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)

View File

@ -96,6 +96,9 @@ class PluginController extends BaseController
$config = self::getPluginConfig();
$option = [];
foreach ($config as $value) {
if ($value['state'] == 0) {
continue;
}
$option[] = ['platform' => $value['platform'], 'name' => $value['name']];
}
return json($option);

View File

@ -59,7 +59,7 @@ return array (
'price' => '49.00',
'describe' => '数字门店',
'website' => 'https://store.zhihuijingyingba.com/',
'state' => 0,
'state' => 1,
'query' =>
array (
'pageNo' => 1,

View File

@ -48,7 +48,7 @@
width: 60px !important;
margin-top: 10px !important;
margin-bottom: 10px !important;
margin-left: 20px !important;
margin-left: 60px !important;
}
.title {

View File

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

View File

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 414 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

152
public/doc/mpay.md Normal file
View File

@ -0,0 +1,152 @@
# 码支付
**码支付[mpay]是一款便捷收款工具,专注于个人免签收款,通过普通收款码即可实现收款通知自动回调,支持绝大多数商城系统**
## 项目地址
| gitee | github |
| ---------- | ------------ |
|[![](assets/20241122_113208_gitee.png)](https://gitee.com/technical-laohu/mpay)|[![](assets/20241122_113331_github.png)](https://github.com/techhaha/mpay)|
点以上图标进入项目页面,可查看最新发行版
## 项目说明
### 原因
之前在工作之余,尝试过很多副业项目,基本都是跟互联网相关的。例如使用**Wordpress和zibll主题**建资源站点,用**微擎**和**微课堂V2**卖课程,使用**异次元发卡**和**独角数卡**程序卖代理的**微信营销软件**,其中遇到的让我最头痛的问题就是收款问题。
正规官方渠道,如微信支付宝申请相关支付接口,必须要签约,且有营业执照等相关资质,这对于只想搞想副业的我实在是没必要,也麻烦,后期的事情也多。于是在网上找到了一些解决方案来解决我的在线收款问题。
### 方案
市场也有很多针对此类需求的平台,也有不少合适的解决方案
#### 虎皮椒/迅虎/蓝兔支付
这些平台都是微信支付宝等官方平台的支付服务商能签约个人商户实现在线收款一些API支付接口可以直接调用跟官方自己申请的几乎差不多。
优点是跟官方申请的支付接口差不多N+1到账
缺点就是审核比较严动不动投诉封商户号一些羊毛党就爱整你你是一点办法没有另外开户基本都要交开户费50-200不等且还需要额外收取手续费。
#### 彩虹易支付
彩虹易支付是一套收款程序,有专门的公司或平台用这套程序搭建一个收款平台,使用自己的微信或支付宝等官方账户来进行收款,你自己注商户号,运营方提供代收款服务,然后给你打款结算。
优点是审核不严,处理比较灵活,适合个人,技术支持比较好,注册可使用(有些需要注册费)
缺点就是平台容易卷款跑路,也没有什么有效监管,钱收不回来就亏大了(这也是最大的问题)
#### 源支付
源支付也是一套收款程序,有个人版和商户版,市面上能搜到的大部分都是商户版,可以入驻,使用自己的个人微信支付宝二维码收款。
源支付程序的设计思路主要是通过在手机或电脑上安装消息监听软件,用来监听获取微信和支付宝的收款到账通知来实现的支付成功回调的。**方法很实用,本程序也添加了该功能插件,免费**。
只是这种思路,有一些小问题:
* 平台容易因为资质问题导致关站;
* 收取的手续费价格偏高;
* 个人码在微信H5环境无法长按识别付款能只技术PC端相机扫码付款。
#### 码支付(mpay)
**本程序暂只提供个人版,开源免费使用。**
码支付是在源支付的设计思路基础上进行的改进,利用第四方**聚合收款码**来进行收款保证收款稳定和便捷。聚合收款码个人可以申请不需求相关资质不用申请API接口收银服务平台众多且实力雄厚如拉卡拉、收钱吧等不怕跑路。
特点如下:
* 免监听,不需要手机或电脑挂机监听消息,即可实现支付回调,只需要设置一个定时任务就行
* 支持微信、支付宝、云闪付的H5环境能正常长按识别扫码支付域名防红
* 个人搭建的收款系统,收款稳定,安全可控,不需要额外手续费
* 支持多平台(聚合码服务商),多账号(聚合码商户),多渠道(门店码/店员码/桌号码等),降低异地线上收款风控风险
### 思路
码支付说到底就是通过二维码来进行收款,日常使用的除了微信支付宝生成的二维码外,还有一类二维码是由收款服务商提供的,它能通过一张收款二维码,同时支持**微信**、**支付宝**、**云闪付**等多渠道付款,一般称为**聚合收款码**。
![聚合收款码](assets/20241128_164241_image.png)
这类收款码扫码之后需要用户自己输入指定金额来过行付款,然后查看收款通知,确认是否到账,最后确认订单支付成功。
就像你去店子里买一瓶水,你扫二维码进去付款界面,就生成了一个订单,你付款成功之后,商店老板会去查看一下商户后台流水,确认订单是否支付成功,这是一个人工审核的过程。
![商户后台订单流水](assets/20241128_164817_image.png)
那么码支付的作用,就是让人工审核变成自动审核的,当用户通过网站购买商品的时候,码支付会生成一个订单并展示收钱台界面,用户再扫码进入聚合码付款页面。
![码支付收银台](assets/20241128_164952_image.png)
同一时间码支付后台会自动通过账号密码登陆聚合码服务平台的管理后台并通过API接口循环查询最近的收款明细通过比对金额和时间确认是否付款到账最后确认成功收款。
![收款成功](assets/20241128_165320_image.png)
当用户付款成功,并且后台检测到收款成功消息后,收钱台就会提示收款成功,并最终确认收款。
> 只有存在新订单时,且该订单与当前收款账号一致时,码支付后台才会主动登陆该账号,查询收款流水,减少频繁查询导致的可能风险
> 另外,在账号设置里也有两个模式可选,`单次监听`和`连续监听`,根据业务场景可以自行选择,具体使用,下面有介绍
## 开源声明
### 内置插件
码支付收款管理系统开源免费使用,支付插件有免费和付费版本,按需使用购买
1. **微信**插件`wxpay`默认安装,支持`赞赏码`、`个人码|经营码|商家码`2个通道需挂机监听
2. **支付宝**插件`alipay`默认安装,支持`收钱码`、`经营码`2个通道需挂机监听
3. **收钱吧**聚合码插件`sqbpay`默认安装,无需挂机,设置定时任务即可
### 技术架构
须用`Thinkphp8`框架前端UI使用`Layui 2.9`+`PearAdmin`后台
## 安装和使用
### 全新安装
#### 源码下载
#### 安装配置
以**宝塔面板**示例,其他服务器管理面板可以参考
##### 新建站点与数据库
#### 仿静态配置
#### 安装步骤
### 聚合码使用
#### 申请收款码
#### 安装插件
#### 添加账号
#### 添加收款码
#### 设置监听
##### 订单监听
##### 账号收款监听
#### 支付测试
#### 服务商支持
### 微信/支付宝使用
#### 添加账号
#### 添加收钱码
#### 挂机监听收款通知
##### 软件下软(安卓)
##### 功能配置
##### 收款通知测试
### 补充说明
### 页面展示

View File

@ -1,51 +0,0 @@
# 码支付
**码支付[mpay]是一款便捷收款工具,专注于个人免签收款,通过普通收款码即可实现收款通知自动回调,支持绝大多数商城系统**
## 项目地址
| gitee | github |
| ---------- | ------------ |
|[![](assets/20241122_113208_gitee.png)](https://gitee.com/technical-laohu/mpay)|[![](assets/20241122_113331_github.png)](https://gitee.com/technical-laohu/mpay)|
点以上图标进入项目页面,可查看最新发行版
## 项目说明
### 原因
之前在工作之余,尝试过很多副业项目,基本都是跟互联网相关的。例如使用**Wordpress和zibll主题**建资源站点,用**微擎**和**微课堂V2**卖课程,使用**异次元发卡**和**独角数卡**程序卖代理的**微信营销软件**,其中遇到的让我最头痛的问题就是收款问题。
正规官方渠道,如微信支付宝申请相关支付接口,必须要签约,且有营业执照等相关资质,这对于只想搞想副业的我实在是没必要,也麻烦,后期的事情也多。于是在网上找到了一些解决方案来解决我的在线收款问题。
### 方案
市场也有很多针对此类需求的平台,也有不少合适的解决方案
#### 虎皮椒/迅虎/蓝兔支付
这些平台都是微信支付宝等官方平台的支付服务商能签约个人商户实现在线收款一些API支付接口可以直接调用跟官方自己申请的几乎差不多。
优点是跟官方申请的支付接口差不多N+1到账
缺点就是审核比较严动不动投诉封商户号一些羊毛党就爱整你你是一点办法没有另外开户基本都要交开户费50-200不等且还需要额外收取手续费。
#### 彩虹易支付
彩虹易支付是一套收款程序,有专门的公司或平台用这套程序搭建一个收款平台,使用自己的微信或支付宝等官方账户来进行收款,你自己注商户号,运营方提供代收款服务,然后给你打款结算。
优点是审核不严,处理比较灵活,适合个人,技术支持比较好,注册可使用(有些需要注册费)
缺点就是平台容易卷款跑路,也没有什么有效监管,钱收不回来就亏大了(这也是最大的问题)
#### 源支付
源支付也是一套收款程序,有个人版和商户版,市面上能搜到的大部分都是商户版,可以入驻,使用自己的个人微信支付宝二维码收款。
源支付程序的设计思路主要是通过手机或电脑上的监听软件,监听获取微信和支付宝的收款到账通知来实现的支付成功回调的。
### 思路
## 开源声明
码支付收款管理系统开源免费使用,支付插件有免费和付费版本,按需使用购买
1. **微信**插件`wxpay`默认安装,支持`赞赏码`、`个人码|经营码|商家码`2个通道需挂机监听
2. **支付宝**插件`alipay`默认安装,支持`收钱码`、`经营码`2个通道需挂机监听
3. **收钱吧**聚合码插件`sqbpay`默认安装,无需挂机,设置定时任务即可

View File

@ -6,87 +6,115 @@
<title>程序安装</title>
<link rel="stylesheet" href="/component/pear/css/pear.css" />
<style>
.logo {
width: 60px !important;
margin-top: 10px !important;
margin-bottom: 10px !important;
}
.title {
font-size: 30px !important;
font-weight: 550 !important;
margin-left: 20px !important;
color: #5FB878 !important;
height: 60px !important;
line-height: 60px !important;
margin-top: 10px !important;
}
.desc {
width: 100% !important;
text-align: center !important;
color: gray !important;
height: 60px !important;
line-height: 60px !important;
}
</style>
</head>
<body>
<body class="pear-container" background="/admin/images/background.svg" style="background-size: cover;">
<div class="layui-container" style="margin-top: 50px;">
<div class="layui-row">
<div class="layui-col-md8 layui-col-md-offset2">
<form class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">数据库地址</label>
<div class="layui-input-block">
<input type="text" name="host" required lay-verify="required" placeholder="请输入数据库地址"
autocomplete="off" class="layui-input" value="localhost">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">端口</label>
<div class="layui-input-block">
<input type="text" name="port" required lay-verify="required" placeholder="请输入数据库名称"
autocomplete="off" class="layui-input" value="3306">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">编码</label>
<div class="layui-input-block">
<input type="text" name="charset" required lay-verify="required" placeholder="请输入数据库名称"
autocomplete="off" class="layui-input" value="utf8mb4">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">数据库</label>
<div class="layui-input-block">
<input type="text" name="name" required lay-verify="required" placeholder="请输入数据库名称"
autocomplete="off" class="layui-input" value="">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input type="text" name="user" required lay-verify="required" placeholder="请输入数据库用户名"
autocomplete="off" class="layui-input" value="root">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input type="password" name="pass" required lay-verify="required" placeholder="请输入数据库密码"
autocomplete="off" class="layui-input">
</div>
</div>
<hr style="margin: 24px 0px;" />
<div class="layui-form-item">
<label class="layui-form-label">管理员昵称</label>
<div class="layui-input-block">
<input type="text" name="nickname" required lay-verify="required" placeholder="请输入管理员昵称"
autocomplete="off" class="layui-input" value="管理大大">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">管理员账号</label>
<div class="layui-input-block">
<input type="text" name="username" required lay-verify="required" placeholder="请输入管理员用户名"
autocomplete="off" class="layui-input" value="admin">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">管理员密码</label>
<div class="layui-input-block">
<input type="password" name="password" required lay-verify="required" placeholder="请输入管理员密码"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formSubmit">立即安装</button>
</div>
</div>
</form>
<div class="layui-card" style="padding-top: 40px; max-width: 780px; margin: 20px auto;">
<div class="layui-card-body">
<div class="layui-form-item">
<div style="display: flex; justify-content: center;">
<div><img class="logo" src="/admin/images/logo.png" /></div>
<div class="title">码支付安装程序</div>
</div>
<div class="desc">
让 个 人 收 款 更 加 轻 松 便 捷
</div>
</div>
<form class="layui-form"
style="width: 70%; max-width: 680px; margin: 0px auto; padding: 24px; padding-left: 0px;">
<div class="layui-form-item">
<label class="layui-form-label">HOST</label>
<div class="layui-input-block">
<input type="text" name="host" required lay-verify="required" placeholder="请输入数据库地址"
autocomplete="off" class="layui-input" value="127.0.0.1">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">端口</label>
<div class="layui-input-block">
<input type="text" name="port" required lay-verify="required" placeholder="请输入数据库名称"
autocomplete="off" class="layui-input" value="3306">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">编码</label>
<div class="layui-input-block">
<input type="text" name="charset" required lay-verify="required" placeholder="请输入数据库名称"
autocomplete="off" class="layui-input" value="utf8mb4">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">数据库</label>
<div class="layui-input-block">
<input type="text" name="name" required lay-verify="required" placeholder="请输入数据库名称"
autocomplete="off" class="layui-input" value="">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input type="text" name="user" required lay-verify="required" placeholder="请输入数据库用户名"
autocomplete="off" class="layui-input" value="root">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input type="password" name="pass" required lay-verify="required" placeholder="请输入数据库密码"
autocomplete="off" class="layui-input">
</div>
</div>
<hr style="margin: 24px 0px;" />
<div class="layui-form-item">
<label class="layui-form-label">管理员昵称</label>
<div class="layui-input-block">
<input type="text" name="nickname" required lay-verify="required" placeholder="请输入管理员昵称"
autocomplete="off" class="layui-input" value="勇敢牛牛">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">管理员账号</label>
<div class="layui-input-block">
<input type="text" name="username" required lay-verify="required" placeholder="请输入管理员用户名"
autocomplete="off" class="layui-input" value="admin">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">管理员密码</label>
<div class="layui-input-block">
<input type="password" name="password" required lay-verify="required" placeholder="请输入管理员密码"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item" style="text-align: center;">
<button class="layui-btn" lay-submit lay-filter="formSubmit">立即安装</button>
</div>
</form>
</div>
</div>
<script src="/component/layui/layui.js"></script>

View File

@ -152,7 +152,13 @@
table.on('toolDouble(account-table)', function (obj) {
if (obj.event === 'copy') {
const text = obj.tr[0].querySelector('td[data-field="checkUrl"]>div').innerText;
navigator.clipboard.writeText(text).then(() => { layer.msg('复制成功') });
if (navigator.clipboard) {
navigator.clipboard.writeText(text).then(() => {
layer.msg('复制成功');
});
} else {
layer.msg('复制失败,请手动复制');
}
}
});
// 表格头部按钮事件

View File

@ -221,7 +221,13 @@
util.on({
'copyinfo': (ele) => {
const info = ele.attr('data-info');
navigator.clipboard.writeText(info).then(() => { layer.msg('复制成功') });
if (navigator.clipboard) {
navigator.clipboard.writeText(info).then(() => {
layer.msg('复制成功');
});
} else {
layer.msg('复制失败,请手动复制');
}
},
'resetKey': (ele) => {
layer.confirm('重置密钥后,将无法使用原密钥,是否继续?', { icon: 3, title: '重置密钥' }, function (index) {

View File

@ -29,7 +29,7 @@
<img class="logo" src="/admin/images/logo.png" />
<div class="title">码支付</div>
<div class="desc">
让个人收款更加轻松便捷
便
</div>
</div>
<div class="layui-form-item">