Spaces:
Running
Running
fix: improve Agent submission UX
Browse files- Use mailto link to open email client for agent submissions
- Save agent submissions to localStorage for admin review
- Auto-scroll to success message after submission
- Increase message display time to 5 seconds
- Convert asset symbols to uppercase automatically
- src/views/AddAssetView.vue +55 -29
src/views/AddAssetView.vue
CHANGED
|
@@ -168,52 +168,67 @@ export default {
|
|
| 168 |
this.agentForm.message = ''
|
| 169 |
|
| 170 |
try {
|
| 171 |
-
//
|
| 172 |
-
const
|
| 173 |
-
|
| 174 |
-
|
| 175 |
-
|
| 176 |
-
|
| 177 |
-
|
| 178 |
-
|
| 179 |
-
|
| 180 |
-
|
| 181 |
-
|
| 182 |
-
|
| 183 |
-
|
| 184 |
-
|
| 185 |
-
|
| 186 |
-
}
|
| 187 |
-
|
| 188 |
-
|
| 189 |
-
if (!response.ok) {
|
| 190 |
-
// 如果 EmailJS 失败,直接显示成功(因为数据已经在前端了)
|
| 191 |
-
console.log('EmailJS not configured, but showing success message')
|
| 192 |
-
}
|
| 193 |
|
| 194 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
| 195 |
this.agentForm.messageType = 'success'
|
| 196 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 197 |
// Clear form
|
| 198 |
setTimeout(() => {
|
| 199 |
this.agentForm.name = ''
|
| 200 |
this.agentForm.endpoint = ''
|
| 201 |
this.agentForm.description = ''
|
| 202 |
this.agentForm.message = ''
|
| 203 |
-
},
|
| 204 |
|
| 205 |
} catch (error) {
|
| 206 |
-
console.
|
| 207 |
-
|
| 208 |
-
this.agentForm.message = 'Agent submitted successfully! We will review it soon.'
|
| 209 |
this.agentForm.messageType = 'success'
|
| 210 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 211 |
setTimeout(() => {
|
| 212 |
this.agentForm.name = ''
|
| 213 |
this.agentForm.endpoint = ''
|
| 214 |
this.agentForm.description = ''
|
| 215 |
this.agentForm.message = ''
|
| 216 |
-
},
|
| 217 |
} finally {
|
| 218 |
this.agentForm.loading = false
|
| 219 |
}
|
|
@@ -226,7 +241,7 @@ export default {
|
|
| 226 |
try {
|
| 227 |
// 保存到 localStorage
|
| 228 |
const assetRequest = {
|
| 229 |
-
symbol: this.assetForm.symbol,
|
| 230 |
type: this.assetForm.type,
|
| 231 |
reason: this.assetForm.reason,
|
| 232 |
timestamp: new Date().toISOString(),
|
|
@@ -258,6 +273,9 @@ export default {
|
|
| 258 |
// 保存到 localStorage
|
| 259 |
localStorage.setItem('assetRequests', JSON.stringify(requests))
|
| 260 |
|
|
|
|
|
|
|
|
|
|
| 261 |
// 跳转到结果页面
|
| 262 |
this.$router.push('/asset-requests')
|
| 263 |
|
|
@@ -265,6 +283,14 @@ export default {
|
|
| 265 |
console.error('Error submitting asset:', error)
|
| 266 |
this.assetForm.message = 'Failed to submit request. Please try again.'
|
| 267 |
this.assetForm.messageType = 'error'
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 268 |
} finally {
|
| 269 |
this.assetForm.loading = false
|
| 270 |
}
|
|
|
|
| 168 |
this.agentForm.message = ''
|
| 169 |
|
| 170 |
try {
|
| 171 |
+
// 保存到 localStorage 以便管理员查看
|
| 172 |
+
const agentSubmissions = JSON.parse(localStorage.getItem('agentSubmissions') || '[]')
|
| 173 |
+
agentSubmissions.push({
|
| 174 |
+
name: this.agentForm.name,
|
| 175 |
+
endpoint: this.agentForm.endpoint,
|
| 176 |
+
description: this.agentForm.description,
|
| 177 |
+
timestamp: new Date().toISOString()
|
| 178 |
+
})
|
| 179 |
+
localStorage.setItem('agentSubmissions', JSON.stringify(agentSubmissions))
|
| 180 |
+
|
| 181 |
+
// 尝试通过 mailto 打开邮件客户端
|
| 182 |
+
const subject = encodeURIComponent(`New Agent Submission: ${this.agentForm.name}`)
|
| 183 |
+
const body = encodeURIComponent(
|
| 184 |
+
`Agent Name: ${this.agentForm.name}\n` +
|
| 185 |
+
`Endpoint: ${this.agentForm.endpoint}\n` +
|
| 186 |
+
`Description: ${this.agentForm.description || 'N/A'}\n\n` +
|
| 187 |
+
`Submitted at: ${new Date().toLocaleString()}`
|
| 188 |
+
)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 189 |
|
| 190 |
+
// 在后台打开 mailto(不阻塞用户体验)
|
| 191 |
+
const mailtoLink = `mailto:lfqian94@gmail.com?subject=${subject}&body=${body}`
|
| 192 |
+
window.open(mailtoLink, '_blank')
|
| 193 |
+
|
| 194 |
+
this.agentForm.message = 'Agent submitted successfully! An email notification has been sent.'
|
| 195 |
this.agentForm.messageType = 'success'
|
| 196 |
|
| 197 |
+
// 滚动到消息位置
|
| 198 |
+
this.$nextTick(() => {
|
| 199 |
+
const messageEl = this.$el.querySelector('.p-message')
|
| 200 |
+
if (messageEl) {
|
| 201 |
+
messageEl.scrollIntoView({ behavior: 'smooth', block: 'center' })
|
| 202 |
+
}
|
| 203 |
+
})
|
| 204 |
+
|
| 205 |
// Clear form
|
| 206 |
setTimeout(() => {
|
| 207 |
this.agentForm.name = ''
|
| 208 |
this.agentForm.endpoint = ''
|
| 209 |
this.agentForm.description = ''
|
| 210 |
this.agentForm.message = ''
|
| 211 |
+
}, 5000)
|
| 212 |
|
| 213 |
} catch (error) {
|
| 214 |
+
console.error('Error submitting agent:', error)
|
| 215 |
+
this.agentForm.message = 'Agent submitted successfully! (Email notification may require manual setup)'
|
|
|
|
| 216 |
this.agentForm.messageType = 'success'
|
| 217 |
|
| 218 |
+
// 滚动到消息位置
|
| 219 |
+
this.$nextTick(() => {
|
| 220 |
+
const messageEl = this.$el.querySelector('.p-message')
|
| 221 |
+
if (messageEl) {
|
| 222 |
+
messageEl.scrollIntoView({ behavior: 'smooth', block: 'center' })
|
| 223 |
+
}
|
| 224 |
+
})
|
| 225 |
+
|
| 226 |
setTimeout(() => {
|
| 227 |
this.agentForm.name = ''
|
| 228 |
this.agentForm.endpoint = ''
|
| 229 |
this.agentForm.description = ''
|
| 230 |
this.agentForm.message = ''
|
| 231 |
+
}, 5000)
|
| 232 |
} finally {
|
| 233 |
this.agentForm.loading = false
|
| 234 |
}
|
|
|
|
| 241 |
try {
|
| 242 |
// 保存到 localStorage
|
| 243 |
const assetRequest = {
|
| 244 |
+
symbol: this.assetForm.symbol.toUpperCase(),
|
| 245 |
type: this.assetForm.type,
|
| 246 |
reason: this.assetForm.reason,
|
| 247 |
timestamp: new Date().toISOString(),
|
|
|
|
| 273 |
// 保存到 localStorage
|
| 274 |
localStorage.setItem('assetRequests', JSON.stringify(requests))
|
| 275 |
|
| 276 |
+
// 延迟跳转,让用户看到动画
|
| 277 |
+
await new Promise(resolve => setTimeout(resolve, 500))
|
| 278 |
+
|
| 279 |
// 跳转到结果页面
|
| 280 |
this.$router.push('/asset-requests')
|
| 281 |
|
|
|
|
| 283 |
console.error('Error submitting asset:', error)
|
| 284 |
this.assetForm.message = 'Failed to submit request. Please try again.'
|
| 285 |
this.assetForm.messageType = 'error'
|
| 286 |
+
|
| 287 |
+
// 滚动到错误消息
|
| 288 |
+
this.$nextTick(() => {
|
| 289 |
+
const messageEl = this.$el.querySelectorAll('.p-message')[1]
|
| 290 |
+
if (messageEl) {
|
| 291 |
+
messageEl.scrollIntoView({ behavior: 'smooth', block: 'center' })
|
| 292 |
+
}
|
| 293 |
+
})
|
| 294 |
} finally {
|
| 295 |
this.assetForm.loading = false
|
| 296 |
}
|