Skip to content

Commit

Permalink
Merge pull request #156 from dtom90/develop
Browse files Browse the repository at this point in the history
Add Interval Dropdown: End Date-Time Picker
  • Loading branch information
dtom90 committed Sep 19, 2020
2 parents b58fd4e + ab7a961 commit 1246929
Show file tree
Hide file tree
Showing 6 changed files with 140 additions and 11 deletions.
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "devtrack",
"version": "0.8.23",
"version": "0.9.0",
"private": true,
"description": "An app for productive developers",
"author": {
Expand Down Expand Up @@ -56,6 +56,7 @@
"vue": "^2.6.11",
"vue-chartjs": "^3.5.0",
"vue-color": "^2.7.0",
"vue-ctk-date-time-picker": "^2.5.0",
"vuedraggable": "^2.23.0",
"vuex": "^3.1.1",
"vuex-persist": "^2.0.1"
Expand Down
12 changes: 7 additions & 5 deletions src/components/ActivityView.vue
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@
<!-- Log -->
<div :id="manualInput ? 'task-log' : ''">
<Log
v-for="(dayActivity, day) in dailyActivity"
v-for="([day, dayActivity]) in dailyActivity"
:key="day"
:day="day"
:log="dayActivity.log"
Expand Down Expand Up @@ -224,7 +224,9 @@ export default {
}
}
return dailyActivity
const dailyActivityArray = Object.entries(dailyActivity)
dailyActivityArray.sort(([day1, activity1], [day2, activity2]) => this.stringToMs(day2) - this.stringToMs(day1))
return dailyActivityArray
},
chartData () {
Expand Down Expand Up @@ -286,7 +288,7 @@ function dailyChartData (that) {
// Add time spent per day and add to chartData
let nextDay = null
Object.keys(that.dailyActivity).forEach(day => {
that.dailyActivity.forEach(([day, dayActivity]) => {
const daysDiff = that.dateDiffInDays(day, nextDay)
if (nextDay && daysDiff > 1) {
const a = that.displayDateHuman(that.daysLater(day, 1))
Expand All @@ -298,9 +300,9 @@ function dailyChartData (that) {
}
chartData.datasets[0].data.unshift(0)
}
that.dailyActivity[day].timeSpent = that.calculateTimeSpent(that.dailyActivity[day].log)
dayActivity.timeSpent = that.calculateTimeSpent(dayActivity.log)
chartData.labels.unshift(that.displayDateHuman(day))
chartData.datasets[0].data.unshift(that.msToMinutes(that.dailyActivity[day].timeSpent))
chartData.datasets[0].data.unshift(that.msToMinutes(dayActivity.timeSpent))
nextDay = day
})
Expand Down
27 changes: 25 additions & 2 deletions src/components/DropdownAddInterval.vue
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
variant="light"
toggle-class="text-decoration-none"
no-caret
@show="dropdownWillShow"
@shown="dropdownShown = true"
@hide="dropdownWillHide"
@hidden="dropdownShown = false"
Expand All @@ -16,6 +17,7 @@
</template>
<b-dropdown-form @submit="addIntervalButtonClicked">
<b-form-group>
Duration:
<b-input-group append="minutes">
<b-form-input
ref="appendMinutesInput"
Expand All @@ -26,9 +28,18 @@
</b-input-group>
</b-form-group>

<b-form-group>
Ending At:
<VueCtkDateTimePicker
v-model="endTime"
:format="displayDateTimeFormat()"
:right="true"
/>
</b-form-group>

<b-btn
variant="primary"
style="width: 158px"
style="width: 258px"
@click="addIntervalButtonClicked"
>
Add Interval
Expand All @@ -41,10 +52,16 @@
<script>
import { mapMutations } from 'vuex'
import time from '../lib/time'
import VueCtkDateTimePicker from 'vue-ctk-date-time-picker'
import 'vue-ctk-date-time-picker/dist/vue-ctk-date-time-picker.css'
export default {
name: 'DropdownAddInterval',
components: {
VueCtkDateTimePicker
},
mixins: [time],
props: {
Expand All @@ -59,13 +76,18 @@ export default {
dropdownShown: false,
dropdownHide: null,
intentionalEnter: false,
appendMinutes: 25
appendMinutes: 25,
endTime: this.displayDateTimeHuman()
}
},
methods: {
...mapMutations(['addInterval']),
dropdownWillShow () {
this.endTime = this.displayDateTimeHuman()
},
dropdownWillHide (event) {
if (!this.intentionalEnter) {
this.dropdownHide = event
Expand Down Expand Up @@ -93,6 +115,7 @@ export default {
event.preventDefault()
this.addInterval({
id: this.taskId,
stopped: this.stringToMs(this.endTime),
timeSpent: this.minutesToMs(this.appendMinutes)
})
this.$refs.dropdown.hide()
Expand Down
24 changes: 22 additions & 2 deletions src/lib/time.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,8 @@ export default {

minutesToMs,

stringToMs: (str) => dayjs(str).valueOf(),

// a and b are javascript Date objects
dateDiffInDays (a, b) {
const [ua, ub] = [a, b].map(day => dayjs.utc(day))
Expand All @@ -43,6 +45,18 @@ export default {

daysLater: (a, diffDays) => dayjs.utc(a).add(diffDays, 'day'),

displayTimeFormat () {
return `${this.timeFormat24 ? 'H' : 'h'}:mm${this.timeFormat24 ? '' : ' A'}`
},

displayDateFormat () {
return 'YYYY-MM-DD'
},

displayDateTimeFormat () {
return this.displayDateFormat() + ' ' + this.displayTimeFormat()
},

displayWeekISO: day => {
const djs = dayjs(day)
return djs.format('YYYY-') + djs.week()
Expand All @@ -54,14 +68,20 @@ export default {
return [displayDateHuman(djs.startOf('week')) + ' -', displayDateHuman(djs.endOf('week'))]
},

displayDateISO: day => dayjs(day).format('YYYY-MM-DD'),
displayDateISO (day) {
return dayjs(day).format(this.displayDateFormat())
},

displayDateHuman,

displayFullDateHuman,

displayTimeHuman (time) {
return dayjs(time).format(`${this.timeFormat24 ? 'H' : 'h'}:mm ${this.timeFormat24 ? '' : 'A'}`)
return dayjs(time).format(this.displayTimeFormat())
},

displayDateTimeHuman (time) {
return dayjs(time).format(this.displayDateTimeFormat())
},

displayDuration
Expand Down
2 changes: 1 addition & 1 deletion src/store/mutations.js
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@ const mutations = {
if (task) {
const interval = {
started: null,
stopped: Date.now(),
stopped: payload.stopped,
timeSpent: payload.timeSpent
}
interval.started = interval.stopped - interval.timeSpent
Expand Down
83 changes: 83 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -5045,6 +5045,14 @@ cyclist@^1.0.1:
resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9"
integrity sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=

d@1, d@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/d/-/d-1.0.1.tgz#8698095372d58dbee346ffd0c7093f99f8f9eb5a"
integrity sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==
dependencies:
es5-ext "^0.10.50"
type "^1.0.1"

dashdash@^1.12.0:
version "1.14.1"
resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
Expand Down Expand Up @@ -5842,11 +5850,37 @@ es-to-primitive@^1.2.1:
is-date-object "^1.0.1"
is-symbol "^1.0.2"

es5-ext@^0.10.35, es5-ext@^0.10.50:
version "0.10.53"
resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.53.tgz#93c5a3acfdbef275220ad72644ad02ee18368de1"
integrity sha512-Xs2Stw6NiNHWypzRTY1MtaG/uJlwCk8kH81920ma8mvN8Xq1gsfhZvpkImLQArw8AHnv8MT2I45J3c0R8slE+Q==
dependencies:
es6-iterator "~2.0.3"
es6-symbol "~3.1.3"
next-tick "~1.0.0"

es6-error@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/es6-error/-/es6-error-4.1.1.tgz#9e3af407459deed47e9a91f9b885a84eb05c561d"
integrity sha512-Um/+FxMr9CISWh0bi5Zv0iOD+4cFh5qLeks1qhAopKVAJw3drgKbKySikp7wGhDL0HPeaja0P5ULZrxLkniUVg==

es6-iterator@~2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/es6-iterator/-/es6-iterator-2.0.3.tgz#a7de889141a05a94b0854403b2d0a0fbfa98f3b7"
integrity sha1-p96IkUGgWpSwhUQDstCg+/qY87c=
dependencies:
d "1"
es5-ext "^0.10.35"
es6-symbol "^3.1.1"

es6-symbol@^3.1.0, es6-symbol@^3.1.1, es6-symbol@~3.1.3:
version "3.1.3"
resolved "https://registry.yarnpkg.com/es6-symbol/-/es6-symbol-3.1.3.tgz#bad5d3c1bcdac28269f4cb331e431c78ac705d18"
integrity sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==
dependencies:
d "^1.0.1"
ext "^1.1.2"

escape-goat@^2.0.0:
version "2.1.1"
resolved "https://registry.yarnpkg.com/escape-goat/-/escape-goat-2.1.1.tgz#1b2dc77003676c457ec760b2dc68edb648188675"
Expand Down Expand Up @@ -6284,6 +6318,13 @@ express@^4.16.3, express@^4.17.1:
utils-merge "1.0.1"
vary "~1.1.2"

ext@^1.1.2:
version "1.4.0"
resolved "https://registry.yarnpkg.com/ext/-/ext-1.4.0.tgz#89ae7a07158f79d35517882904324077e4379244"
integrity sha512-Key5NIsUxdqKg3vIsdw9dSuXpPCQ297y6wBjL30edxwPgt2E44WcWBZey/ZvUc6sERLTxKdyCu4gZFmUbk1Q7A==
dependencies:
type "^2.0.0"

extend-shallow@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-2.0.1.tgz#51af7d614ad9a9f610ea1bafbb989d6b1c56890f"
Expand Down Expand Up @@ -9433,6 +9474,13 @@ moment-duration-format-commonjs@^1.0.0:
resolved "https://registry.yarnpkg.com/moment-duration-format-commonjs/-/moment-duration-format-commonjs-1.0.0.tgz#dc5de612e6d6ff41f774d03772a139a363563bc3"
integrity sha512-MVFR4hIh4jfuwSCPBEE5CCwn3refvTsxK/Yv/DpKJ6YcNnCimlVJ6DQeTJG1KVQPw1o8m3tkbHE9gVjivyv9iA==

moment-range@^4.0.1:
version "4.0.2"
resolved "https://registry.yarnpkg.com/moment-range/-/moment-range-4.0.2.tgz#f7c3863df2a1ed7fd1822ba5a7bcf53a78701be9"
integrity sha512-n8sceWwSTjmz++nFHzeNEUsYtDqjgXgcOBzsHi+BoXQU2FW+eU92LUaK8gqOiSu5PG57Q9sYj1Fz4LRDj4FtKA==
dependencies:
es6-symbol "^3.1.0"

moment@^2.10.2, moment@^2.10.3, moment@^2.14.1, moment@^2.24.0:
version "2.26.0"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.26.0.tgz#5e1f82c6bafca6e83e808b30c8705eed0dcbd39a"
Expand Down Expand Up @@ -9559,6 +9607,11 @@ neo-async@^2.6.0:
resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.1.tgz#ac27ada66167fa8849a6addd837f6b189ad2081c"
integrity sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==

next-tick@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c"
integrity sha1-yobR/ogoFpsBICCOPchCS524NCw=

nice-try@^1.0.4:
version "1.0.5"
resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366"
Expand Down Expand Up @@ -13279,6 +13332,16 @@ type-is@~1.6.17, type-is@~1.6.18:
media-typer "0.3.0"
mime-types "~2.1.24"

type@^1.0.1:
version "1.2.0"
resolved "https://registry.yarnpkg.com/type/-/type-1.2.0.tgz#848dd7698dafa3e54a6c479e759c4bc3f18847a0"
integrity sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==

type@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/type/-/type-2.1.0.tgz#9bdc22c648cf8cf86dd23d32336a41cfb6475e3f"
integrity sha512-G9absDWvhAWCV2gmF1zKud3OyC61nZDwWvBL2DApaVFogI07CprggiQAOOjvp2NRjYWFzPyu7vwtDrQFq8jeSA==

typedarray-to-buffer@^3.1.5:
version "3.1.5"
resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080"
Expand Down Expand Up @@ -13570,6 +13633,11 @@ uuid@^3.3.2, uuid@^3.4.0:
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.4.0.tgz#b23e4358afa8a202fe7a100af1f5f883f02007ee"
integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==

v-click-outside@^2.0.2:
version "2.1.5"
resolved "https://registry.yarnpkg.com/v-click-outside/-/v-click-outside-2.1.5.tgz#aa69172fb41fcc79b26b9a4bc72a30ccf03f7a3c"
integrity sha512-VPNCOTZK6WZy73lcWc+R7IW1uaBFEO3/Csrs5CzWVOdvE30V8Y1+BE/BtTlcEmeDGx0eqdE7bSCg55Jj37PMJg==

v8-compile-cache@^2.0.3:
version "2.1.0"
resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.1.0.tgz#e14de37b31a6d194f5690d67efc4e7f6fc6ab30e"
Expand Down Expand Up @@ -13647,6 +13715,16 @@ vue-color@^2.7.0:
material-colors "^1.0.0"
tinycolor2 "^1.1.2"

vue-ctk-date-time-picker@^2.5.0:
version "2.5.0"
resolved "https://registry.yarnpkg.com/vue-ctk-date-time-picker/-/vue-ctk-date-time-picker-2.5.0.tgz#22d6e4b4199326bfb0bf0b869e7450f4c16a6239"
integrity sha512-s4AO+5xnPlX+LD5UPQcjLBnv8MwcEJKlKUnkTLQeXRV0xqpH9pWRe6aJ8N2+506mEN6b7iwhlFox6uKKdtK+gw==
dependencies:
moment "^2.24.0"
moment-range "^4.0.1"
v-click-outside "^2.0.2"
vue "^2.6.9"

vue-eslint-parser@^7.0.0:
version "7.1.0"
resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-7.1.0.tgz#9cdbcc823e656b087507a1911732b867ac101e83"
Expand Down Expand Up @@ -13722,6 +13800,11 @@ vue@^2.6.11:
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==

vue@^2.6.9:
version "2.6.12"
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.12.tgz#f5ebd4fa6bd2869403e29a896aed4904456c9123"
integrity sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg==

vuedraggable@^2.23.0:
version "2.23.2"
resolved "https://registry.yarnpkg.com/vuedraggable/-/vuedraggable-2.23.2.tgz#0d95d7fdf4f02f56755a26b3c9dca5c7ca9cfa72"
Expand Down

0 comments on commit 1246929

Please sign in to comment.