Refactor(云灵AI):1、使用新模型逻辑对接；2、订单查询
This commit is contained in:
lifizer
@@ -0,0 +1,227 @@
|
||||
<template>
|
||||
<view
|
||||
:style="{ 'background-image': 'url(' + webUrl + '/aiChat/bg-05.png)' }"
|
||||
class="image-recognition-page"
|
||||
>
|
||||
<hx-navbar
|
||||
:back="true"
|
||||
:fixed="true"
|
||||
:statusBar="true"
|
||||
left-icon="arrowleft"
|
||||
color="#333"
|
||||
transparent="auto"
|
||||
barPlaceholder="hidden"
|
||||
title="云灵"
|
||||
/>
|
||||
|
||||
<view
|
||||
class="main-content"
|
||||
:style="{ 'padding-top': (44 + statusBarHeight) + 'px' }"
|
||||
>
|
||||
<!-- 拍照区域 -->
|
||||
<view class="camera-section" @click="takePhoto">
|
||||
<view class="dashed-border-box">
|
||||
<view class="icon-wrap">
|
||||
<image
|
||||
:src="webUrl + '/aiChat/icon-55.png'"
|
||||
class="camera-icon"
|
||||
mode="widthFix"
|
||||
/>
|
||||
</view>
|
||||
<view class="main-title">对准商品拍照</view>
|
||||
<view class="sub-tip">示例：特产/零食/茶叶/纪念品</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部相册上传按钮 -->
|
||||
<view class="bottom-action">
|
||||
<button class="album-btn" @click="chooseImage">
|
||||
<image
|
||||
:src="webUrl + '/aiChat/icon-56.png'"
|
||||
class="upload-icon"
|
||||
mode="widthFix"
|
||||
/>
|
||||
<text>从相册上传图片进行识别</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { chatMixins } from '../mixins/chatMixins.js'
|
||||
import { VUE_APP_API_URL } from '@/config'
|
||||
|
||||
export default {
|
||||
name: 'AiChatImageRecognitionPage',
|
||||
mixins: [chatMixins],
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
createdCallbak() {
|
||||
// 覆盖 mixins 中的 createdCallbak，避免触发默认逻辑
|
||||
},
|
||||
takePhoto() {
|
||||
if (this.loading) return
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['compressed'],
|
||||
sourceType: ['camera'],
|
||||
success: (res) => {
|
||||
this.handleUpload(res.tempFilePaths[0])
|
||||
}
|
||||
})
|
||||
},
|
||||
chooseImage() {
|
||||
if (this.loading) return
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['compressed'],
|
||||
sourceType: ['album'],
|
||||
success: (res) => {
|
||||
this.handleUpload(res.tempFilePaths[0])
|
||||
}
|
||||
})
|
||||
},
|
||||
handleUpload(filePath) {
|
||||
const _this = this
|
||||
uni.showLoading({ title: '识别中...' })
|
||||
_this.loading = true
|
||||
|
||||
uni.uploadFile({
|
||||
url: `${VUE_APP_API_URL}/api/upload`,
|
||||
filePath: filePath,
|
||||
header: {
|
||||
Authorization: 'Bearer ' + (_this.token || '')
|
||||
},
|
||||
name: 'file',
|
||||
success: (uploadRes) => {
|
||||
const resData = JSON.parse(uploadRes.data)
|
||||
if (resData.link) {
|
||||
_this.performRecognition(resData.link)
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
_this.loading = false
|
||||
_this.$toast('上传失败，请重试')
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('Upload Error:', err)
|
||||
uni.hideLoading()
|
||||
_this.loading = false
|
||||
_this.$toast('网络异常，请重试')
|
||||
}
|
||||
})
|
||||
},
|
||||
performRecognition(imageUrl) {
|
||||
// 存储识别到的图片 URL，并返回上一页
|
||||
uni.setStorageSync('recognitionImage', imageUrl)
|
||||
uni.navigateTo({
|
||||
url: '/aiChat/views/imageRecognitionResult'
|
||||
})
|
||||
uni.hideLoading()
|
||||
this.loading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.image-recognition-page {
|
||||
height: 100vh;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.main-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 60rpx 40rpx;
|
||||
height: 100vh;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.camera-section {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 60rpx;
|
||||
|
||||
.dashed-border-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 600rpx;
|
||||
width: 100%;
|
||||
margin-top: 80rpx;
|
||||
border: 2rpx dashed #DCDFE6;
|
||||
border-radius: 24rpx;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
|
||||
.icon-wrap {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 50%;
|
||||
border: 6rpx solid #7A3DF1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 40rpx;
|
||||
|
||||
.camera-icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.main-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.sub-tip {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-action {
|
||||
width: 100%;
|
||||
padding-bottom: 60rpx;
|
||||
|
||||
.album-btn {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
background: #3D4CF1;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 32rpx;
|
||||
border: none;
|
||||
box-shadow: 0 8rpx 20rpx rgba(61, 76, 241, 0.3);
|
||||
|
||||
.upload-icon {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user