|
|
@@ -1,137 +1,126 @@
|
|
|
<template>
|
|
|
-
|
|
|
<view>
|
|
|
+ <view @tap="goCamera()" class="cameraButton">
|
|
|
+ 拍照按钮
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="uni-list list-pd">
|
|
|
+ <view class="uni-uploader__files">
|
|
|
+ <view v-for="(image, index) in imageList" :key="index" class="abc">
|
|
|
+ <view class="uni-uploader__file" style="inline-block">
|
|
|
+ <view class="delete " :style="{'z-index': 99}" @tap="onDeleteClick(index)">x</view>
|
|
|
+ <view class=" images-one">
|
|
|
+ <image class="uni-uploader__img image-bg" :src="image" :data-src="image"
|
|
|
+ @tap="previewImage"></image>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="uni-uploader__input-box" v-show="imageList.length > 0">
|
|
|
+ <view class="uni-uploader__input" @tap="onGetImgClick"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
- <button class="bg-blue" @click="scancode()">扫码</button>
|
|
|
|
|
|
- </view>
|
|
|
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
-
|
|
|
data() {
|
|
|
+ return {
|
|
|
|
|
|
- return {}
|
|
|
+ imageList: [],
|
|
|
|
|
|
+ }
|
|
|
},
|
|
|
-
|
|
|
- onLoad() {
|
|
|
-
|
|
|
- // #ifdef H5
|
|
|
- let redirect_uri = location.href.split('#')[0]
|
|
|
- uni.request({
|
|
|
- url: "https://qhome.usky.cn/USKYZHAF/sign.php",
|
|
|
- header: {
|
|
|
- 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
|
|
|
- },
|
|
|
- data: {
|
|
|
- "url": redirect_uri
|
|
|
- },
|
|
|
- method: 'GET',
|
|
|
- success: (res) => {
|
|
|
- let apiList = [ // 可能需要用到的能力 需要啥就写啥。多写也没有坏处
|
|
|
- 'openLocation',
|
|
|
- 'getLocation',
|
|
|
- 'scanQRCode'
|
|
|
- ];
|
|
|
- let info = {
|
|
|
- debug: true, // 调试，发布的时候改为false
|
|
|
- appId: res.data.appid,
|
|
|
- nonceStr: res.data.nonceStr,
|
|
|
- timestamp: parseInt(res.data.timestamp),
|
|
|
- signature: res.data.sha_str,
|
|
|
- jsApiList: apiList
|
|
|
- };
|
|
|
- this.wx_co(info)
|
|
|
-
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
- // #endif
|
|
|
+ mounted() {
|
|
|
|
|
|
},
|
|
|
|
|
|
- methods: {
|
|
|
-
|
|
|
- wx_co: function(wx_co) {
|
|
|
- this.$wx.config({
|
|
|
-
|
|
|
- debug: false, // 开启调试模式
|
|
|
-
|
|
|
- appId: wx_co.appId, // 必填，公众号的唯一标识
|
|
|
-
|
|
|
- timestamp: wx_co.timestamp, // 必填，生成签名的时间戳
|
|
|
-
|
|
|
- nonceStr: wx_co.nonceStr, // 必填，生成签名的随机串
|
|
|
-
|
|
|
- signature: wx_co.signature, // 必填，签名，见附录1
|
|
|
-
|
|
|
- jsApiList: ['onMenuShareAppMessage', 'scanQRCode'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- this.$wx.ready(function() { //需在用户可能点击分享按钮前就先调用
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- this.$wx.checkJsApi({
|
|
|
-
|
|
|
- jsApiList: ['scanQRCode'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
|
|
|
-
|
|
|
- success: function(res) {
|
|
|
-
|
|
|
- // 以键值对的形式返回，可用的api值true，不可用为false
|
|
|
|
|
|
- // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- this.$wx.error(function(res) {
|
|
|
-
|
|
|
- console.log(res, 'this.$wx.error') // config信息验证失败会执行error函数
|
|
|
-
|
|
|
- });
|
|
|
+ //拍照
|
|
|
+ methods: {
|
|
|
|
|
|
+ // 删除图片
|
|
|
+ onDeleteClick(index) {
|
|
|
+ this.imageList.splice(index, 1)
|
|
|
},
|
|
|
+ // previewImage() {
|
|
|
+ // // 预览功能，相关博客有
|
|
|
+ // },
|
|
|
|
|
|
- scancode: function() {
|
|
|
- alert(1);
|
|
|
- this.$wx.scanQRCode({
|
|
|
-
|
|
|
- needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
|
|
|
|
|
|
- scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有
|
|
|
|
|
|
+ goCamera() {
|
|
|
+ const that = this
|
|
|
+ uni.chooseImage({
|
|
|
+ count: 2, // 最多可以选择的图片张数，默认9
|
|
|
+ sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
|
|
|
+ sourceType: ['camera'], //album 从相册选图，camera 使用相机，默认二者都有。如需直接开相机或直接选相册，请只使用一个选项
|
|
|
success: function(res) {
|
|
|
|
|
|
- setTimeout(function(){
|
|
|
- /* 放200ms后执行的代码 */
|
|
|
- alert(2)
|
|
|
- },1000)
|
|
|
-
|
|
|
- var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
|
|
|
-
|
|
|
+ var tempFilePaths = res.tempFilePaths[0]
|
|
|
+ alert(1)
|
|
|
+ alert(tempFilePaths)
|
|
|
+ const len = that.imageList.length
|
|
|
+ if (len >= 2) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '图片最多上传2张'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ for (let i = 0; i < 2 - len; i++) {
|
|
|
+ if (res.tempFilePaths[i]) that.imageList.push(res.tempFilePaths[i])
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
|
|
|
- });
|
|
|
|
|
|
- }
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
+<style>
|
|
|
+ .cameraButton {
|
|
|
+ border: 1px solid red;
|
|
|
+ display: inline-block;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ padding: 10rpx
|
|
|
+ }
|
|
|
|
|
|
+ .images-one {
|
|
|
+ white-space: nowrap;
|
|
|
+ position: relative;
|
|
|
+ width: 150rpx;
|
|
|
+ height: 150rpx;
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center;
|
|
|
+ vertical-align: middle;
|
|
|
+ font-size: 1.5em;
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 20rpx
|
|
|
+ }
|
|
|
|
|
|
-<style lang="scss">
|
|
|
+ .image-bg {
|
|
|
+ position: absolute;
|
|
|
+ z-index: -1;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
|
|
|
+ .abc {
|
|
|
+ display: inline-block
|
|
|
+ }
|
|
|
</style>
|
ming