提交 7f31d405 编写于 作者: M m0_74163447

运动记录界面

上级 d42d1a98
function getLocalFilePath(path) {
if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf('_downloads') === 0) {
return path
}
if (path.indexOf('file://') === 0) {
return path
}
if (path.indexOf('/storage/emulated/0/') === 0) {
return path
}
if (path.indexOf('/') === 0) {
var localFilePath = plus.io.convertAbsoluteFileSystem(path)
if (localFilePath !== path) {
return localFilePath
} else {
path = path.substr(1)
}
}
return '_www/' + path
}
function dataUrlToBase64(str) {
var array = str.split(',')
return array[array.length - 1]
}
var index = 0
function getNewFileId() {
return Date.now() + String(index++)
}
function biggerThan(v1, v2) {
var v1Array = v1.split('.')
var v2Array = v2.split('.')
var update = false
for (var index = 0; index < v2Array.length; index++) {
var diff = v1Array[index] - v2Array[index]
if (diff !== 0) {
update = diff > 0
break
}
}
return update
}
export function pathToBase64(path) {
return new Promise(function(resolve, reject) {
if (typeof window === 'object' && 'document' in window) {
if (typeof FileReader === 'function') {
var xhr = new XMLHttpRequest()
xhr.open('GET', path, true)
xhr.responseType = 'blob'
xhr.onload = function() {
if (this.status === 200) {
let fileReader = new FileReader()
fileReader.onload = function(e) {
resolve(e.target.result)
}
fileReader.onerror = reject
fileReader.readAsDataURL(this.response)
}
}
xhr.onerror = reject
xhr.send()
return
}
var canvas = document.createElement('canvas')
var c2x = canvas.getContext('2d')
var img = new Image
img.onload = function() {
canvas.width = img.width
canvas.height = img.height
c2x.drawImage(img, 0, 0)
resolve(canvas.toDataURL())
canvas.height = canvas.width = 0
}
img.onerror = reject
img.src = path
return
}
if (typeof plus === 'object') {
plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) {
entry.file(function(file) {
var fileReader = new plus.io.FileReader()
fileReader.onload = function(data) {
resolve(data.target.result)
}
fileReader.onerror = function(error) {
reject(error)
}
fileReader.readAsDataURL(file)
}, function(error) {
reject(error)
})
}, function(error) {
reject(error)
})
return
}
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
wx.getFileSystemManager().readFile({
filePath: path,
encoding: 'base64',
success: function(res) {
resolve('data:image/png;base64,' + res.data)
},
fail: function(error) {
reject(error)
}
})
return
}
reject(new Error('not support'))
})
}
export function base64ToPath(base64) {
return new Promise(function(resolve, reject) {
if (typeof window === 'object' && 'document' in window) {
base64 = base64.split(',')
var type = base64[0].match(/:(.*?);/)[1]
var str = atob(base64[1])
var n = str.length
var array = new Uint8Array(n)
while (n--) {
array[n] = str.charCodeAt(n)
}
return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type })))
}
var extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/)
if (extName) {
extName = extName[1]
} else {
reject(new Error('base64 error'))
}
var fileName = getNewFileId() + '.' + extName
if (typeof plus === 'object') {
var basePath = '_doc'
var dirPath = 'uniapp_temp'
var filePath = basePath + '/' + dirPath + '/' + fileName
if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime.innerVersion)) {
plus.io.resolveLocalFileSystemURL(basePath, function(entry) {
entry.getDirectory(dirPath, {
create: true,
exclusive: false,
}, function(entry) {
entry.getFile(fileName, {
create: true,
exclusive: false,
}, function(entry) {
entry.createWriter(function(writer) {
writer.onwrite = function() {
resolve(filePath)
}
writer.onerror = reject
writer.seek(0)
writer.writeAsBinary(dataUrlToBase64(base64))
}, reject)
}, reject)
}, reject)
}, reject)
return
}
var bitmap = new plus.nativeObj.Bitmap(fileName)
bitmap.loadBase64Data(base64, function() {
bitmap.save(filePath, {}, function() {
bitmap.clear()
resolve(filePath)
}, function(error) {
bitmap.clear()
reject(error)
})
}, function(error) {
bitmap.clear()
reject(error)
})
return
}
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
var filePath = wx.env.USER_DATA_PATH + '/' + fileName
wx.getFileSystemManager().writeFile({
filePath: filePath,
data: dataUrlToBase64(base64),
encoding: 'base64',
success: function() {
resolve(filePath)
},
fail: function(error) {
reject(error)
}
})
return
}
reject(new Error('not support'))
})
}
\ No newline at end of file
{
"id": "mmmm-image-tools",
"name": "image-tools",
"version": "1.4.0",
"description": "图像转换工具,可用于图像和base64的转换",
"keywords": [
"base64",
"保存",
"图像"
]
}
\ No newline at end of file
<template>
<view class="main">
<view class="top">
<image @click="goBack" class="back" :src="'/static/my/exit-icon.png'"></image>
<view class="title">运动记录</view>
<span class="empty"></span>
</view>
<view class="record">
<view class="icon">
</view>
<view class="content">
<view class="content1">
<view class="distance">
{{distance}}公里
</view>
<image class="type-icon" :src="'/static/my/my-running-record/running.png/'"></image>
</view>
<view class="content2">
<view class="duration">
00:04:25
</view>
<image class="duration-icon" :src="'/static/my/my-running-record/duration.png'"></image>
<view class="pace">
04'35"
</view>
<image class="pace-icon" :src="'/static/my/my-running-record/pace.png'"></image>
<view class="date">
2023.04.29
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return{
distance:'1.04',
duration:'00:04:25',
pace:'04\'35\"',
date:'2023.04.29',
}
},
methods:{
goBack() {
uni.navigateBack({
delta: 1, //返回层数,2则上上页
})
},
onload() {
plus.navigator.setStatusBarBackground('#EDEEF0');
}
}
}
</script>
<style>
.main {
position: absolute;
width: 100%;
height: 100%;
/* background-color: #EDEEF0; */
}
.top {
width: 100%;
height: 50px;
background-color: #EDEEF0;
text-align: center;
}
.back {
width: 40px;
height: 30px;
margin-top: 10px;
margin-bottom: 10px;
float: left;
margin-left: 10px;
}
.empty {
width: 40px;
height: 30px;
margin-top: 10px;
margin-bottom: 10px;
float: right;
margin-right: 10px;
}
.title {
font-size: 20px;
margin-top: 10px;
font-weight: bold;
color: #f1992d;
display: inline-block;
}
.record{
border-bottom: 2rpx solid #EDEEF0;
width:100%;
height: 200rpx;
/* display: flex;
flex-direction: row; */
}
.icon{
border: 2rpx solid #EDEEF0;
width: 150rpx;
height: 150rpx;
margin-top: 20rpx;
margin-left: 30rpx;
float: left;
}
.content{
width: 72%;
height: 100%;
/* margin: 10rpx 0 10rpx 30rpx; */
float: right;
}
.content1{
height: 50%;
}
.distance{
width: 70%;
font-weight: bold;
font-size: 65rpx;
margin-top: 15rpx;
float: left;
}
.type-icon{
float: right;
margin-top: 50rpx;
margin-right: 70rpx;
width: 50rpx;
height: 50rpx;
}
.content2{
margin-top: 20rpx;
display: flex;
flex-direction: row;
font-size: 25rpx;
}
.duration{
}
.duration-icon{
width: 35rpx;
height: 35rpx;
}
.pace{
margin-left: 60rpx;
}
.pace-icon{
width: 35rpx;
height: 35rpx;
}
.date{
margin-left:90rpx;
}
</style>
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册