idcjp/vue2_frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

vue2_frontend init..

Browse Source
This commit is contained in:
최준흠 2022-08-26 17:33:15 +09:00
parent 810c2799a0
commit 69aea3aeb8
8 changed files with 463 additions and 395 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

573
package-lock.json generated
View File

@ -12,6 +12,7 @@
"bootstrap": "^5.2.0",
"bootstrap-vue": "^2.22.0",
"core-js": "^3.8.3",
"vee-validate": "^3.4.14",
"vue": "^2.6.14",
"vue-router": "^3.5.1",
"vuex": "^3.6.2"
@ -2357,9 +2358,9 @@
}
},
"node_modules/@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
"integrity": "sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz",
"integrity": "sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA==",
"dev": true
},
"node_modules/@vue/babel-helper-vue-transform-on": {
@ -2386,14 +2387,14 @@
}
},
"node_modules/@vue/babel-plugin-transform-vue-jsx": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.2.1.tgz",
"integrity": "sha512-HJuqwACYehQwh1fNT8f4kyzqlNMpBuUK4rSiSES5D4QsYncv5fxFsLyrxFPG2ksO7t5WP+Vgix6tt6yKClwPzA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.4.0.tgz",
"integrity": "sha512-Fmastxw4MMx0vlgLS4XBX0XiBbUFzoMGeVXuMV08wyOfXdikAFqBTuYPR0tlk+XskL19EzHc39SgjrPGY23JnA==",
"dev": true,
"dependencies": {
"@babel/helper-module-imports": "^7.0.0",
"@babel/plugin-syntax-jsx": "^7.2.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"html-tags": "^2.0.0",
"lodash.kebabcase": "^4.1.1",
"svg-tags": "^1.0.0"
@ -2464,19 +2465,19 @@
}
},
"node_modules/@vue/babel-preset-jsx": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@vue/babel-preset-jsx/-/babel-preset-jsx-1.3.1.tgz",
"integrity": "sha512-ml+nqcSKp8uAqFZLNc7OWLMzR7xDBsUfkomF98DtiIBlLqlq4jCQoLINARhgqRIyKdB+mk/94NWpIb4pL6D3xw==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-preset-jsx/-/babel-preset-jsx-1.4.0.tgz",
"integrity": "sha512-QmfRpssBOPZWL5xw7fOuHNifCQcNQC1PrOo/4fu6xlhlKJJKSA3HqX92Nvgyx8fqHZTUGMPHmFA+IDqwXlqkSA==",
"dev": true,
"dependencies": {
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
"@vue/babel-plugin-transform-vue-jsx": "^1.2.1",
"@vue/babel-sugar-composition-api-inject-h": "^1.3.0",
"@vue/babel-sugar-composition-api-render-instance": "^1.3.0",
"@vue/babel-sugar-functional-vue": "^1.2.2",
"@vue/babel-sugar-inject-h": "^1.2.2",
"@vue/babel-sugar-v-model": "^1.3.0",
"@vue/babel-sugar-v-on": "^1.3.0"
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"@vue/babel-plugin-transform-vue-jsx": "^1.4.0",
"@vue/babel-sugar-composition-api-inject-h": "^1.4.0",
"@vue/babel-sugar-composition-api-render-instance": "^1.4.0",
"@vue/babel-sugar-functional-vue": "^1.4.0",
"@vue/babel-sugar-inject-h": "^1.4.0",
"@vue/babel-sugar-v-model": "^1.4.0",
"@vue/babel-sugar-v-on": "^1.4.0"
},
"peerDependencies": {
"@babel/core": "^7.0.0-0",
@ -2489,9 +2490,9 @@
}
},
"node_modules/@vue/babel-sugar-composition-api-inject-h": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-inject-h/-/babel-sugar-composition-api-inject-h-1.3.0.tgz",
"integrity": "sha512-pIDOutEpqbURdVw7xhgxmuDW8Tl+lTgzJZC5jdlUu0lY2+izT9kz3Umd/Tbu0U5cpCJ2Yhu87BZFBzWpS0Xemg==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-inject-h/-/babel-sugar-composition-api-inject-h-1.4.0.tgz",
"integrity": "sha512-VQq6zEddJHctnG4w3TfmlVp5FzDavUSut/DwR0xVoe/mJKXyMcsIibL42wPntozITEoY90aBV0/1d2KjxHU52g==",
"dev": true,
"dependencies": {
"@babel/plugin-syntax-jsx": "^7.2.0"
@ -2501,9 +2502,9 @@
}
},
"node_modules/@vue/babel-sugar-composition-api-render-instance": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-render-instance/-/babel-sugar-composition-api-render-instance-1.3.0.tgz",
"integrity": "sha512-NYNnU2r7wkJLMV5p9Zj4pswmCs037O/N2+/Fs6SyX7aRFzXJRP1/2CZh5cIwQxWQajHXuCUd5mTb7DxoBVWyTg==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-render-instance/-/babel-sugar-composition-api-render-instance-1.4.0.tgz",
"integrity": "sha512-6ZDAzcxvy7VcnCjNdHJ59mwK02ZFuP5CnucloidqlZwVQv5CQLijc3lGpR7MD3TWFi78J7+a8J56YxbCtHgT9Q==",
"dev": true,
"dependencies": {
"@babel/plugin-syntax-jsx": "^7.2.0"
@ -2513,9 +2514,9 @@
}
},
"node_modules/@vue/babel-sugar-functional-vue": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-functional-vue/-/babel-sugar-functional-vue-1.2.2.tgz",
"integrity": "sha512-JvbgGn1bjCLByIAU1VOoepHQ1vFsroSA/QkzdiSs657V79q6OwEWLCQtQnEXD/rLTA8rRit4rMOhFpbjRFm82w==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-functional-vue/-/babel-sugar-functional-vue-1.4.0.tgz",
"integrity": "sha512-lTEB4WUFNzYt2In6JsoF9sAYVTo84wC4e+PoZWSgM6FUtqRJz7wMylaEhSRgG71YF+wfLD6cc9nqVeXN2rwBvw==",
"dev": true,
"dependencies": {
"@babel/plugin-syntax-jsx": "^7.2.0"
@ -2525,9 +2526,9 @@
}
},
"node_modules/@vue/babel-sugar-inject-h": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-inject-h/-/babel-sugar-inject-h-1.2.2.tgz",
"integrity": "sha512-y8vTo00oRkzQTgufeotjCLPAvlhnpSkcHFEp60+LJUwygGcd5Chrpn5480AQp/thrxVm8m2ifAk0LyFel9oCnw==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-inject-h/-/babel-sugar-inject-h-1.4.0.tgz",
"integrity": "sha512-muwWrPKli77uO2fFM7eA3G1lAGnERuSz2NgAxuOLzrsTlQl8W4G+wwbM4nB6iewlKbwKRae3nL03UaF5ffAPMA==",
"dev": true,
"dependencies": {
"@babel/plugin-syntax-jsx": "^7.2.0"
@ -2537,14 +2538,14 @@
}
},
"node_modules/@vue/babel-sugar-v-model": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-model/-/babel-sugar-v-model-1.3.0.tgz",
"integrity": "sha512-zcsabmdX48JmxTObn3xmrvvdbEy8oo63DphVyA3WRYGp4SEvJRpu/IvZCVPl/dXLuob2xO/QRuncqPgHvZPzpA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-model/-/babel-sugar-v-model-1.4.0.tgz",
"integrity": "sha512-0t4HGgXb7WHYLBciZzN5s0Hzqan4Ue+p/3FdQdcaHAb7s5D9WZFGoSxEZHrR1TFVZlAPu1bejTKGeAzaaG3NCQ==",
"dev": true,
"dependencies": {
"@babel/plugin-syntax-jsx": "^7.2.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
"@vue/babel-plugin-transform-vue-jsx": "^1.2.1",
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"@vue/babel-plugin-transform-vue-jsx": "^1.4.0",
"camelcase": "^5.0.0",
"html-tags": "^2.0.0",
"svg-tags": "^1.0.0"
@ -2572,13 +2573,13 @@
}
},
"node_modules/@vue/babel-sugar-v-on": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-on/-/babel-sugar-v-on-1.3.0.tgz",
"integrity": "sha512-8VZgrS0G5bh7+Prj7oJkzg9GvhSPnuW5YT6MNaVAEy4uwxRLJ8GqHenaStfllChTao4XZ3EZkNtHB4Xbr/ePdA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-on/-/babel-sugar-v-on-1.4.0.tgz",
"integrity": "sha512-m+zud4wKLzSKgQrWwhqRObWzmTuyzl6vOP7024lrpeJM4x2UhQtRDLgYjXAw9xBXjCwS0pP9kXjg91F9ZNo9JA==",
"dev": true,
"dependencies": {
"@babel/plugin-syntax-jsx": "^7.2.0",
"@vue/babel-plugin-transform-vue-jsx": "^1.2.1",
"@vue/babel-plugin-transform-vue-jsx": "^1.4.0",
"camelcase": "^5.0.0"
},
"peerDependencies": {
@ -2634,121 +2635,6 @@
"eslint": ">=7.5.0"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/ajv": {
"version": "8.11.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.11.0.tgz",
"integrity": "sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg==",
"dev": true,
"dependencies": {
"fast-deep-equal": "^3.1.1",
"json-schema-traverse": "^1.0.0",
"require-from-string": "^2.0.2",
"uri-js": "^4.2.2"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/epoberezkin"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/ajv-keywords": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
"integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
"dev": true,
"dependencies": {
"fast-deep-equal": "^3.1.3"
},
"peerDependencies": {
"ajv": "^8.8.2"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/eslint-webpack-plugin": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/eslint-webpack-plugin/-/eslint-webpack-plugin-3.2.0.tgz",
"integrity": "sha512-avrKcGncpPbPSUHX6B3stNGzkKFto3eL+DKM4+VyMrVnhPc3vRczVlCq3uhuFOdRvDHTVXuzwk1ZKUrqDQHQ9w==",
"dev": true,
"dependencies": {
"@types/eslint": "^7.29.0 || ^8.4.1",
"jest-worker": "^28.0.2",
"micromatch": "^4.0.5",
"normalize-path": "^3.0.0",
"schema-utils": "^4.0.0"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
},
"peerDependencies": {
"eslint": "^7.0.0 || ^8.0.0",
"webpack": "^5.0.0"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"dev": true,
"engines": {
"node": ">=8"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/jest-worker": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-28.1.3.tgz",
"integrity": "sha512-CqRA220YV/6jCo8VWvAt1KKx6eek1VIHMPeLEbpcfSfkEeWyBNppynM/o6q+Wmw+sOhos2ml34wZbSX3G13//g==",
"dev": true,
"dependencies": {
"@types/node": "*",
"merge-stream": "^2.0.0",
"supports-color": "^8.0.0"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"dev": true
},
"node_modules/@vue/cli-plugin-eslint/node_modules/schema-utils": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.0.0.tgz",
"integrity": "sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==",
"dev": true,
"dependencies": {
"@types/json-schema": "^7.0.9",
"ajv": "^8.8.0",
"ajv-formats": "^2.1.1",
"ajv-keywords": "^5.0.0"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
}
},
"node_modules/@vue/cli-plugin-eslint/node_modules/supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"dependencies": {
"has-flag": "^4.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/@vue/cli-plugin-router": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/@vue/cli-plugin-router/-/cli-plugin-router-5.0.8.tgz",
@ -4461,9 +4347,9 @@
}
},
"node_modules/core-js-compat": {
"version": "3.24.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.24.1.tgz",
"integrity": "sha512-XhdNAGeRnTpp8xbD+sR/HFDK9CbeeeqXT6TuofXh3urqEevzkWmLRgrVoykodsw8okqo2pu1BOmuCKrHx63zdw==",
"version": "3.25.0",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.25.0.tgz",
"integrity": "sha512-extKQM0g8/3GjFx9US12FAgx8KJawB7RCQ5y8ipYLbmfzEzmFRWdDjIlxDx82g7ygcNG85qMVUSRyABouELdow==",
"dev": true,
"dependencies": {
"browserslist": "^4.21.3",
@ -5535,6 +5421,121 @@
"node": ">=10"
}
},
"node_modules/eslint-webpack-plugin": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/eslint-webpack-plugin/-/eslint-webpack-plugin-3.2.0.tgz",
"integrity": "sha512-avrKcGncpPbPSUHX6B3stNGzkKFto3eL+DKM4+VyMrVnhPc3vRczVlCq3uhuFOdRvDHTVXuzwk1ZKUrqDQHQ9w==",
"dev": true,
"dependencies": {
"@types/eslint": "^7.29.0 || ^8.4.1",
"jest-worker": "^28.0.2",
"micromatch": "^4.0.5",
"normalize-path": "^3.0.0",
"schema-utils": "^4.0.0"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
},
"peerDependencies": {
"eslint": "^7.0.0 || ^8.0.0",
"webpack": "^5.0.0"
}
},
"node_modules/eslint-webpack-plugin/node_modules/ajv": {
"version": "8.11.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.11.0.tgz",
"integrity": "sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg==",
"dev": true,
"dependencies": {
"fast-deep-equal": "^3.1.1",
"json-schema-traverse": "^1.0.0",
"require-from-string": "^2.0.2",
"uri-js": "^4.2.2"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/epoberezkin"
}
},
"node_modules/eslint-webpack-plugin/node_modules/ajv-keywords": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
"integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
"dev": true,
"dependencies": {
"fast-deep-equal": "^3.1.3"
},
"peerDependencies": {
"ajv": "^8.8.2"
}
},
"node_modules/eslint-webpack-plugin/node_modules/has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"dev": true,
"engines": {
"node": ">=8"
}
},
"node_modules/eslint-webpack-plugin/node_modules/jest-worker": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-28.1.3.tgz",
"integrity": "sha512-CqRA220YV/6jCo8VWvAt1KKx6eek1VIHMPeLEbpcfSfkEeWyBNppynM/o6q+Wmw+sOhos2ml34wZbSX3G13//g==",
"dev": true,
"dependencies": {
"@types/node": "*",
"merge-stream": "^2.0.0",
"supports-color": "^8.0.0"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/eslint-webpack-plugin/node_modules/json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"dev": true
},
"node_modules/eslint-webpack-plugin/node_modules/schema-utils": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.0.0.tgz",
"integrity": "sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==",
"dev": true,
"dependencies": {
"@types/json-schema": "^7.0.9",
"ajv": "^8.8.0",
"ajv-formats": "^2.1.1",
"ajv-keywords": "^5.0.0"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
}
},
"node_modules/eslint-webpack-plugin/node_modules/supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"dependencies": {
"has-flag": "^4.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/eslint/node_modules/ansi-styles": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@ -10539,6 +10540,14 @@
"node": ">= 0.8"
}
},
"node_modules/vee-validate": {
"version": "3.4.14",
"resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-3.4.14.tgz",
"integrity": "sha512-Hqqic8G9WcRSIzCxiCPqMZv4qB8JE1lIQqIOLDm2K5BXUiL8d4a2+kqkanv8gQSGDzYpnCQZ7BO/T99Aj05T1Q==",
"peerDependencies": {
"vue": "^2.5.18"
}
},
"node_modules/vue": {
"version": "2.7.10",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.7.10.tgz",
@ -13150,9 +13159,9 @@
}
},
"@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
"integrity": "sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz",
"integrity": "sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA==",
"dev": true
},
"@vue/babel-helper-vue-transform-on": {
@ -13179,14 +13188,14 @@
}
},
"@vue/babel-plugin-transform-vue-jsx": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.2.1.tgz",
"integrity": "sha512-HJuqwACYehQwh1fNT8f4kyzqlNMpBuUK4rSiSES5D4QsYncv5fxFsLyrxFPG2ksO7t5WP+Vgix6tt6yKClwPzA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.4.0.tgz",
"integrity": "sha512-Fmastxw4MMx0vlgLS4XBX0XiBbUFzoMGeVXuMV08wyOfXdikAFqBTuYPR0tlk+XskL19EzHc39SgjrPGY23JnA==",
"dev": true,
"requires": {
"@babel/helper-module-imports": "^7.0.0",
"@babel/plugin-syntax-jsx": "^7.2.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"html-tags": "^2.0.0",
"lodash.kebabcase": "^4.1.1",
"svg-tags": "^1.0.0"
@ -13236,66 +13245,66 @@
}
},
"@vue/babel-preset-jsx": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@vue/babel-preset-jsx/-/babel-preset-jsx-1.3.1.tgz",
"integrity": "sha512-ml+nqcSKp8uAqFZLNc7OWLMzR7xDBsUfkomF98DtiIBlLqlq4jCQoLINARhgqRIyKdB+mk/94NWpIb4pL6D3xw==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-preset-jsx/-/babel-preset-jsx-1.4.0.tgz",
"integrity": "sha512-QmfRpssBOPZWL5xw7fOuHNifCQcNQC1PrOo/4fu6xlhlKJJKSA3HqX92Nvgyx8fqHZTUGMPHmFA+IDqwXlqkSA==",
"dev": true,
"requires": {
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
"@vue/babel-plugin-transform-vue-jsx": "^1.2.1",
"@vue/babel-sugar-composition-api-inject-h": "^1.3.0",
"@vue/babel-sugar-composition-api-render-instance": "^1.3.0",
"@vue/babel-sugar-functional-vue": "^1.2.2",
"@vue/babel-sugar-inject-h": "^1.2.2",
"@vue/babel-sugar-v-model": "^1.3.0",
"@vue/babel-sugar-v-on": "^1.3.0"
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"@vue/babel-plugin-transform-vue-jsx": "^1.4.0",
"@vue/babel-sugar-composition-api-inject-h": "^1.4.0",
"@vue/babel-sugar-composition-api-render-instance": "^1.4.0",
"@vue/babel-sugar-functional-vue": "^1.4.0",
"@vue/babel-sugar-inject-h": "^1.4.0",
"@vue/babel-sugar-v-model": "^1.4.0",
"@vue/babel-sugar-v-on": "^1.4.0"
}
},
"@vue/babel-sugar-composition-api-inject-h": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-inject-h/-/babel-sugar-composition-api-inject-h-1.3.0.tgz",
"integrity": "sha512-pIDOutEpqbURdVw7xhgxmuDW8Tl+lTgzJZC5jdlUu0lY2+izT9kz3Umd/Tbu0U5cpCJ2Yhu87BZFBzWpS0Xemg==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-inject-h/-/babel-sugar-composition-api-inject-h-1.4.0.tgz",
"integrity": "sha512-VQq6zEddJHctnG4w3TfmlVp5FzDavUSut/DwR0xVoe/mJKXyMcsIibL42wPntozITEoY90aBV0/1d2KjxHU52g==",
"dev": true,
"requires": {
"@babel/plugin-syntax-jsx": "^7.2.0"
}
},
"@vue/babel-sugar-composition-api-render-instance": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-render-instance/-/babel-sugar-composition-api-render-instance-1.3.0.tgz",
"integrity": "sha512-NYNnU2r7wkJLMV5p9Zj4pswmCs037O/N2+/Fs6SyX7aRFzXJRP1/2CZh5cIwQxWQajHXuCUd5mTb7DxoBVWyTg==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-composition-api-render-instance/-/babel-sugar-composition-api-render-instance-1.4.0.tgz",
"integrity": "sha512-6ZDAzcxvy7VcnCjNdHJ59mwK02ZFuP5CnucloidqlZwVQv5CQLijc3lGpR7MD3TWFi78J7+a8J56YxbCtHgT9Q==",
"dev": true,
"requires": {
"@babel/plugin-syntax-jsx": "^7.2.0"
}
},
"@vue/babel-sugar-functional-vue": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-functional-vue/-/babel-sugar-functional-vue-1.2.2.tgz",
"integrity": "sha512-JvbgGn1bjCLByIAU1VOoepHQ1vFsroSA/QkzdiSs657V79q6OwEWLCQtQnEXD/rLTA8rRit4rMOhFpbjRFm82w==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-functional-vue/-/babel-sugar-functional-vue-1.4.0.tgz",
"integrity": "sha512-lTEB4WUFNzYt2In6JsoF9sAYVTo84wC4e+PoZWSgM6FUtqRJz7wMylaEhSRgG71YF+wfLD6cc9nqVeXN2rwBvw==",
"dev": true,
"requires": {
"@babel/plugin-syntax-jsx": "^7.2.0"
}
},
"@vue/babel-sugar-inject-h": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-inject-h/-/babel-sugar-inject-h-1.2.2.tgz",
"integrity": "sha512-y8vTo00oRkzQTgufeotjCLPAvlhnpSkcHFEp60+LJUwygGcd5Chrpn5480AQp/thrxVm8m2ifAk0LyFel9oCnw==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-inject-h/-/babel-sugar-inject-h-1.4.0.tgz",
"integrity": "sha512-muwWrPKli77uO2fFM7eA3G1lAGnERuSz2NgAxuOLzrsTlQl8W4G+wwbM4nB6iewlKbwKRae3nL03UaF5ffAPMA==",
"dev": true,
"requires": {
"@babel/plugin-syntax-jsx": "^7.2.0"
}
},
"@vue/babel-sugar-v-model": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-model/-/babel-sugar-v-model-1.3.0.tgz",
"integrity": "sha512-zcsabmdX48JmxTObn3xmrvvdbEy8oo63DphVyA3WRYGp4SEvJRpu/IvZCVPl/dXLuob2xO/QRuncqPgHvZPzpA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-model/-/babel-sugar-v-model-1.4.0.tgz",
"integrity": "sha512-0t4HGgXb7WHYLBciZzN5s0Hzqan4Ue+p/3FdQdcaHAb7s5D9WZFGoSxEZHrR1TFVZlAPu1bejTKGeAzaaG3NCQ==",
"dev": true,
"requires": {
"@babel/plugin-syntax-jsx": "^7.2.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
"@vue/babel-plugin-transform-vue-jsx": "^1.2.1",
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"@vue/babel-plugin-transform-vue-jsx": "^1.4.0",
"camelcase": "^5.0.0",
"html-tags": "^2.0.0",
"svg-tags": "^1.0.0"
@ -13316,13 +13325,13 @@
}
},
"@vue/babel-sugar-v-on": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-on/-/babel-sugar-v-on-1.3.0.tgz",
"integrity": "sha512-8VZgrS0G5bh7+Prj7oJkzg9GvhSPnuW5YT6MNaVAEy4uwxRLJ8GqHenaStfllChTao4XZ3EZkNtHB4Xbr/ePdA==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@vue/babel-sugar-v-on/-/babel-sugar-v-on-1.4.0.tgz",
"integrity": "sha512-m+zud4wKLzSKgQrWwhqRObWzmTuyzl6vOP7024lrpeJM4x2UhQtRDLgYjXAw9xBXjCwS0pP9kXjg91F9ZNo9JA==",
"dev": true,
"requires": {
"@babel/plugin-syntax-jsx": "^7.2.0",
"@vue/babel-plugin-transform-vue-jsx": "^1.2.1",
"@vue/babel-plugin-transform-vue-jsx": "^1.4.0",
"camelcase": "^5.0.0"
},
"dependencies": {
@ -13365,86 +13374,6 @@
"globby": "^11.0.2",
"webpack": "^5.54.0",
"yorkie": "^2.0.0"
},
"dependencies": {
"ajv": {
"version": "8.11.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.11.0.tgz",
"integrity": "sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.1",
"json-schema-traverse": "^1.0.0",
"require-from-string": "^2.0.2",
"uri-js": "^4.2.2"
}
},
"ajv-keywords": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
"integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.3"
}
},
"eslint-webpack-plugin": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/eslint-webpack-plugin/-/eslint-webpack-plugin-3.2.0.tgz",
"integrity": "sha512-avrKcGncpPbPSUHX6B3stNGzkKFto3eL+DKM4+VyMrVnhPc3vRczVlCq3uhuFOdRvDHTVXuzwk1ZKUrqDQHQ9w==",
"dev": true,
"requires": {
"@types/eslint": "^7.29.0 || ^8.4.1",
"jest-worker": "^28.0.2",
"micromatch": "^4.0.5",
"normalize-path": "^3.0.0",
"schema-utils": "^4.0.0"
}
},
"has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"dev": true
},
"jest-worker": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-28.1.3.tgz",
"integrity": "sha512-CqRA220YV/6jCo8VWvAt1KKx6eek1VIHMPeLEbpcfSfkEeWyBNppynM/o6q+Wmw+sOhos2ml34wZbSX3G13//g==",
"dev": true,
"requires": {
"@types/node": "*",
"merge-stream": "^2.0.0",
"supports-color": "^8.0.0"
}
},
"json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"dev": true
},
"schema-utils": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.0.0.tgz",
"integrity": "sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==",
"dev": true,
"requires": {
"@types/json-schema": "^7.0.9",
"ajv": "^8.8.0",
"ajv-formats": "^2.1.1",
"ajv-keywords": "^5.0.0"
}
},
"supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"requires": {
"has-flag": "^4.0.0"
}
}
}
},
"@vue/cli-plugin-router": {
@ -14734,9 +14663,9 @@
"integrity": "sha512-0QTBSYSUZ6Gq21utGzkfITDylE8jWC9Ne1D2MrhvlsZBI1x39OdDIVbzSqtgMndIy6BlHxBXpMGqzZmnztg2rg=="
},
"core-js-compat": {
"version": "3.24.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.24.1.tgz",
"integrity": "sha512-XhdNAGeRnTpp8xbD+sR/HFDK9CbeeeqXT6TuofXh3urqEevzkWmLRgrVoykodsw8okqo2pu1BOmuCKrHx63zdw==",
"version": "3.25.0",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.25.0.tgz",
"integrity": "sha512-extKQM0g8/3GjFx9US12FAgx8KJawB7RCQ5y8ipYLbmfzEzmFRWdDjIlxDx82g7ygcNG85qMVUSRyABouELdow==",
"dev": true,
"requires": {
"browserslist": "^4.21.3",
@ -15683,6 +15612,86 @@
"integrity": "sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==",
"dev": true
},
"eslint-webpack-plugin": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/eslint-webpack-plugin/-/eslint-webpack-plugin-3.2.0.tgz",
"integrity": "sha512-avrKcGncpPbPSUHX6B3stNGzkKFto3eL+DKM4+VyMrVnhPc3vRczVlCq3uhuFOdRvDHTVXuzwk1ZKUrqDQHQ9w==",
"dev": true,
"requires": {
"@types/eslint": "^7.29.0 || ^8.4.1",
"jest-worker": "^28.0.2",
"micromatch": "^4.0.5",
"normalize-path": "^3.0.0",
"schema-utils": "^4.0.0"
},
"dependencies": {
"ajv": {
"version": "8.11.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.11.0.tgz",
"integrity": "sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.1",
"json-schema-traverse": "^1.0.0",
"require-from-string": "^2.0.2",
"uri-js": "^4.2.2"
}
},
"ajv-keywords": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
"integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.3"
}
},
"has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"dev": true
},
"jest-worker": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-28.1.3.tgz",
"integrity": "sha512-CqRA220YV/6jCo8VWvAt1KKx6eek1VIHMPeLEbpcfSfkEeWyBNppynM/o6q+Wmw+sOhos2ml34wZbSX3G13//g==",
"dev": true,
"requires": {
"@types/node": "*",
"merge-stream": "^2.0.0",
"supports-color": "^8.0.0"
}
},
"json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"dev": true
},
"schema-utils": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.0.0.tgz",
"integrity": "sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==",
"dev": true,
"requires": {
"@types/json-schema": "^7.0.9",
"ajv": "^8.8.0",
"ajv-formats": "^2.1.1",
"ajv-keywords": "^5.0.0"
}
},
"supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"requires": {
"has-flag": "^4.0.0"
}
}
}
},
"espree": {
"version": "9.3.3",
"resolved": "https://registry.npmjs.org/espree/-/espree-9.3.3.tgz",
@ -19193,6 +19202,12 @@
"integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
"dev": true
},
"vee-validate": {
"version": "3.4.14",
"resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-3.4.14.tgz",
"integrity": "sha512-Hqqic8G9WcRSIzCxiCPqMZv4qB8JE1lIQqIOLDm2K5BXUiL8d4a2+kqkanv8gQSGDzYpnCQZ7BO/T99Aj05T1Q==",
"requires": {}
},
"vue": {
"version": "2.7.10",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.7.10.tgz",

1
package.json
View File

@ -12,6 +12,7 @@
"bootstrap": "^5.2.0",
"bootstrap-vue": "^2.22.0",
"core-js": "^3.8.3",
"vee-validate": "^3.4.14",
"vue": "^2.6.14",
"vue-router": "^3.5.1",
"vuex": "^3.6.2"

3
src/components/common/ListComponent.vue
View File

@ -1,3 +0,0 @@
<template>
<div>ListComponent</div>
</template>

172
src/components/common/LoginComponent.vue
View File

@ -1,33 +1,52 @@
<template>
<div>
<b-form @submit="onSubmit" @reset="onReset" v-if="show">
<b-form-group
label="Email address:"
description="We'll never share your email with anyone else."
>
<b-form-input
v-model="form.email"
type="email"
placeholder="Enter email"
required
></b-form-input>
</b-form-group>
<b-form-group label="Your Pasword:" label-for="input-2">
<b-form-input
type="password"
v-model="form.password"
placeholder="Enter Pasword"
required
></b-form-input>
</b-form-group>
<b-button type="submit" variant="primary">Login</b-button>
<b-button type="reset" variant="danger">Reset</b-button>
</b-form>
<b-card class="mt-3" header="Form Data Result">
<pre class="m-0">{{ form }}</pre>
</b-card>
<div style="width: 400px; height: 300px; text-align: center">
<!-- 참조: https://bootstrap-vue.org/docs/reference/validation#form-validation , npm install vee-validate@3 필요 -->
<validation-observer ref="observer" v-slot="{ handleSubmit }">
<b-form @submit.stop.prevent="handleSubmit(onSubmit)" class="sm">
<validation-provider
:name="field.email.label"
:rules="field.email.rules"
v-slot="validationContext"
>
<b-input-group>
<label class="input-group-text">{{ field.email.label }}</label>
<b-form-input
:name="field.email.label"
:type="field.email.type"
v-model="form.email"
:state="getValidationState(validationContext)"
:placeholder="field.email.placeholder"
></b-form-input>
<b-form-invalid-feedback>{{
validationContext.errors[0]
}}</b-form-invalid-feedback>
</b-input-group>
</validation-provider>
<validation-provider
:name="field.password.label"
:rules="field.password.rules"
v-slot="validationContext"
>
<b-input-group>
<label class="input-group-text">{{ field.password.label }}</label>
<b-form-input
:name="field.password.label"
:type="field.password.type"
v-model="form.password"
:state="getValidationState(validationContext)"
:placeholder="field.password.placeholder"
></b-form-input>
<b-form-invalid-feedback>{{
validationContext.errors[0]
}}</b-form-invalid-feedback>
</b-input-group>
</validation-provider>
<b-button type="submit" variant="primary">Login</b-button>
<b-button type="reset" variant="danger" @click="onReset()"
>Reset</b-button
>
</b-form>
</validation-observer>
</div>
</template>
@ -37,61 +56,76 @@ export default {
data() {
return {
form: {
email: '',
password: ''
email: null,
password: null
},
show: true
field: {
email: {
key: 'email',
type: 'email',
label: '로그인 메일',
placeholder: 'sample@test.com',
rules: { required: true, email: true }
},
password: {
key: 'password',
type: 'password',
label: '로그인 암호',
placeholder: 'password',
rules: { required: true, min: 4, max: 20 }
}
}
}
},
methods: {
async onSubmit(event) {
event.preventDefault()
getValidationState({ dirty, validated, valid = null }) {
return dirty || validated ? valid : null
},
async onSubmit() {
const result = await this.callAPI(
'/auth/login',
JSON.stringify({
email: this.form.email,
password: this.form.password
})
)
if (result) {
// localStorage를 사용하면, 브라우저에 key-value 값을 Storage에 저장할 수 있습니다
localStorage.setItem(process.env.VUE_APP_LOCALSTORAGE_NAME, result)
alert('로그인 성공...')
// this.$router.push('/')
} else {
console.log(result)
localStorage.removeItem(process.env.VUE_APP_LOCALSTORAGE_NAME)
alert('로그인 실패...')
}
},
onReset() {
// Reset our form values
this.form.email = ''
this.form.pasword = ''
// Trick to reset/clear native browser form validation state
this.$nextTick(() => {
this.$refs.observer.reset()
})
},
async callAPI(url, params) {
console.log('CallAPI..', [url, params])
axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST
axios.defaults.headers.post['Content-Type'] =
process.env.VUE_APP_BACKEND_HEADERS_Content_Type
axios.defaults.headers.post['Access-Control-Allow-Origin'] =
process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
await axios
.post(
'/auth/login',
JSON.stringify({
email: this.form.email,
password: this.form.password
})
)
return await axios
.post(url, params)
.then((response) => {
// console.log(response)
if (response.status === 201) {
// 로그인 성공시 처리해줘야할 부분
console.log(response.data)
// this.$store.dispatch('authenticate', {
// token: response.data.access_token,
// expiration: response.data.expires_in + Date.now()
// })
localStorage.setItem(
process.env.VUE_APP_LOCALSTORAGE_NAME,
response.data.access_token
)
alert('로그인 성공...')
// this.$router.push('/')
}
return response.status === 201 ? response.data.access_token : null
})
.catch((err) => {
localStorage.removeItem(process.env.VUE_APP_LOCALSTORAGE_NAME)
console.log(err)
alert('로그인 실패...')
return null
})
},
onReset(event) {
event.preventDefault()
// Reset our form values
this.form.email = ''
this.form.pasword = ''
// Trick to reset/clear native browser form validation state
this.show = false
this.$nextTick(() => {
this.show = true
})
}
}
}

2
src/components/layout/HeaderLayout.vue
View File

@ -22,7 +22,7 @@
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/api/todo">Todo</a>
<a class="nav-link" href="/todo">Todo</a>
</li>
</ul>
<form class="d-flex" role="search">

22
src/main.js
View File

@ -2,15 +2,33 @@ import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import { BootstrapVue, BootstrapVueIcons } from 'bootstrap-vue'
import { BootstrapVue } from 'bootstrap-vue'
import {
ValidationObserver,
ValidationProvider,
extend,
localize
} from 'vee-validate'
import ko from 'vee-validate/dist/locale/ko.json'
import * as rules from 'vee-validate/dist/rules'
// Import Bootstrap and BootstrapVue CSS files (order is important)
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
// Install VeeValidate rules and localization
Object.keys(rules).forEach((rule) => {
extend(rule, rules[rule])
})
localize('ko', ko)
// Install VeeValidate components globally
Vue.component('ValidationObserver', ValidationObserver)
Vue.component('ValidationProvider', ValidationProvider)
Vue.config.productionTip = false
Vue.use(BootstrapVue)
Vue.use(BootstrapVueIcons)
new Vue({
router,
store,

14
src/views/loginView.vue
View File

@ -1,7 +1,9 @@
<template>
<!-- 참조: https://codesandbox.io/s/3v0m1?file=/src/components/board/BoardList.vue -->
<div>
<LoginComponent />
<b-modal id="LoginComponent" title="로그인">
<LoginComponent />
</b-modal>
</div>
</template>
<script>
@ -9,6 +11,16 @@ import LoginComponent from '@/components/common/LoginComponent.vue'
export default {
components: {
LoginComponent
},
data: function () {
return {
showModal: true
}
},
mounted: function () {
if (this.showModal) {
this.$bvModal.show('LoginComponent')
}
}
}
</script>

71
src/views/todo/listView.vue
View File

@ -1,7 +1,6 @@
<template>
<!-- 참조: https://codesandbox.io/s/3v0m1?file=/src/components/board/BoardList.vue -->
<div>
<ListComponent />
<!-- 참조: https://codesandbox.io/s/3v0m1?file=/src/components/board/BoardList.vue -->
<b-container fluid>
<b-row>
<b-col class="border">
@ -73,11 +72,11 @@
:head-variant="commonTableAttributes.headVariant"
>
<!-- 각 Cell/Field별 속성 추가용 -->
<template #table-colgroup="scope">
<template>
<col
v-for="field in scope.fields"
v-for="field in fields"
:key="field.key"
:style="{ width: field.width }"
:style="field.style"
/>
</template>
<!-- 비/선택 Row를 토글용 -->
@ -150,12 +149,9 @@
</template>
<script>
// 참조 : https://vuejsexamples.com/vuejs-tables-and-select-all-checkbox/
import ListComponent from '@/components/common/ListComponent.vue'
import axios from 'axios'
export default {
components: {
ListComponent
},
components: {},
data: function () {
return {
items: [],
@ -164,7 +160,7 @@ export default {
{
key: 'index',
label: '번호',
width: '55px',
style: { width: '55px' },
variant: 'primary'
},
{
@ -184,7 +180,7 @@ export default {
{
key: 'is_done',
label: '사용여부',
width: '105px',
style: { width: '105px' },
// formatter: (value, key, item) => {
formatter: (value) => {
return value ? 'Yes' : 'No'
@ -196,7 +192,7 @@ export default {
{
key: 'createdAt',
label: '등록일',
width: '105px',
style: { width: '105px' },
formatter: (value) => {
return value.replace(
/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/gi,
@ -250,38 +246,17 @@ export default {
setup: function () {},
created: function () {},
mounted: function () {
// var vm = this
// setTimeout(function () {
// vm.records = vm.getDatas()
// }, 1000)
this.getDatas()
this.total = this.items.length
},
unmounted() {},
methods: {
async getDatas() {
this.isBusy = true
axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST
axios.defaults.headers.post['Content-Type'] =
process.env.VUE_APP_BACKEND_HEADERS_Content_Type
axios.defaults.headers.post['Access-Control-Allow-Origin'] =
process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
const items = await axios
.get('/todo/vue2', {
params: {
search: this.search
}
})
.then((response) => {
return response.status === 200 ? response.data : []
})
.catch((err) => {
console.log(err)
return []
})
//console.log(JSON.stringify(items.rows))
this.total = items.total
this.items = items.rows
this.items = await this.callAPI('/todo', {
search: this.search
})
//console.log(JSON.stringify(this.items))
this.total = this.items.length
this.isBusy = false
},
searchForDB() {
@ -292,7 +267,6 @@ export default {
this.isBusy = !this.isBusy
},
onFiltered(filteredItems) {
// Trigger pagination to update the number of buttons/pages due to filtering
this.total = filteredItems.length
this.currentPage = 1
},
@ -307,7 +281,7 @@ export default {
this.$refs.selectableTable.selectAllRows()
this.selectedAllToggle = true
}
}
},
// rowSelectSet(id) {
// // Rows are indexed from 0, so the third row is index 2
// this.$refs.selectableTable.selectRow(id)
@ -316,6 +290,23 @@ export default {
// // Rows are indexed from 0, so the third row is index 2
// this.$refs.selectableTable.unselectRow(id)
// }
async callAPI(url, params) {
console.log('CallAPI..', [url, params])
axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST
axios.defaults.headers.post['Content-Type'] =
process.env.VUE_APP_BACKEND_HEADERS_Content_Type
axios.defaults.headers.post['Access-Control-Allow-Origin'] =
process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin
return await axios
.get(url, params)
.then((response) => {
return response.status === 200 ? response.data : []
})
.catch((err) => {
console.log(err)
return []
})
}
},
computed: {
sortOptions() {