| | |
| | | <!-- |
| | | * @Date: 2019-08-30 18:04:49 |
| | | * @LastEditors: 小明丶 |
| | | * @LastEditTime: 2020-06-08 14:09:13 |
| | | * @LastEditors: zxq |
| | | * @LastEditTime: 2022-08-05 15:26:13 |
| | | * @Description: |
| | | --> |
| | | <template> |
| | |
| | | </div> |
| | | <!--选择上传图片还是拍照--> |
| | | |
| | | <van-action-sheet |
| | | <!-- <van-action-sheet |
| | | v-model="selectModel" |
| | | :close-on-click-overlay="false" |
| | | cancel-text="取消" |
| | | :actions="nav" |
| | | @select="handleMenuSelect" |
| | | ></van-action-sheet> |
| | | ></van-action-sheet> --> |
| | | <van-action-sheet v-model="selectModel" cancel-text="取消"> |
| | | <div class="content"> |
| | | <div class="upload_input" @click="handleMenuSelect"> |
| | | <div>拍照</div> |
| | | <input |
| | | style="cursor:pointer;width:100%;opacity:0;" |
| | | type="file" |
| | | id='inputFileCapture' |
| | | ref="androidInputFileCapture" |
| | | @change="handlePhotoChange($event,2)" |
| | | accept="image/*" |
| | | capture="camera" |
| | | /> |
| | | </div> |
| | | <div class="upload_input" @click="handleMenuSelect"> |
| | | <div>本地相册上传</div> |
| | | <input |
| | | style="cursor:pointer;width:100%;opacity: 0;" |
| | | type="file" |
| | | id='inputFileImage' |
| | | ref="androidInputFileImage" |
| | | @change="handlePhotoChange($event,1)" |
| | | accept="image/jpg, image/jpeg, image/png" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </van-action-sheet> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | }, |
| | | // 选择拍照或者相册选项 |
| | | handleMenuSelect(item, index) { |
| | | if (index === 0) { |
| | | this.$refs.androidInputFileCapture.click(); |
| | | } else { |
| | | this.$refs.androidInputFileImage.click(); |
| | | } |
| | | // if (index === 0) { |
| | | // this.$refs.androidInputFileCapture.click(); |
| | | // } else { |
| | | // this.$refs.androidInputFileImage.click(); |
| | | // } |
| | | this.selectModel = false; |
| | | }, |
| | | // 处理图片的删除 |
| | |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | <style lang="less"> |
| | | .component-photo-upload-img { |
| | | .upload_input{ |
| | | |
| | | width: 100%; |
| | | font-size: 16px; |
| | | position: relative; |
| | | text-align: center; |
| | | padding: 8px 0; |
| | | margin:10px 0; |
| | | input{ |
| | | position: absolute; |
| | | left: 0; |
| | | top: 0; |
| | | } |
| | | } |
| | | .pic-title { |
| | | margin-bottom: 10px; |
| | | } |