2021-03-04 13:27:07 +13:00
< template >
< q-layout view = "hHh LpR lfr" >
2021-04-28 13:06:41 +12:00
<!-- Repair project dialog -- >
< repairProjectDialog
: dialog - trigger = "repairProjectDialogTrigger"
@ trigger - dialog - close = "repairProjectDialogClose"
/ >
2021-05-08 01:57:16 +12:00
< q-dialog v-model = "pre017check" seamless position="bottom" >
2021-04-28 13:06:41 +12:00
< q-card style = "width: 100vw; min-width: 100vw;" dark class = "text-accent bg-secondary" >
< q-card-section class = "row items-center no-wrap justify-center" >
< div >
2021-05-08 01:57:16 +12:00
If you are working with a pre - 0.1 .7 version project , then please < span class = "q-mx-lg" > < q-btn outline label = "Repair your project" color = "accent" @click ="repairProjectAssignUID" / > < / span >
2021-04-28 13:06:41 +12:00
< / div >
2021-05-08 01:57:16 +12:00
< q-btn outline round icon = "close" v -close -popup @click ="close017Notification" class = "notifClose" / >
2021-04-28 13:06:41 +12:00
< / q-card-section >
< / q-card >
< / q-dialog >
2021-03-04 13:27:07 +13:00
<!-- Header -- >
2021-04-03 12:33:49 +13:00
< appHeader / >
2021-03-04 13:27:07 +13:00
2021-03-18 10:26:08 +13:00
< q-splitter
v - model = "splitterModel"
unit = "px"
emit - immediately
2021-06-07 12:57:36 +12:00
: class = "{splitterClass, 'splitterHidden': (hideHierarchyTree || SGET_getDocumentPreviewVisible !== '')}"
2021-03-18 10:26:08 +13:00
@ input = "onChange"
2021-04-21 02:51:43 +12:00
: limits = "[limiterWidth, Infinity]"
2021-03-18 10:26:08 +13:00
class = "pageSplitter"
2021-03-04 13:27:07 +13:00
>
2021-04-21 02:51:43 +12:00
< template
v - if = "!hideHierarchyTree"
# before >
2021-03-18 10:26:08 +13:00
<!-- Left drawer -- >
< q-drawer
content - class = "bg-dark text-cultured sideWrapper"
v - model = "leftDrawerOpen"
side = "left"
2021-04-06 01:28:33 +12:00
: width = "splitterModel"
2021-03-18 10:26:08 +13:00
: breakpoint = "0"
show - if - above
>
2021-04-21 02:51:43 +12:00
< objectTree
/ >
2021-03-18 10:26:08 +13:00
< / q-drawer >
< / template >
< template # after >
< q-page-container :style = "compPadding" >
< documentControl / >
< transition
enter - active - class = "animated fadeIn"
leave - active - class = "animated fadeOut"
appear
2021-04-03 12:33:49 +13:00
: duration = "50"
2021-03-18 10:26:08 +13:00
>
< router-view :key = "$route.path" / >
< / transition >
2021-05-15 05:06:58 +12:00
2021-05-15 11:35:18 +12:00
< q-page-sticky
style = "z-index: 1000;"
position = "top-right" : offset = "[18, 75]" >
2021-05-15 05:06:58 +12:00
< q-btn
icon = "mdi-book-search-outline"
color = "red-13"
fab
v - if = "legacyFieldsCheck"
@ click = "openLegacyDocuments"
>
< q-tooltip
: delay = "500"
anchor = "bottom middle"
self = "top middle"
>
Check for documents with legacy values
< / q-tooltip >
< / q-btn >
< / q-page-sticky >
2021-03-18 10:26:08 +13:00
< / q-page-container >
< / template >
< / q-splitter >
2021-03-04 13:27:07 +13:00
< / q-layout >
< / template >
< script lang = "ts" >
2021-03-18 10:26:08 +13:00
import { Component , Watch } from "vue-property-decorator"
2021-03-04 13:27:07 +13:00
import BaseClass from "src/BaseClass"
2021-04-26 09:01:41 +12:00
import PouchDB from "pouchdb"
2021-03-04 13:27:07 +13:00
import objectTree from "src/components/ObjectTree.vue"
import appHeader from "src/components/AppHeader.vue"
import documentControl from "src/components/DocumentControl.vue"
2021-04-21 08:25:44 +12:00
import { engageBlueprints , retrieveAllBlueprints } from "src/scripts/databaseManager/blueprintManager"
2021-04-28 13:06:41 +12:00
import repairProjectDialog from "src/components/dialogs/RepairProject.vue"
2021-03-04 13:27:07 +13:00
2021-03-18 10:26:08 +13:00
import { extend } from "quasar"
import { OptionsStateInteface } from "src/store/module-options/state"
2021-04-21 08:25:44 +12:00
import { I _Blueprint } from "src/interfaces/I_Blueprint"
2021-04-26 09:01:41 +12:00
import { I _ShortenedDocument } from "src/interfaces/I_OpenedDocument"
2021-03-18 10:26:08 +13:00
2021-03-04 13:27:07 +13:00
@ Component ( {
components : {
objectTree ,
appHeader ,
2021-04-28 13:06:41 +12:00
documentControl ,
repairProjectDialog
2021-03-04 13:27:07 +13:00
}
} )
export default class DocumentLayout extends BaseClass {
/****************************************************************/
2021-04-26 09:01:41 +12:00
// PROJECT SETTINGS FIRST LOAD
2021-03-04 13:27:07 +13:00
/****************************************************************/
2021-04-21 08:25:44 +12:00
/ * *
* Load all blueprints and build the tree out of them
* /
async created ( ) {
2021-04-26 09:01:41 +12:00
if ( this . SGET _allDocumentsFirstRunState ) {
await this . processBluePrints ( )
this . establishAllDocumentDatabases ( )
await this . loadAllProjectDocuments ( )
}
2021-04-21 08:25:44 +12:00
// Unfuck the rendering by giving the app some time to load first
await this . $nextTick ( )
}
/ * *
* Processes all blueprints and redies the store for population of the app
* /
async processBluePrints ( ) : Promise < void > {
await engageBlueprints ( )
const allObjectBlueprints = ( await retrieveAllBlueprints ( ) ) . rows . map ( ( blueprint ) => {
return blueprint . doc
2021-05-14 05:51:35 +12:00
} )
// @ts-ignore
. sort ( ( a : I _Blueprint , b : I _Blueprint ) => {
const order1 = a . order
const order2 = b . order
if ( order1 > order2 ) {
return - 1
}
if ( order1 < order2 ) {
return 1
}
return 0
} ) as I _Blueprint [ ]
2021-04-21 08:25:44 +12:00
this . SSET _allBlueprints ( allObjectBlueprints )
}
2021-04-26 09:01:41 +12:00
establishAllDocumentDatabases ( ) {
2021-05-02 02:31:33 +12:00
if ( ! window . FA _dbs ) {
// @ts-ignore
window . FA _dbs = { }
}
2021-04-26 09:01:41 +12:00
for ( const blueprint of this . SGET _allBlueprints ) {
window . FA _dbs [ blueprint . _id ] = new PouchDB ( blueprint . _id )
}
}
async loadAllProjectDocuments ( ) {
for ( const blueprint of this . SGET _allBlueprints ) {
2021-04-28 13:06:41 +12:00
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
2021-04-26 09:01:41 +12:00
const dbRows = await window . FA _dbs [ blueprint . _id ] . allDocs ( { include _docs : true } )
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
// eslint-disable-next-line
const dbDocuments = dbRows . rows . map ( ( d : any ) => d . doc )
const formattedDocuments : I _ShortenedDocument [ ] = [ ]
for ( const singleDocument of dbDocuments ) {
const doc = singleDocument as unknown as I _ShortenedDocument
const pushValue = this . mapShortDocument ( doc , dbDocuments )
formattedDocuments . push ( pushValue )
}
const sortedDocuments = formattedDocuments . sort ( ( a , b ) => a . label . localeCompare ( b . label ) )
this . SSET _mapNewDocumentType ( {
id : blueprint . _id ,
docs : sortedDocuments
} )
}
this . SSET _allDocumentsMarkAsNonFirstRun ( )
}
/****************************************************************/
// BASIC COMPONENT DATA
/****************************************************************/
/ * *
* Model for the left drawer of the app containing the hierarchical tree
* /
leftDrawerOpen = true
/ * *
* Width of the splitted model
* /
splitterModel = 375
2021-05-08 01:57:16 +12:00
pre017check = false
2021-04-28 13:06:41 +12:00
2021-04-26 09:01:41 +12:00
/ * *
* Special class for the splitter
* /
get splitterClass ( ) {
return ! this . leftDrawerOpen ? "splitt" : ""
}
2021-04-06 01:28:33 +12:00
/ * *
* Special padding reset for the main page
* /
get compPadding ( ) {
return this . leftDrawerOpen ? { paddingLeft : "0px" } : ""
}
2021-03-18 10:26:08 +13:00
2021-04-06 01:28:33 +12:00
/****************************************************************/
// LOCAL SETTINGS
/****************************************************************/
2021-03-18 10:26:08 +13:00
2021-04-06 01:28:33 +12:00
/ * *
* React to changes on the options store
* /
2021-03-18 10:26:08 +13:00
@ Watch ( "SGET_options" , { immediate : true , deep : true } )
onSettingsChange ( ) {
const options = this . SGET _options
2021-04-21 02:51:43 +12:00
this . hideHierarchyTree = options . hideHierarchyTree
2021-05-15 05:06:58 +12:00
this . legacyFieldsCheck = options . legacyFieldsCheck
2021-04-28 13:06:41 +12:00
// @ts-ignore
2021-05-08 01:57:16 +12:00
this . pre017check = options . pre017check
2021-04-28 13:06:41 +12:00
2021-06-07 12:57:36 +12:00
if ( this . SGET _getDocumentPreviewVisible === "" ) {
if ( options . treeWidth && ! this . hideHierarchyTree ) {
this . splitterModel = options . treeWidth
}
else {
this . splitterModel = 0
}
2021-04-21 02:51:43 +12:00
}
2021-03-18 10:26:08 +13:00
}
2021-05-15 05:06:58 +12:00
legacyFieldsCheck : boolean | undefined = true
2021-04-21 02:51:43 +12:00
get limiterWidth ( ) {
return ( ! this . hideHierarchyTree ) ? 374 : 0
}
hideHierarchyTree = false
2021-06-07 12:57:36 +12:00
@ Watch ( "SGET_getDocumentPreviewVisible" )
reactToPreviewVisibilityChange ( ) {
if ( this . SGET _getDocumentPreviewVisible !== "" && ! this . hideHierarchyTree ) {
this . splitterModel = 600
}
else if ( this . SGET _options . treeWidth && ! this . hideHierarchyTree ) {
this . splitterModel = this . SGET _options . treeWidth
}
}
2021-04-06 01:28:33 +12:00
/****************************************************************/
// OPTTION UPDATER
/****************************************************************/
2021-03-18 10:26:08 +13:00
2021-04-06 01:28:33 +12:00
/ * *
* Debounce timer to prevent infinite dragging
* /
2021-03-18 10:26:08 +13:00
pullTimer = null as any
2021-04-06 01:28:33 +12:00
/ * *
* Snapshop of the current settings in the store for further modification
* /
optionsSnapShot = { } as OptionsStateInteface
2021-05-08 01:57:16 +12:00
close017Notification ( ) {
2021-04-28 13:06:41 +12:00
this . optionsSnapShot = extend ( true , { } , this . SGET _options )
2021-05-08 01:57:16 +12:00
this . optionsSnapShot . pre017check = false
2021-04-28 13:06:41 +12:00
this . SSET _options ( this . optionsSnapShot )
}
2021-05-15 05:06:58 +12:00
openLegacyDocuments ( ) {
const legacyDocs = this . checkForLegacyDocuments ( )
legacyDocs . forEach ( doc => {
const dataPass = {
doc : doc ,
treeAction : false
}
// @ts-ignore
this . SSET _addOpenedDocument ( dataPass )
} )
if ( legacyDocs . length > 0 ) {
this . $q . notify ( {
group : false ,
type : "warning" ,
timeout : 0 ,
html : true ,
actions : [ { icon : "mdi-close" , color : "black" } ] ,
message : `
2021-06-07 12:57:36 +12:00
$ { legacyDocs . length } documents with legacy field values found and opened in your to tabs .
2021-05-15 05:06:58 +12:00
< br >
2021-06-07 12:57:36 +12:00
Please go through they one by one and remap the legacy fields manually to ensure proper functioning of FA .
2021-05-15 05:06:58 +12:00
< br >
After the remapping is done , rerun the tool to re - check .
`
} )
}
if ( legacyDocs . length === 0 ) {
const optionsSnapShot = extend ( true , { } , this . SGET _options )
// @ts-ignore
optionsSnapShot . legacyFieldsCheck = false
// @ts-ignore
this . SSET _options ( optionsSnapShot )
this . $q . notify ( {
group : false ,
type : "positive" ,
timeout : 3000 ,
message : "No legacy fields with active values found!"
} )
}
}
2021-04-06 01:28:33 +12:00
/ * *
* React to dragging of the splitter
* /
2021-03-18 10:26:08 +13:00
onChange ( value : number ) {
this . leftDrawerOpen = value > 0
2021-04-06 01:28:33 +12:00
this . optionsSnapShot = extend ( true , { } , this . SGET _options )
2021-03-18 10:26:08 +13:00
2021-04-06 01:28:33 +12:00
this . optionsSnapShot . treeWidth = this . splitterModel
2021-03-18 10:26:08 +13:00
clearTimeout ( this . pullTimer )
this . pullTimer = setTimeout ( ( ) => {
2021-04-06 01:28:33 +12:00
this . SSET _options ( this . optionsSnapShot )
2021-03-18 10:26:08 +13:00
} , 500 )
}
2021-04-28 13:06:41 +12:00
/****************************************************************/
// Repair project dialog
/****************************************************************/
repairProjectDialogTrigger : string | false = false
repairProjectDialogClose ( ) {
this . repairProjectDialogTrigger = false
}
repairProjectAssignUID ( ) {
this . repairProjectDialogTrigger = this . generateUID ( )
}
2021-03-04 13:27:07 +13:00
}
2021-03-18 10:26:08 +13:00
2021-03-04 13:27:07 +13:00
< / script >
< style lang = "scss" >
2021-04-15 11:45:59 +12:00
2021-04-28 13:06:41 +12:00
. notifClose {
position : absolute ;
right : 20 px ;
top : 14 px ;
}
2021-04-17 00:46:34 +12:00
. sideWrapper {
2021-04-15 11:45:59 +12:00
height : calc ( 100 % - 40 px ) ! important ;
}
2021-03-04 13:27:07 +13:00
. q - layout {
outline : none ! important ;
}
2021-03-18 10:26:08 +13:00
. splitt {
. q - splitter _ _before {
transition : width 0.2 s ease - out ;
width : 0 ! important ;
}
}
. pageSplitter {
aside {
height : calc ( 100 % - 55 px ) ! important ;
margin - top : 55 px ! important ;
}
2021-04-21 08:25:44 +12:00
& . splitterHidden {
. q - splitter _ _separator {
display : none ;
}
}
2021-03-18 10:26:08 +13:00
. q - splitter _ _separator {
background - color : transparent ;
height : calc ( 100 vh - 95 px ) ;
bottom : 0 ;
top : 95 px ;
2021-04-17 00:46:34 +12:00
position : sticky ;
2021-03-18 10:26:08 +13:00
}
}
2021-03-04 13:27:07 +13:00
< / style >