Added CDate component !

This commit is contained in:
Paolo Arena
2019-04-05 16:16:29 +02:00
parent fe600f40a6
commit 7a55fa7f68
26 changed files with 421 additions and 40910 deletions

View File

@@ -1,3 +1,5 @@
$heightBtn: 100%;
.clMain {
min-width: 350px;
}
@@ -88,15 +90,34 @@
flex: 1;
}
.flex-item{
// background-color: #d5e2eb;
padding: 0px;
margin: 1px;
margin-left: 3px;
margin-right: 3px;
color: #000;
font-size: 0.85rem;
height: $heightBtn;
line-height: $heightBtn;
vertical-align: middle;
//flex: 0 0 100%;
}
.itemdescr{
font-size: 1rem;
flex: 1;
}
.itemstatus{
flex: 1;
padding: 2px;
}
.itemdata{
font-size: 1rem;
flex: 1;
padding: 4px;
padding: 2px;
}
.progress-item {

View File

@@ -14,13 +14,14 @@ import { UserStore } from '@store'
import { Getter } from 'vuex-class'
import { Screen } from 'quasar'
import { CProgress } from '@components'
import { CProgress } from '../../../components/CProgress'
import { CDate } from '../../../components/CDate'
const namespace: string = 'Projects'
@Component({
components: { SingleProject, CProgress, CTodo },
components: { SingleProject, CProgress, CTodo, CDate },
filters: {
capitalize(value) {
if (!value) {
@@ -50,11 +51,18 @@ export default class ProjList extends Vue {
public colProgress: string = 'blue'
public percProgress: string = 'percProgress'
public selectStatus: [] = tools.selectStatus[UserStore.state.lang]
public $refs: {
singleproject: SingleProject[],
ctodo: CTodo
}
public watchupdatetodo(field = '') {
console.log('watchupdate', field)
this.$emit('eventupdate', {myitem: this.itemtodosel, field } )
}
get getrouteup() {
return '/projects/' + this.idProjParentAtt
}
@@ -245,6 +253,11 @@ export default class ProjList extends Vue {
this.itemtodosel = item
}
public cambiadata(value) {
// console.log('******* cambiadata', value)
this.itemtodosel.start_date = new Date(arguments[0])
}
public async updateitemproj({ myitem, field }) {
console.log('calling MODIFY updateitemproj', myitem, field)
@@ -268,7 +281,20 @@ export default class ProjList extends Vue {
for (const i in this.$refs.ctodo.$refs.single) {
// @ts-ignore
const contr = this.$refs.ctodo.$refs.single[i] as SingleTodo
const des = !check
let des = true
if (check) {
const id = contr.itemtodo._id
// Don't deselect the actual clicked!
if (onlythis) {
des = item._id === id
} else {
if (!!item) {
des = ((check && (item._id !== id)) || (!check))
} else {
des = !check
}
}
}
if (des) {
// @ts-ignore
contr.deselectAndExitEdit()
@@ -277,7 +303,7 @@ export default class ProjList extends Vue {
}
public deselectAllRowsproj(item: IProject, check, onlythis: boolean = false) {
console.log('deselectAllRowsproj: ', item)
// console.log('deselectAllRowsproj: ', item)
for (const i in this.$refs.singleproject) {

View File

@@ -1,4 +1,4 @@
<template>
<template xmlns:v-slot="http://www.w3.org/1999/XSL/Transform">
<q-page>
<div class="panel">
@@ -84,7 +84,8 @@
<SingleProject ref="singleproject" @deleteItemproj="mydeleteitemproj(myproj._id)"
@eventupdateproj="updateitemproj"
@idsel="setidsel"
@deselectAllRowsproj="deselectAllRowsproj" @deselectAllRowstodo="deselectAllRowstodo" @onEnd="onEndproj"
@deselectAllRowsproj="deselectAllRowsproj"
@deselectAllRowstodo="deselectAllRowstodo" @onEnd="onEndproj"
:itemproject='myproj'>
</SingleProject>
@@ -94,8 +95,10 @@
</div>
<q-separator></q-separator>
<CTodo ref="ctodo" @setitemsel="setitemsel" :categoryAtt="idProjAtt" title="" backcolor="white" forecolor="black" :viewtaskTop="false" @deselectAllRowsproj="deselectAllRowsproj" @deselectAllRowstodo="deselectAllRowstodo"
>
<CTodo ref="ctodo" @setitemsel="setitemsel" :categoryAtt="idProjAtt" title="" backcolor="white"
forecolor="black" :viewtaskTop="false" @deselectAllRowsproj="deselectAllRowsproj"
@deselectAllRowstodo="deselectAllRowstodo"
>
</CTodo>
</div>
@@ -108,7 +111,6 @@
{{itemsel.descr}}
</div>
</div>
<q-separator/>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="border_color"/>
<div class="flex-item itemdescr">
@@ -153,25 +155,15 @@
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="developer_mode"/>
<div class="flex-item itemdata">
<q-input dense v-model="itemsel.begin_development" mask="date" :hint="$t('proj.begin_development')">
<!--<span class="data_string">{{tools.getstrDate(itemsel.begin_development)}}</span>-->
<q-icon name="event" class="cursor-pointer" style="font-size: 1.5rem;">
<q-popup-proxy>
<q-date v-model="itemsel.begin_development" today-btn/>
</q-popup-proxy>
</q-icon>
</q-input>
<CDate :mydate="itemsel.begin_development" @input="itemsel.begin_development = new Date(arguments[0])"
:label="$t('proj.begin_development')">
</CDate>
</div>
<div style="margin: 10px;"></div>
<div class="flex-item itemdata">
<q-input dense v-model="itemsel.begin_test" mask="date" :hint="$t('proj.begin_test')">
<!--<span class="data_string">{{tools.getstrDate(itemsel.begin_development)}}</span>-->
<q-icon name="event" class="cursor-pointer" style="font-size: 1.5rem;">
<q-popup-proxy>
<q-date v-model="itemsel.begin_test" today-btn/>
</q-popup-proxy>
</q-icon>
</q-input>
<CDate :mydate="itemsel.begin_test" @input="itemsel.begin_test = new Date(arguments[0])"
:label="$t('proj.begin_test')">
</CDate>
</div>
</div>
</div>
@@ -186,20 +178,76 @@
v-model="itemtodosel.descr"
:label="$t('proj.longdescr')"
outlined
debounce="500"
autogrow
/>
debounce="1000"
autogrow>
</q-input>
</div>
</div>
</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.status" :options="selectStatus"
:label="$t('todo.status')" emit-value map-options
@input="watchupdatetodo('status')">
</q-select>
</div>
<q-icon class="flex-item flex-icon" name="event"/>
<div class="flex-item itemdata">
<CDate v-if="itemtodosel.status === tools.Status.COMPLETED"
:mydate="itemtodosel.completed_at" @input="itemtodosel.completed_at = new Date(arguments[0])"
:label="$t('todo.completed_at')">
</CDate>
</div>
</div>
<div class="flex-container clMain">
<q-icon class="flex-item flex-icon" name="work_outline"/>
<div class="flex-item itemdescr">
<q-input
ref="input"
v-model="itemtodosel.hoursworked"
type="number"
rounded outlined
:label="$t('proj.hoursworked')"
debounce="500">
</q-input>
<CProgress descr="" :progressval="getCalcHoursWorked"></CProgress>
</div>
<q-icon class="flex-item flex-icon" name="watch_later"/>
<div class="flex-item itemdata content-center">
<q-input
ref="input"
type="number"
v-model="itemtodosel.hoursplanned"
rounded outlined
:label="$t('proj.hoursplanned')"
debounce="500">
</q-input>
<CProgress :descr="$t('proj.progresstask')"
:progressval="itemtodosel.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 :mydate="itemtodosel.start_date" @input="itemtodosel.start_date = new Date(arguments[0])"
:label="$t('todo.start_date')">
</CDate>
</div>
<div style="margin: 10px;"></div>
<div class="flex-item itemdata">
</div>
</div>
</template>
</q-splitter>
</div>
</q-page>
</template>
<script lang="ts" src="./proj-list.ts">
</script>
<style lang="scss" scoped>