springboot+uniapp上传图片

<view class="cu-form-group">
	<view class="title">特种作业证照:</view>
	<view class='upload-image-view'>
		<!-- 标题已经省略 -->
		<!-- <view class='title'>上传xxxx图片</view> -->
		<block v-for="(image,index) in LicenseImageList" :key="index">
			<view class='image-view'>
				<image :src="image" :data-src="image" @tap="previewLicenseImage"></image>
				<view class='del-btn' :data-index="index" @tap='deleteLicenseImage'>
					<view class='baicha'></view>
				</view>
			</view>
		</block>
		<view class='add-view' v-if="LicenseImageList.length < imageLength" @tap="chooseLicenseImage">

			<!-- 相机 -->
			<!-- <view class="xiangji">
									<view class="tixing"></view>
									<view class='changfx'>
										<view class='yuan1'>
											<view class='yuan2'></view>
										</view>
									</view>
								</view> -->

			<!-- 十字架 -->
			<view class="cross">
				<view class="transverse-line"></view>
				<view class="vertical-line"></view>
			</view>

		</view>
	</view>
</view>
//特种作业证照-选择图片
chooseLicenseImage: async function() {
	uni.chooseImage({
		sourceType: sourceType[this.sourceTypeIndex],
		// #ifdef MP-WEIXIN
		sizeType: sizeType[this.sizeTypeIndex],
		// #endif
		count: this.imageLength - this.LicenseImageList.length,
		success: (res) => {
			const tempFilePaths = res.tempFilePaths[0];
			api.uploadFile({
				url: 'uploadFail/upload',
				filePath: tempFilePaths,
				name: 'file',
				success: (uploadFileRes) => {
					this.LicenseImageList = [uploadFileRes.url];
				}
			});
		}
	})
},
//特种作业证照--预览图片
previewLicenseImage: function(e) {
	var current = e.target.dataset.src
	uni.previewImage({
		current: current,
		urls: this.LicenseImageList
	})
},
//特种作业证照--删除图片
deleteLicenseImage: function(e) {
	var index = e.target.dataset.index;
	var that = this;
	var images = that.LicenseImageList;
	images.splice(index, 1);
	that.LicenseImageList = images;
},
@RestController
@RequestMapping("/api/uploadFail")
@Validated
public class UploadFileController {

  @Autowired
   private ServerConfig serverConfig;

   /**
    * 通用上传请求
    */
   @PostMapping("upload")
   public AjaxResult uploadFile(MultipartFile file) throws Exception
   {
       try
       {
           // 上传文件路径
           String filePath = RuoYiConfig.getUploadPath();
           // 上传并返回新文件名称
           String fileName = FileUploadUtils.upload(filePath, file);
           String url = serverConfig.getUrl() + fileName;
           AjaxResult ajax = AjaxResult.success();
           ajax.put("fileName", fileName);
           ajax.put("url", url);
           return ajax;
       }
       catch (Exception e)
       {
           return AjaxResult.error(e.getMessage());
       }
   }
}
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值