From 333f39c9f467ae81ee5c5d6a185f5ed034ec14eb Mon Sep 17 00:00:00 2001 From: shibafu Date: Fri, 24 May 2019 00:33:48 +0900 Subject: [PATCH 1/6] =?UTF-8?q?Vue.js=E3=82=92=E4=BE=9D=E5=AD=98=E9=96=A2?= =?UTF-8?q?=E4=BF=82=E3=81=AB=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 6 +++++- yarn.lock | 5 +++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 01fce83..93522f8 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "sass-loader": "^7.1.0", "stylelint": "^9.10.1", "stylelint-config-recess-order": "^2.0.1", + "vue": "^2.6.10", "vue-template-compiler": "^2.6.6" }, "stylelint": { @@ -39,6 +40,9 @@ } }, "lint-staged": { - "*.{css,scss}": ["stylelint --fix", "git add"] + "*.{css,scss}": [ + "stylelint --fix", + "git add" + ] } } diff --git a/yarn.lock b/yarn.lock index 2796345..a61a245 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7867,6 +7867,11 @@ vue-template-es2015-compiler@^1.8.2: resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.8.2.tgz#dd73e80ba58bb65dd7a8aa2aeef6089cf6116f2a" integrity sha512-cliV19VHLJqFUYbz/XeWXe5CO6guzwd0yrrqqp0bmjlMP3ZZULY7fu8RTC4+3lmHwo6ESVDHFDsvjB15hcR5IA== +vue@^2.6.10: + version "2.6.10" + resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.10.tgz#a72b1a42a4d82a721ea438d1b6bf55e66195c637" + integrity sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ== + watchpack@^1.5.0: version "1.6.0" resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.6.0.tgz#4bc12c2ebe8aa277a71f1d3f14d685c7b446cd00" From 7a95e0979eb5805a603ee62a670ded2e89f249f6 Mon Sep 17 00:00:00 2001 From: shibafu Date: Fri, 24 May 2019 01:08:47 +0900 Subject: [PATCH 2/6] =?UTF-8?q?TypeScript=E3=81=AE=E9=9F=B3=E3=82=A9?= =?UTF-8?q?=E3=80=9C!?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 3 +++ resources/assets/js/{checkin.js => checkin.ts} | 15 ++++++++------- tsconfig.json | 11 +++++++++++ webpack.mix.js | 2 +- 4 files changed, 23 insertions(+), 8 deletions(-) rename resources/assets/js/{checkin.js => checkin.ts} (75%) create mode 100644 tsconfig.json diff --git a/package.json b/package.json index 93522f8..d8b7fa3 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "stylelint": "stylelint resources/assets/sass/**/*" }, "devDependencies": { + "@types/jquery": "^3.3.29", "bootstrap": "^4.3.1", "cal-heatmap": "^3.3.10", "chart.js": "^2.7.1", @@ -28,6 +29,8 @@ "sass-loader": "^7.1.0", "stylelint": "^9.10.1", "stylelint-config-recess-order": "^2.0.1", + "ts-loader": "^6.0.1", + "typescript": "^3.4.5", "vue": "^2.6.10", "vue-template-compiler": "^2.6.6" }, diff --git a/resources/assets/js/checkin.js b/resources/assets/js/checkin.ts similarity index 75% rename from resources/assets/js/checkin.js rename to resources/assets/js/checkin.ts index e68fc0c..1e0a67d 100644 --- a/resources/assets/js/checkin.js +++ b/resources/assets/js/checkin.ts @@ -10,7 +10,7 @@ function updateTags() { ); } -function insertTag(value) { +function insertTag(value: string) { $('
  • | x
    • ') .data('value', value) .children(':last-child') @@ -19,22 +19,23 @@ function insertTag(value) { .appendTo('#tags'); } -var initTags = $('input[name=tags]').val(); +const initTags = $('input[name=tags]').val() as string; if (initTags.trim() !== '') { initTags.split(' ').forEach(function (value) { insertTag(value); }); } -$('#tagInput').on('keydown', function (ev) { - var $this = $(this); - if ($this.val().trim() !== '') { +$('#tagInput').on('keydown', function (ev: JQuery.KeyDownEvent) { + const $this = $(this); + let value = $this.val() as string; + if (value.trim() !== '') { switch (ev.key) { case 'Tab': case 'Enter': case ' ': - if (ev.originalEvent.isComposing !== true) { - insertTag($this.val().trim()); + if ((ev.originalEvent as any).isComposing !== true) { + insertTag(value.trim()); $this.val(''); updateTags(); } diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..99adef1 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,11 @@ +{ + "compilerOptions": { + "sourceMap": true, + "target": "es5", + "module": "es2015", + "strict": true + }, + "include": [ + "resources/assets/js/**/*" + ] +} \ No newline at end of file diff --git a/webpack.mix.js b/webpack.mix.js index 703398c..3532d8b 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -16,7 +16,7 @@ mix.js('resources/assets/js/app.js', 'public/js') .js('resources/assets/js/home.js', 'public/js') .js('resources/assets/js/user/stats.js', 'public/js/user') .js('resources/assets/js/setting/privacy.js', 'public/js/setting') - .js('resources/assets/js/checkin.js', 'public/js') + .ts('resources/assets/js/checkin.ts', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css') .autoload({ 'jquery': ['$', 'jQuery', 'window.jQuery'] From 0670cb8736b6500e9d6bbbcdb0367342eb8ef94a Mon Sep 17 00:00:00 2001 From: shibafu Date: Sat, 1 Jun 2019 00:40:35 +0900 Subject: [PATCH 3/6] =?UTF-8?q?=E3=82=BF=E3=82=B0=E5=85=A5=E5=8A=9B?= =?UTF-8?q?=E6=AC=84=E3=81=A0=E3=81=91Vue=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 4 +- resources/assets/js/checkin.ts | 62 ++------------- resources/assets/js/components/TagInput.vue | 77 +++++++++++++++++++ resources/assets/js/vue-shims.d.ts | 4 + resources/views/ejaculation/checkin.blade.php | 7 +- resources/views/ejaculation/edit.blade.php | 7 +- tsconfig.json | 4 +- yarn.lock | 20 ++++- 8 files changed, 113 insertions(+), 72 deletions(-) create mode 100644 resources/assets/js/components/TagInput.vue create mode 100644 resources/assets/js/vue-shims.d.ts diff --git a/package.json b/package.json index d8b7fa3..e957a17 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,9 @@ "ts-loader": "^6.0.1", "typescript": "^3.4.5", "vue": "^2.6.10", - "vue-template-compiler": "^2.6.6" + "vue-class-component": "^7.1.0", + "vue-property-decorator": "^8.1.1", + "vue-template-compiler": "^2.6.10" }, "stylelint": { "extends": "stylelint-config-recess-order" diff --git a/resources/assets/js/checkin.ts b/resources/assets/js/checkin.ts index 1e0a67d..7e54285 100644 --- a/resources/assets/js/checkin.ts +++ b/resources/assets/js/checkin.ts @@ -1,59 +1,9 @@ -function updateTags() { - $('input[name=tags]').val( - $('#tags') - .find('li') - .map(function () { - return $(this).data('value'); - }) - .get() - .join(' ') - ); -} +import Vue from 'vue'; +import TagInput from "./components/TagInput.vue"; -function insertTag(value: string) { - $('
  • | x
    • ') - .data('value', value) - .children(':last-child') - .text(value) - .end() - .appendTo('#tags'); -} - -const initTags = $('input[name=tags]').val() as string; -if (initTags.trim() !== '') { - initTags.split(' ').forEach(function (value) { - insertTag(value); - }); -} - -$('#tagInput').on('keydown', function (ev: JQuery.KeyDownEvent) { - const $this = $(this); - let value = $this.val() as string; - if (value.trim() !== '') { - switch (ev.key) { - case 'Tab': - case 'Enter': - case ' ': - if ((ev.originalEvent as any).isComposing !== true) { - insertTag(value.trim()); - $this.val(''); - updateTags(); - } - ev.preventDefault(); - break; - } - } else if (ev.key === 'Enter') { - // 誤爆防止 - ev.preventDefault(); +new Vue({ + el: '#app', + components: { + TagInput } }); - -$('#tags') - .on('click', 'li', function (ev) { - $(this).remove(); - updateTags(); - }) - .parent() - .on('click', function (ev) { - $('#tagInput').focus(); - }); \ No newline at end of file diff --git a/resources/assets/js/components/TagInput.vue b/resources/assets/js/components/TagInput.vue new file mode 100644 index 0000000..db81d55 --- /dev/null +++ b/resources/assets/js/components/TagInput.vue @@ -0,0 +1,77 @@ + + + diff --git a/resources/assets/js/vue-shims.d.ts b/resources/assets/js/vue-shims.d.ts new file mode 100644 index 0000000..ad17f79 --- /dev/null +++ b/resources/assets/js/vue-shims.d.ts @@ -0,0 +1,4 @@ +declare module "*.vue" { + import Vue from "vue"; + export default Vue; +} \ No newline at end of file diff --git a/resources/views/ejaculation/checkin.blade.php b/resources/views/ejaculation/checkin.blade.php index 669b9cf..fcfd3d8 100644 --- a/resources/views/ejaculation/checkin.blade.php +++ b/resources/views/ejaculation/checkin.blade.php @@ -3,7 +3,7 @@ @section('title', 'チェックイン') @section('content') -
    +

    今致してる？

    @@ -40,10 +40,7 @@
    -
    -
      - -
      + Tab, Enter, 半角スペースのいずれかで入力確定します。 diff --git a/resources/views/ejaculation/edit.blade.php b/resources/views/ejaculation/edit.blade.php index 8bae248..5640b26 100644 --- a/resources/views/ejaculation/edit.blade.php +++ b/resources/views/ejaculation/edit.blade.php @@ -3,7 +3,7 @@ @section('title', 'チェックインの修正') @section('content') -
      +

      チェックインの修正

      @@ -41,10 +41,7 @@
      -
      -
        - -
        + Tab, Enter, 半角スペースのいずれかで入力確定します。 diff --git a/tsconfig.json b/tsconfig.json index 99adef1..d2d1b2c 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -3,7 +3,9 @@ "sourceMap": true, "target": "es5", "module": "es2015", - "strict": true + "moduleResolution": "node", + "strict": true, + "experimentalDecorators": true }, "include": [ "resources/assets/js/**/*" diff --git a/yarn.lock b/yarn.lock index a61a245..644a72f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7830,6 +7830,11 @@ vm-browserify@0.0.4: dependencies: indexof "0.0.1" +vue-class-component@^7.0.1, vue-class-component@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/vue-class-component/-/vue-class-component-7.1.0.tgz#b33efcb10e17236d684f70b1e96f1946ec793e87" + integrity sha512-G9152NzUkz0i0xTfhk0Afc8vzdXxDR1pfN4dTwE72cskkgJtdXfrKBkMfGvDuxUh35U500g5Ve4xL8PEGdWeHg== + vue-hot-reload-api@^2.3.0: version "2.3.2" resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.2.tgz#1fcc1495effe08a790909b46bf7b5c4cfeb6f21b" @@ -7846,6 +7851,13 @@ vue-loader@^15.4.2: vue-hot-reload-api "^2.3.0" vue-style-loader "^4.1.0" +vue-property-decorator@^8.1.1: + version "8.1.1" + resolved "https://registry.yarnpkg.com/vue-property-decorator/-/vue-property-decorator-8.1.1.tgz#80dadbe5ffa0e7eb6a0ba0a07036365471a7d5ee" + integrity sha512-K+PUT17ZEMWyhrKZnl4Fc9qMyFpMcjVbZJBwx4BpA8BXfaspaTeFdoHuk1aywC/+4G86sxIr/5n4IQUQLecSWw== + dependencies: + vue-class-component "^7.0.1" + vue-style-loader@^4.1.0: version "4.1.2" resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.2.tgz#dedf349806f25ceb4e64f3ad7c0a44fba735fcf8" @@ -7854,10 +7866,10 @@ vue-style-loader@^4.1.0: hash-sum "^1.0.2" loader-utils "^1.0.2" -vue-template-compiler@^2.6.6: - version "2.6.6" - resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.6.tgz#a807acbf3d51971d3721d75ecb1b927b517c1a02" - integrity sha512-OakxDGyrmMQViCjkakQFbDZlG0NibiOzpLauOfyCUVRQc9yPmTqpiz9nF0VeA+dFkXegetw0E5x65BFhhLXO0A== +vue-template-compiler@^2.6.10: + version "2.6.10" + resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.10.tgz#323b4f3495f04faa3503337a82f5d6507799c9cc" + integrity sha512-jVZkw4/I/HT5ZMvRnhv78okGusqe0+qH2A0Em0Cp8aq78+NK9TII263CDVz2QXZsIT+yyV/gZc/j/vlwa+Epyg== dependencies: de-indent "^1.0.2" he "^1.1.0" From c7d88076fa32c75f964b26dce80f987d6d154afc Mon Sep 17 00:00:00 2001 From: shibafu Date: Wed, 5 Jun 2019 00:36:41 +0900 Subject: [PATCH 4/6] =?UTF-8?q?=E3=82=A4=E3=83=B3=E3=83=A9=E3=82=A4?= =?UTF-8?q?=E3=83=B3=E3=82=B9=E3=82=BF=E3=82=A4=E3=83=AB=E3=82=92=E3=82=B9?= =?UTF-8?q?=E3=82=B3=E3=83=BC=E3=83=97CSS=E3=81=AB=E8=BF=BD=E3=81=84?= =?UTF-8?q?=E5=87=BA=E3=81=97=E3=81=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- resources/assets/js/components/TagInput.vue | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/resources/assets/js/components/TagInput.vue b/resources/assets/js/components/TagInput.vue index db81d55..e1eb4a9 100644 --- a/resources/assets/js/components/TagInput.vue +++ b/resources/assets/js/components/TagInput.vue @@ -2,14 +2,13 @@
        • {{ tag }} | x
        @@ -75,3 +74,14 @@ } } + + \ No newline at end of file From 9471683741033d779315e2d4db3ae02288bd83b9 Mon Sep 17 00:00:00 2001 From: shibafu Date: Wed, 5 Jun 2019 00:46:30 +0900 Subject: [PATCH 5/6] =?UTF-8?q?=E3=82=BF=E3=82=B0=E7=94=A8=E3=81=AEhidden?= =?UTF-8?q?=20input=E3=82=82Component=E5=86=85=E3=81=AB=E5=90=AB=E3=82=81?= =?UTF-8?q?=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB=E3=81=97=E3=81=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- resources/assets/js/components/TagInput.vue | 30 ++++--------------- resources/views/ejaculation/checkin.blade.php | 3 +- resources/views/ejaculation/edit.blade.php | 3 +- 3 files changed, 8 insertions(+), 28 deletions(-) diff --git a/resources/assets/js/components/TagInput.vue b/resources/assets/js/components/TagInput.vue index e1eb4a9..379ba6c 100644 --- a/resources/assets/js/components/TagInput.vue +++ b/resources/assets/js/components/TagInput.vue @@ -1,5 +1,6 @@