|
|
<template>
|
|
|
<view class="background">
|
|
|
<!-- 点击上传图片按钮 -->
|
|
|
<image class="upload_picture" @click="selectAndUploadPicture" src="@/static/homepages/homes/ai_recognize_fruit/pictures/photo.png"></image>
|
|
|
|
|
|
<!-- 所含卡路里显示窗口 -->
|
|
|
<view class="calorie_container">
|
|
|
<text class="calorie_text">{{ calorie }}J</text>
|
|
|
</view>
|
|
|
|
|
|
<!-- 所含菜品名称显示窗口 -->
|
|
|
<view class="name_container">
|
|
|
<text class="name_text">{{ name }}</text>
|
|
|
</view>
|
|
|
|
|
|
<!-- 返回按钮 -->
|
|
|
<image class="button" @click="goBackToHome" src="/static/homepages/homes/ai_recognize_fruit/pictures/button.png"></image>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
calorie: 0,
|
|
|
name: '',
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
goBackToHome() {
|
|
|
uni.navigateTo({
|
|
|
url: '/pages/homepages/homes/home/home', // 跳转到主页
|
|
|
});
|
|
|
},
|
|
|
// 选择图片
|
|
|
selectAndUploadPicture() {
|
|
|
const app = getApp();
|
|
|
const serverAddress = app.globalData.fit_journey_ai_address;
|
|
|
console.log("后端服务器的地址是：" + serverAddress);
|
|
|
|
|
|
// 调用选择图片的 API
|
|
|
uni.file
|
|
|
uni.chooseImage({
|
|
|
count: 1, // 选择的图片数量，1表示只选择一张
|
|
|
sizeType: ['compressed'], // 可以选择原图或者压缩图，compressed为压缩图
|
|
|
sourceType: ['album', 'camera'], // 可选择相册或拍照
|
|
|
success: (chooseImageRes) => {
|
|
|
|
|
|
const filePath = chooseImageRes.tempFilePaths[0]; // 获取选择的图片路径
|
|
|
console.log('选择的图片路径:', filePath);
|
|
|
console.log("图片上传成功！");
|
|
|
// 上传文件到后端服务器中
|
|
|
uni.uploadFile({
|
|
|
header: {
|
|
|
'Authorization': app.globalData.token // 授权 token
|
|
|
},
|
|
|
url: app.globalData.fit_journey_ai_address + `/ai/fruit`, // 服务器接口地址
|
|
|
|
|
|
filePath: filePath,
|
|
|
name: 'file', // 后端接收的文件参数名称
|
|
|
success: (uploadFileRes) => {
|
|
|
console.log('上传结果:', uploadFileRes);
|
|
|
const response = JSON.parse(uploadFileRes.data); // 解析返回的数据
|
|
|
if (response && response.data) {
|
|
|
// 处理返回的数据
|
|
|
this.calorie = response.data.calorie || 0;
|
|
|
this.name = response.data.name || '识别失败，请重新上传图片';
|
|
|
} else {
|
|
|
uni.showToast({
|
|
|
title: '识别失败，请重新上传图片',
|
|
|
icon: 'none',
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
fail: () => {
|
|
|
uni.showToast({
|
|
|
title: '图片上传失败',
|
|
|
icon: 'none',
|
|
|
});
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
fail: () => {
|
|
|
uni.showToast({
|
|
|
title: '图片选择失败',
|
|
|
icon: 'none',
|
|
|
});
|
|
|
},
|
|
|
});
|
|
|
}
|
|
|
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
@import "@/static/homepages/homes/ai_recognize_fruit/css/ai_recongnize_fruit.scss";
|
|
|
</style>
|
