Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
f18766178d | ||
|
|
099ee97216 |
@@ -1,36 +1,20 @@
|
||||
{
|
||||
"products": [
|
||||
{
|
||||
"id": "1533",
|
||||
"name": "Отвертка",
|
||||
"price": 450,
|
||||
"image": "https://cdn.kuvalda.ru/data/file_resize/product/7c/c9/1b/landing-7cc91b79db759ca3e2a14868fcabbaf0.jpg",
|
||||
"brandId": "2",
|
||||
"categoryId": "2"
|
||||
"name": "дрель",
|
||||
"price": "9000",
|
||||
"image": "https://www.interskol.ru/storage/products/1641253262/%D0%94%D0%A3-13%20750%D0%AD%D0%A0%20%D0%B4%D1%80%D0%B5%D0%BB%D1%8C%20%D1%83%D0%B4%D0%B0%D1%80%D0%BD%D0%B0%D1%8F%20(546.1.0.00).jpg",
|
||||
"categoryId": 1,
|
||||
"brandId": 1,
|
||||
"id": "09e4"
|
||||
},
|
||||
{
|
||||
"id": "dbd9",
|
||||
"name": "Дрель",
|
||||
"price": 8999,
|
||||
"image": "https://cdn.kuvalda.ru/data/file_resize/product/7c/c9/1b/landing-7cc91b79db759ca3e2a14868fcabbaf0.jpg",
|
||||
"brandId": "1",
|
||||
"categoryId": "1"
|
||||
},
|
||||
{
|
||||
"name": "Отвертка",
|
||||
"price": 100,
|
||||
"image": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTCxcN67AQirgFwXQ3RmffA715CIAIsLJlhLw&s",
|
||||
"brandId": "2",
|
||||
"categoryId": "2",
|
||||
"id": "088f"
|
||||
},
|
||||
{
|
||||
"id": "aff4",
|
||||
"name": "ЖУЖУЖУЖУ",
|
||||
"price": 9000,
|
||||
"image": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTCxcN67AQirgFwXQ3RmffA715CIAIsLJlhLw&s",
|
||||
"brandId": "1",
|
||||
"categoryId": "1"
|
||||
"id": "30c3",
|
||||
"name": "отвертка",
|
||||
"price": "450",
|
||||
"image": "https://cdn.vseinstrumenti.ru/images/goods/ruchnoj-instrument/otvertki/923910/560x504/180280523.jpg",
|
||||
"categoryId": 2,
|
||||
"brandId": 3
|
||||
}
|
||||
],
|
||||
"categories": [
|
||||
|
||||
622
MasterOK/package-lock.json
generated
622
MasterOK/package-lock.json
generated
@@ -10,12 +10,9 @@
|
||||
"dependencies": {
|
||||
"bootstrap": "5.3.3",
|
||||
"bootstrap-icons": "1.11.3",
|
||||
"express": "^4.21.2",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0"
|
||||
"express": "^4.21.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-react": "^4.4.1",
|
||||
"concurrently": "^9.1.2",
|
||||
"eslint": "8.56.0",
|
||||
"eslint-config-airbnb-base": "15.0.0",
|
||||
@@ -28,315 +25,6 @@
|
||||
"vite": "^6.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ampproject/remapping": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
|
||||
"integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"@jridgewell/gen-mapping": "^0.3.5",
|
||||
"@jridgewell/trace-mapping": "^0.3.24"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/code-frame": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.27.1.tgz",
|
||||
"integrity": "sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-validator-identifier": "^7.27.1",
|
||||
"js-tokens": "^4.0.0",
|
||||
"picocolors": "^1.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/compat-data": {
|
||||
"version": "7.27.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.27.2.tgz",
|
||||
"integrity": "sha512-TUtMJYRPyUb/9aU8f3K0mjmjf6M9N5Woshn2CS6nqJSeJtTtQcpLUXjGt9vbF8ZGff0El99sWkLgzwW3VXnxZQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/core": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.27.1.tgz",
|
||||
"integrity": "sha512-IaaGWsQqfsQWVLqMn9OB92MNN7zukfVA4s7KKAI0KfrrDsZ0yhi5uV4baBuLuN7n3vsZpwP8asPPcVwApxvjBQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@ampproject/remapping": "^2.2.0",
|
||||
"@babel/code-frame": "^7.27.1",
|
||||
"@babel/generator": "^7.27.1",
|
||||
"@babel/helper-compilation-targets": "^7.27.1",
|
||||
"@babel/helper-module-transforms": "^7.27.1",
|
||||
"@babel/helpers": "^7.27.1",
|
||||
"@babel/parser": "^7.27.1",
|
||||
"@babel/template": "^7.27.1",
|
||||
"@babel/traverse": "^7.27.1",
|
||||
"@babel/types": "^7.27.1",
|
||||
"convert-source-map": "^2.0.0",
|
||||
"debug": "^4.1.0",
|
||||
"gensync": "^1.0.0-beta.2",
|
||||
"json5": "^2.2.3",
|
||||
"semver": "^6.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/babel"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/core/node_modules/json5": {
|
||||
"version": "2.2.3",
|
||||
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
|
||||
"integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"json5": "lib/cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/generator": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.1.tgz",
|
||||
"integrity": "sha512-UnJfnIpc/+JO0/+KRVQNGU+y5taA5vCbwN8+azkX6beii/ZF+enZJSOKo11ZSzGJjlNfJHfQtmQT8H+9TXPG2w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.27.1",
|
||||
"@babel/types": "^7.27.1",
|
||||
"@jridgewell/gen-mapping": "^0.3.5",
|
||||
"@jridgewell/trace-mapping": "^0.3.25",
|
||||
"jsesc": "^3.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-compilation-targets": {
|
||||
"version": "7.27.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.27.2.tgz",
|
||||
"integrity": "sha512-2+1thGUUWWjLTYTHZWK1n8Yga0ijBz1XAhUXcKy81rd5g6yh7hGqMp45v7cadSbEHc9G3OTv45SyneRN3ps4DQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/compat-data": "^7.27.2",
|
||||
"@babel/helper-validator-option": "^7.27.1",
|
||||
"browserslist": "^4.24.0",
|
||||
"lru-cache": "^5.1.1",
|
||||
"semver": "^6.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-module-imports": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz",
|
||||
"integrity": "sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/traverse": "^7.27.1",
|
||||
"@babel/types": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-module-transforms": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.27.1.tgz",
|
||||
"integrity": "sha512-9yHn519/8KvTU5BjTVEEeIM3w9/2yXNKoD82JifINImhpKkARMJKPP59kLo+BafpdN5zgNeIcS4jsGDmd3l58g==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-module-imports": "^7.27.1",
|
||||
"@babel/helper-validator-identifier": "^7.27.1",
|
||||
"@babel/traverse": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-plugin-utils": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.27.1.tgz",
|
||||
"integrity": "sha512-1gn1Up5YXka3YYAHGKpbideQ5Yjf1tDa9qYcgysz+cNCXukyLl6DjPXhD3VRwSb8c0J9tA4b2+rHEZtc6R0tlw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-string-parser": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
|
||||
"integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-validator-identifier": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz",
|
||||
"integrity": "sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helper-validator-option": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
|
||||
"integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/helpers": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.1.tgz",
|
||||
"integrity": "sha512-FCvFTm0sWV8Fxhpp2McP5/W53GPllQ9QeQ7SiqGWjMf/LVG07lFa5+pgK05IRhVwtvafT22KF+ZSnM9I545CvQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/template": "^7.27.1",
|
||||
"@babel/types": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/parser": {
|
||||
"version": "7.27.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.2.tgz",
|
||||
"integrity": "sha512-QYLs8299NA7WM/bZAdp+CviYYkVoYXlDW2rzliy3chxd1PQjej7JORuMJDJXJUb9g0TT+B99EwaVLKmX+sPXWw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/types": "^7.27.1"
|
||||
},
|
||||
"bin": {
|
||||
"parser": "bin/babel-parser.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/plugin-transform-react-jsx-self": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.27.1.tgz",
|
||||
"integrity": "sha512-6UzkCs+ejGdZ5mFFC/OCUrv028ab2fp1znZmCZjAOBKiBK2jXD1O+BPSfX8X2qjJ75fZBMSnQn3Rq2mrBJK2mw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-plugin-utils": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/plugin-transform-react-jsx-source": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.27.1.tgz",
|
||||
"integrity": "sha512-zbwoTsBruTeKB9hSq73ha66iFeJHuaFkUbwvqElnygoNbj/jHRsSeokowZFN3CZ64IvEqcmmkVe89OPXc7ldAw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-plugin-utils": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/template": {
|
||||
"version": "7.27.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
|
||||
"integrity": "sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.27.1",
|
||||
"@babel/parser": "^7.27.2",
|
||||
"@babel/types": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/traverse": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.1.tgz",
|
||||
"integrity": "sha512-ZCYtZciz1IWJB4U61UPu4KEaqyfj+r5T1Q5mqPo+IBpcG9kHv30Z0aD8LXPgC1trYa6rK0orRyAhqUgk4MjmEg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.27.1",
|
||||
"@babel/generator": "^7.27.1",
|
||||
"@babel/parser": "^7.27.1",
|
||||
"@babel/template": "^7.27.1",
|
||||
"@babel/types": "^7.27.1",
|
||||
"debug": "^4.3.1",
|
||||
"globals": "^11.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/traverse/node_modules/globals": {
|
||||
"version": "11.12.0",
|
||||
"resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
|
||||
"integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/types": {
|
||||
"version": "7.27.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.1.tgz",
|
||||
"integrity": "sha512-+EzkxvLNfiUeKMgy/3luqfsCWFRXLb7U6wNQTk60tovuckwB15B191tJWvpp4HjiQWdJkCxO3Wbvc6jlk3Xb2Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-string-parser": "^7.27.1",
|
||||
"@babel/helper-validator-identifier": "^7.27.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@bufbuild/protobuf": {
|
||||
"version": "2.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.2.3.tgz",
|
||||
@@ -870,59 +558,6 @@
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause"
|
||||
},
|
||||
"node_modules/@jridgewell/gen-mapping": {
|
||||
"version": "0.3.8",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz",
|
||||
"integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@jridgewell/set-array": "^1.2.1",
|
||||
"@jridgewell/sourcemap-codec": "^1.4.10",
|
||||
"@jridgewell/trace-mapping": "^0.3.24"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/resolve-uri": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
|
||||
"integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/set-array": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
|
||||
"integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/sourcemap-codec": {
|
||||
"version": "1.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
|
||||
"integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@jridgewell/trace-mapping": {
|
||||
"version": "0.3.25",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
|
||||
"integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@jridgewell/resolve-uri": "^3.1.0",
|
||||
"@jridgewell/sourcemap-codec": "^1.4.14"
|
||||
}
|
||||
},
|
||||
"node_modules/@nodelib/fs.scandir": {
|
||||
"version": "2.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
||||
@@ -1522,51 +1157,6 @@
|
||||
"node": ">=12.20"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/babel__core": {
|
||||
"version": "7.20.5",
|
||||
"resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
|
||||
"integrity": "sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.20.7",
|
||||
"@babel/types": "^7.20.7",
|
||||
"@types/babel__generator": "*",
|
||||
"@types/babel__template": "*",
|
||||
"@types/babel__traverse": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/babel__generator": {
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.27.0.tgz",
|
||||
"integrity": "sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/types": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/babel__template": {
|
||||
"version": "7.4.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.4.tgz",
|
||||
"integrity": "sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.1.0",
|
||||
"@babel/types": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/babel__traverse": {
|
||||
"version": "7.20.7",
|
||||
"resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.20.7.tgz",
|
||||
"integrity": "sha512-dkO5fhS7+/oos4ciWxyEyjWe48zmG6wbCheo/G2ZnHx4fs3EU6YC6UM8rk56gAjNJ9P3MTH2jo5jb92/K6wbng==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/types": "^7.20.7"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/estree": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
|
||||
@@ -1588,26 +1178,6 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/@vitejs/plugin-react": {
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.4.1.tgz",
|
||||
"integrity": "sha512-IpEm5ZmeXAP/osiBXVVP5KjFMzbWOonMs0NaQQl+xYnUAcq4oHUBsF2+p4MgKWG4YMmFYJU8A6sxRPuowllm6w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.26.10",
|
||||
"@babel/plugin-transform-react-jsx-self": "^7.25.9",
|
||||
"@babel/plugin-transform-react-jsx-source": "^7.25.9",
|
||||
"@types/babel__core": "^7.20.5",
|
||||
"react-refresh": "^0.17.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^14.18.0 || >=16.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vite": "^4.2.0 || ^5.0.0 || ^6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/accepts": {
|
||||
"version": "1.3.8",
|
||||
"resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
|
||||
@@ -1946,39 +1516,6 @@
|
||||
"concat-map": "0.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/browserslist": {
|
||||
"version": "4.24.5",
|
||||
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.5.tgz",
|
||||
"integrity": "sha512-FDToo4Wo82hIdgc1CQ+NQD0hEhmpPjrZ3hiUgwgOG6IuTdlpr8jdjyG24P6cNP1yJpTLzS5OcGgSw0xmDU1/Tw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/browserslist"
|
||||
},
|
||||
{
|
||||
"type": "tidelift",
|
||||
"url": "https://tidelift.com/funding/github/npm/browserslist"
|
||||
},
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/ai"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"caniuse-lite": "^1.0.30001716",
|
||||
"electron-to-chromium": "^1.5.149",
|
||||
"node-releases": "^2.0.19",
|
||||
"update-browserslist-db": "^1.1.3"
|
||||
},
|
||||
"bin": {
|
||||
"browserslist": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
|
||||
}
|
||||
},
|
||||
"node_modules/buffer-builder": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/buffer-builder/-/buffer-builder-0.2.0.tgz",
|
||||
@@ -2053,27 +1590,6 @@
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/caniuse-lite": {
|
||||
"version": "1.0.30001718",
|
||||
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001718.tgz",
|
||||
"integrity": "sha512-AflseV1ahcSunK53NfEs9gFWgOEmzr0f+kaMFA4xiLZlr9Hzt7HxcSpIFcnNCUkz6R6dWKa54rUz3HUmI3nVcw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/browserslist"
|
||||
},
|
||||
{
|
||||
"type": "tidelift",
|
||||
"url": "https://tidelift.com/funding/github/npm/caniuse-lite"
|
||||
},
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/ai"
|
||||
}
|
||||
],
|
||||
"license": "CC-BY-4.0"
|
||||
},
|
||||
"node_modules/chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
|
||||
@@ -2230,13 +1746,6 @@
|
||||
"node": ">= 0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/convert-source-map": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
|
||||
"integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/cookie": {
|
||||
"version": "0.7.1",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.1.tgz",
|
||||
@@ -2529,13 +2038,6 @@
|
||||
"integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/electron-to-chromium": {
|
||||
"version": "1.5.152",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.152.tgz",
|
||||
"integrity": "sha512-xBOfg/EBaIlVsHipHl2VdTPJRSvErNUaqW8ejTq5OlOlIYx1wOllCHsAvAIrr55jD1IYEfdR86miUEt8H5IeJg==",
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/emoji-regex": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
|
||||
@@ -3425,16 +2927,6 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/gensync": {
|
||||
"version": "1.0.0-beta.2",
|
||||
"resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
|
||||
"integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/get-caller-file": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
|
||||
@@ -4243,13 +3735,6 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/js-yaml": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
|
||||
@@ -4263,19 +3748,6 @@
|
||||
"js-yaml": "bin/js-yaml.js"
|
||||
}
|
||||
},
|
||||
"node_modules/jsesc": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
|
||||
"integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"jsesc": "bin/jsesc"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/json-buffer": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
|
||||
@@ -4434,16 +3906,6 @@
|
||||
"url": "https://github.com/sponsors/typicode"
|
||||
}
|
||||
},
|
||||
"node_modules/lru-cache": {
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
|
||||
"integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"yallist": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/math-intrinsics": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
|
||||
@@ -4602,13 +4064,6 @@
|
||||
"node": ">= 0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/node-releases": {
|
||||
"version": "2.0.19",
|
||||
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz",
|
||||
"integrity": "sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/object-inspect": {
|
||||
"version": "1.13.4",
|
||||
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
|
||||
@@ -5053,37 +4508,6 @@
|
||||
"node": ">= 0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/react": {
|
||||
"version": "19.1.0",
|
||||
"resolved": "https://registry.npmjs.org/react/-/react-19.1.0.tgz",
|
||||
"integrity": "sha512-FS+XFBNvn3GTAWq26joslQgWNoFu08F4kl0J4CgdNKADkdSGXQyTCnKteIAJy96Br6YbpEU1LSzV5dYtjMkMDg==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-dom": {
|
||||
"version": "19.1.0",
|
||||
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.0.tgz",
|
||||
"integrity": "sha512-Xs1hdnE+DyKgeHJeJznQmYMIBG3TKIHJJT95Q58nHLSrElKlGQqDTR2HQ9fx5CN/Gk6Vh/kupBTDLU11/nDk/g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"scheduler": "^0.26.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^19.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-refresh": {
|
||||
"version": "0.17.0",
|
||||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz",
|
||||
"integrity": "sha512-z6F7K9bV85EfseRCp2bzrpyQ0Gkw1uLoCel9XBVWPg/TjRj94SkJzUTGfOa4bs7iJvBWtQG0Wq7wnI0syw3EBQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/readdirp": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
|
||||
@@ -5760,12 +5184,6 @@
|
||||
"node": ">=14.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/scheduler": {
|
||||
"version": "0.26.0",
|
||||
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.26.0.tgz",
|
||||
"integrity": "sha512-NlHwttCI/l5gCPR3D1nNXtWABUmBwvZpEQiD4IXSbIDq8BzLIK/7Ir5gTFSGZDUu37K5cMNp0hFtzO38sC7gWA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/semver": {
|
||||
"version": "6.3.1",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
|
||||
@@ -6457,37 +5875,6 @@
|
||||
"node": ">= 0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/update-browserslist-db": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.3.tgz",
|
||||
"integrity": "sha512-UxhIZQ+QInVdunkDAaiazvvT/+fXL5Osr0JZlJulepYu6Jd7qJtDZjlur0emRlT71EN3ScPoE7gvsuIKKNavKw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/browserslist"
|
||||
},
|
||||
{
|
||||
"type": "tidelift",
|
||||
"url": "https://tidelift.com/funding/github/npm/browserslist"
|
||||
},
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/ai"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"escalade": "^3.2.0",
|
||||
"picocolors": "^1.1.1"
|
||||
},
|
||||
"bin": {
|
||||
"update-browserslist-db": "cli.js"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"browserslist": ">= 4.21.0"
|
||||
}
|
||||
},
|
||||
"node_modules/uri-js": {
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
|
||||
@@ -6745,13 +6132,6 @@
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/yallist": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
|
||||
"integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/yargs": {
|
||||
"version": "17.7.2",
|
||||
"resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
"name": "masterok",
|
||||
"version": "0.3.0",
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-react": "^4.4.1",
|
||||
"concurrently": "^9.1.2",
|
||||
"eslint": "8.56.0",
|
||||
"eslint-config-airbnb-base": "15.0.0",
|
||||
@@ -27,9 +26,7 @@
|
||||
"dependencies": {
|
||||
"bootstrap": "5.3.3",
|
||||
"bootstrap-icons": "1.11.3",
|
||||
"express": "^4.21.2",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0"
|
||||
"express": "^4.21.2"
|
||||
},
|
||||
"type": "module"
|
||||
}
|
||||
|
||||
@@ -1,145 +0,0 @@
|
||||
import React, { useState, useEffect, useCallback } from 'react';
|
||||
import Header from './components/Header';
|
||||
import Footer from './components/Footer';
|
||||
import ProductList from './components/ProductList';
|
||||
import ProductAddForm from './components/ProductAddForm';
|
||||
import ProductEditForm from './components/ProductEditForm';
|
||||
|
||||
|
||||
const CART_STORAGE_KEY = 'reactMasterokCart';
|
||||
|
||||
function App() {
|
||||
const [products, setProducts] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
const [editingProduct, setEditingProduct] = useState(null);
|
||||
const [sortOrder, setSortOrder] = useState('asc');
|
||||
|
||||
|
||||
const [cart, setCart] = useState(() => {
|
||||
const storedCart = localStorage.getItem(CART_STORAGE_KEY);
|
||||
return storedCart ? JSON.parse(storedCart) : [];
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
localStorage.setItem(CART_STORAGE_KEY, JSON.stringify(cart));
|
||||
}, [cart]);
|
||||
|
||||
const fetchProducts = useCallback(async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const response = await fetch('/api/products');
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const data = await response.json();
|
||||
setProducts(data);
|
||||
setError(null);
|
||||
} catch (e) {
|
||||
setError(e.message);
|
||||
console.error("Failed to fetch products:", e);
|
||||
setProducts([]);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
fetchProducts();
|
||||
}, [fetchProducts]);
|
||||
|
||||
const handleSortByPrice = () => {
|
||||
const sorted = [...products].sort((a, b) => {
|
||||
return sortOrder === 'asc'
|
||||
? a.price - b.price
|
||||
: b.price - a.price;
|
||||
});
|
||||
setProducts(sorted);
|
||||
setSortOrder(sortOrder === 'asc' ? 'desc' : 'asc');
|
||||
};
|
||||
|
||||
const handleProductAdded = useCallback(() => {
|
||||
fetchProducts();
|
||||
}, [fetchProducts]);
|
||||
|
||||
const handleEditProduct = useCallback((product) => {
|
||||
setEditingProduct(product);
|
||||
}, []);
|
||||
|
||||
const handleCloseEditModal = useCallback(() => {
|
||||
setEditingProduct(null);
|
||||
}, []);
|
||||
|
||||
const handleProductUpdated = useCallback(() => {
|
||||
fetchProducts();
|
||||
setEditingProduct(null);
|
||||
}, [fetchProducts]);
|
||||
|
||||
const handleDeleteProduct = useCallback(async (productId) => {
|
||||
if (!window.confirm("Вы уверены, что хотите удалить этот товар?")) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const response = await fetch(`/api/products/${productId}`, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
fetchProducts();
|
||||
} catch (e) {
|
||||
setError(e.message);
|
||||
console.error("Failed to delete product:", e);
|
||||
}
|
||||
}, [fetchProducts]);
|
||||
|
||||
const handleAddToCart = useCallback((productToAdd) => {
|
||||
setCart(prevCart => {
|
||||
const existingItem = prevCart.find(item => item.id === productToAdd.id);
|
||||
if (existingItem) {
|
||||
alert(`${productToAdd.name} уже в корзине!`);
|
||||
return prevCart;
|
||||
} else {
|
||||
alert(`${productToAdd.name} добавлен в корзину!`);
|
||||
return [...prevCart, { ...productToAdd, quantity: 1 }];
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className={`d-flex flex-column min-vh-100 ${editingProduct ? 'modal-open' : ''}`}>
|
||||
<Header cartItemCount={cart.reduce((count, item) => count + item.quantity, 0)} />
|
||||
<main className="flex-grow-1 py-4">
|
||||
<div className="container">
|
||||
<ProductAddForm onProductAdded={handleProductAdded} />
|
||||
<hr className="my-4"/>
|
||||
<h2 className="mb-4">Товары</h2>
|
||||
<button className="btn btn-outline-secondary mb-4" onClick={handleSortByPrice}>
|
||||
Сортировать по цене ({sortOrder === 'asc' ? 'возр.' : 'убыв.'})
|
||||
</button>
|
||||
{loading && <p>Загрузка товаров...</p>}
|
||||
{error && <div className="alert alert-danger">Ошибка: {error} <button onClick={fetchProducts} className='btn btn-sm btn-link'>Попробовать снова</button></div>}
|
||||
{!loading && !error &&
|
||||
<ProductList
|
||||
products={products}
|
||||
onEdit={handleEditProduct}
|
||||
onDelete={handleDeleteProduct}
|
||||
onAddToCart={handleAddToCart}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
</main>
|
||||
<Footer />
|
||||
{editingProduct && (
|
||||
<ProductEditForm
|
||||
product={editingProduct}
|
||||
onProductUpdated={handleProductUpdated}
|
||||
onClose={handleCloseEditModal}
|
||||
/>
|
||||
)}
|
||||
{editingProduct && <div className="modal-backdrop fade show"></div>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
@@ -1,32 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
function Footer() {
|
||||
return (
|
||||
<footer className="bg-dark text-white py-4 mt-auto"> {/* mt-auto for sticky footer with flex */}
|
||||
<div className="container">
|
||||
<div className="row text-center text-md-start">
|
||||
<div className="col-md-6 mb-4 mb-md-0">
|
||||
<h3>Контактная информация</h3>
|
||||
<p>Адрес: г. Ульяновск, ул. Северный венец, д. 32, к. 3</p>
|
||||
<p>Телефон: +7 (999) 99-99-90</p>
|
||||
<p>Email: masterok@mail.ru</p>
|
||||
</div>
|
||||
<div className="col-md-6 text-md-end">
|
||||
<h3>Мы в соцсетях</h3>
|
||||
{/* Assuming images are in public/images or handled via Vite's public directory feature */}
|
||||
<a href="https://t.me/" target="_blank" rel="noopener noreferrer" className="me-2">
|
||||
{/* <img src="/images/tg.png" alt="Telegram" style={{ width: '32px' }} /> */}
|
||||
<i className="bi bi-telegram" style={{ fontSize: '32px' }}></i> {/* Using Bootstrap Icon */}
|
||||
</a>
|
||||
<a href="https://vk.com/" target="_blank" rel="noopener noreferrer">
|
||||
{/* <img src="/images/vk.png" alt="VK" style={{ width: '32px' }} /> */}
|
||||
<i className="bi bi-facebook" style={{ fontSize: '32px' }}></i> {/* Placeholder, use bi-vk if available or custom SVG */}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
|
||||
export default Footer;
|
||||
@@ -1,47 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
// Header now accepts cartItemCount
|
||||
function Header({ cartItemCount }) {
|
||||
return (
|
||||
<header className="custom-header py-3 bg-warning text-white">
|
||||
<div className="container">
|
||||
<nav className="navbar navbar-expand-lg navbar-dark">
|
||||
<div className="container-fluid">
|
||||
<div className="logo d-flex align-items-center">
|
||||
<img src="/images/местерок.png" alt="Логотип МастерОК" className="me-2" style={{ height: '50px' }} />
|
||||
<a href="/" className="text-decoration-none text-black fs-4 fw-bold">МастерОК</a>
|
||||
</div>
|
||||
<button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span className="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div className="collapse navbar-collapse" id="navbarNav">
|
||||
<ul className="navbar-nav ms-auto mb-2 mb-lg-0">
|
||||
<li className="nav-item me-4"><a href="#" className="nav-link text-black">Добавить</a></li>
|
||||
<li className="nav-item dropdown me-4">
|
||||
<a href="#" className="nav-link text-black dropdown-toggle" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
Акции
|
||||
</a>
|
||||
<ul className="dropdown-menu">
|
||||
<li><a className="dropdown-item" href="#">Подарок папе</a></li>
|
||||
<li><a className="dropdown-item" href="#">Супер цены</a></li>
|
||||
<li><a className="dropdown-item" href="#">Постоянным клиентам</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="nav-item me-4"><a href="#" className="nav-link text-black">Контакты</a></li>
|
||||
<li className="nav-item me-4"><a href="#" className="nav-link text-black">Доставка</a></li>
|
||||
<li className="nav-item">
|
||||
<a href="#" className="nav-link text-black">
|
||||
<i className="bi bi-cart"></i> Корзина
|
||||
{cartItemCount > 0 && <span className="badge bg-danger ms-1">{cartItemCount}</span>}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
|
||||
export default Header;
|
||||
@@ -1,153 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
|
||||
function ProductAddForm({ onProductAdded }) {
|
||||
const [name, setName] = useState('');
|
||||
const [price, setPrice] = useState('');
|
||||
const [imageUrl, setImageUrl] = useState('');
|
||||
const [brandId, setBrandId] = useState('');
|
||||
const [categoryId, setCategoryId] = useState('');
|
||||
const [brands, setBrands] = useState([]);
|
||||
const [categories, setCategories] = useState([]);
|
||||
const [error, setError] = useState(null);
|
||||
const [success, setSuccess] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
fetch('/api/brands')
|
||||
.then(res => res.json())
|
||||
.then(setBrands)
|
||||
.catch(console.error);
|
||||
|
||||
fetch('/api/categories')
|
||||
.then(res => res.json())
|
||||
.then(setCategories)
|
||||
.catch(console.error);
|
||||
}, []);
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
setError(null);
|
||||
setSuccess(false);
|
||||
|
||||
const newProduct = {
|
||||
name,
|
||||
price: parseFloat(price),
|
||||
image: imageUrl,
|
||||
brandId,
|
||||
categoryId
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/products', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(newProduct),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const errData = await response.json();
|
||||
throw new Error(errData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
|
||||
setSuccess(true);
|
||||
setName('');
|
||||
setPrice('');
|
||||
setImageUrl('');
|
||||
setBrandId('');
|
||||
setCategoryId('');
|
||||
if (onProductAdded) {
|
||||
onProductAdded();
|
||||
}
|
||||
} catch (err) {
|
||||
setError(err.message);
|
||||
console.error("Failed to add product:", err);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="accordion mb-3" id="addProductAccordion">
|
||||
<div className="accordion-item">
|
||||
<h2 className="accordion-header" id="headingOne">
|
||||
<button
|
||||
className="accordion-button collapsed"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="false"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
Форма добавления товара
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
className="accordion-collapse collapse"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#addProductAccordion"
|
||||
>
|
||||
<div className="accordion-body">
|
||||
{error && <div className="alert alert-danger">{error}</div>}
|
||||
{success && <div className="alert alert-success">Товар успешно добавлен!</div>}
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="productName" className="form-label">Название товара</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="productName"
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="productPrice" className="form-label">Стоимость товара (руб.)</label>
|
||||
<input
|
||||
type="number"
|
||||
className="form-control"
|
||||
id="productPrice"
|
||||
value={price}
|
||||
onChange={(e) => setPrice(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="brandSelect" className="form-label">Бренд</label>
|
||||
<select className="form-select" id="brandSelect" value={brandId} onChange={(e) => setBrandId(e.target.value)} required>
|
||||
<option value="">Выберите бренд</option>
|
||||
{brands.map(brand => (
|
||||
<option key={brand.id} value={brand.id}>{brand.name}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="categorySelect" className="form-label">Категория</label>
|
||||
<select className="form-select" id="categorySelect" value={categoryId} onChange={(e) => setCategoryId(e.target.value)} required>
|
||||
<option value="">Выберите категорию</option>
|
||||
{categories.map(category => (
|
||||
<option key={category.id} value={category.id}>{category.name}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="productImageUrl" className="form-label">URL картинки товара</label>
|
||||
<input
|
||||
type="url"
|
||||
className="form-control"
|
||||
id="productImageUrl"
|
||||
value={imageUrl}
|
||||
onChange={(e) => setImageUrl(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<button type="submit" className="btn btn-primary">Добавить товар</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ProductAddForm;
|
||||
@@ -1,85 +0,0 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
|
||||
function ProductCard({ product, onEdit, onDelete, onAddToCart }) {
|
||||
const imageUrl = product.image ? product.image : 'https://via.placeholder.com/300x200.png?text=No+Image';
|
||||
const regularPrice = parseFloat(product.price);
|
||||
const discountPrice = product.discountPrice ? parseFloat(product.discountPrice) : null;
|
||||
const [brand, setBrand] = useState(null);
|
||||
const [category, setCategory] = useState(null);
|
||||
const isOnSale = discountPrice !== null && discountPrice < regularPrice;
|
||||
useEffect(() => {
|
||||
fetch(`/api/brands/${product.brandId}`)
|
||||
.then(res => res.json())
|
||||
.then(setBrand)
|
||||
.catch(console.error);
|
||||
|
||||
fetch(`/api/categories/${product.categoryId}`)
|
||||
.then(res => res.json())
|
||||
.then(setCategory)
|
||||
.catch(console.error);
|
||||
}, [product]);
|
||||
return (
|
||||
<div className="col">
|
||||
<div className={`card h-100 ${isOnSale ? 'border-danger' : ''}`}>
|
||||
{isOnSale && (
|
||||
<span
|
||||
className="position-absolute top-0 start-0 bg-danger text-white p-1 px-2"
|
||||
style={{ fontSize: '0.8em', borderBottomRightRadius: '0.25rem' }}
|
||||
>
|
||||
Акция!
|
||||
</span>
|
||||
)}
|
||||
<img
|
||||
src={imageUrl}
|
||||
className="card-img-top"
|
||||
alt={product.name}
|
||||
style={{ height: '200px', objectFit: 'cover' }}
|
||||
onError={(e) => { e.target.onerror = null; e.target.src='https://via.placeholder.com/300x200.png?text=Image+Error'; }}
|
||||
/>
|
||||
<div className="card-body d-flex flex-column">
|
||||
<h5 className="card-title">{product.name}</h5>
|
||||
{brand && <p className="card-text"><strong>Бренд:</strong> {brand.name}</p>}
|
||||
{category && <p className="card-text"><strong>Категория:</strong> {category.name}</p>}
|
||||
<div>
|
||||
{isOnSale ? (
|
||||
<>
|
||||
<p className="card-text text-danger fw-bold mb-0" style={{ fontSize: '1.2em' }}>
|
||||
{discountPrice.toFixed(2)} руб.
|
||||
</p>
|
||||
<p className="card-text text-muted text-decoration-line-through" style={{ fontSize: '0.9em' }}>
|
||||
{regularPrice.toFixed(2)} руб.
|
||||
</p>
|
||||
</>
|
||||
) : (
|
||||
<p className="card-text text-warning fw-bold">{regularPrice.toFixed(2)} руб.</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="mt-auto pt-2"> {}
|
||||
<button
|
||||
className="btn btn-warning w-100 mb-2"
|
||||
onClick={() => onAddToCart(product)}
|
||||
>
|
||||
В корзину
|
||||
</button>
|
||||
<div className="d-flex justify-content-between">
|
||||
<button
|
||||
className="btn btn-outline-primary btn-sm"
|
||||
onClick={() => onEdit(product)}
|
||||
>
|
||||
<i className="bi bi-pencil-square"></i> Редактировать
|
||||
</button>
|
||||
<button
|
||||
className="btn btn-outline-danger btn-sm"
|
||||
onClick={() => onDelete(product.id)}
|
||||
>
|
||||
<i className="bi bi-trash"></i> Удалить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ProductCard;
|
||||
@@ -1,153 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
|
||||
function ProductEditForm({ product, onProductUpdated, onClose }) {
|
||||
const [name, setName] = useState('');
|
||||
const [price, setPrice] = useState('');
|
||||
const [imageUrl, setImageUrl] = useState('');
|
||||
const [brandId, setBrandId] = useState('');
|
||||
const [categoryId, setCategoryId] = useState('');
|
||||
const [brands, setBrands] = useState([]);
|
||||
const [categories, setCategories] = useState([]);
|
||||
const [error, setError] = useState(null);
|
||||
const [success, setSuccess] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (product) {
|
||||
setName(product.name || '');
|
||||
setPrice(product.price || '');
|
||||
setImageUrl(product.image || '');
|
||||
setBrandId(product.brandId || '');
|
||||
setCategoryId(product.categoryId || '');
|
||||
setError(null);
|
||||
setSuccess(false);
|
||||
} else {
|
||||
setName('');
|
||||
setPrice('');
|
||||
setImageUrl('');
|
||||
setError(null);
|
||||
setSuccess(false);
|
||||
}
|
||||
fetch('/api/brands').then(res => res.json()).then(setBrands).catch(console.error);
|
||||
fetch('/api/categories').then(res => res.json()).then(setCategories).catch(console.error);
|
||||
}, [product]);
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
setError(null);
|
||||
setSuccess(false);
|
||||
|
||||
if (!product || !product.id) {
|
||||
setError("Товар для редактирования не выбран.");
|
||||
return;
|
||||
}
|
||||
|
||||
const updatedProductData = {
|
||||
name,
|
||||
price: parseFloat(price),
|
||||
image: imageUrl,
|
||||
brandId,
|
||||
categoryId
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/products/${product.id}`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(updatedProductData),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const errData = await response.json();
|
||||
throw new Error(errData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
|
||||
setSuccess(true);
|
||||
if (onProductUpdated) {
|
||||
onProductUpdated();
|
||||
}
|
||||
} catch (err) {
|
||||
setError(err.message);
|
||||
console.error("Failed to update product:", err);
|
||||
}
|
||||
};
|
||||
|
||||
if (!product) return null;
|
||||
|
||||
return (
|
||||
<div className="modal fade show d-block" tabIndex="-1" role="dialog" style={{backgroundColor: 'rgba(0,0,0,0.5)'}}>
|
||||
<div className="modal-dialog modal-dialog-centered" role="document">
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
<h5 className="modal-title">Редактировать товар: {product.name}</h5>
|
||||
<button type="button" className="btn-close" onClick={onClose} aria-label="Close"></button>
|
||||
</div>
|
||||
<div className="modal-body">
|
||||
{error && <div className="alert alert-danger">{error}</div>}
|
||||
{success && <div className="alert alert-success">Товар успешно обновлен!</div>}
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="editProductName" className="form-label">Название товара</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="editProductName"
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="editProductPrice" className="form-label">Стоимость товара (руб.)</label>
|
||||
<input
|
||||
type="number"
|
||||
className="form-control"
|
||||
id="editProductPrice"
|
||||
value={price}
|
||||
onChange={(e) => setPrice(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="editBrand" className="form-label">Бренд</label>
|
||||
<select className="form-select" id="editBrand" value={brandId} onChange={(e) => setBrandId(e.target.value)} required>
|
||||
<option value="">Выберите бренд</option>
|
||||
{brands.map(brand => (
|
||||
<option key={brand.id} value={brand.id}>{brand.name}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="editCategory" className="form-label">Категория</label>
|
||||
<select className="form-select" id="editCategory" value={categoryId} onChange={(e) => setCategoryId(e.target.value)} required>
|
||||
<option value="">Выберите категорию</option>
|
||||
{categories.map(category => (
|
||||
<option key={category.id} value={category.id}>{category.name}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="editProductImageUrl" className="form-label">URL картинки товара</label>
|
||||
<input
|
||||
type="url"
|
||||
className="form-control"
|
||||
id="editProductImageUrl"
|
||||
value={imageUrl}
|
||||
onChange={(e) => setImageUrl(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="modal-footer pb-0">
|
||||
<button type="button" className="btn btn-secondary" onClick={onClose}>Отмена</button>
|
||||
<button type="submit" className="btn btn-primary">Сохранить изменения</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ProductEditForm;
|
||||
@@ -1,24 +0,0 @@
|
||||
import React from 'react';
|
||||
import ProductCard from './ProductCard';
|
||||
|
||||
function ProductList({ products, onEdit, onDelete, onAddToCart }) {
|
||||
if (!products || products.length === 0) {
|
||||
return <p>Товары не найдены.</p>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="row row-cols-1 row-cols-md-3 row-cols-lg-4 g-4">
|
||||
{products.map(product => (
|
||||
<ProductCard
|
||||
key={product.id}
|
||||
product={product}
|
||||
onEdit={onEdit}
|
||||
onDelete={onDelete}
|
||||
onAddToCart={onAddToCart}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ProductList;
|
||||
BIN
MasterOK/src/dist/.DS_Store
vendored
BIN
MasterOK/src/dist/.DS_Store
vendored
Binary file not shown.
@@ -1,31 +0,0 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||
sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||
monospace;
|
||||
}
|
||||
|
||||
|
||||
/* Basic App styling placeholder */
|
||||
.App {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.App-header {
|
||||
background-color: #282c34;
|
||||
min-height: 10vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: calc(10px + 2vmin);
|
||||
color: white;
|
||||
padding: 20px;
|
||||
}
|
||||
@@ -1,16 +1,111 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/png" href="./public/images/местерок.png" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>МастерОК - Интернет магазин инструментов</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>МастерОК - Магазин инструментов</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="styles/style.css">
|
||||
<link href="public/images/местерок.png" rel="shortcut icon">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Instrument+Sans&display=swap" rel="stylesheet">
|
||||
<script type="module" src="scripts/controller.js"></script>
|
||||
<script type="module" src="index.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/main.jsx"></script>
|
||||
<body class="d-flex flex-column min-vh-100">
|
||||
<header class="custom-header py-3">
|
||||
<div class="container">
|
||||
<nav class="navbar navbar-expand-lg navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<div class="logo d-flex align-items-center">
|
||||
<img src="public/images/местерок.png" alt="Логотип МастерОК" class="me-2" style="height: 50px;">
|
||||
<a href="/" class="text-decoration-none text-white fs-4 fw-bold">МастерОК</a>
|
||||
</div>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
|
||||
<li class="nav-item me-4"><a href="add.html" class="nav-link text-white">Добавить</a></li>
|
||||
<li class="nav-item dropdown me-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<a href="sale.html" class="nav-link text-white">Акции</a>
|
||||
<span class="nav-link text-white dropdown-toggle-arrow" data-bs-toggle="dropdown">▾</span>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="#">Подарок папе</a></li>
|
||||
<li><a class="dropdown-item" href="#">Супер цены</a></li>
|
||||
<li><a class="dropdown-item" href="#">Постоянным клиентам</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item me-4"><a href="contacts.html" class="nav-link text-white">Контакты</a></li>
|
||||
<li class="nav-item me-4"><a href="delivery.html" class="nav-link text-white">Доставка</a></li>
|
||||
<li class="nav-item">
|
||||
<a href="basket.html" class="nav-link text-white">
|
||||
<i class="bi bi-cart"></i> Корзина
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
<div class="accordion accordion-flush" id="accordionFlushExample">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-headingOne">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
|
||||
Форма добавления товара
|
||||
</button>
|
||||
</h2>
|
||||
<div id="flush-collapseOne" class="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">
|
||||
<div class="accordion-body">
|
||||
<form id="addProductForm">
|
||||
<div class="mb-3">
|
||||
<label for="productName" class="form-label">Название товара</label>
|
||||
<input type="text" class="form-control" id="productName" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="productPrice" class="form-label">Стоимость товара</label>
|
||||
<input type="number" class="form-control" id="productPrice" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="productImageUrl" class="form-label">URL картинки товара</label>
|
||||
<input type="url" class="form-control" id="productImageUrl" required>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Добавить товар</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<main class="flex-grow-1 py-4">
|
||||
<section class="container">
|
||||
<div class="row row-cols-1 row-cols-md-3 row-cols-lg-4 g-4 product-list">
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<footer class="bg-dark text-white py-4">
|
||||
<div class="container">
|
||||
<div class="row text-center text-md-start">
|
||||
<div class="col-md-6 mb-4 mb-md-0">
|
||||
<h3>Контактная информация</h3>
|
||||
<p>Адрес: г. Ульяновск, ул. Северный венец, д. 32, к. 3</p>
|
||||
<p>Телефон: +7 (999) 99-99-90</p>
|
||||
<p>Email: masterok@mail.ru</p>
|
||||
</div>
|
||||
<div class="col-md-6 text-md-end">
|
||||
<h3>Мы в соцсетях</h3>
|
||||
<a href="https://t.me/" target="_blank" class="me-2">
|
||||
<img src="public/images/tg.png" alt="Telegram" style="width: 32px;">
|
||||
</a>
|
||||
<a href="https://vk.com/" target="_blank">
|
||||
<img src="public/images/vk.png" alt="VK" style="width: 32px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
101
MasterOK/src/index.js
Normal file
101
MasterOK/src/index.js
Normal file
@@ -0,0 +1,101 @@
|
||||
import { addToCart, updateCartDisplay } from './scripts/cart.js';
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
const addToCartButtons = document.querySelectorAll('.btn.btn-primary.add-to-cart-btn');
|
||||
|
||||
const cart = JSON.parse(localStorage.getItem('cart')) || [];
|
||||
|
||||
addToCartButtons.forEach(button => {
|
||||
button.addEventListener('click', addToCart);
|
||||
|
||||
const productId = button.getAttribute('data-id');
|
||||
const isInCart = cart.some(item => item.id === productId);
|
||||
|
||||
if (isInCart) {
|
||||
button.textContent = 'В корзине';
|
||||
button.classList.add('added-to-cart');
|
||||
button.disabled = true;
|
||||
}
|
||||
});
|
||||
|
||||
if (window.location.pathname.includes('basket.html')) {
|
||||
updateCartDisplay();
|
||||
|
||||
const checkoutButton = document.getElementById('checkout-btn');
|
||||
if (checkoutButton) {
|
||||
checkoutButton.addEventListener('click', () => {
|
||||
const cart = JSON.parse(localStorage.getItem('cart')) || [];
|
||||
const totalPrice = cart.reduce((sum, item) => sum + item.price * item.quantity, 0);
|
||||
|
||||
const modalTotalPrice = document.getElementById('modal-total-price');
|
||||
if (modalTotalPrice) {
|
||||
modalTotalPrice.textContent = totalPrice.toFixed(2);
|
||||
}
|
||||
|
||||
const checkoutModal = new bootstrap.Modal(document.getElementById('checkoutModal'));
|
||||
checkoutModal.show();
|
||||
});
|
||||
}
|
||||
const checkoutForm = document.getElementById('checkoutForm');
|
||||
if (checkoutForm) {
|
||||
checkoutForm.addEventListener('submit', (event) => {
|
||||
event.preventDefault();
|
||||
|
||||
const firstName = document.getElementById('firstName').value;
|
||||
const lastName = document.getElementById('lastName').value;
|
||||
const phone = document.getElementById('phone').value;
|
||||
|
||||
if (!firstName || !lastName || !phone) {
|
||||
alert('Пожалуйста, заполните все поля!');
|
||||
return;
|
||||
}
|
||||
|
||||
const order = {
|
||||
firstName,
|
||||
lastName,
|
||||
phone,
|
||||
cart: JSON.parse(localStorage.getItem('cart')) || [],
|
||||
totalPrice: document.getElementById('modal-total-price').textContent
|
||||
};
|
||||
|
||||
console.log('Заказ оформлен:', order);
|
||||
|
||||
localStorage.removeItem('cart');
|
||||
|
||||
const checkoutModal = bootstrap.Modal.getInstance(document.getElementById('checkoutModal'));
|
||||
checkoutModal.hide();
|
||||
|
||||
alert('Заказ успешно оформлен! Спасибо за покупку!');
|
||||
|
||||
updateCartDisplay();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById('addProductForm').addEventListener('submit', function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const productName = document.getElementById('productName').value;
|
||||
const productPrice = document.getElementById('productPrice').value;
|
||||
const productImageUrl = document.getElementById('productImageUrl').value;
|
||||
|
||||
const newProductCard = document.createElement('div');
|
||||
newProductCard.className = 'col';
|
||||
|
||||
newProductCard.innerHTML = `
|
||||
<div class="card h-100">
|
||||
<img src="${productImageUrl}" class="card-img-top" alt="${productName}" width="200" height="300">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">${productName}</h5>
|
||||
<p class="card-text text-warning fw-bold">${productPrice} руб.</p>
|
||||
<button class="btn btn-warning" data-id="${Date.now()}" data-name="${productName}" data-price="${productPrice}">В корзину</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.querySelector('.row.row-cols-1.row-cols-md-3.row-cols-lg-4.g-4').appendChild(newProductCard);
|
||||
|
||||
document.getElementById('addProductForm').reset();
|
||||
});
|
||||
});
|
||||
@@ -1,10 +0,0 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import App from './App.jsx';
|
||||
import './index.css';
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root')).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
);
|
||||
BIN
MasterOK/src/public/.DS_Store
vendored
BIN
MasterOK/src/public/.DS_Store
vendored
Binary file not shown.
@@ -1,9 +1,7 @@
|
||||
import { defineConfig } from "vite";
|
||||
import react from "@vitejs/plugin-react";
|
||||
import { resolve } from "path";
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
root: "src",
|
||||
build: {
|
||||
rollupOptions: {
|
||||
|
||||
BIN
Отчет_4.docx
Normal file
BIN
Отчет_4.docx
Normal file
Binary file not shown.
BIN
Отчет_5.docx
BIN
Отчет_5.docx
Binary file not shown.
Reference in New Issue
Block a user