| | |
| | | <view class="uni-flex" style="margin-bottom: 10px;"> |
| | | <view class="uni-list-cell-left">点击可预览选好的图片</view> |
| | | <view style="margin-left: auto;"> |
| | | <text class="click-t">{{ qsImage.length }}/{{ countIndex + 1 }}</text> |
| | | <text class="click-t">共有{{ qsImage.length }}张图片</text> |
| | | </view> |
| | | </view> |
| | | <view class="uni-flex" style="flex-wrap: wrap;"> |
| | |
| | | </view> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" @click="save">上传图片</button> |
| | | <button type="primary" class="upImg" @click="save">上传图片</button> |
| | | </view> |
| | | </view> |
| | | <!-- #ifdef APP --> |
| | |
| | | |
| | | uni.chooseImage({ |
| | | sourceType: sourceTypeArray[this.sourceTypeIndex], |
| | | sizeType: sizeTypeArray[this.sizeTypeIndex], |
| | | //sizeType: sizeTypeArray[this.sizeTypeIndex], |
| | | sizeType: ['compressed'], // 强制使用压缩模式 |
| | | crop: this.isCrop ? { |
| | | "quality": this.cropPercent, |
| | | "width": this.cropWidth, |
| | |
| | | count: this.qsImage.length + this.count[this.countIndex] > 9 ? 9 - this.qsImage.length : this.count[this.countIndex], |
| | | success: (res) => { |
| | | let url = res.tempFilePaths[0]; |
| | | pathToBase64(url) |
| | | .then(base64 => { |
| | | // 找到最后一个斜杠的位置 |
| | | let lastSlashIndex = url.lastIndexOf("/"); |
| | | // 提取文件名 |
| | | let fileName = url.substring(lastSlashIndex + 1); |
| | | let entity = {}; |
| | | entity.img = base64; |
| | | entity.Picturename = fileName; |
| | | entity.fid = this.fid; |
| | | entity.qsType = 1; |
| | | entity.base64Date = base64.split(',')[1]; |
| | | |
| | | this.qsImage.push(entity); |
| | | }) |
| | | .catch(error => { |
| | | console.error(error) |
| | | }) |
| | | pathToBase64(url) |
| | | .then(base64 => { |
| | | // 找到最后一个斜杠的位置 |
| | | let lastSlashIndex = url.lastIndexOf("/"); |
| | | // 提取文件名 |
| | | let fileName = url.substring(lastSlashIndex + 1); |
| | | let entity = {}; |
| | | entity.img = base64; |
| | | entity.Picturename = fileName; |
| | | entity.fid = this.fid; |
| | | entity.qsType = 1; |
| | | entity.base64Date = base64.split(',')[1]; |
| | | |
| | | this.qsImage.push(entity); |
| | | }) |
| | | .catch(error => { |
| | | console.error(error) |
| | | }) |
| | | |
| | | }, |
| | | fail: (err) => { |
| | | console.log("err: ", JSON.stringify(err)); |
| | |
| | | }); |
| | | }, |
| | | previewImage(index) { |
| | | // console.log(this.qsImage.map(s=>s.img)[0]) |
| | | let imagesArry = []; |
| | | base64ToPath(this.qsImage.map(s=>s.img)[index]).then(path => { |
| | | uni.hideLoading(); |
| | | imagesArry[0] = path |
| | | console.log(path); |
| | | uni.previewImage({ |
| | | current: 0, |
| | | urls: imagesArry |
| | | }) |
| | | }) |
| | | |
| | | |
| | | // uni.previewImage({ |
| | | // current: index, // 设置当前显示图片的链接 |
| | | // current: '0', // 设置当前显示图片的链接 |
| | | // urls: this.qsImage.map(s=>s.img), // 需要预览的图片链接列表 |
| | | // loop: false, // 是否开启图片轮播,默认为 false |
| | | // indicator: 'default',// 图片指示器类型,可选值为 "default"、"number"、"pointer",默认为 "default" |
| | | // indicator: 'pointer',// 图片指示器类型,可选值为 "default"、"number"、"pointer",默认为 "default" |
| | | // }); |
| | | }, |
| | | init() { |
| | | this.$post({ |
| | | url: "/Base/getByFid", |
| | | // url: "/Base/getLljAllImgByFid", |
| | | url: "/Base/getByFid", |
| | | data: { |
| | | fid: this.fid, |
| | | qsType: 1 |
| | |
| | | bottom: 0; |
| | | width: 100%; |
| | | background-color: #ffffff; /* 背景颜色 */ |
| | | padding: 10px; |
| | | /* padding: 10px; */ |
| | | box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1); /* 添加底部阴影效果 */ |
| | | z-index: 999; /* 确保按钮位于顶层 */ |
| | | } |
| | |
| | | max-height: calc(100vh - 240px); /* 屏幕高度减去上传按钮高度 */ |
| | | overflow-y: auto; /* 当内容超出高度时出现垂直滚动条 */ |
| | | } |
| | | .upImg{ |
| | | |
| | | background-color: #3498db; |
| | | color: white; |
| | | |
| | | } |
| | | </style> |