Browse Source

upload

master
HolyKnightIX 1 year ago
parent
commit
f15e2b3611
4 changed files with 135 additions and 19 deletions
  1. +66
    -1
      miniprogram/pages/checkImg/checkImg.js
  2. +53
    -0
      miniprogram/pages/checkImg/checkImg.less
  3. +15
    -17
      miniprogram/pages/checkImg/checkImg.wxml
  4. +1
    -1
      project.private.config.json

+ 66
- 1
miniprogram/pages/checkImg/checkImg.js View File

@@ -5,7 +5,25 @@ Page({
* 页面的初始数据
*/
data: {

currentIndex: 0,
swiperList: [
{
id: "1",
src: "https://suimang.oss-accelerate.aliyuncs.com/capi/2023-09-21/4f3cf1dea65142a2945d5412bee85ca2.jpg?x-oss-process=image/resize,w_10000/quality,q_60"
},
{
id: "2",
src: "https://suimang.oss-accelerate.aliyuncs.com/capi/2023-09-21/4f3cf1dea65142a2945d5412bee85ca2.jpg?x-oss-process=image/resize,w_10000/quality,q_60"
},
{
id: "3",
src: "https://suimang.oss-accelerate.aliyuncs.com/capi/2023-09-21/4f3cf1dea65142a2945d5412bee85ca2.jpg?x-oss-process=image/resize,w_10000/quality,q_60"
},
{
id: "4",
src: "https://suimang.oss-accelerate.aliyuncs.com/capi/2023-09-21/4f3cf1dea65142a2945d5412bee85ca2.jpg?x-oss-process=image/resize,w_10000/quality,q_60"
}
]
},

/**
@@ -22,9 +40,56 @@ Page({

},

switchImg(e) {
const currentIndex = e.currentTarget.dataset.index
this.setData({
currentIndex
})
},

previewImage() {
const array = []
this.data.swiperList.forEach(item => {
array.push(item.src)
})
wx.previewImage({
urls: array,
showmenu: true,

})
},

swiperChanged(e) {
const currentIndex = e.detail.current
this.setData({
currentIndex
})
},

downloadImage() {
const index = this.data.currentIndex
const list = this.data.swiperList
const filePath = "zhixiangImg.png"

const url = list[index].src

wx.downloadFile({
url,
success: res => {
console.log(res, 'res');
if (res.statusCode === 200) {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
wx.showToast({
title: '保存成功!',
icon: "success"
})
}
})
}

}
})
},



+ 53
- 0
miniprogram/pages/checkImg/checkImg.less View File

@@ -1,4 +1,57 @@
/* pages/checkImg/checkImg.wxss */
page {
background-color: #333333;
padding: 50rpx 0;

.name {
text-align: center;
font-size: 45rpx;
color: #ffffff;
margin-bottom: 40rpx;
}

.imageList {
width: 100%;
height: 800rpx;
text-align: center;
overflow: hidden;

image {
width: 75%;
border-radius: 40rpx;
}
}

.indicator {
display: flex;
justify-content: space-between;
padding: 0 280rpx;
margin-bottom: 100rpx;

.item {
width: 20rpx;
height: 20rpx;
background-color: #ffffff50;
border-radius: 10rpx;
transition: all 0.3s;

&.active {
width: 28rpx;
background-color: #fff;
}
}
}

.downloadImage {
width: 70%;
height: 100rpx;
line-height: 100rpx;
font-weight: 600;
background-color: #ff4f00;
color: #ffffff;
font-size: 32rpx;
text-align: center;
border-radius: 50rpx;
margin: auto;
}
}

+ 15
- 17
miniprogram/pages/checkImg/checkImg.wxml View File

@@ -1,19 +1,17 @@
<!--pages/checkImg/checkImg.wxml-->
<text>pages/checkImg/checkImg.wxml</text>
<swiper>
<swiper-item>
<image src="../../asset/image/test.png" mode="" />
<view class="name">模板名称</view>

<swiper class="imageList" current="{{ currentIndex }}" bindchange="swiperChanged">
<swiper-item wx:for="{{ swiperList }}" wx:key="index">
<image src="{{ item.src }}" mode="widthFix" bindtap="previewImage" data-src="{{ item.src }}" />
</swiper-item>
<swiper-item>
<image src="../../asset/image/test.png" mode="" />
</swiper-item>
<swiper-item>
<image src="../../asset/image/test.png" mode="" />
</swiper-item>
<swiper-item>
<image src="../../asset/image/test.png" mode="" />
</swiper-item>
<swiper-item>
<image src="../../asset/image/test.png" mode="" />
</swiper-item>
</swiper>
</swiper>

<view class="indicator">
<view class="{{ currentIndex == 0 ? 'active item' : 'item' }}" bindtap="switchImg" data-index="0"></view>
<view class="{{ currentIndex == 1 ? 'active item' : 'item' }}" bindtap="switchImg" data-index="1"></view>
<view class="{{ currentIndex == 2 ? 'active item' : 'item' }}" bindtap="switchImg" data-index="2"></view>
<view class="{{ currentIndex == 3 ? 'active item' : 'item' }}" bindtap="switchImg" data-index="3"></view>
</view>

<button class="downloadImage" bindtap="downloadImage">保存到手机</button>

+ 1
- 1
project.private.config.json View File

@@ -1,6 +1,6 @@
{
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
"projectname": "Metavatr_DCIM_Wapp",
"projectname": "Metavatar_DCIM_Wapp",
"setting": {
"compileHotReLoad": true,
"urlCheck": true


Loading…
Cancel
Save