完成输入和单位换算一体组件
This commit is contained in:
parent
295c0f2ced
commit
c7b4db67bf
@ -25,7 +25,7 @@ RuoYi App 移动解决方案,采用uniapp框架,一份代码多终端适配
|
||||
- 官网网站:[http://ruoyi.vip](http://ruoyi.vip)
|
||||
- 文档地址:[http://doc.ruoyi.vip](http://doc.ruoyi.vip)
|
||||
- H5页体验:[http://h5.ruoyi.vip](http://h5.ruoyi.vip)
|
||||
- QQ交流群: ①133713780
|
||||
- QQ交流群: ①133713780(满)、②146013835
|
||||
- 小程序体验
|
||||
|
||||
<img src="https://oscimg.oschina.net/oscnet/up-26c76dc90b92acdbd9ac8cd5252f07c8ad9.jpg" alt="小程序演示"/>
|
||||
|
47
api/system/conversion.js
Normal file
47
api/system/conversion.js
Normal file
@ -0,0 +1,47 @@
|
||||
import upload from '@/utils/upload'
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询单位换算列表
|
||||
export function listConversion(query) {
|
||||
return request({
|
||||
url: '/system/conversion/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 查询单位换算详细
|
||||
export function getConversion(id) {
|
||||
return request({
|
||||
url: '/system/conversion/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 新增单位换算
|
||||
export function addConversion(data) {
|
||||
return request({
|
||||
url: '/system/conversion',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改单位换算
|
||||
export function updateConversion(data) {
|
||||
return request({
|
||||
url: '/system/conversion',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除单位换算
|
||||
export function delConversion(id) {
|
||||
return request({
|
||||
url: '/system/conversion/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
50
config.js
50
config.js
@ -1,26 +1,26 @@
|
||||
// 应用全局配置
|
||||
// 应用全局配置
|
||||
module.exports = {
|
||||
baseUrl: 'https://vue.ruoyi.vip/prod-api',
|
||||
// baseUrl: 'http://localhost:8080',
|
||||
// 应用信息
|
||||
appInfo: {
|
||||
// 应用名称
|
||||
name: "ruoyi-app",
|
||||
// 应用版本
|
||||
version: "1.1.0",
|
||||
// 应用logo
|
||||
logo: "/static/logo.png",
|
||||
// 官方网站
|
||||
site_url: "http://ruoyi.vip",
|
||||
// 政策协议
|
||||
agreements: [{
|
||||
title: "隐私政策",
|
||||
url: "https://ruoyi.vip/protocol.html"
|
||||
},
|
||||
{
|
||||
title: "用户服务协议",
|
||||
url: "https://ruoyi.vip/protocol.html"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
// baseUrl: 'https://vue.ruoyi.vip/prod-api',
|
||||
baseUrl: 'http://192.168.3.19:9090',
|
||||
// 应用信息
|
||||
appInfo: {
|
||||
// 应用名称
|
||||
name: "ruoyi-app",
|
||||
// 应用版本
|
||||
version: "1.1.0",
|
||||
// 应用logo
|
||||
logo: "/static/logo.png",
|
||||
// 官方网站
|
||||
site_url: "http://ruoyi.vip",
|
||||
// 政策协议
|
||||
agreements: [{
|
||||
title: "隐私政策",
|
||||
url: "https://ruoyi.vip/protocol.html"
|
||||
},
|
||||
{
|
||||
title: "用户服务协议",
|
||||
url: "https://ruoyi.vip/protocol.html"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
136
manifest.json
136
manifest.json
@ -1,69 +1,69 @@
|
||||
{
|
||||
"name" : "若依移动端",
|
||||
"appid" : "__UNI__25A9D80",
|
||||
"description" : "",
|
||||
"versionName" : "1.1.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueCompiler" : "uni-app",
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
"modules" : {},
|
||||
"distribute" : {
|
||||
"android" : {
|
||||
"permissions" : [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
"ios" : {},
|
||||
"sdkConfigs" : {}
|
||||
}
|
||||
},
|
||||
"quickapp" : {},
|
||||
"mp-weixin" : {
|
||||
"appid" : "wxccd7e2a0911b3397",
|
||||
"setting" : {
|
||||
"urlCheck" : false,
|
||||
"es6" : false,
|
||||
"minified" : true,
|
||||
"postcss" : true
|
||||
},
|
||||
"optimization" : {
|
||||
"subPackages" : true
|
||||
},
|
||||
"usingComponents" : true
|
||||
},
|
||||
"vueVersion" : "2",
|
||||
"h5" : {
|
||||
"template" : "static/index.html",
|
||||
"devServer" : {
|
||||
"port" : 9090,
|
||||
"https" : false
|
||||
},
|
||||
"title" : "RuoYi-App",
|
||||
"router" : {
|
||||
"mode" : "hash",
|
||||
"base" : "./"
|
||||
}
|
||||
}
|
||||
}
|
||||
"name": "若依移动端",
|
||||
"appid": "__UNI__1347B29",
|
||||
"description": "",
|
||||
"versionName": "1.1.0",
|
||||
"versionCode": "100",
|
||||
"transformPx": false,
|
||||
"app-plus": {
|
||||
"usingComponents": true,
|
||||
"nvueCompiler": "uni-app",
|
||||
"splashscreen": {
|
||||
"alwaysShowBeforeRender": true,
|
||||
"waiting": true,
|
||||
"autoclose": true,
|
||||
"delay": 0
|
||||
},
|
||||
"modules": {},
|
||||
"distribute": {
|
||||
"android": {
|
||||
"permissions": [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
"ios": {},
|
||||
"sdkConfigs": {}
|
||||
}
|
||||
},
|
||||
"quickapp": {},
|
||||
"mp-weixin": {
|
||||
"appid": "wxccd7e2a0911b3397",
|
||||
"setting": {
|
||||
"urlCheck": false,
|
||||
"es6": false,
|
||||
"minified": true,
|
||||
"postcss": true
|
||||
},
|
||||
"optimization": {
|
||||
"subPackages": true
|
||||
},
|
||||
"usingComponents": true
|
||||
},
|
||||
"vueVersion": "2",
|
||||
"h5": {
|
||||
"template": "static/index.html",
|
||||
"devServer": {
|
||||
"port": 9090,
|
||||
"https": false
|
||||
},
|
||||
"title": "RuoYi-App",
|
||||
"router": {
|
||||
"mode": "hash",
|
||||
"base": "./"
|
||||
}
|
||||
}
|
||||
}
|
5
package.json
Normal file
5
package.json
Normal file
@ -0,0 +1,5 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"bignumber.js": "^9.1.2"
|
||||
}
|
||||
}
|
76
pages-config-template.json
Normal file
76
pages-config-template.json
Normal file
@ -0,0 +1,76 @@
|
||||
/* ===pages-tool===
|
||||
该文件是pages-tool插件的配置文件模板,仅供参考。可以删除,不影响插件的使用。
|
||||
pages-tool插件可实现将pages.josn中的配置拆分到多个配置文件中,以便实现模块化配置。
|
||||
在应用中配置项较多、页面较多时,分别在不同文件中进行配置,可使项目代码更为清晰。
|
||||
在团队多人合作时,按模块分工,分别管理不同的配置文件,可避免同时修改pages.json带来的代码冲突问题。
|
||||
|
||||
注意:启用该插件并设置了配置文件之后,pages.json配置文件中相关配置项的内容可能会被替换,应根据paes-config.json的设置情况决定哪些配置应该在pages.josn中设置,哪些应该在指定的文件中设置。
|
||||
提示:插件只会处理已设置的相关项点,不会覆盖pages.json中未指定的项点。详见配置示例
|
||||
|
||||
*/
|
||||
|
||||
{
|
||||
//可指定一个文件路径,从该文件读取globalStyle配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"globalStyle" : "pages-config/globalStyle.json"
|
||||
//文件的格式同pages.json,但只应包含globalStyle配置项
|
||||
"globalStyle" : "",
|
||||
|
||||
//可指定一个文件路径,从该文件读取easycom配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"easycom" : "pages-config/easycom.json"
|
||||
//文件的格式同pages.json,但只应包含easycom配置项
|
||||
"easycom" : "",
|
||||
|
||||
//可指定一个文件路径,从该文件读取tabBar配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"tabBar" : "pages-config/tabBar.json"
|
||||
//文件的格式同pages.json,但只应包含tabBar配置项
|
||||
"tabBar" : "",
|
||||
|
||||
//可指定多个文件路径,合并多个文件的内容作为pages配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置为:"pages" : ["pages-config/pages-moduleA.json", "pages-config/pages-moduleB.json", "pages-config/pages-moduleC.json", ...]
|
||||
//每个文件的格式同pages.json,但只应包含pages配置项
|
||||
"pages" : [],
|
||||
|
||||
//可指定一个文件路径,从该文件读取condition配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"condition" : "pages-config/condition.json"
|
||||
//文件的格式同pages.json,但只应包含condition配置项
|
||||
"condition" : "",
|
||||
|
||||
//可对每个分包指定一个文件路径,从该文件读取对应分包的pages配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"subPackages" : [pages-config/subPackages-moduleNameA.json, pages-config/subPackages-moduleNameB.json, ...],
|
||||
//文件的格式同pages.json,但只应包含subPackages配置项
|
||||
//需要注意:分包中的pages不能再拆分为多个文件
|
||||
"subPackages" : [],
|
||||
|
||||
//可指定一个文件路径,从该文件读取preloadRule配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"preloadRule" : "pages-config/preloadRule.json"
|
||||
//文件的格式同pages.json,但只应包含preloadRule配置项
|
||||
"preloadRule" : "",
|
||||
|
||||
//推荐配置:"workers" : "pages-config/workers.json"
|
||||
//格式同pages.json
|
||||
"workers" : "",
|
||||
|
||||
//可指定一个文件路径,从该文件读取leftWindow配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"leftWindow" : "pages-config/leftWindow.json"
|
||||
//文件的格式同pages.json,但只应包含leftWindow配置项
|
||||
"leftWindow" : "",
|
||||
|
||||
//可指定一个文件路径,从该文件读取topWindow配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"topWindow" : "pages-config/topWindow.json"
|
||||
//文件的格式同pages.json,但只应包含topWindow配置项
|
||||
"topWindow" : "",
|
||||
|
||||
//可指定一个文件路径,从该文件读取rightWindow配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"rightWindow" : "pages-config/rightWindow.json"
|
||||
//文件的格式同pages.json,但只应包含rightWindow配置项
|
||||
"rightWindow" : "",
|
||||
|
||||
//可指定一个文件路径,从该文件读取uniIdRouter配置;如果不设置,仍然使用pages.json中的配置项
|
||||
//推荐配置:"uniIdRouter" : "pages-config/uniIdRouter.json"
|
||||
//文件的格式同pages.json,但只应包含uniIdRouter配置项
|
||||
"uniIdRouter" : "",
|
||||
|
||||
//默认启动首页,字符串配置(可以引入文件,也可以不引入文件),也可以直接在page.json中配置
|
||||
//推荐配置:"entryPagePath" : "/...." 或 "entryPagePath" : "pages-config/entryPagePath.json"
|
||||
"entryPagePath": ""
|
||||
}
|
40
pages-config.json
Normal file
40
pages-config.json
Normal file
@ -0,0 +1,40 @@
|
||||
/* ===pages-tool===
|
||||
该文件是pages-tool插件的配置文件
|
||||
pages-tool插件可实现将pages.josn中的配置拆分到多个配置文件中,以便实现模块化配置。
|
||||
在应用中配置项较多、页面较多时,分别在不同文件中进行配置,可使项目代码更为清晰。
|
||||
在团队多人合作时,按模块分工,分别管理不同的配置文件,可避免同时修改pages.json带来的代码冲突问题。
|
||||
|
||||
注意:启用该插件并设置了配置文件之后,pages.json配置文件中相关配置项的内容可能会被替换,应根据paes-config.json的设置情况决定哪些配置应该在pages.josn中设置,哪些应该在指定的文件中设置。
|
||||
提示:插件只会处理已设置的相关项点,不会覆盖pages.json中未指定的项点。详见配置示例
|
||||
|
||||
*/
|
||||
|
||||
{
|
||||
"globalStyle" : "pages-config/globalStyle.json",
|
||||
|
||||
"easycom" : "",
|
||||
|
||||
"tabBar" : "pages-config/tabBar.json",
|
||||
|
||||
"pages" : ["pages-config/pages-all.json"],
|
||||
|
||||
"condition" : "",
|
||||
|
||||
"leftWindow" : "",
|
||||
|
||||
"topWindow" : "",
|
||||
|
||||
"rightWindow" : "",
|
||||
|
||||
"uniIdRouter" : "",
|
||||
|
||||
///以下各项为小程序特有配置
|
||||
|
||||
"subPackages" : [],
|
||||
|
||||
"preloadRule" : "",
|
||||
|
||||
"workers" : "",
|
||||
|
||||
"entryPagePath": ""
|
||||
}
|
8
pages-config/globalStyle.json
Normal file
8
pages-config/globalStyle.json
Normal file
@ -0,0 +1,8 @@
|
||||
/* /// Pages-Tool: 该文件是pages-tool插件的配置文件,根据pages-config.json的配置,本文件的内容可能合并到pages.json*/
|
||||
{
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "RuoYi",
|
||||
"navigationBarBackgroundColor": "#FFFFFF"
|
||||
}
|
||||
}
|
75
pages-config/pages-all.json
Normal file
75
pages-config/pages-all.json
Normal file
@ -0,0 +1,75 @@
|
||||
/* /// Pages-Tool: 该文件是pages-tool插件的配置文件,根据pages-config.json的配置,本文件的内容可能合并到pages.json*/
|
||||
{
|
||||
"pages": [{
|
||||
"path": "pages/login",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/register",
|
||||
"style": {
|
||||
"navigationBarTitleText": "注册"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "若依移动端框架",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/work/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "工作台"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/avatar/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "修改头像"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/info/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人信息"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/info/edit",
|
||||
"style": {
|
||||
"navigationBarTitleText": "编辑资料"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/pwd/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "修改密码"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/setting/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "应用设置"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/help/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "常见问题"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/mine/about/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "关于我们"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/common/webview/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "浏览网页"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/common/textview/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "浏览文本"
|
||||
}
|
||||
}]
|
||||
}
|
25
pages-config/tabBar.json
Normal file
25
pages-config/tabBar.json
Normal file
@ -0,0 +1,25 @@
|
||||
/* /// Pages-Tool: 该文件是pages-tool插件的配置文件,根据pages-config.json的配置,本文件的内容可能合并到pages.json*/
|
||||
{
|
||||
"tabBar": {
|
||||
"color": "#000000",
|
||||
"selectedColor": "#000000",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#ffffff",
|
||||
"list": [{
|
||||
"pagePath": "pages/index",
|
||||
"iconPath": "static/images/tabbar/home.png",
|
||||
"selectedIconPath": "static/images/tabbar/home_.png",
|
||||
"text": "首页"
|
||||
}, {
|
||||
"pagePath": "pages/work/index",
|
||||
"iconPath": "static/images/tabbar/work.png",
|
||||
"selectedIconPath": "static/images/tabbar/work_.png",
|
||||
"text": "计算工具"
|
||||
}, {
|
||||
"pagePath": "pages/mine/index",
|
||||
"iconPath": "static/images/tabbar/mine.png",
|
||||
"selectedIconPath": "static/images/tabbar/mine_.png",
|
||||
"text": "我的"
|
||||
}]
|
||||
}
|
||||
}
|
43
pages.json
43
pages.json
@ -72,28 +72,27 @@
|
||||
}
|
||||
}],
|
||||
"tabBar": {
|
||||
"color": "#000000",
|
||||
"selectedColor": "#000000",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#ffffff",
|
||||
"list": [{
|
||||
"pagePath": "pages/index",
|
||||
"iconPath": "static/images/tabbar/home.png",
|
||||
"selectedIconPath": "static/images/tabbar/home_.png",
|
||||
"text": "首页"
|
||||
}, {
|
||||
"pagePath": "pages/work/index",
|
||||
"iconPath": "static/images/tabbar/work.png",
|
||||
"selectedIconPath": "static/images/tabbar/work_.png",
|
||||
"text": "工作台"
|
||||
}, {
|
||||
"pagePath": "pages/mine/index",
|
||||
"iconPath": "static/images/tabbar/mine.png",
|
||||
"selectedIconPath": "static/images/tabbar/mine_.png",
|
||||
"text": "我的"
|
||||
}
|
||||
]
|
||||
},
|
||||
"color": "#000000",
|
||||
"selectedColor": "#000000",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#ffffff",
|
||||
"list": [{
|
||||
"pagePath": "pages/index",
|
||||
"iconPath": "static/images/tabbar/home.png",
|
||||
"selectedIconPath": "static/images/tabbar/home_.png",
|
||||
"text": "首页"
|
||||
}, {
|
||||
"pagePath": "pages/work/index",
|
||||
"iconPath": "static/images/tabbar/work.png",
|
||||
"selectedIconPath": "static/images/tabbar/work_.png",
|
||||
"text": "计算工具"
|
||||
}, {
|
||||
"pagePath": "pages/mine/index",
|
||||
"iconPath": "static/images/tabbar/mine.png",
|
||||
"selectedIconPath": "static/images/tabbar/mine_.png",
|
||||
"text": "我的"
|
||||
}]
|
||||
},
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "RuoYi",
|
||||
|
371
pages/login.vue
371
pages/login.vue
@ -1,202 +1,207 @@
|
||||
<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>
|
||||
</view>
|
||||
<view class="reg text-center" v-if="register">
|
||||
<text class="text-grey1">没有账号?</text>
|
||||
<text @click="handleUserRegister" class="text-blue">立即注册</text>
|
||||
</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>
|
||||
|
||||
</view>
|
||||
<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>
|
||||
</view>
|
||||
<view class="reg text-center" v-if="register">
|
||||
<text class="text-grey1">没有账号?</text>
|
||||
<text @click="handleUserRegister" class="text-blue">立即注册</text>
|
||||
</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>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCodeImg } from '@/api/login'
|
||||
import { getCodeImg } from '@/api/login';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
codeUrl: "",
|
||||
captchaEnabled: true,
|
||||
// 用户注册开关
|
||||
register: false,
|
||||
globalConfig: getApp().globalData.config,
|
||||
loginForm: {
|
||||
username: "admin",
|
||||
password: "admin123",
|
||||
code: "",
|
||||
uuid: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCode()
|
||||
},
|
||||
methods: {
|
||||
// 用户注册
|
||||
handleUserRegister() {
|
||||
this.$tab.redirectTo(`/pages/register`)
|
||||
},
|
||||
// 隐私协议
|
||||
handlePrivacy() {
|
||||
let site = this.globalConfig.appInfo.agreements[0]
|
||||
this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
|
||||
},
|
||||
// 用户协议
|
||||
handleUserAgrement() {
|
||||
let site = this.globalConfig.appInfo.agreements[1]
|
||||
this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
|
||||
},
|
||||
// 获取图形验证码
|
||||
getCode() {
|
||||
getCodeImg().then(res => {
|
||||
this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
|
||||
if (this.captchaEnabled) {
|
||||
this.codeUrl = 'data:image/gif;base64,' + res.img
|
||||
this.loginForm.uuid = res.uuid
|
||||
}
|
||||
})
|
||||
},
|
||||
// 登录方法
|
||||
async handleLogin() {
|
||||
if (this.loginForm.username === "") {
|
||||
this.$modal.msgError("请输入您的账号")
|
||||
} else if (this.loginForm.password === "") {
|
||||
this.$modal.msgError("请输入您的密码")
|
||||
} else if (this.loginForm.code === "" && this.captchaEnabled) {
|
||||
this.$modal.msgError("请输入验证码")
|
||||
} else {
|
||||
this.$modal.loading("登录中,请耐心等待...")
|
||||
this.pwdLogin()
|
||||
}
|
||||
},
|
||||
// 密码登录
|
||||
async pwdLogin() {
|
||||
this.$store.dispatch('Login', this.loginForm).then(() => {
|
||||
this.$modal.closeLoading()
|
||||
this.loginSuccess()
|
||||
}).catch(() => {
|
||||
if (this.captchaEnabled) {
|
||||
this.getCode()
|
||||
}
|
||||
})
|
||||
},
|
||||
// 登录成功后,处理函数
|
||||
loginSuccess(result) {
|
||||
// 设置用户信息
|
||||
this.$store.dispatch('GetInfo').then(res => {
|
||||
this.$tab.reLaunch('/pages/index')
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
codeUrl: '',
|
||||
captchaEnabled: true,
|
||||
// 用户注册开关
|
||||
register: false,
|
||||
globalConfig: getApp().globalData.config,
|
||||
loginForm: {
|
||||
username: 'admin',
|
||||
password: 'admin123',
|
||||
code: '',
|
||||
uuid: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getCode();
|
||||
},
|
||||
methods: {
|
||||
handleConversion(result) {
|
||||
// console.log('初始值:', result.initialValue);
|
||||
// console.log('新值:', result.newValue);
|
||||
// console.log('老单位:', result.oldUnit);
|
||||
// console.log('新单位:', result.newUnit);
|
||||
},
|
||||
// 用户注册
|
||||
handleUserRegister() {
|
||||
this.$tab.redirectTo(`/pages/register`);
|
||||
},
|
||||
// 隐私协议
|
||||
handlePrivacy() {
|
||||
let site = this.globalConfig.appInfo.agreements[0];
|
||||
this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`);
|
||||
},
|
||||
// 用户协议
|
||||
handleUserAgrement() {
|
||||
let site = this.globalConfig.appInfo.agreements[1];
|
||||
this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`);
|
||||
},
|
||||
// 获取图形验证码
|
||||
getCode() {
|
||||
getCodeImg().then((res) => {
|
||||
this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
|
||||
if (this.captchaEnabled) {
|
||||
this.codeUrl = 'data:image/gif;base64,' + res.img;
|
||||
this.loginForm.uuid = res.uuid;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 登录方法
|
||||
async handleLogin() {
|
||||
if (this.loginForm.username === '') {
|
||||
this.$modal.msgError('请输入您的账号');
|
||||
} else if (this.loginForm.password === '') {
|
||||
this.$modal.msgError('请输入您的密码');
|
||||
} else if (this.loginForm.code === '' && this.captchaEnabled) {
|
||||
this.$modal.msgError('请输入验证码');
|
||||
} else {
|
||||
this.$modal.loading('登录中,请耐心等待...');
|
||||
this.pwdLogin();
|
||||
}
|
||||
},
|
||||
// 密码登录
|
||||
async pwdLogin() {
|
||||
this.$store
|
||||
.dispatch('Login', this.loginForm)
|
||||
.then(() => {
|
||||
this.$modal.closeLoading();
|
||||
this.loginSuccess();
|
||||
})
|
||||
.catch(() => {
|
||||
if (this.captchaEnabled) {
|
||||
this.getCode();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 登录成功后,处理函数
|
||||
loginSuccess(result) {
|
||||
// 设置用户信息
|
||||
this.$store.dispatch('GetInfo').then((res) => {
|
||||
this.$tab.reLaunch('/pages/index');
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.normal-login-container {
|
||||
width: 100%;
|
||||
.normal-login-container {
|
||||
width: 100%;
|
||||
|
||||
.logo-content {
|
||||
width: 100%;
|
||||
font-size: 21px;
|
||||
text-align: center;
|
||||
padding-top: 15%;
|
||||
.logo-content {
|
||||
width: 100%;
|
||||
font-size: 21px;
|
||||
text-align: center;
|
||||
padding-top: 15%;
|
||||
|
||||
image {
|
||||
border-radius: 4px;
|
||||
}
|
||||
image {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-form-content {
|
||||
text-align: center;
|
||||
margin: 20px auto;
|
||||
margin-top: 15%;
|
||||
width: 80%;
|
||||
.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;
|
||||
.input-item {
|
||||
margin: 20px auto;
|
||||
background-color: #f5f6f7;
|
||||
height: 45px;
|
||||
border-radius: 20px;
|
||||
|
||||
.icon {
|
||||
font-size: 38rpx;
|
||||
margin-left: 10px;
|
||||
color: #999;
|
||||
}
|
||||
.icon {
|
||||
font-size: 38rpx;
|
||||
margin-left: 10px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.input {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.input {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
padding-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.login-btn {
|
||||
margin-top: 40px;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
margin-top: 40px;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.reg {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.xieyi {
|
||||
color: #333;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.login-code {
|
||||
height: 38px;
|
||||
float: right;
|
||||
|
||||
.login-code-img {
|
||||
height: 38px;
|
||||
position: absolute;
|
||||
margin-left: 10px;
|
||||
width: 200rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.reg {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.xieyi {
|
||||
color: #333;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.login-code {
|
||||
height: 38px;
|
||||
float: right;
|
||||
|
||||
.login-code-img {
|
||||
height: 38px;
|
||||
position: absolute;
|
||||
margin-left: 10px;
|
||||
width: 200rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -1,198 +1,209 @@
|
||||
<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>
|
||||
|
||||
<script>
|
||||
import storage from '@/utils/storage'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
name: this.$store.state.user.name,
|
||||
version: getApp().globalData.config.appInfo.version
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
avatar() {
|
||||
return this.$store.state.user.avatar
|
||||
},
|
||||
windowHeight() {
|
||||
return uni.getSystemInfoSync().windowHeight - 50
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleToInfo() {
|
||||
this.$tab.navigateTo('/pages/mine/info/index')
|
||||
},
|
||||
handleToEditInfo() {
|
||||
this.$tab.navigateTo('/pages/mine/info/edit')
|
||||
},
|
||||
handleToSetting() {
|
||||
this.$tab.navigateTo('/pages/mine/setting/index')
|
||||
},
|
||||
handleToLogin() {
|
||||
this.$tab.reLaunch('/pages/login')
|
||||
},
|
||||
handleToAvatar() {
|
||||
this.$tab.navigateTo('/pages/mine/avatar/index')
|
||||
},
|
||||
handleLogout() {
|
||||
this.$modal.confirm('确定注销并退出系统吗?').then(() => {
|
||||
this.$store.dispatch('LogOut').then(() => {
|
||||
this.$tab.reLaunch('/pages/index')
|
||||
})
|
||||
})
|
||||
},
|
||||
handleHelp() {
|
||||
this.$tab.navigateTo('/pages/mine/help/index')
|
||||
},
|
||||
handleAbout() {
|
||||
this.$tab.navigateTo('/pages/mine/about/index')
|
||||
},
|
||||
handleJiaoLiuQun() {
|
||||
this.$modal.showToast('QQ群:133713780')
|
||||
},
|
||||
handleBuilding() {
|
||||
this.$modal.showToast('模块建设中~')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
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>
|
||||
<template>
|
||||
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
|
||||
<yjly-number_unit
|
||||
:unitType="'length'"
|
||||
:unitName.sync="selectedUnitName"
|
||||
:value.sync="inputValue"
|
||||
:showEnglishOnly="true"
|
||||
:decimalPlaces="5"
|
||||
@conversion="handleConversion"
|
||||
></yjly-number_unit>
|
||||
<!--顶部个人信息栏-->
|
||||
<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>
|
||||
|
||||
<script>
|
||||
import storage from '@/utils/storage';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectedUnitName: 'm(米)',
|
||||
inputValue: 12,
|
||||
|
||||
name: this.$store.state.user.name,
|
||||
version: getApp().globalData.config.appInfo.version
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
avatar() {
|
||||
return this.$store.state.user.avatar;
|
||||
},
|
||||
windowHeight() {
|
||||
return uni.getSystemInfoSync().windowHeight - 50;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleConversion(result) {
|
||||
// console.log('初始值:', result.initialValue);
|
||||
// console.log('新值:', result.newValue);
|
||||
// console.log('老单位:', result.oldUnit);
|
||||
// console.log('新单位:', result.newUnit);
|
||||
},
|
||||
|
||||
handleToInfo() {
|
||||
this.$tab.navigateTo('/pages/mine/info/index');
|
||||
},
|
||||
handleToEditInfo() {
|
||||
this.$tab.navigateTo('/pages/mine/info/edit');
|
||||
},
|
||||
handleToSetting() {
|
||||
this.$tab.navigateTo('/pages/mine/setting/index');
|
||||
},
|
||||
handleToLogin() {
|
||||
this.$tab.reLaunch('/pages/login');
|
||||
},
|
||||
handleToAvatar() {
|
||||
this.$tab.navigateTo('/pages/mine/avatar/index');
|
||||
},
|
||||
handleLogout() {
|
||||
this.$modal.confirm('确定注销并退出系统吗?').then(() => {
|
||||
this.$store.dispatch('LogOut').then(() => {
|
||||
this.$tab.reLaunch('/pages/index');
|
||||
});
|
||||
});
|
||||
},
|
||||
handleHelp() {
|
||||
this.$tab.navigateTo('/pages/mine/help/index');
|
||||
},
|
||||
handleAbout() {
|
||||
this.$tab.navigateTo('/pages/mine/about/index');
|
||||
},
|
||||
handleJiaoLiuQun() {
|
||||
this.$modal.showToast('QQ群:①133713780、②146013835');
|
||||
},
|
||||
handleBuilding() {
|
||||
this.$modal.showToast('模块建设中~');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
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>
|
||||
|
0
uni_modules/yjly-number_unit/changelog.md
Normal file
0
uni_modules/yjly-number_unit/changelog.md
Normal file
@ -0,0 +1,272 @@
|
||||
<template>
|
||||
<view class="unit-converter">
|
||||
<!-- 数值输入框 -->
|
||||
<input v-model="inputValue" type="number" @input="handleInputChange" class="input-field" :style="{ width: width + 'px' }" />
|
||||
<!-- 单位标签 -->
|
||||
<text @click="toggleUnit" @dblclick="openUnitSelector" class="unit-label" :style="{ color: 'blue' }">
|
||||
{{ displayUnitName }}
|
||||
</text>
|
||||
<!-- 单位选择弹出窗口 -->
|
||||
<!-- uni-popup 弹窗 -->
|
||||
<uni-popup ref="unitSelectorPopup" type="bottom" :show="showUnitSelector" @close="onPopupClose">
|
||||
<view class="unit-selector">
|
||||
<view v-for="unit in filteredUnitList" :key="unit.id" @click="selectUnit(unit)" class="unit-option">
|
||||
{{ showEnglishOnly ? unit.unitName.split('(')[0] : unit.unitName }}
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listConversion } from '@/api/system/conversion.js';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
// 单位类型
|
||||
unitType: {
|
||||
type: String,
|
||||
default: 'length'
|
||||
},
|
||||
// 是否只显示英文部分
|
||||
showEnglishOnly: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 当前单位名称
|
||||
unitName: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
},
|
||||
// 当前数值
|
||||
value: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
// 小数点位数
|
||||
decimalPlaces: {
|
||||
type: Number,
|
||||
default: 2
|
||||
},
|
||||
width: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 80
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
inputValue: this.value, // 输入的数值
|
||||
currentUnit: null, // 当前单位
|
||||
unitList: [], // 单位列表
|
||||
showUnitSelector: false // 是否显示单位选择窗口
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
// 在页面加载时添加全局点击事件监听器
|
||||
uni.$on('globalClick', this.handleClickOutside);
|
||||
},
|
||||
onUnload() {
|
||||
// 在页面卸载时移除全局点击事件监听器
|
||||
uni.$off('globalClick', this.handleClickOutside);
|
||||
},
|
||||
computed: {
|
||||
// 显示的单位名称
|
||||
displayUnitName() {
|
||||
if (!this.currentUnit) return '';
|
||||
return this.showEnglishOnly ? this.currentUnit.unitName.split('(')[0] : this.currentUnit.unitName;
|
||||
},
|
||||
// 过滤后的单位列表(排除当前单位)
|
||||
filteredUnitList() {
|
||||
return this.unitList.filter((unit) => unit.unitName !== this.currentUnit?.unitName);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 监听 unitType 变化,重新加载单位列表
|
||||
unitType: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
this.loadUnitList(newVal);
|
||||
}
|
||||
},
|
||||
// 监听 unitName 变化,更新当前单位
|
||||
unitName: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
console.log(newVal);
|
||||
this.currentUnit = this.unitList.find((unit) => unit.unitName == newVal);
|
||||
}
|
||||
},
|
||||
// 监听 value 变化,更新输入框的值
|
||||
value: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
this.inputValue = newVal;
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 处理全局点击事件
|
||||
handleClickOutside(event) {
|
||||
if (this.$refs.unitSelector && !this.$refs.unitSelector.contains(event.target)) {
|
||||
this.showUnitSelector = false;
|
||||
}
|
||||
},
|
||||
// 切换单位选择器的显示状态
|
||||
toggleUnitSelector() {
|
||||
this.showUnitSelector = !this.showUnitSelector;
|
||||
},
|
||||
// 加载单位列表
|
||||
async loadUnitList(unitType) {
|
||||
try {
|
||||
const response = await listConversion({ pageSize: 100, unitType: unitType });
|
||||
console.log(response);
|
||||
this.unitList = response.rows;
|
||||
if (this.unitName == '') {
|
||||
// 处理默认基准单位
|
||||
this.currentUnit = this.unitList.find((unit) => unit.baseUnit == 1);
|
||||
console.log(this.currentUnit);
|
||||
} else {
|
||||
this.currentUnit = this.unitList.find((unit) => unit.unitName == this.unitName);
|
||||
console.log(this.currentUnit);
|
||||
if (this.currentUnit === undefined) {
|
||||
this.currentUnit = this.unitList.find((unit) => unit.baseUnit === 1);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Failed to load unit list:', error);
|
||||
}
|
||||
},
|
||||
// 处理输入框变化
|
||||
handleInputChange() {
|
||||
this.$emit('input', this.inputValue); // 将输入值同步到父组件
|
||||
this.convertAndEmit();
|
||||
},
|
||||
// 切换单位
|
||||
toggleUnit() {
|
||||
const currentIndex = this.unitList.indexOf(this.currentUnit);
|
||||
const nextIndex = (currentIndex + 1) % this.unitList.length;
|
||||
let oldUnit = this.currentUnit;
|
||||
let newUnit = this.unitList[nextIndex];
|
||||
this.currentUnit = newUnit;
|
||||
// console.log('切换单位', currentIndex, nextIndex, this.currentUnit);
|
||||
this.convertAndEmit(oldUnit, newUnit);
|
||||
},
|
||||
// 打开单位选择窗口
|
||||
openUnitSelector() {
|
||||
this.showUnitSelector = true;
|
||||
},
|
||||
// 选择单位
|
||||
selectUnit(unit) {
|
||||
console.log('所选择的单位', unit);
|
||||
let oldUnit = this.currentUnit;
|
||||
let newUnit = unit;
|
||||
this.currentUnit = unit;
|
||||
this.showUnitSelector = false;
|
||||
this.convertAndEmit(oldUnit, newUnit);
|
||||
},
|
||||
// 换算并提交结果
|
||||
convertAndEmit(oldUnit, newUnit) {
|
||||
if (!newUnit) return;
|
||||
// 获取基准单位
|
||||
const baseUnit = this.unitList.find((unit) => unit.baseUnit === 1);
|
||||
if (!baseUnit) return;
|
||||
// 将输入值转换为基准单位的值
|
||||
const baseValue = this.inputValue / oldUnit.conversionFactor;
|
||||
// 将基准单位的值转换为新单位的值
|
||||
const newValue = baseValue * newUnit.conversionFactor;
|
||||
|
||||
console.log('转换值', newUnit.unitName, this.inputValue, baseValue, newValue);
|
||||
|
||||
let roundedValue;
|
||||
if (newUnit.unitName === 'ly(光年)') {
|
||||
// 对于光年,使用科学计数法显示结果
|
||||
roundedValue = newValue.toExponential();
|
||||
} else {
|
||||
roundedValue = this.roundToDecimalPlaces(newValue);
|
||||
}
|
||||
|
||||
// 提交结果给父组件
|
||||
this.$emit('conversion', {
|
||||
initialValue: this.inputValue,
|
||||
newValue: roundedValue,
|
||||
oldUnit: oldUnit.unitName,
|
||||
newUnit: newUnit.unitName
|
||||
});
|
||||
|
||||
this.inputValue = parseFloat(roundedValue);
|
||||
|
||||
// 更新父组件的 unitName
|
||||
this.$emit('update:unitName', this.currentUnit.unitName);
|
||||
},
|
||||
// 四舍六入五留双
|
||||
// 按照四舍六入五留双处理结果 conversionFactor
|
||||
roundToDecimalPlaces(value) {
|
||||
const multiplier = Math.pow(10, this.decimalPlaces);
|
||||
const val = value * multiplier;
|
||||
const intVal = Math.trunc(val);
|
||||
const decimalPart = val - intVal;
|
||||
if (decimalPart < 0.5) {
|
||||
return intVal / multiplier;
|
||||
} else if (decimalPart > 0.5) {
|
||||
return (intVal + 1) / multiplier;
|
||||
} else {
|
||||
return intVal % 2 === 0 ? intVal / multiplier : (intVal + 1) / multiplier;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.unit-converter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-field {
|
||||
padding: 2px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.unit-label {
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.unit-selector {
|
||||
/* 设置容器的最大高度,当内容超出这个高度时会出现滚动条 */
|
||||
max-height: 200px;
|
||||
/* 超出内容时显示纵向滚动条 */
|
||||
overflow-y: auto;
|
||||
/* 横向内容不溢出,隐藏多余部分 */
|
||||
overflow-x: hidden;
|
||||
/* 其他样式保持不变 */
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
background-color: white;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
padding: 2px 0;
|
||||
min-width: 100px;
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.unit-option {
|
||||
padding: 2px 10px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.unit-option:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
</style>
|
83
uni_modules/yjly-number_unit/package.json
Normal file
83
uni_modules/yjly-number_unit/package.json
Normal file
@ -0,0 +1,83 @@
|
||||
{
|
||||
"id": "yjly-number_unit",
|
||||
"displayName": "yjly-number_unit",
|
||||
"version": "1.0.0",
|
||||
"description": "yjly-number_unit",
|
||||
"keywords": [
|
||||
"yjly-number_unit"
|
||||
],
|
||||
"repository": "",
|
||||
"engines": {
|
||||
"HBuilderX": "^3.1.0"
|
||||
},
|
||||
"dcloudext": {
|
||||
"type": "component-vue",
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "",
|
||||
"data": "",
|
||||
"permissions": ""
|
||||
},
|
||||
"npmurl": ""
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "u",
|
||||
"aliyun": "u",
|
||||
"alipay": "u"
|
||||
},
|
||||
"client": {
|
||||
"Vue": {
|
||||
"vue2": "u",
|
||||
"vue3": "u"
|
||||
},
|
||||
"App": {
|
||||
"app-vue": "u",
|
||||
"app-nvue": "u",
|
||||
"app-uvue": "u"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "u",
|
||||
"Android Browser": "u",
|
||||
"微信浏览器(Android)": "u",
|
||||
"QQ浏览器(Android)": "u"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "u",
|
||||
"IE": "u",
|
||||
"Edge": "u",
|
||||
"Firefox": "u",
|
||||
"Safari": "u"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "u",
|
||||
"阿里": "u",
|
||||
"百度": "u",
|
||||
"字节跳动": "u",
|
||||
"QQ": "u",
|
||||
"钉钉": "u",
|
||||
"快手": "u",
|
||||
"飞书": "u",
|
||||
"京东": "u"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
1
uni_modules/yjly-number_unit/readme.md
Normal file
1
uni_modules/yjly-number_unit/readme.md
Normal file
@ -0,0 +1 @@
|
||||
# yjly-number_unit
|
Loading…
Reference in New Issue
Block a user