`views/public/installer-tpl-trade-pro.ejs`

102 lines
<%- include('../partials/head', { title, bodyClass: 'tpl-trade-pro' }) %>
<%- include('../partials/header') %>
<%
  function _heroUrl() {
    var s = installer.template_settings || {};
    if (s.hero_url) return s.hero_url;
    if (portfolio.length && portfolio[0].image_url) return portfolio[0].image_url;
    var seg = (typeof pickSegmentImage === 'function') ? pickSegmentImage(installer) : null;
    return seg ? seg.file : null;
  }
  var heroUrl = _heroUrl();
  var eq = installer.equipment || {};
  var founded = installer.founded_year || '—';
  var jobNo = 'NPH-' + ((installer.id || '0').toString()).padStart(5, '0');
%>
<article class="tpl-root">
  <div class="tp-banner">
    <span>Studio file · <%= jobNo %></span>
    <span><b>STATUS</b> <%= installer.claim_status === 'claimed' ? 'VERIFIED · ACCEPTING WORK' : 'DIRECTORY LISTING — UNCLAIMED' %></span>
  </div>

  <header class="tp-headerblock">
    <div class="tp-job-no">FILE / <%= jobNo %> / OPENED <%= founded %></div>
    <h1 class="tp-name"><%= installer.business_name %></h1>
    <div class="tp-meta">
      <%= [installer.city, installer.state, installer.zip].filter(Boolean).join(' · ') %><br>
      Service radius: <%= installer.service_radius_miles || '—' %> mi<%= installer.travel_available ? ' · Travels for projects' : '' %><br>
      <% if (installer.team_size) { %>Crew: <%= installer.team_size %> installer(s)<br><% } %>
      <% if (installer.response_time_hours) { %>SLA: replies &lt; <%= installer.response_time_hours %> hr<br><% } %>
    </div>
  </header>

  <% if (installer.claim_status === 'unclaimed') { %>
    <div class="tpl-claim-cta" style="color:#14110b;background:#ffeebf;border-color:#14110b">
      <div style="flex:1;font-family:Inter,sans-serif"><strong>This studio has not yet claimed its file.</strong> If you operate <%= installer.business_name %>, claim it to update specs, accept inbound work, and verify credentials.</div>
      <a href="/installer/<%= installer.slug %>/claim" style="background:#14110b;color:#ffaa00;font-family:Inter,sans-serif;padding:10px 18px;text-decoration:none;font-weight:700">Claim file →</a>
    </div>
  <% } %>

  <div class="tp-grid">
    <div class="tp-bio">
      <h2>About the shop</h2>
      <p><%= installer.bio || 'No long-form bio on file. Specs and project log below.' %></p>
      <% if ((installer.brands_handled || []).length) { %>
        <h2 style="margin-top:24px">Brands installed</h2>
        <p style="font-size:14px"><%= installer.brands_handled.join(' · ') %></p>
      <% } %>
      <% if ((installer.accreditations || []).length) { %>
        <h2 style="margin-top:24px">Memberships</h2>
        <p style="font-size:14px"><%= installer.accreditations.join(' · ') %></p>
      <% } %>
    </div>

    <div class="tp-specs">
      <h3>Studio capacity</h3>
      <table>
        <tr><th>Reach</th><td><%= eq.max_reach_ft ? eq.max_reach_ft + ' ft' : '—' %></td></tr>
        <tr><th>Lift</th><td><%= eq.lift_type ? eq.lift_type.replace(/_/g,' ') : '—' %></td></tr>
        <tr><th>Pasting</th><td><%= eq.paper_table ? eq.paper_table.replace(/_/g,' ') : '—' %></td></tr>
        <tr><th>Vehicle</th><td><%= eq.vehicle ? eq.vehicle.replace(/_/g,' ') : '—' %></td></tr>
        <tr><th>HEPA dust</th><td><%= eq.dust_extraction ? 'Yes — on-site' : '—' %></td></tr>
        <tr><th>Materials</th><td><%= (installer.materials || []).map(function(m){return String(m||'').replace(/_/g,' ');}).filter(Boolean).join(', ') || '—' %></td></tr>
        <tr><th>Segments</th><td><%= (installer.market_segments || []).map(function(s){return String(s||'').replace(/_/g,' ');}).filter(Boolean).join(', ') || '—' %></td></tr>
        <% if ((credentials || []).length) { %>
          <tr><th>Credentials</th><td><% credentials.slice(0,5).forEach(function(c, i){ %><%= i ? ' · ' : '' %><%= c.brand %><% }); %></td></tr>
        <% } %>
        <% if (acceptance) { %><tr><th>Accept rate</th><td><%= acceptance.rate %>% (<%= acceptance.accepted %>/<%= acceptance.total %>)</td></tr><% } %>
      </table>
    </div>
  </div>

  <% if (heroUrl) { %>
    <div class="tp-detail-row">
      <h2>Project log</h2>
      <p>Featured installs. Tabs surface seam, corner, and ceiling shots — where craft shows.</p>
      <div class="tp-detail-grid">
        <% var _items = portfolio.length ? portfolio.slice(0,8) : [{title:'Featured project', image_url: heroUrl, city:installer.city, state:installer.state, year:installer.founded_year}]; %>
        <% _items.forEach(function(p, i){ %>
          <article class="tp-detail-card">
            <div class="label"><span><%= String(i+1).padStart(2,'0') %> · <%= [p.city, p.state, p.year].filter(Boolean).join(' · ') %></span><span class="stamp"><%= (p.brand || 'INSTALL').toUpperCase().slice(0,12) %></span></div>
            <% if (p.image_url) { %><img class="tpl-portfolio-img" src="<%= p.image_url %>" alt="<%= p.title %>" loading="lazy"><% } %>
            <div style="padding:12px 16px;font-family:Inter,sans-serif;font-size:13px"><strong><%= p.title %></strong><% if (p.material) { %> · <%= p.material.replace(/_/g,' ') %><% } %></div>
          </article>
        <% }); %>
      </div>
    </div>
  <% } %>

  <% if (installer.claim_status === 'claimed') { %>
    <section class="tp-cta">
      <p style="margin:0 0 18px;letter-spacing:0.15em;text-transform:uppercase;font-size:13px">Specifying with <%= installer.business_name %>?</p>
      <a href="/installer/<%= installer.slug %>/book">Open the work calendar →</a>
    </section>
  <% } %>
  <%- include('../partials/social-videos') %>

</article>
<%- include('../partials/paper-contributions') %>
<%- include('../partials/coi-request') %>
<%- include('../partials/call-installer') %>
<%- include('../partials/footer') %>