Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

后台优化(批量上传/适配移动端/样式优化) #201

Merged
merged 111 commits into from
Dec 4, 2024

Conversation

DJChanahCJD
Copy link
Contributor

@DJChanahCJD DJChanahCJD commented Oct 21, 2024

只修改了admin-imgtc.html,具体更新内容:

批量上传

  • 将批量上传功能整合至stats组件,调用/upload API,支持一次上传多个文件,最大并发数为3。目前测试上传11张图片成功。
  • 上传成功后自动通过GET请求更新卡片列表,用户无需再手动访问图片链接即可更新后台数据。
  • 上传前会检查文件类型和大小(不超过5MB的图片或视频),上传失败时将弹出提示框显示失败的文件

移动端适配

  • 屏幕宽度小于768px时改为单列显示,隐藏搜索栏
  • 每页显示15张图片(设置的单页最少图片数)

样式改进

  • 调整组件大小和位置,新增带GitHub仓库链接的页脚

  • 改进分页逻辑,用户可通过缩放改变单页图片数,以快速浏览更多图片


另外,想请教一下增加收藏夹功能是否可行。

list.js请忽略,commit较多是由于频繁部署调试)

示例图:
image
Screenshot_2024-10-22-10-51-33-316_com.mmbox.xbrowser.pro.jpg

@DJChanahCJD DJChanahCJD changed the title 后台增加批量上传功能、适配不同缩放比例(含移动端)、优化部分样式 后台优化(批量上传/适配移动端/样式优化) Oct 21, 2024
@cf-pages cf-pages requested review from xyTom and cf-pages October 21, 2024 15:22
@DJChanahCJD
Copy link
Contributor Author

发现的一个问题:昨天批量上传且能够正确访问的图片,今天全404了,不知道是什么原因。

@DJChanahCJD
Copy link
Contributor Author

发现的一个问题:昨天批量上传且能够正确访问的图片,今天全404了,不知道是什么原因。

我在我自己那里又新加了收藏功能,主要是在metadata数据中新增了一个 liked: boolean 属性。 不过,如果新上传的图片无法保存的话,应该不会再做更新了。

@xyTom xyTom requested a review from Copilot December 1, 2024 14:34
Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot reviewed 3 out of 4 changed files in this pull request and generated 2 suggestions.

Files not reviewed (1)
  • admin-imgtc.html: Language not supported
Comments skipped due to low confidence (1)

functions/api/manage/toggleLike/[id].js:7

  • [nitpick] The variable name value is not descriptive. Suggest renaming it to record for better clarity.
const value = await env.img_url.getWithMetadata(params.id);

functions/api/manage/toggleLike/[id].js Outdated Show resolved Hide resolved
export async function onRequest(context) {
const { params, env } = context;

console.log("Request ID:", params.id);
Copy link
Preview

Copilot AI Dec 1, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider removing or replacing console.log statements with a proper logging mechanism before deploying to production.

Suggested change
console.log("Request ID:", params.id);
logger.info("Request ID:", params.id);

Copilot is powered by AI, so mistakes are possible. Review output carefully before use.

Positive Feedback
Negative Feedback

Provide additional feedback

Please help us improve GitHub Copilot by sharing more details about this comment.

Please select one or more of the options
* feat: upload using tg bot api and improve file handling

* fix: adjust the path length

* chore: Update "ci-test" script to include "--exit" flag in package.json

* feat: 支持根据文件类型选择合适的上传方式,优化上传功能

* docs: 更新README文档,添加Telegram Bot Token和Chat ID获取指南

---------

Co-authored-by: xyTom <75466119+xyTom@users.noreply.github.com>
@cf-pages
Copy link
Owner

cf-pages commented Dec 1, 2024

发现的一个问题:昨天批量上传且能够正确访问的图片,今天全404了,不知道是什么原因。

我在我自己那里又新加了收藏功能,主要是在metadata数据中新增了一个 liked: boolean 属性。 不过,如果新上传的图片无法保存的话,应该不会再做更新了。

项目已更新,采用新的tg channel的上传方式,应该能够解决长期保存的问题

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
@xyTom xyTom requested a review from Copilot December 4, 2024 17:20
Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot reviewed 7 out of 9 changed files in this pull request and generated 1 suggestion.

Files not reviewed (2)
  • admin.html: Language not supported
  • package.json: Language not supported
Comments skipped due to low confidence (2)

functions/upload.js:55

  • The getFileId function can return null, which is not handled in the calling code. Add a check for null to handle this case gracefully.
const fileId = getFileId(responseData);

functions/file/[id].js:131

  • Add error handling in the getFilePath function to handle errors gracefully.
return null;

console.log("Request ID:", params.id);

// 获取元数据
const value = await env.img_url.getWithMetadata(params.id);
Copy link
Preview

Copilot AI Dec 4, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add a check to handle the case where value is null.

Suggested change
const value = await env.img_url.getWithMetadata(params.id);
if (!value) return new Response(`Image not found for ID: ${params.id}`, { status: 404 });

Copilot is powered by AI, so mistakes are possible. Review output carefully before use.

Positive Feedback
Negative Feedback

Provide additional feedback

Please help us improve GitHub Copilot by sharing more details about this comment.

Please select one or more of the options
@cf-pages cf-pages merged commit c94513c into cf-pages:main Dec 4, 2024
1 check passed
@cf-pages
Copy link
Owner

cf-pages commented Dec 4, 2024

已merge,感谢贡献高质量代码

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants