diff --git a/db_init.js b/db_init.js index bc9daa1..c27bf0d 100644 --- a/db_init.js +++ b/db_init.js @@ -15,9 +15,8 @@ async function initDB() { multipleStatements: true }); - console.log('๐Ÿ”„ DB ์ดˆ๊ธฐํ™” ์‹œ์ž‘ (ํ‘œ์ค€ํ™” ์Šคํ‚ค๋งˆ ์ ์šฉ)...'); + console.log('๐Ÿ”„ DB ์ดˆ๊ธฐํ™” ์‹œ์ž‘ (์˜๋ฌธ ํ‘œ์ค€ ์Šคํ‚ค๋งˆ ์ ์šฉ)...'); - // ๊ธฐ์กด ํ…Œ์ด๋ธ” ์‚ญ์ œ const tablesToDrop = [ 'pc_assets', 'server_assets', 'storage_assets', 'equip_assets', 'mobile_assets', 'sw_sub_assets', 'sw_perm_assets', 'cloud_assets', 'sw_users', 'asset_logs' @@ -26,24 +25,23 @@ async function initDB() { await connection.query(`DROP TABLE IF EXISTS ${table}`); } - // ๊ณตํ†ต ํ•˜๋“œ์›จ์–ด ํ…Œ์ด๋ธ” ์ƒ์„ฑ ํ•จ์ˆ˜ const createHardwareTable = (tableName, comment) => ` CREATE TABLE ${tableName} ( id VARCHAR(50) PRIMARY KEY, - corp VARCHAR(100) COMMENT '๊ตฌ๋งค๋ฒ•์ธ', - asset_code VARCHAR(100) COMMENT '์ž์‚ฐ๋ฒˆํ˜ธ', - purchase_date VARCHAR(50) COMMENT '๊ตฌ๋งค์—ฐ์›”', - type VARCHAR(50) COMMENT '์œ ํ˜•', - detail_purpose VARCHAR(50) COMMENT '์ƒ์„ธ์šฉ๋„', - purpose VARCHAR(255) COMMENT '์šฉ๋„', - details TEXT COMMENT '์ƒ์„ธ๋‚ด์šฉ', - current_org VARCHAR(255) COMMENT 'ํ˜„ ์‚ฌ์šฉ์กฐ์ง', - prev_org VARCHAR(255) COMMENT '์ด์ „ ์‚ฌ์šฉ์กฐ์ง', - location VARCHAR(255) COMMENT '์„ค์น˜์œ„์น˜', - manager_main VARCHAR(100) COMMENT '๋‹ด๋‹น์ž(์ •)', - manager_sub VARCHAR(100) COMMENT '๋‹ด๋‹น์ž(๋ถ€)', - ip_address VARCHAR(100) COMMENT 'IP ์ฃผ์†Œ 1', - remote_tool VARCHAR(100) COMMENT '์›๊ฒฉ๋„๊ตฌ', + corp VARCHAR(100), + asset_code VARCHAR(100), + purchase_date VARCHAR(50), + type VARCHAR(50), + detail_purpose VARCHAR(50), + purpose VARCHAR(255), + details TEXT, + current_org VARCHAR(255), + prev_org VARCHAR(255), + location VARCHAR(255), + manager_main VARCHAR(100), + manager_sub VARCHAR(100), + ip_address VARCHAR(100), + remote_tool VARCHAR(100), server_id VARCHAR(100), server_pw VARCHAR(100), model_name VARCHAR(255), @@ -55,56 +53,53 @@ async function initDB() { storage2 VARCHAR(255), storage3 VARCHAR(255), monitoring VARCHAR(100), - price VARCHAR(100) COMMENT '๊ธˆ์•ก', + price VARCHAR(100), remarks TEXT, - storage_location VARCHAR(255) COMMENT '๋ณด๊ด€์œ„์น˜', - status VARCHAR(50) COMMENT 'ํ˜„์žฌ์ƒํƒœ', + storage_location VARCHAR(255), + status VARCHAR(50), created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP - ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci COMMENT='${comment}'; + ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; `; - await connection.query(createHardwareTable('pc_assets', '๊ฐœ์ธPC ์ž์‚ฐ')); - await connection.query(createHardwareTable('server_assets', '์„œ๋ฒ„ ์ž์‚ฐ')); - await connection.query(createHardwareTable('storage_assets', '์Šคํ† ๋ฆฌ์ง€ ์ž์‚ฐ')); - await connection.query(createHardwareTable('equip_assets', '์ „์‚ฐ๋น„ํ’ˆ ์ž์‚ฐ')); - await connection.query(createHardwareTable('mobile_assets', '๋ชจ๋ฐ”์ผ๊ธฐ๊ธฐ ์ž์‚ฐ')); + await connection.query(createHardwareTable('pc_assets', 'PC')); + await connection.query(createHardwareTable('server_assets', 'Server')); + await connection.query(createHardwareTable('storage_assets', 'Storage')); + await connection.query(createHardwareTable('equip_assets', 'Equipment')); + await connection.query(createHardwareTable('mobile_assets', 'Mobile')); - // ์†Œํ”„ํŠธ์›จ์–ด ๊ตฌ๋… ํ…Œ์ด๋ธ” await connection.query(` CREATE TABLE sw_sub_assets ( id VARCHAR(50) PRIMARY KEY, - corp VARCHAR(100) COMMENT '๊ตฌ๋งค๋ฒ•์ธ', - asset_code VARCHAR(100) COMMENT '์ž์‚ฐ๋ฒˆํ˜ธ', - product_name VARCHAR(255) COMMENT '์ œํ’ˆ๋ช…', - license_type VARCHAR(100) COMMENT '๋ผ์ด์„ ์Šค ์œ ํ˜•', - quantity INT COMMENT '์ˆ˜๋Ÿ‰', - price VARCHAR(100) COMMENT '๊ธˆ์•ก', - purchase_date VARCHAR(50) COMMENT '๊ตฌ๋งค์—ฐ์›”', - expiry_date VARCHAR(50) COMMENT '๋งŒ๋ฃŒ์ผ', - vendor VARCHAR(255) COMMENT '๋‚ฉํ’ˆ์—…์ฒด', - remarks TEXT COMMENT '๋น„๊ณ ', + corp VARCHAR(100), + asset_code VARCHAR(100), + product_name VARCHAR(255), + license_type VARCHAR(100), + quantity INT, + price VARCHAR(100), + purchase_date VARCHAR(50), + expiry_date VARCHAR(50), + vendor VARCHAR(255), + remarks TEXT, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP - ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci; + ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; `); - // ์†Œํ”„ํŠธ์›จ์–ด ์˜๊ตฌ ํ…Œ์ด๋ธ” await connection.query(` CREATE TABLE sw_perm_assets ( id VARCHAR(50) PRIMARY KEY, - corp VARCHAR(100) COMMENT '๊ตฌ๋งค๋ฒ•์ธ', - asset_code VARCHAR(100) COMMENT '์ž์‚ฐ๋ฒˆํ˜ธ', - product_name VARCHAR(255) COMMENT '์ œํ’ˆ๋ช…', - license_key VARCHAR(255) COMMENT '๋ผ์ด์„ ์Šค ํ‚ค', - quantity INT COMMENT '์ˆ˜๋Ÿ‰', - price VARCHAR(100) COMMENT '๊ธˆ์•ก', - purchase_date VARCHAR(50) COMMENT '๊ตฌ๋งค์—ฐ์›”', - vendor VARCHAR(255) COMMENT '๋‚ฉํ’ˆ์—…์ฒด', - remarks TEXT COMMENT '๋น„๊ณ ', + corp VARCHAR(100), + asset_code VARCHAR(100), + product_name VARCHAR(255), + license_key VARCHAR(255), + quantity INT, + price VARCHAR(100), + purchase_date VARCHAR(50), + vendor VARCHAR(255), + remarks TEXT, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP - ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci; + ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; `); - // ํด๋ผ์šฐ๋“œ ์ž์‚ฐ ํ…Œ์ด๋ธ” await connection.query(` CREATE TABLE cloud_assets ( id VARCHAR(50) PRIMARY KEY, @@ -119,25 +114,23 @@ async function initDB() { monthly_fee VARCHAR(100), remarks TEXT, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP - ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci; + ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; `); - // ์†Œํ”„ํŠธ์›จ์–ด ์‚ฌ์šฉ์ž ๋งคํ•‘ ํ…Œ์ด๋ธ” await connection.query(` CREATE TABLE sw_users ( id INT AUTO_INCREMENT PRIMARY KEY, - sw_id VARCHAR(50) COMMENT 'SW ์ž์‚ฐ ID', - corp VARCHAR(100) COMMENT '๋ฒ•์ธ', - dept VARCHAR(100) COMMENT '๋ถ€์„œ', - position VARCHAR(50) COMMENT '์ง์œ„', - user_name VARCHAR(100) COMMENT '์ด๋ฆ„', - usage_period VARCHAR(100) COMMENT '์‚ฌ์šฉ๊ธฐ๊ฐ„', - doc_name VARCHAR(255) COMMENT '์‹ ์ฒญ์„œ๋ช…', + sw_id VARCHAR(50), + corp VARCHAR(100), + dept VARCHAR(100), + position VARCHAR(50), + user_name VARCHAR(100), + usage_period VARCHAR(100), + doc_name VARCHAR(255), created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP - ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci; + ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; `); - // ๋ณ€๊ฒฝ ์ด๋ ฅ ํ…Œ์ด๋ธ” await connection.query(` CREATE TABLE asset_logs ( id VARCHAR(50) PRIMARY KEY, @@ -146,10 +139,10 @@ async function initDB() { log_user VARCHAR(100), details TEXT, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP - ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci; + ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; `); - console.log('โœ… ๋ชจ๋“  ํ…Œ์ด๋ธ”์ด ํ‘œ์ค€ํ™”๋œ ์Šคํ‚ค๋งˆ๋กœ ์žฌ์ƒ์„ฑ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.'); + console.log('โœ… ๋ชจ๋“  ํ…Œ์ด๋ธ”์ด ์˜๋ฌธ ํ‘œ์ค€ ์Šคํ‚ค๋งˆ๋กœ ์žฌ์ƒ์„ฑ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.'); await connection.end(); } diff --git a/index.html b/index.html index 08a1f5e..d6f5132 100644 --- a/index.html +++ b/index.html @@ -10,7 +10,6 @@ - @@ -20,7 +19,7 @@
- -
-

์‹œ์Šคํ…œ ๊ธฐ๋ณธ ์‚ฌ์šฉ๋ฒ•

- - - - - - - - - - -
๊ธฐ๋Šฅ๋ฐฉ๋ฒ•
์ž์‚ฐ ์กฐํšŒ์ƒ๋‹จ ๋„ค๋น„๊ฒŒ์ด์…˜์—์„œ ์นดํ…Œ๊ณ ๋ฆฌ(ํ•˜๋“œ์›จ์–ด/์†Œํ”„ํŠธ์›จ์–ด) ์„ ํƒ โ†’ ํ•˜์œ„ ํƒญ์—์„œ ์ž์‚ฐ์œ ํ˜• ์„ ํƒ
์ž์‚ฐ ๋“ฑ๋ก[์ž์‚ฐ์ถ”๊ฐ€] ๋ฒ„ํŠผ ํด๋ฆญ โ†’ ์–‘์‹ ์ž…๋ ฅ โ†’ ์ €์žฅ
์ž์‚ฐ ์ˆ˜์ •ํ…Œ์ด๋ธ”์—์„œ ํ–‰ ํด๋ฆญ โ†’ ๋ชจ๋‹ฌ์—์„œ [์ˆ˜์ •] โ†’ ๋‚ด์šฉ ๋ณ€๊ฒฝ โ†’ ์ €์žฅ
์—‘์…€ ์—…๋กœ๋“œ[์—…๋กœ๋“œ] ๋ฒ„ํŠผ โ†’ ์–‘์‹์— ๋งž๋Š” .xlsx ํŒŒ์ผ ์„ ํƒ โ†’ ์ž๋™ ์ผ๊ด„ ๋“ฑ๋ก
์—‘์…€ ๋‹ค์šด๋กœ๋“œ[์—‘์…€์ €์žฅ] ๋ฒ„ํŠผ โ†’ ์ „์ฒด ์ž์‚ฐ ๋ฐ์ดํ„ฐ Excel ํŒŒ์ผ๋กœ ์ €์žฅ
์–‘์‹ ๋‹ค์šด๋กœ๋“œ[์–‘์‹] ๋ฒ„ํŠผ โ†’ ์—‘์…€ ์—…๋กœ๋“œ์šฉ ๋นˆ ์–‘์‹ ๋‹ค์šด๋กœ๋“œ
-
` }, { @@ -100,42 +85,8 @@ const GUIDE_TABS: GuideTabConfig[] = [
์šด์˜ ๊ด€๋ฆฌ

OS ์—…๋ฐ์ดํŠธ, ๋ณด์•ˆ ์ ๊ฒ€, ํ’ˆ์˜์„œ ๊ด€๋ฆฌ

- -
-
- 5 -
๊ต์ฒด/๋ฐ˜๋‚ฉ

๋…ธํ›„ ์žฅ๋น„ ํšŒ์ˆ˜, ๋ฐ์ดํ„ฐ ์†Œ๊ฑฐ, ์‹ ๊ทœ ์žฅ๋น„ ์ง€๊ธ‰

-
- -
- 6 -
ํ๊ธฐ ์ฒ˜๋ฆฌ

ํ๊ธฐ ๋Œ€์žฅ ๋“ฑ๋ก, ๋ฌผ๋ฆฌ์  ํŒŒ๊ธฐ ๋˜๋Š” ๋งค๊ฐ

-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…๊ด€๋ฆฌ ์ฃผ๊ธฐ
๊ตฌ๋งค๋ฒ•์ธ์ž์‚ฐ์„ ๊ตฌ๋งคํ•œ ๋ฒ•์ธ๋“ฑ๋ก ์‹œ 1ํšŒ
ํ˜„ ์‚ฌ์šฉ์กฐ์งํ˜„์žฌ ์ž์‚ฐ์„ ์‚ฌ์šฉํ•˜๋Š” ์กฐ์ง/๋ถ€์„œ์ธ์‚ฌ ๋ณ€๋™ ์‹œ
์ž์‚ฐ์ฝ”๋“œ์‚ฌ๋‚ด ๊ณ ์œ  ์ž์‚ฐ ์‹๋ณ„ ๋ฒˆํ˜ธ๋“ฑ๋ก ์‹œ 1ํšŒ
์‚ฌ์šฉ์ž์ž์‚ฐ์„ ์‹ค์ œ ์‚ฌ์šฉํ•˜๋Š” ์ง์›๋ช…์ธ์‚ฌ ๋ณ€๋™ ์‹œ
์œ„์น˜์ž์‚ฐ์ด ์‹ค์ œ ์„ค์น˜๋œ ๊ฑด๋ฌผ/์ธต/์ขŒ์„์ด๋™ ์‹œ ์ฆ‰์‹œ
CPU / RAM / Storageํ•˜๋“œ์›จ์–ด ์‚ฌ์–‘ ์ •๋ณด๋“ฑ๋ก/์ฆ์„ค ์‹œ
๊ตฌ๋งค์ผ์žฅ๋น„ ๊ตฌ๋งค ์ผ์ž๋“ฑ๋ก ์‹œ 1ํšŒ
๊ธˆ์•ก๊ตฌ๋งค ๋น„์šฉ๋“ฑ๋ก ์‹œ 1ํšŒ
ํ’ˆ์˜์„œ๊ตฌ๋งค ์ฆ๋น™ ์ฒจ๋ถ€ ํŒŒ์ผ๋“ฑ๋ก ์‹œ 1ํšŒ
-
- -
- ๐Ÿ’ก ํŒ: PC ๊ต์ฒด ์‹œ ๊ธฐ์กด ์žฅ๋น„์˜ ์ƒํƒœ๋ฅผ '๋ฐ˜๋‚ฉ'์œผ๋กœ ๋ณ€๊ฒฝํ•˜๊ณ , ์‹ ๊ทœ ์žฅ๋น„๋ฅผ ์ƒˆ๋กœ ๋“ฑ๋กํ•˜์—ฌ ์ด๋ ฅ์„ ๋ถ„๋ฆฌ ๊ด€๋ฆฌํ•˜์„ธ์š”. -
` }, { @@ -168,382 +119,8 @@ const GUIDE_TABS: GuideTabConfig[] = [
์šด์˜ ๊ด€๋ฆฌ

๋ชจ๋‹ˆํ„ฐ๋ง, ํŒจ์น˜ ์ ์šฉ, ์žฅ์•  ๋Œ€์‘

- -
-
- 4 -
์ •๊ธฐ ์ ๊ฒ€

๋ณด์•ˆ ์ทจ์•ฝ์  ์ ๊ฒ€, ์„ฑ๋Šฅ ํ™•์ธ, ๋ฐฑ์—… ๊ฒ€์ฆ

-
- -
- 5 -
ํ๊ธฐ/๊ต์ฒด

๋ฐ์ดํ„ฐ ๋งˆ์ด๊ทธ๋ ˆ์ด์…˜ ํ›„ ์žฅ๋น„ ๊ต์ฒด ๋˜๋Š” ํ๊ธฐ

-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…๊ด€๋ฆฌ ์ฃผ๊ธฐ
๊ตฌ๋งค๋ฒ•์ธ / ํ˜„ ์‚ฌ์šฉ์กฐ์ง๋ฒ•์ธ ๋ฐ ์กฐ์ง ์ •๋ณด๋“ฑ๋ก / ๋ณ€๋™ ์‹œ
์ž์‚ฐ๋ฒˆํ˜ธ์„œ๋ฒ„ ์‹๋ณ„ ๋ฒˆํ˜ธ๋“ฑ๋ก ์‹œ 1ํšŒ
์šฉ๋„ / ์ƒ์„ธ์„œ๋ฒ„์˜ ์—ญํ• ๊ณผ ์ƒ์„ธ ์„ค๋ช…๋ณ€๊ฒฝ ์‹œ
์„ค์น˜์œ„์น˜๋ฐ์ดํ„ฐ์„ผํ„ฐ, ๋ž™ ๋ฒˆํ˜ธ, ์œ ๋‹› ์œ„์น˜์ด์ „ ์‹œ
๋‹ด๋‹น์ž (์ •/๋ถ€)๊ด€๋ฆฌ ๋‹ด๋‹น์ž ์ •๋ณด๋ณ€๋™ ์‹œ
IP์ฃผ์†Œ์„œ๋ฒ„ ๋„คํŠธ์›Œํฌ ์ฃผ์†Œ (์ตœ๋Œ€ 2๊ฐœ)๋ณ€๊ฒฝ ์‹œ
๋ชจ๋ธ๋ช…์„œ๋ฒ„ ํ•˜๋“œ์›จ์–ด ๋ชจ๋ธ๋“ฑ๋ก ์‹œ
OS์šด์˜์ฒด์ œ ์ข…๋ฅ˜ ๋ฐ ๋ฒ„์ „์—…๋ฐ์ดํŠธ ์‹œ
CPU / RAM / Storage์„œ๋ฒ„ ์‚ฌ์–‘ ์ •๋ณด์ฆ์„ค ์‹œ
-
- -
- โš ๏ธ ์ฃผ์˜: ์„œ๋ฒ„ ํ๊ธฐ ์ „์—๋Š” ๋ฐ˜๋“œ์‹œ ๋ฐ์ดํ„ฐ ๋งˆ์ด๊ทธ๋ ˆ์ด์…˜๊ณผ ๋ฐฑ์—… ๊ฒ€์ฆ์„ ์™„๋ฃŒํ•˜๊ณ , ๊ด€๋ จ ์„œ๋น„์Šค์˜ DNS/IP ๋ณ€๊ฒฝ ์—ฌ๋ถ€๋ฅผ ํ™•์ธํ•˜์„ธ์š”. -
- ` - }, - { - id: 'storage', - label: '๐Ÿ’พ ์Šคํ† ๋ฆฌ์ง€', - content: ` -
-

์Šคํ† ๋ฆฌ์ง€ ๊ด€๋ฆฌ ๊ฐ€์ด๋“œ

-

- NAS, SAN, DAS ๋“ฑ ์Šคํ† ๋ฆฌ์ง€ ์žฅ๋น„์— ๋Œ€ํ•œ ์ž์‚ฐ ๊ด€๋ฆฌ์ž…๋‹ˆ๋‹ค. ์ €์žฅ ์šฉ๋Ÿ‰์˜ ํšจ์œจ์  ์šด์šฉ๊ณผ ๋ฐ์ดํ„ฐ ์•ˆ์ „์„ฑ ํ™•๋ณด๊ฐ€ ํ•ต์‹ฌ์ž…๋‹ˆ๋‹ค. -

-
- -
-

๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค

-
-
-
- 1 -
์šฉ๋Ÿ‰ ์‚ฐ์ •

ํ˜„์žฌ ์‚ฌ์šฉ๋Ÿ‰ ๋ถ„์„ ๋ฐ ์ฆ์„ค ํ•„์š” ์—ฌ๋ถ€ ํŒ๋‹จ

-
- -
- 2 -
๋„์ž…/์„ค์น˜

์Šคํ† ๋ฆฌ์ง€ ๊ตฌ๋งค โ†’ ์„ค์น˜ โ†’ ๋„คํŠธ์›Œํฌ ์—ฐ๊ฒฐ

-
- -
- 3 -
์šด์˜ ๊ด€๋ฆฌ

์šฉ๋Ÿ‰ ๋ชจ๋‹ˆํ„ฐ๋ง, RAID ์ƒํƒœ ์ ๊ฒ€, ๋ฐฑ์—… ์Šค์ผ€์ค„

-
-
-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…
๊ตฌ๋งค๋ฒ•์ธ / ํ˜„ ์‚ฌ์šฉ์กฐ์ง๋ฒ•์ธ ๋ฐ ์กฐ์ง ์ •๋ณด
์ž์‚ฐ๋ฒˆํ˜ธ์Šคํ† ๋ฆฌ์ง€ ์‹๋ณ„ ๋ฒˆํ˜ธ
์šฉ๋„ / ์ƒ์„ธ์Šคํ† ๋ฆฌ์ง€ ์‚ฌ์šฉ ๋ชฉ์ ๊ณผ ์„ธ๋ถ€ ์„ค๋ช…
์„ค์น˜์œ„์น˜๋ฐ์ดํ„ฐ์„ผํ„ฐ ๋‚ด ๋ฌผ๋ฆฌ์  ์œ„์น˜
๋‹ด๋‹น์ž (์ •/๋ถ€)๊ด€๋ฆฌ ๋‹ด๋‹น์ž ์ •๋ณด
๋ชจ๋ธ๋ช…์Šคํ† ๋ฆฌ์ง€ ํ•˜๋“œ์›จ์–ด ๋ชจ๋ธ
Storage์ด ์šฉ๋Ÿ‰ ๋ฐ ๋””์Šคํฌ ๊ตฌ์„ฑ ์ •๋ณด
-
- -
- ๐Ÿ’ก ํŒ: ์Šคํ† ๋ฆฌ์ง€ ์šฉ๋Ÿ‰์ด 80%๋ฅผ ์ดˆ๊ณผํ•˜๋ฉด ์ฆ์„ค์„ ๊ฒ€ํ† ํ•˜์„ธ์š”. ๋น„๊ณ ๋ž€์— ์šฉ๋Ÿ‰ ๋ณ€๊ฒฝ ์ด๋ ฅ์„ ๊ธฐ๋กํ•˜๋ฉด ์ถ”์ ์— ์œ ์šฉํ•ฉ๋‹ˆ๋‹ค. -
- ` - }, - { - id: 'equip', - label: '๐Ÿ”Œ ์ „์‚ฐ๋น„ํ’ˆ', - content: ` -
-

์ „์‚ฐ๋น„ํ’ˆ ๊ด€๋ฆฌ ๊ฐ€์ด๋“œ

-

- ๋ชจ๋‹ˆํ„ฐ, ํ”„๋ฆฐํ„ฐ, ๋„คํŠธ์›Œํฌ ์žฅ๋น„(์Šค์œ„์น˜, AP), UPS, CPU, GPU, RAM, HDD ๋“ฑ IT ๊ด€๋ จ ๋ถ€์†์žฅ๋น„๋ฅผ ๊ด€๋ฆฌํ•ฉ๋‹ˆ๋‹ค. -

-
- -
-

๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค

-
-
-
- 1 -
๊ตฌ๋งค/์ž…๊ณ 

์†Œ๋ชจํ’ˆ ๋ฐ ์žฅ๋น„ ๊ตฌ๋งค โ†’ ์ž…๊ณ  ํ™•์ธ

-
- -
- 2 -
๋“ฑ๋ก/๋ฐฐ์น˜

์ž์‚ฐ์ฝ”๋“œ ๋ถ€์—ฌ โ†’ ์œ ํ˜• ์ง€์ • โ†’ ๊ด€๋ฆฌ์ž ๋ฐฐ์ •

-
- -
- 3 -
์œ ์ง€๋ณด์ˆ˜

๊ณ ์žฅ ์ˆ˜๋ฆฌ, ์†Œ๋ชจํ’ˆ ๊ต์ฒด, ์ƒํƒœ ์ ๊ฒ€

-
- -
- 4 -
ํ๊ธฐ

๋…ธํ›„ํ™” ์‹œ ํ๊ธฐ ์ฒ˜๋ฆฌ ๋ฐ ๋Œ€์žฅ ๊ธฐ๋ก

-
-
-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…
๊ตฌ๋งค๋ฒ•์ธ / ํ˜„ ์‚ฌ์šฉ์กฐ์ง๋ฒ•์ธ ๋ฐ ์กฐ์ง ์ •๋ณด
์œ ํ˜•๋น„ํ’ˆ ๋ถ„๋ฅ˜ (CPU, GPU, RAM, HDD, ํƒœ๋ธ”๋ฆฟ ๋“ฑ)
์ž์‚ฐ๋ฒˆํ˜ธ๋น„ํ’ˆ ๊ณ ์œ  ์‹๋ณ„ ๋ฒˆํ˜ธ
๋ชจ๋ธ๋ช…๋น„ํ’ˆ ํ•˜๋“œ์›จ์–ด ๋ชจ๋ธ
๊ด€๋ฆฌ์ž๋น„ํ’ˆ ๊ด€๋ฆฌ ๋‹ด๋‹น์ž
๊ตฌ๋งค์ผ๋น„ํ’ˆ ๊ตฌ๋งค ์ผ์ž
๊ธˆ์•ก๊ตฌ๋งค ๋น„์šฉ
-
- ` - }, - { - id: 'mobile', - label: '๐Ÿ“ฑ ๋ชจ๋ฐ”์ผ๊ธฐ๊ธฐ', - content: ` -
-

๋ชจ๋ฐ”์ผ๊ธฐ๊ธฐ ๊ด€๋ฆฌ ๊ฐ€์ด๋“œ

-

- ์—…๋ฌด์šฉ ์Šค๋งˆํŠธํฐ, ํƒœ๋ธ”๋ฆฟ ๋“ฑ ๋ชจ๋ฐ”์ผ ๊ธฐ๊ธฐ์˜ ์ง€๊ธ‰ ๋ฐ ํšŒ์ˆ˜๋ฅผ ๊ด€๋ฆฌํ•ฉ๋‹ˆ๋‹ค. -

-
- -
-

๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค

-
-
-
- 1 -
๊ธฐ๊ธฐ ๊ตฌ๋งค

ํ†ต์‹ ์‚ฌ ๊ณ„์•ฝ, ๊ธฐ๊ธฐ ์„ ์ •, ๊ตฌ๋งค

-
- -
- 2 -
๋“ฑ๋ก/์ง€๊ธ‰

์ž์‚ฐ๋ฒˆํ˜ธ ๋ถ€์—ฌ, ๊ด€๋ฆฌ์ž ์ง€์ •, ์‚ฌ์šฉ์ž ์ง€๊ธ‰

-
- -
- 3 -
์šด์˜

OS ์—…๋ฐ์ดํŠธ, ์•ฑ ๊ด€๋ฆฌ

-
- -
- 4 -
ํšŒ์ˆ˜/๊ต์ฒด

ํ‡ด์ง/๊ต์ฒด ์‹œ ๊ธฐ๊ธฐ ํšŒ์ˆ˜, ์ดˆ๊ธฐํ™”

-
-
-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…
๊ตฌ๋งค๋ฒ•์ธ / ํ˜„ ์‚ฌ์šฉ์กฐ์ง๋ฒ•์ธ ๋ฐ ์กฐ์ง ์ •๋ณด
์œ ํ˜•๊ธฐ๊ธฐ ๋ถ„๋ฅ˜ (๋ชจ๋ฐ”์ผ, ํƒœ๋ธ”๋ฆฟ ๋“ฑ)
์ž์‚ฐ๋ฒˆํ˜ธ๊ธฐ๊ธฐ ๊ณ ์œ  ์‹๋ณ„ ๋ฒˆํ˜ธ
๋ชจ๋ธ๋ช…๊ธฐ๊ธฐ ๋ชจ๋ธ (์˜ˆ: Galaxy S24, iPad Pro)
๊ด€๋ฆฌ์ž๊ธฐ๊ธฐ๋ฅผ ๊ด€๋ฆฌํ•˜๋Š” ๋‹ด๋‹น์ž
๊ตฌ๋งค์ผ๊ธฐ๊ธฐ ๊ตฌ๋งค ์ผ์ž
๊ธˆ์•ก๊ตฌ๋งค ๋น„์šฉ
-
- -
- โš ๏ธ ์ฃผ์˜: ๋ชจ๋ฐ”์ผ๊ธฐ๊ธฐ ํšŒ์ˆ˜ ์‹œ ๋ฐ˜๋“œ์‹œ ๊ณต์žฅ์ดˆ๊ธฐํ™”๋ฅผ ์ˆ˜ํ–‰ํ•˜์„ธ์š”. -
- ` - }, - { - id: 'sub-sw', - label: '๐Ÿ”„ ๊ตฌ๋…SW', - content: ` -
-

๊ตฌ๋…ํ˜• ์†Œํ”„ํŠธ์›จ์–ด ๊ด€๋ฆฌ ๊ฐ€์ด๋“œ

-

- ์›”๊ฐ„/์—ฐ๊ฐ„ ๊ตฌ๋… ๋ฐฉ์‹์˜ ์†Œํ”„ํŠธ์›จ์–ด(SaaS)๋ฅผ ๊ด€๋ฆฌํ•ฉ๋‹ˆ๋‹ค. ๋งŒ๋ฃŒ์ผ ๊ด€๋ฆฌ์™€ ๋ผ์ด์„ ์Šค ์ตœ์ ํ™”๊ฐ€ ํ•ต์‹ฌ์ž…๋‹ˆ๋‹ค. -

-
- -
-

๊ฐฑ์‹  ํ”„๋กœ์„ธ์Šค

-
-
-
-
!
-
๋งŒ๋ฃŒ ์•Œ๋ฆผ ํ™•์ธ

๋Œ€์‹œ๋ณด๋“œ์—์„œ ๋งŒ๋ฃŒ ์˜ˆ์ • ์ž์‚ฐ ๋ชฉ๋ก ํ™•์ธ

-
- -
- A -
์ˆ˜์š”์กฐ์‚ฌ

์‹ค์ œ ์‚ฌ์šฉ์ž ํŒŒ์•…, ๋ถˆํ•„์š” ๋ผ์ด์„ ์Šค ์ •๋ฆฌ

-
-
- -
-
- B -
๊ณ„์•ฝ ์—ฐ์žฅ

๊ณต๊ธ‰์‚ฌ์— ๊ฐฑ์‹  ์š”์ฒญ, ์ˆ˜๋Ÿ‰/๊ธˆ์•ก ํ™•์ •, ๊ฒฐ์ œ

-
- -
-
โœ“
-
์‹œ์Šคํ…œ ์—…๋ฐ์ดํŠธ

์‹œ์ž‘์ผ/๋งŒ๋ฃŒ์ผ ๊ฐฑ์‹ , ๊ฐฑ์‹  ์ด๋ ฅ ์ž๋™ ๊ธฐ๋ก

-
-
-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…๊ด€๋ฆฌ ์ฃผ๊ธฐ
์ƒํƒœ์‚ฌ์šฉ์ค‘ / ๋งŒ๋ฃŒ (๋งŒ๋ฃŒ์ผ ๊ธฐ์ค€ ์ž๋™ ํŒ๋ณ„)์ž๋™
๋ถ„์•ผ์—…๋ฌด๊ณตํ†ต, ๊ฐœ๋ฐœS/W, ๋””์ž์ธ, ์„ค๊ณ„S/W ๋“ฑ๋“ฑ๋ก ์‹œ
๋ฒ•์ธ / ๋ถ€์„œ๊ตฌ๋งค ๋ฒ•์ธ ๋ฐ ์‚ฌ์šฉ ๋ถ€์„œ๋“ฑ๋ก ์‹œ
์ œํ’ˆ๋ช…์†Œํ”„ํŠธ์›จ์–ด ์ œํ’ˆ๋ช…๋“ฑ๋ก ์‹œ
๊ตฌ๋งค์ผ์ตœ์ดˆ ๊ตฌ๋งค ์ผ์ž๋“ฑ๋ก ์‹œ
์‹œ์ž‘์ผ / ๋งŒ๋ฃŒ์ผ๊ตฌ๋… ๊ณ„์•ฝ ๊ธฐ๊ฐ„๊ฐฑ์‹  ์‹œ ์—…๋ฐ์ดํŠธ
๊ธˆ์•ก์—ฐ๊ฐ„/์›”๊ฐ„ ๊ตฌ๋… ๋น„์šฉ๊ฐฑ์‹  ์‹œ
์ˆ˜๋Ÿ‰ / ์‚ฌ์šฉ๊ฐ€๋Šฅ๊ตฌ๋งค ์ˆ˜๋Ÿ‰ ๋Œ€๋น„ ๋ฐฐ์ • ํ›„ ์ž”์—ฌ ์ˆ˜๋Ÿ‰๋ฐฐ์ • ์‹œ
-
- -
- ๐Ÿ’ก ํŒ: ๋Œ€์‹œ๋ณด๋“œ์˜ ๋งŒ๋ฃŒ ์˜ˆ์ • ์œ„์ ฏ์„ ์ •๊ธฐ์ ์œผ๋กœ ํ™•์ธํ•˜์„ธ์š”. ๊ธฐ๊ฐ„ ๋ณ€๊ฒฝ ์‹œ ๊ฐฑ์‹  ์ด๋ ฅ์ด ์ž๋™์œผ๋กœ ๊ธฐ๋ก๋ฉ๋‹ˆ๋‹ค. -
- ` - }, - { - id: 'perm-sw', - label: '๐Ÿ”‘ ์˜๊ตฌSW', - content: ` -
-

์˜๊ตฌ ๋ผ์ด์„ ์Šค ์†Œํ”„ํŠธ์›จ์–ด ๊ด€๋ฆฌ ๊ฐ€์ด๋“œ

-

- 1ํšŒ ๊ตฌ๋งค๋กœ ์˜๊ตฌ์ ์œผ๋กœ ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•œ ์†Œํ”„ํŠธ์›จ์–ด์ž…๋‹ˆ๋‹ค. ๋ผ์ด์„ ์Šค ํ‚ค ๊ด€๋ฆฌ ๋ฐ ์„ค์น˜ ํ˜„ํ™ฉ ์ถ”์ ์ด ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค. -

-
- -
-

๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค

-
-
-
- 1 -
๊ตฌ๋งค/๋„์ž…

๋ผ์ด์„ ์Šค ๊ตฌ๋งค โ†’ ํ‚ค ์ˆ˜๋ น โ†’ ์‹œ์Šคํ…œ ๋“ฑ๋ก

-
- -
- 2 -
๋ฐฐํฌ/์„ค์น˜

๋Œ€์ƒ PC์— ์„ค์น˜ โ†’ ์‚ฌ์šฉ์ž ๊ด€๋ฆฌ์—์„œ ๋งคํ•‘

-
- -
- 3 -
ํ˜„ํ™ฉ ๊ด€๋ฆฌ

์ž”์—ฌ ์ˆ˜๋Ÿ‰ ํ™•์ธ, ์‚ฌ์šฉ๊ฐ€๋Šฅ ์ˆ˜๋Ÿ‰ ์ถ”์ 

-
-
-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…
์ƒํƒœ์œ ์ง€๋ณด์ˆ˜ ์œ ํšจ / ์—†์Œ
๋ถ„์•ผ์—…๋ฌด๊ณตํ†ต, ๊ฐœ๋ฐœS/W, ๋””์ž์ธ, ์„ค๊ณ„S/W ๋“ฑ
๋ฒ•์ธ / ๋ถ€์„œ๊ตฌ๋งค ๋ฒ•์ธ ๋ฐ ์‚ฌ์šฉ ๋ถ€์„œ
์ œํ’ˆ๋ช…์†Œํ”„ํŠธ์›จ์–ด ์ œํ’ˆ๋ช…
๊ตฌ๋งค์ผ์ตœ์ดˆ ๊ตฌ๋งค ์ผ์ž
์‹œ์ž‘์ผ / ๋งŒ๋ฃŒ์ผ์œ ์ง€๋ณด์ˆ˜ ๊ณ„์•ฝ ๊ธฐ๊ฐ„ (ํ•ด๋‹น ์‹œ)
๊ธˆ์•ก๋ผ์ด์„ ์Šค ๊ตฌ๋งค ๋น„์šฉ
์ˆ˜๋Ÿ‰ / ์‚ฌ์šฉ๊ฐ€๋Šฅ๋ณด์œ  ๋ผ์ด์„ ์Šค ๋Œ€๋น„ ์ž”์—ฌ ์ˆ˜๋Ÿ‰
-
- -
- โš ๏ธ ์ฃผ์˜: ์˜๊ตฌ ๋ผ์ด์„ ์Šค๋„ ๋ณด์œ  ์ˆ˜๋Ÿ‰์„ ์ดˆ๊ณผํ•˜์—ฌ ์„ค์น˜ํ•˜๋ฉด ์ €์ž‘๊ถŒ ์œ„๋ฐ˜์ด ๋ฉ๋‹ˆ๋‹ค. [์‚ฌ์šฉ์ž ๊ด€๋ฆฌ] ๋ฒ„ํŠผ์„ ํ†ตํ•ด ์‹ค์ œ ๋ฐฐ์ • ํ˜„ํ™ฉ์„ ํŒŒ์•…ํ•˜์„ธ์š”. -
- ` - }, - { - id: 'cloud', - label: 'โ˜๏ธ ํด๋ผ์šฐ๋“œ', - content: ` -
-

ํด๋ผ์šฐ๋“œ ์„œ๋น„์Šค ๊ด€๋ฆฌ ๊ฐ€์ด๋“œ

-

- AWS, Azure, GCP ๋“ฑ ํด๋ผ์šฐ๋“œ ์ธํ”„๋ผ ์„œ๋น„์Šค์™€ Notion, Slack ๋“ฑ SaaS ์„œ๋น„์Šค๋ฅผ ๊ด€๋ฆฌํ•ฉ๋‹ˆ๋‹ค. ๋น„์šฉ ์ตœ์ ํ™”์™€ ๊ณ„์ • ๊ด€๋ฆฌ๊ฐ€ ํ•ต์‹ฌ์ž…๋‹ˆ๋‹ค. -

-
- -
-

๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค

-
-
-
- 1 -
์„œ๋น„์Šค ๋„์ž…

์„œ๋น„์Šค ์„ ์ •, ๋น„์šฉ ์‚ฐ์ •, ๊ณ„์ • ์ƒ์„ฑ

-
- -
- 2 -
๋“ฑ๋ก/์„ค์ •

์‹œ์Šคํ…œ ๋“ฑ๋ก, ๊ฒฐ์ œ์ˆ˜๋‹จ ์„ค์ •, ๊ด€๋ฆฌ์ž ๋ฐฐ์ •

-
- -
- 3 -
์šด์˜/๋น„์šฉ๊ด€๋ฆฌ

์›”๋ณ„ ์ฒญ๊ตฌ์•ก ์ถ”์ , ๊ณ„์ • ๊ด€๋ฆฌ, ๊ฐฑ์‹ 

-
-
-
-
- -
-

์ฃผ์š” ๊ด€๋ฆฌ ํ•ญ๋ชฉ (ํ…Œ์ด๋ธ” ์ปฌ๋Ÿผ)

- - - - - - - - - - - - -
ํ•ญ๋ชฉ์„ค๋ช…
ํ”Œ๋žซํผ๋ช…ํด๋ผ์šฐ๋“œ ํ”Œ๋žซํผ ์ด๋ฆ„ (์˜ˆ: AWS, Azure)
๋ฒ•์ธ / ๋‹ด๋‹น๋ถ€์„œ์„œ๋น„์Šค ์†Œ์† ๋ฒ•์ธ ๋ฐ ๊ด€๋ฆฌ ๋ถ€์„œ
์ง„ํ–‰ ํ”„๋กœ์ ํŠธ (์‚ฌ์šฉ์šฉ๋„)์„œ๋น„์Šค ์‚ฌ์šฉ ๋ชฉ์ 
๊ณ„์ •๋ช… (๊ด€๋ฆฌ์ž)๊ด€๋ฆฌ์ž ๊ณ„์ • ๋˜๋Š” ๋ฃจํŠธ ๊ณ„์ • ์ •๋ณด
๊ฒฐ์ œ์ˆ˜๋‹จ๋ฒ•์ธ์นด๋“œ ๋˜๋Š” ์ธ๋ณด์ด์Šค(์›”๋ณ„์†ก๊ธˆ)
๊ฒฐ์ œ์ผ์›” ๊ฒฐ์ œ์ผ
๋‹น์›” ์ฒญ๊ตฌ์•ก์ด๋ฒˆ ๋‹ฌ ๊ฒฐ์ œ ๊ธˆ์•ก
๋น„๊ณ ์ถ”๊ฐ€ ๋ฉ”๋ชจ ๋ฐ ๋ณ€๊ฒฝ ์ด๋ ฅ
-
- -
- ๐Ÿ’ก ํŒ: ํด๋ผ์šฐ๋“œ ๋น„์šฉ์€ ๋งค์›” ๋ณ€๋™๋  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ, ๋น„๊ณ ๋ž€์„ ํ™œ์šฉํ•˜์—ฌ ๋น„์šฉ ๋ณ€๊ฒฝ ์ด๋ ฅ์„ ๋ฉ”๋ชจํ•ด ๋‘๋ฉด ์˜ˆ์‚ฐ ๊ด€๋ฆฌ์— ๋„์›€์ด ๋ฉ๋‹ˆ๋‹ค. -
` } ]; @@ -551,74 +128,54 @@ const GUIDE_TABS: GuideTabConfig[] = [ // โ”€โ”€โ”€ ๊ฐ€์ด๋“œ ๋ชจ๋‹ฌ ์ดˆ๊ธฐํ™” โ”€โ”€โ”€ export function initGuide() { const body = document.body; + if (document.getElementById('guide-overlay')) return; - // ์˜ค๋ฒ„๋ ˆ์ด const overlay = document.createElement('div'); overlay.className = 'guide-overlay'; overlay.id = 'guide-overlay'; - // ๋ชจ๋‹ฌ - const modal = document.createElement('div'); - modal.className = 'guide-modal'; - modal.id = 'guide-modal'; - - // ํƒญ ๋ฐ” ์ƒ์„ฑ const tabsHtml = GUIDE_TABS.map((tab, i) => `
${tab.label}
` ).join(''); - // ํƒญ ํŒจ๋„ ์ƒ์„ฑ const panelsHtml = GUIDE_TABS.map((tab, i) => `
${tab.content}
` ).join(''); - modal.innerHTML = ` -
-

IT ์ž์‚ฐ๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค ๊ฐ€์ด๋“œ

- + overlay.innerHTML = ` +
+
+

IT ์ž์‚ฐ๊ด€๋ฆฌ ํ”„๋กœ์„ธ์Šค ๊ฐ€์ด๋“œ

+ +
+
${tabsHtml}
+
${panelsHtml}
-
${tabsHtml}
-
${panelsHtml}
`; - overlay.appendChild(modal); body.appendChild(overlay); - // โ”€โ”€โ”€ ์ด๋ฒคํŠธ ๋ฐ”์ธ๋”ฉ โ”€โ”€โ”€ const openGuide = () => overlay.classList.add('active'); const closeGuide = () => overlay.classList.remove('active'); - // ํ—ค๋” ๋ฒ„ํŠผ document.getElementById('btn-open-guide-header')?.addEventListener('click', openGuide); - - // ์˜ค๋ฒ„๋ ˆ์ด ๋ฐฐ๊ฒฝ ํด๋ฆญ - overlay.addEventListener('click', (e) => { - if (e.target === overlay) closeGuide(); - }); - - // ๋‹ซ๊ธฐ ๋ฒ„ํŠผ + overlay.addEventListener('click', (e) => { if (e.target === overlay) closeGuide(); }); document.getElementById('btn-close-guide')?.addEventListener('click', closeGuide); - // ํƒญ ์ „ํ™˜ - const tabs = modal.querySelectorAll('.guide-tab'); - const panels = modal.querySelectorAll('.guide-tab-panel'); + const tabs = overlay.querySelectorAll('.guide-tab'); + const panels = overlay.querySelectorAll('.guide-tab-panel'); tabs.forEach(tab => { tab.addEventListener('click', () => { const targetId = tab.getAttribute('data-guide-tab'); - tabs.forEach(t => t.classList.remove('active')); panels.forEach(p => p.classList.remove('active')); - tab.classList.add('active'); - modal.querySelector(`.guide-tab-panel[data-guide-panel="${targetId}"]`)?.classList.add('active'); + overlay.querySelector(`.guide-tab-panel[data-guide-panel="${targetId}"]`)?.classList.add('active'); }); }); - // ์•„์ด์ฝ˜ ๋ Œ๋”๋ง - createIcons({ - icons: { BookOpen, X, ChevronDown, ChevronRight, RefreshCw } - }); + createIcons({ icons: { BookOpen, X, ChevronDown, ChevronRight, RefreshCw }, nameAttr: 'data-lucide' }); } diff --git a/src/components/Modal/BaseModal.ts b/src/components/Modal/BaseModal.ts index f615d4d..7e1c518 100644 --- a/src/components/Modal/BaseModal.ts +++ b/src/components/Modal/BaseModal.ts @@ -1,42 +1,34 @@ /** - * ๋ชจ๋“  ๋ชจ๋‹ฌ์˜ ๊ณตํ†ต ๊ธฐ๋Šฅ (๋‹ซ๊ธฐ, ESC ์ฒ˜๋ฆฌ, ๋ฐฐ๊ฒฝ ํด๋ฆญ ๋“ฑ)์„ ๊ด€๋ฆฌํ•˜๋Š” ๋ฒ ์ด์Šค ๋ชจ๋‹ฌ ๋ชจ๋“ˆ์ž…๋‹ˆ๋‹ค. + * ๋ชจ๋“  ๋ชจ๋‹ฌ์˜ ๊ณตํ†ต ๊ธฐ๋Šฅ (๋‹ซ๊ธฐ, ESC ์ฒ˜๋ฆฌ, ๋ฐฐ๊ฒฝ ํด๋ฆญ ๋“ฑ)์„ ๊ด€๋ฆฌํ•˜๋Š” ๋ฒ ์ด์Šค ๋ชจ๋“ˆ์ž…๋‹ˆ๋‹ค. */ - -export function closeModals() { - const modals = document.querySelectorAll('.modal-overlay'); - modals.forEach(modal => modal.classList.add('hidden')); -} - export function initBaseModal() { + const closeAllModals = () => { + const modals = document.querySelectorAll('.modal-overlay'); + modals.forEach(modal => modal.classList.add('hidden')); + }; + // ESC ํ‚ค๋กœ ๋‹ซ๊ธฐ window.addEventListener('keydown', (e) => { - if (e.key === 'Escape') closeModals(); + if (e.key === 'Escape') closeAllModals(); }); - // ๋ฐฐ๊ฒฝ(Overlay) ๋ฐ ๋‹ซ๊ธฐ/์ทจ์†Œ ๋ฒ„ํŠผ ํด๋ฆญ ์‹œ ๋‹ซ๊ธฐ + // ๋ฐฐ๊ฒฝ(Overlay) ํด๋ฆญ ์‹œ ๋‹ซ๊ธฐ (๋™์  ์ƒ์„ฑ๋œ ๋ชจ๋‹ฌ ๋Œ€์‘์„ ์œ„ํ•ด ์ด๋ฒคํŠธ ์œ„์ž„ ๊ณ ๋ ค ๊ฐ€๋Šฅํ•˜๋‚˜ ์ผ๋‹จ ๋‹จ์ˆœ ๊ตฌํ˜„) document.addEventListener('click', (e) => { const target = e.target as HTMLElement; - - // 1. ์˜ค๋ฒ„๋ ˆ์ด ํด๋ฆญ ์‹œ ๋‹ซ๊ธฐ if (target.classList.contains('modal-overlay')) { - closeModals(); - } - - // 2. ๋‹ซ๊ธฐ ๋˜๋Š” ์ทจ์†Œ ๋ฒ„ํŠผ ํด๋ฆญ ์‹œ ๋‹ซ๊ธฐ (์ด๋ฆ„ ํŒจํ„ด ๊ธฐ์ค€) - const btn = target.closest('button'); - if (btn && (btn.id.startsWith('btn-close-') || btn.id.startsWith('btn-cancel-'))) { - closeModals(); + closeAllModals(); } }); - return { closeAllModals: closeModals }; + return { closeAllModals }; } /** - * ํŠน์ • ๋ชจ๋‹ฌ ์—ด๊ธฐ (๊ธฐ์กด์˜ classList ์กฐ์ž‘์„ ์ •ํ˜•ํ™”) + * ํŠน์ • ๋ชจ๋‹ฌ์„ ์—ฝ๋‹ˆ๋‹ค. + * @param modalId ๋ชจ๋‹ฌ ์—˜๋ฆฌ๋จผํŠธ์˜ ID */ -export function openModal(id: string) { - const modal = document.getElementById(id); +export function openModal(modalId: string) { + const modal = document.getElementById(modalId); if (modal) { modal.classList.remove('hidden'); } diff --git a/src/components/Modal/DashboardDetailModal.ts b/src/components/Modal/DashboardDetailModal.ts index 7d43931..7c5fe94 100644 --- a/src/components/Modal/DashboardDetailModal.ts +++ b/src/components/Modal/DashboardDetailModal.ts @@ -98,7 +98,7 @@ export function openSwUsageDetail(title: string, list: SoftwareAsset[]) { thead.innerHTML = `No๋ฒ•์ธ์ œํ’ˆ๋ช…์ˆ˜๋Ÿ‰์‚ฌ์šฉ์ค‘์‚ฌ์šฉ๊ฐ€๋Šฅ`; tbody.innerHTML = ''; list.forEach((sw, idx) => { - const assigned = state.masterData.swUsers.filter(u => u.sw_id === sw.id).length; + const assigned = state.masterData.swUsers.filter(u => u.swId === sw.id).length; const tr = document.createElement('tr'); tr.innerHTML = `${idx+1}${sw.๋ฒ•์ธ}${sw.์ œํ’ˆ๋ช…}${sw.์ˆ˜๋Ÿ‰}${assigned}${Number(sw.์ˆ˜๋Ÿ‰) - assigned}`; tbody.appendChild(tr); diff --git a/src/components/Modal/HWModal.ts b/src/components/Modal/HWModal.ts index a735836..4247dd0 100644 --- a/src/components/Modal/HWModal.ts +++ b/src/components/Modal/HWModal.ts @@ -19,23 +19,23 @@ import { let currentAsset: HardwareAsset | null = null; let isEditMode = false; -const STATUS_LIST = ['์‚ฌ์šฉ์ค‘', '๋ณด๊ด€์ค‘', '์ˆ˜๋ฆฌ์ค‘', 'ํ๊ธฐ์˜ˆ์ •', '๊ธฐํƒ€']; +const STATUS_LIST = ['๋Œ€์—ฌ์ค‘', '๋ณด๊ด€์ค‘', '์ˆ˜๋ฆฌ์ค‘', '๊ธฐํƒ€']; -// ํ•„๋“œ ID โ†” ๋ฐ์ดํ„ฐ Key ๋งคํ•‘ +// ํ•„๋“œ ID โ†” ๋ฐ์ดํ„ฐ Key ๋งคํ•‘ (์œ ์ง€๋ณด์ˆ˜ ์‹œ ์ด ๋ถ€๋ถ„๋งŒ ์ˆ˜์ •) const HW_FIELD_MAP: Record = { '์œ ํ˜•': 'type', '๋ฒ•์ธ': '๋ฒ•์ธ', '์ž์‚ฐ์ฝ”๋“œ': '์ž์‚ฐ์ฝ”๋“œ', - 'ํ˜„์‚ฌ์šฉ์กฐ์ง': '์‹ค์‚ฌ์šฉ์กฐ์ง', + 'ํ˜„์‚ฌ์šฉ์กฐ์ง': 'ํ˜„์‚ฌ์šฉ์กฐ์ง', '์ด์ „์‚ฌ์šฉ์กฐ์ง': '์ด์ „์‚ฌ์šฉ์กฐ์ง', - '์ƒ์„ธ์šฉ๋„': '์„œ๋ฒ„์šฉ๋„', + '์ƒ์„ธ์šฉ๋„': '์ƒ์„ธ์šฉ๋„', '๋ชจ๋ธ๋ช…': '๋ชจ๋ธ๋ช…', '๋ช…์นญ': '๋ช…์นญ', '๋ณด๊ด€์œ„์น˜': '๋ณด๊ด€์œ„์น˜', - 'ํ˜„์žฌ์ƒํƒœ': '์ƒํƒœ', + 'ํ˜„์žฌ์ƒํƒœ': 'ํ˜„์žฌ์ƒํƒœ', 'IP์ฃผ์†Œ': 'IP์ฃผ์†Œ', 'IP2': 'IP2', - '์›๊ฒฉ์ ‘์†': '์›๊ฒฉ๋ฐฉ๋ฒ•', + '์›๊ฒฉ์ ‘์†': '์›๊ฒฉ์ ‘์†', '์„œ๋ฒ„ID': '์„œ๋ฒ„ID', '์„œ๋ฒ„PW': '์„œ๋ฒ„PW', '๋ชจ๋‹ˆํ„ฐ๋ง': '๋ชจ๋‹ˆํ„ฐ๋ง', @@ -45,14 +45,16 @@ const HW_FIELD_MAP: Record = { 'SSD1': 'SSD1', 'SSD2': 'SSD2', 'HW์‚ฌ์–‘': 'HW์‚ฌ์–‘', - '๋‹ด๋‹น์ž_์ •': '๊ด€๋ฆฌ์กฐ์ง', - '๊ตฌ๋งค์ผ': '๋„์ž…์ผ', - '๊ธˆ์•ก': '๊ตฌ๋งค๊ฐ€', + '๋‹ด๋‹น์ž_์ •': '๋‹ด๋‹น์ž_์ •', + '๋‹ด๋‹น์ž_๋ถ€': '๋‹ด๋‹น์ž_๋ถ€', + '๊ตฌ๋งค์ผ': '๊ตฌ๋งค์—ฐ์›”', + '๊ธˆ์•ก': '๊ธˆ์•ก', '๋น„๊ณ ': '๋น„๊ณ ', '์‚ฌ์šฉ์ž': '์‚ฌ์šฉ์ž' }; const HW_FORM_HTML = ` +
๊ธฐ๋ณธ ์ •๋ณด (Identity)
@@ -70,7 +72,7 @@ const HW_FORM_HTML = `
- +
@@ -78,17 +80,15 @@ const HW_FORM_HTML = `
- +
-