This commit is contained in:
2020-04-16 23:26:20 +00:00
parent 5baa20907f
commit 5ef861a277

View File

@@ -22,32 +22,64 @@
> >
<div v-if="!editMode" v-html="compiledOutput()"></div> <div v-if="!editMode" v-html="compiledOutput()"></div>
<div v-if="editMode"> <div v-if="editMode">
<v-row> <template v-if="tabView">
<v-col cols="6"> <v-tabs>
<div> <v-tab>Edit</v-tab>
<v-btn tile> <v-icon>fa-bold</v-icon></v-btn> <v-tab>View</v-tab>
<v-btn tile> <v-icon>fa-italic</v-icon></v-btn> <v-tab-item>
<v-btn tile> <v-icon>fa-strikethrough</v-icon></v-btn> <div>
<v-btn tile> <v-icon>fa-heading</v-icon></v-btn> <v-btn tile> <v-icon>fa-bold</v-icon></v-btn>
<v-btn tile> <v-icon>fa-minus</v-icon></v-btn> <v-btn tile> <v-icon>fa-italic</v-icon></v-btn>
<v-btn tile> <v-icon>fa-quote-left</v-icon></v-btn> <v-btn tile> <v-icon>fa-strikethrough</v-icon></v-btn>
<v-btn tile> <v-icon>fa-list-ul</v-icon></v-btn> <v-btn tile> <v-icon>fa-heading</v-icon></v-btn>
<v-btn tile> <v-icon>fa-list-ol</v-icon></v-btn> <v-btn tile> <v-icon>fa-minus</v-icon></v-btn>
<v-btn tile> <v-icon>fa-check-square</v-icon></v-btn> <v-btn tile> <v-icon>fa-quote-left</v-icon></v-btn>
<v-btn tile> <v-icon>fa-table</v-icon></v-btn> <v-btn tile> <v-icon>fa-list-ul</v-icon></v-btn>
<v-btn tile> <v-icon>fa-link</v-icon></v-btn> <v-btn tile> <v-icon>fa-list-ol</v-icon></v-btn>
<v-btn tile> <v-icon>fa-image</v-icon></v-btn> <v-btn tile> <v-icon>fa-check-square</v-icon></v-btn>
<v-btn tile> <v-icon>fa-table</v-icon></v-btn>
<v-btn tile> <v-icon>fa-link</v-icon></v-btn>
<v-btn tile> <v-icon>fa-image</v-icon></v-btn>
<v-btn tile> <v-icon>fa-code</v-icon></v-btn> <v-btn tile> <v-icon>fa-code</v-icon></v-btn>
<v-btn tile> <v-icon>fa-square-full</v-icon></v-btn> <v-btn tile> <v-icon>fa-square-full</v-icon></v-btn>
<v-btn tile> <v-icon>fa-columns</v-icon></v-btn> <v-btn tile> <v-icon>fa-columns</v-icon></v-btn>
</div> </div>
<v-textarea v-model="value" auto-grow></v-textarea> <v-textarea v-model="value" auto-grow></v-textarea
</v-col> ></v-tab-item>
<v-col cols="6"> <v-tab-item
<div class="aywiki" v-html="compiledOutput()"></div> ><div class="aywiki" v-html="compiledOutput()"></div
</v-col> ></v-tab-item>
</v-row> </v-tabs>
</template>
<template v-else>
<v-row>
<v-col cols="6">
<div>
<v-btn elevation="0" tile> <v-icon>fa-bold</v-icon></v-btn>
<v-btn elevation="0" tile> <v-icon>fa-italic</v-icon></v-btn>
<v-btn elevation="0" tile> <v-icon>fa-strikethrough</v-icon></v-btn>
<v-btn tile> <v-icon>fa-heading</v-icon></v-btn>
<v-btn tile> <v-icon>fa-minus</v-icon></v-btn>
<v-btn tile> <v-icon>fa-quote-left</v-icon></v-btn>
<v-btn tile> <v-icon>fa-list-ul</v-icon></v-btn>
<v-btn tile outlined> <v-icon>fa-list-ol</v-icon></v-btn>
<v-btn tile outlined> <v-icon>fa-check-square</v-icon></v-btn>
<v-btn tile outlined> <v-icon>fa-table</v-icon></v-btn>
<v-btn tile> <v-icon>fa-link</v-icon></v-btn>
<v-btn tile> <v-icon>fa-image</v-icon></v-btn>
<v-btn tile> <v-icon>fa-code</v-icon></v-btn>
<v-btn tile> <v-icon>fa-square-full</v-icon></v-btn>
<v-btn tile> <v-icon>fa-columns</v-icon></v-btn>
</div>
<v-textarea v-model="value" auto-grow></v-textarea>
</v-col>
<v-col cols="6">
<div class="aywiki" v-html="compiledOutput()"></div>
</v-col>
</v-row>
</template>
</div> </div>
</v-sheet> </v-sheet>
</div> </div>
@@ -59,7 +91,8 @@ export default {
data() { data() {
return { return {
wikiVisible: true, wikiVisible: true,
editMode: true editMode: true,
tabView: false
}; };
}, },
props: { props: {
@@ -79,6 +112,9 @@ export default {
/** /**
todo: todo:
try to make view without using tab control
- user picks view in toolbar from choices of split, design or result view and toggles when they select these choices
Show/hide/edit control Show/hide/edit control
eyeball icon like password reveal eyeball icon like password reveal