页面添加

2024-02-03 19:57:35 +08:00 · 2024-02-03 19:57:35 +08:00 · ecab089767
commit ecab089767
parent 9432b55708
2 changed files with 129 additions and 0 deletions
--- a/pages.json
+++ b/pages.json
@ -23,6 +23,16 @@
 				"navigationStyle": "custom"
 			}
 		},
+		{
+		    "path" : "pages/upload/upload",
+		    "style" :                                                                                    
+		    {
+		       "navigationBarTitleText": "上传",
+		       "enablePullDownRefresh": false,
+		       "navigationStyle": "custom"
+		    }
+		    
+		},
 		{
 			"path" : "pages/my",
 			"style" : 
--- a/pages/upload/upload.vue
+++ b/pages/upload/upload.vue
@ -0,0 +1,119 @@
+<template>
+	<view>
+		<u-navbar :is-back="true" title='上传' title-color="#000" :border-bottom="false" :background="true"
+			id="navbar">
+		</u-navbar>
+		<!-- 111 -->
+		<button @click="btn()">上传图片</button>
+		<view style="width: 750rpx;height: 750rpx;">
+			<image :src="item" v-for="(item,index) in imglist" :key="index" style="width: 750rpx;height: 750rpx;"></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+			data() {
+				return {
+					imglist:[],
+					token: '',
+				}
+			},
+			onLoad() {
+				this.getQiniuToken()
+			},
+			methods:{
+				btn(){
+					let _this=this
+					let math='static/'+_this.$u.guid(20)
+					// uni.chooseMessageFile({
+					//   count: 10,
+					//   type: 'all',
+					//   success (res) {
+					//     // tempFilePath可以作为img标签的src属性显示图片
+					//     const tempFilePaths = res.tempFiles
+					// 	// let tempFilePaths = chooseImageRes.tempFilePaths;
+					// 	console.log(tempFilePaths)
+					// 	// tempFilePaths.forEach(item=>{
+					// 	// 	// 上传图片到七牛云
+							
+					// 	// })
+					// 	wx.uploadFile({
+					// 		url: 'https://upload-cn-east-2.qiniup.com', 
+					// 		name: 'file',
+					// 		filePath: tempFilePaths[0].path,
+					// 		formData: {
+					// 			token: _this.token, //后端返回的token
+					// 			key:'ct/img/'+math
+					// 		},
+					// 		success: function(res) {
+						
+					// 			let str = JSON.parse(res.data)
+					// 			// console.log(str.key)
+					// 			_this.userImgs = 'https://file.langsi.online/' + str.key
+					// 			console.log(_this.userImgs)
+					// 			_this.imglist.push(_this.userImgs)
+					// 		}
+					// 	});
+					//   }
+					// })
+					uni.chooseFile({
+						success: (chooseImageRes) => {
+							let tempFilePaths = chooseImageRes.tempFilePaths;
+							console.log(tempFilePaths)
+							tempFilePaths.forEach(item=>{
+								// 上传图片到七牛云
+								wx.uploadFile({
+									url: 'https://upload-cn-east-2.qiniup.com', 
+									name: 'file',
+									filePath: item,
+									formData: {
+										token: _this.token, //后端返回的token
+										key:'yasiimg/web/'+math
+									},
+									success: function(res) {
+								
+										let str = JSON.parse(res.data)
+										// console.log(str.key)
+										_this.userImgs = 'https://file.langsi.online/' + str.key+'.pdf'
+										console.log(_this.userImgs)
+										_this.imglist.push(_this.userImgs)
+									}
+								});
+							})
+							
+							
+						}
+					});
+				},
+				// 获取上传七牛云token
+				getQiniuToken() {
+						wx.request({
+						url: 'https://v2.ielts.langsi.online/file/getToken',
+						method: 'get',  // Adjust the request method as needed
+						// data: yourData,
+						header: {
+							'Authorization': 'eyJhbGciOiJIUzUxMiJ9.eyJub3RfeWJzX3VzZXJfa2V5IjoiNWZiYzA4YmUtNDZlMi00NDUzLThmYjQtMjFlNzhjZDIxY2EyIn0.jw2fyMnlNEW-zx8cH6aPh_H-WqEAHDQdh4oCpYg3qBIJZEmw6L4oNWJPvKHM9edmRdLO0p2z7_vlCYoY00NqxA ' 
+						},
+						success: (res) => {
+							console.log(res);
+							this.token = res.data.data.token
+						},
+						fail: (err) => {
+							console.log(err);
+						}
+						});
+					// this.$u.get('https://v2.ielts.langsi.online/file/getToken').then(res => {
+					// 	console.log(res.data);
+					// 	this.token = res.data.token
+					// }).catch(err => {
+					// 	console.log(err)
+					// })
+					
+				},
+			}
+		}
+</script>
+
+<style>
+</style>