Compare commits
32 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 danielGe
|
272f52b236 | ||
|
danielGe
|
e6bc52f9e8 | ||
|
danielGe
|
c2bb8f71a2 | ||
 kikin
|
48b20d5c70 | ||
 casnet1
|
ac24a836cb | ||
|
casnet1
|
325ab92f16 | ||
|
kikin
|
e2061cc45f | ||
|
kikin
|
7964837e27 | ||
|
casnet1
|
5f5b4bd8f6 | ||
|
casnet1
|
88ac83e1f5 | ||
|
danielGe
|
6c21a132f7 | ||
|
danielGe
|
769c9b8a2d | ||
|
danielGe
|
a614aaccd8 | ||
|
kikin
|
bcc7617e79 | ||
|
kikin
|
667d6e34a4 | ||
|
kikin
|
60f40876f7 | ||
|
kikin
|
189b78ebea | ||
|
kikin
|
9f2f2ef7b0 | ||
|
casnet1
|
b9e7cf483b | ||
|
casnet1
|
89eb22bae5 | ||
|
eithan
|
387f0ce6da | ||
|
danielGe
|
d4e15ddb55 | ||
|
danielGe
|
aaca0ea583 | ||
|
danielGe
|
5eff4a916e | ||
|
danielGe
|
1552b7e04f | ||
|
danielGe
|
77aead338f | ||
|
casnet1
|
39a65ffc0c | ||
|
casnet1
|
bd1d82e37a | ||
|
casnet1
|
291ba23569 | ||
|
casnet1
|
0e23f1ebbe | ||
|
casnet1
|
98604916c9 | ||
 KIKIN
|
1cc6644c95 |
Generated
+147
-39
@@ -1392,16 +1392,6 @@
|
|||||||
"integrity": "sha512-Jus9s4CDbqwocc5pOAnh8ShfrnMcPHuJYzVcSUU7lrh8Ni5HuIqX3oilL86p3dlTrk0LzHRCgA/GQ7uNCw6l2Q==",
|
"integrity": "sha512-Jus9s4CDbqwocc5pOAnh8ShfrnMcPHuJYzVcSUU7lrh8Ni5HuIqX3oilL86p3dlTrk0LzHRCgA/GQ7uNCw6l2Q==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"@types/mini-css-extract-plugin": {
|
|
||||||
"version": "0.9.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/@types/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.1.tgz",
|
|
||||||
"integrity": "sha512-+mN04Oszdz9tGjUP/c1ReVwJXxSniLd7lF++sv+8dkABxVNthg6uccei+4ssKxRHGoMmPxdn7uBdJWONSJGTGQ==",
|
|
||||||
"dev": true,
|
|
||||||
"optional": true,
|
|
||||||
"requires": {
|
|
||||||
"@types/webpack": "*"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"@types/minimatch": {
|
"@types/minimatch": {
|
||||||
"version": "3.0.3",
|
"version": "3.0.3",
|
||||||
"resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
|
"resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
|
||||||
@@ -1796,6 +1786,16 @@
|
|||||||
"integrity": "sha512-+G7P8jJmCHr+S+cLfQxygbWhXy+8YTVGzAkpEbcLo2mLoL7tij/VG41QSHACSf5QgYRhMZYHuNc6drJaO0Da+w==",
|
"integrity": "sha512-+G7P8jJmCHr+S+cLfQxygbWhXy+8YTVGzAkpEbcLo2mLoL7tij/VG41QSHACSf5QgYRhMZYHuNc6drJaO0Da+w==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"ansi-styles": {
|
||||||
|
"version": "4.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||||
|
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"color-convert": "^2.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"cacache": {
|
"cacache": {
|
||||||
"version": "13.0.1",
|
"version": "13.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/cacache/-/cacache-13.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/cacache/-/cacache-13.0.1.tgz",
|
||||||
@@ -1822,6 +1822,34 @@
|
|||||||
"unique-filename": "^1.1.1"
|
"unique-filename": "^1.1.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"chalk": {
|
||||||
|
"version": "4.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
|
||||||
|
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"ansi-styles": "^4.1.0",
|
||||||
|
"supports-color": "^7.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"color-convert": {
|
||||||
|
"version": "2.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
|
||||||
|
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"color-name": "~1.1.4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"color-name": {
|
||||||
|
"version": "1.1.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
|
||||||
|
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
"find-cache-dir": {
|
"find-cache-dir": {
|
||||||
"version": "3.3.1",
|
"version": "3.3.1",
|
||||||
"resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.1.tgz",
|
"resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.1.tgz",
|
||||||
@@ -1843,6 +1871,25 @@
|
|||||||
"path-exists": "^4.0.0"
|
"path-exists": "^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,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"loader-utils": {
|
||||||
|
"version": "2.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
|
||||||
|
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"big.js": "^5.2.2",
|
||||||
|
"emojis-list": "^3.0.0",
|
||||||
|
"json5": "^2.1.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
"locate-path": {
|
"locate-path": {
|
||||||
"version": "5.0.0",
|
"version": "5.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
|
||||||
@@ -1907,6 +1954,16 @@
|
|||||||
"minipass": "^3.1.1"
|
"minipass": "^3.1.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"supports-color": {
|
||||||
|
"version": "7.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||||
|
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"has-flag": "^4.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"terser-webpack-plugin": {
|
"terser-webpack-plugin": {
|
||||||
"version": "2.3.8",
|
"version": "2.3.8",
|
||||||
"resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
|
"resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
|
||||||
@@ -1923,6 +1980,18 @@
|
|||||||
"terser": "^4.6.12",
|
"terser": "^4.6.12",
|
||||||
"webpack-sources": "^1.4.3"
|
"webpack-sources": "^1.4.3"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
"vue-loader-v16": {
|
||||||
|
"version": "npm:vue-loader@16.0.0-beta.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-beta.8.tgz",
|
||||||
|
"integrity": "sha512-oouKUQWWHbSihqSD7mhymGPX1OQ4hedzAHyvm8RdyHh6m3oIvoRF+NM45i/bhNOlo8jCnuJhaSUf/6oDjv978g==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"chalk": "^4.1.0",
|
||||||
|
"hash-sum": "^2.0.0",
|
||||||
|
"loader-utils": "^2.0.0"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -4543,6 +4612,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"dom-walk": {
|
||||||
|
"version": "0.1.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.2.tgz",
|
||||||
|
"integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w=="
|
||||||
|
},
|
||||||
"domain-browser": {
|
"domain-browser": {
|
||||||
"version": "1.2.0",
|
"version": "1.2.0",
|
||||||
"resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
|
||||||
@@ -5699,6 +5773,15 @@
|
|||||||
"integrity": "sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs=",
|
"integrity": "sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"global": {
|
||||||
|
"version": "4.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/global/-/global-4.4.0.tgz",
|
||||||
|
"integrity": "sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==",
|
||||||
|
"requires": {
|
||||||
|
"min-document": "^2.19.0",
|
||||||
|
"process": "^0.11.10"
|
||||||
|
}
|
||||||
|
},
|
||||||
"globals": {
|
"globals": {
|
||||||
"version": "11.12.0",
|
"version": "11.12.0",
|
||||||
"resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
|
"resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
|
||||||
@@ -7276,6 +7359,14 @@
|
|||||||
"integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
|
"integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"min-document": {
|
||||||
|
"version": "2.19.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
|
||||||
|
"integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU=",
|
||||||
|
"requires": {
|
||||||
|
"dom-walk": "^0.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"mini-css-extract-plugin": {
|
"mini-css-extract-plugin": {
|
||||||
"version": "0.9.0",
|
"version": "0.9.0",
|
||||||
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.0.tgz",
|
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.0.tgz",
|
||||||
@@ -7543,9 +7634,9 @@
|
|||||||
"integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw=="
|
"integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw=="
|
||||||
},
|
},
|
||||||
"node-forge": {
|
"node-forge": {
|
||||||
"version": "0.9.0",
|
"version": "0.10.0",
|
||||||
"resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
|
"resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
|
||||||
"integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
|
"integrity": "sha512-PPmu8eEeG9saEUvI97fm4OYxXVB6bFvyNTyiUOBichBpFG8A1Ljw3bY62+5oOjDEMHRnd0Y7HQ+x7uzxOzC6JA==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"node-ipc": {
|
"node-ipc": {
|
||||||
@@ -8831,8 +8922,7 @@
|
|||||||
"process": {
|
"process": {
|
||||||
"version": "0.11.10",
|
"version": "0.11.10",
|
||||||
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
|
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
|
||||||
"integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI=",
|
"integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"process-nextick-args": {
|
"process-nextick-args": {
|
||||||
"version": "2.0.1",
|
"version": "2.0.1",
|
||||||
@@ -9428,12 +9518,12 @@
|
|||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"selfsigned": {
|
"selfsigned": {
|
||||||
"version": "1.10.7",
|
"version": "1.10.8",
|
||||||
"resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
|
"resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.8.tgz",
|
||||||
"integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
|
"integrity": "sha512-2P4PtieJeEwVgTU9QEcwIRDQ/mXJLX8/+I3ur+Pg16nS8oNbrGxEso9NyYWy8NAmXiNl4dlAp5MwoNeCWzON4w==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"node-forge": "0.9.0"
|
"node-forge": "^0.10.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"semver": {
|
"semver": {
|
||||||
@@ -10919,6 +11009,23 @@
|
|||||||
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.12.tgz",
|
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.12.tgz",
|
||||||
"integrity": "sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg=="
|
"integrity": "sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg=="
|
||||||
},
|
},
|
||||||
|
"vue-carousel": {
|
||||||
|
"version": "0.18.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/vue-carousel/-/vue-carousel-0.18.0.tgz",
|
||||||
|
"integrity": "sha512-a2zxh7QJioDxNMguqcuJ7TPbfgK5bGDaAXIia7NWxPAWsEvNE4ZtHgsGu40L5Aha4uyjmNKXvleB14QAXFoKig==",
|
||||||
|
"requires": {
|
||||||
|
"global": "^4.3.2",
|
||||||
|
"regenerator-runtime": "^0.12.1",
|
||||||
|
"vue": "^2.5.17"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"regenerator-runtime": {
|
||||||
|
"version": "0.12.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
|
||||||
|
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"vue-eslint-parser": {
|
"vue-eslint-parser": {
|
||||||
"version": "7.1.0",
|
"version": "7.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.1.0.tgz",
|
||||||
@@ -10978,35 +11085,31 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"vue-loader-v16": {
|
"vue-loader-v16": {
|
||||||
"version": "npm:vue-loader@16.0.0-beta.7",
|
"version": "npm:vue-loader@16.0.0-beta.8",
|
||||||
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-beta.7.tgz",
|
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.0.0-beta.8.tgz",
|
||||||
"integrity": "sha512-xQ8/GZmRPdQ3EinnE0IXwdVoDzh7Dowo0MowoyBuScEBXrRabw6At5/IdtD3waKklKW5PGokPsm8KRN6rvQ1cw==",
|
"integrity": "sha512-oouKUQWWHbSihqSD7mhymGPX1OQ4hedzAHyvm8RdyHh6m3oIvoRF+NM45i/bhNOlo8jCnuJhaSUf/6oDjv978g==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"@types/mini-css-extract-plugin": "^0.9.1",
|
"chalk": "^4.1.0",
|
||||||
"chalk": "^3.0.0",
|
|
||||||
"hash-sum": "^2.0.0",
|
"hash-sum": "^2.0.0",
|
||||||
"loader-utils": "^1.2.3",
|
"loader-utils": "^2.0.0"
|
||||||
"merge-source-map": "^1.1.0",
|
|
||||||
"source-map": "^0.6.1"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"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,
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"@types/color-name": "^1.1.1",
|
|
||||||
"color-convert": "^2.0.1"
|
"color-convert": "^2.0.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"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,
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
@@ -11038,12 +11141,17 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": true
|
"optional": true
|
||||||
},
|
},
|
||||||
"source-map": {
|
"loader-utils": {
|
||||||
"version": "0.6.1",
|
"version": "2.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
|
||||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
|
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": true
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"big.js": "^5.2.2",
|
||||||
|
"emojis-list": "^3.0.0",
|
||||||
|
"json5": "^2.1.2"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"supports-color": {
|
"supports-color": {
|
||||||
"version": "7.2.0",
|
"version": "7.2.0",
|
||||||
|
|||||||
@@ -20,6 +20,7 @@
|
|||||||
"jquery": "^3.5.1",
|
"jquery": "^3.5.1",
|
||||||
"sweetalert2": "^10.1.0",
|
"sweetalert2": "^10.1.0",
|
||||||
"vue": "^2.6.11",
|
"vue": "^2.6.11",
|
||||||
|
"vue-carousel": "^0.18.0",
|
||||||
"vue-router": "^3.4.3"
|
"vue-router": "^3.4.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|||||||
@@ -27,6 +27,9 @@ export default {
|
|||||||
.row {
|
.row {
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
}
|
}
|
||||||
|
.VueCarousel-wrapper{
|
||||||
|
overflow:inherit !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
@@ -0,0 +1,60 @@
|
|||||||
|
<template>
|
||||||
|
<div class="divMaster row ">
|
||||||
|
<div
|
||||||
|
id="carouselExampleControls"
|
||||||
|
class="carousel slide col-12 mx-auto"
|
||||||
|
data-ride="carousel"
|
||||||
|
>
|
||||||
|
<div class="carousel-inner">
|
||||||
|
<div
|
||||||
|
class="carousel-item"
|
||||||
|
v-bind:key="img.id"
|
||||||
|
v-for="(img, idx) in imgs"
|
||||||
|
:class="{ active: idx == 0 }"
|
||||||
|
>
|
||||||
|
<img :src="img" class="d-block w-100 img-fluid" alt="img" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a
|
||||||
|
class="carousel-control-prev"
|
||||||
|
href="#carouselExampleControls"
|
||||||
|
role="button"
|
||||||
|
data-slide="prev"
|
||||||
|
>
|
||||||
|
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||||
|
<span class="sr-only">Previous</span>
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="carousel-control-next"
|
||||||
|
href="#carouselExampleControls"
|
||||||
|
role="button"
|
||||||
|
data-slide="next"
|
||||||
|
>
|
||||||
|
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||||
|
<span class="sr-only">Next</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
imgs: [
|
||||||
|
'https://www.acatlan.unam.mx/images/1410.jpg',
|
||||||
|
'https://www.acatlan.unam.mx/images/1402.jpg',
|
||||||
|
'https://www.acatlan.unam.mx/images/1421.jpg',
|
||||||
|
'https://www.acatlan.unam.mx/images/1330.jpg'
|
||||||
|
|
||||||
|
]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.divMaster {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,132 @@
|
|||||||
|
<template>
|
||||||
|
<div class="my-5">
|
||||||
|
<div class="container d-flex flex-wrap justify-content-between">
|
||||||
|
<div class="cont-resum-shop py-2 mb-4">
|
||||||
|
<h2 class="ml-3">Carrito</h2>
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="d-flex justify-content-between mx-4 my-4">
|
||||||
|
<div class="d-flex">
|
||||||
|
<!-- v-bind:src="'/media/avatars/' + joke.avatar" -->
|
||||||
|
<img v-bind:src="infoResume[0].img" alt="Logo" style="height: 150px">
|
||||||
|
<p class="mx-4">
|
||||||
|
{{productInfo[0].descripcion}}<br><span class="price-style"><b>${{productInfo[0].precio}}</b></span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-wrap flex-column align-items-center">
|
||||||
|
<div>
|
||||||
|
<input type="number" class="inp-number p-1 d-inline-block" name="" id="" v-bind:value="infoResume[0].cantidad">
|
||||||
|
</div>
|
||||||
|
<span class="my-4"><b>${{infoResume[0].cantidad * productInfo[0].precio}}</b></span>
|
||||||
|
<div>
|
||||||
|
<a href="#" class="text-dark">
|
||||||
|
<font-awesome-icon icon="trash" class=""/>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="d-flex justify-content-between mx-4 my-4">
|
||||||
|
<div class="d-flex">
|
||||||
|
<!-- v-bind:src="'/media/avatars/' + joke.avatar" -->
|
||||||
|
<img v-bind:src="infoResume[1].img" alt="Logo" style="height: 150px">
|
||||||
|
<p class="mx-4">
|
||||||
|
{{productInfo[1].descripcion}}<br><span class="price-style"><b>${{productInfo[1].precio}}</b></span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-wrap flex-column align-items-center">
|
||||||
|
<div>
|
||||||
|
<input type="number" class="inp-number p-1 d-inline-block" name="" id="" v-bind:value="infoResume[1].cantidad">
|
||||||
|
</div>
|
||||||
|
<span class="my-4"><b>${{infoResume[1].cantidad * productInfo[1].precio}}</b></span>
|
||||||
|
<div>
|
||||||
|
<a href="#" class="text-dark">
|
||||||
|
<font-awesome-icon icon="trash" class=""/>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="g-sec bg-light py-4 px-4 d-flex flex-column align-self-start align-items-center" style="">
|
||||||
|
<div class="d-flex justify-content-between">
|
||||||
|
<p class="mr-5">{{infoResume[0].cantidad}} Artículos<br>Envío</p>
|
||||||
|
<p>${{infoResume[0].cantidad * productInfo[0].precio}}<br>{{infoResume[0].envioStatus}}</p>
|
||||||
|
</div>
|
||||||
|
<hr style="width:100%">
|
||||||
|
<div class="d-flex justify-content-between">
|
||||||
|
<p class="mr-5">Total(IVA incluido)<br>${{infoResume[0].cantidad * productInfo[0].precio}}</p>
|
||||||
|
</div>
|
||||||
|
<hr style="width:100%">
|
||||||
|
<button class="btn btn-primary mx-auto"><b>IR A LA CAJA</b></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="container mt-3">
|
||||||
|
<div class="d-inline-block">
|
||||||
|
<a href="#">
|
||||||
|
<p>
|
||||||
|
Continuar la compra
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
productInfo: [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
descripcion: 'Invitacion al psicoanálisis y lazos con la política, Lorem ipsum',
|
||||||
|
precio: 10
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
descripcion: 'Invitacion al derrocamiento de la burguesía, camarada.',
|
||||||
|
precio: 2
|
||||||
|
}
|
||||||
|
],
|
||||||
|
infoResume:[
|
||||||
|
{
|
||||||
|
cantidad: 4,
|
||||||
|
envioStatus: 'pendiente',
|
||||||
|
img: 'https://images.cdn3.buscalibre.com/fit-in/360x360/7d/92/7d92cb1e49ff2d7756f192114e5c8901.jpg',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
cantidad: 17,
|
||||||
|
envioStatus: 'pendiente',
|
||||||
|
img: 'https://images-na.ssl-images-amazon.com/images/I/51vHCno0a4L._SY291_BO1,204,203,200_QL40_ML2_.jpg',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.cont-resum-shop {
|
||||||
|
/* background-color: skyblue; */
|
||||||
|
-webkit-box-shadow: 3px 3px 6px 0.2px rgba(0,0,0,0.2);
|
||||||
|
-moz-box-shadow: 3px 3px 6px 0.2px rgba(0,0,0,0.2);
|
||||||
|
box-shadow: 3px 3px 6px 0.2px rgba(0,0,0,0.2);
|
||||||
|
/* border-radius: 5px; */
|
||||||
|
/* font-size: 15px; */
|
||||||
|
}
|
||||||
|
.inp-number {
|
||||||
|
width: 55px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 0.3px solid lightgray;
|
||||||
|
}
|
||||||
|
.price-style {
|
||||||
|
color: #6C59FE;
|
||||||
|
}
|
||||||
|
.g-sec {
|
||||||
|
-webkit-box-shadow: -3px 3px 6px 0.2px rgba(0,0,0,0.2);
|
||||||
|
-moz-box-shadow: -3px 3px 6px 0.2px rgba(0,0,0,0.2);
|
||||||
|
box-shadow: -3px 3px 6px 0.2px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,357 @@
|
|||||||
|
<template>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row ">
|
||||||
|
<div class="col-md-6 col-sm-12 pt-5">
|
||||||
|
|
||||||
|
<div class="row p-0">
|
||||||
|
|
||||||
|
<div class=" p-0 col-12 col-md-12 col-lg-2 col-xl-2 d-flex align-items-center justify-content-start flex-row flex-lg-column flex-xl-column ">
|
||||||
|
<div v-bind:key="src.id"
|
||||||
|
v-for="src in src"
|
||||||
|
@click="src2 = src">
|
||||||
|
|
||||||
|
<img :src="src" alt="" class="smalll" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="p-0 col-10 d-flex justify-content-center flex-column align-items-center">
|
||||||
|
<img :src="src2" alt="" class="libro" />
|
||||||
|
<button class="button pre" @click="showModal()">
|
||||||
|
Previsualizar
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="Visible" @close="closeModal()">
|
||||||
|
<transition name="modal">
|
||||||
|
<div class="modal-backdrop" @click.self="closeModal()">
|
||||||
|
<div
|
||||||
|
class="modal"
|
||||||
|
role="dialog"
|
||||||
|
aria-labelledby="modalTitle"
|
||||||
|
aria-describedby="modalDescription"
|
||||||
|
>
|
||||||
|
<section class="modal-body rounded" id="modalDescription">
|
||||||
|
<iframe
|
||||||
|
:src="PDF"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
frameborder="0"
|
||||||
|
></iframe>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</transition>
|
||||||
|
</div>
|
||||||
|
<br /><br />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-6 col-sm-12 py-5 titulo">
|
||||||
|
<b>Titulo:</b>
|
||||||
|
<p>{{ titulo }}</p>
|
||||||
|
<b>Autor: </b>
|
||||||
|
<p>{{ autor }}</p>
|
||||||
|
<b>Paginas: </b>
|
||||||
|
<p>{{ paginas }}</p>
|
||||||
|
<b>ISBN: </b>
|
||||||
|
<p>{{ isbn }}</p>
|
||||||
|
<b>Año de Impresión: </b>
|
||||||
|
<p>{{ edicion }}</p>
|
||||||
|
|
||||||
|
<b>Versión:</b>
|
||||||
|
<p>{{ version }}</p>
|
||||||
|
<b>Descripción:</b>
|
||||||
|
<div class="overflow-auto">{{ desc }}</div>
|
||||||
|
<b>Precio: </b>
|
||||||
|
<p>${{ precio }}</p>
|
||||||
|
|
||||||
|
<b>Cantidad:</b>
|
||||||
|
<div class="row d-flex align-items-center" >
|
||||||
|
|
||||||
|
<div class="col-2 ">
|
||||||
|
|
||||||
|
<select name="num" id="num">
|
||||||
|
<option value="volvo"
|
||||||
|
v-for="n in inventario"
|
||||||
|
:key="n"
|
||||||
|
>
|
||||||
|
{{n}}
|
||||||
|
</option>
|
||||||
|
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="col-10">
|
||||||
|
<a
|
||||||
|
href="https://demo-tienda.acatlan.unam.mx/"
|
||||||
|
class="button text-white d-flex justify-content-center align-items-center"
|
||||||
|
id="buttonC"
|
||||||
|
>
|
||||||
|
<p class="text-center">Agregar al carrito</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Title title="Similares" />
|
||||||
|
|
||||||
|
<div class="divMaster row ">
|
||||||
|
<div class="col-10 offset-1 d-flex flex-wrap justify-content-center mb-5">
|
||||||
|
<!-- <div
|
||||||
|
class="card m-3"
|
||||||
|
style="width: 12rem;"
|
||||||
|
v-bind:key="libro.id"
|
||||||
|
v-for="libro in Libros"
|
||||||
|
@click="descripcion(libro.id)"
|
||||||
|
>
|
||||||
|
<div class="textt">
|
||||||
|
<img :src="libro.img" class="card-img-top rounded" alt="libro" />
|
||||||
|
<div class="card-body cd textt">
|
||||||
|
<p class="card-text textt">
|
||||||
|
{{ libro.title }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
|
||||||
|
<div class="carousel-items card m-3 shadow"
|
||||||
|
style="width: 12rem;"
|
||||||
|
v-bind:key="item.id"
|
||||||
|
v-for="item in Libros"
|
||||||
|
@click="descripcion(libro.id)"
|
||||||
|
|
||||||
|
>
|
||||||
|
<img :src="item.img" class="card-img-top" alt="img" />
|
||||||
|
<div class="card-body ">
|
||||||
|
<h5 class="text-center"> <b >${{item.precio}}</b></h5>
|
||||||
|
<p class="card-text overflow-clip">{{item.descripcion}}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
|
||||||
|
import Title from "../components/titulo.vue";
|
||||||
|
|
||||||
|
|
||||||
|
export default {
|
||||||
|
|
||||||
|
components: {
|
||||||
|
Title
|
||||||
|
//modal
|
||||||
|
},
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
inventario:5,
|
||||||
|
idLibro: "",
|
||||||
|
titulo: "Procesos sociopolíticos y el espacio urbano. El desarrollo histórico urbano de San José Río Hondo, Naucalpan de Juárez (1700 a.C al 2000 d.C.)",
|
||||||
|
autor: "Mario Camacho Cardona",
|
||||||
|
paginas: "250",
|
||||||
|
isbn: "978-607-02-8433-5",
|
||||||
|
edicion: "Primera edición 2016",
|
||||||
|
precio: "324",
|
||||||
|
src: [ "https://demo-tienda.acatlan.unam.mx/55-large_default/metodos-numericos-para-sistemas-de-ecuaciones-no-lineales-interpolacion-y-ajuste-de-curvas.jpg",
|
||||||
|
"https://tienda.acatlan.unam.mx/365-large_default/ganz-toll-breves-apuntes-sobre-la-sintaxis-alemana.jpg",
|
||||||
|
"https://tienda.acatlan.unam.mx/363-large_default/corso-di-lettura-in-italiano-orizzonti-di-lettura-2-livello.jpg"],
|
||||||
|
|
||||||
|
src2:"https://tienda.acatlan.unam.mx/363-large_default/corso-di-lettura-in-italiano-orizzonti-di-lettura-2-livello.jpg",
|
||||||
|
version: "Impresa",
|
||||||
|
desc: `La obra valora la generación y las trasformaciones de la configuración espacial urbano-regional a través del suceder del desarrollo urbano-regional, provocadas por los modelos económico-políticos, administrativos. El sitio de estudio fue: San José Rio Hondo, ubicado en el Estado de México.`,
|
||||||
|
boton2: "",
|
||||||
|
categoria: "",
|
||||||
|
Libros: [
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/330-home_default/taza-ceramica-.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/3-home_default/problemas-de-estadistica-aplicada-a-las-ciencias-sociales-y-a-la-vida-cotidiana.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/3-home_default/problemas-de-estadistica-aplicada-a-las-ciencias-sociales-y-a-la-vida-cotidiana.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
],
|
||||||
|
Visible: false,
|
||||||
|
|
||||||
|
isModalVisible: false,
|
||||||
|
//PDF: "http://www.ataun.eus/bibliotecagratuita/Cl%C3%A1sicos%20en%20Espa%C3%B1ol/Nicol%C3%A1s%20Maquiavelo/El%20pr%C3%ADncipe.pdf#toolbar=0&navpanes=0&scrollbar=0&zoom=80"
|
||||||
|
//PDF: "RUTA.pdf" //nombre del archivo de previsualizacion del libro
|
||||||
|
PDF: "https://venus.acatlan.unam.mx/portal/PDFget/?nombrePDF=espacio_semico_ambiental.pdf"
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
close() {
|
||||||
|
this.$emit("close");
|
||||||
|
},
|
||||||
|
|
||||||
|
async descripcion(idLibro) {
|
||||||
|
localStorage.clear();
|
||||||
|
window.localStorage.setItem("idLibro", idLibro);
|
||||||
|
location.reload();
|
||||||
|
},
|
||||||
|
showModal() {
|
||||||
|
this.Visible = true;
|
||||||
|
},
|
||||||
|
closeModal() {
|
||||||
|
this.Visible = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.modal-backdrop {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: rgba(0, 0, 0, 0.3);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal {
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 2px 2px 20px 1px;
|
||||||
|
/* overflow-x: auto; */
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
width: 90%;
|
||||||
|
height: 90%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-body {
|
||||||
|
/* position: relative; */
|
||||||
|
padding: 20px 10px;
|
||||||
|
}
|
||||||
|
.divMaster {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
.card {
|
||||||
|
border: none !important;
|
||||||
|
border-bottom: 5px solid #1b3d70 !important;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
text-decoration: none !important;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
.img {
|
||||||
|
margin-left: 1rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
.izq {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
background-color: rgb(187, 136, 0);
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
height: 2.5rem;
|
||||||
|
width: 15rem;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
border-radius: .5rem;
|
||||||
|
-webkit-transition-duration: 0.4s; /* Safari */
|
||||||
|
transition-duration: 0.4s;
|
||||||
|
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
#buttonC{
|
||||||
|
margin-top: 0rem;
|
||||||
|
}
|
||||||
|
#buttonC p{
|
||||||
|
margin: 0;
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button:hover {
|
||||||
|
background-color: #46c200;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.pre {
|
||||||
|
background-color: #1e3c70;
|
||||||
|
}
|
||||||
|
.pre:hover {
|
||||||
|
background-color: rgb(187, 136, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.titulo {
|
||||||
|
font-size: 1rem;
|
||||||
|
text-align: left;
|
||||||
|
color: balck;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.libro {
|
||||||
|
width: 320px;
|
||||||
|
height: 480px;
|
||||||
|
margin-right: 0;
|
||||||
|
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
|
||||||
|
}
|
||||||
|
.smalll {
|
||||||
|
width: 80px;
|
||||||
|
margin: .7rem;
|
||||||
|
|
||||||
|
margin-right: 0;
|
||||||
|
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-backdrop{
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shadow{
|
||||||
|
-webkit-box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
|
||||||
|
-moz-box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
|
||||||
|
box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 450px) {
|
||||||
|
.libro {
|
||||||
|
width: 270px;
|
||||||
|
height: 380px;
|
||||||
|
margin-right: auto;
|
||||||
|
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 380px) {
|
||||||
|
.button {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
#buttonC{
|
||||||
|
margin-top: 0rem;
|
||||||
|
width: 12rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,234 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
|
||||||
|
<form class="mt-4" role="form" data-toggle="validator" >
|
||||||
|
|
||||||
|
<div class="my-3">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="row tipoComprobante">
|
||||||
|
<div class="form-check col-4 ">
|
||||||
|
<label class="form-check-label" >
|
||||||
|
Tipo de Comprobante:
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check col-4">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios1" v-model="select" value="ticket">
|
||||||
|
<label class="form-check-label" for="exampleRadios1">
|
||||||
|
Ticket
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check col-4">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios2" v-model="select" value="factura">
|
||||||
|
<label class="form-check-label" for="exampleRadios2">
|
||||||
|
Factura
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class=" datosFactura" v-if="select == 'factura'">
|
||||||
|
<h3 class="my-5">Direccion de Facturacion</h3>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">RFC</label>
|
||||||
|
<input type="text" class="form-control" id="InputRFC" v-model="Facturacion.RFC">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Nombres</label>
|
||||||
|
<input type="text" class="form-control" id="InputNombres" v-model="Facturacion.nombres">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Apellidos</label>
|
||||||
|
<input type="email" class="form-control" id="InputApellidos" v-model="Facturacion.apellidos">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">Empresa</label>
|
||||||
|
<input type="text" class="form-control" id="InputEmpresa" v-model="Facturacion.empresa">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">calle</label>
|
||||||
|
<input type="text" class="form-control" id="InputCalle" v-model="Facturacion.calle">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Numero Exterior</label>
|
||||||
|
<input type="email" class="form-control" id="InputExterior" v-model="Facturacion.exterior">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">Numero Interior</label>
|
||||||
|
<input type="text" class="form-control" id="InputInterior" v-model="Facturacion.interior">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Colonia</label>
|
||||||
|
<input type="text" class="form-control" id="InputColonia" v-model="Facturacion.colonia">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Provincia o estado</label>
|
||||||
|
<input type="email" class="form-control" id="InputEstado" v-model="Facturacion.estado">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">Pais</label>
|
||||||
|
<input type="text" class="form-control" id="InputPais" v-model="Facturacion.pais">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Telefono</label>
|
||||||
|
<input type="text" class="form-control" id="InputTelefono" v-model="Facturacion.telefono">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Correo</label>
|
||||||
|
<input type="email" class="form-control" id="InputCorreo" v-model="Facturacion.correo">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="row direccionIgual" v-if="select == 'factura'">
|
||||||
|
<div class="form-check col-8 ">
|
||||||
|
<label class="form-check-label" >
|
||||||
|
¿La direccion de facturacion es la misma a la de envio?
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check col-2">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios3" v-model="sameDirection" value="true">
|
||||||
|
<label class="form-check-label" for="exampleRadios3">
|
||||||
|
Si
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check col-2">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios4" v-model="sameDirection" value="false">
|
||||||
|
<label class="form-check-label" for="exampleRadios4">
|
||||||
|
No
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class=" datosEnvio" v-if="select == 'ticket' || (sameDirection == 'false' && select == 'factura')">
|
||||||
|
<h3 class="my-5">Direccion de Envio</h3>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Nombres</label>
|
||||||
|
<input type="text" class="form-control" id="InputNombres2" v-model="Envio.nombres">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Apellidos</label>
|
||||||
|
<input type="email" class="form-control" id="InputApellidos2" v-model="Envio.apellidos">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Correo</label>
|
||||||
|
<input type="email" class="form-control" id="InputCorreo2" v-model="Envio.correo">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">calle</label>
|
||||||
|
<input type="text" class="form-control" id="InputCalle2" v-model="Envio.calle">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Numero Exterior</label>
|
||||||
|
<input type="email" class="form-control" id="InputExterior2" v-model="Envio.exterior">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">Numero Interior</label>
|
||||||
|
<input type="text" class="form-control" id="InputInterior2" v-model="Envio.interior">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Colonia</label>
|
||||||
|
<input type="text" class="form-control" id="InputColonia2" v-model="Envio.colonia">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Codigo Postal</label>
|
||||||
|
<input type="text" class="form-control" id="InputPostal" v-model="Envio.postal">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Provincia o estado</label>
|
||||||
|
<input type="email" class="form-control" id="InputEstado2" v-model="Envio.estado">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">Pais</label>
|
||||||
|
<input type="text" class="form-control" id="InputPais2" v-model="Envio.pais">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Telefono</label>
|
||||||
|
<input type="text" class="form-control" id="InputTelefono2" v-model="Envio.telefono">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
sameDirection:'',
|
||||||
|
select:'',
|
||||||
|
|
||||||
|
Facturacion:
|
||||||
|
{
|
||||||
|
RFC:'',
|
||||||
|
nombres:'',
|
||||||
|
apellidos:'',
|
||||||
|
empresa:'',
|
||||||
|
calle:'',
|
||||||
|
exterior:'',
|
||||||
|
interior:'',
|
||||||
|
colonia:'',
|
||||||
|
estado:'',
|
||||||
|
pais:'',
|
||||||
|
telefono:'',
|
||||||
|
correo:''
|
||||||
|
|
||||||
|
},
|
||||||
|
Envio:{
|
||||||
|
RFC:'',
|
||||||
|
nombres:'',
|
||||||
|
apellidos:'',
|
||||||
|
postal:'',
|
||||||
|
calle:'',
|
||||||
|
exterior:'',
|
||||||
|
interior:'',
|
||||||
|
colonia:'',
|
||||||
|
estado:'',
|
||||||
|
pais:'',
|
||||||
|
telefono:'',
|
||||||
|
correo:''
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
@@ -25,36 +25,23 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<MainMenu></MainMenu>
|
||||||
|
|
||||||
|
|
||||||
</header>
|
</header>
|
||||||
<div class="header-f" >
|
|
||||||
<div class="container d-flex py-2 align-items-center justify-content-between">
|
|
||||||
<div>
|
|
||||||
<input class="form-control mr-sm-2" type="search" placeholder="Buscar" aria-label="Search">
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<a href="#" class="cart-icon-custom-properties text-decoration-none text-white">
|
|
||||||
<font-awesome-icon icon="shopping-cart" class="text-white" /><sup> ( )</sup>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import MainMenu from './MainMenu'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
components: {
|
||||||
return {
|
MainMenu,
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
||||||
@@ -63,9 +50,6 @@ export default {
|
|||||||
background: #1b3d70;
|
background: #1b3d70;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-f {
|
|
||||||
background-color: #bb8800;
|
|
||||||
}
|
|
||||||
.cart-icon-custom-properties {
|
.cart-icon-custom-properties {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,115 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="header-f" >
|
||||||
|
<div class="container d-flex py-2 align-items-center justify-content-between">
|
||||||
|
<div class="d-flex">
|
||||||
|
<div>
|
||||||
|
<b-button v-b-toggle.sidebar-backdrop class="mr-3 menu-toggle-sty"><font-awesome-icon icon="bars"/></b-button>
|
||||||
|
|
||||||
|
<b-sidebar
|
||||||
|
id="sidebar-backdrop"
|
||||||
|
title="Menú"
|
||||||
|
:backdrop-variant="variant"
|
||||||
|
backdrop
|
||||||
|
shadow
|
||||||
|
bg-variant="white" text-variant="primary"
|
||||||
|
>
|
||||||
|
<div class="px-3 mt-3 pt-2 d-flex align-items-center profi-main-text-sty">
|
||||||
|
<font-awesome-icon icon="user" class="mr-2" />
|
||||||
|
<a href="#" class="text-decoration-none">
|
||||||
|
<h5 class="my-auto">Iniciar sesión</h5>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<hr class="mx-3 mb-3">
|
||||||
|
|
||||||
|
<h6 class="px-3 pt-4">MAIN LOREM IPSUM</h6>
|
||||||
|
<hr class="mx-3 mb-2">
|
||||||
|
<ul class="px-3">
|
||||||
|
<li v-for="item in items" :key="item.mensaje">
|
||||||
|
<a href="#"> {{ item.mensaje }} </a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h6 class="px-3 mt-5">CONFIGURACIÓN</h6>
|
||||||
|
<hr class="mx-3 mb-2">
|
||||||
|
<ul class="px-3">
|
||||||
|
<li v-for="item in configuracion" :key="item.mensaje">
|
||||||
|
<a href="#"> {{ item.mensaje }} </a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</b-sidebar>
|
||||||
|
</div>
|
||||||
|
<input class="form-control mr-sm-2" type="search" placeholder="Buscar" aria-label="Search">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a href="#" class="cart-icon-custom-properties text-decoration-none text-white">
|
||||||
|
<font-awesome-icon icon="shopping-cart" class="text-white" /><sup> ( )</sup>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
items: [
|
||||||
|
{ mensaje: 'Investigación Aplicada y Multidisciplinaria' },
|
||||||
|
{ mensaje: 'Ciencias Socioeconómicas' }
|
||||||
|
],
|
||||||
|
configuracion: [
|
||||||
|
{ mensaje: 'Mi cuenta' },
|
||||||
|
{ mensaje: 'Ayuda' },
|
||||||
|
{ mensaje: 'Salir' },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
.header-f {
|
||||||
|
background-color: #bb8800;
|
||||||
|
}
|
||||||
|
.cart-icon-custom-properties {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.menu-toggle-sty {
|
||||||
|
background-color: transparent!important;
|
||||||
|
border: 1px solid white!important;
|
||||||
|
color: white!important;
|
||||||
|
}
|
||||||
|
.menu-toggle-sty:hover {
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.7)!important;
|
||||||
|
color: rgba(255, 255, 255, 0.7)!important;
|
||||||
|
}
|
||||||
|
.profi-main-text-sty, .profi-main-text-sty a {
|
||||||
|
color: #212529!important;
|
||||||
|
}
|
||||||
|
.profi-main-text-sty a:hover{
|
||||||
|
color:gray!important;
|
||||||
|
transition: 0.2s;
|
||||||
|
}
|
||||||
|
.b-sidebar-header-custom {
|
||||||
|
|
||||||
|
}
|
||||||
|
ul li {
|
||||||
|
list-style: none;
|
||||||
|
margin: 10px auto;
|
||||||
|
}
|
||||||
|
ul li a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #212529!important;
|
||||||
|
}
|
||||||
|
ul li a:hover {
|
||||||
|
color: rgba(0, 0, 0, 0.6)!important;
|
||||||
|
transition: 0.2s;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,62 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<h3 class="my-3">Pago</h3>
|
||||||
|
|
||||||
|
<form class="form-check">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="LineaUnam" v-model="metodo">
|
||||||
|
<label class="form-check-label" for="exampleRadios1">
|
||||||
|
Pago en linea UNAM
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value="Ficha" v-model="metodo">
|
||||||
|
<label class="form-check-label" for="exampleRadios2">
|
||||||
|
Ficha de Deposito
|
||||||
|
</label>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="checkbox" v-model="terminos" id="defaultCheck1">
|
||||||
|
<label class="form-check-label" for="defaultCheck1">
|
||||||
|
Estoy deacuerdo con los Terminos de servicio y los acepto sin reservas
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button type="button" class="btn btn-primary ml-4">Pedido con obligacion de pago</button>
|
||||||
|
|
||||||
|
<div v-if="(metodo) != '' && (terminos) == true " class="d-flex justify-content-right">
|
||||||
|
|
||||||
|
<button type="submit" @click="NextStep()" class="btn btn-success">continuar</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
metodo:'',
|
||||||
|
terminos:false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.form-check div{
|
||||||
|
margin: 1rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,94 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<h3 class="my-3">Metodo de Envio</h3>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12">
|
||||||
|
<div class="table-responsive">
|
||||||
|
<table class="table table-hover">
|
||||||
|
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="option1" checked>
|
||||||
|
</div>
|
||||||
|
</th>
|
||||||
|
<td class="d-flex align-items-center">
|
||||||
|
<img src='../assets/DHL-Logo.png' width="70px" alt="">
|
||||||
|
<p class="mb-0">DHL Express</p>
|
||||||
|
</td>
|
||||||
|
<td>{{tiempo}} dias</td>
|
||||||
|
<td>${{envio}} IVA incl.</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-12 mt-4">
|
||||||
|
<p>Si deseas dejarnos un comentaro acerca de su pedido, por favor escribalo a continuacion</p>
|
||||||
|
<div class="container">
|
||||||
|
<div class="comment">
|
||||||
|
<textarea class="textinput" placeholder="Comentario"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
envio:'232.00',
|
||||||
|
tiempo:'4'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.container {
|
||||||
|
max-width: 820px;
|
||||||
|
margin: 0px auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.comment {
|
||||||
|
float: left;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.commenter {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.commenter img {
|
||||||
|
width: 35px;
|
||||||
|
height: 35px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.comment-text-area {
|
||||||
|
float: left;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textinput {
|
||||||
|
float: left;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 75px;
|
||||||
|
outline: none;
|
||||||
|
resize: none;
|
||||||
|
border: 1px solid grey;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,28 +1,57 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="BotonesShopping" class="row">
|
<div id="BotonesShopping" class="row ">
|
||||||
<router-link to="/datosPersonales" class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <a href="#" class="btn .azul btn-primary active" role="button" aria-pressed="true">Datos Personales</a></router-link>
|
<div class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <router-link to="/datosPersonales" class="btn colores gris prueba text-white"> Datos Personales </router-link></div>
|
||||||
<router-link to="/datosPersonales" class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <a href="#" class="btn .gris btn-secondary " role="button" disabled>Direcciones</a> </router-link>
|
<div class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <router-link to="/datosPersonales" class="btn colores gris text-white"> Direcciones </router-link></div>
|
||||||
<router-link to="/datosPersonales" class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <a href="#" class="btn .gris btn-secondary " role="button" disabled>Envio</a> </router-link>
|
<div class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <router-link to="/datosPersonales" class="btn colores gris text-white"> Envio </router-link></div>
|
||||||
<router-link to="/datosPersonales" class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <a href="#" class="btn .gris btn-secondary " role="button" disabled>Pago</a> </router-link>
|
<div class="col-sm-3 col-md-3 col-lg-3 col-xl-3 col-12 mt-1 d-flex align-items-center navshop "> <router-link to="/datosPersonales" class="btn colores gris text-white"> Pago </router-link></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
const $ = require('jquery')
|
||||||
|
|
||||||
|
|
||||||
|
export default {
|
||||||
|
props:['currentStep'],
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
|
||||||
|
color(etapa){
|
||||||
|
|
||||||
|
var result = $(".colores:first")
|
||||||
|
|
||||||
|
result.removeClass("gris").toggleClass("azul")
|
||||||
|
|
||||||
|
console.log(result)
|
||||||
|
console.log(etapa)
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
created(){
|
||||||
|
|
||||||
|
this.color(this.currentStep)
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style >
|
<style >
|
||||||
|
|
||||||
.verde{
|
.verde{
|
||||||
background-color: #29B026 ;
|
background-color: #29B026 !important;
|
||||||
}
|
}
|
||||||
.azul{
|
.azul{
|
||||||
background-color: #1B3D70 !important;
|
background-color: #1B3D70 !important;
|
||||||
}
|
}
|
||||||
.gris{
|
.gris{
|
||||||
background-color: #C4C4C4;
|
background-color: #C4C4C4 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navshop a {
|
.navshop a {
|
||||||
@@ -30,9 +59,9 @@ export default {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width:1023px ) and (min-width: 770px) {
|
@media screen and (max-width:1023px ) and (min-width: 760px) {
|
||||||
.navshop a {
|
.navshop a {
|
||||||
font-size: .8rem !important;
|
font-size: .6rem !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,109 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
|
||||||
|
<div class="card sombra">
|
||||||
|
<div class="card-body">
|
||||||
|
|
||||||
|
|
||||||
|
<h2 class="card-title">Mi Compra</h2>
|
||||||
|
<div class="my-5">
|
||||||
|
<div>
|
||||||
|
<div v-if="detalles == false">
|
||||||
|
<p class="card-text ">Tienes {{articulos.length}} Articulo(s)</p>
|
||||||
|
<a @click="detalle()" class="text-primary">mostrar detalles</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="detalles == true">
|
||||||
|
<ul class="productos">
|
||||||
|
<li v-for="articulo in articulos" :key="articulo.id" >
|
||||||
|
<p>{{articulo.nombre}}</p>
|
||||||
|
<div class="d-flex justify-content-between">
|
||||||
|
<p>{{articulo.cantidad}}pz.</p>
|
||||||
|
<p>${{articulo.precio * articulo.cantidad}}</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
|
<a @click="detalle()" class="text-primary">ocultar detalles</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="mt-3">
|
||||||
|
<div class="d-flex justify-content-between">
|
||||||
|
<p >Subtotal </p>
|
||||||
|
<p >${{SubTotal}}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="d-flex justify-content-between">
|
||||||
|
<p> Envio </p>
|
||||||
|
<p>${{Envio}}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-flex justify-content-between align-items-center border-top border-bottom">
|
||||||
|
<p> Total </p>
|
||||||
|
<p>${{Total}}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="card-footer bg-transparent border-top-0 d-flex justify-content-center">
|
||||||
|
<a href="#" class="btn doradoColor text-white my-3">Modificar</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
detalles:false,
|
||||||
|
articulos:[
|
||||||
|
{
|
||||||
|
id:0,
|
||||||
|
nombre:'ejemploq',
|
||||||
|
cantidad:'2',
|
||||||
|
precio:'654.00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id:1,
|
||||||
|
nombre:'asdsa',
|
||||||
|
cantidad:'3',
|
||||||
|
precio:'4654.00'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
SubTotal:'00.00',
|
||||||
|
Envio:'00.00',
|
||||||
|
Total:'00.00'
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
detalle(){
|
||||||
|
this.detalles = !this.detalles
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.productos{
|
||||||
|
list-style: none;
|
||||||
|
padding-left: 0%;
|
||||||
|
}
|
||||||
|
.sombra{
|
||||||
|
-webkit-box-shadow: 0px 10px 5px 0px rgba(0,0,0,0.75);
|
||||||
|
-moz-box-shadow: 0px 10px 5px 0px rgba(0,0,0,0.75);
|
||||||
|
box-shadow: 0px 10px 5px 0px rgba(0,0,0,0.75);
|
||||||
|
}
|
||||||
|
.doradoColor{
|
||||||
|
background-color: #bb8800 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,190 @@
|
|||||||
|
<template>
|
||||||
|
<form class="mt-4" role="form" data-toggle="validator" @submit.prevent="checkForm">
|
||||||
|
|
||||||
|
<div class="my-3">
|
||||||
|
<div class="row ">
|
||||||
|
<div class="form-check col-4 ">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios1" v-model="select" value="invitado" checked>
|
||||||
|
<label class="form-check-label" for="exampleRadios1">
|
||||||
|
Invitado
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check col-4">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios2" v-model="select" value="cuenta">
|
||||||
|
<label class="form-check-label" for="exampleRadios2">
|
||||||
|
Ya Tengo Cuenta
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check col-4">
|
||||||
|
<input class="form-check-input" type="radio" id="exampleRadios3" v-model="select" value="newCuenta">
|
||||||
|
<label class="form-check-label" for="exampleRadios2">
|
||||||
|
Crear Cuenta
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="submitted === true">
|
||||||
|
<div v-if="hasErrors" class="error">
|
||||||
|
<strong>Se han producido los siguientes errores:</strong>
|
||||||
|
<ul>
|
||||||
|
<li v-bind:key="error" v-for="error in errors">{{ error }}</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div v-else class="correcto">
|
||||||
|
<strong>Enviado!</strong>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="select == 'invitado' ">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre1">Nombres</label>
|
||||||
|
<input type="text" class="form-control" id="InputNombre1" placeholder="Ingresa tu nombre" v-model="invitado.nombre">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido1">Apellidos</label>
|
||||||
|
<input type="text" class="form-control" id="InputApellido1" placeholder="Ingresa tus apellidos" v-model="invitado.apellido">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo1">Correo</label>
|
||||||
|
<input type="email" class="form-control" id="InputCorreo1" placeholder="Enter email" v-model="invitado.correo">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div v-if="select == 'cuenta' ">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo2" >Correo</label>
|
||||||
|
<input type="email" class="form-control" id="InputCorreo2" placeholder="Enter email" v-model="cuenta.correo">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputPassword2">Contraseña</label>
|
||||||
|
<input type="password" class="form-control" id="InputPassword1" placeholder="Password" v-model="cuenta.contrasena">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div v-if="select == 'newCuenta' ">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputNombre3">Nombres</label>
|
||||||
|
<input type="email" class="form-control" id="InputNombre3" v-model="newCuenta.nombre" placeholder="Ingresa tu nombre">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputApellido3">Apellidos</label>
|
||||||
|
<input type="email" class="form-control" id="InputApellido3" v-model="newCuenta.apellido" placeholder="Ingresa tus apellidos">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="InputCorreo3">Correo</label>
|
||||||
|
<input type="email" class="form-control" id="InputCorreo3" v-model="newCuenta.correo" placeholder="Ingresa tu correo">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="exampleInputEmail1">Fecha de Nacimiento</label>
|
||||||
|
<input class="form-control" type="date" value="2011-08-19" id="dataEjemploFecha" v-model="newCuenta.nacimiento">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="exampleInputEmail1">Contraseña</label>
|
||||||
|
<input type="email" class="form-control" id="exampleInputEmail1" v-model="newCuenta.contrasena" placeholder="Enter email">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="select != ''">
|
||||||
|
<div class="form-check">
|
||||||
|
<input type="checkbox" class="form-check-input" id="exampleCheck1" v-model="check.ofertas" >
|
||||||
|
<label class="form-check-label" for="exampleCheck1">Recibir ofertas de nuestros socios</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check">
|
||||||
|
<input type="checkbox" class="form-check-input" id="exampleCheck2" v-model="check.suscribirse" >
|
||||||
|
<label class="form-check-label" for="exampleCheck2">Suscribirse a nuestro boletín de noticias</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- <pre>{{$data}}</pre> -->
|
||||||
|
|
||||||
|
<div v-if="(invitado.nombre && invitado.apellido && invitado.correo)
|
||||||
|
|| (cuenta.correo && cuenta.contrasena)
|
||||||
|
|| (newCuenta.nombre && newCuenta.apellido && newCuenta.correo && newCuenta.nacimiento && newCuenta.contrasena) != ''">
|
||||||
|
<button type="submit" @click="NextStep()" class="btn btn-success">continuar</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
continuar:false,
|
||||||
|
select:'',
|
||||||
|
errors:[], submitted:false,
|
||||||
|
invitado:{
|
||||||
|
nombre:'',
|
||||||
|
apellido:'',
|
||||||
|
correo:''
|
||||||
|
},
|
||||||
|
cuenta:{
|
||||||
|
correo:'',
|
||||||
|
contrasena:''
|
||||||
|
},
|
||||||
|
newCuenta:{
|
||||||
|
nombre:'',
|
||||||
|
apellido:'',
|
||||||
|
correo:'',
|
||||||
|
nacimiento:'',
|
||||||
|
contrasena:''
|
||||||
|
},
|
||||||
|
check:{
|
||||||
|
ofertas:false,
|
||||||
|
suscribirse:false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
checkForm() {
|
||||||
|
this.submitted = true;
|
||||||
|
switch(this.select){
|
||||||
|
case 'invitado':
|
||||||
|
console.log(this.select)
|
||||||
|
break
|
||||||
|
|
||||||
|
case 'cuenta':
|
||||||
|
console.log(this.select)
|
||||||
|
break
|
||||||
|
|
||||||
|
case 'newCuenta':
|
||||||
|
console.log(this.select)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
this.continuar = true
|
||||||
|
},
|
||||||
|
NextStep(){
|
||||||
|
let pagina = this.$router.currentRoute.name
|
||||||
|
switch(pagina){
|
||||||
|
case 'personalData':
|
||||||
|
this.$router.push({name:'home'})
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
hasError(){
|
||||||
|
return this.errors.length;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created(){
|
||||||
|
console.log(this.$router.currentRoute)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,46 @@
|
|||||||
|
<template>
|
||||||
|
<div class="divMaster">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-10 offset-1 bor d-flex justify-content-center">
|
||||||
|
<div class="bgAzul">
|
||||||
|
<p class="text-white pTitulo">{{ title }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: ["title"]
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.bor {
|
||||||
|
border: none !important;
|
||||||
|
border-bottom: 5px solid #1b3d70 !important;
|
||||||
|
}
|
||||||
|
.bgAzul {
|
||||||
|
background-color: #1b3d70;
|
||||||
|
width: 40%;
|
||||||
|
|
||||||
|
border-top-right-radius: 20px 20px !important;
|
||||||
|
border-top-left-radius: 20px 20px !important;
|
||||||
|
}
|
||||||
|
.pTitulo {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 30px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 450px) {
|
||||||
|
.pTitulo {
|
||||||
|
font-size: 20px;
|
||||||
|
padding: 0px 3px;
|
||||||
|
}
|
||||||
|
.bgAzul {
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
const config = {
|
||||||
|
//ngrok
|
||||||
|
//api: "https://f8d86328e778.ngrok.io"
|
||||||
|
|
||||||
|
//Local
|
||||||
|
//api: "http://localhost:3000"
|
||||||
|
|
||||||
|
//Pruebas
|
||||||
|
api: "https://venus.acatlan.unam.mx/portal"
|
||||||
|
};
|
||||||
|
module.exports = config;
|
||||||
+3
-1
@@ -11,7 +11,8 @@ import {
|
|||||||
faShoppingCart,
|
faShoppingCart,
|
||||||
faTrash,
|
faTrash,
|
||||||
faMapMarkerAlt,
|
faMapMarkerAlt,
|
||||||
faPhoneAlt
|
faPhoneAlt,
|
||||||
|
faBars
|
||||||
} from '@fortawesome/free-solid-svg-icons'
|
} from '@fortawesome/free-solid-svg-icons'
|
||||||
|
|
||||||
|
|
||||||
@@ -27,4 +28,5 @@ library.add(faShoppingCart)
|
|||||||
library.add(faTrash)
|
library.add(faTrash)
|
||||||
library.add(faMapMarkerAlt)
|
library.add(faMapMarkerAlt)
|
||||||
library.add(faPhoneAlt)
|
library.add(faPhoneAlt)
|
||||||
|
library.add(faBars)
|
||||||
|
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ import VueRouter from 'vue-router'
|
|||||||
import Home from './view/Home.vue'
|
import Home from './view/Home.vue'
|
||||||
import PersonalData from './view/PersonalData.vue'
|
import PersonalData from './view/PersonalData.vue'
|
||||||
|
|
||||||
|
import Descrip from './view/Descrip.vue'
|
||||||
const routes = [
|
const routes = [
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
|
|||||||
@@ -0,0 +1,25 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<Header />
|
||||||
|
|
||||||
|
|
||||||
|
<Description />
|
||||||
|
|
||||||
|
<Footer />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Header from "./../components/Header.vue";
|
||||||
|
import Description from "./../components/Description.vue";
|
||||||
|
import Footer from "./../components/Footer.vue";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
|
||||||
|
components: {
|
||||||
|
Header,
|
||||||
|
Description,
|
||||||
|
Footer
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
+163
-8
@@ -1,22 +1,177 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="body">
|
||||||
<Header></Header>
|
<Header></Header>
|
||||||
<div class="container my-5">
|
|
||||||
<h1 class="text-center">Home</h1>
|
<div class="row ">
|
||||||
</div>
|
<div class="col-12 col-md-10 col-lg-10 col-xl-10 mx-auto">
|
||||||
<Footer></Footer>
|
<CarruselImg />
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- lo mas vendido -->
|
||||||
|
<div class="row ">
|
||||||
|
<div class="col-12 smx-auto">
|
||||||
|
<div class="my-5">
|
||||||
|
<h5 class="text-center font-weight-bold">Lo más vendido</h5>
|
||||||
|
<carousel
|
||||||
|
:autoplay="true"
|
||||||
|
:perPage=2
|
||||||
|
:perPageCustom="[[480, 3],[900, 4]]"
|
||||||
|
:resistanceCoef=20
|
||||||
|
:autoplayHoverPause=true
|
||||||
|
:minSwipeDistance=200
|
||||||
|
>
|
||||||
|
<slide class="carousel-items card mx-2 shadow"
|
||||||
|
v-bind:key="item.id"
|
||||||
|
v-for="(item, idx) in items"
|
||||||
|
:class="{ active: idx == 0 }">
|
||||||
|
|
||||||
|
<img :src="item.img" class="card-img-top" alt="img" />
|
||||||
|
<div class="card-body">
|
||||||
|
<h5 class="text-center"> <b >${{item.precio}}</b></h5>
|
||||||
|
<p class="card-text overflow-clip">{{item.descripcion}}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</slide>
|
||||||
|
<slide class="carousel-items card mx-2 shadow"></slide>
|
||||||
|
</carousel>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- lo mas reciente -->
|
||||||
|
<div class="row ">
|
||||||
|
<div class="col-12 smx-auto">
|
||||||
|
<div class="my-5">
|
||||||
|
<h5 class="text-center font-weight-bold">Lo más reciente</h5>
|
||||||
|
<carousel
|
||||||
|
:autoplay="true"
|
||||||
|
:perPage=2
|
||||||
|
:perPageCustom="[[480, 3],[900, 4]]"
|
||||||
|
:resistanceCoef=20
|
||||||
|
:autoplayHoverPause=true
|
||||||
|
:minSwipeDistance=200
|
||||||
|
>
|
||||||
|
<slide class="carousel-items card mx-2 shadow"
|
||||||
|
v-bind:key="item.id"
|
||||||
|
v-for="(item, idx) in items"
|
||||||
|
:class="{ active: idx == 0 }">
|
||||||
|
|
||||||
|
<img :src="item.img" class="card-img-top" alt="img" />
|
||||||
|
<div class="card-body ">
|
||||||
|
<h5 class="text-center"> <b >${{item.precio}}</b></h5>
|
||||||
|
<p class="card-text overflow-clip">{{item.descripcion}}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</slide>
|
||||||
|
<slide class="carousel-items card mx-2 shadow"></slide>
|
||||||
|
</carousel>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<Footer></Footer>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
import Header from '../components/Header'
|
import Header from '../components/Header'
|
||||||
import Footer from '../components/Footer'
|
import Footer from '../components/Footer'
|
||||||
|
|
||||||
|
import { Carousel, Slide } from 'vue-carousel'
|
||||||
|
import CarruselImg from '../components/Carrousel'
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Header,
|
Header,
|
||||||
Footer
|
Footer,
|
||||||
|
Carousel,
|
||||||
|
CarruselImg,
|
||||||
|
|
||||||
|
Slide
|
||||||
|
},
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
items:[
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/330-home_default/taza-ceramica-.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/3-home_default/problemas-de-estadistica-aplicada-a-las-ciencias-sociales-y-a-la-vida-cotidiana.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/361-home_default/las-pasiones-en-la-prensa-mexicana-siglos-xix-xxi.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/362-home_default/corso-di-lettura-in-italiano-orizzonti-di-lettura-1-livello.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/363-home_default/corso-di-lettura-in-italiano-orizzonti-di-lettura-2-livello.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/364-home_default/herramientas-tic-guia-de-inicio.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/365-home_default/ganz-toll-breves-apuntes-sobre-la-sintaxis-alemana.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
} ,
|
||||||
|
{
|
||||||
|
img:'https://tienda.acatlan.unam.mx/366-home_default/espacio-semico-ambiental.jpg',
|
||||||
|
precio:199.00,
|
||||||
|
descripcion:'esta es la descripcion del articulo'
|
||||||
|
}
|
||||||
|
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.overflow-clip {
|
||||||
|
white-space: nowrap;
|
||||||
|
width: 90%;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
.VueCarousel-dot:active{
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
}
|
||||||
|
.body{
|
||||||
|
/* background-color: #E5E5E5; */
|
||||||
|
overflow-x: hidden;
|
||||||
|
|
||||||
|
}
|
||||||
|
.card-body{
|
||||||
|
border-top: 1px solid black !important;
|
||||||
|
}
|
||||||
|
.VueCarousel-wrapper{
|
||||||
|
overflow-x:inherit ;
|
||||||
|
overflow-y:inherit ;
|
||||||
|
}
|
||||||
|
.shadow{
|
||||||
|
-webkit-box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
|
||||||
|
-moz-box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
|
||||||
|
box-shadow: -2px 4px 35px 0px rgba(0,0,0,0.75);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
+22
-21
@@ -7,31 +7,19 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
||||||
<section class="col-10 col-sm-7 col-md-7 col-lg-7 col-xl-7 offset-1">
|
<section class="col-10 col-sm-7 col-md-7 col-lg-7 col-xl-7 offset-1">
|
||||||
<ShoppingNav></ShoppingNav>
|
<ShoppingNav currentStep=2></ShoppingNav>
|
||||||
|
|
||||||
|
<DataSection></DataSection>
|
||||||
|
|
||||||
<form class="mt-4">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleInputEmail1">Email address</label>
|
|
||||||
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
|
|
||||||
<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleInputPassword1">Password</label>
|
|
||||||
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
|
|
||||||
</div>
|
|
||||||
<div class="form-check">
|
|
||||||
<input type="checkbox" class="form-check-input" id="exampleCheck1">
|
|
||||||
<label class="form-check-label" for="exampleCheck1">Check me out</label>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-primary">Submit</button>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<aside class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 bg-primary">
|
<aside id="CompraStatus" class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 ">
|
||||||
<h3 class="text-center">status</h3>
|
<!-- <h3 class="text-center">status</h3> -->
|
||||||
|
<ShoppingStatus></ShoppingStatus>
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@@ -44,17 +32,30 @@
|
|||||||
import Header from '../components/Header'
|
import Header from '../components/Header'
|
||||||
import Footer from '../components/Footer'
|
import Footer from '../components/Footer'
|
||||||
import ShoppingNav from '../components/ShoppingNav'
|
import ShoppingNav from '../components/ShoppingNav'
|
||||||
|
import DataSection from '../components/dataSection'
|
||||||
|
import ShoppingStatus from '../components/ShoppingStatus'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Header,
|
Header,
|
||||||
Footer,
|
Footer,
|
||||||
ShoppingNav
|
ShoppingNav,
|
||||||
|
ShoppingStatus,
|
||||||
|
DataSection
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
#CompraStatus{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width:760px ) {
|
||||||
|
#CompraStatus{
|
||||||
|
margin-top: 2rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user