123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319 |
- <template>
- <view class="success-container">
- <view class="success-icon">
- <image src="https://data.qicai321.com/minlong/dbf3202a-de17-4d1d-8b8c-d0d708c55552.png" mode="aspectFit"></image>
- </view>
- <view class="success-title">
- <block v-if="isAnalyzing">照片解析中...</block>
- <block v-else>恭喜完成全部检测</block>
- </view>
-
- <view v-if="isAnalyzing" class="loading-container">
- <view class="loading-spinner"></view>
- <view class="loading-text">正在分析照片,请稍候...</view>
- </view>
-
- <view v-else class="check-list">
- <view class="check-item" v-for="(item, index) in checkItems" :key="index">
- <view class="check-index">{{index + 1}}</view>
- <view class="check-name">{{item.name}}</view>
- <view class="check-status" :class="{'status-fail': !item.success}">
- {{item.success ? '动作检测成功' : '动作检测失败'}}
- </view>
- </view>
- </view>
-
- <view class="button-group" v-if="!isAnalyzing">
- <button class="btn-retake" @click="retake" :disabled="isAnalyzing">重新拍摄</button>
- <button class="btn-next" @click="goNext" :disabled="isAnalyzing">
- {{hasFailedItems ? '补拍' : '下一步'}}
- </button>
- </view>
- </view>
- </template>
- <script>
- import { apiBaseUrl } from '@/common/config.js'; // 导入基础URL配置
- export default {
- data() {
- return {
- checkItems: [
- { name: '左手手心', success: true, type: 'left_palm', description: '展示完整的左手手掌' },
- { name: '左手手背', success: true, type: 'left_back', description: '展示完整的左手手背' },
- { name: '左手握拳', success: true, type: 'left_fist', description: '展示完整的左手握拳' },
- { name: '右手手心', success: true, type: 'right_palm', description: '展示完整的右手手掌' },
- { name: '右手手背', success: true, type: 'right_back', description: '展示完整的右手手背' },
- { name: '右手握拳', success: true, type: 'right_fist', description: '展示完整的右手握拳' }
- ],
- maxRetries: 3,
- currentRetry: 0,
- retryInterval: 3000, // 3秒
- applicationId: null,
- isAnalyzing: false, // 添加分析状态标志
- }
- },
- computed: {
- hasFailedItems() {
- return this.checkItems.some(item => !item.success)
- },
- failedItems() {
- return this.checkItems.filter(item => !item.success)
- }
- },
- onLoad(options) {
- this.applicationId = uni.getStorageSync('appId')
- this.fetchAnalysisResults()
- },
- methods: {
- async fetchAnalysisResults() {
- try {
- this.isAnalyzing = true // 开始分析时设置状态
- const response = await uni.request({
- url: `${apiBaseUrl}/api/system/job/get_visual_analysis_results?application_id=${this.applicationId}`,
- })
- console.log(response)
-
- // 检查响应状态码
- if (response.data.code === 2001) {
- // 状态码2001表示正在处理中,继续轮询
- setTimeout(() => {
- this.fetchAnalysisResults()
- }, this.retryInterval)
- return
- }
-
- // 处理成功响应
- if (response.data.code === 2000 && response.data.data && response.data.data.photo_results && response.data.data.photo_results.length > 0) {
- this.isAnalyzing = false // 分析完成
- this.processResults(response.data.data.photo_results)
- } else if (this.currentRetry < this.maxRetries) {
- // 如果没有结果且未达到最大重试次数,则重试
- this.currentRetry++
- setTimeout(() => {
- this.fetchAnalysisResults()
- }, this.retryInterval)
- } else {
- this.isAnalyzing = false // 重试结束后也要关闭分析状态
- }
- } catch (error) {
- console.error('获取分析结果失败:', error)
- this.isAnalyzing = false // 发生错误时关闭分析状态
- }
- },
-
- processResults(photoResults) {
- const results = {}
-
- photoResults.forEach(photo => {
- // 根据description匹配对应的检测项
- const checkItem = this.checkItems.find(item =>
- photo.description === item.description
- )
- console.log(checkItem, photo)
- if (checkItem) {
- results[checkItem.type] = photo.part_verification.is_correct_part
- }
- })
-
- this.updateCheckResults(results)
- },
- updateCheckResults(results) {
- this.checkItems = this.checkItems.map(item => ({
- ...item,
- success: results[item.type] || false
- }))
- },
- retake() {
- if (this.hasFailedItems) {
- // 携带失败项信息跳转到拍照页面
- uni.navigateTo({
- url: '/pages/interview/interview?retake=true&failedItems=' +
- JSON.stringify(this.failedItems.map(item => item.type))
- })
- } else {
- uni.navigateBack()
- }
- },
- goNext() {
- if (!this.hasFailedItems) {
- uni.reLaunch({
- url: '/pages/success/success'
- })
- } else {
- // 使用 redirectTo 替代 navigateTo
- uni.reLaunch({
- url: '/pages/interview_retake/interview_retake?failedItems=' +
- JSON.stringify(this.failedItems)
- })
- }
- }
- }
- }
- </script>
- <style>
- .success-container {
- display: flex;
- flex-direction: column;
- align-items: center;
- padding: 40rpx 30rpx;
- }
- .success-icon {
- margin-top: 162rpx;
- width: 160rpx;
- height: 160rpx;
- }
- .success-icon image {
- width: 100%;
- height: 100%;
- }
- .success-title {
- font-size: 36rpx;
- font-weight: bold;
- margin: 30rpx 0 50rpx;
- }
- .check-list {
- width: 100%;
- margin-bottom: 60rpx;
- display: flex;
- flex-direction: column;
- align-content: center;
- flex-wrap: wrap;
- }
- .check-item {
- display: flex;
- align-items: center;
- margin-bottom: 20rpx;
- }
- .check-index {
- width: 40rpx;
- height: 40rpx;
- border-radius: 50%;
- background-color: #f0f0f0;
- color: #999;
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: 24rpx;
- margin-right: 20rpx;
- }
- .check-name {
- margin-right: 20px;
- font-size: 28rpx;
- color: #333;
- }
- .check-status {
- font-size: 28rpx;
- color: #003399;
- }
- .status-fail {
- color: #f56c6c;
- }
- .button-group {
- display: flex;
- width: 100%;
- justify-content: space-between;
- margin-top: 240rpx;
- }
- .btn-retake, .btn-next {
- width: 45%;
- height: 80rpx;
- line-height: 80rpx;
- text-align: center;
- border-radius: 8rpx;
- }
- .btn-retake {
- background-color: #f5f5f5;
- color: #333;
- border: 1px solid #ddd;
- }
- .btn-next {
- background-color: #003399;
- color: #fff;
- }
- .btn-next:disabled {
- background-color: #999;
- opacity: 0.6;
- }
- .loading-container {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background-color: rgba(255, 255, 255, 0.8);
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- }
- .loading-spinner {
- border: 4px solid #f3f3f3;
- border-top: 4px solid #003399;
- border-radius: 50%;
- width: 40rpx;
- height: 40rpx;
- animation: spin 1s linear infinite;
- }
- @keyframes spin {
- 0% { transform: rotate(0deg); }
- 100% { transform: rotate(360deg); }
- }
- .loading-text {
- margin-top: 20rpx;
- font-size: 28rpx;
- color: #333;
- }
- /* 添加 loading 相关样式 */
- .loading-container {
- display: flex;
- flex-direction: column;
- align-items: center;
- margin: 40rpx 0;
- }
- .loading-spinner {
- width: 60rpx;
- height: 60rpx;
- border: 4rpx solid #f3f3f3;
- border-top: 4rpx solid #003399;
- border-radius: 50%;
- animation: spin 1s linear infinite;
- margin-bottom: 20rpx;
- }
- .loading-text {
- font-size: 28rpx;
- color: #666;
- }
- @keyframes spin {
- 0% { transform: rotate(0deg); }
- 100% { transform: rotate(360deg); }
- }
- /* 修改按钮禁用状态样式 */
- .btn-retake:disabled, .btn-next:disabled {
- opacity: 0.5;
- cursor: not-allowed;
- }
- </style>
|