VLADIMIR/lapsha
VLADIMIR
/
lapsha
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add templates
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Владимир Фёдоров 2023-09-24 16:18:57 +07:00
parent 1d4b5380af
commit f976829ba3
1 changed files with 49 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
src/App.vue
View File

@ -51,33 +51,58 @@ const savePng = async () => {
<Input v-model="imageBackgroundColor" :type="InputType.Color">Цвет {{ store.imageBackgroundColor }}</Input> <Input v-model="imageBackgroundColor" :type="InputType.Color">Цвет {{ store.imageBackgroundColor }}</Input>
</SidebarBlock> </SidebarBlock>
<SidebarBlock title="Вертикальные линии"> <div v-if="typeSelector == 'rus'">
<Input v-model="vMargin" :min="1">Отступ, мм</Input> <SidebarBlock title="Вертикальные линии">
<Input v-model="vRotation" :min="0" :max="359">Поворот, градусы</Input> <Input v-model="vMargin" :min="1">Отступ, мм</Input>
<ButtonsBar> <Input v-model="vRotation" :min="0" :max="359">Поворот, градусы</Input>
<Button v-for="deg in VARIANTS_VERTICAL_ROTATION" :key="deg" :active="vRotation == deg" :size="ButtonSize.Small" :click="() => store.setVRotation(deg)"> <ButtonsBar>
{{ deg }}° <Button v-for="deg in VARIANTS_VERTICAL_ROTATION" :key="deg" :active="vRotation == deg"
</Button> :size="ButtonSize.Small" :click="() => store.setVRotation(deg)">
</ButtonsBar> {{ deg }}°
</SidebarBlock> </Button>
</ButtonsBar>
</SidebarBlock>
<SidebarBlock title="Горизонтальные линии"> <SidebarBlock title="Горизонтальные линии">
<Input v-model="hMargin" :min="1">Отступ, мм</Input> <Input v-model="hMargin" :min="1">Отступ, мм</Input>
<Input v-model="hMargin2" :min="1">Дополнительный отступ, мм</Input> <Input v-model="hMargin2" :min="1">Дополнительный отступ, мм</Input>
</SidebarBlock> </SidebarBlock>
<SidebarBlock title="Поля"> <SidebarBlock title="Поля">
<Switch v-model="marginEnable"/> <Switch v-model="marginEnable" />
<div v-if="marginEnable"> <div v-if="marginEnable">
<Input v-model="marginColor" :type="InputType.Color"> <Input v-model="marginColor" :type="InputType.Color">
Цвет {{ marginColor }} Цвет {{ marginColor }}
</Input> </Input>
<Input v-model="marginLeftMargin" :min="1">Отступ слева, мм</Input> <Input v-model="marginLeftMargin" :min="1">Отступ слева, мм</Input>
</div> </div>
</SidebarBlock> </SidebarBlock>
</div>
</Sidebar> </Sidebar>
<Page> <Page>
<div id="typeSelector"> <div id="typeSelector">
<Button :size="ButtonSize.Small"
:active="typeSelector == 'rus' && vRotation == 65 && vMargin == 15 && hMargin == 40 && hMargin2 == 20 && imageWidth == 210 && imageHeight == 297"
:click="() => {
typeSelector = 'rus';
vRotation = 65;
vMargin = 15;
hMargin = 40;
hMargin2 = 20;
imageWidth = 210;
imageHeight = 297;
}">Тетрадь в линию</Button>
<Button :size="ButtonSize.Small"
:active="typeSelector == 'rus' && vRotation == 90 && vMargin == 30 && hMargin == 30 && hMargin2 == 30 && imageWidth == 210 && imageHeight == 297"
:click="() => {
typeSelector = 'rus';
vRotation = 90;
vMargin = 30;
hMargin = 30;
hMargin2 = 30;
imageWidth = 210;
imageHeight = 297;
}">Тетрадь в клетку</Button>
<Button :size="ButtonSize.Small" :active="typeSelector == 'rus'" <Button :size="ButtonSize.Small" :active="typeSelector == 'rus'"
:click="() => { typeSelector = 'rus' }">Пропись</Button> :click="() => { typeSelector = 'rus' }">Пропись</Button>
<Button :size="ButtonSize.Small" :active="typeSelector == 'math'" <Button :size="ButtonSize.Small" :active="typeSelector == 'math'"
@ -90,13 +115,9 @@ const savePng = async () => {
<Input v-model="imageHeight" :min="1">Высота, мм</Input> <Input v-model="imageHeight" :min="1">Высота, мм</Input>
<Input v-model="imageWidth" :min="1">Ширина, мм</Input> <Input v-model="imageWidth" :min="1">Ширина, мм</Input>
<ButtonsBar> <ButtonsBar>
<Button <Button v-for=" size in VARIANTS_IMAGE_SIZE " :key="size.name" :size="ButtonSize.Small"
v-for="size in VARIANTS_IMAGE_SIZE"
:key="size.name"
:size="ButtonSize.Small"
:active="imageWidth == size.width && imageHeight == size.height || imageWidth == size.height && imageHeight == size.width" :active="imageWidth == size.width && imageHeight == size.height || imageWidth == size.height && imageHeight == size.width"
:click="() => store.setImageSize(size)" :click="() => store.setImageSize(size)">
>
{{ size.name }} {{ size.name }}
</Button> </Button>
<Button :size="ButtonSize.Small" :click="store.rotateImage"> <Button :size="ButtonSize.Small" :click="store.rotateImage">