diff --git a/src/views/public/CommentGenerator.vue b/src/views/public/CommentGenerator.vue index 3b74b32..2c00ce8 100644 --- a/src/views/public/CommentGenerator.vue +++ b/src/views/public/CommentGenerator.vue @@ -1,33 +1,165 @@ @@ -35,14 +167,48 @@ export default { name: 'CommentGeneratorPublic', data() { - return { form: { productType: '' }, loading: false, result: null, typeOptions: [], comments: [] } + return { + form: { productType: '' }, + loading: false, + result: null, + typeOptions: [], + comments: [], + statistics: null, + lastGenerateTime: 0, + cooldownTime: 5000, // 5秒冷却时间 + isButtonDisabled: false + } }, computed: { pretty() { try { return this.result ? JSON.stringify(this.result, null, 2) : '' } catch(e) { return '' } + }, + isGenerateButtonDisabled() { + // 如果正在加载、手动禁用、没有选择产品类型,或者在冷却时间内,则禁用按钮 + return this.loading || + this.isButtonDisabled || + !this.form.productType || + (Date.now() - this.lastGenerateTime < this.cooldownTime && this.lastGenerateTime > 0) + }, + remainingCooldownTime() { + if (this.lastGenerateTime === 0) return 0 + const remaining = Math.max(0, this.cooldownTime - (Date.now() - this.lastGenerateTime)) + return Math.ceil(remaining / 1000) + } + }, + mounted() { + this.loadTypes() + // 启动定时器更新冷却时间显示 + this.cooldownTimer = setInterval(() => { + // 强制更新计算属性 + this.$forceUpdate() + }, 1000) + }, + beforeDestroy() { + if (this.cooldownTimer) { + clearInterval(this.cooldownTimer) } }, - mounted() { this.loadTypes() }, methods: { async loadTypes() { try { @@ -55,23 +221,81 @@ export default { } catch(e) {} }, async generate() { - if (!this.form.productType) { this.$message.error('请选择型号'); return } + // 检查按钮是否被禁用 + if (this.isGenerateButtonDisabled) { + if (this.remainingCooldownTime > 0) { + this.$message.warning(`请等待 ${this.remainingCooldownTime} 秒后再试`) + } else if (!this.form.productType) { + this.$message.error('请选择型号') + } + return + } + + // 记录点击时间 + this.lastGenerateTime = Date.now() this.loading = true + this.isButtonDisabled = false + try { - const res = await this.$axios({ url: '/public/comment/generate', method: 'post', data: { productType: this.form.productType } }) + const res = await this.$axios({ + url: '/public/comment/generate', + method: 'post', + data: { productType: this.form.productType }, + timeout: 30000 // 30秒超时 + }) + this.loading = false + if (res && (res.code === 200 || res.msg === '操作成功')) { this.result = res.data - // 结果渲染 + + // 检查是否有有效数据 const list = (res.data && res.data.list && Array.isArray(res.data.list)) ? res.data.list : [] + + if (list.length === 0) { + this.$message.warning('接口返回数据为空,请稍后重试') + this.isButtonDisabled = true + // 10秒后重新启用按钮 + setTimeout(() => { + this.isButtonDisabled = false + }, 10000) + return + } + + // 结果渲染 this.comments = list.map(it => ({ commentText: (it && it.commentText) ? it.commentText : '', images: Array.isArray(it && it.images) ? it.images : [] })) + + // 解析统计信息 + this.statistics = res.data && res.data.statistics ? res.data.statistics : null + + this.$message.success('评论生成成功') } else { this.$message.error(res && res.msg ? res.msg : '生成失败') + this.isButtonDisabled = true + // 5秒后重新启用按钮 + setTimeout(() => { + this.isButtonDisabled = false + }, 5000) } - } catch(e) { this.loading = false; this.$message.error('生成失败') } + } catch(e) { + this.loading = false + console.error('生成评论失败:', e) + + if (e.code === 'ECONNABORTED') { + this.$message.error('请求超时,请检查网络连接') + } else { + this.$message.error('生成失败,请稍后重试') + } + + this.isButtonDisabled = true + // 5秒后重新启用按钮 + setTimeout(() => { + this.isButtonDisabled = false + }, 5000) + } }, copy(text) { if (!text) return @@ -82,12 +306,577 @@ export default { try { document.execCommand('copy'); this.$message.success('已复制') } catch(e) { this.$message.error('复制失败') } document.body.removeChild(ta) } + }, + getUsagePercentage() { + if (!this.statistics || !this.statistics.total || this.statistics.total === 0) { + return 0 + } + const used = this.statistics.used || 0 + const total = this.statistics.total + return Math.round((used / total) * 100) + }, + getButtonText() { + if (this.loading) { + return '生成中...' + } + if (this.remainingCooldownTime > 0) { + return `等待中 (${this.remainingCooldownTime}s)` + } + if (this.isButtonDisabled) { + return '暂时禁用' + } + if (!this.form.productType) { + return '请先选择型号' + } + return '生成评论' } } }