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>
|
||||
</SidebarBlock>
|
||||
|
||||
<div v-if="typeSelector == 'rus'">
|
||||
<SidebarBlock title="Вертикальные линии">
|
||||
<Input v-model="vMargin" :min="1">Отступ, мм</Input>
|
||||
<Input v-model="vRotation" :min="0" :max="359">Поворот, градусы</Input>
|
||||
<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 }}°
|
||||
</Button>
|
||||
</ButtonsBar>
|
||||
|
@ -67,7 +69,7 @@ const savePng = async () => {
|
|||
</SidebarBlock>
|
||||
|
||||
<SidebarBlock title="Поля">
|
||||
<Switch v-model="marginEnable"/>
|
||||
<Switch v-model="marginEnable" />
|
||||
<div v-if="marginEnable">
|
||||
<Input v-model="marginColor" :type="InputType.Color">
|
||||
Цвет {{ marginColor }}
|
||||
|
@ -75,9 +77,32 @@ const savePng = async () => {
|
|||
<Input v-model="marginLeftMargin" :min="1">Отступ слева, мм</Input>
|
||||
</div>
|
||||
</SidebarBlock>
|
||||
</div>
|
||||
</Sidebar>
|
||||
<Page>
|
||||
<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'"
|
||||
:click="() => { typeSelector = 'rus' }">Пропись</Button>
|
||||
<Button :size="ButtonSize.Small" :active="typeSelector == 'math'"
|
||||
|
@ -90,13 +115,9 @@ const savePng = async () => {
|
|||
<Input v-model="imageHeight" :min="1">Высота, мм</Input>
|
||||
<Input v-model="imageWidth" :min="1">Ширина, мм</Input>
|
||||
<ButtonsBar>
|
||||
<Button
|
||||
v-for="size in VARIANTS_IMAGE_SIZE"
|
||||
:key="size.name"
|
||||
:size="ButtonSize.Small"
|
||||
<Button 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"
|
||||
:click="() => store.setImageSize(size)"
|
||||
>
|
||||
:click="() => store.setImageSize(size)">
|
||||
{{ size.name }}
|
||||
</Button>
|
||||
<Button :size="ButtonSize.Small" :click="store.rotateImage">
|
||||
|
|
Loading…
Reference in New Issue