VSinerva/freesewing
1
0
Fork 0
Code Activity

feat(workbench): Show page count on layout

Browse source
This commit is contained in:
Joost De Cock 2022-02-20 19:29:14 +01:00
parent 99232fe020
commit a4906eac64
4 changed files with 24 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

7
packages/freesewing.shared/components/icons/print.js Normal file
View file

@ -0,0 +1,7 @@
const PrintIcon = props => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z" />
</svg>
)
export default PrintIcon

2
packages/freesewing.shared/components/workbench/layout/print/index.js
View file

@ -43,7 +43,7 @@ const PrintLayout = props => {
}
</h2>
<div className="m-4">
<Settings {...props} />
<Settings {...props} draft={draft}/>
</div>
<Draft
draft={draft}

3
packages/freesewing.shared/components/workbench/layout/print/plugin.js
View file

@ -68,7 +68,8 @@ const pagesPlugin = (size='a4', orientation='portrait') => ({
}
y += h
}
this.pages = { cols, rows, count: (cols+1)*(rows+1) }
// Store page count in part
this.pages = { cols, rows, count: cols*rows }
}
}
})

16
packages/freesewing.shared/components/workbench/layout/print/settings.js
View file

@ -1,18 +1,30 @@
import { useTranslation } from 'next-i18next'
import PageSizePicker from './pagesize-picker'
import OrientationPicker from './orientation-picker'
import PrintIcon from 'shared/components/icons/print'
import RightIcon from 'shared/components/icons/right'
const PrintLayoutSettings = props => {
const settingsProps = {
gist: props.gist,
updateGist: props.updateGist
}
const { cols, rows, count } = props.draft.parts.pages.pages
return (
<div className="flex flex-row gap-4 justify-center">
<div className="flex flex-row gap-8 justify-center">
<PageSizePicker {...props} />
<OrientationPicker {...props} />
<pre>{JSON.stringify(props.gist, null ,2)}</pre>
<div className="flex flex-row font-bold items-center px-0 text-xl">
<PrintIcon />
<span className="ml-2">{count}</span>
<span className="mx-6 opacity-50">|</span>
<RightIcon />
<span className="ml-2">{cols}</span>
<span className="mx-6 opacity-50">|</span>
<div className="rotate-90"><RightIcon /></div>
<span className="text-xl ml-2">{rows}</span>
</div>
</div>
)
}