add templates
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
1d4b5380af
commit
f976829ba3
37
src/App.vue
37
src/App.vue
|
@ -51,11 +51,13 @@ 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>
|
||||||
|
|
||||||
|
<div v-if="typeSelector == 'rus'">
|
||||||
<SidebarBlock title="Вертикальные линии">
|
<SidebarBlock title="Вертикальные линии">
|
||||||
<Input v-model="vMargin" :min="1">Отступ, мм</Input>
|
<Input v-model="vMargin" :min="1">Отступ, мм</Input>
|
||||||
<Input v-model="vRotation" :min="0" :max="359">Поворот, градусы</Input>
|
<Input v-model="vRotation" :min="0" :max="359">Поворот, градусы</Input>
|
||||||
<ButtonsBar>
|
<ButtonsBar>
|
||||||
<Button v-for="deg in VARIANTS_VERTICAL_ROTATION" :key="deg" :active="vRotation == deg" :size="ButtonSize.Small" :click="() => store.setVRotation(deg)">
|
<Button v-for="deg in VARIANTS_VERTICAL_ROTATION" :key="deg" :active="vRotation == deg"
|
||||||
|
:size="ButtonSize.Small" :click="() => store.setVRotation(deg)">
|
||||||
{{ deg }}°
|
{{ deg }}°
|
||||||
</Button>
|
</Button>
|
||||||
</ButtonsBar>
|
</ButtonsBar>
|
||||||
|
@ -67,7 +69,7 @@ const savePng = async () => {
|
||||||
</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 }}
|
||||||
|
@ -75,9 +77,32 @@ const savePng = async () => {
|
||||||
<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">
|
||||||
|
|
Loading…
Reference in New Issue