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

[PUI] Add image based QR code assigment #7960

Merged
merged 13 commits into from
Aug 27, 2024

Conversation

matmair
Copy link
Member

@matmair matmair commented Aug 22, 2024

Follow up to #7939

This adds a button to scan codes for barcode linking.
I am not sure about the styling and would be thankful for feedback.

New look for barcode linking
grafik

Current look for general QR scans:
grafik

@matmair matmair added the Platform UI Related to the React based User Interface label Aug 22, 2024
@matmair matmair added this to the 0.17.0 milestone Aug 22, 2024
@matmair matmair self-assigned this Aug 22, 2024
Copy link

netlify bot commented Aug 22, 2024

Deploy Preview for inventree-web-pui-preview ready!

Name Link
🔨 Latest commit bea0b1c
🔍 Latest deploy log https://app.netlify.com/sites/inventree-web-pui-preview/deploys/66ccc1946e52e20008376790
😎 Deploy Preview https://deploy-preview-7960--inventree-web-pui-preview.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 100 (no change from production)
Accessibility: 86 (no change from production)
Best Practices: 92 (no change from production)
SEO: 70 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

codecov bot commented Aug 22, 2024

Codecov Report

Attention: Patch coverage is 71.42857% with 2 lines in your changes missing coverage. Please review.

Project coverage is 83.51%. Comparing base (58f60d1) to head (bea0b1c).
Report is 23 commits behind head on master.

Files Patch % Lines
src/frontend/src/components/items/QRCode.tsx 66.66% 1 Missing and 1 partial ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##           master    #7960      +/-   ##
==========================================
- Coverage   83.60%   83.51%   -0.10%     
==========================================
  Files        1136     1140       +4     
  Lines       50905    51009     +104     
  Branches     1758     1776      +18     
==========================================
+ Hits        42560    42600      +40     
- Misses       7899     7950      +51     
- Partials      446      459      +13     
Flag Coverage Δ
pui 64.82% <71.42%> (-0.34%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@wolflu05
Copy link
Contributor

wolflu05 commented Aug 22, 2024

This already looks pretty good. I like that there is a select to use a different camera (this is pretty useful in safari to use the iPhone camera as a scanner).

I have to suggestions to improve the design.

  1. make the stop button as high as the input field (I think there is an extra size type for the action button in mantine for this
  2. make the input at the bottom full width and add the icon to the inputs left section.

Maybe this component can be also used later for the related model field to just input barcode data there.

image

@matmair
Copy link
Member Author

matmair commented Aug 26, 2024

I have adapted it to this:
grafik
Should we use this setup for all scanning purposes?

@matmair
Copy link
Member Author

matmair commented Aug 26, 2024

Ready for review and merge if @wolflu05 is happy

@SchrodingersGat
Copy link
Member

@matmair looks good to me!

Copy link
Contributor

@wolflu05 wolflu05 left a comment

Choose a reason for hiding this comment

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

Thanks for the design adjustments. It looks great now.

@SchrodingersGat SchrodingersGat merged commit 313cb47 into inventree:master Aug 27, 2024
26 checks passed
@SchrodingersGat SchrodingersGat deleted the add-image-scan branch August 27, 2024 07:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Platform UI Related to the React based User Interface
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants