v2.1 2022-10-22
1.添加自动登录逻辑 2.各个界面微调美化
This commit is contained in:
@@ -0,0 +1,177 @@
|
|||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
globalData: {
|
||||||
|
website: "https://www.lailab.cn/miniprogram",
|
||||||
|
hasUserInfo: false,
|
||||||
|
userInfo: {},
|
||||||
|
openId: null
|
||||||
|
},
|
||||||
|
onLaunch: function() {
|
||||||
|
this.login();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
login() {
|
||||||
|
const that = this
|
||||||
|
if (this.globalData.hasUserInfo) {
|
||||||
|
console.log("已获取用户信息");
|
||||||
|
} else {
|
||||||
|
//调用登录接口
|
||||||
|
uni.login({
|
||||||
|
success: function(res1) {
|
||||||
|
// 获取个人 code
|
||||||
|
uni.getUserInfo({
|
||||||
|
success: res2 => {
|
||||||
|
// 获取 OpenId
|
||||||
|
wx.request({
|
||||||
|
url: that.globalData.website +
|
||||||
|
"/api/getOpenId.php",
|
||||||
|
method: "POST",
|
||||||
|
data: {
|
||||||
|
code: res1.code,
|
||||||
|
},
|
||||||
|
header: {
|
||||||
|
"Content-Type": "application/x-www-form-urlencoded"
|
||||||
|
},
|
||||||
|
success: function(res3) {
|
||||||
|
if (res3.data.result.openid) {
|
||||||
|
that.globalData.openId = res3.data
|
||||||
|
.result.openid;
|
||||||
|
console.log("获取OpenId成功");
|
||||||
|
uni.request({
|
||||||
|
url: that.globalData
|
||||||
|
.website +
|
||||||
|
"/api/getUserInfo.php",
|
||||||
|
method: 'POST',
|
||||||
|
data: {
|
||||||
|
openId: res3.data
|
||||||
|
.result.openid
|
||||||
|
},
|
||||||
|
success(res4) {
|
||||||
|
if (res4.data.err ==
|
||||||
|
0) {
|
||||||
|
console.log(
|
||||||
|
"用户未注册");
|
||||||
|
uni.showModal({
|
||||||
|
title: '提示',
|
||||||
|
content: '检测到您尚未登录，某些工具可能无权使用，请先去登录。',
|
||||||
|
confirmText: '去登陆',
|
||||||
|
cancelText: '取消',
|
||||||
|
success(res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
that.userLogin();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else if (res4.data
|
||||||
|
.err == 1) {
|
||||||
|
console.log(
|
||||||
|
"用户已注册");
|
||||||
|
that.globalData
|
||||||
|
.userInfo =
|
||||||
|
res4.data
|
||||||
|
.result[0];
|
||||||
|
that.globalData
|
||||||
|
.hasUserInfo =
|
||||||
|
true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
console.log("获取OpenId失败", res3);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: function(res3) {
|
||||||
|
console.log("访问OpenId服务器失败", res);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail: function() {
|
||||||
|
that.authorizeCheck("scope.userInfo");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail(res) {
|
||||||
|
console.log("调用登录服务失败", res);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getRandomShareTitle: function() {
|
||||||
|
var arr = [];
|
||||||
|
|
||||||
|
if (this.globalData.shareapptext) {
|
||||||
|
arr = this.globalData.shareapptext;
|
||||||
|
}
|
||||||
|
|
||||||
|
return arr[Math.floor(Math.random() * arr.length)];
|
||||||
|
},
|
||||||
|
getMainAppShare: function() {
|
||||||
|
return {
|
||||||
|
title: this.getRandomShareTitle(),
|
||||||
|
path: '/pages/index/index',
|
||||||
|
success: function(res) {
|
||||||
|
// 转发成功
|
||||||
|
},
|
||||||
|
fail: function(res) {
|
||||||
|
// 转发失败
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
userLogin() {
|
||||||
|
const that = this;
|
||||||
|
// 若用户未登录
|
||||||
|
if (!that.globalData.hasUserInfo) {
|
||||||
|
that.toast("正在登录", 'loading');
|
||||||
|
uni.getUserProfile({
|
||||||
|
desc: "获取你的昵称、头像、地区及性别",
|
||||||
|
success: res => {
|
||||||
|
that.globalData.hasUserInfo = true;
|
||||||
|
that.globalData.userInfo = res.userInfo;
|
||||||
|
that.toast("登录成功", 'success');
|
||||||
|
uni.switchTab({
|
||||||
|
url: '/pages/mine/mine'
|
||||||
|
})
|
||||||
|
const openId = that.globalData.openId;
|
||||||
|
if (openId) {
|
||||||
|
res.userInfo.openId = openId;
|
||||||
|
uni.request({
|
||||||
|
url: that.globalData.website + "/api/login.php",
|
||||||
|
method: 'POST',
|
||||||
|
data: res.userInfo,
|
||||||
|
success(res) {
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: res.msg
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
console.log("没有OpenId,请重新进入小程序");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: res => {
|
||||||
|
that.toast("您拒绝了请求", 'error');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
that.toast("您已经登录",'none');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toast(title, icon) {
|
||||||
|
uni.showToast({
|
||||||
|
title: title,
|
||||||
|
icon: icon
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/*每个页面公共css */
|
||||||
|
uni-page-body,
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,108 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 主页展示卡片 -->
|
||||||
|
<view class="ic-container">
|
||||||
|
<image class="ic-image" mode="widthFix" :src="url" lazy-load="true"/>
|
||||||
|
<text class="ic-source" :class="'level-'+Math.ceil(Math.random()*9)">{{id}}</text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "image-card",
|
||||||
|
props: {
|
||||||
|
url: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
},
|
||||||
|
id: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
},
|
||||||
|
source: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isShow: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showImage() {
|
||||||
|
this.isShow = true;
|
||||||
|
},
|
||||||
|
closeImage() {
|
||||||
|
this.isShow = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.ic-container {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ic-image {
|
||||||
|
min-height: 200px;
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 20px;
|
||||||
|
margin-top: 10px;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.ic-source {
|
||||||
|
min-height: 15px;
|
||||||
|
min-width: 15px;
|
||||||
|
line-height: 15px;
|
||||||
|
padding: 3px 7px;
|
||||||
|
border-radius: 7px;
|
||||||
|
font-size: 12px;
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
left: 15px;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-1 {
|
||||||
|
background-color: #c8d6e5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-2 {
|
||||||
|
background-color: #576574;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-3 {
|
||||||
|
background-color: #222f3e;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-4 {
|
||||||
|
background-color: #48dbfb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-5 {
|
||||||
|
background-color: #54a0ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-6 {
|
||||||
|
background-color: #5f27cd;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-7 {
|
||||||
|
background-color: #feca57;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-8 {
|
||||||
|
background-color: #ff9ff3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-9 {
|
||||||
|
background-color: #ff6b6b;
|
||||||
|
clear: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,127 @@
|
|||||||
|
<template>
|
||||||
|
<view class="tc-container" @tap="turn2Url(url)">
|
||||||
|
<view class="tc-text">
|
||||||
|
<text class="tc-title">{{title}}</text>
|
||||||
|
<text class="tc-detail">{{detail}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="tc-img">
|
||||||
|
<text class="tc-bg" :style="{'backgroundColor':color}"></text>
|
||||||
|
<image class="tc-icon" :src="icon" mode="scaleToFill"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "tool-card",
|
||||||
|
props: {
|
||||||
|
title: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
},
|
||||||
|
detail: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
},
|
||||||
|
icon: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
},
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
},
|
||||||
|
url: {
|
||||||
|
type: String,
|
||||||
|
value: ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
turn2Url(iurl) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: iurl,
|
||||||
|
success() {
|
||||||
|
uni.showToast({
|
||||||
|
title: "正在加载",
|
||||||
|
icon: "loading",
|
||||||
|
duration: 500
|
||||||
|
});
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
uni.showToast({
|
||||||
|
title: "开发中...",
|
||||||
|
icon: "error"
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.tc-container {
|
||||||
|
width: 100%;
|
||||||
|
height: 90px;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tc-text {
|
||||||
|
width: 70%;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tc-title {
|
||||||
|
margin: 15px 15px 2px 15px;
|
||||||
|
height: 20px;
|
||||||
|
line-height: 20px;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 18px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tc-detail {
|
||||||
|
margin: 0 0 0 15px;
|
||||||
|
height: 15px;
|
||||||
|
line-height: 15px;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #888888;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tc-img {
|
||||||
|
width: 30%;
|
||||||
|
float: left;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tc-bg {
|
||||||
|
display: block;
|
||||||
|
height: 36px;
|
||||||
|
width: 36px;
|
||||||
|
margin: 12px;
|
||||||
|
border-radius: 18px;
|
||||||
|
background-color: pink;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tc-icon {
|
||||||
|
height: 24px;
|
||||||
|
width: 24px;
|
||||||
|
margin: 12px;
|
||||||
|
border-radius: 18px;
|
||||||
|
position: absolute;
|
||||||
|
right: 6px;
|
||||||
|
top: 6px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
+20
@@ -0,0 +1,20 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<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>
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
import App from './App'
|
||||||
|
|
||||||
|
// #ifndef VUE3
|
||||||
|
import Vue from 'vue'
|
||||||
|
Vue.config.productionTip = false
|
||||||
|
App.mpType = 'app'
|
||||||
|
const app = new Vue({
|
||||||
|
...App
|
||||||
|
})
|
||||||
|
app.$mount()
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifdef VUE3
|
||||||
|
import { createSSRApp } from 'vue'
|
||||||
|
export function createApp() {
|
||||||
|
const app = createSSRApp(App)
|
||||||
|
return {
|
||||||
|
app
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// #endif
|
||||||
+127
@@ -0,0 +1,127 @@
|
|||||||
|
{
|
||||||
|
"name" : "LaiLab工具箱",
|
||||||
|
"appid" : "__UNI__C046081",
|
||||||
|
"description" : "",
|
||||||
|
"versionName" : "1.0.0",
|
||||||
|
"versionCode" : "100",
|
||||||
|
"transformPx" : false,
|
||||||
|
/* 5+App特有相关 */
|
||||||
|
"app-plus" : {
|
||||||
|
"usingComponents" : true,
|
||||||
|
"nvueStyleCompiler" : "uni-app",
|
||||||
|
"compilerVersion" : 3,
|
||||||
|
"splashscreen" : {
|
||||||
|
"alwaysShowBeforeRender" : true,
|
||||||
|
"waiting" : true,
|
||||||
|
"autoclose" : true,
|
||||||
|
"delay" : 0
|
||||||
|
},
|
||||||
|
/* 模块配置 */
|
||||||
|
"modules" : {
|
||||||
|
"OAuth" : {}
|
||||||
|
},
|
||||||
|
/* 应用发布信息 */
|
||||||
|
"distribute" : {
|
||||||
|
/* android打包配置 */
|
||||||
|
"android" : {
|
||||||
|
"permissions" : [
|
||||||
|
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||||
|
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
/* ios打包配置 */
|
||||||
|
"ios" : {
|
||||||
|
"capabilities" : {
|
||||||
|
"entitlements" : {
|
||||||
|
"com.apple.developer.associated-domains" : [ "applinks:lailab.cn", "applinks:mp.lailab.cn" ]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* SDK配置 */
|
||||||
|
"sdkConfigs" : {
|
||||||
|
"oauth" : {
|
||||||
|
"weixin" : {
|
||||||
|
"appid" : "wx09ed3facc95abf94",
|
||||||
|
"appsecret" : "",
|
||||||
|
"UniversalLinks" : "https://mp.lailab.cn/uni-universallinks/__UNI__C046081/"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"maps" : {},
|
||||||
|
"ad" : {
|
||||||
|
"hw" : {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"icons" : {
|
||||||
|
"android" : {
|
||||||
|
"hdpi" : "static/icons/logos/72x72.png",
|
||||||
|
"xhdpi" : "static/icons/logos/96x96.png",
|
||||||
|
"xxhdpi" : "static/icons/logos/144x144.png",
|
||||||
|
"xxxhdpi" : "static/icons/logos/192x192.png"
|
||||||
|
},
|
||||||
|
"ios" : {
|
||||||
|
"appstore" : "static/icons/logos/1024x1024.png",
|
||||||
|
"ipad" : {
|
||||||
|
"app" : "static/icons/logos/76x76.png",
|
||||||
|
"app@2x" : "static/icons/logos/152x152.png",
|
||||||
|
"notification" : "static/icons/logos/20x20.png",
|
||||||
|
"notification@2x" : "static/icons/logos/40x40.png",
|
||||||
|
"proapp@2x" : "static/icons/logos/167x167.png",
|
||||||
|
"settings" : "static/icons/logos/29x29.png",
|
||||||
|
"settings@2x" : "static/icons/logos/58x58.png",
|
||||||
|
"spotlight" : "static/icons/logos/40x40.png",
|
||||||
|
"spotlight@2x" : "static/icons/logos/80x80.png"
|
||||||
|
},
|
||||||
|
"iphone" : {
|
||||||
|
"app@2x" : "static/icons/logos/120x120.png",
|
||||||
|
"app@3x" : "static/icons/logos/180x180.png",
|
||||||
|
"notification@2x" : "static/icons/logos/40x40.png",
|
||||||
|
"notification@3x" : "static/icons/logos/60x60.png",
|
||||||
|
"settings@2x" : "static/icons/logos/58x58.png",
|
||||||
|
"settings@3x" : "static/icons/logos/87x87.png",
|
||||||
|
"spotlight@2x" : "static/icons/logos/80x80.png",
|
||||||
|
"spotlight@3x" : "static/icons/logos/120x120.png"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* 快应用特有相关 */
|
||||||
|
"quickapp" : {},
|
||||||
|
/* 小程序特有相关 */
|
||||||
|
"mp-weixin" : {
|
||||||
|
"appid" : "wx09ed3facc95abf94",
|
||||||
|
"setting" : {
|
||||||
|
"urlCheck" : false,
|
||||||
|
"minified" : true
|
||||||
|
},
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-alipay" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-baidu" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-toutiao" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"uniStatistics" : {
|
||||||
|
"enable" : false
|
||||||
|
},
|
||||||
|
"vueVersion" : "3",
|
||||||
|
"_spaceID" : "2eebff55-6264-4fb1-91bf-56146519ad87"
|
||||||
|
}
|
||||||
Generated
+7
@@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"requires": true,
|
||||||
|
"lockfileVersion": 1,
|
||||||
|
"dependencies": {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
+126
@@ -0,0 +1,126 @@
|
|||||||
|
{
|
||||||
|
"pages": [{
|
||||||
|
"path": "pages/home/home",
|
||||||
|
"style": {
|
||||||
|
"navigationBarBackgroundColor": "#ffffff",
|
||||||
|
"enablePullDownRefresh": true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/more/more",
|
||||||
|
"style": {
|
||||||
|
"navigationBarBackgroundColor": "#ffffff"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mine/mine",
|
||||||
|
"style": {
|
||||||
|
"navigationBarBackgroundColor": "#ffffff"
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
"path": "pages/utils/showImg/showImg",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTextStyle": "black",
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/utils/showText/showText",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTextStyle": "black"
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/bayinhe/bayinhe",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "八音盒",
|
||||||
|
"navigationBarBackgroundColor": "#ffffff"
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/erweima/erweima",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "二维码",
|
||||||
|
"navigationBarBackgroundColor": "#54a0ff",
|
||||||
|
"navigationBarTextStyle": "white"
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/qiaomuyu/qiaomuyu",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "敲木鱼",
|
||||||
|
"navigationBarBackgroundColor": "#000000",
|
||||||
|
"navigationBarTextStyle": "white"
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/zhengjianzhao/zhengjianzhao",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "证件照",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/zhinengkoutu/zhinengkoutu",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "智能抠图",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/mosidianma/mosidianma",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "摩斯电码",
|
||||||
|
"navigationBarBackgroundColor": "#54a0ff",
|
||||||
|
"navigationBarTextStyle": "white"
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
"path": "pages/subpages/suijitouzi/suijitouzi",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "随机骰子",
|
||||||
|
"navigationBarBackgroundColor": "#f6f7f9"
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/subpages/choujiangzhushou/choujiangzhushou",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"globalStyle": {
|
||||||
|
"navigationBarTextStyle": "black",
|
||||||
|
"navigationBarTitleText": "LaiLab工具箱",
|
||||||
|
"navigationBarBackgroundColor": "#ffffff",
|
||||||
|
"backgroundColor": "#ffffff",
|
||||||
|
"lazyCodeLoading": "requiredComponents"
|
||||||
|
},
|
||||||
|
"tabBar": {
|
||||||
|
"color": "#7A7E83",
|
||||||
|
"selectedColor": "#000000",
|
||||||
|
"borderStyle": "white",
|
||||||
|
"backgroundColor": "#ffffff",
|
||||||
|
"list": [{
|
||||||
|
"pagePath": "pages/home/home",
|
||||||
|
"iconPath": "static/images/image_home.png",
|
||||||
|
"selectedIconPath": "static/images/image_home_selected.png",
|
||||||
|
"text": "主页"
|
||||||
|
}, {
|
||||||
|
"pagePath": "pages/more/more",
|
||||||
|
"iconPath": "static/images/image_more.png",
|
||||||
|
"selectedIconPath": "static/images/image_more_selected.png",
|
||||||
|
"text": "更多"
|
||||||
|
}, {
|
||||||
|
"pagePath": "pages/mine/mine",
|
||||||
|
"iconPath": "static/images/image_mine.png",
|
||||||
|
"selectedIconPath": "static/images/image_mine_selected.png",
|
||||||
|
"text": "我的"
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
@@ -0,0 +1,321 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<!-- 主体区域 -->
|
||||||
|
<view class="main">
|
||||||
|
<!-- 提示区域 -->
|
||||||
|
<view class="tip" :class="'level-'+tip.level" v-if="(tip!='')&&(tip.isShow)" @tap="showTip()">
|
||||||
|
<text class="tip-text">
|
||||||
|
{{tip.msg}}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
<view class="tip" v-else></view>
|
||||||
|
<!-- 轮播图 -->
|
||||||
|
<swiper class="swiper" v-if="(swiper!='')" :indicator-dots="swiper.indicatorDots"
|
||||||
|
:vertical="swiper.vertical" :circular="swiper.circular" :interval="swiper.interval"
|
||||||
|
:duration="swiper.duration" :autoplay="swiper.autoplay">
|
||||||
|
<swiper-item v-for="(item,index) in swiper.background" :key="index"
|
||||||
|
@tap="item.clickable?swiperTap(item.action,item.content):null">
|
||||||
|
<view class="swiper-item" v-if="item.type=='color'" :style="{backgroundColor:item.background}">
|
||||||
|
{{item.text}}
|
||||||
|
</view>
|
||||||
|
<image class="swiper-item" v-if="item.type=='image'" :src="item.background" :mode="item.imageMode">
|
||||||
|
</image>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
<view class="swiper" v-else></view>
|
||||||
|
<!-- 图片展示区域 -->
|
||||||
|
<view class="pics" v-if="(pics!='')">
|
||||||
|
<!-- 瀑布流左边 -->
|
||||||
|
<view class="left">
|
||||||
|
<icard class="icard" v-for="(item,index) in leftList" :key="index" :url="item.url"
|
||||||
|
:source="item.source" :id="item.id" @tap="showImg(item)"></icard>
|
||||||
|
</view>
|
||||||
|
<!-- 瀑布流右边 -->
|
||||||
|
<view class="right">
|
||||||
|
<icard class="icard" v-for="(item,index) in rightList" :key="index" :url="item.url"
|
||||||
|
:source="item.source" :id="item.id" @tap="showImg(item)"></icard>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="pics" v-else>
|
||||||
|
<!-- 瀑布流左边 -->
|
||||||
|
<view class="left">
|
||||||
|
<icard class="icard-left-tmp"></icard>
|
||||||
|
<icard class="icard-left-tmp"></icard>
|
||||||
|
</view>
|
||||||
|
<!-- 瀑布流右边 -->
|
||||||
|
<view class="right">
|
||||||
|
<icard class="icard-right-tmp"></icard>
|
||||||
|
<icard class="icard-right-tmp"></icard>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="pic-show-more" @tap="showMorePics()">加载更多</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import icard from "@/components/image-card.vue";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
icard,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
"picPage": 1,
|
||||||
|
"picSize": 4,
|
||||||
|
// 初始化左右盒子
|
||||||
|
"leftList": [],
|
||||||
|
"rightList": [],
|
||||||
|
// 初始化左右盒子高度
|
||||||
|
"leftH": 0,
|
||||||
|
"rightH": 0,
|
||||||
|
'tip': '',
|
||||||
|
'swiper': '',
|
||||||
|
'pics': ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.getDataByOnline();
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
const that = this;
|
||||||
|
this.leftList = [];
|
||||||
|
this.rightList = [];
|
||||||
|
this.tip = {};
|
||||||
|
this.swiper = {};
|
||||||
|
this.pics = '';
|
||||||
|
setTimeout(function() {
|
||||||
|
that.getDataByOnline();
|
||||||
|
uni.showToast({
|
||||||
|
title: "刷新成功",
|
||||||
|
duration: 500
|
||||||
|
})
|
||||||
|
uni.hideNavigationBarLoading();
|
||||||
|
//完成停止加载图标
|
||||||
|
uni.stopPullDownRefresh();
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getDataByOnline() {
|
||||||
|
const that = this;
|
||||||
|
uni.request({
|
||||||
|
url: 'https://www.lailab.cn/miniprogram/data.php?type=all',
|
||||||
|
success(rst) {
|
||||||
|
that.tip = rst.data.tip;
|
||||||
|
that.swiper = rst.data.swiper;
|
||||||
|
that.showPics();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
doList() {
|
||||||
|
const that = this;
|
||||||
|
// console.log("pics", this.pics);
|
||||||
|
if ((this.pics == '') || (this.pics == undefined)) return;
|
||||||
|
that.pics.forEach(res => {
|
||||||
|
// 获取图片宽高
|
||||||
|
uni.getImageInfo({
|
||||||
|
src: res.url,
|
||||||
|
success: (image) => {
|
||||||
|
// console.log("image", image);
|
||||||
|
// 计算图片渲染高度
|
||||||
|
let showH = (50 * image.height) / image.width
|
||||||
|
// 判断左右盒子高度
|
||||||
|
if (that.leftH <= that.rightH) {
|
||||||
|
that.leftList.push(res);
|
||||||
|
that.leftH += showH;
|
||||||
|
} else {
|
||||||
|
that.rightList.push(res);
|
||||||
|
that.rightH += showH;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
showTip() {
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: this.tip.msg,
|
||||||
|
confirmText: "我知道了",
|
||||||
|
showCancel: false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
showMorePics() {
|
||||||
|
uni.showToast({
|
||||||
|
title: "加载更多",
|
||||||
|
icon: "loading"
|
||||||
|
});
|
||||||
|
this.picPage += 1;
|
||||||
|
this.showPics();
|
||||||
|
},
|
||||||
|
showPics() {
|
||||||
|
const that = this;
|
||||||
|
uni.request({
|
||||||
|
url: "https://www.lailab.cn/miniprogram/pics.php?page=" + that.picPage + "&size=" + that
|
||||||
|
.picSize,
|
||||||
|
success(rst) {
|
||||||
|
// console.log(rst);
|
||||||
|
that.pics = rst.data;
|
||||||
|
that.doList();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
showImg(pic) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/utils/showImg/showImg?id=${pic.id}&url=${pic.url}&source=${pic.source}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
swiperTap(action, content) {
|
||||||
|
switch (action) {
|
||||||
|
case "dialog":
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: content
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case "goto":
|
||||||
|
uni.navigateTo({
|
||||||
|
url: content
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 主体区域 */
|
||||||
|
.main {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 提示区域 */
|
||||||
|
.tip {
|
||||||
|
width: auto;
|
||||||
|
height: 30px;
|
||||||
|
margin: 10px 10px 0 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 15px;
|
||||||
|
padding: 5px;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 提示区域文字 */
|
||||||
|
.tip-text {
|
||||||
|
width: auto;
|
||||||
|
white-space: nowrap;
|
||||||
|
animation: 10s loop linear infinite normal;
|
||||||
|
display: inline-block;
|
||||||
|
color: white;
|
||||||
|
vertical-align: top;
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 30px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* swiper轮播图样式 */
|
||||||
|
.swiper {
|
||||||
|
height: 200px;
|
||||||
|
width: auto;
|
||||||
|
margin: 10px 10px 5px 10px;
|
||||||
|
border-radius: 20px;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-item {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
color: white;
|
||||||
|
font-size: 40px;
|
||||||
|
line-height: 200px;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 展示图片 */
|
||||||
|
.pics {
|
||||||
|
padding: 0 30rpx;
|
||||||
|
font-size: 14rpx;
|
||||||
|
line-height: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right,
|
||||||
|
.left {
|
||||||
|
display: inline-block;
|
||||||
|
width: 48%;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
margin-right: 4%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icard-left-tmp {
|
||||||
|
height: 200px;
|
||||||
|
background-color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icard-right-tmp {
|
||||||
|
height: 150px;
|
||||||
|
background-color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 图片下方加载更多 */
|
||||||
|
.pic-show-more {
|
||||||
|
display: block;
|
||||||
|
height: 40px;
|
||||||
|
margin: 10px;
|
||||||
|
border-radius: 20px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
background-color: #ff6b6b;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 18px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 各种等级文字及背景颜色 */
|
||||||
|
.level-1 {
|
||||||
|
background-color: #222f3e;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-2 {
|
||||||
|
background-color: #54a0ff;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-3 {
|
||||||
|
background-color: #feca57;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-4 {
|
||||||
|
background-color: #ff6b6b;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 提示框平移动画 */
|
||||||
|
@keyframes loop {
|
||||||
|
0% {
|
||||||
|
transform: translateX(350px);
|
||||||
|
-webkit-transform: translateX(350px);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateX(-100%);
|
||||||
|
-webkit-transform: translateX(-100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,397 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="user-info" open-type="getUserInfo" @tap="login()">
|
||||||
|
<view class="info-img">
|
||||||
|
<view class="img-bg"></view>
|
||||||
|
<image class="img-icon" :src="hasUserInfo?userInfo.avatarUrl:''" mode="cover"></image>
|
||||||
|
</view>
|
||||||
|
<view class="info-text">
|
||||||
|
<text class="text-name">{{hasUserInfo?userInfo.nickName:"点击登录"}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="items">
|
||||||
|
<button class="item" open-type="contact">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_author_message.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">联系作者</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<button class="item feedback" @tap="feedback()">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_feedback.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">反馈问题</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<button class="item clearcatch" @tap="clearStorage()">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_clear_catch.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">清理缓存</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<button class="item devlog" @tap="log()">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_dev_log.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">开发日志</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<button class="item love" @tap="admire()">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_love.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">捐赠作者</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<button class="item share" open-type="share">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_share.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">分享好友</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<button class="item" open-type="openSetting">
|
||||||
|
<image class="i-icon" src="/static/icons/icon_setting.png" mode="widthFix"></image>
|
||||||
|
<text class="i-name">功能设置</text>
|
||||||
|
<text class="i-more iconfont icon-arrow-right"></text>
|
||||||
|
</button>
|
||||||
|
<view v-if="hasUserInfo" class="item singout" @tap="logout()">
|
||||||
|
<text class="i-name singout-text">退出登录</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
hasUserInfo: false,
|
||||||
|
userInfo: {},
|
||||||
|
openid: "",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
const that = this;
|
||||||
|
if (app.globalData.hasUserInfo) {
|
||||||
|
this.hasUserInfo = app.globalData.hasUserInfo;
|
||||||
|
this.userInfo = app.globalData.userInfo;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
login() {
|
||||||
|
const that = this;
|
||||||
|
// 若用户未登录
|
||||||
|
if (!app.globalData.hasUserInfo) {
|
||||||
|
that.toast("正在登录", 'loading');
|
||||||
|
uni.getUserProfile({
|
||||||
|
desc: "获取你的昵称、头像、地区及性别",
|
||||||
|
success: res => {
|
||||||
|
app.globalData.hasUserInfo = true;
|
||||||
|
app.globalData.userInfo = res.userInfo;
|
||||||
|
that.hasUserInfo = true;
|
||||||
|
that.userInfo = res.userInfo;
|
||||||
|
that.toast("登录成功", 'success');
|
||||||
|
const openId = app.globalData.openId;
|
||||||
|
if (openId) {
|
||||||
|
res.userInfo.openId = openId;
|
||||||
|
// console.log("res",res);
|
||||||
|
uni.request({
|
||||||
|
url: app.globalData.website + "/api/login.php",
|
||||||
|
method: 'POST',
|
||||||
|
data: res.userInfo,
|
||||||
|
success(res) {
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: res.msg
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
console.log("没有OpenId,请重新进入小程序");
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
fail: res => {
|
||||||
|
that.toast("您拒绝了请求", 'error');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: "您已经登录",
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
logout() {
|
||||||
|
const that = this;
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: "是否确定退出登录？",
|
||||||
|
complete(res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
app.globalData.hasUserInfo = false;
|
||||||
|
app.globalData.userInfo = {};
|
||||||
|
that.hasUserInfo = false;
|
||||||
|
that.userInfo = {};
|
||||||
|
} else if (res.cancel) {
|
||||||
|
that.toast("取消操作", 'success');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
feedback() {
|
||||||
|
const mail = "lailab_mail@126.com";
|
||||||
|
const qq = "1694319867";
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: "有问题可以通过联系客服进行反馈,也可以添加作者QQ[1694319867]或发送邮箱[lailab_mail@126.com]进行反馈,点击下面按钮可以进行一键复制。",
|
||||||
|
confirmText: "邮箱",
|
||||||
|
cancelText: "QQ",
|
||||||
|
confirmColor: "#000",
|
||||||
|
success(res) {
|
||||||
|
var msg = "";
|
||||||
|
if (res.confirm) {
|
||||||
|
msg = mail;
|
||||||
|
} else if (res.cancel) {
|
||||||
|
msg = qq;
|
||||||
|
}
|
||||||
|
uni.setClipboardData({
|
||||||
|
data: msg,
|
||||||
|
success(res) {
|
||||||
|
uni.getClipboardData({
|
||||||
|
success(res) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '复制成功',
|
||||||
|
icon: "success",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
share() {},
|
||||||
|
// 获取本地缓存大小
|
||||||
|
getStorageSize() {
|
||||||
|
let that = this;
|
||||||
|
try {
|
||||||
|
plus.cache.calculate(function(size) {
|
||||||
|
let sizeCache = parseInt(size);
|
||||||
|
if (sizeCache == 0) {
|
||||||
|
that.currentSize = "0B";
|
||||||
|
} else if (sizeCache < 1024) {
|
||||||
|
that.currentSize = sizeCache + "B";
|
||||||
|
} else if (sizeCache < 1048576) {
|
||||||
|
that.currentSize = (sizeCache / 1024).toFixed(2) + "KB";
|
||||||
|
} else if (sizeCache < 1073741824) {
|
||||||
|
that.currentSize = (sizeCache / 1048576).toFixed(2) + "MB";
|
||||||
|
} else {
|
||||||
|
that.currentSize = (sizeCache / 1073741824).toFixed(2) + "GB";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 清理缓存
|
||||||
|
clearStorage() {
|
||||||
|
let that = this;
|
||||||
|
that.toast("正在清理", "loading");
|
||||||
|
try {
|
||||||
|
let os = plus.os.name;
|
||||||
|
|
||||||
|
if (os == 'Android') {
|
||||||
|
let main = plus.android.runtimeMainActivity();
|
||||||
|
let sdRoot = main.getCacheDir();
|
||||||
|
let files = plus.android.invoke(sdRoot, "listFiles");
|
||||||
|
let len = files.length;
|
||||||
|
console.log(files, len)
|
||||||
|
for (let i = 0; i < len; i++) {
|
||||||
|
let filePath = '' + files[i]; // 没有找到合适的方法获取路径，这样写可以转成文件路径
|
||||||
|
plus.io.resolveLocalFileSystemURL(filePath, function(entry) {
|
||||||
|
if (entry.isDirectory) {
|
||||||
|
entry.removeRecursively(function(entry) { //递归删除其下的所有文件及子目录
|
||||||
|
that.files = []
|
||||||
|
that.toast("清除成功", "success");
|
||||||
|
that.getStorageSize(); // 重新计算缓存
|
||||||
|
}, function(e) {
|
||||||
|
console.log(e.message)
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
entry.remove();
|
||||||
|
}
|
||||||
|
}, function(e) {
|
||||||
|
console.log('文件路径读取失败')
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else { // ios
|
||||||
|
plus.cache.clear(function() {
|
||||||
|
that.toast("清除成功", "success");
|
||||||
|
that.getStorageSize();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
that.toast("清理完成", "success");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
log() {
|
||||||
|
const log = `
|
||||||
|
<b>v1.0 2022-10-7</b><br />
|
||||||
|
1.从微信端进行移植<br /><br />
|
||||||
|
<b>v2.0 2022-10-19</b><br />
|
||||||
|
1.更新主页空内容显示<br />
|
||||||
|
2.实现工具智能抠图、证件照、摩斯电码、随机骰子等功能<br />
|
||||||
|
3.实现部分登录逻辑<br /><br />
|
||||||
|
<b>v2.1 2022-10-22</b><br />
|
||||||
|
1.添加自动登录逻辑<br />
|
||||||
|
`;
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/utils/showText/showText?nodes=${log}`
|
||||||
|
});
|
||||||
|
},
|
||||||
|
admire() {
|
||||||
|
const url = app.globalData.website + "/image/other/image_admire.jpg"
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/utils/showImg/showImg?id=${0}&url=${url}&showBar=false&showMode=aspectFit&canLongTap=true`
|
||||||
|
});
|
||||||
|
},
|
||||||
|
toast(title, icon) {
|
||||||
|
uni.showToast({
|
||||||
|
title: title,
|
||||||
|
icon: icon
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
if (app.globalData.hasUserInfo) {
|
||||||
|
this.hasUserInfo = app.globalData.hasUserInfo;
|
||||||
|
this.userInfo = app.globalData.userInfo;
|
||||||
|
}
|
||||||
|
this.getStorageSize();
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
if (app.globalData.hasUserInfo) {
|
||||||
|
this.hasUserInfo = app.globalData.hasUserInfo;
|
||||||
|
this.userInfo = app.globalData.userInfo;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
@import url("../../static/iconfont/iconfont.css");
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: 100%;
|
||||||
|
/* background-color: red; */
|
||||||
|
background-color: #ffffff;
|
||||||
|
padding: 20px 0 80px 0;
|
||||||
|
/* text-align: center; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-info {
|
||||||
|
width: 90%;
|
||||||
|
height: 140px;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
border-radius: 15px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-img {
|
||||||
|
width: 30%;
|
||||||
|
height: 100%;
|
||||||
|
/* background-color: green; */
|
||||||
|
float: left;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-bg {
|
||||||
|
height: 80px;
|
||||||
|
width: 80px;
|
||||||
|
border-radius: 15px;
|
||||||
|
background-color: #eeeeee;
|
||||||
|
position: absolute;
|
||||||
|
top: 30px;
|
||||||
|
left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-icon {
|
||||||
|
height: 60px;
|
||||||
|
width: 60px;
|
||||||
|
/* background-color: red; */
|
||||||
|
border-radius: 10px;
|
||||||
|
position: absolute;
|
||||||
|
top: 40px;
|
||||||
|
left: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-text {
|
||||||
|
width: 70%;
|
||||||
|
height: 100%;
|
||||||
|
/* background-color: skyblue; */
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-name {
|
||||||
|
font-size: 30px;
|
||||||
|
line-height: 140px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
button::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.items {
|
||||||
|
width: 90%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-radius: 15px;
|
||||||
|
margin: 20px auto;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
height: 60px;
|
||||||
|
line-height: 60px;
|
||||||
|
text-align: left;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:first-child {
|
||||||
|
border-radius: 20px 20px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:last-child {
|
||||||
|
border-radius: 0 0 20px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-icon {
|
||||||
|
height: 30px;
|
||||||
|
width: 30px;
|
||||||
|
/* background-color: red; */
|
||||||
|
float: left;
|
||||||
|
margin: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-name {
|
||||||
|
font-size: 18px;
|
||||||
|
padding-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-more {
|
||||||
|
display: block;
|
||||||
|
height: 30px;
|
||||||
|
width: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin: 10px auto;
|
||||||
|
color: #888888;
|
||||||
|
font-size: 17px;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 退出登录字体 */
|
||||||
|
.singout-text {
|
||||||
|
width: 100%;
|
||||||
|
display: inline-block;
|
||||||
|
color: #ff6b6b;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,90 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="main">
|
||||||
|
<view class="classify-cards" v-for="(items,index) in tools" :key="index">
|
||||||
|
<text class="classify-name" style="margin: 10px auto;">{{items.name}}</text>
|
||||||
|
<view>
|
||||||
|
<tcard class="tool-card" v-for="(item,index1) in items.cards" :key="index1" :title="item.title" :detail="item.detail"
|
||||||
|
:color="item.color" :icon="item.icon" :url="item.url">
|
||||||
|
</tcard>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import tcard from "@/components/tool-card.vue";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
tcard
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tools: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.getDataByOnline();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getDataByOnline() {
|
||||||
|
const that = this;
|
||||||
|
uni.request({
|
||||||
|
url: 'https://www.lailab.cn/miniprogram/data.php?type=tools',
|
||||||
|
success: function(rst) {
|
||||||
|
that.tools = rst.data;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
background-color: #ffffff;
|
||||||
|
color: black;
|
||||||
|
padding: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-dark {
|
||||||
|
background-color: #333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.classify-cards {
|
||||||
|
width: 94%;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.classify-name {
|
||||||
|
display: block;
|
||||||
|
height: 30px;
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 30px;
|
||||||
|
text-indent: 0.5em;
|
||||||
|
font-weight: bold;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-card {
|
||||||
|
width: 47.5%;
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-card:nth-child(2n-1) {
|
||||||
|
margin-right: 5%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-card:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,193 @@
|
|||||||
|
<template>
|
||||||
|
<view class="byh-view">
|
||||||
|
<image :src="picUrl" mode="widthFix" :animation="animationData"></image>
|
||||||
|
<button class="byh-share" open-type="share"></button>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('jipigu')">鸡屁股</text>
|
||||||
|
<text @tap="audioPlay('peidasuan')">配大蒜</text>
|
||||||
|
<text @tap="audioPlay('jianjiandandan')">简简单单</text>
|
||||||
|
<text @tap="audioPlay('yidunfan')">一顿饭</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('jishihui')">既实惠</text>
|
||||||
|
<text @tap="audioPlay('haiguanbao')">还管饱</text>
|
||||||
|
<text @tap="audioPlay('jiuchilaoba')">就吃老八</text>
|
||||||
|
<text @tap="audioPlay('mizhihanbao')">蜜汁汉堡</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('yirisancan')">一日三餐</text>
|
||||||
|
<text @tap="audioPlay('meifannao')">没烦恼</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('choudoufu')">臭豆腐</text>
|
||||||
|
<text @tap="audioPlay('furu')">腐乳</text>
|
||||||
|
<text @tap="audioPlay('jianingmeng')">加柠檬</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('nikanzhe')">你看这</text>
|
||||||
|
<text @tap="audioPlay('hanbao')">汉堡</text>
|
||||||
|
<text @tap="audioPlay('zuode')">做的</text>
|
||||||
|
<text @tap="audioPlay('xingbuxing')">行不行</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('xiongdimen')">兄弟们</text>
|
||||||
|
<text @tap="audioPlay('aoligei')">奥里给</text>
|
||||||
|
<text @tap="audioPlay('zaojiuwanle')">造就完了</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('heiheihei')">嘿嘿嘿</text>
|
||||||
|
<text @tap="audioPlay('panta')">盘它</text>
|
||||||
|
<text @tap="audioPlay('lailea')">来了啊</text>
|
||||||
|
<text @tap="audioPlay('meizizi')">美滋滋</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('ou1')">呕1</text>
|
||||||
|
<text @tap="audioPlay('ou2')">呕2</text>
|
||||||
|
<text @tap="audioPlay('ou3')">呕3</text>
|
||||||
|
<text @tap="audioPlay('haihaihai')">嗨嗨嗨</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('huojimian')">火鸡面</text>
|
||||||
|
<text @tap="audioPlay('dalajiao')">大辣椒</text>
|
||||||
|
<text @tap="audioPlay('yidunbuchi')">一顿不吃</text>
|
||||||
|
<text @tap="audioPlay('xincinao')">心刺挠</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('dsnhalg')">大声呐喊奥里给</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('sydxdxw')">所有东西都下胃</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('bgsxhsc')">不管是腥还是臭</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('dwzlskr')">到我嘴里是块肉</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('msjlwlb')">美食界里我老八</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('wrcwmsj')">万人称我美食家</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('lbmzxhb')">老八秘制小汉堡</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('lbzgh')">老八中国话</text>
|
||||||
|
<text @tap="audioPlay('lbjl')">老八惊雷</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text @tap="audioPlay('szcshbz')">si在厕所汉堡中</text>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<text class="btn-stop" @tap="audioPause" type="primary')">停止</text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
picUrl: app.globalData.website + "/image/other/image_tool_bayinhe.jpg",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
audioPlay(flag) {
|
||||||
|
let that = this;
|
||||||
|
var srcMic = "";
|
||||||
|
uni.request({
|
||||||
|
url: "https://www.lailab.cn/miniprogram/tools/bayinhe.php?flag=" + flag,
|
||||||
|
success(res) {
|
||||||
|
// console.log(res);
|
||||||
|
if (res.statusCode == 200) {
|
||||||
|
srcMic = res.data;
|
||||||
|
that.innerAudioContext = uni.createInnerAudioContext();
|
||||||
|
//创建内部 audio 上下文 InnerAudioContext 对象。
|
||||||
|
that.innerAudioContext.onError(function(res) {});
|
||||||
|
if ((srcMic == '') || (srcMic == undefined)) return;
|
||||||
|
that.innerAudioContext.src = srcMic; //设置音频地址
|
||||||
|
that.innerAudioContext.play(); //播放音频
|
||||||
|
} else {
|
||||||
|
app.toast("网络错误", "error");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
app.toast("未知错误", "error");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 停止播放
|
||||||
|
audioPause() {
|
||||||
|
if ((this.innerAudioContext == '') || (this.innerAudioContext == undefined)) return;
|
||||||
|
this.innerAudioContext.pause(); //暂停音频
|
||||||
|
},
|
||||||
|
toast(title, icon) {
|
||||||
|
uni.showToast({
|
||||||
|
title: title,
|
||||||
|
icon: icon
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onHide() {
|
||||||
|
this.audioPause();
|
||||||
|
},
|
||||||
|
onUnload() {
|
||||||
|
this.audioPause();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
view {
|
||||||
|
justify-content: space-between;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 96vw;
|
||||||
|
height: auto;
|
||||||
|
margin: 2vw;
|
||||||
|
border-radius: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
text {
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
padding: 10px;
|
||||||
|
margin: 5px;
|
||||||
|
border-radius: 10px;
|
||||||
|
flex: 1;
|
||||||
|
background-color: #54a0ff;
|
||||||
|
color: white;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-stop {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ff6b6b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.byh-view {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.byh-share {
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
right: 20px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: rgba(84, 160, 255, .2);
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,22 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="top-block"></view>
|
||||||
|
<textarea class="tq-input" placeholder="请输入文字/网址" maxlength="-1" @input="getInputValue">
|
||||||
|
<button class="tq-share" open-type="share"></button>
|
||||||
|
</textarea>
|
||||||
|
<image class="tq-qrcode" :src="url" show-menu-by-longpress="true"></image>
|
||||||
|
<text class="tq-tip">长按图片进行保存</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
url: ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getInputValue(e) {
|
||||||
|
// 获取到input的值
|
||||||
|
let value = e.detail.value;
|
||||||
|
this.url = "https://www.lailab.cn/miniprogram/tools/qrcode.php?text=" + value;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #54a0ff;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-block {
|
||||||
|
height: 20px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tq-input {
|
||||||
|
width: 86%;
|
||||||
|
height: 200px;
|
||||||
|
border-radius: 20px;
|
||||||
|
font-size: 20px;
|
||||||
|
margin: 0 auto 40px auto;
|
||||||
|
padding: 15px;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tq-qrcode {
|
||||||
|
height: 250px;
|
||||||
|
width: 250px;
|
||||||
|
background-color: white;
|
||||||
|
margin: 70px auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tq-tip {
|
||||||
|
width: auto;
|
||||||
|
color: white;
|
||||||
|
margin-top: 50px;
|
||||||
|
text-align: center;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tq-share {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
right: 10px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: rgba(84,160,255,.2);
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,129 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="top-block"></view>
|
||||||
|
<textarea class="ms-input" placeholder="输入内容自动识别" maxlength="-1" @input="inputValue">
|
||||||
|
<button class="ms-share" open-type="share"></button>
|
||||||
|
</textarea>
|
||||||
|
<text class="ms-output" @longtap="copyOutCode()">{{outcode?outcode:"长按复制"}}</text>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
outcode: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
inputValue(e) {
|
||||||
|
const that = this;
|
||||||
|
// 获取到input的值
|
||||||
|
const value = e.detail.value + ' .';
|
||||||
|
var operate = 'encode';
|
||||||
|
if (value.indexOf('-') >= 0) {
|
||||||
|
operate = 'decode';
|
||||||
|
}
|
||||||
|
uni.request({
|
||||||
|
url: app.globalData.website + '/tools/mosidianma.php?type=' + operate + '&text=' + value,
|
||||||
|
method: 'POST',
|
||||||
|
success(res) {
|
||||||
|
// console.log(res);
|
||||||
|
that.outcode = res.data;
|
||||||
|
},
|
||||||
|
fail(res) {
|
||||||
|
console.log("请求失败", res);
|
||||||
|
uni.showToast({
|
||||||
|
content: '请求失败',
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
copyOutCode() {
|
||||||
|
const that = this;
|
||||||
|
if(that.outcode=='')return;
|
||||||
|
//提示模板
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: that.outcode, //模板中提示的内容
|
||||||
|
confirmText: '复制内容',
|
||||||
|
success: (res) => { //点击复制内容的后调函数
|
||||||
|
if (res.confirm) {
|
||||||
|
//uni.setClipboardData方法就是讲内容复制到粘贴板
|
||||||
|
uni.setClipboardData({
|
||||||
|
data: that.outcode, //要被复制的内容
|
||||||
|
success: () => { //复制成功的回调函数
|
||||||
|
uni.showToast({ //提示
|
||||||
|
title: '复制成功'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #54a0ff;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-block {
|
||||||
|
height: 20px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ms-input,
|
||||||
|
.ms-output {
|
||||||
|
width: 86%;
|
||||||
|
height: 200px;
|
||||||
|
border-radius: 20px;
|
||||||
|
font-size: 20px;
|
||||||
|
margin: 0 auto 20px auto;
|
||||||
|
padding: 15px;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ms-input {
|
||||||
|
position: relative;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ms-output {
|
||||||
|
height: auto;
|
||||||
|
max-height: 200px;
|
||||||
|
display: block;
|
||||||
|
color: #262626;
|
||||||
|
margin: 0 auto 20px auto;
|
||||||
|
overflow: scroll;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ms-share {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
right: 10px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: rgba(84, 160, 255, .2);
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,151 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="bg-muyu">
|
||||||
|
<switch class="sw-animation" @change="changeAnimation()">{{useanim?'关':'开'}}动画</switch>
|
||||||
|
<text class="te-sumgongde">今日已累计 {{num*gongde}} 功德</text>
|
||||||
|
</view>
|
||||||
|
<image class="img-muyu" :src="bgurl" mode="widthFix"></image>
|
||||||
|
<button class="dzmy-share" open-type="share"></button>
|
||||||
|
<view class="v-muyu" @tap="audioPlay">
|
||||||
|
<view class="v-gongde" :animation="animationData">功德+{{gongde}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
bgurl: "https://www.lailab.cn/miniprogram/image/other/image_tool_muyu.jpg",
|
||||||
|
num: 0,
|
||||||
|
gongde: 500,
|
||||||
|
useanim: false,
|
||||||
|
animationData: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
audioPlay: function(e) {
|
||||||
|
let that = this;
|
||||||
|
var srcMic = "https://www.lailab.cn/owncloud/index.php/s/RMVFmfrDy0He7Ka/download";
|
||||||
|
const x = e.detail.x;
|
||||||
|
const y = e.detail.y;
|
||||||
|
if (this.useanim) {
|
||||||
|
this.startAnimation(x, y);
|
||||||
|
}
|
||||||
|
// if (that.innerAudioContext == undefined) {
|
||||||
|
// console.log("请求了");
|
||||||
|
that.innerAudioContext = uni.createInnerAudioContext();
|
||||||
|
//创建内部 audio 上下文 InnerAudioContext 对象。
|
||||||
|
that.innerAudioContext.onError(function(res) {});
|
||||||
|
if ((srcMic == '') || (srcMic == undefined)) return;
|
||||||
|
that.innerAudioContext.src = srcMic; //设置音频地址
|
||||||
|
// }
|
||||||
|
that.audioPause();
|
||||||
|
that.innerAudioContext.play(); //播放音频
|
||||||
|
that.num += 1;
|
||||||
|
},
|
||||||
|
// 停止播放
|
||||||
|
audioPause() {
|
||||||
|
if ((this.innerAudioContext == '') || (this.innerAudioContext == undefined)) return;
|
||||||
|
this.innerAudioContext.pause(); //暂停音频
|
||||||
|
},
|
||||||
|
startAnimation(x, y) {
|
||||||
|
this.animation.translate(x - 110, y - 400).opacity(1).step();
|
||||||
|
this.animationData = this.animation.export();
|
||||||
|
setTimeout(function() {
|
||||||
|
this.animation.opacity(0).translate(x - 110, y - 600).step();
|
||||||
|
this.animationData = this.animation.export()
|
||||||
|
}.bind(this), 300)
|
||||||
|
setTimeout(function() {
|
||||||
|
this.animation.translate(x - 110, y - 380).opacity(0).step();
|
||||||
|
this.animationData = this.animation.export()
|
||||||
|
}.bind(this), 600);
|
||||||
|
},
|
||||||
|
// 开关动画
|
||||||
|
changeAnimation() {
|
||||||
|
console.log("转化", this.useanim);
|
||||||
|
this.useanim = !this.useanim;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onShow: function() {
|
||||||
|
var animation = uni.createAnimation({
|
||||||
|
duration: 300,
|
||||||
|
timingFunction: 'ease',
|
||||||
|
})
|
||||||
|
this.animation = animation
|
||||||
|
this.animationData = animation.export()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.containr {
|
||||||
|
height: 1000px;
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
background-color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sw-animation {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 45px;
|
||||||
|
/* background-color: red; */
|
||||||
|
padding: 10px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.te-sumgongde {
|
||||||
|
line-height: 45px;
|
||||||
|
padding: 10px;
|
||||||
|
/* background-color: green; */
|
||||||
|
float: right;
|
||||||
|
font-size: 18px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-muyu {
|
||||||
|
height: 100px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: black;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-muyu {
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dzmy-share {
|
||||||
|
position: absolute;
|
||||||
|
top: 60px;
|
||||||
|
right: 15px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: #84602D;
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.v-muyu {
|
||||||
|
width: 65vw;
|
||||||
|
height: 220px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 210px;
|
||||||
|
left: 15vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.v-gongde {
|
||||||
|
font-size: 20px;
|
||||||
|
color: white;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,173 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<button class="sjtz-share" open-type="share"></button>
|
||||||
|
<view class="row row-1">
|
||||||
|
<text v-if="count>0" class="dice"
|
||||||
|
:style="{backgroundPosition: position[nums[0]].posX+'px '+position[nums[0]].posY+'px'}"></text>
|
||||||
|
<text v-if="count>5" class="dice"
|
||||||
|
:style="{backgroundPosition: position[nums[5]].posX+'px '+position[nums[5]].posY+'px'}"></text>
|
||||||
|
<text v-if="count>1" class="dice"
|
||||||
|
:style="{backgroundPosition: position[nums[1]].posX+'px '+position[nums[1]].posY+'px'}"></text>
|
||||||
|
</view>
|
||||||
|
<view v-if="count>2" class="row row-2">
|
||||||
|
<text v-if="count>2" class="dice"
|
||||||
|
:style="{backgroundPosition: position[nums[2]].posX+'px '+position[nums[2]].posY+'px'}"></text>
|
||||||
|
<text v-if="count>4" class="dice"
|
||||||
|
:style="{backgroundPosition: position[nums[4]].posX+'px '+position[nums[4]].posY+'px'}"></text>
|
||||||
|
<text v-if="count>3" class="dice"
|
||||||
|
:style="{backgroundPosition: position[nums[3]].posX+'px '+position[nums[3]].posY+'px'}"></text>
|
||||||
|
</view>
|
||||||
|
<picker class="picker" @change="countChange" :value="index" :range="array">
|
||||||
|
<view class="picker-text">
|
||||||
|
当前选择：{{array[index]}} v
|
||||||
|
</view>
|
||||||
|
</picker>
|
||||||
|
|
||||||
|
<button class="btn-start" @tap="start()">{{sum}}</button>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
position: [{
|
||||||
|
posX: 0,
|
||||||
|
posY: 0,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
posX: -100,
|
||||||
|
posY: 0,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
posX: -200,
|
||||||
|
posY: 0,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
posX: -300,
|
||||||
|
posY: 0,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
posX: -400,
|
||||||
|
posY: 0,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
posX: -500,
|
||||||
|
posY: 0,
|
||||||
|
}
|
||||||
|
],
|
||||||
|
count: 1,
|
||||||
|
nums: [0, 1, 2, 3, 4, 5],
|
||||||
|
array: ['1个骰子', '2个骰子', '3个骰子', '4个骰子', '5个骰子', '6个骰子'],
|
||||||
|
index: 0,
|
||||||
|
sum: '开始',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
start() {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.sum = "等待计算中";
|
||||||
|
this.timer = setInterval(this.picFn, 50);
|
||||||
|
setTimeout(() => {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
let num = 0;
|
||||||
|
for (var i = 0; i < this.nums.length; i++) {
|
||||||
|
if (i >= this.count) {
|
||||||
|
this.nums[i] = 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.nums.forEach(item => {
|
||||||
|
num += item
|
||||||
|
});
|
||||||
|
this.sum = `分数：${num+this.count}`;
|
||||||
|
}, 2000);
|
||||||
|
},
|
||||||
|
randNum: () => Math.floor(Math.random() * 6),
|
||||||
|
picFn() {
|
||||||
|
this.nums = this.nums.map(item => this.randNum())
|
||||||
|
},
|
||||||
|
countChange: function(e) {
|
||||||
|
// console.log('picker发送选择改变，携带值为', e.detail.value);
|
||||||
|
let num = e.detail.value;
|
||||||
|
this.index = num;
|
||||||
|
this.count = ++num;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
background-color: #f6f7f9;
|
||||||
|
justify-content: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row {
|
||||||
|
width: 90vw;
|
||||||
|
justify-content: space-between;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
margin: 0 5vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-1 {
|
||||||
|
padding-top: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-2 {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dice {
|
||||||
|
display: block;
|
||||||
|
height: 100px;
|
||||||
|
width: 100px;
|
||||||
|
background-color: red;
|
||||||
|
background: url('https://www.lailab.cn/miniprogram/image/other/image_tool_suijitouzi.png') no-repeat;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.picker,
|
||||||
|
.btn-start {
|
||||||
|
height: 45px;
|
||||||
|
width: 90vw;
|
||||||
|
margin: 0 5vw;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 45px;
|
||||||
|
font-size: 20px;
|
||||||
|
margin-top: 30px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.picker {
|
||||||
|
background-color: #262626;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-start {
|
||||||
|
background-color: #262626;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sjtz-share {
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
right: 20px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: rgba(38, 38, 38, .5);
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,243 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="tmp"></view>
|
||||||
|
<view class="view-show" @tap="chooseImg()">
|
||||||
|
<image class="img-show" :src="imgUrl" :style="{'backgroundColor':color}" mode="heightFix" @tap="showImg()"
|
||||||
|
@load="loadImg()" @error="errImg()" show-menu-by-longpress></image>
|
||||||
|
<button class='zjz-share' open-type="share" @tap.stop="testFn($event)"></button>
|
||||||
|
</view>
|
||||||
|
<view class="colors">
|
||||||
|
<text class="colors-tip">选择背景色</text>
|
||||||
|
<view class="colors-choose">
|
||||||
|
<text class="color color-red" @tap="changeColor('#D9001B')">红</text>
|
||||||
|
<text class="color color-blue" @tap="changeColor('#02A7F0')">蓝</text>
|
||||||
|
<text class="color color-white" @tap="changeColor('#FFFFFF')">白</text>
|
||||||
|
<text class="color color-black" @tap="changeColor('#222f3e')">黑</text>
|
||||||
|
<text class="color color-more" @tap="changeColor('#ff9ff3')">粉</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<button class="upload" @tap="startMake()">开始制作</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isChoose: false,
|
||||||
|
imgUrl: '',
|
||||||
|
color: '#00000000',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
chooseImg() {
|
||||||
|
const that = this;
|
||||||
|
console.log(!this.isChoose);
|
||||||
|
if (!this.isChoose) {
|
||||||
|
wx.chooseImage({
|
||||||
|
count: 1, //默认9
|
||||||
|
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
||||||
|
sourceType: ['album'], //从相册选择
|
||||||
|
success(res) {
|
||||||
|
that.imgUrl = res.tempFilePaths[0];
|
||||||
|
that.isChoose = true;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
showImg() {
|
||||||
|
if (this.isChoose) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/utils/showImg/showImg?id=${0}&url=${this.imgUrl}&source=${this.imgUrl}`
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
changeColor(col) {
|
||||||
|
this.color = col;
|
||||||
|
},
|
||||||
|
startMake() {
|
||||||
|
const that = this;
|
||||||
|
uni.showLoading({
|
||||||
|
title: '正在生成',
|
||||||
|
icon: 'loading'
|
||||||
|
});
|
||||||
|
uni.uploadFile({
|
||||||
|
url: app.globalData.website + "/tools/zhengjianzhao.php",
|
||||||
|
filePath: that.imgUrl,
|
||||||
|
name: 'pic',
|
||||||
|
formData: {
|
||||||
|
color: that.color,
|
||||||
|
},
|
||||||
|
success(res) {
|
||||||
|
console.log(res, '上传成功');
|
||||||
|
if (res.data.length > 5) {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '生成成功',
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
that.imgUrl = res.data;
|
||||||
|
uni.showLoading({
|
||||||
|
title: '图片加载中...',
|
||||||
|
icon: 'loading'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '生成失败',
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail(err) {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '生成失败',
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
loadImg() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片加载成功',
|
||||||
|
icon: 'success',
|
||||||
|
})
|
||||||
|
},
|
||||||
|
errImg() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片加载失败',
|
||||||
|
icon: 'error',
|
||||||
|
})
|
||||||
|
},
|
||||||
|
testFn(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tmp {
|
||||||
|
height: 3vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-show {
|
||||||
|
height: 65vh;
|
||||||
|
width: 90vw;
|
||||||
|
background: url("https://www.lailab.cn/miniprogram/image/other/image_zhengjianzhao_bg.jpg");
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
margin: 0 5vw;
|
||||||
|
border-radius: 25px;
|
||||||
|
text-align: center;
|
||||||
|
overflow-x: scroll;
|
||||||
|
overflow-y: hidden;
|
||||||
|
/*解决ios上滑动不流畅*/
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.zjz-share {
|
||||||
|
position: fixed;
|
||||||
|
top: 40px;
|
||||||
|
right: 40px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: rgba(34, 47, 62, .1);
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.img-show {
|
||||||
|
height: 100%;
|
||||||
|
min-width: auto;
|
||||||
|
/* border-radius: 25px; */
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colors {
|
||||||
|
height: 15vh;
|
||||||
|
width: 90vw;
|
||||||
|
margin: 2vh 5vw 0 5vw;
|
||||||
|
background-color: #eee;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colors-tip {
|
||||||
|
height: 30%;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 18px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colors-choose {
|
||||||
|
height: 70%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color {
|
||||||
|
height: 50px;
|
||||||
|
width: 50px;
|
||||||
|
display: inline-block;
|
||||||
|
background-color: #eee;
|
||||||
|
line-height: 50px;
|
||||||
|
text-align: center;
|
||||||
|
margin: 10px;
|
||||||
|
border-radius: 25px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-red {
|
||||||
|
background-color: #D9001B;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-blue {
|
||||||
|
background-color: #02A7F0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-white {
|
||||||
|
background-color: #ffffff;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-black {
|
||||||
|
background-color: #222f3e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-more {
|
||||||
|
background-color: #ff9ff3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload {
|
||||||
|
height: 45px;
|
||||||
|
width: 90vw;
|
||||||
|
margin: 2vh 5vw 0 5vw;
|
||||||
|
border-radius: 20px;
|
||||||
|
border: 0;
|
||||||
|
background-color: #222f3e;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,236 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="tmp"></view>
|
||||||
|
<view class="view-show" @tap="chooseImg()">
|
||||||
|
<image class="img-show" :src="imgUrl" @load="loadImg()" @error="errImg()" @tap="showImg()" mode="heightFix"
|
||||||
|
show-menu-by-longpress></image>
|
||||||
|
<button class="znkt-share" open-type="share" @tap.stop="testFn($event)"></button>
|
||||||
|
</view>
|
||||||
|
<button class="upload" @tap="startMake()">开始抠图</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isChoose: false,
|
||||||
|
imgUrl: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
chooseImg() {
|
||||||
|
const that = this;
|
||||||
|
console.log(!this.isChoose);
|
||||||
|
if (!this.isChoose) {
|
||||||
|
wx.chooseImage({
|
||||||
|
count: 1, //默认9
|
||||||
|
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
||||||
|
sourceType: ['album'], //从相册选择
|
||||||
|
success(res) {
|
||||||
|
wx.editImage({
|
||||||
|
src: res.tempFilePaths[0],
|
||||||
|
success(res1) {
|
||||||
|
that.imgUrl = res1.tempFilePath;
|
||||||
|
that.isChoose = true;
|
||||||
|
},
|
||||||
|
fail(e) {
|
||||||
|
that.imgUrl = res.tempFilePaths[0];
|
||||||
|
that.isChoose = true;
|
||||||
|
console.info('该客户端不支持此操作', e);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
showImg() {
|
||||||
|
if (this.isChoose) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/utils/showImg/showImg?id=${0}&url=${this.imgUrl}&source=${this.imgUrl}`
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
startMake() {
|
||||||
|
const that = this;
|
||||||
|
uni.showLoading({
|
||||||
|
title: '正在生成',
|
||||||
|
icon: 'loading'
|
||||||
|
});
|
||||||
|
uni.uploadFile({
|
||||||
|
url: app.globalData.website + "/tools/zhinengkoutu.php",
|
||||||
|
filePath: that.imgUrl,
|
||||||
|
name: 'pic',
|
||||||
|
formData: {},
|
||||||
|
success(res) {
|
||||||
|
console.log(res, '上传成功');
|
||||||
|
if (res.data.length > 5) {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '生成成功',
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
that.imgUrl = res.data;
|
||||||
|
uni.showLoading({
|
||||||
|
title: '图片加载中...',
|
||||||
|
icon: 'loading'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '生成失败',
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail(err) {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '生成失败',
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
loadImg() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片加载成功',
|
||||||
|
icon: 'success',
|
||||||
|
})
|
||||||
|
},
|
||||||
|
errImg() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片加载失败',
|
||||||
|
icon: 'error',
|
||||||
|
})
|
||||||
|
},
|
||||||
|
testFn(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tmp {
|
||||||
|
height: 3vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-show {
|
||||||
|
height: 83vh;
|
||||||
|
width: 90vw;
|
||||||
|
background: url("https://www.lailab.cn/miniprogram/image/other/image_zhinengkoutu_bg.jpg");
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
overflow-x: scroll;
|
||||||
|
overflow-y: hidden;
|
||||||
|
/*解决ios上滑动不流畅*/
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
margin: 0 5vw;
|
||||||
|
border-radius: 25px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.znkt-share {
|
||||||
|
position: fixed;
|
||||||
|
top: 40px;
|
||||||
|
right: 40px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-image: url('../../../static/icons/icon_share.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-color: rgba(34, 47, 62, .1);
|
||||||
|
background-size: 60% 60%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-show {
|
||||||
|
height: 100%;
|
||||||
|
width: auto;
|
||||||
|
border-radius: 25px;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colors {
|
||||||
|
height: 15vh;
|
||||||
|
width: 90vw;
|
||||||
|
margin: 2vh 5vw 0 5vw;
|
||||||
|
background-color: #eee;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colors-tip {
|
||||||
|
height: 30%;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 18px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.colors-choose {
|
||||||
|
height: 70%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color {
|
||||||
|
height: 50px;
|
||||||
|
width: 50px;
|
||||||
|
display: inline-block;
|
||||||
|
background-color: #eee;
|
||||||
|
line-height: 50px;
|
||||||
|
text-align: center;
|
||||||
|
margin: 10px;
|
||||||
|
border-radius: 25px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-red {
|
||||||
|
background-color: #D9001B;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-blue {
|
||||||
|
background-color: #02A7F0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-white {
|
||||||
|
background-color: #ffffff;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-black {
|
||||||
|
background-color: #222f3e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-more {
|
||||||
|
background-color: #ff9ff3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload {
|
||||||
|
height: 45px;
|
||||||
|
width: 90vw;
|
||||||
|
margin: 2vh 5vw 0 5vw;
|
||||||
|
border-radius: 20px;
|
||||||
|
border: 0;
|
||||||
|
background-color: #222f3e;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,228 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="view-show">
|
||||||
|
<image class="img-show" :src="picUrl" @load="loadImg()" @error="errImg()" :mode="showMode" :show-menu-by-longpress="canLongTap"></image>
|
||||||
|
</view>
|
||||||
|
<button class="btn btn-back" @tap="back()">X</button>
|
||||||
|
<view v-if="showBar&&hindBar" class="btnbar">
|
||||||
|
<button class="btn btn-copyright" @tap="copyright()">版权</button>
|
||||||
|
<button class="btn btn-share" open-type="share">分享</button>
|
||||||
|
<button class="btn btn-download" @tap="download()">下载</button>
|
||||||
|
<button class="btn btn-source" @tap="sourceImg()">原图</button>
|
||||||
|
<button class="btn btn-hide" @tap="hideBar()">隐藏</button>
|
||||||
|
<!-- 版权 分享 下载 原图 -->
|
||||||
|
</view>
|
||||||
|
<button v-if="!hindBar" class="btn btn-show" @tap="showBarFn()">开</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: "",
|
||||||
|
url: "",
|
||||||
|
source: "",
|
||||||
|
picUrl: "",
|
||||||
|
showMode: "heightFix",
|
||||||
|
hindBar: true,
|
||||||
|
showBar: true,
|
||||||
|
canLongTap: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
console.log('获取数据成功');
|
||||||
|
this.id = option.id?option.id:this.id;
|
||||||
|
this.url = option.url?option.url:this.url;
|
||||||
|
this.source = option.source?option.source:this.source;
|
||||||
|
this.showMode = option.showMode?option.showMode:this.showMode;
|
||||||
|
this.showBar = option.showBar?(option.showBar.indexOf('t')==0?true:false):this.showBar;
|
||||||
|
this.canLongTap = option.canLongTap?(option.canLongTap.indexOf('t')==0?true:false):this.canLongTap;
|
||||||
|
this.picUrl = this.url;
|
||||||
|
uni.showLoading({
|
||||||
|
title: '图片加载中...',
|
||||||
|
icon: 'loading'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
back() {
|
||||||
|
try{
|
||||||
|
uni.navigateBack();
|
||||||
|
}catch(e){
|
||||||
|
uni.switchTab({
|
||||||
|
url: "/pages/home/home"
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
hideBar() {
|
||||||
|
this.hindBar = false;
|
||||||
|
},
|
||||||
|
showBarFn() {
|
||||||
|
this.hindBar = true;
|
||||||
|
},
|
||||||
|
copyright() {
|
||||||
|
uni.showModal({
|
||||||
|
title: '提示',
|
||||||
|
content: '图片皆为网上搜寻，若侵权。请联系我进行删除。',
|
||||||
|
success: function(res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
console.log('确定');
|
||||||
|
|
||||||
|
} else if (res.cancel) {
|
||||||
|
console.log('取消');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
share() {
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: "长按图片进行分享操作!"
|
||||||
|
});
|
||||||
|
},
|
||||||
|
download() {
|
||||||
|
const link = this.picUrl;
|
||||||
|
// 展示进度框
|
||||||
|
uni.showLoading({
|
||||||
|
title: "开始下载",
|
||||||
|
icon: "loading",
|
||||||
|
|
||||||
|
})
|
||||||
|
uni.downloadFile({
|
||||||
|
url: link,
|
||||||
|
success(res) {
|
||||||
|
if (res.statusCode == 200) {
|
||||||
|
uni.getFileSystemManager().saveFile({
|
||||||
|
tempFilePath: res.tempFilePath,
|
||||||
|
filePath: `${wx.env.USER_DATA_PATH}/image.png`,
|
||||||
|
success(res) {
|
||||||
|
console.log(res.savedFilePath);
|
||||||
|
wx.saveImageToPhotosAlbum({
|
||||||
|
filePath: res.savedFilePath,
|
||||||
|
success(res) {
|
||||||
|
console.log(res)
|
||||||
|
console.log('保存图片成功')
|
||||||
|
uni.hideLoading();
|
||||||
|
wx.showToast({
|
||||||
|
title: '下载成功',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: "下载失败,可以通过长按图片进行保存。"
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showModal({
|
||||||
|
title: "提示",
|
||||||
|
content: "下载失败,可以通过长按图片进行保存。"
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
sourceImg() {
|
||||||
|
this.picUrl = this.source;
|
||||||
|
uni.showLoading({
|
||||||
|
title: '图片加载中...',
|
||||||
|
icon: 'loading'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
loadImg() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片加载成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
},
|
||||||
|
errImg() {
|
||||||
|
uni.hideLoading();
|
||||||
|
uni.showToast({
|
||||||
|
title: '图片加载失败',
|
||||||
|
icon: 'error'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-show {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
overflow-x: scroll;
|
||||||
|
overflow-y: hidden;
|
||||||
|
/*解决ios上滑动不流畅*/
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-show {
|
||||||
|
height: 100%;
|
||||||
|
min-width: 100vw;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
line-height: 60px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: transparent;
|
||||||
|
color: white;
|
||||||
|
border: 0;
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-back {
|
||||||
|
height: 40px;
|
||||||
|
width: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
color: white;
|
||||||
|
background-color: rgba(0, 0, 0, 0.6);
|
||||||
|
border-radius: 20px;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 50px;
|
||||||
|
left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btnbar {
|
||||||
|
height: 60px;
|
||||||
|
width: 80vw;
|
||||||
|
background-color: rgba(0, 0, 0, 0.6);
|
||||||
|
border-radius: 20px;
|
||||||
|
display: flex;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 5vh;
|
||||||
|
left: 10vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-show {
|
||||||
|
height: 40px;
|
||||||
|
width: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
color: white;
|
||||||
|
background-color: rgba(0, 0, 0, 0.6);
|
||||||
|
border-radius: 20px;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 6vh;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,33 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="uni-common-mt" style="background:#FFF; padding:20rpx;">
|
||||||
|
<rich-text :nodes="nodes"></rich-text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
nodes: `<div class="div_class">
|
||||||
|
<h1>Title</h1>
|
||||||
|
<p class="p">
|
||||||
|
Life is <i>like</i> a box of
|
||||||
|
<b> chocolates</b>.
|
||||||
|
</p>
|
||||||
|
</div>`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.nodes = option.nodes ? option.nodes : this.nodes;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,19 @@
|
|||||||
|
# LaiLab工具箱 uni-app
|
||||||
|
|
||||||
|
v1.0 2022-10-7
|
||||||
|
|
||||||
|
1.从微信端进行移植
|
||||||
|
|
||||||
|
v2.0 2022-10-19
|
||||||
|
|
||||||
|
1.更新主页空内容显示
|
||||||
|
|
||||||
|
2.实现工具智能抠图、证件照、摩斯电码、随机骰子等功能
|
||||||
|
|
||||||
|
3.实现部分登录逻辑
|
||||||
|
|
||||||
|
v2.1 2022-10-22
|
||||||
|
|
||||||
|
1.添加自动登录逻辑
|
||||||
|
|
||||||
|
2.各个界面微调美化
|
||||||
@@ -0,0 +1,75 @@
|
|||||||
|
/* CDN 服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
|
||||||
|
@font-face {
|
||||||
|
font-family: "iconfont"; /* Project id 3683562 */
|
||||||
|
src: url('//at.alicdn.com/t/c/font_3683562_hhqgn724iob.woff2?t=1665041844705') format('woff2'),
|
||||||
|
url('//at.alicdn.com/t/c/font_3683562_hhqgn724iob.woff?t=1665041844705') format('woff'),
|
||||||
|
url('//at.alicdn.com/t/c/font_3683562_hhqgn724iob.ttf?t=1665041844705') format('truetype');
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-family: "iconfont" !important;
|
||||||
|
font-size: 26px;
|
||||||
|
font-style: normal;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-right:before {
|
||||||
|
content: "\e617";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-a-Arrow-Right2:before {
|
||||||
|
content: "\e602";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-home:before {
|
||||||
|
content: "\e600";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-home2:before {
|
||||||
|
content: "\e601";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-my:before {
|
||||||
|
content: "\e78b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-myfill:before {
|
||||||
|
content: "\e78c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-fenlei-xuanzhong:before {
|
||||||
|
content: "\e638";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-circle:before {
|
||||||
|
content: "\e606";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-moon:before {
|
||||||
|
content: "\eb68";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-music-albums:before {
|
||||||
|
content: "\e627";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-love-line:before {
|
||||||
|
content: "\e637";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-music-rf:before {
|
||||||
|
content: "\e63f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-pause-f:before {
|
||||||
|
content: "\e659";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-down-filling:before {
|
||||||
|
content: "\e688";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-play:before {
|
||||||
|
content: "\e680";
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 777 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 735 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 709 B |
Binary file not shown.
|
After Width: | Height: | Size: 133 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 876 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 925 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 953 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 962 B |
@@ -0,0 +1,76 @@
|
|||||||
|
/**
|
||||||
|
* 这里是uni-app内置的常用样式变量
|
||||||
|
*
|
||||||
|
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||||
|
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||||
|
*
|
||||||
|
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* 颜色变量 */
|
||||||
|
|
||||||
|
/* 行为相关颜色 */
|
||||||
|
$uni-color-primary: #007aff;
|
||||||
|
$uni-color-success: #4cd964;
|
||||||
|
$uni-color-warning: #f0ad4e;
|
||||||
|
$uni-color-error: #dd524d;
|
||||||
|
|
||||||
|
/* 文字基本颜色 */
|
||||||
|
$uni-text-color:#333;//基本色
|
||||||
|
$uni-text-color-inverse:#fff;//反色
|
||||||
|
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
|
||||||
|
$uni-text-color-placeholder: #808080;
|
||||||
|
$uni-text-color-disable:#c0c0c0;
|
||||||
|
|
||||||
|
/* 背景颜色 */
|
||||||
|
$uni-bg-color:#ffffff;
|
||||||
|
$uni-bg-color-grey:#f8f8f8;
|
||||||
|
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
|
||||||
|
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
|
||||||
|
|
||||||
|
/* 边框颜色 */
|
||||||
|
$uni-border-color:#c8c7cc;
|
||||||
|
|
||||||
|
/* 尺寸变量 */
|
||||||
|
|
||||||
|
/* 文字尺寸 */
|
||||||
|
$uni-font-size-sm:12px;
|
||||||
|
$uni-font-size-base:14px;
|
||||||
|
$uni-font-size-lg:16;
|
||||||
|
|
||||||
|
/* 图片尺寸 */
|
||||||
|
$uni-img-size-sm:20px;
|
||||||
|
$uni-img-size-base:26px;
|
||||||
|
$uni-img-size-lg:40px;
|
||||||
|
|
||||||
|
/* Border Radius */
|
||||||
|
$uni-border-radius-sm: 2px;
|
||||||
|
$uni-border-radius-base: 3px;
|
||||||
|
$uni-border-radius-lg: 6px;
|
||||||
|
$uni-border-radius-circle: 50%;
|
||||||
|
|
||||||
|
/* 水平间距 */
|
||||||
|
$uni-spacing-row-sm: 5px;
|
||||||
|
$uni-spacing-row-base: 10px;
|
||||||
|
$uni-spacing-row-lg: 15px;
|
||||||
|
|
||||||
|
/* 垂直间距 */
|
||||||
|
$uni-spacing-col-sm: 4px;
|
||||||
|
$uni-spacing-col-base: 8px;
|
||||||
|
$uni-spacing-col-lg: 12px;
|
||||||
|
|
||||||
|
/* 透明度 */
|
||||||
|
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
|
||||||
|
|
||||||
|
/* 文章场景相关 */
|
||||||
|
$uni-color-title: #2C405A; // 文章标题颜色
|
||||||
|
$uni-font-size-title:20px;
|
||||||
|
$uni-color-subtitle: #555555; // 二级标题颜色
|
||||||
|
$uni-font-size-subtitle:26px;
|
||||||
|
$uni-color-paragraph: #3F536E; // 文章段落颜色
|
||||||
|
$uni-font-size-paragraph:15px;
|
||||||
Reference in New Issue
Block a user