deadcxap/liberama
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Работа над SettingsPage

Browse Source
This commit is contained in:
Book Pauk
2019-01-28 13:54:46 +07:00
parent 11be4bf0d2
commit c97d13e7f2
1 changed files with 43 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
client/components/Reader/SettingsPage/SettingsPage.vue
View File

@@ -6,8 +6,9 @@
Настройки Настройки
</template> </template>
<el-tabs type="border-card" tab-position="left" style="height: 100%;" v-model="selectedTab"> <el-tabs class="tabs" type="border-card" tab-position="left" v-model="selectedTab">
<el-tab-pane label="Вид"> <el-tab-pane label="Вид">
<el-form :model="form" size="small" label-width="120px"> <el-form :model="form" size="small" label-width="120px">
<div class="partHeader">Цвет</div> <div class="partHeader">Цвет</div>
@@ -28,13 +29,11 @@
<el-form-item label="Локальный/веб"> <el-form-item label="Локальный/веб">
<el-col :span="10"> <el-col :span="10">
<el-select v-model="fontName" placeholder="Шрифт" :disabled="webFontName != ''"> <el-select v-model="fontName" placeholder="Шрифт" :disabled="webFontName != ''">
<el-option label="По-умолчанию" value="ReaderDefault"></el-option> <el-option v-for="item in fonts"
<el-option label="BPG Arial" value="GEO_1"></el-option> :key="item.name"
<el-option value="Avrile"></el-option> :label="item.label"
<el-option value="Arimo"></el-option> :value="item.name">
<el-option value="Roboto"></el-option> </el-option>
<el-option value="OpenSans"></el-option>
<el-option value="Rubik"></el-option>
</el-select> </el-select>
</el-col> </el-col>
<el-col :span="1"> <el-col :span="1">
@@ -66,12 +65,34 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-form :model="form" size="mini" label-width="100px"> <el-form :model="form" size="mini" label-width="120px">
<div class="partHeader">Текст</div> <div class="partHeader">Текст</div>
<el-form-item label="Интервал">
<el-input-number v-model="lineInterval" :min="0" :max="100"></el-input-number>
</el-form-item>
<el-form-item label="Параграф">
<el-input-number v-model="p" :min="0" :max="200"></el-input-number>
</el-form-item>
<el-form-item label="Выравнивание">
<el-checkbox v-model="textAlignJustify">По ширине</el-checkbox>
<el-checkbox v-model="wordWrap">Перенос по слогам</el-checkbox>
</el-form-item>
</el-form> </el-form>
<el-form :model="form" size="mini" label-width="100px"> <el-form :model="form" size="mini" label-width="120px">
<div class="partHeader">Строка статуса</div> <div class="partHeader">Строка статуса</div>
<el-form-item label="Статус">
<el-checkbox v-model="showStatusBar">Показывать</el-checkbox>
<el-checkbox v-model="statusBarTop" :disabled="!showStatusBar">Вверху/внизу</el-checkbox>
</el-form-item>
<el-form-item label="Высота">
<el-input-number v-model="statusBarHeight" :min="5" :max="50" :disabled="!showStatusBar"></el-input-number>
</el-form-item>
<el-form-item label="Прозрачность">
<el-input-number v-model="statusBarColorAlpha" :min="0" :max="1" :precision="2" :step="0.1" :disabled="!showStatusBar"></el-input-number>
</el-form-item>
</el-form> </el-form>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="Листание"> <el-tab-pane label="Листание">
@@ -80,6 +101,7 @@
<el-tab-pane label="Другое"> <el-tab-pane label="Другое">
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</Window> </Window>
</div> </div>
@@ -251,4 +273,15 @@ class SettingsPage extends Vue {
font-weight: bold; font-weight: bold;
margin-bottom: 5px; margin-bottom: 5px;
} }
.tabs {
flex: 1;
display: flex;
}
.el-tab-pane {
height: 100%;
overflow-y: auto;
}
</style> </style>