{"id":158,"date":"2026-03-16T21:24:29","date_gmt":"2026-03-16T13:24:29","guid":{"rendered":"http:\/\/10.140.25.199:8998\/?page_id=158"},"modified":"2026-03-25T15:43:06","modified_gmt":"2026-03-25T07:43:06","slug":"organizational","status":"publish","type":"page","link":"https:\/\/yystudio.com.cn\/index.php\/organizational\/","title":{"rendered":"\u7ec4\u7ec7\u67b6\u6784"},"content":{"rendered":"\n<link rel=\"preconnect\" href=\"https:\/\/images.unsplash.com\" crossorigin>\n\n<script>\n\/* ===================================================================\n   === \ud83d\udd27 \u7ec4\u7ec7\u67b6\u6784\u6570\u636e\u914d\u7f6e\u533a\uff1a\u4e25\u683c\u540c\u6b65\u601d\u7ef4\u5bfc\u56fe\u771f\u5b9e\u7ec4\u522b ===\n   =================================================================== *\/\nconst ORG_DATA = {\n    rootName: \"\u5e94\u5141\u5de5\u4f5c\u5ba4\",\n    rootDesc: \"\u516d\u5927\u90e8\u95e8 \u00b7 \u95ed\u73af\u751f\u6001\",\n    departments: [\n        {\n            id: \"planning\",\n            name: \"\u4f01\u5212\u90e8\",\n            detail: \"\u5bf9\u63a5\u9700\u6c42\uff0c\u8fdb\u884c\u521b\u610f\u6784\u601d\uff0c\u64b0\u5199\u7b56\u5212\u6848\u4e0e\u62cd\u6444\u811a\u672c\uff0c\u5e76\u7ed8\u5236\u5206\u955c\u3002\u786e\u4fdd\u6bcf\u4e00\u4e2a\u9879\u76ee\u90fd\u6709\u6e05\u6670\u4e14\u5bcc\u6709\u521b\u610f\u7684\u6307\u5bfc\u84dd\u56fe\u3002\",\n            groups: [\"\u5206\u955c\u7ec4\", \"\u521b\u610f\u7ec4\", \"\u5916\u8054\u7ec4\", \"\u7b56\u5212\u7ec4\"]\n        },\n        {\n            id: \"video\",\n            name: \"\u5f71\u89c6\u90e8\",\n            detail: \"\u6839\u636e\u5206\u955c\u582a\u666f\u3001\u51c6\u5907\u8bbe\u5907\u3001\u7ec4\u5efa\u5267\u7ec4\u5e76\u6267\u884c\u73b0\u573a\u62cd\u6444\u3002\u8d1f\u8d23\u8c03\u5ea6\u73b0\u573a\u3001\u8fd0\u955c\u3001\u706f\u5149\u53ca\u7d20\u6750\u5b89\u5168\uff0c\u5bf9\u6210\u7247\u827a\u672f\u8d28\u91cf\u8d1f\u8d23\u3002\",\n            groups: [\"\u573a\u52a1\u7ec4\", \"\u5bfc\u6f14\u7ec4\", \"\u6444\u5f71A\u7ec4\", \"\u6444\u5f71B\u7ec4\", \"\u6d3b\u52a8\u7167\u7247\u7ec4\", \"\u6d3b\u52a8\u89c6\u9891\u7ec4\", \"\u706f\u5149\u7ec4\"]\n        },\n        {\n            id: \"post\",\n            name: \"\u540e\u671f\u90e8\",\n            detail: \"\u63a5\u6536\u7d20\u6750\u540e\u8fdb\u884c\u6821\u9a8c\u3001\u8f6c\u7801\uff0c\u901a\u8fc7\u526a\u6620\u5feb\u526a\u4e0e\u8fbe\u82ac\u5947\u7cbe\u8c03\u7ed3\u5408\uff0c\u5b8c\u6210\u526a\u8f91\u3001\u8c03\u8272\u3001\u89c6\u6548\u5305\u88c5\u53ca\u97f3\u9891\u5904\u7406\u3002\",\n            groups: [\"\u526a\u8f91\u7ec4\", \"\u5feb\u526a\u7ec4\", \"\u7f8e\u672f\u7ec4\", \"\u89c6\u6548\u7ec4\", \"\u97f3\u6548\u7ec4\"]\n        },\n        {\n            id: \"logistics\",\n            name: \"\u540e\u52e4\u90e8\",\n            detail: \"\u8d1f\u8d23\u8bbe\u5907\u9884\u68c0\u3001\u73b0\u573a\u652f\u6301\u3001\u56de\u6536\u7ef4\u62a4\u3002\u6db5\u76d6\u51fa\u5165\u5e93\u767b\u8bb0\u3001\u76d8\u70b9\u53ca\u73b0\u573a\u7269\u8d44\u770b\u7ba1\uff0c\u662f\u56e2\u961f\u6700\u575a\u5b9e\u7684\u540e\u76fe\u3002\",\n            groups: [\"\u540e\u52e4A\u7ec4\", \"\u540e\u52e4B\u7ec4\", \"\u540e\u52e4C\u7ec4\"]\n        },\n        {\n            id: \"admin\",\n            name: \"\u7ba1\u7406\u90e8\",\n            detail: \"\u8d1f\u8d23\u7edf\u7b79\u5de5\u4f5c\u5ba4\u65e5\u5e38\u8fd0\u8425\u3001\u5185\u90e8\u884c\u653f\u89c4\u7ae0\u5236\u5b9a\u3001\u4eba\u5458\u8003\u52e4\u4e0e\u8de8\u90e8\u95e8\u534f\u540c\uff0c\u4fdd\u969c\u5de5\u4f5c\u5ba4\u9ad8\u6548\u3001\u89c4\u8303\u6d41\u8f6c\u3002\",\n            groups: [] \n        },\n        {\n            id: \"tech\",\n            name: \"\u6280\u672f\u90e8\",\n            detail: \"\u63a2\u7d22\u6280\u672f\u524d\u6cbf\uff0c\u63d0\u4f9b\u5b9a\u5236\u5316\u7a0b\u5e8f\u5f00\u53d1\u3001\u5185\u90e8\u6570\u636e\u770b\u677f\u642d\u5efa\u4e0e\u5e95\u5c42\u6280\u672f\u652f\u6301\u65b9\u6848\uff0c\u4ee5\u79d1\u6280\u8d4b\u80fd\u4f20\u5a92\u4e1a\u52a1\u3002\",\n            groups: [] \n        }\n    ]\n};\n<\/script>\n\n<style>\n\/* =========================================\n   === \u767d\u5e95\u84dd\u8c03 \u6e05\u65b0\u79d1\u6280\u98ce ===\n========================================= *\/\nhtml, body {\n    margin: 0 !important; padding: 0 !important;\n    background-color: #ffffff !important; \/* \u7eaf\u767d\u5e95\u8272\u515c\u5e95 *\/\n    overflow-x: hidden !important;\n    width: 100vw !important; min-height: 100vh !important; \n    visibility: hidden !important; \n    position: relative;\n}\n@keyframes masterFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } }\n\n#cine-root, #cine-root *, #wpadminbar, #wpadminbar * { visibility: visible !important; }\n\n\/* \u2605 \u6d45\u8272\u6781\u5149\u80cc\u666f\uff0c\u67d4\u548c\u7684\u54c1\u724c\u84dd\u5149\u6655 \u2605 *\/\n.pure-css-aurora {\n    position: fixed; inset: 0; z-index: -2; \n    background-color: #ffffff; \n    background-image: \n        radial-gradient(circle at 15% 50%, rgba(0, 149, 224, 0.06), transparent 40%),\n        radial-gradient(circle at 85% 30%, rgba(0, 149, 224, 0.04), transparent 50%),\n        radial-gradient(circle at 50% 80%, rgba(0, 149, 224, 0.06), transparent 50%);\n    filter: blur(30px);\n    transform: scale(1.1); \n}\n\n\/* \u7ec6\u817b\u7684\u84dd\u8272\u79d1\u6280\u7f51\u683c *\/\n.tech-grid-overlay {\n    position: fixed; inset: 0; z-index: -1; pointer-events: none;\n    background-image: \n        linear-gradient(rgba(0, 149, 224, 0.04) 1px, transparent 1px), \n        linear-gradient(90deg, rgba(0, 149, 224, 0.04) 1px, transparent 1px);\n    background-size: 50px 50px;\n    mask-image: radial-gradient(circle at 50% 50%, black 20%, transparent 80%);\n    -webkit-mask-image: radial-gradient(circle at 50% 50%, black 20%, transparent 80%);\n}\n\n#cine-root {\n    opacity: 0;\n    animation: masterFadeIn 0.8s ease-out 0.1s forwards;\n    position: relative; z-index: 999999; \n    background-color: transparent; \n    width: 100vw; min-height: 100vh; overflow-x: hidden; \n    color: #333333; \/* \u4e3b\u4f53\u6587\u5b57\u989c\u8272\u53d8\u4e3a\u6df1\u7070 *\/\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n    display: flex; flex-direction: column; justify-content: center;\n    -webkit-font-smoothing: antialiased;\n}\n#cine-root * { box-sizing: border-box; }\n\n.top-back-btn { \n    position: absolute; top: 30px; left: 40px; display: flex; align-items: center; gap: 6px; \n    color: #666666; text-decoration: none; font-size: 14px; font-weight: 500; transition: all 0.3s ease; \n    padding: 8px 16px; border-radius: 20px; z-index: 100; \n    background: rgba(255, 255, 255, 0.8); border: 1px solid rgba(0, 149, 224, 0.2); backdrop-filter: blur(5px);\n}\n.top-back-btn:hover { color: #0095e0; background: #ffffff; transform: translateX(-3px); border-color: #0095e0; }\n\n\n\/* =========================================\n   === \u7269\u7406\u6392\u7248\u5f15\u64ce (\u5b8c\u7f8e\u7559\u5b58) ===\n========================================= *\/\n.org-scroll-wrapper {\n    width: 100%; overflow-x: auto; padding: 50px 0;\n    scrollbar-width: thin; scrollbar-color: rgba(0, 149, 224, 0.3) transparent;\n    scroll-behavior: smooth; z-index: 10; position: relative;\n    margin-top: auto; margin-bottom: auto;\n}\n.org-scroll-wrapper::-webkit-scrollbar { height: 6px; }\n.org-scroll-wrapper::-webkit-scrollbar-track { background: transparent; }\n.org-scroll-wrapper::-webkit-scrollbar-thumb { background-color: rgba(0, 149, 224, 0.3); border-radius: 10px; }\n\n.org-chart-main {\n    width: 100%; max-width: 1400px; \n    margin: 0 auto; display: flex; flex-direction: column; align-items: center;\n    padding: 0 20px; transition: all 0.5s ease;\n}\n\n\n\/* =========================================\n   === 1. \u6839\u8282\u70b9 (\u5e94\u5141\u5de5\u4f5c\u5ba4) ===\n========================================= *\/\n.root-node-wrapper {\n    display: flex; flex-direction: column; align-items: center;\n    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\n    transform-origin: bottom center; \n}\n\n.root-node {\n    background: #ffffff;\n    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);\n    border: 2px solid #0095e0; \/* \u5f3a\u8c03\u84dd\u6846 *\/\n    border-radius: 14px; padding: 22px 48px;\n    box-shadow: 0 12px 30px rgba(0, 149, 224, 0.12); \n    text-align: center; position: relative; z-index: 10;\n    transition: all 0.5s ease;\n}\n.root-node h1 { \n    margin: 0 0 6px 0; font-size: 32px; font-weight: 800; letter-spacing: 4px; white-space: nowrap;\n    color: #0095e0; \/* \u54c1\u724c\u84dd *\/\n}\n.root-node p { margin: 0; font-size: 13px; color: #888888; letter-spacing: 6px; text-transform: uppercase; white-space: nowrap;}\n\n.tree-line-main-v {\n    width: 1px; height: 35px; background: rgba(0, 149, 224, 0.4);\n}\n\n.org-chart-main.is-focused .root-node-wrapper {\n    transform: scale(0.85); opacity: 0.6; filter: grayscale(1);\n}\n\n\n\/* =========================================\n   === 2. \u5f39\u6027\u8f68\u9053\u4e0e\u6a2a\u5411\u8fde\u63a5\u7ebf ===\n========================================= *\/\n.org-depts-row {\n    display: flex; justify-content: center; width: 100%; position: relative;\n}\n.org-dept-col {\n    flex: 1 1 0; \n    display: flex; flex-direction: column; align-items: center; position: relative;\n    padding: 35px 5px 0 5px; \n    transition: flex 0.5s cubic-bezier(0.25, 1, 0.5, 1);\n}\n\n.org-dept-col::before, .org-dept-col::after {\n    content: ''; position: absolute; top: 0; \n    border-top: 1px solid rgba(0, 149, 224, 0.4); width: 50%; height: 1px;\n    transition: width 0.5s cubic-bezier(0.25, 1, 0.5, 1); \n}\n.org-dept-col::before { left: 0; }\n.org-dept-col::after { right: 0; }\n.org-dept-col:first-child::before { display: none; }\n.org-dept-col:last-child::after { display: none; }\n\n.tree-line-v-drop {\n    position: absolute; top: 0; left: 50%; transform: translateX(-50%);\n    width: 1px; height: 35px; background: rgba(0, 149, 224, 0.4); \n}\n\n\n\/* =========================================\n   === 3. \u90e8\u95e8\u5361\u7247 ===\n========================================= *\/\n.dept-node {\n    margin-top: 35px; \n    background: #ffffff;\n    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);\n    border: 1px solid rgba(0, 149, 224, 0.3); \n    border-radius: 12px;\n    width: 100%; max-width: 160px; height: 200px; \n    display: flex; flex-direction: column; justify-content: center; align-items: center;\n    text-align: center; cursor: pointer; \n    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.04);\n    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);\n    position: relative; z-index: 20; overflow: hidden;\n}\n.dept-node h2 { \n    margin: 0; font-size: 20px; color: #333333; font-weight: 700; letter-spacing: 2px; \n    transition: all 0.5s ease; line-height: 1.4; white-space: nowrap; \n}\n.dept-node:hover {\n    background: #0095e0; \n    border-color: #0095e0;\n    transform: translateY(-4px);\n    box-shadow: 0 12px 30px rgba(0, 149, 224, 0.25);\n}\n.dept-node:hover h2 { color: #ffffff; }\n\n\n\/* =========================================\n   === 4. \u52a8\u753b\u6392\u7248\uff1a\u6324\u538b\u4e0e\u5c55\u5f00 ===\n========================================= *\/\n.org-chart-main.is-focused .org-dept-col:not(.active-col) {\n    flex: 0.35 1 0; \n}\n.org-chart-main.is-focused .org-dept-col:not(.active-col) .dept-node {\n    max-width: 50px; height: 180px; \n    background: #f8f9fa; border-color: rgba(0, 149, 224, 0.15); box-shadow: none;\n}\n.org-chart-main.is-focused .org-dept-col:not(.active-col) .dept-node:hover {\n    background: rgba(0, 149, 224, 0.05); border-color: #0095e0; transform: translateY(-3px);\n}\n.org-chart-main.is-focused .org-dept-col:not(.active-col) .dept-node h2 {\n    writing-mode: vertical-rl; text-orientation: upright; font-size: 15px; letter-spacing: 8px; color: #999999;\n}\n.org-chart-main.is-focused .org-dept-col:not(.active-col) .dept-node:hover h2 {\n    color: #0095e0;\n}\n\n.org-chart-main.is-focused .org-dept-col.active-col {\n    flex: 4 1 0; \n}\n.org-chart-main.is-focused .org-dept-col.active-col .dept-node {\n    max-width: 520px; height: 100px; \n    background: linear-gradient(135deg, #0095e0 0%, #007bb5 100%);\n    border: none;\n    box-shadow: 0 15px 35px rgba(0, 149, 224, 0.3);\n    cursor: default;\n}\n.org-chart-main.is-focused .org-dept-col.active-col .dept-node h2 {\n    font-size: 28px; font-weight: 800; letter-spacing: 6px; color: #ffffff;\n}\n\n\n\/* =========================================\n   === 5. \u5377\u8f74\u63a8\u5f00\u533a ===\n========================================= *\/\n.expand-zone {\n    display: grid; grid-template-rows: 0fr; \n    transition: grid-template-rows 0.5s cubic-bezier(0.25, 1, 0.5, 1);\n    width: 100%;\n}\n.org-chart-main.is-focused .org-dept-col.active-col .expand-zone {\n    grid-template-rows: 1fr; \n}\n.expand-content {\n    min-height: 0; overflow: hidden; display: flex; flex-direction: column; align-items: center; width: 100%; \n}\n.tree-line-v-inner { width: 1px; height: 15px; background: rgba(0, 149, 224, 0.4); transition: height 0.5s ease;}\n\n.intro-collapse-zone {\n    display: grid; grid-template-rows: 0fr; \n    transition: grid-template-rows 0.5s cubic-bezier(0.25, 1, 0.5, 1);\n    width: 100%;\n}\n.org-chart-main.is-focused .org-dept-col.active-col .intro-collapse-zone {\n    grid-template-rows: 1fr; \n}\n.intro-collapse-content {\n    min-height: 0; overflow: hidden; display: flex; flex-direction: column; align-items: center; width: 100%; \n}\n\n.org-intro-box {\n    background: #ffffff; \n    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);\n    border-radius: 8px; padding: 18px 30px; font-size: 14px; color: #555555;\n    line-height: 1.8; width: 500px; text-align: center; \n    font-weight: 400; letter-spacing: 1px; border: 1px solid rgba(0, 149, 224, 0.2);\n    margin: 5px 0 15px 0; opacity: 0; transition: opacity 0.4s ease 0.1s;\n    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);\n}\n\n.org-chart-main.is-focused .org-dept-col.active-col .tree-line-v-inner { height: 30px; }\n.org-chart-main.is-focused .org-dept-col.active-col .org-intro-box { opacity: 1; }\n\n\/* === \u7ec4\u522b\u9635\u5217\u673a\u5236 === *\/\n.org-groups-row {\n    display: flex; justify-content: center; width: 100%; max-width: 700px; position: relative;\n    flex-wrap: wrap; gap: 8px; margin-top: 5px;\n    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);\n}\n.org-group-col {\n    flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; position: relative;\n    padding: 0; transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);\n}\n\n.org-chart-main.is-focused .org-dept-col.active-col .org-groups-row {\n    flex-wrap: nowrap; gap: 0;\n}\n.org-chart-main.is-focused .org-dept-col.active-col .org-group-col {\n    flex: 1 1 0; padding: 25px 4px 0 4px; \n}\n\n.org-group-col::before, .org-group-col::after {\n    content: ''; position: absolute; top: 0; border-top: 1px solid rgba(0, 149, 224, 0.4); width: 50%; height: 1px; \n    opacity: 0; transition: opacity 0.4s ease;\n}\n.org-group-col::before { left: 0; }\n.org-group-col::after { right: 0; }\n.org-group-col:first-child::before { display: none; }\n.org-group-col:last-child::after { display: none; }\n.tree-line-v-drop-sm {\n    position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1px; height: 25px; background: rgba(0, 149, 224, 0.4); \n    opacity: 0; transition: opacity 0.4s ease;\n}\n\n.org-chart-main.is-focused .org-dept-col.active-col .org-group-col::before,\n.org-chart-main.is-focused .org-dept-col.active-col .org-group-col::after,\n.org-chart-main.is-focused .org-dept-col.active-col .tree-line-v-drop-sm {\n    opacity: 1;\n}\n\n.group-node {\n    padding: 4px 12px; \n    background: #ffffff; border: 1px solid rgba(0, 149, 224, 0.2);\n    border-radius: 6px; font-size: 11px; color: #666666; text-align: center;\n    white-space: nowrap; font-weight: 400; \n    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); cursor: default;\n}\n.org-chart-main.is-focused .org-dept-col.active-col .group-node {\n    padding: 8px 16px; background: #ffffff; border-color: #0095e0;\n    font-size: 13px; color: #0095e0; letter-spacing: 1px; box-shadow: 0 4px 10px rgba(0, 149, 224, 0.1);\n}\n.org-chart-main.is-focused .org-dept-col.active-col .group-node:hover {\n    background: #0095e0; color: #ffffff; border-color: #0095e0;\n}\n\n\n\/* =========================================\n   === 6. \u8fd4\u56de\u6309\u94ae ===\n========================================= *\/\n.inner-back-btn {\n    position: fixed; bottom: 40px; left: 50%; transform: translateX(-50%) translateY(40px);\n    padding: 12px 32px; background: #ffffff; \n    border: 1px solid #0095e0;\n    color: #0095e0; border-radius: 30px; font-size: 13px; font-weight: 600; cursor: pointer;\n    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); opacity: 0; pointer-events: none; z-index: 999; backdrop-filter: blur(12px);\n    letter-spacing: 1px; box-shadow: 0 10px 25px rgba(0, 149, 224, 0.15);\n}\n.inner-back-btn:hover { background: #0095e0; color: #ffffff; }\n.inner-back-btn.show { opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: auto; }\n\n\/* \u624b\u673a\u7aef\u9002\u914d *\/\n@media (max-width: 992px) {\n    .org-chart-main { min-width: 900px; overflow-x: auto; } \n}\n@media (max-width: 768px) {\n    .root-node h1 { font-size: 24px; }\n    .top-back-btn { top: 15px; left: 15px; font-size: 13px; }\n}\n<\/style>\n\n\n<div id=\"cine-root\">\n    \n    <div class=\"pure-css-aurora\"><\/div>\n    <div class=\"tech-grid-overlay\"><\/div>\n\n    <a href=\"javascript:history.back()\" class=\"top-back-btn\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"19\" y1=\"12\" x2=\"5\" y2=\"12\"><\/line><polyline points=\"12 19 5 12 12 5\"><\/polyline><\/svg>\n        \u8fd4\u56de\u4e0a\u4e00\u9875\n    <\/a>\n\n    <div class=\"org-scroll-wrapper\" id=\"mainScrollWrapper\">\n        <div class=\"org-chart-main\" id=\"orgChartContainer\"><\/div>\n    <\/div>\n\n    <button class=\"inner-back-btn\" id=\"innerBackBtn\">\u2191 \u6536\u8d77\u5e76\u6062\u590d\u5168\u666f\u6811\u72b6\u56fe<\/button>\n<\/div>\n\n<script>\n(function() {\n    const container = document.getElementById('cine-root');\n    if (container && container.parentElement !== document.body) {\n        document.body.prepend(container);\n    }\n    const killStyle = document.createElement('style');\n    killStyle.innerHTML = `\n        body > *:not(#cine-root):not(#wpadminbar):not(script):not(style):not(link):not(noscript) {\n            display: none !important; opacity: 0 !important; height: 0 !important; overflow: hidden !important;\n        }\n    `;\n    document.head.appendChild(killStyle);\n\n    function renderApp() {\n        let html = `\n            <div class=\"root-node-wrapper\">\n                <div class=\"root-node\">\n                    <h1>${ORG_DATA.rootName}<\/h1>\n                    <p>${ORG_DATA.rootDesc}<\/p>\n                <\/div>\n                <div class=\"tree-line-main-v\"><\/div>\n            <\/div>\n            <div class=\"org-depts-row\">\n        `;\n\n        ORG_DATA.departments.forEach(dept => {\n            const hasGroups = dept.groups && dept.groups.length > 0;\n            let groupsHTML = '';\n            if (hasGroups) {\n                groupsHTML = `\n                    <div class=\"tree-line-v-inner\"><\/div>\n                    <div class=\"org-groups-row\">\n                        ${dept.groups.map(g => `\n                            <div class=\"org-group-col\">\n                                <div class=\"tree-line-v-drop-sm\"><\/div>\n                                <div class=\"group-node\">${g}<\/div>\n                            <\/div>\n                        `).join('')}\n                    <\/div>\n                `;\n            }\n\n            html += `\n                <div class=\"org-dept-col\" id=\"col-${dept.id}\">\n                    <div class=\"tree-line-v-drop\"><\/div>\n                    \n                    <div class=\"dept-node\" onclick=\"window.toggleOrgNode('${dept.id}')\">\n                        <h2>${dept.name}<\/h2>\n                    <\/div>\n\n                    <div class=\"expand-zone\">\n                        <div class=\"expand-content\">\n                            <div class=\"tree-line-v-inner\" style=\"margin-bottom: -15px;\"><\/div>\n                            \n                            <div class=\"intro-collapse-zone\">\n                                <div class=\"intro-collapse-content\">\n                                    <div style=\"height: 15px;\"><\/div>\n                                    <div class=\"org-intro-box\">${dept.detail}<\/div>\n                                <\/div>\n                            <\/div>\n                            \n                            ${groupsHTML}\n                            <div style=\"height: 30px;\"><\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            `;\n        });\n\n        html += `<\/div>`; \n        document.getElementById('orgChartContainer').innerHTML = html;\n    }\n\n    window.toggleOrgNode = function(id) {\n        const container = document.getElementById('orgChartContainer');\n        const wrapper = document.getElementById('mainScrollWrapper');\n        const targetCol = document.getElementById('col-' + id);\n        const backBtn = document.getElementById('innerBackBtn');\n\n        if (targetCol.classList.contains('active-col')) return;\n\n        document.querySelectorAll('.org-dept-col').forEach(el => el.classList.remove('active-col'));\n        \n        container.classList.add('is-focused');\n        targetCol.classList.add('active-col');\n        backBtn.classList.add('show');\n\n        setTimeout(() => {\n            const scrollPos = targetCol.offsetLeft - (wrapper.clientWidth \/ 2) + (targetCol.clientWidth \/ 2);\n            wrapper.scrollTo({ left: scrollPos, behavior: 'smooth' });\n        }, 100); \n    };\n\n    function bindReset() {\n        document.getElementById('innerBackBtn').addEventListener('click', function() {\n            const container = document.getElementById('orgChartContainer');\n            const wrapper = document.getElementById('mainScrollWrapper');\n            \n            container.classList.remove('is-focused');\n            document.querySelectorAll('.org-dept-col').forEach(el => el.classList.remove('active-col'));\n            this.classList.remove('show');\n\n            setTimeout(() => {\n                wrapper.scrollTo({ left: (container.clientWidth - wrapper.clientWidth) \/ 2, behavior: 'smooth' });\n            }, 100);\n        });\n    }\n\n    if (document.readyState === 'loading') {\n        document.addEventListener('DOMContentLoaded', () => { renderApp(); bindReset(); });\n    } else {\n        renderApp(); bindReset();\n    }\n})();\n<\/script>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u8fd4\u56de\u4e0a\u4e00\u9875 \u2191 \u6536\u8d77\u5e76\u6062\u590d\u5168\u666f\u6811\u72b6\u56fe<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_themeisle_gutenberg_block_has_review":false,"footnotes":""},"class_list":["post-158","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/pages\/158","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/comments?post=158"}],"version-history":[{"count":34,"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/pages\/158\/revisions"}],"predecessor-version":[{"id":509,"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/pages\/158\/revisions\/509"}],"wp:attachment":[{"href":"https:\/\/yystudio.com.cn\/index.php\/wp-json\/wp\/v2\/media?parent=158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}