Joururi/spellsaurus
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added ESlint to client and applied rules

Browse Source
This commit is contained in:
Alexis
2021-01-21 11:16:09 +01:00
parent 4b25f63531
commit da6cd44987
33 changed files with 1703 additions and 1077 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
client/.eslintrc.json Normal file
View File

@@ -0,0 +1,33 @@
{
"env": {
"node": true
},
"parserOptions": {
"ecmaVersion": 6,
"ecmaFeatures": {
"impliedStrict": true
}
},
"extends": [
"plugin:vue/vue3-recommended",
"eslint:recommended"
],
"rules": {
"indent": ["error", 2],
"accessor-pairs": "warn",
"array-callback-return": "error",
"brace-style": "warn",
"consistent-return": "error",
"default-case": "error",
"eqeqeq": "warn",
"no-case-declarations": "error",
"no-empty-pattern": "warn",
"no-fallthrough": "error",
"no-unused-vars": "error",
"no-useless-catch": "error",
"no-var": "error",
"semi": "warn",
"no-extra-semi": "error",
"yoda": "warn"
}
}

2
client/babel.config.js
View File

@@ -2,4 +2,4 @@ module.exports = {
presets: [ presets: [
'@vue/cli-plugin-babel/preset' '@vue/cli-plugin-babel/preset'
], ],
} };

247
client/package-lock.json generated
View File

@@ -2240,34 +2240,11 @@
"dev": true "dev": true
}, },
"axios": { "axios": {
"version": "0.19.2", "version": "0.21.1",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
"integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==", "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
"requires": { "requires": {
"follow-redirects": "1.5.10" "follow-redirects": "^1.10.0"
},
"dependencies": {
"debug": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"requires": {
"ms": "2.0.0"
}
},
"follow-redirects": {
"version": "1.5.10",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
"requires": {
"debug": "=3.1.0"
}
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
}
} }
}, },
"babel-eslint": { "babel-eslint": {
@@ -4614,12 +4591,11 @@
"dev": true "dev": true
}, },
"ansi-styles": { "ansi-styles": {
"version": "4.2.1", "version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/color-name": "^1.1.1",
"color-convert": "^2.0.1" "color-convert": "^2.0.1"
} }
}, },
@@ -4632,6 +4608,12 @@
"restore-cursor": "^3.1.0" "restore-cursor": "^3.1.0"
} }
}, },
"cli-width": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/cli-width/-/cli-width-3.0.0.tgz",
"integrity": "sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==",
"dev": true
},
"color-convert": { "color-convert": {
"version": "2.0.1", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -4648,15 +4630,32 @@
"dev": true "dev": true
}, },
"eslint-scope": { "eslint-scope": {
"version": "5.0.0", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.0.0.tgz", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
"integrity": "sha512-oYrhJW7S0bxAFDvWqzvMPRm6pcgcnWc4QnofCAqRTRfQC0JcwenzGglTtsLyIuuWFfkqDG9vz67cnttSd53djw==", "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
"dev": true, "dev": true,
"requires": { "requires": {
"esrecurse": "^4.1.0", "esrecurse": "^4.3.0",
"estraverse": "^4.1.1" "estraverse": "^4.1.1"
} }
}, },
"esrecurse": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
"integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
"dev": true,
"requires": {
"estraverse": "^5.2.0"
},
"dependencies": {
"estraverse": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
"integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
"dev": true
}
}
},
"figures": { "figures": {
"version": "3.2.0", "version": "3.2.0",
"resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz", "resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz",
@@ -4667,18 +4666,18 @@
} }
}, },
"glob-parent": { "glob-parent": {
"version": "5.1.0", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.0.tgz", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
"integrity": "sha512-qjtRgnIVmOfnKUE3NJAQEdk+lKrxfw8t5ke7SXtfMTHcjsBfOfWXCQfdb30zfDoZQ2IRSIiidmjtbHZPZ++Ihw==", "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"is-glob": "^4.0.1" "is-glob": "^4.0.1"
} }
}, },
"globals": { "globals": {
"version": "12.3.0", "version": "12.4.0",
"resolved": "https://registry.npmjs.org/globals/-/globals-12.3.0.tgz", "resolved": "https://registry.npmjs.org/globals/-/globals-12.4.0.tgz",
"integrity": "sha512-wAfjdLgFsPZsklLJvOBUBmzYE8/CwhEqSBEMRXA3qxIiNtyqvjYurAtIfDh6chlEPUfmTY3MnZh5Hfh4q0UlIw==", "integrity": "sha512-BWICuzzDvDoH54NHKCseDanAhE3CeDorgDL5MT6LMXXj2WCnd9UC2szdk4AWLfjdgNBCXLUanXYcpBBKOSWGwg==",
"dev": true, "dev": true,
"requires": { "requires": {
"type-fest": "^0.8.1" "type-fest": "^0.8.1"
@@ -4691,9 +4690,9 @@
"dev": true "dev": true
}, },
"import-fresh": { "import-fresh": {
"version": "3.2.1", "version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.2.1.tgz", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
"integrity": "sha512-6e1q1cnWP2RXD9/keSkxHScg508CdXqXWgWBaETNhyuBFz+kUZlKboh+ISK+bU++DmbHimVBrOz/zzPe0sZ3sQ==", "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==",
"dev": true, "dev": true,
"requires": { "requires": {
"parent-module": "^1.0.0", "parent-module": "^1.0.0",
@@ -4701,30 +4700,30 @@
} }
}, },
"inquirer": { "inquirer": {
"version": "7.0.6", "version": "7.3.3",
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.0.6.tgz", "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.3.3.tgz",
"integrity": "sha512-7SVO4h+QIdMq6XcqIqrNte3gS5MzCCKZdsq9DO4PJziBFNYzP3PGFbDjgadDb//MCahzgjCxvQ/O2wa7kx9o4w==", "integrity": "sha512-JG3eIAj5V9CwcGvuOmoo6LB9kbAYT8HXffUl6memuszlwDC/qvFAJw49XJ5NROSFNPxp3iQg1GqkFhaY/CR0IA==",
"dev": true, "dev": true,
"requires": { "requires": {
"ansi-escapes": "^4.2.1", "ansi-escapes": "^4.2.1",
"chalk": "^3.0.0", "chalk": "^4.1.0",
"cli-cursor": "^3.1.0", "cli-cursor": "^3.1.0",
"cli-width": "^2.0.0", "cli-width": "^3.0.0",
"external-editor": "^3.0.3", "external-editor": "^3.0.3",
"figures": "^3.0.0", "figures": "^3.0.0",
"lodash": "^4.17.15", "lodash": "^4.17.19",
"mute-stream": "0.0.8", "mute-stream": "0.0.8",
"run-async": "^2.4.0", "run-async": "^2.4.0",
"rxjs": "^6.5.3", "rxjs": "^6.6.0",
"string-width": "^4.1.0", "string-width": "^4.1.0",
"strip-ansi": "^6.0.0", "strip-ansi": "^6.0.0",
"through": "^2.3.6" "through": "^2.3.6"
}, },
"dependencies": { "dependencies": {
"chalk": { "chalk": {
"version": "3.0.0", "version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==", "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
"dev": true, "dev": true,
"requires": { "requires": {
"ansi-styles": "^4.1.0", "ansi-styles": "^4.1.0",
@@ -4761,9 +4760,9 @@
"dev": true "dev": true
}, },
"onetime": { "onetime": {
"version": "5.1.0", "version": "5.1.2",
"resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.0.tgz", "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
"integrity": "sha512-5NcSkPHhwTVFIQN+TUqXoS5+dlElHXdpAWu9I0HP20YOtIi+aZ0Ct82jdlILDxjLEAWwvm+qj1m6aEtsDVmm6Q==", "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
"dev": true, "dev": true,
"requires": { "requires": {
"mimic-fn": "^2.1.0" "mimic-fn": "^2.1.0"
@@ -4785,6 +4784,15 @@
"signal-exit": "^3.0.2" "signal-exit": "^3.0.2"
} }
}, },
"rxjs": {
"version": "6.6.3",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
"integrity": "sha512-trsQc+xYYXZ3urjOiJOuCOa5N3jAZ3eiSpQB5hIT8zGlL2QfnHLJ2r7GMkBGuIausdJN1OneaI6gQlsqNHHmZQ==",
"dev": true,
"requires": {
"tslib": "^1.9.0"
}
},
"semver": { "semver": {
"version": "6.3.0", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
@@ -4831,9 +4839,9 @@
} }
}, },
"supports-color": { "supports-color": {
"version": "7.1.0", "version": "7.2.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.1.0.tgz", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
"integrity": "sha512-oRSIpR8pxT1Wr2FquTNnGet79b3BWljqOuoW/h4oBhxJ/HUbX5nX6JSruTkvXDCFMwDPvsaTTbvMLKZWSy0R5g==", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
"dev": true, "dev": true,
"requires": { "requires": {
"has-flag": "^4.0.0" "has-flag": "^4.0.0"
@@ -4861,14 +4869,50 @@
} }
}, },
"eslint-plugin-vue": { "eslint-plugin-vue": {
"version": "6.2.1", "version": "7.0.0-beta.4",
"resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-6.2.1.tgz", "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.0.0-beta.4.tgz",
"integrity": "sha512-MiIDOotoWseIfLIfGeDzF6sDvHkVvGd2JgkvjyHtN3q4RoxdAXrAMuI3SXTOKatljgacKwpNAYShmcKZa4yZzw==", "integrity": "sha512-yb8Kki8b94a3A1sGum9TyVAkvPfKGPzWfZcXRmA2Tylt7TRi+b6mOtn1o6kM3NWatBs5gcGiCrH033DDPn0Msw==",
"dev": true, "dev": true,
"requires": { "requires": {
"eslint-utils": "^2.1.0",
"natural-compare": "^1.4.0", "natural-compare": "^1.4.0",
"semver": "^5.6.0", "semver": "^7.3.2",
"vue-eslint-parser": "^7.0.0" "vue-eslint-parser": "^7.1.0"
},
"dependencies": {
"eslint-utils": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-2.1.0.tgz",
"integrity": "sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==",
"dev": true,
"requires": {
"eslint-visitor-keys": "^1.1.0"
}
},
"lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"requires": {
"yallist": "^4.0.0"
}
},
"semver": {
"version": "7.3.4",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
"integrity": "sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==",
"dev": true,
"requires": {
"lru-cache": "^6.0.0"
}
},
"yallist": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
"dev": true
}
} }
}, },
"eslint-scope": { "eslint-scope": {
@@ -5428,9 +5472,9 @@
} }
}, },
"flatted": { "flatted": {
"version": "2.0.1", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.1.tgz", "resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.2.tgz",
"integrity": "sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg==", "integrity": "sha512-r5wGx7YeOwNWNlCA0wQ86zKyDLMQr+/RB8xy74M4hTphfmjlijTSSXGuH8rnvKZnfT9i+75zmd8jcKdMR4O6jA==",
"dev": true "dev": true
}, },
"flush-write-stream": { "flush-write-stream": {
@@ -5447,7 +5491,6 @@
"version": "1.11.0", "version": "1.11.0",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.11.0.tgz", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.11.0.tgz",
"integrity": "sha512-KZm0V+ll8PfBrKwMzdo5D13b1bur9Iq9Zd/RMmAoQQcl2PxxFml8cxXPaaPYVbV0RjNjq1CU7zIzAOqtUPudmA==", "integrity": "sha512-KZm0V+ll8PfBrKwMzdo5D13b1bur9Iq9Zd/RMmAoQQcl2PxxFml8cxXPaaPYVbV0RjNjq1CU7zIzAOqtUPudmA==",
"dev": true,
"requires": { "requires": {
"debug": "^3.0.0" "debug": "^3.0.0"
}, },
@@ -5456,7 +5499,6 @@
"version": "3.2.6", "version": "3.2.6",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
"integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==", "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
"dev": true,
"requires": { "requires": {
"ms": "^2.1.1" "ms": "^2.1.1"
} }
@@ -8017,8 +8059,7 @@
"ms": { "ms": {
"version": "2.1.2", "version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
"dev": true
}, },
"multicast-dns": { "multicast-dns": {
"version": "6.2.3", "version": "6.2.3",
@@ -11261,9 +11302,9 @@
"dev": true "dev": true
}, },
"strip-json-comments": { "strip-json-comments": {
"version": "3.0.1", "version": "3.1.1",
"resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.0.1.tgz", "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
"integrity": "sha512-VTyMAUfdm047mwKl+u79WIdrZxtFtn+nBxHeb844XBQ9uMNTuTHdx2hc5RiAJYqwTj3wc/xe5HLSdJSkJ+WfZw==", "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
"dev": true "dev": true
}, },
"stylehacks": { "stylehacks": {
@@ -11971,9 +12012,9 @@
"integrity": "sha512-Wg+ObZoYK6McHb5OOCFWvm0R7xHp0/p0G1ocx/8bO22jvA/yVY05rADbfiztwCokXBNfQuGv/XSd1ozcTFgekw==" "integrity": "sha512-Wg+ObZoYK6McHb5OOCFWvm0R7xHp0/p0G1ocx/8bO22jvA/yVY05rADbfiztwCokXBNfQuGv/XSd1ozcTFgekw=="
}, },
"v8-compile-cache": { "v8-compile-cache": {
"version": "2.1.0", "version": "2.2.0",
"resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.1.0.tgz", "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.2.0.tgz",
"integrity": "sha512-usZBT3PW+LOjM25wbqIlZwPeJV+3OSz3M1k1Ws8snlW39dZyYL9lOGC5FgPVHfk0jKmjiDV8Z0mIbVQPiwFs7g==", "integrity": "sha512-gTpR5XQNKFwOd4clxfnhaqvfqMpqEwr4tOtCyz4MtYZX2JYhfr1JvBFKdS+7K/9rfpZR3VLX+YWBbKoxCgS43Q==",
"dev": true "dev": true
}, },
"validate-npm-package-license": { "validate-npm-package-license": {
@@ -12026,28 +12067,62 @@
"integrity": "sha512-vuEUm6wYMMrFAHFCrkzIUAy8+MgPAbBGmYXnk2M6X6O2KHbMT1wuDD2izacmsSUp6ZM02e23MJRtPRobl88VMg==" "integrity": "sha512-vuEUm6wYMMrFAHFCrkzIUAy8+MgPAbBGmYXnk2M6X6O2KHbMT1wuDD2izacmsSUp6ZM02e23MJRtPRobl88VMg=="
}, },
"vue-eslint-parser": { "vue-eslint-parser": {
"version": "7.0.0", "version": "7.3.0",
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.0.0.tgz", "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.3.0.tgz",
"integrity": "sha512-yR0dLxsTT7JfD2YQo9BhnQ6bUTLsZouuzt9SKRP7XNaZJV459gvlsJo4vT2nhZ/2dH9j3c53bIx9dnqU2prM9g==", "integrity": "sha512-n5PJKZbyspD0+8LnaZgpEvNCrjQx1DyDHw8JdWwoxhhC+yRip4TAvSDpXGf9SWX6b0umeB5aR61gwUo6NVvFxw==",
"dev": true, "dev": true,
"requires": { "requires": {
"debug": "^4.1.1", "debug": "^4.1.1",
"eslint-scope": "^5.0.0", "eslint-scope": "^5.0.0",
"eslint-visitor-keys": "^1.1.0", "eslint-visitor-keys": "^1.1.0",
"espree": "^6.1.2", "espree": "^6.2.1",
"esquery": "^1.0.1", "esquery": "^1.0.1",
"lodash": "^4.17.15" "lodash": "^4.17.15"
}, },
"dependencies": { "dependencies": {
"acorn": {
"version": "7.4.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
"integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
"dev": true
},
"eslint-scope": { "eslint-scope": {
"version": "5.0.0", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.0.0.tgz", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
"integrity": "sha512-oYrhJW7S0bxAFDvWqzvMPRm6pcgcnWc4QnofCAqRTRfQC0JcwenzGglTtsLyIuuWFfkqDG9vz67cnttSd53djw==", "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
"dev": true, "dev": true,
"requires": { "requires": {
"esrecurse": "^4.1.0", "esrecurse": "^4.3.0",
"estraverse": "^4.1.1" "estraverse": "^4.1.1"
} }
},
"espree": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/espree/-/espree-6.2.1.tgz",
"integrity": "sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==",
"dev": true,
"requires": {
"acorn": "^7.1.1",
"acorn-jsx": "^5.2.0",
"eslint-visitor-keys": "^1.1.0"
}
},
"esrecurse": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
"integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
"dev": true,
"requires": {
"estraverse": "^5.2.0"
},
"dependencies": {
"estraverse": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
"integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
"dev": true
}
}
} }
} }
}, },

24
client/package.json
View File

@@ -22,10 +22,12 @@
"url": "git+https://github.com/AlexisNP/spellsaurus.git" "url": "git+https://github.com/AlexisNP/spellsaurus.git"
}, },
"scripts": { "scripts": {
"serve": "vue-cli-service serve" "lint": "vue-cli-service lint",
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
}, },
"dependencies": { "dependencies": {
"axios": "^0.19.2", "axios": "^0.21.1",
"bootstrap": "^4.5.0", "bootstrap": "^4.5.0",
"bootstrap-vue": "^2.15.0", "bootstrap-vue": "^2.15.0",
"core-js": "^3.6.4", "core-js": "^3.6.4",
@@ -43,27 +45,13 @@
"@vue/cli-plugin-eslint": "~4.2.0", "@vue/cli-plugin-eslint": "~4.2.0",
"@vue/cli-service": "~4.2.0", "@vue/cli-service": "~4.2.0",
"babel-eslint": "^10.0.3", "babel-eslint": "^10.0.3",
"eslint": "^6.7.2", "eslint": "^6.8.0",
"eslint-plugin-vue": "^6.1.2", "eslint-plugin-vue": "^7.0.0-beta.4",
"node-sass": "^4.14.1", "node-sass": "^4.14.1",
"sass-loader": "^8.0.2", "sass-loader": "^8.0.2",
"vue-router": "^3.1.6", "vue-router": "^3.1.6",
"vue-template-compiler": "^2.6.11" "vue-template-compiler": "^2.6.11"
}, },
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [ "browserslist": [
"> 1%", "> 1%",
"last 2 versions" "last 2 versions"

8
client/src/api/api.js
View File

@@ -1,9 +1,9 @@
import axios from "axios" import axios from "axios";
const url = process.env.VUE_APP_API_URL const url = process.env.VUE_APP_API_URL;
axios.defaults.headers.common[process.env.VUE_APP_API_KEY_NAME] = process.env.VUE_APP_API_KEY_VALUE axios.defaults.headers.common[process.env.VUE_APP_API_KEY_NAME] = process.env.VUE_APP_API_KEY_VALUE;
export default axios.create({ export default axios.create({
baseURL: url baseURL: url
}) });

10
client/src/api/ingredientsRepository.js
View File

@@ -1,12 +1,12 @@
import api from './api' import api from './api';
const resource = "/ingredients" const resource = "/ingredients";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
} };

10
client/src/api/metaschoolsRepository.js
View File

@@ -1,12 +1,12 @@
import api from './api' import api from './api';
const resource = "/meta_schools" const resource = "/meta_schools";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
} };

16
client/src/api/repositories.js
View File

@@ -1,9 +1,9 @@
import spellsRepository from './spellsRepository' import spellsRepository from './spellsRepository';
import schoolsRepository from './schoolsRepository' import schoolsRepository from './schoolsRepository';
import metaschoolsRepository from './metaschoolsRepository' import metaschoolsRepository from './metaschoolsRepository';
import variablesRepository from './variablesRepository' import variablesRepository from './variablesRepository';
import ingredientsRepository from './ingredientsRepository' import ingredientsRepository from './ingredientsRepository';
import usersRepository from './usersRepository' import usersRepository from './usersRepository';
// List of possible repositories // List of possible repositories
const repositories = { const repositories = {
@@ -13,9 +13,9 @@ const repositories = {
variables: variablesRepository, variables: variablesRepository,
ingredients: ingredientsRepository, ingredients: ingredientsRepository,
users: usersRepository, users: usersRepository,
} };
// Usage : RepositoryFactoryInstance.get('reponame'); // Usage : RepositoryFactoryInstance.get('reponame');
export const RepositoryFactory = { export const RepositoryFactory = {
get: name => repositories[name] get: name => repositories[name]
} };

12
client/src/api/schoolsRepository.js
View File

@@ -1,15 +1,15 @@
import api from './api' import api from './api';
const resource = "/schools" const resource = "/schools";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
getSpellsFromOne(id) { getSpellsFromOne(id) {
return api.get(`${resource}/${id}/spells`) return api.get(`${resource}/${id}/spells`);
}
} }
};

18
client/src/api/spellsRepository.js
View File

@@ -1,24 +1,24 @@
import api from './api' import api from './api';
const resource = "/spells" const resource = "/spells";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getPage(page) { getPage(page) {
return api.get(`${resource}/page/${page}`) return api.get(`${resource}/page/${page}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
addOne(data) { addOne(data) {
return api.post(`${resource}`, data) return api.post(`${resource}`, data);
}, },
updateOne(id, data) { updateOne(id, data) {
return api.put(`${resource}/${id}`, data) return api.put(`${resource}/${id}`, data);
}, },
deleteOne(id) { deleteOne(id) {
return api.delete(`${resource}/${id}`) return api.delete(`${resource}/${id}`);
}
} }
};

10
client/src/api/variablesRepository.js
View File

@@ -1,12 +1,12 @@
import api from './api' import api from './api';
const resource = "/variables" const resource = "/variables";
export default { export default {
getAll() { getAll() {
return api.get(`${resource}`) return api.get(`${resource}`);
}, },
getOne(id) { getOne(id) {
return api.get(`${resource}/${id}`) return api.get(`${resource}/${id}`);
}, },
} };

4
client/src/app.vue
View File

@@ -9,11 +9,11 @@
<script> <script>
export default { export default {
name: 'app', name: 'App',
metaInfo: { metaInfo: {
title: 'Auracle', title: 'Auracle',
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

22
client/src/components/global/loader.vue
View File

@@ -1,24 +1,24 @@
<template> <template>
<div class="lds-roller"> <div class="lds-roller">
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
<div></div> <div />
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'loader', name: 'Loader',
data() { data() {
return { return {
};
} }
} };
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

81
client/src/components/global/navbar/navbar.vue
View File

@@ -1,21 +1,70 @@
<template> <template>
<nav class="navbar navbar-expand-sm fixed-top navbar-dark bg-dark"> <nav class="navbar navbar-expand-sm fixed-top navbar-dark bg-dark">
<router-link :to="'/'" class="navbar-brand font-display font-weight-700">Auracle</router-link> <router-link
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation"> :to="'/'"
<span class="navbar-toggler-icon"></span> class="navbar-brand font-display font-weight-700"
>
Auracle
</router-link>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbar"
aria-controls="navbar"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon" />
</button> </button>
<div class="collapse navbar-collapse" id="navbar"> <div
<ul class="navbar-nav mr-auto" v-if="links.length != 0"> id="navbar"
<li class="nav-item" v-for="(link, index) in links" :key="index"> class="collapse navbar-collapse"
<router-link :to="link.url" class="nav-link">{{ link.text }}</router-link> >
<ul
v-if="links.length != 0"
class="navbar-nav mr-auto"
>
<li
v-for="(link, index) in links"
:key="index"
class="nav-item"
>
<router-link
:to="link.url"
class="nav-link"
>
{{ link.text }}
</router-link>
</li> </li>
</ul> </ul>
<div v-if="user" class="navbar-nav"> <div
<router-link :to="'/profil'" class="nav-link">{{ user.name }}</router-link> v-if="user"
<div @click="logoutUser()" class="nav-link">Deconnexion</div> class="navbar-nav"
>
<router-link
:to="'/profil'"
class="nav-link"
>
{{ user.name }}
</router-link>
<div
class="nav-link"
@click="logoutUser()"
>
Deconnexion
</div> </div>
<div v-else class="navbar-nav"> </div>
<router-link :to="'/connexion'" class="nav-link">Connexion</router-link> <div
v-else
class="navbar-nav"
>
<router-link
:to="'/connexion'"
class="nav-link"
>
Connexion
</router-link>
</div> </div>
</div> </div>
</nav> </nav>
@@ -24,7 +73,7 @@
<script> <script>
export default { export default {
name: 'navbar', name: 'Navbar',
data() { data() {
return { return {
links: [ links: [
@@ -41,11 +90,11 @@ export default {
url: '/ages', url: '/ages',
} }
] ]
} };
}, },
computed: { computed: {
user() { user() {
return this.$store.getters.getUserProfile return this.$store.getters.getUserProfile;
} }
}, },
methods: { methods: {
@@ -54,7 +103,7 @@ export default {
this.$router.push('/'); this.$router.push('/');
} }
} }
} };
</script> </script>

258
client/src/components/spells/add-spell-card.vue
View File

@@ -2,86 +2,218 @@
<b-modal <b-modal
ref="add_spell_modal" ref="add_spell_modal"
size="lg" size="lg"
modal-class="b-modal"> modal-class="b-modal"
>
<template v-slot:modal-header="{ close }"> <template #modal-header="{ close }">
<div class="h1 modal-title font-display font-weight-bold" id="spell_show_edit_modal"> <div
id="spell_show_edit_modal"
class="h1 modal-title font-display font-weight-bold"
>
<div class="line-height-100"> <div class="line-height-100">
<span v-if="!spell.name">Nouveau sort</span> <span v-if="!spell.name">Nouveau sort</span>
<span v-if="spell.name">{{ spell.name }}</span> <span v-if="spell.name">{{ spell.name }}</span>
</div> </div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @click="close()"> <button
type="button"
class="close"
data-dismiss="modal"
aria-label="Close"
@click="close()"
>
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</template> </template>
<template v-slot:default> <template #default>
<form id="add-spell" @submit="addSpell"> <form
id="add-spell"
@submit="addSpell"
>
<div class="form-group"> <div class="form-group">
<label for="spell_name" class="font-weight-bold col-form-label">Nom&nbsp;:</label> <label
<input type="text" class="form-control" name="spell_name" id="spell_name" placeholder="(256 caractères max.)" v-model="spell.name"> for="spell_name"
class="font-weight-bold col-form-label"
>Nom&nbsp;:</label>
<input
id="spell_name"
v-model="spell.name"
type="text"
class="form-control"
name="spell_name"
placeholder="(256 caractères max.)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_description" class="font-weight-bold col-form-label">Description&nbsp;:</label> <label
<textarea class="form-control" name="spell_description" id="spell_description" placeholder="(2048 caractères max.)" v-model="spell.description"></textarea> for="spell_description"
class="font-weight-bold col-form-label"
>Description&nbsp;:</label>
<textarea
id="spell_description"
v-model="spell.description"
class="form-control"
name="spell_description"
placeholder="(2048 caractères max.)"
/>
</div> </div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="spell_ritual" name="spell_ritual" v-model="spell.is_ritual"> <input
<label for="spell_ritual" class="font-weight-bold col-form-label">Rituel ?&nbsp;</label> id="spell_ritual"
v-model="spell.is_ritual"
type="checkbox"
class="form-check-input"
name="spell_ritual"
>
<label
for="spell_ritual"
class="font-weight-bold col-form-label"
>Rituel ?&nbsp;</label>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_level" class="font-weight-bold col-form-label">Niveau&nbsp;:</label> <label
<input type="number" class="form-control" name="spell_level" id="spell_level" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.level"> for="spell_level"
class="font-weight-bold col-form-label"
>Niveau&nbsp;:</label>
<input
id="spell_level"
v-model="spell.level"
type="number"
class="form-control"
name="spell_level"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_schools" class="font-weight-bold col-form-label">École(s)&nbsp;:</label> <label
<select class="form-control" id="spell_schools" name="spell_schools" multiple v-model="spell.schools"> for="spell_schools"
<option v-for="(school, index) in all_schools" :key="index" :value="'school_' + school.id">{{school.name}}</option> class="font-weight-bold col-form-label"
>École(s)&nbsp;:</label>
<select
id="spell_schools"
v-model="spell.schools"
class="form-control"
name="spell_schools"
multiple
>
<option
v-for="(school, index) in all_schools"
:key="index"
:value="'school_' + school.id"
>
{{ school.name }}
</option>
</select> </select>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_charge" class="font-weight-bold col-form-label">Charge&nbsp;:</label> <label
<input type="number" class="form-control" name="spell_charge" id="spell_charge" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.charge"> for="spell_charge"
class="font-weight-bold col-form-label"
>Charge&nbsp;:</label>
<input
id="spell_charge"
v-model="spell.charge"
type="number"
class="form-control"
name="spell_charge"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_ingredients" class="font-weight-bold col-form-label">Ingrédient(s)&nbsp;:</label> <label
<select class="form-control" id="spell_ingredients" name="spell_ingredients" multiple v-model="spell.ingredients"> for="spell_ingredients"
<option v-for="(ingredient,index) in all_ingredients" :key="index" :value="'ingredient_' + ingredient.id">{{ingredient.name}}</option> class="font-weight-bold col-form-label"
>Ingrédient(s)&nbsp;:</label>
<select
id="spell_ingredients"
v-model="spell.ingredients"
class="form-control"
name="spell_ingredients"
multiple
>
<option
v-for="(ingredient,index) in all_ingredients"
:key="index"
:value="'ingredient_' + ingredient.id"
>
{{ ingredient.name }}
</option>
</select> </select>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_cost" class="font-weight-bold col-form-label">Coût&nbsp;:</label> <label
<input type="text" class="form-control" name="spell_cost" id="spell_cost" placeholder="(32 caractères max.)" v-model="spell.cost"> for="spell_cost"
class="font-weight-bold col-form-label"
>Coût&nbsp;:</label>
<input
id="spell_cost"
v-model="spell.cost"
type="text"
class="form-control"
name="spell_cost"
placeholder="(32 caractères max.)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_variables" class="font-weight-bold col-form-label">Variable(s)&nbsp;:</label> <label
<select class="form-control" id="spell_variables" name="spell_variables" multiple v-model="spell.variables"> for="spell_variables"
<option v-for="(variable,index) in all_variables" :key="index" :value="'variable_' + variable.id">{{variable.description}}</option> class="font-weight-bold col-form-label"
>Variable(s)&nbsp;:</label>
<select
id="spell_variables"
v-model="spell.variables"
class="form-control"
name="spell_variables"
multiple
>
<option
v-for="(variable,index) in all_variables"
:key="index"
:value="'variable_' + variable.id"
>
{{ variable.description }}
</option>
</select> </select>
</div> </div>
</form> </form>
</template> </template>
<template v-slot:modal-footer="{ close }"> <template #modal-footer="{ close }">
<button type="button" class="btn btn-secondary" data-dismiss="modal" @click="close()">Fermer</button> <button
<input type="submit" class="btn btn-primary" value="Enregistrer" form="add-spell"> type="button"
class="btn btn-secondary"
data-dismiss="modal"
@click="close()"
>
Fermer
</button>
<input
type="submit"
class="btn btn-primary"
value="Enregistrer"
form="add-spell"
>
</template> </template>
</b-modal> </b-modal>
</template> </template>
<script> <script>
// API // API
import { RepositoryFactory } from "@/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
const Schools = RepositoryFactory.get('schools') const Schools = RepositoryFactory.get('schools');
const Variables = RepositoryFactory.get('variables') const Variables = RepositoryFactory.get('variables');
const Ingredients = RepositoryFactory.get('ingredients') const Ingredients = RepositoryFactory.get('ingredients');
export default { export default {
'name': 'add-spell-card', 'name': 'AddSpellCard',
data() { data() {
return { return {
spell: { spell: {
@@ -99,37 +231,43 @@ export default {
all_schools: [], all_schools: [],
all_variables: [], all_variables: [],
all_ingredients: [], all_ingredients: [],
} };
}, },
created() { created() {
// Gets all relevant info for multiple selects // Gets all relevant info for multiple selects
let fetchSchools = Schools.getAll() let fetchSchools = Schools.getAll();
let fetchVariables = Variables.getAll() let fetchVariables = Variables.getAll();
let fetchIngredients = Ingredients.getAll() let fetchIngredients = Ingredients.getAll();
Promise.all([fetchSchools, fetchVariables, fetchIngredients]) Promise.all([fetchSchools, fetchVariables, fetchIngredients])
.then(v => { .then(v => {
this.all_schools = v[0].data this.all_schools = v[0].data;
this.all_variables = v[1].data this.all_variables = v[1].data;
this.all_ingredients = v[2].data this.all_ingredients = v[2].data;
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}, },
mounted() { mounted() {
this.$refs["add_spell_modal"].show() this.$refs["add_spell_modal"].show();
this.$root.$on('bv::modal::hide', () => { this.$root.$on('bv::modal::hide', () => {
this.$emit('cancelAdd') this.$emit('cancelAdd');
}) });
}, },
methods: { methods: {
addSpell(e) { addSpell(e) {
e.preventDefault() e.preventDefault();
let schoolsData = Object.values(this.spell.schools).map(v => { return parseInt(v.slice(7)) }) let schoolsData = Object.values(this.spell.schools).map(v => {
let variablesData = Object.values(this.spell.variables).map(v => { return parseInt(v.slice(9)) }) return parseInt(v.slice(7));
let ingredientsData = Object.values(this.spell.ingredients).map(v => { return parseInt(v.slice(11)) }) });
let variablesData = Object.values(this.spell.variables).map(v => {
return parseInt(v.slice(9));
});
let ingredientsData = Object.values(this.spell.ingredients).map(v => {
return parseInt(v.slice(11));
});
let data = { let data = {
name: this.spell.name, name: this.spell.name,
@@ -141,19 +279,19 @@ export default {
schools: schoolsData, schools: schoolsData,
variables: variablesData, variables: variablesData,
ingredients: ingredientsData, ingredients: ingredientsData,
} };
Spells.addOne(data) Spells.addOne(data)
.then(v => { .then(v => {
this.$emit('addSpell', v.data) this.$emit('addSpell', v.data);
this.$refs["add_spell_modal"].hide() this.$refs["add_spell_modal"].hide();
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

324
client/src/components/spells/edit-spell-card.vue
View File

@@ -3,80 +3,218 @@
ref="edit_spell_modal" ref="edit_spell_modal"
size="lg" size="lg"
modal-class="b-modal" modal-class="b-modal"
:spell="computeSpell"> :spell="computeSpell"
>
<template v-slot:modal-header="{ close }"> <template #modal-header="{ close }">
<div class="h1 modal-title font-display font-weight-bold" id="spell_show_edit_modal"><div class="line-height-100">{{spell.name}}#{{spell.id}}</div></div> <div
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @click="close()"> id="spell_show_edit_modal"
class="h1 modal-title font-display font-weight-bold"
>
<div class="line-height-100">
{{ spell.name }}#{{ spell.id }}
</div>
</div>
<button
type="button"
class="close"
data-dismiss="modal"
aria-label="Close"
@click="close()"
>
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</template> </template>
<template v-slot:default> <template #default>
<form id="update-spell" ref="update-spell" @submit="updateSpell"> <form
id="update-spell"
ref="update-spell"
@submit="updateSpell"
>
<div class="form-group"> <div class="form-group">
<label for="spell_name" class="font-weight-bold col-form-label">Nom&nbsp;:</label> <label
<input type="text" class="form-control" name="spell_name" id="spell_name" placeholder="(256 caractères max.)" v-model="spell.name"> for="spell_name"
class="font-weight-bold col-form-label"
>Nom&nbsp;:</label>
<input
id="spell_name"
v-model="spell.name"
type="text"
class="form-control"
name="spell_name"
placeholder="(256 caractères max.)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_description" class="font-weight-bold col-form-label">Description&nbsp;:</label> <label
<textarea class="form-control" name="spell_description" id="spell_description" placeholder="(2048 caractères max.)" v-model="spell.description"></textarea> for="spell_description"
class="font-weight-bold col-form-label"
>Description&nbsp;:</label>
<textarea
id="spell_description"
v-model="spell.description"
class="form-control"
name="spell_description"
placeholder="(2048 caractères max.)"
/>
</div> </div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="spell_ritual" name="spell_ritual" v-model="spell.is_ritual"> <input
<label for="spell_ritual" class="font-weight-bold col-form-label">Rituel ?&nbsp;</label> id="spell_ritual"
v-model="spell.is_ritual"
type="checkbox"
class="form-check-input"
name="spell_ritual"
>
<label
for="spell_ritual"
class="font-weight-bold col-form-label"
>Rituel ?&nbsp;</label>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_level" class="font-weight-bold col-form-label">Niveau&nbsp;:</label> <label
<input type="number" class="form-control" name="spell_level" id="spell_level" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.level"> for="spell_level"
class="font-weight-bold col-form-label"
>Niveau&nbsp;:</label>
<input
id="spell_level"
v-model="spell.level"
type="number"
class="form-control"
name="spell_level"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_schools" class="font-weight-bold col-form-label">École(s)&nbsp;:</label> <label
<select class="form-control" id="spell_schools" name="spell_schools" multiple v-model="spell.spell_school_ids_value"> for="spell_schools"
<option v-for="(school, index) in all_schools" :key="index" :value="'school_' + school.id">{{school.name}}</option> class="font-weight-bold col-form-label"
>École(s)&nbsp;:</label>
<select
id="spell_schools"
v-model="spell.spell_school_ids_value"
class="form-control"
name="spell_schools"
multiple
>
<option
v-for="(school, index) in all_schools"
:key="index"
:value="'school_' + school.id"
>
{{ school.name }}
</option>
</select> </select>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_charge" class="font-weight-bold col-form-label">Charge&nbsp;:</label> <label
<input type="number" class="form-control" name="spell_charge" id="spell_charge" min="0" max="100" step="1" placeholder="(Nombre entier de 0 à 100)" v-model="spell.charge"> for="spell_charge"
class="font-weight-bold col-form-label"
>Charge&nbsp;:</label>
<input
id="spell_charge"
v-model="spell.charge"
type="number"
class="form-control"
name="spell_charge"
min="0"
max="100"
step="1"
placeholder="(Nombre entier de 0 à 100)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_ingredients" class="font-weight-bold col-form-label">Ingrédient(s)&nbsp;:</label> <label
<select class="form-control" id="spell_ingredients" name="spell_ingredients" multiple v-model="spell.spell_ingredient_ids_value"> for="spell_ingredients"
<option v-for="(ingredient,index) in all_ingredients" :key="index" :value="'ingredient_' + ingredient.id">{{ingredient.name}}</option> class="font-weight-bold col-form-label"
>Ingrédient(s)&nbsp;:</label>
<select
id="spell_ingredients"
v-model="spell.spell_ingredient_ids_value"
class="form-control"
name="spell_ingredients"
multiple
>
<option
v-for="(ingredient,index) in all_ingredients"
:key="index"
:value="'ingredient_' + ingredient.id"
>
{{ ingredient.name }}
</option>
</select> </select>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_cost" class="font-weight-bold col-form-label">Coût&nbsp;:</label> <label
<input type="text" class="form-control" name="spell_cost" id="spell_cost" placeholder="(32 caractères max.)" v-model="spell.cost"> for="spell_cost"
class="font-weight-bold col-form-label"
>Coût&nbsp;:</label>
<input
id="spell_cost"
v-model="spell.cost"
type="text"
class="form-control"
name="spell_cost"
placeholder="(32 caractères max.)"
>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="spell_variables" class="font-weight-bold col-form-label">Variable(s)&nbsp;:</label> <label
<select class="form-control" id="spell_variables" name="spell_variables" multiple v-model="spell.spell_variable_ids_value"> for="spell_variables"
<option v-for="(variable,index) in all_variables" :key="index" :value="'variable_' + variable.id">{{variable.description}}</option> class="font-weight-bold col-form-label"
>Variable(s)&nbsp;:</label>
<select
id="spell_variables"
v-model="spell.spell_variable_ids_value"
class="form-control"
name="spell_variables"
multiple
>
<option
v-for="(variable,index) in all_variables"
:key="index"
:value="'variable_' + variable.id"
>
{{ variable.description }}
</option>
</select> </select>
</div> </div>
</form> </form>
</template> </template>
<template v-slot:modal-footer="{ close }"> <template #modal-footer="{ close }">
<button type="button" class="btn btn-danger" data-dismiss="modal" @click="close()">Fermer</button> <button
type="button"
class="btn btn-danger"
data-dismiss="modal"
@click="close()"
>
Fermer
</button>
<!-- <input type="button" class="btn btn-success" value="Enregistrer comme nouveau" @click="cloneSpell()"> --> <!-- <input type="button" class="btn btn-success" value="Enregistrer comme nouveau" @click="cloneSpell()"> -->
<input type="submit" class="btn btn-primary" value="Enregistrer" form="update-spell"> <input
type="submit"
class="btn btn-primary"
value="Enregistrer"
form="update-spell"
>
</template> </template>
</b-modal> </b-modal>
</template> </template>
<script> <script>
// API // API
import { RepositoryFactory } from "@/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
const Schools = RepositoryFactory.get('schools') const Schools = RepositoryFactory.get('schools');
const Variables = RepositoryFactory.get('variables') const Variables = RepositoryFactory.get('variables');
const Ingredients = RepositoryFactory.get('ingredients') const Ingredients = RepositoryFactory.get('ingredients');
export default { export default {
name: 'edit-spell-card', name: 'EditSpellCard',
props: { props: {
spell: { spell: {
type: Object, type: Object,
@@ -95,80 +233,86 @@ export default {
all_schools: [], all_schools: [],
all_variables: [], all_variables: [],
all_ingredients: [], all_ingredients: [],
} };
}, },
computed: { computed: {
computeSpell() { computeSpell() {
let output = this.spell let output = this.spell;
output.spell_school_ids = [] output.spell_school_ids = [];
output.spell_variable_ids = [] output.spell_variable_ids = [];
output.spell_ingredient_ids = [] output.spell_ingredient_ids = [];
output.spell_school_ids_value = [] output.spell_school_ids_value = [];
output.spell_variable_ids_value = [] output.spell_variable_ids_value = [];
output.spell_ingredient_ids_value = [] output.spell_ingredient_ids_value = [];
output.schools.forEach(element => { output.schools.forEach(element => {
output.spell_school_ids.push(element['id']) output.spell_school_ids.push(element['id']);
}) });
output.variables.forEach(element => { output.variables.forEach(element => {
output.spell_variable_ids.push(element['id']) output.spell_variable_ids.push(element['id']);
}) });
output.ingredients.forEach(element => { output.ingredients.forEach(element => {
output.spell_ingredient_ids.push(element['id']) output.spell_ingredient_ids.push(element['id']);
}) });
output.spell_school_ids.forEach(element => { output.spell_school_ids.forEach(element => {
output.spell_school_ids_value.push("school_" + element) output.spell_school_ids_value.push("school_" + element);
}) });
output.spell_variable_ids.forEach(element => { output.spell_variable_ids.forEach(element => {
output.spell_variable_ids_value.push("variable_" + element) output.spell_variable_ids_value.push("variable_" + element);
}) });
output.spell_ingredient_ids.forEach(element => { output.spell_ingredient_ids.forEach(element => {
output.spell_ingredient_ids_value.push("ingredient_" + element) output.spell_ingredient_ids_value.push("ingredient_" + element);
}) });
return output return output;
} }
}, },
created() {
// Gets all relevant info for multiple selects
let fetchSchools = Schools.getAll()
let fetchVariables = Variables.getAll()
let fetchIngredients = Ingredients.getAll()
Promise.all([fetchSchools, fetchVariables, fetchIngredients])
.then(v => {
this.all_schools = v[0].data
this.all_variables = v[1].data
this.all_ingredients = v[2].data
})
.catch(err => {
console.log(err)
})
},
mounted() {
this.$refs["edit_spell_modal"].show()
this.$root.$on('bv::modal::hide', () => {
this.$emit('editSpell', {})
})
},
watch: { watch: {
computeSpell: { computeSpell: {
deep: true, deep: true,
handler() { handler() {
this.$refs["edit_spell_modal"].show() this.$refs["edit_spell_modal"].show();
} }
} }
}, },
created() {
// Gets all relevant info for multiple selects
let fetchSchools = Schools.getAll();
let fetchVariables = Variables.getAll();
let fetchIngredients = Ingredients.getAll();
Promise.all([fetchSchools, fetchVariables, fetchIngredients])
.then(v => {
this.all_schools = v[0].data;
this.all_variables = v[1].data;
this.all_ingredients = v[2].data;
})
.catch(err => {
console.log(err);
});
},
mounted() {
this.$refs["edit_spell_modal"].show();
this.$root.$on('bv::modal::hide', () => {
this.$emit('editSpell', {});
});
},
methods: { methods: {
cloneSpell() { cloneSpell() {
}, },
updateSpell(e) { updateSpell(e) {
e.preventDefault() e.preventDefault();
let schoolsData = Object.values(this.spell.spell_school_ids_value).map(v => { return parseInt(v.slice(7)) }) let schoolsData = Object.values(this.spell.spell_school_ids_value).map(v => {
let variablesData = Object.values(this.spell.spell_variable_ids_value).map(v => { return parseInt(v.slice(9)) }) return parseInt(v.slice(7));
let ingredientsData = Object.values(this.spell.spell_ingredient_ids_value).map(v => { return parseInt(v.slice(11)) }) });
let variablesData = Object.values(this.spell.spell_variable_ids_value).map(v => {
return parseInt(v.slice(9));
});
let ingredientsData = Object.values(this.spell.spell_ingredient_ids_value).map(v => {
return parseInt(v.slice(11));
});
let data = { let data = {
name: this.spell.name, name: this.spell.name,
@@ -180,18 +324,18 @@ export default {
schools: schoolsData, schools: schoolsData,
variables: variablesData, variables: variablesData,
ingredients: ingredientsData, ingredients: ingredientsData,
} };
Spells.updateOne(this.spell.id, data) Spells.updateOne(this.spell.id, data)
.then(v => { .then(v => {
this.$emit('updateSpell', v.data) this.$emit('updateSpell', v.data);
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}, },
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

118
client/src/components/spells/spell-card.vue
View File

@@ -1,55 +1,98 @@
<template> <template>
<div <div
:class="main_school" :class="main_school"
class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer"> class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer"
<div class="spellcard bg-white p-4 rounded text-dark shadow" style="border-left-width:4px;border-left-style:solid;"> >
<div
<div :title="spell.name" class="h3 font-display font-weight-bold text-wrap word-break" style="line-height:100%;"> class="spellcard bg-white p-4 rounded text-dark shadow"
<router-link :to="`/sorts/${spell.id}`" class="text-decoration-none">{{spell.name}}</router-link> style="border-left-width:4px;border-left-style:solid;"
>
<div
:title="spell.name"
class="h3 font-display font-weight-bold text-wrap word-break"
style="line-height:100%;"
>
<router-link
:to="`/sorts/${spell.id}`"
class="text-decoration-none"
>
{{ spell.name }}
</router-link>
</div> </div>
<div> <div>
<div class="font-weight-700 text-muted d-inline-block">Niveau {{spell.level}}</div> <div class="font-weight-700 text-muted d-inline-block">
Niveau {{ spell.level }}
</div>
<span> · </span> <span> · </span>
<div class="text-muted d-inline-block"> <div class="text-muted d-inline-block">
<span v-for="(school,index) in spell.schools" :key="index"> <span
v-for="(school,index) in spell.schools"
:key="index"
>
<span v-if="index!=0">, </span> <span v-if="index!=0">, </span>
<router-link :to="`ecoles/${school.id}`" class="text-secondary">{{school.name}}</router-link> <router-link
:to="`ecoles/${school.id}`"
class="text-secondary"
>{{ school.name }}</router-link>
</span> </span>
</div> </div>
</div> </div>
<div v-if="spell.charge!=0" class="small font-weight-bold"> <div
v-if="spell.charge!=0"
class="small font-weight-bold"
>
<span>Charge {{ spell.charge }} tour(s)</span> <span>Charge {{ spell.charge }} tour(s)</span>
</div> </div>
<div v-if="spell.is_ritual" class="small font-weight-bold"> <div
v-if="spell.is_ritual"
class="small font-weight-bold"
>
<span>Rituel</span> <span>Rituel</span>
</div> </div>
<div v-if="spell.ingredients.length>0" class="small"> <div
v-if="spell.ingredients.length>0"
class="small"
>
<span class="font-weight-bold">Nécessite </span> <span class="font-weight-bold">Nécessite </span>
<span v-for="(ingredient,index) in spell.ingredients" :key="index"> <span
v-for="(ingredient,index) in spell.ingredients"
:key="index"
>
<span v-if="index!=0">, </span> <span v-if="index!=0">, </span>
<span>{{ ingredient.name }}</span> <span>{{ ingredient.name }}</span>
</span> </span>
</div> </div>
<div <div
v-clipboard="spell.description"
:id="'spell_description_' + spell.id" :id="'spell_description_' + spell.id"
v-clipboard="spell.description"
v-b-tooltip.click v-b-tooltip.click
placement="bottom" placement="bottom"
title="Description copiée !" title="Description copiée !"
class="small text-muted mt-2"> class="small text-muted mt-2"
>
<span class="prewrap">{{ spell.description }}</span> <span class="prewrap">{{ spell.description }}</span>
</div> </div>
<div class="mt-2"> <div class="mt-2">
<div class="font-weight-bold d-inline-block"><span>Coût : </span>{{spell.cost}}</div> <div class="font-weight-bold d-inline-block">
<div v-if="spell.variables.length>0" class="small d-inline-block">, où&nbsp;:</div> <span>Coût : </span>{{ spell.cost }}
<div class=small> </div>
<span v-for="(variable,index) in spell.variables" :key="index"> <div
v-if="spell.variables.length>0"
class="small d-inline-block"
>
, où&nbsp;:
</div>
<div class="small">
<span
v-for="(variable,index) in spell.variables"
:key="index"
>
<span class="font-weight-bold"> <span class="font-weight-bold">
<span v-if="index!=0"><br></span> <span v-if="index!=0"><br></span>
<span>{{ String.fromCharCode(120+index) }}</span> <span>{{ String.fromCharCode(120+index) }}</span>
@@ -57,12 +100,21 @@
<span> = {{ variable.description }}</span> <span> = {{ variable.description }}</span>
</span> </span>
</div> </div>
<footer v-if="user" class="text-right"> <footer
v-if="user"
class="text-right"
>
<a class="h5 text-secondary mr-1"> <a class="h5 text-secondary mr-1">
<i class="mad" @click="editSpell(spell)">edit</i> <i
class="mad"
@click="editSpell(spell)"
>edit</i>
</a> </a>
<a class="h5 text-danger"> <a class="h5 text-danger">
<i class="mad" @click="deleteSpell(spell)">delete</i> <i
class="mad"
@click="deleteSpell(spell)"
>delete</i>
</a> </a>
</footer> </footer>
</div> </div>
@@ -72,39 +124,39 @@
<script> <script>
// API // API
import { RepositoryFactory } from "@/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
export default { export default {
name: 'spell-card', name: 'SpellCard',
props: { props: {
spell: Object, spell: Object,
}, },
data() { data() {
return { return {
main_school: this.spell.schools[0].name, main_school: this.spell.schools[0].name,
} };
},
created() {
this.main_school = this.main_school.toLowerCase()
}, },
computed: { computed: {
user() { user() {
return this.$store.getters.getUserProfile return this.$store.getters.getUserProfile;
} }
}, },
created() {
this.main_school = this.main_school.toLowerCase();
},
methods: { methods: {
editSpell(spell) { editSpell(spell) {
this.$emit('editSpell', spell) this.$emit('editSpell', spell);
}, },
deleteSpell(spell) { deleteSpell(spell) {
Spells.deleteOne(this.spell.id) Spells.deleteOne(this.spell.id)
.then(() => { .then(() => {
this.$emit('deleteSpell', spell) this.$emit('deleteSpell', spell);
}) });
} }
}, },
} };
</script> </script>

218
client/src/components/spells/spells-list.vue
View File

@@ -1,31 +1,88 @@
<template> <template>
<div class="spell-list-wrapper"> <div class="spell-list-wrapper">
<div class="mb-4"> <div class="mb-4">
<form> <form>
<div class="form-group mb-2"> <div class="form-group mb-2">
<input type="text" class="form-control" v-model="search_text" name="search_terms" id="search_terms" placeholder="Rechercher l'arcane"> <input
id="search_terms"
v-model="search_text"
type="text"
class="form-control"
name="search_terms"
placeholder="Rechercher l'arcane"
>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_name" value="search_fields_name"> <input
<label class="form-check-label" for="search_fields_name">Nom</label> id="search_fields_name"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_name"
>
<label
class="form-check-label"
for="search_fields_name"
>Nom</label>
</div> </div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_description" value="search_fields_description" checked> <input
<label class="form-check-label" for="search_fields_description">Description</label> id="search_fields_description"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_description"
checked
>
<label
class="form-check-label"
for="search_fields_description"
>Description</label>
</div> </div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_schools" value="search_fields_schools" disabled> <input
<label class="form-check-label" for="search_fields_schools">École(s)</label> id="search_fields_schools"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_schools"
disabled
>
<label
class="form-check-label"
for="search_fields_schools"
>
École(s)
</label>
</div> </div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_ingredients" value="search_fields_ingredients" disabled> <input
<label class="form-check-label" for="search_fields_ingredients">Ingrédients</label> id="search_fields_ingredients"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_ingredients"
disabled
>
<label
class="form-check-label"
for="search_fields_ingredients"
>Ingrédients</label>
</div> </div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="search_term" id="search_fields_variables" value="search_fields_variables" disabled> <input
<label class="form-check-label" for="search_fields_variables">Variables</label> id="search_fields_variables"
class="form-check-input"
type="radio"
name="search_term"
value="search_fields_variables"
disabled
>
<label
class="form-check-label"
for="search_fields_variables"
>Variables</label>
</div> </div>
</div> </div>
</form> </form>
@@ -33,46 +90,52 @@
<button <button
v-if="user" v-if="user"
@click="showAdd"
type="button" type="button"
class="btn font-display font-weight-bold btn-lg btn-outline-dark btn-block shadow-sm mb-4"> class="btn font-display font-weight-bold btn-lg btn-outline-dark btn-block shadow-sm mb-4"
@click="showAdd"
>
<i class="mad">add</i> <i class="mad">add</i>
<span>Ajouter un sort</span> <span>Ajouter un sort</span>
</button> </button>
<div <div
v-if="filteredSpells.length > 0" v-if="filteredSpells.length > 0"
class="spell-list-wrapper"> class="spell-list-wrapper"
>
<div <div
class="row spells-list"
v-masonry v-masonry
class="row spells-list"
transition-duration="1s" transition-duration="1s"
item-selector=".spell-card"> item-selector=".spell-card"
>
<spell-card <spell-card
class="spell-card"
v-masonry-tile
v-for="(spell) in filteredSpells" v-for="(spell) in filteredSpells"
:key="spell.id" :key="spell.id"
v-masonry-tile
class="spell-card"
:spell="spell" :spell="spell"
@editSpell="editSpell" @editSpell="editSpell"
@deleteSpell="deleteSpell" /> @deleteSpell="deleteSpell"
/>
</div> </div>
<edit-spell-card <edit-spell-card
v-if="Object.keys(current_edit_spell).length > 0" v-if="Object.keys(current_edit_spell).length > 0"
:spell="current_edit_spell" :spell="current_edit_spell"
@editSpell="editSpell" @editSpell="editSpell"
@updateSpell="updateSpell"/> @updateSpell="updateSpell"
/>
<add-spell-card <add-spell-card
v-if="adding_spell" v-if="adding_spell"
@cancelAdd="cancelAdd" @cancelAdd="cancelAdd"
@addSpell="addSpell"/> @addSpell="addSpell"
/>
</div> </div>
<div <div
v-else v-else
class="loader-wrapper"> class="loader-wrapper"
>
<loader /> <loader />
</div> </div>
</div> </div>
@@ -80,24 +143,27 @@
<script> <script>
// Components // Components
import SpellCard from "./spell-card" import SpellCard from "./spell-card";
import EditSpellCard from "./edit-spell-card" import EditSpellCard from "./edit-spell-card";
import AddSpellCard from "./add-spell-card" import AddSpellCard from "./add-spell-card";
// API // API
import { RepositoryFactory } from "~/api/repositories" import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells') const Spells = RepositoryFactory.get('spells');
const Schools = RepositoryFactory.get('schools') const Schools = RepositoryFactory.get('schools');
export default { export default {
name: 'spellslist', name: 'Spellslist',
components: { components: {
'spell-card': SpellCard, 'spell-card': SpellCard,
'edit-spell-card': EditSpellCard, 'edit-spell-card': EditSpellCard,
'add-spell-card': AddSpellCard, 'add-spell-card': AddSpellCard,
}, },
props: { props: {
school_id: String, schoolId: {
type: Number,
default: 1
},
}, },
data() { data() {
return { return {
@@ -107,118 +173,118 @@ export default {
currentIndex: 1, currentIndex: 1,
adding_spell: false, adding_spell: false,
search_text: "", search_text: "",
} };
}, },
computed: { computed: {
filteredSpells() { filteredSpells() {
return this.spells return this.spells;
}, },
user() { user() {
return this.$store.state.user return this.$store.state.user;
} }
}, },
beforeMount() { beforeMount() {
this.spells = this.filteredSpells this.spells = this.filteredSpells;
if (!this.school_id) { if (!this.school_id) {
this.getInitialSpells() this.getInitialSpells();
} else { } else {
this.getInitialSchoolSpells() this.getInitialSchoolSpells();
} }
}, },
mounted() { mounted() {
if (!this.school_id) { if (!this.school_id) {
this.scroll() this.scroll();
} }
}, },
methods: { methods: {
getInitialSpells() { getInitialSpells() {
Spells.getPage(this.currentIndex) Spells.getPage(this.currentIndex)
.then(v => { .then(v => {
this.loading = true this.loading = true;
let spells = this.filteredSpells let spells = this.filteredSpells;
spells.push(v.data) spells.push(v.data);
this.spells = spells[0] this.spells = spells[0];
}) })
.then(() => { .then(() => {
this.currentIndex++ this.currentIndex++;
this.loading = false this.loading = false;
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}, },
getInitialSchoolSpells() { getInitialSchoolSpells() {
Schools.getSpellsFromOne(this.school_id) Schools.getSpellsFromOne(this.school_id)
.then(v => { .then(v => {
this.loading = true this.loading = true;
let spells = this.filteredSpells let spells = this.filteredSpells;
spells.push(v.data.spells) spells.push(v.data.spells);
this.spells = spells[0] this.spells = spells[0];
}) })
.then(() => { .then(() => {
this.currentIndex++ this.currentIndex++;
this.loading = false this.loading = false;
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}, },
scroll() { scroll() {
window.onscroll = () => { window.onscroll = () => {
if (((window.innerHeight + window.scrollY) - document.body.offsetHeight) >= -1) { if (((window.innerHeight + window.scrollY) - document.body.offsetHeight) >= -1) {
Spells.getPage(this.currentIndex) Spells.getPage(this.currentIndex)
.then(v => { .then(v => {
this.loading = true this.loading = true;
let spells = this.filteredSpells let spells = this.filteredSpells;
for (let i = 0; i < v.data.length; i++) { for (let i = 0; i < v.data.length; i++) {
const element = v.data[i]; const element = v.data[i];
spells.push(element) spells.push(element);
} }
}) })
.then(() => { .then(() => {
this.currentIndex++ this.currentIndex++;
this.loading = false this.loading = false;
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}
} }
};
}, },
editSpell(e) { editSpell(e) {
this.current_edit_spell = e; this.current_edit_spell = e;
}, },
showAdd() { showAdd() {
this.adding_spell = true this.adding_spell = true;
}, },
cancelAdd() { cancelAdd() {
this.adding_spell = false this.adding_spell = false;
}, },
// Receives events to update the data // Receives events to update the data
addSpell(e) { addSpell(e) {
Spells.getOne(e.id) Spells.getOne(e.id)
.then(v => { .then(v => {
let spells = this.filteredSpells let spells = this.filteredSpells;
spells.unshift(v.data) spells.unshift(v.data);
}) })
.then(() => { .then(() => {
this.adding_spell = false this.adding_spell = false;
}) })
.catch(err => { .catch(err => {
console.log(err) console.log(err);
}) });
}, },
updateSpell(e) { updateSpell(e) {
let oldSpell = this.spells.find(x => x.id === e.id) let oldSpell = this.spells.find(x => x.id === e.id);
this.spells.splice(this.spells.indexOf(oldSpell), 1, e) this.spells.splice(this.spells.indexOf(oldSpell), 1, e);
this.current_edit_spell = {} this.current_edit_spell = {};
}, },
deleteSpell(e) { deleteSpell(e) {
this.spells.splice(this.spells.indexOf(e), 1) this.spells.splice(this.spells.indexOf(e), 1);
this.current_edit_spell = {} this.current_edit_spell = {};
}
} }
} }
};
</script> </script>

43
client/src/components/timeline/timeline.vue
View File

@@ -1,18 +1,22 @@
<template> <template>
<ul class="timeline"> <ul class="timeline">
<li class="timeline-item period first"> <li class="timeline-item period first">
<div class="timeline-info"></div> <div class="timeline-info" />
<div class="timeline-content"> <div class="timeline-content">
<h2 class="timeline-title">LE RENOUVEAU</h2> <h2 class="timeline-title">
LE RENOUVEAU
</h2>
</div> </div>
</li> </li>
<li class="timeline-item"> <li class="timeline-item">
<div class="timeline-info"> <div class="timeline-info">
<span>March 12, 2016</span> <span>March 12, 2016</span>
</div> </div>
<div class="timeline-marker"></div> <div class="timeline-marker" />
<div class="timeline-content"> <div class="timeline-content">
<h3 class="timeline-title">Event Title</h3> <h3 class="timeline-title">
Event Title
</h3>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque.</p> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque.</p>
</div> </div>
</li> </li>
@@ -20,26 +24,32 @@
<div class="timeline-info"> <div class="timeline-info">
<span>March 23, 2016</span> <span>March 23, 2016</span>
</div> </div>
<div class="timeline-marker"></div> <div class="timeline-marker" />
<div class="timeline-content"> <div class="timeline-content">
<h3 class="timeline-title">Event Title</h3> <h3 class="timeline-title">
Event Title
</h3>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p>
</div> </div>
</li> </li>
<li class="timeline-item period"> <li class="timeline-item period">
<div class="timeline-info"></div> <div class="timeline-info" />
<div class="timeline-marker"></div> <div class="timeline-marker" />
<div class="timeline-content"> <div class="timeline-content">
<h2 class="timeline-title">April 2016</h2> <h2 class="timeline-title">
April 2016
</h2>
</div> </div>
</li> </li>
<li class="timeline-item"> <li class="timeline-item">
<div class="timeline-info"> <div class="timeline-info">
<span>April 02, 2016</span> <span>April 02, 2016</span>
</div> </div>
<div class="timeline-marker"></div> <div class="timeline-marker" />
<div class="timeline-content"> <div class="timeline-content">
<h3 class="timeline-title">Event Title</h3> <h3 class="timeline-title">
Event Title
</h3>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p>
</div> </div>
</li> </li>
@@ -47,20 +57,21 @@
<div class="timeline-info"> <div class="timeline-info">
<span>April 28, 2016</span> <span>April 28, 2016</span>
</div> </div>
<div class="timeline-marker"></div> <div class="timeline-marker" />
<div class="timeline-content"> <div class="timeline-content">
<h3 class="timeline-title">Event Title</h3> <h3 class="timeline-title">
Event Title
</h3>
<p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p> <p>Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla. Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque. </p>
</div> </div>
</li> </li>
</ul> </ul>
</template> </template>
<script> <script>
export default { export default {
name: 'timeline', name: 'Timeline',
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

13
client/src/components/user/profile/update-form.vue
View File

@@ -6,13 +6,12 @@
<script> <script>
export default { export default {
name: 'update-form', name: 'UpdateForm',
props: { props: {
user: Object, user: {
} type: Object,
default: null,
},
} }
};
</script> </script>
<style>
</style>

6
client/src/global-components.js
View File

@@ -1,7 +1,7 @@
import Navbar from './components/global/navbar/navbar' import Navbar from './components/global/navbar/navbar';
import Loader from './components/global/loader' import Loader from './components/global/loader';
export default [ export default [
Navbar, Navbar,
Loader Loader
] ];

72
client/src/main.js
View File

@@ -1,70 +1,76 @@
// Core // Core
import Vue from 'vue' import Vue from 'vue';
import VueRouter from 'vue-router' import VueRouter from 'vue-router';
import App from './app.vue' import App from './app.vue';
import VueMeta from 'vue-meta' import VueMeta from 'vue-meta';
Vue.use(VueMeta, { Vue.use(VueMeta, {
// optional pluginOptions // optional pluginOptions
refreshOnceOnNavigation: true refreshOnceOnNavigation: true
}) });
// Environment // Environment
require('dotenv').config() import dotenv from 'dotenv';
dotenv.config();
import store from './store' // Store
import store from './store';
import Globals from './global-components.js' // Global components
import Globals from './global-components.js';
Globals.forEach(component => { Globals.forEach(component => {
Vue.component(component.name, component) Vue.component(component.name, component);
}); });
// Cookies // Cookies
import VueCookies from 'vue-cookies' import VueCookies from 'vue-cookies';
Vue.use(VueCookies) Vue.use(VueCookies);
// Jquery // Jquery
import jquery from 'jquery' import jquery from 'jquery';
window.$ = jquery window.$ = jquery;
window.jquery = jquery window.jquery = jquery;
// Styles // Styles
// Fonts // Fonts
import './assets/scss/_fonts.scss' import './assets/scss/_fonts.scss';
import './assets/scss/_global.scss' import './assets/scss/_global.scss';
import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap-vue/dist/bootstrap-vue.css' import 'bootstrap-vue/dist/bootstrap-vue.css';
import 'bootstrap/dist/js/bootstrap.js' import 'bootstrap/dist/js/bootstrap.js';
// Plugins // Plugins
import { BootstrapVue } from 'bootstrap-vue' import { BootstrapVue } from 'bootstrap-vue';
Vue.use(BootstrapVue) Vue.use(BootstrapVue);
import { VueMasonryPlugin } from 'vue-masonry' // Masonry (will probably get removed in the very very near future lmao)
Vue.use(VueMasonryPlugin) import { VueMasonryPlugin } from 'vue-masonry';
Vue.use(VueMasonryPlugin);
import clipboard from 'v-clipboard' // Clipboard (might find a better one or code it myself idk)
Vue.use(clipboard) import clipboard from 'v-clipboard';
Vue.use(clipboard);
// FUNCTIONS // FUNCTIONS
var filter = (text, length, clamp) => { // Let's be honest i will 1000% refactor this.
let filter = (text, length, clamp) => {
clamp = clamp || '...'; clamp = clamp || '...';
var node = document.createElement('div'); let node = document.createElement('div');
node.innerHTML = text; node.innerHTML = text;
var content = node.textContent; let content = node.textContent;
return content.length > length ? content.slice(0, length) + clamp : content; return content.length > length ? content.slice(0, length) + clamp : content;
} };
Vue.filter('truncate', filter); Vue.filter('truncate', filter);
// Router // Router
import router from './routes' import router from './routes';
Vue.use(VueRouter) Vue.use(VueRouter);
// Mount Vue // Mount Vue
const app = new Vue({ const app = new Vue({
render: h => h(App), render: h => h(App),
router, router,
store: store store: store
}) });
app.$mount('#srs') app.$mount('#srs');

12
client/src/pages/index-page.vue
View File

@@ -2,8 +2,12 @@
<div class="container-fluid"> <div class="container-fluid">
<section class="d-flex justify-content-center align-items-center"> <section class="d-flex justify-content-center align-items-center">
<main class="px-4"> <main class="px-4">
<h1 class="title text-dark mb-4 font-display font-weight-black line-height-100">"C'est magique, ta gueule."</h1> <h1 class="title text-dark mb-4 font-display font-weight-black line-height-100">
<div class="lead font-display font-weight-bold">— N'importe quel MJ, une fois dans sa vie</div> "C'est magique, ta gueule."
</h1>
<div class="lead font-display font-weight-bold">
— N'importe quel MJ, une fois dans sa vie
</div>
<hr class="w-50"> <hr class="w-50">
<div class="lead"> <div class="lead">
<span class="font-display font-weight-bold">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>. <span class="font-display font-weight-bold">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>.
@@ -15,8 +19,8 @@
<script> <script>
export default { export default {
name: 'index-page', name: 'IndexPage',
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

13
client/src/pages/schools/schools-page.vue
View File

@@ -1,17 +1,22 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">Écoles</h1> id="spell-container"
class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
Écoles
</h1>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'schools-page', name: 'SchoolsPage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Maîtrises' titleTemplate: '%s - Maîtrises'
}, },
} };
</script> </script>

19
client/src/pages/schools/single-school-page.vue
View File

@@ -1,6 +1,11 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">{{ school.name }}</h1> id="spell-container"
class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
{{ school.name }}
</h1>
<p>{{ school.description }}</p> <p>{{ school.description }}</p>
<spell-list :school_id="id" /> <spell-list :school_id="id" />
</div> </div>
@@ -11,14 +16,14 @@
import { RepositoryFactory } from "@/api/repositories"; import { RepositoryFactory } from "@/api/repositories";
const Schools = RepositoryFactory.get('schools'); const Schools = RepositoryFactory.get('schools');
import SpellsList from "~/components/spells/spells-list"; import SpellsList from "@/components/spells/spells-list";
export default { export default {
name: 'single-school-page', name: 'SingleSchoolPage',
metaInfo() { metaInfo() {
return { return {
titleTemplate: `%s - ${this.school.name}`, titleTemplate: `%s - ${this.school.name}`,
} };
}, },
components: { components: {
'spell-list': SpellsList, 'spell-list': SpellsList,
@@ -30,7 +35,7 @@ export default {
errors: { errors: {
loading: "", loading: "",
} }
} };
}, },
created() { created() {
Schools.getOne(this.id) Schools.getOne(this.id)
@@ -41,7 +46,7 @@ export default {
console.log(err); console.log(err);
}); });
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

22
client/src/pages/spells/single-spell-page.vue
View File

@@ -1,7 +1,15 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">{{ spell.name }}</h1> id="spell-container"
<p class="prewrap">{{ spell.description }}</p> </div> class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
{{ spell.name }}
</h1>
<p class="prewrap">
{{ spell.description }}
</p>
</div>
</template> </template>
<script> <script>
@@ -10,11 +18,11 @@ import { RepositoryFactory } from "@/api/repositories";
const Spells = RepositoryFactory.get('spells'); const Spells = RepositoryFactory.get('spells');
export default { export default {
name: 'single-spell-page', name: 'SingleSpellPage',
metaInfo() { metaInfo() {
return { return {
titleTemplate: this.spell.name ? `%s - ${this.spell.name}` : '%s', titleTemplate: this.spell.name ? `%s - ${this.spell.name}` : '%s',
} };
}, },
data() { data() {
return { return {
@@ -23,7 +31,7 @@ export default {
errors: { errors: {
loading: "", loading: "",
} }
} };
}, },
created() { created() {
Spells.getOne(this.id) Spells.getOne(this.id)
@@ -34,7 +42,7 @@ export default {
console.log(err); console.log(err);
}); });
}, },
} };
</script> </script>
<style> <style>

13
client/src/pages/spells/spells-page.vue
View File

@@ -1,6 +1,11 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">Sortilèges</h1> id="spell-container"
class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
Sortilèges
</h1>
<spell-list /> <spell-list />
</div> </div>
</template> </template>
@@ -9,14 +14,14 @@
import SpellsList from "@/components/spells/spells-list.vue"; import SpellsList from "@/components/spells/spells-list.vue";
export default { export default {
name: 'spells-page', name: 'SpellsPage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Grimoire' titleTemplate: '%s - Grimoire'
}, },
components: { components: {
'spell-list': SpellsList, 'spell-list': SpellsList,
} }
} };
</script> </script>
<style lang="scss"></style> <style lang="scss"></style>

15
client/src/pages/timelines/timeline-page.vue
View File

@@ -1,22 +1,27 @@
<template> <template>
<div class="container-fluid p-4" id="spell-container"> <div
<h1 class="display-3 font-display mb-3">Chronologie</h1> id="spell-container"
class="container-fluid p-4"
>
<h1 class="display-3 font-display mb-3">
Chronologie
</h1>
<timeline /> <timeline />
</div> </div>
</template> </template>
<script> <script>
import Timeline from "~/components/timeline/timeline" import Timeline from "@/components/timeline/timeline";
export default { export default {
name: 'timeline-page', name: 'TimelinePage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Âges' titleTemplate: '%s - Âges'
}, },
components: { components: {
'timeline': Timeline 'timeline': Timeline
} }
} };
</script> </script>
<style> <style>

60
client/src/pages/user/profile-page.vue
View File

@@ -1,38 +1,72 @@
<template> <template>
<div <div
v-if="user" v-if="user"
class="container-fluid p-4"
id="spell-container" id="spell-container"
class="container-fluid p-4"
> >
<h2 class="display-3 font-display mb-3"> <h2 class="display-3 font-display mb-3">
<span class="username">{{ user.name }}</span> <span class="username">{{ user.name }}</span>
</h2> </h2>
<span>Membre depuis le {{ registered_date }}</span> <span>Membre depuis le {{ registered_date }}</span>
<ul class="nav nav-tabs mt-3 mb-3" id="tabs-tab" role="tablist"> <ul
id="tabs-tab"
class="nav nav-tabs mt-3 mb-3"
role="tablist"
>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" id="tabs-home-tab" data-toggle="pill" href="#tabs-home" role="tab" aria-controls="tabs-home" aria-selected="true">Mes sorts</a> <a
id="tabs-home-tab"
class="nav-link active"
data-toggle="pill"
href="#tabs-home"
role="tab"
aria-controls="tabs-home"
aria-selected="true"
>Mes sorts</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" id="tabs-contact-tab" data-toggle="pill" href="#tabs-contact" role="tab" aria-controls="tabs-contact" aria-selected="false">Paramètres</a> <a
id="tabs-contact-tab"
class="nav-link"
data-toggle="pill"
href="#tabs-contact"
role="tab"
aria-controls="tabs-contact"
aria-selected="false"
>Paramètres</a>
</li> </li>
</ul> </ul>
<div class="tab-content" id="tabs-tabContent"> <div
<div class="tab-pane fade show active" id="tabs-home" role="tabpanel" aria-labelledby="tabs-home-tab">...</div> id="tabs-tabContent"
<div class="tab-pane fade" id="tabs-contact" role="tabpanel" aria-labelledby="tabs-contact-tab"> class="tab-content"
>
<div
id="tabs-home"
class="tab-pane fade show active"
role="tabpanel"
aria-labelledby="tabs-home-tab"
>
...
</div>
<div
id="tabs-contact"
class="tab-pane fade"
role="tabpanel"
aria-labelledby="tabs-contact-tab"
>
<update-form :user="user" /> <update-form :user="user" />
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import UpdateForm from '~/components/user/profile/update-form.vue' import UpdateForm from '@/components/user/profile/update-form.vue';
export default { export default {
name: 'profile-page', name: 'ProfilePage',
metaInfo: { metaInfo: {
titleTemplate: '%s - Profil' titleTemplate: '%s - Profil'
}, },
@@ -41,11 +75,11 @@ export default {
}, },
data() { data() {
return { return {
} };
}, },
computed: { computed: {
user() { user() {
return this.$store.getters.getUserProfile return this.$store.getters.getUserProfile;
}, },
registered_date() { registered_date() {
let raw_date = new Date(this.user.register_date); let raw_date = new Date(this.user.register_date);
@@ -59,7 +93,7 @@ export default {
return new Intl.DateTimeFormat("fr", date_options).format(raw_date); return new Intl.DateTimeFormat("fr", date_options).format(raw_date);
} }
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

28
client/src/routes.js
View File

@@ -1,21 +1,21 @@
import VueRouter from 'vue-router' import VueRouter from 'vue-router';
import store from './store' import store from './store';
// Pages // Pages
import Index from "@/pages/index-page" import Index from "@/pages/index-page";
import Spells from "@/pages/spells/spells-page" import Spells from "@/pages/spells/spells-page";
import SpellSingle from "@/pages/spells/single-spell-page" import SpellSingle from "@/pages/spells/single-spell-page";
import Schools from "./pages/schools/schools-page" import Schools from "./pages/schools/schools-page";
import SchoolSingle from "@/pages/schools/single-school-page" import SchoolSingle from "@/pages/schools/single-school-page";
import Timeline from "./pages/timelines/timeline-page" import Timeline from "./pages/timelines/timeline-page";
import Profile from "@/pages/user/profile-page" import Profile from "@/pages/user/profile-page";
import Login from "@/pages/user/login-page" import Login from "@/pages/user/login-page";
import Register from "@/pages/user/register-page" import Register from "@/pages/user/register-page";
// Routes // Routes
const routes = [ const routes = [
@@ -71,14 +71,14 @@ const routes = [
logoutFilter: true, logoutFilter: true,
} }
}, },
] ];
const router = new VueRouter({ const router = new VueRouter({
mode: 'history', mode: 'history',
routes, routes,
linkActiveClass: "", linkActiveClass: "",
linkExactActiveClass: "active", linkExactActiveClass: "active",
}) });
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
if (to.matched.some(record => record.meta.loginFilter)) { if (to.matched.some(record => record.meta.loginFilter)) {
@@ -97,6 +97,6 @@ router.beforeEach((to, from, next) => {
next(); next();
} }
next(); next();
}) });
export default router; export default router;

10
client/src/store/modules/spell.store.js
View File

@@ -1,18 +1,18 @@
const state = { const state = {
} };
const getters = { const getters = {
} };
const actions = { const actions = {
} };
const mutations = { const mutations = {
} };
export default { export default {
namespaced: true, namespaced: true,
@@ -20,4 +20,4 @@ export default {
getters, getters,
actions, actions,
mutations, mutations,
} };

8
client/src/store/modules/user.store.js
View File

@@ -1,7 +1,7 @@
import cookie from 'vue-cookies'; import cookie from 'vue-cookies';
// API // API
import { RepositoryFactory } from "~/api/repositories"; import { RepositoryFactory } from "@/api/repositories";
const Users = RepositoryFactory.get('users'); const Users = RepositoryFactory.get('users');
export const namespaced = true; export const namespaced = true;
@@ -12,7 +12,7 @@ const state = {
const getters = { const getters = {
getUserProfile: state => { getUserProfile: state => {
return state.profile return state.profile;
} }
}; };
@@ -56,7 +56,7 @@ const actions = {
.catch(err => { .catch(err => {
reject(err.response); reject(err.response);
}); });
}) });
}, },
user_logout ({ commit }) { user_logout ({ commit }) {
@@ -79,7 +79,7 @@ const actions = {
.catch(err => { .catch(err => {
reject(err.response); reject(err.response);
}); });
}) });
} }
}; };

9
client/vue.config.js
View File

@@ -1,19 +1,18 @@
const path = require('path') const path = require('path');
module.exports = { module.exports = {
lintOnSave: false,
configureWebpack: { configureWebpack: {
resolve: { resolve: {
alias: { alias: {
"~": path.resolve(__dirname, 'src/') "@": path.resolve(__dirname, 'src/')
} }
} }
}, },
css: { css: {
loaderOptions: { loaderOptions: {
scss: { scss: {
prependData: ` prependData: `@import "@/assets/scss/_variables.scss";`
@import "@/assets/scss/_variables.scss";
`
} }
} }
} }