Files
myprojplanet_vite/src/views/projects/proj-list/proj-list.vue.off
paoloar77 5375e9d728 - MyProfile
- Immagine profilo e small
2022-01-03 21:53:41 +01:00

666 lines
27 KiB
Plaintext
Executable File

<template>
<q-page>
<div class="panel">
<q-dialog v-model="shownewsubproj">
<q-card class="dialog_card">
<q-toolbar class="bg-primary text-white">
<q-toolbar-title>
Nuovo
</q-toolbar-title>
<q-btn flat round color="white" icon="close" v-close-popup></q-btn>
</q-toolbar>
<q-card-section class="inset-shadow">
<q-input
color="blue-12" v-model="newSubProj" label="Inserisci il Nuovo sotto Progetto:"
style="margin-left: 6px;"
autofocus
:after="[{icon: 'arrow_forward', content: true, handler () {}}]">
<template v-slot:prepend>
<q-icon name="add"/>
</template>
</q-input>
</q-card-section>
<q-card-actions align="center">
<q-btn
rounded color="primary" v-close-popup label="Aggiungi"
@click="insertSubProj()"></q-btn>
<q-btn flat rounded color="negative" v-close-popup label="Annulla"></q-btn>
</q-card-actions>
</q-card>
</q-dialog>
<div>
<div class="flex-container clMain">
<div class="q-ml-md">
<div v-if="canShow">
<q-btn
v-if="!isRootProjectAtt" size="md" push
color="secondary" round
icon="arrow_back"
@click="clickrouteup"
:to="getrouteup()">
</q-btn>
</div>
</div>
<div :class="classTitleProjSelBread">
<div v-if="canShow">
<q-breadcrumbs gutter="xs">
<q-breadcrumbs-el
v-for="(crumb, index) in listacrumb"
:key="index"
:label="crumb.description"
:to="getroutebyid(crumb.idelem)"/>
</q-breadcrumbs>
</div>
<div v-else>
Progetti:
</div>
</div>
<q-btn
push
size="md"
icon="settings">
<q-menu id="popconfig" self="top right">
<q-list link separator no-border class="todo-menu">
<div v-for="field in menuPopupConfigProject" :key="field.value">
<q-item clickable v-if="(field.value === 150)">
<q-item-section avatar>
<q-icon :name="field.icon"/>
</q-item-section>
<q-item-section>{{ field.label }}</q-item-section>
<q-item-section side>
<q-icon name="keyboard_arrow_right"/>
</q-item-section>
<q-menu auto-close anchor="bottom middle" self="top middle">
<q-list dense>
<q-item side clickable :icon="field.icon">
<q-item-section>
<q-list dense>
<q-item
clickable v-ripple
v-for="opt in listOptionShowTask"
:key="opt.value"
@click="showtype = opt.value">
<q-item-section avatar>
<q-icon
:name="opt.icon" inverted
color="primary"/>
</q-item-section>
<q-item-section>
{{ opt.label }}
</q-item-section>
</q-item>
</q-list>
</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<q-item
v-else v-close-popup clickable :icon="field.icon" :disable="field.disable"
@click="clickMenuProjList(field.value)">
<q-item-section avatar>
<q-icon :name="field.icon"/>
</q-item-section>
<q-item-section>{{ field.label }}</q-item-section>
</q-item>
</div>
</q-list>
</q-menu>
</q-btn>
</div>
<div class="flex-item categorytitle" v-if="(whatisSel === tools.WHAT_TODO)"> {{ showDescr }}</div>
</div>
</div>
<!--<q-splitter
v-model="splitterModel"
:horizontal="isHorizontal"
:style="myStyle"
:limits="[50, 100]"
<template v-slot:before>
>-->
<q-tab-panels v-model="tabproj" animated>
<q-tab-panel name="lista">
<div>
<!--idProjAtt: {{ idProjAtt }}-->
<div style="display: none">{{ prior = 0, priorcomplet = false }}</div>
<div>
<!--<q-infinite-scroll :handler="loadMoreTodo" :offset="7">-->
<!--<div class="container" v-dragula="projs_dacompletare(idProjAtt, gettipoProj)" drake="second"> -->
<div class="container">
<q-list bordered>
<div
:id="tools.getmyid(myproj._id)" :index="index"
v-for="(myproj, index) in projs_dacompletare(idProjAtt, gettipoProj)"
:key="myproj._id" class="myitemdrag">
<SingleProject
ref="singleproject" @deleteItemproj="mydeleteitemproj(myproj._id)"
@eventupdateproj="updateitemproj"
@idsel="setidsel"
@deselectAllRowsproj="deselectAllRowsproj"
@deselectAllRowstodo="deselectAllRowstodo" @onEnd="onEndproj"
:itemproject='myproj'>
</SingleProject>
</div>
</q-list>
</div>
</div>
<q-separator></q-separator>
<!--<q-input v-model="projbottom"
style="margin-left: 6px;"
color="blue-12"
:label="$t('proj.insertbottom')"
:after="[{icon: 'arrow_forward', content: true, handler () {}}]"
>
</q-input>
<br>
<q-separator></q-separator>
-->
<!--CanIModifyPanelPrivacy = {{CanIModifyPanelPrivacy}}<br>-->
<!--CanIModifyPanelPrivacySel = {{CanIModifyPanelPrivacySel}}<br>-->
<!--CanISeeProject = {{CanISeeProject}}<br>-->
<!--CanISeeProjectSel = {{CanISeeProjectSel}}-->
<CTodo
ref="ctodo" @setitemsel="setitemsel" :categoryAtt="idProjAtt" title="" backcolor="white"
forecolor="black" :viewtaskTop="false" @deselectAllRowsproj="deselectAllRowsproj"
@deselectAllRowstodo="deselectAllRowstodo"
:CanIModifyTodo="CanIModifyPanelPrivacy"
>
</CTodo>
</div>
</q-tab-panel>
<q-tab-panel name="info">
<div v-if="(whatisSel === tools.WHAT_PROJECT) && (!!itemselproj.descr)">
<div class="q-pa-xs q-mb-xl clMain">
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="border_color"/>
<div class="flex-item itemdescr">
<q-input
ref="input"
v-model="itemselproj.longdescr"
:label="$t('proj.longdescr')"
outlined
debounce="1000"
@update:model-value="modifyfieldproj('privacywrite')"
autogrow
style="flex: auto">
</q-input>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="fas fa-sort-amount-up-alt"/>
<div class="flex-item itemdescr">
<q-input
v-model="itemselproj.pos"
type="number"
rounded outlined
debounce="500"
style="max-width: 100px;"
:label="$t('dashboard.posizione')"></q-input>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="group"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 200px"
:readonly="readonly_PanelPrivacySel"
rounded outlined v-model="itemselproj.groupId" :options="selectGroup"
:label="$t('proj.group')" emit-value map-options
@update:model-value="modifyfieldproj('groupId')">
</q-select>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="border_color"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 200px"
:readonly="readonly_PanelPrivacySel"
rounded outlined v-model="itemselproj.respUsername" :options="selectResp"
:label="$t('proj.respUsername')" emit-value map-options
@update:model-value="modifyfieldproj('respUsername')">
</q-select>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="border_color"/>
<div class="flex-item itemdescr">
<q-select
style="min-width: 200px"
:readonly="readonly_PanelPrivacySel"
rounded outlined v-model="itemselproj.viceRespUsername" :options="selectResp"
:label="$t('proj.viceRespUsername')" emit-value map-options
@update:model-value="modifyfieldproj('viceRespUsername')">
</q-select>
<q-select
style="min-width: 200px"
:readonly="readonly_PanelPrivacySel"
rounded outlined v-model="itemselproj.vice2RespUsername" :options="selectResp"
:label="$t('proj.vice2RespUsername')" emit-value map-options
@update:model-value="modifyfieldproj('vice2RespUsername')">
</q-select>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="outlined_flag"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 150px" :readonly="readonly_PanelPrivacySel" rounded outlined
v-model="itemselproj.tipovisu"
:options="selectTipoVisu"
@update:model-value="modifyfieldproj('tipovisu')"
:label="$t('proj.tipovisu')" emit-value map-options>
</q-select>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="lock"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 200px"
:readonly="readonly_PanelPrivacySel"
rounded outlined v-model="itemselproj.privacyread" :options="selectPrivacy"
:label="$t('proj.privacyread')" emit-value map-options
@update:model-value="modifyfieldproj('privacyread')">
</q-select>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="edit"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 200px" :readonly="readonly_PanelPrivacySel" rounded outlined
v-model="itemselproj.privacywrite" :options="selectPrivacy"
:label="$t('proj.privacywrite')" emit-value map-options
@update:model-value="modifyfieldproj('privacywrite')">
</q-select>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="edit"/>
<div class="flex-item itemstatus">
{{ $t('proj.createdby') }} {{ getCreatedBy(itemselproj) }}
</div>
</div>
</div>
</div>
<div v-else-if="(whatisSel === tools.WHAT_TODO) && (!!itemtodosel.descr)">
<div class="q-pa-xs q-mb-xl clMain">
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="border_color"/>
<div class="flex-item itemdescr">
<!--<q-icon size="md" :name="iconPriority" color="primary"/>-->
<q-input
ref="input4"
v-model="itemtodosel.descr"
:class="classTitleTodoSel"
:label="$t('proj.longdescr')"
outlined
:readonly="readonly_PanelPrivacy"
@update:model-value="modifyfieldtodo('descr')"
debounce="1000"
autogrow
style="flex: auto">
</q-input>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="border_color"/>
<div class="flex-item itemdescr">
<!--<q-icon size="md" :name="iconPriority" color="primary"/>-->
<q-input
ref="input4"
v-model="itemtodosel.note"
:label="$t('proj.note')"
outlined
:readonly="readonly_PanelPrivacy"
@update:model-value="modifyfieldtodo('note')"
debounce="1000"
autogrow
style="flex: auto">
</q-input>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="fas fa-sort-amount-up-alt"/>
<div class="flex-item itemdescr">
<q-input
v-model="itemtodosel.pos"
type="number"
debounce="500"
@update:model-value="modifyfieldtodo('pos')"
rounded outlined
style="max-width: 100px;"
:label="$t('dashboard.posizione')">
</q-input>
</div>
</div>
<div class="flex-item itemstatus">
<q-select
style="min-width: 200px"
:readonly="readonly_PanelPrivacy"
@update:model-value="modifyfieldtodo('assigned_to_userId')"
rounded outlined v-model="itemtodosel.assigned_to_userId" :options="selectWorkers"
:label="$t('todo.assigned_to_userId')" emit-value map-options>
</q-select>
</div>
<div class="flex-item itemstatus">
<CMyFieldDb
:title="$t('todo.workers')"
:id="itemtodosel._id"
:idmain="itemtodosel.category"
table="todos"
mykey="assignedToUsers"
@update:model-value="modifyfieldtodo('assignedToUsers')"
:type="costanti.FieldType.multiselect"
jointable="workers">
</CMyFieldDb>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="done_outline"/>
<div class="flex-item itemstatus">
<q-select
rounded outlined v-model="itemtodosel.statustodo" :options="selectStatus"
:readonly="readonly_PanelPrivacy"
:label="$t('todo.status')" emit-value map-options
@update:model-value="modifyfieldtodo('statustodo')">
</q-select>
</div>
</div>
</div>
</div>
</q-tab-panel>
<q-tab-panel name="ore">
<div v-if="(whatisSel === tools.WHAT_TODO) && (!!itemtodosel.descr)">
<!--<CHours v-if="!!itemtodosel" :todoId="itemtodosel._id"></CHours>-->
<div v-if="!!itemtodosel">
<CGridTableRec
prop_mytable="hours"
prop_mytitle="Lista Ore"
:prop_mycolumns="getcolHours"
prop_colkey="descr"
nodataLabel="Nessuna Lista Ore"
noresultLabel="Il filtro selezionato non ha trovato nessun risultato"
:arrfilters="myarrfilterand"
:filterdef="myfilterdef"
:prop_codeId="itemtodosel._id"
:defaultnewrec="getdefaultnewrec"
labelBtnAddRow="Aggiungi Ore"
:extraparams="extraparams">
</CGridTableRec>
</div>
</div>
<div v-else-if="(whatisSel === tools.WHAT_PROJECT) && (!!itemselproj.descr)">
<!--<CHours v-if="!!itemtodosel" :todoId="itemtodosel._id"></CHours>-->
<div v-if="!!itemselproj">
<CGridTableRec
prop_mytable="hours"
prop_mytitle="Lista Ore"
:prop_mycolumns="getcolHours"
prop_colkey="descr"
nodataLabel="Nessuna Lista Ore"
noresultLabel="Il filtro selezionato non ha trovato nessun risultato"
:arrfilters="myarrfilterand"
:filterdef="myfilterdef"
:prop_codeId="itemselproj._id"
:defaultnewrec="getdefaultnewrec"
labelBtnAddRow="Aggiungi Ore"
:extraparams="extraparams">
</CGridTableRec>
</div>
</div>
<div class="q-ma-lg"></div>
</q-tab-panel>
<q-tab-panel name="stat">
<div v-if="(whatisSel === tools.WHAT_PROJECT) && (!!itemselproj.descr)">
<div v-if="CanISeeProjectSel">
<div v-if="!!itemselproj">
<!-- itemselproj._id: {{ itemselproj._id }} -->
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="work_outline"/>
<div class="flex-item itemdescr">
<q-input
ref="input2"
readonly
v-model="itemselproj.hoursworked"
type="number"
rounded outlined
:label="$t('proj.hoursworked')"
debounce="500"></q-input>
<CProgress descr="Fatte" :progressval="getCalcHoursWorked"></CProgress>
</div>
</div>
<div v-if="CanISeeProjectSel" class="flex-item items-center">
<q-icon class="flex-item flex-icon" name="watch_later"/>
<div class="flex-item itemdata content-center q-mx-sm">
<q-input
ref="input3"
type="number"
readonly
v-model="itemselproj.hoursplanned"
rounded outlined
@update:model-value="modifyfieldproj('hoursplanned')"
:label="$t('proj.hoursplanned')"
debounce="500">
</q-input>
<CProgress
:descr="$t('proj.progresstask')"
:progressval="itemselproj.progressCalc"></CProgress>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="developer_mode"/>
<div class="flex-item itemdata">
<CDate
:readonly="readonly_PanelPrivacySel" :mydate="itemselproj.begin_development"
@update:model-value="itemselproj.begin_development = new Date(arguments[0]); modifyfieldproj('begin_development')"
:label="$t('proj.begin_development')">
</CDate>
</div>
<div style="margin: 10px;"></div>
<div class="flex-item itemdata">
<CDate
:readonly="readonly_PanelPrivacySel" :mydate="itemselproj.begin_test"
@update:model-value="itemselproj.begin_test = new Date(arguments[0]); modifyfieldproj('begin_test')"
:label="$t('proj.begin_test')">
</CDate>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="outlined_flag"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 150px" :readonly="readonly_PanelPrivacySel" rounded outlined
v-model="itemselproj.actualphase"
:options="selectPhase"
@update:model-value="modifyfieldproj('actualphase')"
:label="$t('proj.actualphase')" emit-value map-options>
</q-select>
</div>
<q-icon class="flex-item flex-icon" name="outlined_flag"/>
<div class="flex-item itemstatus">
<q-select
style="min-width: 150px"
:readonly="readonly_PanelPrivacySel" rounded outlined v-model="itemselproj.totalphases"
:options="selectPhase"
@update:model-value="modifyfieldproj('totalphases')"
:label="$t('proj.totalphases')" emit-value map-options>
</q-select>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="watch_later"/>
<div class="flex-item itemdata content-center">
<q-input
:readonly="readonly_PanelPrivacySel"
ref="input3"
type="number"
v-model="itemselproj.hoursweeky_plannedtowork"
rounded outlined
maxlength="2"
:label="$t('proj.hoursweeky_plannedtowork')"
debounce="500">
</q-input>
<CProgress :progressval="calcprogressWeekly"></CProgress>
</div>
<q-icon class="flex-item flex-icon" name="developer_mode"/>
<div class="flex-item itemdata">
<CDate
color="green-2" :mydate="calcEndWork_Estimate" :readonly="true"
:label="$t('proj.endwork_estimate')">
</CDate>
</div>
</div>
</div>
</div>
<div v-else-if="(whatisSel === tools.WHAT_TODO) && (!!itemtodosel.descr)">
<div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="work_outline"/>
<div class="flex-item itemdescr">
<q-input
ref="input5"
:readonly="true"
v-model="itemtodosel.hoursworked"
type="number"
rounded outlined
:label="$t('proj.hoursworked')"
debounce="500">
</q-input>
<CProgress descr="" :progressval="getCalcTodoHoursWorked"></CProgress>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="watch_later"/>
<div class="flex-item itemdata content-center">
<q-input
ref="input6"
:readonly="readonly_PanelPrivacy"
type="number"
v-model="itemtodosel.hoursplanned"
rounded outlined
:label="$t('proj.hoursplanned')"
debounce="500">
</q-input>
<CProgress
:descr="$t('proj.progresstask')"
:readonly="readonly_PanelPrivacy"
:progressval="itemtodosel.progress"
:slider="true" @update:model-value="itemtodosel.progress = arguments[0]"></CProgress>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="developer_mode"/>
<div class="flex-item itemdata">
<CDate
:mydate="itemtodosel.start_date"
:readonly="readonly_PanelPrivacy"
@update:model-value="itemtodosel.start_date = new Date(arguments[0]); modifyfieldtodo('start_date')"
:label="$t('todo.start_date')">
</CDate>
</div>
<div style="margin: 10px;"></div>
<q-icon class="flex-item flex-icon" name="event"/>
<div class="flex-item itemdata">
<CDate
:readonly="((itemtodosel.statustodo !== tools.Status.COMPLETED) || readonly_PanelPrivacy)"
:mydate="itemtodosel.completed_at"
@update:model-value="itemtodosel.completed_at = new Date(arguments[0]); modifyfieldtodo('completed_at')"
:label="$t('todo.completed_at')">
</CDate>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="outlined_flag"/>
<div class="flex-item itemstatus">
<q-select
rounded outlined v-model="itemtodosel.phase" :options="selectPhase"
:readonly="readonly_PanelPrivacy"
@update:model-value="modifyfieldtodo('phase')"
:label="$t('todo.phase')" emit-value map-options>
</q-select>
</div>
</div>
</div>
</div>
</q-tab-panel>
</q-tab-panels>
<q-page-sticky position="bottom-right" :offset="[9, 9]" padding="md">
<q-btn
fab icon="fas fa-list-alt" color="orange" @click="tabproj = 'lista'"
:disable="!whatisSel && !isRootProjectAtt"/>
<q-btn
fab icon="fas fa-info" color="blue" @click="tabproj = 'info'"
:disable="!whatisSel && !isRootProjectAtt"/>
<q-btn
fab icon="fas fa-hourglass" color="green" @click="tabproj = 'ore'"
:disable="!whatisSel && !isRootProjectAtt"/>
<q-btn
fab icon="fas fa-chart-line" color="accent" @click="tabproj = 'stat'"
:disable="!whatisSel && !isRootProjectAtt"/>
<q-btn fab icon="add" color="blue" @click="tabproj = 'lista'; clickMenuProjList(200)"/>
</q-page-sticky>
</q-page>
</template>
<script lang="ts" src="./proj-list.ts">
</script>
<style lang="scss" scoped>
@import './proj-list';
</style>