{"id":2670,"date":"2025-12-27T09:08:31","date_gmt":"2025-12-27T09:08:31","guid":{"rendered":"https:\/\/zsgcservice.com\/?page_id=2670"},"modified":"2026-01-04T09:23:47","modified_gmt":"2026-01-04T09:23:47","slug":"project-case","status":"publish","type":"page","link":"https:\/\/zsgcservice.com\/en\/project-case\/","title":{"rendered":"Project Case"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"2670\" class=\"elementor elementor-2670\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cd07880 e-flex e-con-boxed e-con e-parent\" data-id=\"cd07880\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-26cf609 elementor-widget elementor-widget-heading\" data-id=\"26cf609\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Project Case<\/h2>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4745330 e-flex e-con-boxed e-con e-parent\" data-id=\"4745330\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7e11841 elementor-widget elementor-widget-shortcode\" data-id=\"7e11841\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">  <div class=\"project-case-wrap\" data-ppp=\"9\" data-nonce=\"b1b1385f17\">\n    <div class=\"project-toolbar\">\n      <form class=\"project-search\" onsubmit=\"return false;\" action=\"\">\n        <input type=\"text\" class=\"project-search-input\" placeholder=\"Search projects...\" \/>\n        <button type=\"button\" class=\"project-search-btn\">Search<\/button>\n      <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\n\n      <div class=\"project-filters\">\n                  <button type=\"button\" class=\"project-filter-btn is-active\" data-cat=\"all\">\n            All          <\/button>\n                  <button type=\"button\" class=\"project-filter-btn\" data-cat=\"ONE\">\n            ONE          <\/button>\n                  <button type=\"button\" class=\"project-filter-btn\" data-cat=\"TWO\">\n            TWO          <\/button>\n                  <button type=\"button\" class=\"project-filter-btn\" data-cat=\"THREE\">\n            THREE          <\/button>\n              <\/div>\n    <\/div>\n\n    <!-- \u2705 \u8fd9\u91cc\u6539\u6210 Loading\uff0c\u907f\u514d\u9996\u5c4f\u5148\u663e\u793a2\u884c\/\u518d\u53d83\u884c\u7684\u201c\u89c6\u89c9\u4e0d\u4e00\u81f4\u201d -->\n    <div class=\"project-results\">\n      <div class=\"project-empty\">Loading...<\/div>\n    <\/div>\n  <\/div>\n\n  <style>\n    .project-case-wrap{max-width:1140px;margin:0 auto;padding:10px 0;}\n    .project-toolbar{display:flex;flex-direction:column;gap:14px;align-items:center;}\n    .project-search{display:flex;gap:10px;align-items:center;width:min(520px,100%);}\n    .project-search-input{flex:1;padding:10px 12px;border:1px solid #ddd;border-radius:6px;}\n    .project-search-btn{padding:10px 16px;border:0;border-radius:6px;cursor:pointer;}\n    .project-filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}\n\n    \/* \u2705 \u5206\u7c7b\u6309\u94ae\uff1a\u672a\u9009\u4e2d\u6df1\u8272\u5b57\u3001\u9009\u4e2d\u9ed1\u5e95\u767d\u5b57 *\/\n    .project-filter-btn{\n      padding:10px 14px;\n      border:1px solid #e5e5e5;\n      background:#f7f7f7;\n      color:#1D2327;\n      border-radius:8px;\n      cursor:pointer;\n    }\n    .project-filter-btn:hover{background:#eaeaea;color:#1D2327;}\n    .project-filter-btn.is-active{background:#111;color:#fff;border-color:#111;}\n\n    .project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:18px;}\n    @media (max-width: 992px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}\n    @media (max-width: 640px){.project-grid{grid-template-columns:1fr;}}\n\n    .project-card{background:#fff;border:1px solid #eee;border-radius:10px;padding:14px;}\n    .project-thumb img{width:100%;height:auto;display:block;border-radius:8px;}\n    .project-title{font-size:18px;line-height:1.3;margin:12px 0 10px;}\n    .project-title a{text-decoration:none;}\n\n    \/* \u2705 \u6807\u7b7e\u80f6\u56ca\u6837\u5f0f\uff08\u7070\u5e95\u5927\u5706\u89d2\uff09 *\/\n    .project-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px;}\n    .project-tag{\n      display:inline-block;\n      padding:6px 10px;\n      background:#eef1f4;\n      border:1px solid #e3e7ee;\n      border-radius:999px;\n      font-size:13px;\n      line-height:1;\n      color:#1D2327;\n      text-decoration:none;          \/* \u2705 \u5173\u952e\uff1a\u53bb\u6389 a \u7684\u4e0b\u5212\u7ebf *\/\n      transition:all .15s ease;\n    }\n    .project-tag:hover{\n      background:#e6eaee;            \/* \u2705 hover \u66f4\u50cf\u201c\u6309\u94ae\u80f6\u56ca\u201d *\/\n      border-color:#d8dee7;\n    }\n\n    \/* \u2705 \u6458\u8981\uff1a\u56fa\u5b9a3\u884c\uff0c\u8d85\u51fa\u7701\u7565\u53f7 *\/\n    .project-excerpt{\n      font-size:14px;\n      color:#1D2327;\n      opacity:.9;\n      margin:0;\n\n      display:-webkit-box;\n      -webkit-box-orient:vertical;\n      -webkit-line-clamp:3;\n      overflow:hidden;\n    }\n\n    .project-empty{text-align:center;opacity:.7;padding:30px 0;}\n  <\/style>\n\n  <script>\n    (function(){\n      const wrap = document.querySelector('.project-case-wrap');\n      if(!wrap) return;\n\n      const ppp = wrap.dataset.ppp || 9;\n      const nonce = wrap.dataset.nonce;\n      const results = wrap.querySelector('.project-results');\n      const searchInput = wrap.querySelector('.project-search-input');\n      const searchBtn = wrap.querySelector('.project-search-btn');\n      const filterBtns = wrap.querySelectorAll('.project-filter-btn');\n\n      let currentCat = 'all';\n\n      function setActive(btn){\n        filterBtns.forEach(b=>b.classList.remove('is-active'));\n        btn.classList.add('is-active');\n      }\n\n      async function load(){\n        const formData = new FormData();\n        formData.append('action','project_case_filter');\n        formData.append('nonce', nonce);\n        formData.append('ppp', ppp);\n        formData.append('cat', currentCat);\n        formData.append('q', (searchInput.value || '').trim());\n\n        results.style.opacity = '0.5';\n        const res = await fetch('https:\/\/zsgcservice.com\/wp-admin\/admin-ajax.php', { method:'POST', body: formData });\n        const html = await res.text();\n        results.innerHTML = html;\n        results.style.opacity = '1';\n      }\n\n      filterBtns.forEach(btn=>{\n        btn.addEventListener('click', ()=>{\n          currentCat = btn.dataset.cat || 'all';\n          setActive(btn);\n          load();\n        });\n      });\n\n      searchBtn.addEventListener('click', load);\n      searchInput.addEventListener('keydown', (e)=>{\n        if(e.key === 'Enter'){ e.preventDefault(); load(); }\n      });\n\n      \/\/ \u2705 \u9996\u5c4f\u81ea\u52a8\u52a0\u8f7d\u4e00\u6b21\uff08\u9996\u5c4f=AJAX\u6e32\u67d3\uff0c\u907f\u514d\u4f60\u8bf4\u76842\u884c\/3\u884c\u5dee\u5f02\uff09\n      load();\n    })();\n  <\/script>\n  \n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4755822 e-flex e-con-boxed e-con e-parent\" data-id=\"4755822\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Project Case<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-2670","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false,"woocommerce_thumbnail":false,"woocommerce_single":false,"woocommerce_gallery_thumbnail":false},"uagb_author_info":{"display_name":"83193839@qq.com","author_link":"https:\/\/zsgcservice.com\/en\/author\/83193839qq-com\/"},"uagb_comment_info":0,"uagb_excerpt":"Project Case","_links":{"self":[{"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/pages\/2670","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/comments?post=2670"}],"version-history":[{"count":22,"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/pages\/2670\/revisions"}],"predecessor-version":[{"id":2820,"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/pages\/2670\/revisions\/2820"}],"wp:attachment":[{"href":"https:\/\/zsgcservice.com\/en\/wp-json\/wp\/v2\/media?parent=2670"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}