Improve webpack configuration
This commit is contained in:
Raimund Schlüßler
parent
928026cb5e
commit
93d27c1b94
|
|
@ -0,0 +1,59 @@
|
|||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
browser: true,
|
||||
es6: true,
|
||||
node: true,
|
||||
jest: true
|
||||
},
|
||||
globals: {
|
||||
t: false,
|
||||
n: false,
|
||||
OC: false,
|
||||
OCA: false
|
||||
},
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
},
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:node/recommended',
|
||||
'plugin:vue/recommended',
|
||||
'standard'
|
||||
],
|
||||
plugins: ['vue', 'node'],
|
||||
rules: {
|
||||
// space before function ()
|
||||
'space-before-function-paren': ['error', 'never'],
|
||||
// curly braces always space
|
||||
'object-curly-spacing': ['error', 'always'],
|
||||
// stay consistent with array brackets
|
||||
'array-bracket-newline': ['error', 'consistent'],
|
||||
// 1tbs brace style
|
||||
'brace-style': 'error',
|
||||
// tabs only
|
||||
indent: ['error', 'tab'],
|
||||
'no-tabs': 0,
|
||||
'vue/html-indent': ['error', 'tab'],
|
||||
// only debug console
|
||||
'no-console': ['error', { 'allow': ['error', 'warn', 'debug'] }],
|
||||
// classes blocks
|
||||
'padded-blocks': ['error', { 'classes': 'always' }],
|
||||
// es6 import/export and require
|
||||
'node/no-unpublished-require': ['off'],
|
||||
'node/no-unsupported-features': ['off'],
|
||||
// space before self-closing elements
|
||||
'vue/html-closing-bracket-spacing': 'error',
|
||||
// code spacing with attributes
|
||||
'vue/max-attributes-per-line': [
|
||||
'error',
|
||||
{
|
||||
singleline: 3,
|
||||
multiline: {
|
||||
max: 3,
|
||||
allowFirstLine: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
|
|
@ -1,11 +1,9 @@
|
|||
######################
|
||||
## Files build by make
|
||||
######################
|
||||
/css/src/sprite.scss
|
||||
/css/style.scss
|
||||
/css/src/sprites.scss
|
||||
/img/sprites.svg
|
||||
/js/public/
|
||||
/js/vendor/
|
||||
/js/
|
||||
|
||||
#################
|
||||
## PhpStorm
|
||||
|
|
|
|||
47
.jshintrc
47
.jshintrc
|
|
@ -1,47 +0,0 @@
|
|||
{
|
||||
"esnext": true,
|
||||
"curly": true,
|
||||
"eqeqeq": true,
|
||||
"immed": true,
|
||||
"indent": 4,
|
||||
"latedef": true,
|
||||
"newcap": true,
|
||||
"noarg": true,
|
||||
"noempty": true,
|
||||
"nonew": true,
|
||||
"plusplus": false,
|
||||
"node": true,
|
||||
"undef": true,
|
||||
"unused": false,
|
||||
"strict": true,
|
||||
"maxparams": false,
|
||||
"maxdepth": 4,
|
||||
"browser": true,
|
||||
"devel": true,
|
||||
"jquery": true,
|
||||
"jasmine": true,
|
||||
"globals": {
|
||||
"jQuery": true,
|
||||
"ICAL": true,
|
||||
"jstz": true,
|
||||
"moment": true,
|
||||
"angular": true,
|
||||
"app": true,
|
||||
"OC": true,
|
||||
"oc_current_user":true,
|
||||
"oc_requesttoken": true,
|
||||
"requestToken": true,
|
||||
"inject": true,
|
||||
"module": true,
|
||||
"t": true,
|
||||
"n": true,
|
||||
"it": true,
|
||||
"exports": true,
|
||||
"escapeHTML": true,
|
||||
"possible": true,
|
||||
"dav": true,
|
||||
"OCA": true,
|
||||
"Vue": true,
|
||||
"VueRouter": true
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
module.exports = {};
|
||||
37
.stylelintrc
37
.stylelintrc
|
|
@ -1,19 +1,22 @@
|
|||
{
|
||||
"extends": "stylelint-config-standard",
|
||||
"plugins": [
|
||||
"stylelint-scss"
|
||||
],
|
||||
"ignoreFiles": [
|
||||
"./css/src/sprite.scss"
|
||||
],
|
||||
"rules": {
|
||||
"indentation": "tab",
|
||||
"number-leading-zero": "never",
|
||||
"comment-empty-line-before": ["always", {
|
||||
"except": ["first-nested"]
|
||||
}],
|
||||
"at-rule-no-unknown": null,
|
||||
"scss/at-rule-no-unknown": true,
|
||||
"no-descending-specificity": null
|
||||
}
|
||||
"extends": "stylelint-config-recommended-scss",
|
||||
"rules": {
|
||||
"indentation": "tab",
|
||||
"selector-type-no-unknown": null,
|
||||
"number-leading-zero": null,
|
||||
"rule-empty-line-before": ["always", {
|
||||
"ignore": ["after-comment", "inside-block"]
|
||||
}],
|
||||
"declaration-empty-line-before": ["never", {
|
||||
"ignore": ["after-declaration"]
|
||||
}],
|
||||
"comment-empty-line-before": null,
|
||||
"selector-type-case": null,
|
||||
"selector-list-comma-newline-after": null,
|
||||
"no-descending-specificity": null,
|
||||
"string-quotes": null
|
||||
},
|
||||
"plugins": [
|
||||
"stylelint-scss"
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -90,11 +90,11 @@ $white: #fff;
|
|||
}
|
||||
|
||||
.app-navigation-entry-edit {
|
||||
&.name input[type="text"] {
|
||||
&.name input[type='text'] {
|
||||
width: calc(100% - 72px);
|
||||
}
|
||||
|
||||
&.caldav input[type="text"] {
|
||||
&.caldav input[type='text'] {
|
||||
width: calc(100% - 36px);
|
||||
}
|
||||
|
||||
|
|
@ -248,7 +248,6 @@ $white: #fff;
|
|||
|
||||
.confirmation-confirm {
|
||||
@extend .confirmation-abort;
|
||||
|
||||
background-color: $red !important;
|
||||
cursor: default !important;
|
||||
}
|
||||
|
|
@ -915,14 +914,14 @@ ol[dnd-list] {
|
|||
}
|
||||
}
|
||||
|
||||
input[type="range"] {
|
||||
input[type='range'] {
|
||||
border: medium none;
|
||||
box-shadow: none;
|
||||
width: calc(100% - 50px);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
input[type="text"] {
|
||||
input[type='text'] {
|
||||
background: none repeat scroll 0 0 $gray_easy;
|
||||
margin: 0;
|
||||
min-height: 0;
|
||||
|
|
@ -1193,7 +1192,7 @@ ol[dnd-list] {
|
|||
|
||||
&.icon-checkmark,
|
||||
&.icon-tag-active,
|
||||
&[class*=" icon-task-star-"] {
|
||||
&[class*=' icon-task-star-'] {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
|
|
@ -1296,7 +1295,7 @@ ol[dnd-list] {
|
|||
& > a span {
|
||||
opacity: 1 !important;
|
||||
|
||||
&[class*=" icon-"] {
|
||||
&[class*=' icon-'] {
|
||||
padding: 0;
|
||||
background-size: auto;
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
/**
|
||||
* Nextcloud - Tasks
|
||||
*
|
||||
* @author Raimund Schlüßler
|
||||
* @copyright 2018 Raimund Schlüßler <raimund.schluessler@mailbox.org>
|
||||
*
|
||||
* This library is free software; you can redistribute it and/or
|
||||
* modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE
|
||||
* License as published by the Free Software Foundation; either
|
||||
* version 3 of the License, or any later version.
|
||||
*
|
||||
* This library is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU AFFERO GENERAL PUBLIC LICENSE for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public
|
||||
* License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
|
||||
@import './src/nc12';
|
||||
@import './src/sprites';
|
||||
@import './src/style';
|
||||
71
gulpfile.js
71
gulpfile.js
|
|
@ -19,31 +19,13 @@
|
|||
|
||||
// get plugins
|
||||
const gulp = require('gulp'),
|
||||
jshint = require('gulp-jshint'),
|
||||
concat = require('gulp-concat'),
|
||||
stylelint = require('gulp-stylelint'),
|
||||
svgSprite = require('gulp-svg-sprite'),
|
||||
webpackStream = require('webpack-stream'),
|
||||
webpackDevelopmentConfig = require('./webpack.common.js'),
|
||||
webpackDevelopmentConfig = require('./webpack.dev.js'),
|
||||
webpackProductionConfig = require('./webpack.prod.js');
|
||||
|
||||
// configure
|
||||
const destinationFolder = __dirname + '/js/public/';
|
||||
const scssBuildTarget = 'style.scss';
|
||||
const scssDestinationFolder = __dirname + '/css/';
|
||||
|
||||
const jsSources = [
|
||||
'js/app/**/*.js'
|
||||
];
|
||||
const scssSources = [
|
||||
'css/src/*.scss'
|
||||
];
|
||||
const testSources = [
|
||||
'test/**/*.js'
|
||||
];
|
||||
|
||||
const lintSources = jsSources.concat(testSources).concat(['*.js']);
|
||||
const watchSources = jsSources.concat(['js/app/**/*.vue']);
|
||||
const destinationFolder = __dirname + '/js/';
|
||||
|
||||
const svgConfig = {
|
||||
shape: {
|
||||
|
|
@ -55,10 +37,10 @@ const svgConfig = {
|
|||
common: 'icon',
|
||||
dimensions: '',
|
||||
prefix: '.icon-%s',
|
||||
sprite: "../img/sprites.svg",
|
||||
sprite: '../img/sprites.svg',
|
||||
render: {
|
||||
scss: {
|
||||
dest: "src/sprites.scss"
|
||||
dest: 'src/sprites.scss'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -69,57 +51,16 @@ const svgConfig = {
|
|||
|
||||
gulp.task('default', ['build']);
|
||||
|
||||
gulp.task('build', ['lint', 'scssConcat'], function(callback) {
|
||||
gulp.task('build', ['svg_sprite'], function(callback) {
|
||||
return webpackStream(webpackProductionConfig, require('webpack'))
|
||||
.pipe(gulp.dest(destinationFolder));
|
||||
});
|
||||
|
||||
gulp.task('development', ['lint', 'scssConcat'], function(callback) {
|
||||
gulp.task('development', ['svg_sprite'], function(callback) {
|
||||
return webpackStream(webpackDevelopmentConfig, require('webpack'))
|
||||
.pipe(gulp.dest(destinationFolder));
|
||||
});
|
||||
|
||||
gulp.task('jsWatch', ['jslint'], function(callback) {
|
||||
return webpackStream(webpackDevelopmentConfig, require('webpack'))
|
||||
.pipe(gulp.dest(destinationFolder));
|
||||
});
|
||||
|
||||
gulp.task('lint', ['jslint', 'scsslint']);
|
||||
|
||||
gulp.task('jslint', () => {
|
||||
return gulp.src(lintSources)
|
||||
.pipe(jshint('.jshintrc'))
|
||||
.pipe(jshint.reporter('default'))
|
||||
.pipe(jshint.reporter('fail'));
|
||||
});
|
||||
|
||||
gulp.task('scsslint', () => {
|
||||
return gulp.src(scssSources)
|
||||
.pipe(stylelint ({
|
||||
reporters: [{
|
||||
formatter: 'string',
|
||||
console: true
|
||||
}]
|
||||
}));
|
||||
});
|
||||
|
||||
gulp.task('scssConcat', ['svg_sprite'], () => {
|
||||
return gulp.src(scssSources)
|
||||
.pipe(concat(scssBuildTarget))
|
||||
.pipe(gulp.dest(scssDestinationFolder));
|
||||
});
|
||||
|
||||
gulp.task('scssConcatWatch', ['scsslint'], () => {
|
||||
return gulp.src(scssSources)
|
||||
.pipe(concat(scssBuildTarget))
|
||||
.pipe(gulp.dest(scssDestinationFolder));
|
||||
});
|
||||
|
||||
gulp.task('watch', () => {
|
||||
gulp.watch(watchSources, ['jsWatch']);
|
||||
gulp.watch(scssSources, ['scssConcatWatch']);
|
||||
});
|
||||
|
||||
gulp.task('svg_sprite', () => {
|
||||
return gulp.src('**/*.svg', {cwd: 'img/src'})
|
||||
.pipe(svgSprite(svgConfig))
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
[
|
||||
"public/build.js"
|
||||
]
|
||||
File diff suppressed because it is too large
Load Diff
203
package.json
203
package.json
|
|
@ -1,99 +1,108 @@
|
|||
{
|
||||
"name": "tasks",
|
||||
"description": "Nextcloud - Tasks",
|
||||
"version": "0.9.8",
|
||||
"author": {
|
||||
"name": "Raimund Schlüßler",
|
||||
"email": "raimund.schluessler@mailbox.org"
|
||||
},
|
||||
"license": "AGPLv3",
|
||||
"private": true,
|
||||
"homepage": "https://github.com/nextcloud/tasks",
|
||||
"scripts": {
|
||||
"test": "jest --verbose",
|
||||
"prebuild": "npm install && npm upgrade",
|
||||
"build": "node node_modules/gulp-cli/bin/gulp.js build",
|
||||
"development": "node node_modules/gulp-cli/bin/gulp.js development",
|
||||
"watch": "node node_modules/gulp-cli/bin/gulp.js watch"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git@github.com:nextcloud/tasks.git"
|
||||
},
|
||||
"bugs": "https://github.com/nextcloud/tasks/issues",
|
||||
"contributors": [],
|
||||
"dependencies": {
|
||||
"axios": "^0.18.0",
|
||||
"vue": "^2.5.17",
|
||||
"vue-router": "3.0.1",
|
||||
"vuex": "^3.0.1",
|
||||
"ical.js": "~1.2.2",
|
||||
"jstimezonedetect": "",
|
||||
"ui-select": "git+https://github.com/angular-ui/ui-select.git#v0.19.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/test-utils": "^1.0.0-beta.24",
|
||||
"babel-core": "^6.26.3",
|
||||
"babel-jest": "^23.4.2",
|
||||
"babel-loader": "^7.1.5",
|
||||
"babel-preset-env": "^1.7.0",
|
||||
"cross-env": "^5.2.0",
|
||||
"css-loader": "^1.0.0",
|
||||
"expect": "^23.5.0",
|
||||
"file-loader": "^1.1.11",
|
||||
"gulp": "^3.9.1",
|
||||
"gulp-cli": "^2.0.1",
|
||||
"gulp-concat": "^2.6.1",
|
||||
"gulp-jshint": "^2.1.0",
|
||||
"gulp-stylelint": "^7.0.0",
|
||||
"gulp-svg-sprite": "1.4.0",
|
||||
"jest": "^23.5.0",
|
||||
"jest-serializer-vue": "^2.0.2",
|
||||
"jsdom": "^11.12.0",
|
||||
"jsdom-global": "^3.0.2",
|
||||
"jshint": "^2.9.6",
|
||||
"stylelint": "^9.4.0",
|
||||
"stylelint-config-standard": "^18.2.0",
|
||||
"stylelint-scss": "^3.2.0",
|
||||
"uglifyjs-webpack-plugin": "^1.2.7",
|
||||
"vue-jest": "^2.6.0",
|
||||
"vue-loader": "^15.3.0",
|
||||
"vue-template-compiler": "^2.5.17",
|
||||
"webpack": "^4.16.5",
|
||||
"webpack-cli": "^3.1.0",
|
||||
"webpack-dev-server": "^3.1.5",
|
||||
"webpack-merge": "^4.1.4",
|
||||
"webpack-node-externals": "^1.6.0",
|
||||
"webpack-stream": "^5.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
},
|
||||
"jest": {
|
||||
"moduleFileExtensions": [
|
||||
"js",
|
||||
"vue"
|
||||
],
|
||||
"moduleNameMapper": {
|
||||
"^@/(.*)$": "<rootDir>/js/app/$1"
|
||||
},
|
||||
"transform": {
|
||||
"^.+\\.js$": "<rootDir>/node_modules/babel-jest",
|
||||
".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
|
||||
},
|
||||
"snapshotSerializers": [
|
||||
"<rootDir>/node_modules/jest-serializer-vue"
|
||||
],
|
||||
"collectCoverage": true,
|
||||
"collectCoverageFrom": [
|
||||
"<rootDir>/js/app/**/*.{js,vue}",
|
||||
"!**/node_modules/**",
|
||||
"!**/vendor/**"
|
||||
],
|
||||
"coverageReporters": [
|
||||
"json",
|
||||
"text",
|
||||
"html"
|
||||
]
|
||||
}
|
||||
"name": "tasks",
|
||||
"description": "Nextcloud - Tasks",
|
||||
"version": "0.9.7",
|
||||
"author": {
|
||||
"name": "Raimund Schlüßler",
|
||||
"email": "raimund.schluessler@mailbox.org"
|
||||
},
|
||||
"license": "AGPLv3",
|
||||
"private": true,
|
||||
"homepage": "https://github.com/nextcloud/tasks",
|
||||
"scripts": {
|
||||
"test": "jest --verbose",
|
||||
"prebuild": "npm install && npm upgrade",
|
||||
"build": "node node_modules/gulp-cli/bin/gulp.js build",
|
||||
"lint": "eslint --ext .js,.vue src tests",
|
||||
"lint:fix": "eslint --ext .js,.vue src tests --fix",
|
||||
"dev": "node node_modules/gulp-cli/bin/gulp.js development",
|
||||
"watch": "webpack --progress --watch --config webpack.dev.js"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git@github.com:nextcloud/tasks.git"
|
||||
},
|
||||
"bugs": "https://github.com/nextcloud/tasks/issues",
|
||||
"contributors": [],
|
||||
"dependencies": {
|
||||
"axios": "^0.18.0",
|
||||
"babel-polyfill": "^6.26.0",
|
||||
"ical.js": "~1.2.2",
|
||||
"jstimezonedetect": "",
|
||||
"ui-select": "git+https://github.com/angular-ui/ui-select.git#v0.19.8",
|
||||
"vue": "^2.5.17",
|
||||
"vue-router": "3.0.1",
|
||||
"vuex": "^3.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/test-utils": "^1.0.0-beta.24",
|
||||
"babel-core": "^6.26.3",
|
||||
"babel-eslint": "^8.2.5",
|
||||
"babel-jest": "^23.4.2",
|
||||
"babel-loader": "^7.1.4",
|
||||
"babel-preset-env": "^1.7.0",
|
||||
"css-loader": "^1.0.0",
|
||||
"eslint": "^4.19.1",
|
||||
"eslint-config-standard": "^11.0.0",
|
||||
"eslint-friendly-formatter": "^4.0.1",
|
||||
"eslint-loader": "^2.0.0",
|
||||
"eslint-plugin-import": "^2.13.0",
|
||||
"eslint-plugin-node": "^6.0.1",
|
||||
"eslint-plugin-promise": "^3.8.0",
|
||||
"eslint-plugin-standard": "^3.1.0",
|
||||
"eslint-plugin-vue": "^4.5.0",
|
||||
"expect": "^23.5.0",
|
||||
"file-loader": "^1.1.11",
|
||||
"gulp": "^3.9.1",
|
||||
"gulp-cli": "^2.0.1",
|
||||
"gulp-svg-sprite": "1.4.0",
|
||||
"jest": "^23.5.0",
|
||||
"jest-serializer-vue": "^2.0.2",
|
||||
"prettier-eslint": "^8.8.2",
|
||||
"raw-loader": "^0.5.1",
|
||||
"sass-loader": "^7.0.3",
|
||||
"stylelint": "^8.4.0",
|
||||
"stylelint-config-recommended-scss": "^3.2.0",
|
||||
"stylelint-scss": "^3.1.3",
|
||||
"stylelint-webpack-plugin": "^0.10.5",
|
||||
"vue-jest": "^2.6.0",
|
||||
"vue-loader": "^15.4.1",
|
||||
"vue-template-compiler": "^2.5.17",
|
||||
"webpack": "^4.17.1",
|
||||
"webpack-cli": "^3.1.0",
|
||||
"webpack-dev-server": "^3.1.7",
|
||||
"webpack-merge": "^4.1.4",
|
||||
"webpack-node-externals": "^1.6.0",
|
||||
"webpack-stream": "^5.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
},
|
||||
"jest": {
|
||||
"moduleFileExtensions": [
|
||||
"js",
|
||||
"vue"
|
||||
],
|
||||
"moduleNameMapper": {
|
||||
"^@/(.*)$": "<rootDir>/src/$1"
|
||||
},
|
||||
"transform": {
|
||||
"^.+\\.js$": "<rootDir>/node_modules/babel-jest",
|
||||
".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
|
||||
},
|
||||
"snapshotSerializers": [
|
||||
"<rootDir>/node_modules/jest-serializer-vue"
|
||||
],
|
||||
"collectCoverage": true,
|
||||
"collectCoverageFrom": [
|
||||
"<rootDir>/src/**/*.{js,vue}",
|
||||
"!**/node_modules/**",
|
||||
"!**/vendor/**"
|
||||
],
|
||||
"coverageReporters": [
|
||||
"json",
|
||||
"text",
|
||||
"html"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,12 +18,12 @@ You should have received a copy of the GNU Affero General Public
|
|||
License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
-->
|
||||
|
||||
|
||||
<template>
|
||||
<div id="content" class="app-tasks">
|
||||
<div id="app-navigation">
|
||||
<theList/>
|
||||
<theSettings/>
|
||||
<theList />
|
||||
<theSettings />
|
||||
</div>
|
||||
|
||||
<div id="app-content"
|
||||
|
|
@ -39,15 +39,15 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-click="focusTaskInput()"
|
||||
class="transparent"
|
||||
ng-model="status.taskName"
|
||||
ng-keydown="checkTaskInput($event)"/>
|
||||
<!-- placeholder="{{ getAddString() }}"/> -->
|
||||
ng-keydown="checkTaskInput($event)">
|
||||
<!-- placeholder="{{ getAddString() }}"> -->
|
||||
</form>
|
||||
</div>
|
||||
<div class="app-navigation-entry-utils">
|
||||
<div class="app-navigation-entry-utils-menu-button" title="<?php p($l->t('Change sort order')); ?>">
|
||||
<button class="sortorder-dropdown-button">
|
||||
<span class="icon" ng-class="getSortOrderIcon()"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon" ng-class="getSortOrderIcon()" />
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -55,65 +55,65 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<ul>
|
||||
<li ng-click="setSortOrder($event, 'default')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'default'}" class="handler">
|
||||
<a>
|
||||
<span class="icon icon-list"></span>
|
||||
<span class="icon icon-list" />
|
||||
<span class="label">{{ t('tasks', 'Default') }}</span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</a>
|
||||
</li>
|
||||
<li ng-click="setSortOrder($event, 'due')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'due'}">
|
||||
<a>
|
||||
<span class="icon icon-calendar"></span>
|
||||
<span class="icon icon-calendar" />
|
||||
<span class="label">{{ t('tasks', 'Due date') }}</span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</a>
|
||||
</li>
|
||||
<li ng-click="setSortOrder($event, 'start')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'start'}">
|
||||
<a>
|
||||
<span class="icon icon-calendar"></span>
|
||||
<span class="icon icon-calendar" />
|
||||
<span class="label">{{ t('tasks', 'Start date') }}</span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</a>
|
||||
</li>
|
||||
<li ng-click="setSortOrder($event, 'priority')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'priority'}">
|
||||
<a>
|
||||
<span class="icon icon-task-star"></span>
|
||||
<span class="icon icon-task-star" />
|
||||
<span class="label">{{ t('tasks', 'Priority') }}</span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</a>
|
||||
</li>
|
||||
<li ng-click="setSortOrder($event, 'alphabetically')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'alphabetically'}">
|
||||
<a>
|
||||
<span class="icon icon-alphabetically"></span>
|
||||
<span class="icon icon-alphabetically" />
|
||||
<span class="label">{{ t('tasks', 'Alphabetically') }}</span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</a>
|
||||
</li>
|
||||
<!-- <li ng-click="setSortOrder($event, 'manual')" ng-class="{active: settingsmodel.getById('various').sortOrder == 'manual'}">
|
||||
<a>
|
||||
<span class="icon icon-manual"></span>
|
||||
<span class="icon icon-manual" />
|
||||
<span class="label">{{ t('tasks', 'Manually') }</span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}"></span>
|
||||
<span class="icon sort-indicator" ng-class="{'icon-sort-up': settingsmodel.getById('various').sortDirection, 'icon-sort-down': !settingsmodel.getById('various').sortDirection}" />
|
||||
</a>
|
||||
</li> -->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="task-list">
|
||||
<router-view />
|
||||
<div id="searchresults"></div>
|
||||
<div id="searchresults" />
|
||||
<div class="task-item template">
|
||||
<div class="task-body">
|
||||
<div class="percentdone"></div>
|
||||
<div class="percentdone" />
|
||||
<a class="task-checkbox" name="toggleCompleted" ng-click="toggleCompleted()">
|
||||
<span class="icon task-checkbox"></span>
|
||||
<span class="icon task-checkbox" />
|
||||
</a>
|
||||
<a class="icon task-separator"></a>
|
||||
<a class="icon task-separator" />
|
||||
<a class="task-star" ng-click="toggleStarred(task.id)">
|
||||
<span class="icon task-star faded"></span>
|
||||
<span class="icon task-star faded" />
|
||||
</a>
|
||||
<!-- <a class="duedate" ng-class="{overdue: TasksModel.overdue(task.due)}">{{ task.due | dateTaskList }}</a> -->
|
||||
<div class="title-wrapper">
|
||||
<span class="title"></span>
|
||||
<span class="icon task-attachment"></span>
|
||||
<span class="title" />
|
||||
<span class="icon task-attachment" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -122,19 +122,18 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
|
||||
<div id="app-sidebar">
|
||||
<theDetails/>
|
||||
<theDetails />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import TheList from './components/TheList.vue';
|
||||
import TheSettings from './components/TheSettings.vue';
|
||||
import TheDetails from './components/TheDetails.vue';
|
||||
import TheList from './components/TheList'
|
||||
import TheSettings from './components/TheSettings'
|
||||
import TheDetails from './components/TheDetails'
|
||||
|
||||
export default {
|
||||
name: 'app',
|
||||
name: 'App',
|
||||
components: {
|
||||
'theSettings': TheSettings,
|
||||
'theList': TheList,
|
||||
|
|
@ -24,19 +24,17 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<li ng-repeat="color in colors"
|
||||
ng-class="{ selected: (color===selected) }"
|
||||
ng-click="pick(color)"
|
||||
ng-style="{ 'background-color':color}; "></li>
|
||||
ng-style="{ 'background-color':color}; " />
|
||||
<li class="randomcolour"
|
||||
ng-click="randomizeColour()"
|
||||
ng-style="{ 'background-color':random}; ">
|
||||
<span class="icon icon-random"></span>
|
||||
<span class="icon icon-random" />
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
|
||||
export default {
|
||||
name: 'colorpicker'
|
||||
}
|
||||
export default {
|
||||
name: 'Colorpicker'
|
||||
}
|
||||
</script>
|
||||
|
|
@ -21,56 +21,53 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
|
||||
<template>
|
||||
<div class="task-body-component">
|
||||
<div class="task-body"
|
||||
<div :taskID="task.uri"
|
||||
class="task-body"
|
||||
type="task"
|
||||
:taskID="task.uri"
|
||||
ng-class="{active: route.taskID==task.uri, subtasks: hasSubtasks(task), completedsubtasks: hasCompletedSubtasks(task), subtaskshidden: task.hideSubtasks, attachment: task.note!=''}">
|
||||
|
||||
<div class="percentbar" ng-if="task.complete > 0 ">
|
||||
<div class="percentdone"
|
||||
:style="{ width: task.complete, 'background-color': task.calendar.color }">
|
||||
<div :style="{ width: task.complete, 'background-color': task.calendar.color }"
|
||||
class="percentdone">
|
||||
<!-- aria-label="{{ task.complete | percentDetails}}"> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a class="task-checkbox handler"
|
||||
<a :aria-checked="task.completed"
|
||||
:aria-label="t('tasks', 'Task is completed')"
|
||||
class="task-checkbox handler"
|
||||
name="toggleCompleted"
|
||||
ng-click="toggleCompleted(task)"
|
||||
role="checkbox"
|
||||
:aria-checked="task.completed"
|
||||
:aria-label="t('tasks', 'Task is completed')">
|
||||
<span class="icon task-checkbox reactive" :class="{'icon-checkmark': task.completed}"></span>
|
||||
role="checkbox">
|
||||
<span :class="{'icon-checkmark': task.completed}" class="icon task-checkbox reactive" />
|
||||
</a>
|
||||
<a class="icon task-separator"></a>
|
||||
<a class="icon task-separator" />
|
||||
<a class="task-star handler" ng-click="toggleStarred(task)">
|
||||
<span class="icon icon-task-star right large reactive" :class="{'icon-task-star-high':task.priority > 5, 'icon-task-star-medium':task.priority == 5, 'icon-task-star-low':task.priority > 0 && task.priority < 5}">
|
||||
</span>
|
||||
<span :class="{'icon-task-star-high':task.priority > 5, 'icon-task-star-medium':task.priority == 5, 'icon-task-star-low':task.priority > 0 && task.priority < 5}" class="icon icon-task-star right large reactive" />
|
||||
</a>
|
||||
<a class="task-addsubtask handler add-subtask"
|
||||
ng-show="task.calendar.writable"
|
||||
ng-click="showSubtaskInput(task.uid)"
|
||||
oc-click-focus="{selector: '.add-subtask input', timeout: 0}">
|
||||
<span class="icon icon-add right large reactive" :title="t('tasks', 'Add a subtask to subtasks') + ' ' + task.summary"></span>
|
||||
<span :title="t('tasks', 'Add a subtask to subtasks') + ' ' + task.summary" class="icon icon-add right large reactive" />
|
||||
</a>
|
||||
<a class="handler" ng-click="toggleSubtasks(task)">
|
||||
<span class="icon right large subtasks reactive"
|
||||
ng-class="task.hideSubtasks ? 'icon-subtasks-hidden' : 'icon-subtasks-visible'"
|
||||
:title="t('tasks', 'Toggle subtasks')">
|
||||
</span>
|
||||
<span :title="t('tasks', 'Toggle subtasks')"
|
||||
class="icon right large subtasks reactive"
|
||||
ng-class="task.hideSubtasks ? 'icon-subtasks-hidden' : 'icon-subtasks-visible'" />
|
||||
</a>
|
||||
<a class="handler" ng-click="toggleCompletedSubtasks(task)">
|
||||
<span class="icon icon-toggle right large toggle-completed-subtasks reactive"
|
||||
ng-class="{'active': !task.hideCompletedSubtasks}"
|
||||
:title="t('tasks', 'Toggle completed subtasks')">
|
||||
</span>
|
||||
<span :title="t('tasks', 'Toggle completed subtasks')"
|
||||
class="icon icon-toggle right large toggle-completed-subtasks reactive"
|
||||
ng-class="{'active': !task.hideCompletedSubtasks}" />
|
||||
</a>
|
||||
<a>
|
||||
<span class="icon icon-note right large"></span>
|
||||
<span class="icon icon-note right large" />
|
||||
</a>
|
||||
<!-- <a class="duedate" ng-class="{overdue: TasksModel.overdue(task.due)}">{{ task.due | dateTaskList }}</a> -->
|
||||
<a ng-show="route.collectionID=='week'" class="listname" >{{ task.calendar.displayname }}</a>
|
||||
<a ng-show="route.collectionID=='week'" class="listname">{{ task.calendar.displayname }}</a>
|
||||
<div class="title-wrapper">
|
||||
<span class="title" ng-bind-html="task.summary | linky:'_blank':{rel: 'nofollow'}"></span>
|
||||
<span class="title" ng-bind-html="task.summary | linky:'_blank':{rel: 'nofollow'}" />
|
||||
<span class="categories-list">
|
||||
<ul>
|
||||
<li ng-repeat="category in task.categories"><span>{{ category }}</span></li>
|
||||
|
|
@ -80,8 +77,8 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
<div class="subtasks-container"
|
||||
ng-class="{subtaskshidden: hideSubtasks(task)}">
|
||||
<ol dnd-list="draggedTasks"
|
||||
:calendarID="task.calendar.uri"
|
||||
<ol :calendarID="task.calendar.uri"
|
||||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropAsSubtask(event, item, index)"
|
||||
dnd-dragover="dragover(event, index)">
|
||||
<li class="task-item ui-draggable handler add-subtask"
|
||||
|
|
@ -91,15 +88,15 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-disabled="isAddingTask"
|
||||
ng-click="focusInput()"
|
||||
ng-model="status.subtaskName"
|
||||
ng-keydown="checkTaskInput($event)"/>
|
||||
ng-keydown="checkTaskInput($event)">
|
||||
<!-- placeholder="{{ getSubAddString(task.summary) }}"/> -->
|
||||
</form>
|
||||
</li>
|
||||
<li :taskID="task.uri"
|
||||
:class="{done: task.completed}"
|
||||
class="task-item ui-draggable handler subtask"
|
||||
ng-repeat="task in getSubTasks(filtered,task) | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"
|
||||
ng-click="openDetails(task.uri,$event)"
|
||||
:class="{done: task.completed}"
|
||||
dnd-draggable="task"
|
||||
dnd-dragstart="dragStart(event)"
|
||||
dnd-dragend="dragEnd(event)">
|
||||
|
|
@ -112,13 +109,13 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'task-body-component',
|
||||
computed: mapState({
|
||||
}),
|
||||
components: {
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'TaskBodyComponent',
|
||||
components: {
|
||||
},
|
||||
computed: mapState({
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
|
@ -23,46 +23,46 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<div>
|
||||
<div class="grouped-tasks"
|
||||
ng-class="{'completed-hidden':!settingsmodel.getById('various').showHidden}">
|
||||
<ol class="tasks"
|
||||
:calendarID="$route.params.calendarId"
|
||||
<ol :calendarID="$route.params.calendarId"
|
||||
class="tasks"
|
||||
collectionID="uncompleted"
|
||||
type="list"
|
||||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropAsRootTask(event, item, index)"
|
||||
dnd-dragover="dragover(event, index)">
|
||||
<li class="task-item ui-draggable handler"
|
||||
<li v-for="task in tasks"
|
||||
:taskID="task.uri"
|
||||
:key="task.id"
|
||||
class="task-item ui-draggable handler"
|
||||
ng-click="openDetails(task.uri,$event)"
|
||||
ng-class="{done: task.completed}"
|
||||
dnd-draggable="task"
|
||||
dnd-dragstart="dragStart(event)"
|
||||
dnd-dragend="dragEnd(event)"
|
||||
v-for="task in tasks"
|
||||
:key="task.id">
|
||||
dnd-dragend="dragEnd(event)">
|
||||
<!-- ng-repeat="task in filtered = filteredTasks() | filter:hasNoParent(task) | filter:filterTasks(task,route.calendarID) | filter:{'completed':'false'} | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"> -->
|
||||
<!-- dnd-effect-allowed="{{ allow(task) }}"> -->
|
||||
<task />
|
||||
<task />
|
||||
</li>
|
||||
</ol>
|
||||
<h2 class="heading-hiddentasks icon-triangle-s handler" ng-show="getCount(route.calendarID,'completed')" ng-click="toggleHidden()">
|
||||
<!-- {{ getCountString(route.calendarID,'completed') }} -->
|
||||
</h2>
|
||||
<ol class="completed-tasks"
|
||||
:calendarID="$route.params.calendarId"
|
||||
<ol :calendarID="$route.params.calendarId"
|
||||
class="completed-tasks"
|
||||
collectionID="completed"
|
||||
type="list"
|
||||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropAsRootTask(event, item, index)"
|
||||
dnd-dragover="dragover(event, index)">
|
||||
<li class="task-item handler"
|
||||
<li v-for="task in tasks"
|
||||
:taskID="task.uri"
|
||||
:key="task.id"
|
||||
class="task-item handler"
|
||||
ng-click="openDetails(task.uri,$event)"
|
||||
ng-class="{done: task.completed}"
|
||||
dnd-draggable="task"
|
||||
dnd-dragstart="dragStart(event)"
|
||||
dnd-dragend="dragEnd(event)"
|
||||
v-for="task in tasks"
|
||||
:key="task.id">
|
||||
dnd-dragend="dragEnd(event)">
|
||||
<!-- ng-repeat="task in filtered = filteredTasks() | filter:hasNoParent(task) | filter:filterTasks(task,route.calendarID) | filter:{'completed':true} | orderBy:'completed_date':true"> -->
|
||||
<!-- dnd-effect-allowed="{{ allow(task) }}"> -->
|
||||
<task />
|
||||
|
|
@ -76,17 +76,17 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import Task from '../Task.vue';
|
||||
import { mapState } from 'vuex'
|
||||
import Task from '../Task'
|
||||
|
||||
export default {
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
tasks: state => state.tasks
|
||||
})
|
||||
),
|
||||
components: {
|
||||
'task': Task
|
||||
}
|
||||
}
|
||||
export default {
|
||||
components: {
|
||||
'task': Task
|
||||
},
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
tasks: state => state.tasks
|
||||
})
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -24,28 +24,28 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<div>
|
||||
<div v-for="calendar in calendars"
|
||||
:key="calendar.id"
|
||||
class="grouped-tasks ui-droppable"
|
||||
:rel="calendar.uri">
|
||||
:rel="calendar.uri"
|
||||
class="grouped-tasks ui-droppable">
|
||||
<h2 class="heading">
|
||||
<text>{{ calendar.displayname }}</text>
|
||||
</h2>
|
||||
<ol class="tasks"
|
||||
:calendarID="calendar.uri"
|
||||
<ol :calendarID="calendar.uri"
|
||||
:collectionID="$route.params.collectionId"
|
||||
class="tasks"
|
||||
type="list"
|
||||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropAsRootTask(event, item, index)"
|
||||
dnd-dragover="dragover(event, index)">
|
||||
<li class="task-item ui-draggable handler"
|
||||
<li v-for="task in tasks"
|
||||
:taskID="task.uri"
|
||||
:key="task.id"
|
||||
class="task-item ui-draggable handler"
|
||||
ng-animate="'animate'"
|
||||
ng-click="openDetails(task.uri,$event)"
|
||||
ng-class="{done: task.completed}"
|
||||
dnd-draggable="task"
|
||||
dnd-dragstart="dragStart(event)"
|
||||
dnd-dragend="dragEnd(event)"
|
||||
v-for="task in tasks"
|
||||
:key="task.id">
|
||||
dnd-dragend="dragEnd(event)">
|
||||
<!-- ng-repeat="task in filtered = filteredTasks() | filter:hasNoParent(task) | filter:filterTasks(task,calendar.uri) | filter:filterTasks(task,route.collectionID) | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"> -->
|
||||
<!-- dnd-effect-allowed="{{ allow(task) }}"> -->
|
||||
<task-body />
|
||||
|
|
@ -59,18 +59,18 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import TaskBody from '../Task.vue';
|
||||
import { mapState } from 'vuex'
|
||||
import TaskBody from '../Task'
|
||||
|
||||
export default {
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
calendars: state => state.calendars,
|
||||
tasks: state => state.tasks
|
||||
})
|
||||
),
|
||||
components: {
|
||||
'task-body': TaskBody
|
||||
}
|
||||
}
|
||||
export default {
|
||||
components: {
|
||||
'task-body': TaskBody
|
||||
},
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
calendars: state => state.calendars,
|
||||
tasks: state => state.tasks
|
||||
})
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -24,23 +24,23 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<h2 class="heading">
|
||||
<!-- <text>{{ day | day }}</text> -->
|
||||
</h2>
|
||||
<ol class="tasks"
|
||||
<ol :collectionID="$route.params.collectionId"
|
||||
class="tasks"
|
||||
listID=""
|
||||
:collectionID="$route.params.collectionId"
|
||||
type="list"
|
||||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropAsRootTask(event, item, index)"
|
||||
dnd-dragover="dragover(event, index)">
|
||||
<li class="task-item ui-draggable handler"
|
||||
<li v-for="task in tasks"
|
||||
:taskID="task.uri"
|
||||
:key="task.id"
|
||||
class="task-item ui-draggable handler"
|
||||
ng-animate="'animate'"
|
||||
ng-click="openDetails(task.uri,$event)"
|
||||
ng-class="{done: task.completed}"
|
||||
dnd-draggable="task"
|
||||
dnd-dragstart="dragStart(event)"
|
||||
dnd-dragend="dragEnd(event)"
|
||||
v-for="task in tasks"
|
||||
:key="task.id">
|
||||
dnd-dragend="dragEnd(event)">
|
||||
<!-- ng-repeat="task in filtered = filteredTasks() | filter:taskAtDay(task,day) | filter:hasNoParent(task) | filter:{'completed':'false'} | orderBy:getSortOrder():settingsmodel.getById('various').sortDirection"> -->
|
||||
<!-- dnd-effect-allowed="{{ allow(task) }}"> -->
|
||||
<task />
|
||||
|
|
@ -50,17 +50,17 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import Task from '../Task.vue';
|
||||
import { mapState } from 'vuex'
|
||||
import Task from '../Task'
|
||||
|
||||
export default {
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
tasks: state => state.tasks
|
||||
})
|
||||
),
|
||||
components: {
|
||||
'task': Task
|
||||
}
|
||||
}
|
||||
export default {
|
||||
components: {
|
||||
'task': Task
|
||||
},
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
tasks: state => state.tasks
|
||||
})
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -26,32 +26,30 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-show="TaskState()=='found'"
|
||||
ng-class="{'disabled': !task.calendar.writable}">
|
||||
<div class="title" ng-class="{'editing':route.parameter=='name'}">
|
||||
<a class="checkbox reactive"
|
||||
<a :aria-checked="task.completed"
|
||||
:aria-label="t('tasks', 'Task is completed')"
|
||||
class="checkbox reactive"
|
||||
ng-click="toggleCompleted(task)"
|
||||
role="checkbox"
|
||||
:aria-checked="task.completed"
|
||||
:aria-label="t('tasks', 'Task is completed')">
|
||||
<span class="icon detail-checkbox" ng-class="{'icon-checkmark':task.completed, 'disabled': !task.calendar.writable}"></span>
|
||||
role="checkbox">
|
||||
<span class="icon detail-checkbox" ng-class="{'icon-checkmark':task.completed, 'disabled': !task.calendar.writable}" />
|
||||
</a>
|
||||
<a class="star reactive" ng-click="toggleStarred(task)">
|
||||
<span class="icon icon-task-star"
|
||||
:class="{'icon-task-star-high': task.priority>5, 'icon-task-star-medium':task.priority==5, 'icon-task-star-low':task.priority > 0 && task.priority < 5, 'disabled': !task.calendar.writable}"></span>
|
||||
<span :class="{'icon-task-star-high': task.priority>5, 'icon-task-star-medium':task.priority==5, 'icon-task-star-low':task.priority > 0 && task.priority < 5, 'disabled': !task.calendar.writable}"
|
||||
class="icon icon-task-star" />
|
||||
</a>
|
||||
<div class="title-text handler"
|
||||
:class="{'strike-through':task.completed}"
|
||||
<div :class="{'strike-through':task.completed}"
|
||||
class="title-text handler"
|
||||
ng-click="editName($event, task)"
|
||||
oc-click-focus="{selector: '#editName', timeout: 0}"
|
||||
ng-bind-html="task.summary | linky:'_blank':{rel: 'nofollow'}">
|
||||
</div>
|
||||
ng-bind-html="task.summary | linky:'_blank':{rel: 'nofollow'}" />
|
||||
<div class="expandable-container handler">
|
||||
<div class="expandingArea active">
|
||||
<pre><span>{{ task.summary }}</span><br /></pre>
|
||||
<pre><span>{{ task.summary }}</span><br></pre>
|
||||
<textarea id="editName"
|
||||
maxlength="200"
|
||||
ng-model="task.summary"
|
||||
ng-keydown="endName($event)"
|
||||
ng-change="triggerUpdate(task)">
|
||||
</textarea>
|
||||
ng-change="triggerUpdate(task)" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -62,7 +60,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-click="editStart($event, task)">
|
||||
<div>
|
||||
<span class="icon icon-calendar" ng-class="{'icon-calendar-due':isDue(task.start),
|
||||
'icon-calendar-overdue':isOverDue(task.start)}"></span>
|
||||
'icon-calendar-overdue':isOverDue(task.start)}" />
|
||||
<span class="section-title">
|
||||
<!-- <text>{{ task.start | startDetails }}</text> -->
|
||||
</span>
|
||||
|
|
@ -84,10 +82,10 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
<div class="utils">
|
||||
<a>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive" />
|
||||
</a>
|
||||
<a class="handler end-edit" ng-click="deleteStartDate(task)">
|
||||
<span class="icon icon-trash reactive"></span>
|
||||
<span class="icon icon-trash reactive" />
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
|
@ -95,7 +93,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-class="{'date':isDue(task.due), 'editing':route.parameter=='duedate', 'high':isOverDue(task.due)}"
|
||||
ng-click="editDueDate($event, task)">
|
||||
<div>
|
||||
<span class="icon icon-calendar" ng-class="{'icon-calendar-due':isDue(task.due), 'icon-calendar-overdue':isOverDue(task.due)}"></span>
|
||||
<span class="icon icon-calendar" ng-class="{'icon-calendar-due':isDue(task.due), 'icon-calendar-overdue':isOverDue(task.due)}" />
|
||||
<span class="section-title">
|
||||
<!-- <text>{{ task.due | dateDetails }}</text> -->
|
||||
</span>
|
||||
|
|
@ -117,20 +115,20 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
<div class="utils">
|
||||
<a>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive" />
|
||||
</a>
|
||||
<a class="handler end-edit" ng-click="deleteDueDate(task)">
|
||||
<span class="icon icon-trash reactive"></span>
|
||||
<span class="icon icon-trash reactive" />
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="section detail-all-day handler reactive"
|
||||
<li :aria-checked="task.allDay"
|
||||
class="section detail-all-day handler reactive"
|
||||
ng-click="toggleAllDay(task)"
|
||||
ng-if="isAllDayPossible(task)"
|
||||
role="checkbox"
|
||||
:aria-checked="task.allDay">
|
||||
role="checkbox">
|
||||
<div>
|
||||
<span class="icon detail-checkbox" ng-class="{'icon-checkmark': task.allDay, 'disabled': !task.calendar.writable}"></span>
|
||||
<span class="icon detail-checkbox" ng-class="{'icon-checkmark': task.allDay, 'disabled': !task.calendar.writable}" />
|
||||
<span class="section-title">
|
||||
<text>{{ t('tasks', 'All day') }}</text>
|
||||
</span>
|
||||
|
|
@ -140,8 +138,8 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-class="{'editing':route.parameter=='priority','high':task.priority>5,'medium':task.priority==5,'low':task.priority > 0 && task.priority < 5, 'date':task.priority>0}"
|
||||
ng-click="editPriority($event, task)">
|
||||
<div>
|
||||
<span class="icon icon-task-star"
|
||||
:class="{'icon-task-star-high':task.priority>5,'icon-task-star-medium':task.priority==5,'icon-task-star-low':task.priority > 0 && task.priority < 5}"></span>
|
||||
<span :class="{'icon-task-star-high':task.priority>5,'icon-task-star-medium':task.priority==5,'icon-task-star-low':task.priority > 0 && task.priority < 5}"
|
||||
class="icon icon-task-star" />
|
||||
<span class="section-title">
|
||||
<!-- <text>{{ task.priority | priorityDetails}}</text> -->
|
||||
</span>
|
||||
|
|
@ -160,10 +158,10 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
<div class="utils">
|
||||
<a>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive" />
|
||||
</a>
|
||||
<a class="handler end-edit" ng-click="deletePriority(task)">
|
||||
<span class="icon icon-trash reactive"></span>
|
||||
<span class="icon icon-trash reactive" />
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
|
@ -171,7 +169,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-class="{'editing':route.parameter=='percent', 'date':task.complete>0}"
|
||||
ng-click="editPercent($event, task)">
|
||||
<div>
|
||||
<span class="icon icon-percent" ng-class="{'icon-percent-active':task.complete>0}"></span>
|
||||
<span class="icon icon-percent" ng-class="{'icon-percent-active':task.complete>0}" />
|
||||
<span class="section-title">
|
||||
<!-- <text>{{ task.complete | percentDetails}}</text> -->
|
||||
</span>
|
||||
|
|
@ -190,17 +188,17 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
<div class="utils">
|
||||
<a>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive"></span>
|
||||
<span class="icon detail-save icon-checkmark-color handler end-edit reactive" />
|
||||
</a>
|
||||
<a class="handler end-edit" ng-click="deletePercent(task)">
|
||||
<span class="icon icon-trash reactive"></span>
|
||||
<span class="icon icon-trash reactive" />
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="section detail-categories" ng-class="{'active':task.cats.length>0}">
|
||||
<div>
|
||||
<span class="icon icon-tag detail-categories" ng-class="{'icon-tag-active':task.cats.length>0}"></span>
|
||||
<!-- Edit line 1080 to show placeholder -->
|
||||
<span class="icon icon-tag detail-categories" ng-class="{'icon-tag-active':task.cats.length>0}" />
|
||||
<!-- Edit line 1080 to show placeholder -->
|
||||
<div class="detail-categories-container">
|
||||
<!-- <ui-select
|
||||
multiple
|
||||
|
|
@ -226,11 +224,11 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
ng-click="editNote($event, task)"
|
||||
oc-click-focus="{selector: '.expandingArea textarea', timeout: 0}">
|
||||
<div class="content-fakeable" ng-class="{'editing':route.parameter=='note'}">
|
||||
<div class="display-view" ng-bind-html="task.note | linky:'_blank':{rel: 'nofollow'}"></div>
|
||||
<div class="display-view" ng-bind-html="task.note | linky:'_blank':{rel: 'nofollow'}" />
|
||||
<div class="edit-view">
|
||||
<div class="expandingArea active">
|
||||
<pre><span>{{ task.note }}</span><br /><br /></pre>
|
||||
<textarea ng-model="task.note" ng-change="triggerUpdate(task)"></textarea>
|
||||
<pre><span>{{ task.note }}</span><br><br></pre>
|
||||
<textarea ng-model="task.note" ng-change="triggerUpdate(task)" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -243,10 +241,10 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<a class="handler left close-all reactive"
|
||||
ng-click="deleteTask(task)"
|
||||
ng-show="task.calendar.writable">
|
||||
<span class="icon icon-trash"></span>
|
||||
<span class="icon icon-trash" />
|
||||
</a>
|
||||
<a class="handler right close-all reactive">
|
||||
<span class="icon icon-hide"></span>
|
||||
<span class="icon icon-hide" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -261,26 +259,26 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
computed: mapState({
|
||||
}),
|
||||
components: {
|
||||
},
|
||||
data: function () {
|
||||
return {
|
||||
task: {
|
||||
calendar: {
|
||||
writable: true
|
||||
},
|
||||
complete: 4,
|
||||
completed: false,
|
||||
priority: 5,
|
||||
cats: [],
|
||||
note: "Migrate this app to vue."
|
||||
}
|
||||
};
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
data: function() {
|
||||
return {
|
||||
task: {
|
||||
calendar: {
|
||||
writable: true
|
||||
},
|
||||
complete: 4,
|
||||
completed: false,
|
||||
priority: 5,
|
||||
cats: [],
|
||||
note: 'Migrate this app to vue.'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: mapState({
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
|
@ -23,19 +23,19 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<ul id="collections">
|
||||
<router-link
|
||||
v-for="collection in collections"
|
||||
tag="li"
|
||||
v-bind:id="'collection_' + collection.id"
|
||||
v-bind:collectionID="collection.id"
|
||||
:id="'collection_' + collection.id"
|
||||
:collection-id="collection.id"
|
||||
:to="'/collections/' + collection.id"
|
||||
:key="collection.id"
|
||||
class="collection reactive" :class="collection.icon"
|
||||
:class="collection.icon"
|
||||
tag="li" class="collection reactive"
|
||||
active-class="active"
|
||||
ng-class="{'animate-up': hideCollection(collection.id)}"
|
||||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropCollection(event, index, item)"
|
||||
dnd-dragover="dragoverCollection(event, index)">
|
||||
<a class="sprite">
|
||||
<span class="date" v-if="collection.id=='today'">{{ dayOfMonth }}</span>
|
||||
<span v-if="collection.id=='today'" class="date">{{ dayOfMonth }}</span>
|
||||
<span class="title">{{ collection.displayname }}</span>
|
||||
</a>
|
||||
<div class="app-navigation-entry-utils">
|
||||
|
|
@ -46,11 +46,11 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</router-link>
|
||||
<router-link
|
||||
v-for="calendar in calendars"
|
||||
tag="li"
|
||||
v-bind:id="'list_' + calendar.uri"
|
||||
v-bind:calendarID="calendar.uri"
|
||||
:id="'list_' + calendar.uri"
|
||||
:calendar-id="calendar.uri"
|
||||
:to="'/calendars/' + calendar.uri"
|
||||
:key="calendar.uri"
|
||||
tag="li"
|
||||
class="list with-menu handler editing"
|
||||
active-class="active"
|
||||
ng-class="edit:route.listparameter == 'name' && route.calendarID == calendar.uri,
|
||||
|
|
@ -58,38 +58,37 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
dnd-list="draggedTasks"
|
||||
dnd-drop="dropList(event, index, item)"
|
||||
dnd-dragover="dragoverList(event, index)">
|
||||
<div class="app-navigation-entry-bullet" :style="'background-color: ' + calendar.color + ';'"></div>
|
||||
<div :style="'background-color: ' + calendar.color + ';'" class="app-navigation-entry-bullet" />
|
||||
<a ng-dblclick="startRename(calendar)">
|
||||
<span class="title">{{ calendar.displayname }}</span>
|
||||
</a>
|
||||
<div class="app-navigation-entry-utils">
|
||||
<ul>
|
||||
<!-- <li class="app-navigation-entry-utils-counter">{{ getListCount(calendar.uri,'all') | counterFormatter }}</li> -->
|
||||
<li class="app-navigation-entry-utils-menu-button" v-show="calendar.writable"><button></button></li>
|
||||
<li v-show="calendar.writable" class="app-navigation-entry-utils-menu-button"><button /></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="app-navigation-entry-menu" v-show="calendar.writable">
|
||||
<div v-show="calendar.writable" class="app-navigation-entry-menu">
|
||||
<ul>
|
||||
<li>
|
||||
<a ng-click="startEdit(calendar)">
|
||||
<span class="icon-rename"></span>
|
||||
<span class="icon-rename" />
|
||||
<span>{{ t('tasks', 'Edit') }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a ng-click="showCalDAVUrl(calendar)">
|
||||
<span class="icon-public"></span>
|
||||
<span class="icon-public" />
|
||||
<span>{{ t('tasks', 'Link') }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a :href="calendar.exportUrl" :download="calendar.uri + '.ics'">
|
||||
<span class="icon-download"></span>
|
||||
<span class="icon-download" />
|
||||
<span>{{ t('tasks', 'Download') }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li confirmation="delete(calendar)" confirmation-message="deleteMessage(calendar)">
|
||||
</li>
|
||||
<li confirmation="delete(calendar)" confirmation-message="deleteMessage(calendar)" />
|
||||
</ul>
|
||||
</div>
|
||||
<div class="app-navigation-entry-edit name" ng-class="{error: nameError}">
|
||||
|
|
@ -99,30 +98,30 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
type="text"
|
||||
ng-keyup="checkEdit($event,calendar)"
|
||||
autofocus-on-insert>
|
||||
<input type="cancel"
|
||||
<input :title="t('tasks', 'Cancel')"
|
||||
type="cancel"
|
||||
value=""
|
||||
class="action icon-close"
|
||||
ng-click="cancelEdit(calendar)"
|
||||
v-bind:title="t('tasks', 'Cancel')">
|
||||
<input type="submit"
|
||||
ng-click="cancelEdit(calendar)">
|
||||
<input :title="t('tasks', 'Save')"
|
||||
type="submit"
|
||||
value=""
|
||||
class="action icon-checkmark"
|
||||
ng-click="saveEdit(calendar)"
|
||||
v-bind:title="t('tasks', 'Save')">
|
||||
ng-click="saveEdit(calendar)">
|
||||
</form>
|
||||
<colorpicker class="colorpicker" selected="calendar.color"/>
|
||||
<colorpicker class="colorpicker" selected="calendar.color" />
|
||||
</div>
|
||||
<div class="app-navigation-entry-edit caldav">
|
||||
<form>
|
||||
<input class="caldav"
|
||||
ng-value="calendar.caldav"
|
||||
readonly
|
||||
type="text"/>
|
||||
<input type="cancel"
|
||||
type="text">
|
||||
<input :title="t('tasks', 'Cancel')"
|
||||
type="cancel"
|
||||
value=""
|
||||
class="action icon-close"
|
||||
ng-click="hideCalDAVUrl()"
|
||||
v-bind:title="t('tasks', 'Cancel')">
|
||||
ng-click="hideCalDAVUrl()">
|
||||
</form>
|
||||
</div>
|
||||
</router-link>
|
||||
|
|
@ -135,43 +134,43 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<div class="app-navigation-entry-edit name" ng-class="{error: nameError}">
|
||||
<form ng-disabled="isAddingList">
|
||||
<input id="newList"
|
||||
:placeholder="t('tasks', 'New List')"
|
||||
ng-model="status.newListName"
|
||||
class="edit hasTooltip"
|
||||
type="text"
|
||||
autofocus-on-insert
|
||||
v-bind:placeholder="t('tasks', 'New List')"
|
||||
ng-keyup="checkNew($event,status.newListName)">
|
||||
<input type="cancel"
|
||||
<input :title="t('tasks', 'Cancel')"
|
||||
type="cancel"
|
||||
value=""
|
||||
class="action icon-close"
|
||||
ng-click="cancelCreate()"
|
||||
v-bind:title="t('tasks', 'Cancel')">
|
||||
<input type="submit"
|
||||
ng-click="cancelCreate()">
|
||||
<input :title="t('tasks', 'Save')"
|
||||
type="submit"
|
||||
value=""
|
||||
class="action icon-checkmark"
|
||||
ng-click="create($event)"
|
||||
v-bind:title="t('tasks', 'Save')">
|
||||
ng-click="create($event)">
|
||||
</form>
|
||||
<colorpicker class="colorpicker" selected="color"/>
|
||||
<colorpicker class="colorpicker" selected="color" />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import Colorpicker from './Colorpicker.vue';
|
||||
import { mapState } from 'vuex'
|
||||
import Colorpicker from './Colorpicker'
|
||||
|
||||
export default {
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
collections: state => state.collections,
|
||||
calendars: state => state.calendars,
|
||||
dayOfMonth: state => state.dayOfMonth
|
||||
})
|
||||
),
|
||||
components: {
|
||||
'colorpicker': Colorpicker,
|
||||
}
|
||||
}
|
||||
export default {
|
||||
components: {
|
||||
'colorpicker': Colorpicker
|
||||
},
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
collections: state => state.collections,
|
||||
calendars: state => state.calendars,
|
||||
dayOfMonth: state => state.dayOfMonth
|
||||
})
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -19,12 +19,12 @@
|
|||
*
|
||||
*/
|
||||
|
||||
import Vue from "vue";
|
||||
import VueRouter from "vue-router";
|
||||
import Vue from 'vue'
|
||||
import VueRouter from 'vue-router'
|
||||
|
||||
import CollectionGeneral from "./TheCollections/General.vue";
|
||||
import CollectionWeek from "./TheCollections/Week.vue";
|
||||
import CollectionCalendar from "./TheCollections/Calendar.vue";
|
||||
import CollectionGeneral from './TheCollections/General'
|
||||
import CollectionWeek from './TheCollections/Week'
|
||||
import CollectionCalendar from './TheCollections/Calendar'
|
||||
|
||||
const routes = [
|
||||
// using
|
||||
|
|
@ -34,13 +34,13 @@ const routes = [
|
|||
// would also be an option, but it currently does not work
|
||||
// reliably with router-link due to
|
||||
// https://github.com/vuejs/vue-router/issues/419
|
||||
{ path: '/collections/week', component: CollectionWeek},
|
||||
{ path: '/collections/:collectionId', component: CollectionGeneral},
|
||||
{ path: '/calendars/:id', component: CollectionCalendar, props: true},
|
||||
];
|
||||
{ path: '/collections/week', component: CollectionWeek },
|
||||
{ path: '/collections/:collectionId', component: CollectionGeneral },
|
||||
{ path: '/calendars/:id', component: CollectionCalendar, props: true }
|
||||
]
|
||||
|
||||
Vue.use(VueRouter);
|
||||
Vue.use(VueRouter)
|
||||
|
||||
export default new VueRouter({
|
||||
routes, // short for `routes: routes`
|
||||
});
|
||||
routes // short for `routes: routes`
|
||||
})
|
||||
|
|
@ -33,8 +33,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<select id="startOfWeek"
|
||||
ng-change="setStartOfWeek()"
|
||||
ng-model="settingsmodel.getById('various').startOfWeek"
|
||||
ng-options="startOfWeekOption.id as startOfWeekOption.name for startOfWeekOption in startOfWeekOptions">
|
||||
</select>
|
||||
ng-options="startOfWeekOption.id as startOfWeekOption.name for startOfWeekOption in startOfWeekOptions" />
|
||||
</li>
|
||||
<li class="headline">
|
||||
{{ t('tasks', 'Visibility of Smart Collections') }}
|
||||
|
|
@ -42,7 +41,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<li v-for="collection in collections"
|
||||
:key="collection.id">
|
||||
<div class="label-container">
|
||||
<span class="icon" :class="collection.icon">
|
||||
<span :class="collection.icon" class="icon">
|
||||
<text ng-show="collection.id=='today'">{{ dayOfMonth }}</text>
|
||||
</span>
|
||||
<label :for="'visibilityCollection-' + collection.id" class="title">{{ collection.displayname }}</label>
|
||||
|
|
@ -50,8 +49,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
<select :id="'visibilityCollection-' + collection.id"
|
||||
ng-change="setVisibility(collection.id)"
|
||||
ng-model="collection.show"
|
||||
ng-options="collectionOption.id as collectionOption.name for collectionOption in collectionOptions">
|
||||
</select>
|
||||
ng-options="collectionOption.id as collectionOption.name for collectionOption in collectionOptions" />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -59,17 +57,17 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
collections: state => state.collections,
|
||||
calendars: state => state.calendars,
|
||||
dayOfMonth: state => state.dayOfMonth
|
||||
})
|
||||
),
|
||||
components: {
|
||||
}
|
||||
}
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
computed: Object.assign({},
|
||||
mapState({
|
||||
collections: state => state.collections,
|
||||
calendars: state => state.calendars,
|
||||
dayOfMonth: state => state.dayOfMonth
|
||||
})
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -18,63 +18,61 @@
|
|||
* License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
'use strict';
|
||||
'use strict'
|
||||
|
||||
import App from './app'
|
||||
|
||||
import Vue from 'vue'
|
||||
|
||||
import router from './components/TheRouter'
|
||||
import store from './store'
|
||||
|
||||
if (!OCA.Tasks) {
|
||||
/**
|
||||
* @namespace OCA.Tasks
|
||||
*/
|
||||
OCA.Tasks = {};
|
||||
OCA.Tasks = {}
|
||||
}
|
||||
|
||||
import App from './app.vue';
|
||||
|
||||
import Vue from 'vue';
|
||||
import Vuex from 'vuex';
|
||||
import VueRouter from 'vue-router';
|
||||
|
||||
import router from './components/TheRouter.js';
|
||||
import store from './store';
|
||||
|
||||
Vue.prototype.t = t;
|
||||
Vue.prototype.n = n;
|
||||
Vue.prototype.OC = OC;
|
||||
Vue.prototype.OCA = OCA;
|
||||
Vue.prototype.t = t
|
||||
Vue.prototype.n = n
|
||||
Vue.prototype.OC = OC
|
||||
Vue.prototype.OCA = OCA
|
||||
|
||||
OCA.Tasks.App = new Vue({
|
||||
el: '.app-tasks',
|
||||
router,
|
||||
store,
|
||||
data: function () {
|
||||
data: function() {
|
||||
return {
|
||||
searchString: ''
|
||||
};
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
var version = OC.config.version.split('.');
|
||||
var version = OC.config.version.split('.')
|
||||
|
||||
if (version[0] >= 14) {
|
||||
OC.Search = new OCA.Search(this.filter, this.cleanSearch);
|
||||
OC.Search = new OCA.Search(this.filter, this.cleanSearch)
|
||||
} else {
|
||||
OCA.Tasks.Search = {
|
||||
attach: function (search) {
|
||||
search.setFilter('tasks', this.filter);
|
||||
attach: function(search) {
|
||||
search.setFilter('tasks', this.filter)
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
OC.Plugins.register('OCA.Search', OCA.Tasks.Search);
|
||||
OC.Plugins.register('OCA.Search', OCA.Tasks.Search)
|
||||
}
|
||||
},
|
||||
beforeMount() {
|
||||
this.$store.dispatch('loadCollections');
|
||||
this.$store.dispatch('loadCollections')
|
||||
},
|
||||
methods: {
|
||||
filter(query) {
|
||||
this.searchString = query;
|
||||
this.searchString = query
|
||||
},
|
||||
cleanSearch() {
|
||||
this.searchString = '';
|
||||
this.searchString = ''
|
||||
}
|
||||
},
|
||||
render: h => h(App)
|
||||
});
|
||||
})
|
||||
|
|
@ -18,15 +18,15 @@
|
|||
* License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
'use strict';
|
||||
'use strict'
|
||||
|
||||
import Axios from 'axios';
|
||||
Axios.defaults.headers.common.requesttoken = OC.requestToken;
|
||||
import Axios from 'axios'
|
||||
Axios.defaults.headers.common.requesttoken = OC.requestToken
|
||||
|
||||
export default {
|
||||
get(url) {
|
||||
return Axios.get(url)
|
||||
.then((response) => Promise.resolve(response))
|
||||
.catch((error) => Promise.reject(error));
|
||||
.catch((error) => Promise.reject(error))
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
@ -18,13 +18,13 @@
|
|||
* License along with this library. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
'use strict';
|
||||
'use strict'
|
||||
|
||||
import Vue from 'vue';
|
||||
import Vuex from 'vuex';
|
||||
import Requests from './services/requests';
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import Requests from './services/requests'
|
||||
|
||||
Vue.use(Vuex);
|
||||
Vue.use(Vuex)
|
||||
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
|
|
@ -33,21 +33,21 @@ export default new Vuex.Store({
|
|||
],
|
||||
calendars: [
|
||||
{
|
||||
uri: "test-1",
|
||||
displayname: "Test 1",
|
||||
color: "#eef",
|
||||
uri: 'test-1',
|
||||
displayname: 'Test 1',
|
||||
color: '#eef',
|
||||
writable: true
|
||||
},
|
||||
{
|
||||
uri: "test-2",
|
||||
displayname: "Test 2",
|
||||
color: "#eef",
|
||||
uri: 'test-2',
|
||||
displayname: 'Test 2',
|
||||
color: '#eef',
|
||||
writable: false
|
||||
},
|
||||
{
|
||||
uri: "test-3",
|
||||
displayname: "Test 3",
|
||||
color: "#112233",
|
||||
uri: 'test-3',
|
||||
displayname: 'Test 3',
|
||||
color: '#112233',
|
||||
writable: true
|
||||
}
|
||||
],
|
||||
|
|
@ -55,23 +55,20 @@ export default new Vuex.Store({
|
|||
},
|
||||
mutations: {
|
||||
setCollections(state, payload) {
|
||||
state.collections = payload.collections;
|
||||
state.collections = payload.collections
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
loadCollections({commit}) {
|
||||
loadCollections({ commit }) {
|
||||
return new Promise(function(resolve) {
|
||||
Requests.get(OC.generateUrl('apps/tasks/collections'))
|
||||
.then(response => {
|
||||
commit('setCollections' , {
|
||||
collections: response.data.data.collections
|
||||
});
|
||||
resolve();
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
});
|
||||
.then(response => {
|
||||
commit('setCollections', {
|
||||
collections: response.data.data.collections
|
||||
})
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
|
Before Width: | Height: | Size: 260 B After Width: | Height: | Size: 260 B |
|
Before Width: | Height: | Size: 251 B After Width: | Height: | Size: 251 B |
|
Before Width: | Height: | Size: 178 B After Width: | Height: | Size: 178 B |
|
Before Width: | Height: | Size: 104 B After Width: | Height: | Size: 104 B |
|
Before Width: | Height: | Size: 125 B After Width: | Height: | Size: 125 B |
|
Before Width: | Height: | Size: 105 B After Width: | Height: | Size: 105 B |
|
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 90 B After Width: | Height: | Size: 90 B |
|
Before Width: | Height: | Size: 129 B After Width: | Height: | Size: 129 B |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 7.7 KiB |
|
|
@ -1,4 +1,4 @@
|
|||
<?php
|
||||
script('tasks', 'merged');
|
||||
style('tasks', 'style');
|
||||
script('tasks', 'tasks');
|
||||
style('tasks', 'tasks');
|
||||
?>
|
||||
|
|
|
|||
|
|
@ -1,22 +1,32 @@
|
|||
var path = require('path');
|
||||
var VueLoaderPlugin = require('vue-loader/lib/plugin');
|
||||
const path = require('path');
|
||||
const { VueLoaderPlugin } = require('vue-loader');
|
||||
const StyleLintPlugin = require('stylelint-webpack-plugin');
|
||||
|
||||
module.exports = {
|
||||
mode: 'development',
|
||||
entry: './js/app/main.js',
|
||||
entry: ['babel-polyfill', path.join(__dirname, 'src', 'main.js')],
|
||||
output: {
|
||||
path: path.resolve(__dirname, './js/public'),
|
||||
publicPath: '/public/',
|
||||
filename: 'build.js'
|
||||
path: path.resolve(__dirname, './js'),
|
||||
publicPath: '/js/',
|
||||
filename: 'tasks.js'
|
||||
},
|
||||
plugins: [
|
||||
new VueLoaderPlugin()
|
||||
],
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: ['vue-style-loader', 'css-loader']
|
||||
},
|
||||
{
|
||||
test: /\.scss$/,
|
||||
use: ['vue-style-loader', 'css-loader', 'sass-loader']
|
||||
},
|
||||
{
|
||||
test: /\.(js|vue)$/,
|
||||
use: 'eslint-loader',
|
||||
enforce: 'pre'
|
||||
},
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'vue-loader',
|
||||
loader: 'vue-loader'
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
|
|
@ -29,29 +39,14 @@ module.exports = {
|
|||
options: {
|
||||
name: '[name].[ext]?[hash]'
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: [
|
||||
'vue-style-loader',
|
||||
'css-loader'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
plugins: [new VueLoaderPlugin(), new StyleLintPlugin()],
|
||||
resolve: {
|
||||
alias: {
|
||||
'vue$': 'vue/dist/vue.esm.js',
|
||||
'@': path.resolve(__dirname, 'js/app')
|
||||
}
|
||||
},
|
||||
devServer: {
|
||||
historyApiFallback: true,
|
||||
noInfo: true,
|
||||
overlay: true
|
||||
},
|
||||
performance: {
|
||||
hints: false
|
||||
},
|
||||
devtool: '#eval-source-map'
|
||||
vue$: 'vue/dist/vue.esm.js'
|
||||
},
|
||||
extensions: ['*', '.js', '.vue', '.json']
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
const merge = require('webpack-merge');
|
||||
const common = require('./webpack.common.js');
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: 'development',
|
||||
devServer: {
|
||||
historyApiFallback: true,
|
||||
noInfo: true,
|
||||
overlay: true
|
||||
},
|
||||
devtool: '#eval-source-map',
|
||||
});
|
||||
|
|
@ -1,16 +1,7 @@
|
|||
const merge = require('webpack-merge');
|
||||
const common = require('./webpack.common');
|
||||
const webpack = require('webpack');
|
||||
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
|
||||
const common = require('./webpack.common.js');
|
||||
|
||||
module.exports = merge(common, {
|
||||
devtool: 'none',
|
||||
mode: 'production',
|
||||
// http://vue-loader.vuejs.org/en/workflow/production.html
|
||||
plugins: [
|
||||
new UglifyJSPlugin(),
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
minimize: true
|
||||
})
|
||||
]
|
||||
devtool: '#source-map'
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue