Form Permintaan Harga Tiang<\/title>\n <style>\n \/* CSS yang diisolasi dengan prefix khusus untuk mencegah konflik *\/\n .tiang-form-container {\n --primary-color: #2c3e50;\n --secondary-color: #4ca1af;\n --light-bg: #f8f9fa;\n --border-color: #e0e0e0;\n --text-color: #555;\n --error-color: #e74c3c;\n \n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n max-width: 100%;\n margin: 0 auto;\n padding: 15px;\n background-color: #f5f7fa;\n border-radius: 10px;\n box-sizing: border-box;\n }\n \n .tiang-form-header {\n background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));\n color: white;\n padding: 20px;\n text-align: center;\n border-radius: 8px 8px 0 0;\n margin-bottom: 20px;\n }\n \n .tiang-form-header h2 {\n font-size: 22px;\n margin-bottom: 8px;\n }\n \n .tiang-form-header p {\n font-size: 14px;\n opacity: 0.9;\n }\n \n .tiang-form-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 20px;\n }\n \n @media (min-width: 768px) {\n .tiang-form-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n \n @media (min-width: 1024px) {\n .tiang-form-grid {\n grid-template-columns: 1fr 1fr 1fr;\n }\n }\n \n .tiang-form-section {\n padding: 20px 20px 20px 25px;\n background-color: var(--light-bg);\n border-radius: 8px;\n border-left: 5px solid var(--secondary-color);\n position: relative;\n margin-left: 5px;\n }\n \n .tiang-section-title {\n font-size: 16px;\n color: var(--primary-color);\n margin-bottom: 15px;\n padding-bottom: 8px;\n border-bottom: 1px solid var(--border-color);\n font-weight: 600;\n }\n \n .tiang-form-group {\n margin-bottom: 15px;\n }\n \n .tiang-form-group label {\n display: block;\n margin-bottom: 5px;\n font-size: 14px;\n color: var(--text-color);\n font-weight: 500;\n }\n \n .tiang-form-group select, \n .tiang-form-group input[type=\"text\"],\n .tiang-form-group input[type=\"email\"],\n .tiang-form-group input[type=\"tel\"],\n .tiang-form-group input[type=\"number\"] {\n width: 100%;\n padding: 8px 10px;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n font-size: 14px;\n box-sizing: border-box;\n height: 38px;\n }\n \n .tiang-form-group select:focus, \n .tiang-form-group input:focus {\n border-color: var(--secondary-color);\n outline: none;\n box-shadow: 0 0 0 2px rgba(76, 161, 175, 0.2);\n }\n \n .tiang-custom-input {\n display: none;\n margin-top: 8px;\n }\n \n .tiang-tiang-group {\n margin-bottom: 15px;\n padding: 12px;\n background-color: white;\n border-radius: 6px;\n border: 1px solid var(--border-color);\n }\n \n .tiang-tiang-title {\n font-weight: 600;\n margin-bottom: 10px;\n color: var(--primary-color);\n font-size: 14px;\n }\n \n .tiang-form-row {\n display: flex;\n gap: 10px;\n margin-bottom: 10px;\n align-items: flex-start;\n }\n \n .tiang-form-row > div {\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n \n .tiang-rencana-order-row {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 10px;\n margin-bottom: 10px;\n }\n \n .tiang-rencana-order-row > div {\n display: flex;\n flex-direction: column;\n }\n \n .tiang-submit-btn {\n grid-column: 1 \/ -1;\n width: 100%;\n padding: 12px;\n background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));\n color: white;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 16px;\n font-weight: 600;\n margin-top: 10px;\n transition: all 0.3s;\n }\n \n .tiang-submit-btn:hover {\n background: linear-gradient(90deg, var(--secondary-color), var(--primary-color));\n }\n \n .tiang-required::after {\n content: \" *\";\n color: var(--error-color);\n }\n \n .tiang-error-message {\n color: var(--error-color);\n font-size: 12px;\n margin-top: 5px;\n display: none;\n }\n \n .tiang-form-group.error input,\n .tiang-form-group.error select {\n border-color: var(--error-color);\n }\n \n .tiang-catatan {\n grid-column: 1 \/ -1;\n background-color: #e8f4f8;\n padding: 15px;\n border-radius: 5px;\n border-left: 4px solid #4ca1af;\n margin-top: 20px;\n font-size: 14px;\n line-height: 1.5;\n }\n \n .tiang-catatan p {\n margin-bottom: 10px;\n }\n \n .tiang-catatan strong {\n color: #2c3e50;\n }\n \n \/* Reset untuk elemen dalam form container *\/\n .tiang-form-container * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n \n .tiang-form-container h1,\n .tiang-form-container h2,\n .tiang-form-container h3,\n .tiang-form-container h4,\n .tiang-form-container h5,\n .tiang-form-container h6 {\n margin-top: 0;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"tiang-form-container\">\n <div class=\"tiang-form-header\">\n <h2>Permintaan Harga Tiang<\/h2>\n <p>Isi formulir berikut untuk mendapatkan penawaran harga terbaik<\/p>\n <\/div>\n \n <form class=\"tiang-form-grid\" id=\"tiangPriceRequestForm\">\n \n <div class=\"tiang-form-section\">\n <div class=\"tiang-section-title\">Spesifikasi Umum<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_spesifikasi_umum\" class=\"tiang-required\">Spesifikasi Umum<\/label>\n <select id=\"tiang_spesifikasi_umum\" name=\"spesifikasi_umum\" required>\n <option value=\"\">Pilih Spesifikasi<\/option>\n <option value=\"Telkom\">Telkom<\/option>\n <option value=\"My republik\">My republik<\/option>\n <option value=\"Firsmedia\">Firsmedia<\/option>\n <option value=\"Linknet\">Linknet<\/option>\n <option value=\"XLHome\">XLHome<\/option>\n <option value=\"Wifi\">Wifi<\/option>\n <option value=\"Moratel\">Moratel<\/option>\n <option value=\"ISP sendiri\">ISP sendiri<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_spesifikasi_umum_error\">Silakan isi Spesifikasi Umum<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_pekerjaan\" class=\"tiang-required\">Rencana Pekerjaan<\/label>\n <select id=\"tiang_rencana_pekerjaan\" name=\"rencana_pekerjaan\" required>\n <option value=\"\">Pilih Rencana Pekerjaan<\/option>\n <option value=\"Proyek sendiri\">Proyek sendiri<\/option>\n <option value=\"Sebagai Kontraktor\">Sebagai Kontraktor<\/option>\n <option value=\"Ikut Tender\">Ikut Tender<\/option>\n <option value=\"lain-lain\">Lain-lain<\/option>\n <\/select>\n <div id=\"tiang_custom_rencana_pekerjaan\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Jelaskan rencana pekerjaan Anda\" name=\"custom_rencana_pekerjaan\">\n <\/div>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_pekerjaan_error\">Silakan isi Rencana Pekerjaan<\/div>\n <\/div>\n \n <div class=\"tiang-section-title\">Data Pribadi<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_nama\" class=\"tiang-required\">Nama Anda<\/label>\n <input type=\"text\" id=\"tiang_nama\" name=\"nama\" required>\n <div class=\"tiang-error-message\" id=\"tiang_nama_error\">Silakan isi Nama Anda<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_email\" class=\"tiang-required\">Email<\/label>\n <input type=\"email\" id=\"tiang_email\" name=\"email\" required>\n <div class=\"tiang-error-message\" id=\"tiang_email_error\">Silakan isi Email<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_perusahaan\" class=\"tiang-required\">Nama Perusahaan<\/label>\n <input type=\"text\" id=\"tiang_perusahaan\" name=\"perusahaan\" required>\n <div class=\"tiang-error-message\" id=\"tiang_perusahaan_error\">Silakan isi Nama Perusahaan<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_jabatan\" class=\"tiang-required\">Jabatan<\/label>\n <input type=\"text\" id=\"tiang_jabatan\" name=\"jabatan\" required>\n <div class=\"tiang-error-message\" id=\"tiang_jabatan_error\">Silakan isi Jabatan<\/div>\n <\/div>\n \n <div class=\"tiang-section-title\">Data Kontak<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_kota\" class=\"tiang-required\">Kota<\/label>\n <input type=\"text\" id=\"tiang_kota\" name=\"kota\" required>\n <div class=\"tiang-error-message\" id=\"tiang_kota_error\">Silakan isi Kota<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_website\">Website Perusahaan<\/label>\n <input type=\"text\" id=\"tiang_website\" name=\"website\" placeholder=\"https:\/\/\">\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_tel_kantor\">Tel. Kantor<\/label>\n <input type=\"tel\" id=\"tiang_tel_kantor\" name=\"tel_kantor\">\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_whatsapp\" class=\"tiang-required\">No. WhatsApp<\/label>\n <input type=\"tel\" id=\"tiang_whatsapp\" name=\"whatsapp\" required>\n <div class=\"tiang-error-message\" id=\"tiang_whatsapp_error\">Silakan isi No. WhatsApp<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tiang-form-section\">\n <div class=\"tiang-section-title\">Jenis dan Ukuran Tiang<\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 6 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi6_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi6_segmen\" name=\"tinggi6_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi6_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi6_tebal\" name=\"tinggi6_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi6\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi6\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi6_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi6_jumlah\" name=\"tinggi6_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 7 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi7_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi7_segmen\" name=\"tinggi7_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi7_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi7_tebal\" name=\"tinggi7_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi7\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi7\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi7_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi7_jumlah\" name=\"tinggi7_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 8 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi8_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi8_segmen\" name=\"tinggi8_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <option value=\"3\">3 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi8_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi8_tebal\" name=\"tinggi8_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi8\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi8\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi8_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi8_jumlah\" name=\"tinggi8_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 9 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi9_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi9_segmen\" name=\"tinggi9_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <option value=\"3\">3 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi9_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi9_tebal\" name=\"tinggi9_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi9\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi9\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi9_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi9_jumlah\" name=\"tinggi9_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 13 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi13_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi13_segmen\" name=\"tinggi13_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <option value=\"3\">3 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi13_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi13_tebal\" name=\"tinggi13_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi13\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi13\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi13_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi13_jumlah\" name=\"tinggi13_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tiang-form-section\">\n <div class=\"tiang-section-title\">Pengiriman<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_tujuan_pengiriman\">Tujuan Pengiriman: Kota\/Propinsi<\/label>\n <input type=\"text\" id=\"tiang_tujuan_pengiriman\" name=\"tujuan_pengiriman\" placeholder=\"Contoh: Jakarta, Jawa Barat\">\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_kendaraan\">Kendaraan<\/label>\n <select id=\"tiang_kendaraan\" name=\"kendaraan\">\n <option value=\"\">Pilih Kendaraan<\/option>\n <option value=\"Dari Pemesan\">Dari Pemesan<\/option>\n <option value=\"Dicarikan\">Dicarikan<\/option>\n <option value=\"Antar sampai pelabuhan\">Antar sampai pelabuhan<\/option>\n <option value=\"Lain-lain\">Lain-lain<\/option>\n <\/select>\n <\/div>\n \n <div class=\"tiang-section-title\">Deadline Pekerjaan<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_deadline\">Jumlah Hari<\/label>\n <input type=\"number\" id=\"tiang_deadline\" name=\"deadline\" min=\"1\" max=\"60\" placeholder=\"Contoh: 30\">\n <\/div>\n \n <div class=\"tiang-section-title\">Aksesoris dan Warna<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_aksesoris\">Aksesoris<\/label>\n <select id=\"tiang_aksesoris\" name=\"aksesoris\">\n <option value=\"\">Pilih Aksesoris<\/option>\n <option value=\"Tiang Polos\">Tiang Polos<\/option>\n <option value=\"Label Embosse\">Label Embosse<\/option>\n <option value=\"Label Sablon\">Label Sablon<\/option>\n <\/select>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_warna_kepala\">Warna Kepala<\/label>\n <input type=\"text\" id=\"tiang_warna_kepala\" name=\"warna_kepala\" placeholder=\"Misal: Merah, Biru, dll\">\n <\/div>\n \n <div class=\"tiang-section-title\">Rencana Order<\/div>\n \n <div class=\"tiang-rencana-order-row\">\n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_tanggal\" class=\"tiang-required\">Tanggal<\/label>\n <select id=\"tiang_rencana_tanggal\" name=\"rencana_tanggal\" required>\n <option value=\"\">Pilih Tanggal<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_tanggal_error\">Silakan isi Tanggal<\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_bulan\" class=\"tiang-required\">Bulan<\/label>\n <select id=\"tiang_rencana_bulan\" name=\"rencana_bulan\" required>\n <option value=\"\">Pilih Bulan<\/option>\n <option value=\"1\">Januari<\/option>\n <option value=\"2\">Februari<\/option>\n <option value=\"3\">Maret<\/option>\n <option value=\"4\">April<\/option>\n <option value=\"5\">Mei<\/option>\n <option value=\"6\">Juni<\/option>\n <option value=\"7\">Juli<\/option>\n <option value=\"8\">Agustus<\/option>\n <option value=\"9\">September<\/option>\n <option value=\"10\">Oktober<\/option>\n <option value=\"11\">November<\/option>\n <option value=\"12\">Desember<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_bulan_error\">Silakan isi Bulan<\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_tahun\" class=\"tiang-required\">Tahun<\/label>\n <select id=\"tiang_rencana_tahun\" name=\"rencana_tahun\" required>\n <option value=\"\">Pilih Tahun<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_tahun_error\">Silakan isi Tahun<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"tiang-catatan\">\n <p><strong>Kami akan memberikan harga terbaik untuk penawaran ini.<\/strong> Setelah pesan Anda dikirimkan, kami akan menghitung sesuai kebutuhan Anda, dan segera akan mengirimkan harga melalui WhatsApp dan email yang Anda berikan.<\/p>\n <p><strong>Seluruh pembayaran atas nama PT Tokototower Sukses Makmur, atau NON Faktur Pajak ke CV. Tokotower dot com.<\/strong><\/p>\n <p><strong>Waspada penipuan!<\/strong> Jika ada permintaan pembayaran ke rekening atas nama pribadi, abaikan saja.<\/p>\n <\/div>\n \n <button type=\"button\" class=\"tiang-submit-btn\" onclick=\"tiangSendToWhatsApp()\">Kirim Permintaan Harga<\/button>\n <\/form>\n <\/div>\n\n <script>\n \/\/ Fungsi untuk menampilkan input custom ketika opsi \"custom\" dipilih\n document.querySelectorAll('.tiang-tebal-select').forEach(select => {\n select.addEventListener('change', function() {\n const tiangId = this.id.replace('tiang_tinggi', '').replace('_tebal', '');\n const customInput = document.getElementById(`tiang_custom_tinggi${tiangId}`);\n \n if (this.value === 'custom') {\n customInput.style.display = 'block';\n } else {\n customInput.style.display = 'none';\n }\n });\n });\n \n \/\/ Fungsi untuk menampilkan input custom ketika opsi \"lain-lain\" dipilih pada rencana pekerjaan\n document.getElementById('tiang_rencana_pekerjaan').addEventListener('change', function() {\n const customInput = document.getElementById('tiang_custom_rencana_pekerjaan');\n \n if (this.value === 'lain-lain') {\n customInput.style.display = 'block';\n } else {\n customInput.style.display = 'none';\n }\n });\n \n \/\/ Generate tanggal\n const tanggalSelect = document.getElementById('tiang_rencana_tanggal');\n for (let i = 1; i <= 31; i++) {\n const option = document.createElement('option');\n option.value = i;\n option.textContent = i;\n tanggalSelect.appendChild(option);\n }\n \n \/\/ Generate tahun\n const tahunSelect = document.getElementById('tiang_rencana_tahun');\n const currentYear = new Date().getFullYear();\n for (let i = currentYear; i <= currentYear + 3; i++) {\n const option = document.createElement('option');\n option.value = i;\n option.textContent = i;\n tahunSelect.appendChild(option);\n }\n \n \/\/ Fungsi untuk menampilkan pesan error\n function showError(fieldId, message) {\n const field = document.getElementById(fieldId);\n const errorElement = document.getElementById(fieldId + '_error');\n \n field.parentElement.classList.add('error');\n errorElement.textContent = message;\n errorElement.style.display = 'block';\n }\n \n \/\/ Fungsi untuk menghapus pesan error\n function hideError(fieldId) {\n const field = document.getElementById(fieldId);\n const errorElement = document.getElementById(fieldId + '_error');\n \n field.parentElement.classList.remove('error');\n errorElement.style.display = 'none';\n }\n \n \/\/ Fungsi untuk validasi form\n function validateForm() {\n let isValid = true;\n \n \/\/ Daftar field yang wajib diisi\n const requiredFields = [\n 'tiang_spesifikasi_umum',\n 'tiang_rencana_pekerjaan',\n 'tiang_nama',\n 'tiang_email',\n 'tiang_perusahaan',\n 'tiang_jabatan',\n 'tiang_kota',\n 'tiang_whatsapp',\n 'tiang_rencana_tanggal',\n 'tiang_rencana_bulan',\n 'tiang_rencana_tahun'\n ];\n \n \/\/ Validasi setiap field\n requiredFields.forEach(fieldId => {\n const field = document.getElementById(fieldId);\n if (!field.value) {\n showError(fieldId, 'Silakan isi ' + field.previousElementSibling.textContent.replace(' *', ''));\n isValid = false;\n } else {\n hideError(fieldId);\n }\n });\n \n \/\/ Validasi khusus untuk email\n const emailField = document.getElementById('tiang_email');\n const emailRegex = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n if (emailField.value && !emailRegex.test(emailField.value)) {\n showError('tiang_email', 'Format email tidak valid');\n isValid = false;\n }\n \n return isValid;\n }\n \n \/\/ Fungsi untuk mengirim data ke WhatsApp\n function tiangSendToWhatsApp() {\n \/\/ Validasi form\n if (!validateForm()) {\n alert('Harap isi semua field yang wajib diisi!');\n return;\n }\n \n \/\/ Mengumpulkan data form\n const formData = new FormData(document.getElementById('tiangPriceRequestForm'));\n let message = \"Halo, saya ingin meminta informasi harga tiang dengan spesifikasi berikut:%0A%0A\";\n \n \/\/ Spesifikasi umum\n message += \"*Spesifikasi Umum:*%0A\";\n message += \"- \" + formData.get('spesifikasi_umum') + \"%0A\";\n \n \/\/ Rencana pekerjaan\n let rencanaPekerjaan = formData.get('rencana_pekerjaan');\n if (rencanaPekerjaan === 'lain-lain') {\n rencanaPekerjaan = formData.get('custom_rencana_pekerjaan') || 'Lain-lain (tidak dijelaskan)';\n }\n message += \"- Rencana Pekerjaan: \" + rencanaPekerjaan + \"%0A%0A\";\n \n \/\/ Detail tiang\n message += \"*Detail Tiang:*%0A\";\n \n const tinggiList = ['6', '7', '8', '9', '13'];\n let hasTiangData = false;\n \n tinggiList.forEach(tinggi => {\n const segmen = formData.get(`tinggi${tinggi}_segmen`);\n const tebal = formData.get(`tinggi${tinggi}_tebal`);\n const jumlah = formData.get(`tinggi${tinggi}_jumlah`);\n \n if (segmen || tebal || jumlah) {\n hasTiangData = true;\n message += `*Tiang ${tinggi} Meter:*%0A`;\n message += `- Segmen: ${segmen || 'Tidak ditentukan'}%0A`;\n \n if (tebal === 'custom') {\n const customTebal = formData.get(`custom_tinggi${tinggi}`);\n message += `- Tebal Besi: Custom (${customTebal} mm)%0A`;\n } else {\n message += `- Tebal Besi: ${tebal || 'Tidak ditentukan'} mm%0A`;\n }\n \n message += `- Jumlah: ${jumlah || 'Tidak ditentukan'}%0A%0A`;\n }\n });\n \n if (!hasTiangData) {\n message += \"Tidak ada tiang yang dipesan%0A%0A\";\n }\n \n \/\/ Aksesoris dan warna\n message += \"*Aksesoris dan Warna:*%0A\";\n message += \"- Aksesoris: \" + (formData.get('aksesoris') || 'Tidak ditentukan') + \"%0A\";\n message += \"- Warna Kepala: \" + (formData.get('warna_kepala') || 'Tidak ditentukan') + \"%0A%0A\";\n \n \/\/ Data pribadi\n message += \"*Data Pemesan:*%0A\";\n message += \"- Nama: \" + formData.get('nama') + \"%0A\";\n message += \"- Email: \" + formData.get('email') + \"%0A\";\n message += \"- Perusahaan: \" + formData.get('perusahaan') + \"%0A\";\n message += \"- Jabatan: \" + formData.get('jabatan') + \"%0A\";\n message += \"- Kota: \" + formData.get('kota') + \"%0A\";\n message += \"- Website: \" + (formData.get('website') || 'Tidak ditentukan') + \"%0A\";\n message += \"- Tel. Kantor: \" + (formData.get('tel_kantor') || 'Tidak ditentukan') + \"%0A\";\n message += \"- WhatsApp: \" + formData.get('whatsapp') + \"%0A%0A\";\n \n \/\/ Pengiriman\n message += \"*Pengiriman:*%0A\";\n message += \"- Tujuan: \" + (formData.get('tujuan_pengiriman') || 'Tidak ditentukan') + \"%0A\";\n message += \"- Kendaraan: \" + (formData.get('kendaraan') || 'Tidak ditentukan') + \"%0A%0A\";\n \n \/\/ Deadline\n const deadline = formData.get('deadline');\n if (deadline) {\n message += \"- Deadline: \" + deadline + \" hari%0A%0A\";\n }\n \n \/\/ Rencana order\n const tanggal = formData.get('rencana_tanggal');\n const bulan = formData.get('rencana_bulan');\n const tahun = formData.get('rencana_tahun');\n \n if (tanggal && bulan && tahun) {\n const bulanNames = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', \n 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];\n message += \"- Rencana Order: \" + tanggal + \" \" + bulanNames[bulan-1] + \" \" + tahun + \"%0A\";\n }\n \n \/\/ Nomor WhatsApp tujuan\n const phoneNumber = \"628111150660\";\n \n \/\/ Membuka WhatsApp dengan pesan yang sudah disiapkan\n window.open(`https:\/\/wa.me\/${phoneNumber}?text=${message}`, '_blank');\n }\n \n \/\/ Menambahkan event listener untuk menghilangkan error saat user mulai mengisi\n document.querySelectorAll('.tiang-form-group input, .tiang-form-group select').forEach(field => {\n field.addEventListener('input', function() {\n hideError(this.id);\n });\n \n field.addEventListener('change', function() {\n hideError(this.id);\n });\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Kalkulator Berat Pipa Karbon<\/title>\n <style>\n \/* CSS Terisolasi - Hanya untuk kalkulator *\/\n #pipe-calculator-container * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n \n #pipe-calculator-container {\n max-width: 100%;\n background-color: #fff9e6;\n border-radius: 12px;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n overflow: hidden;\n margin: 20px 0;\n border: 1px solid #e0e0e0;\n }\n \n #pipe-calculator-container .calculator-header {\n background: linear-gradient(135deg, #2c3e50 0%, #4a6491 100%);\n color: white;\n padding: 20px;\n text-align: center;\n }\n \n #pipe-calculator-container .calculator-header h1 {\n font-size: 24px;\n margin-bottom: 8px;\n }\n \n #pipe-calculator-container .calculator-header p {\n opacity: 0.9;\n font-size: 14px;\n }\n \n #pipe-calculator-container .calculator-content {\n padding: 20px;\n }\n \n #pipe-calculator-container .section-title {\n font-size: 18px;\n color: #2c3e50;\n margin-bottom: 15px;\n padding-bottom: 8px;\n border-bottom: 1px solid #f0f0f0;\n }\n \n #pipe-calculator-container .segments-container {\n display: flex;\n gap: 15px;\n margin-bottom: 20px;\n flex-wrap: wrap;\n }\n \n #pipe-calculator-container .segment {\n flex: 1;\n min-width: 200px;\n background-color: #f8f9fa;\n border-radius: 8px;\n padding: 15px;\n box-shadow: 0 2px 6px rgba(0,0,0,0.05);\n }\n \n #pipe-calculator-container .segment-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 12px;\n text-align: center;\n padding-bottom: 8px;\n border-bottom: 1px solid #eaeaea;\n }\n \n #pipe-calculator-container .input-group {\n margin-bottom: 12px;\n }\n \n #pipe-calculator-container .input-group label {\n display: block;\n margin-bottom: 6px;\n font-size: 13px;\n color: #555;\n font-weight: 500;\n }\n \n #pipe-calculator-container .input-group input, \n #pipe-calculator-container .input-group select {\n width: 100%;\n padding: 10px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n }\n \n #pipe-calculator-container .order-section {\n background-color: #f0f7ff;\n padding: 15px;\n border-radius: 8px;\n margin-bottom: 15px;\n }\n \n #pipe-calculator-container .calculate-btn {\n background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);\n color: white;\n border: none;\n padding: 12px;\n font-size: 16px;\n border-radius: 8px;\n cursor: pointer;\n width: 100%;\n font-weight: 600;\n margin-bottom: 15px;\n }\n \n #pipe-calculator-container .results-section {\n background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);\n padding: 20px;\n border-radius: 8px;\n display: none;\n }\n \n #pipe-calculator-container .results-section h3 {\n color: #2c3e50;\n margin-bottom: 15px;\n text-align: center;\n font-size: 18px;\n }\n \n #pipe-calculator-container .segment-results {\n display: flex;\n gap: 10px;\n margin-bottom: 15px;\n flex-wrap: wrap;\n }\n \n #pipe-calculator-container .segment-result {\n flex: 1;\n min-width: 150px;\n background-color: white;\n padding: 12px;\n border-radius: 6px;\n text-align: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.05);\n }\n \n #pipe-calculator-container .weight-value {\n font-size: 18px;\n font-weight: bold;\n color: #2c3e50;\n margin: 8px 0;\n }\n \n #pipe-calculator-container .total-weight {\n font-size: 20px;\n color: #e74c3c;\n margin: 15px 0;\n font-weight: bold;\n padding: 12px;\n background-color: white;\n border-radius: 6px;\n text-align: center;\n }\n \n #pipe-calculator-container .note {\n font-size: 12px;\n color: #7f8c8d;\n text-align: center;\n margin-top: 10px;\n }\n \n \/* Responsive Styles *\/\n @media (max-width: 768px) {\n #pipe-calculator-container .segments-container {\n flex-direction: column;\n }\n \n #pipe-calculator-container .segment {\n min-width: 100%;\n }\n \n #pipe-calculator-container .segment-results {\n flex-direction: column;\n }\n \n #pipe-calculator-container .segment-result {\n min-width: 100%;\n }\n }\n <\/style>\n<\/head>\n<body>\n \n <div id=\"pipe-calculator-container\">\n <div class=\"calculator-header\">\n <h1>Kalkulator Berat Pipa Karbon<\/h1>\n <p>Hitung berat pipa karbon berdasarkan ukuran, ketebalan, dan panjang<\/p>\n <\/div>\n \n <div class=\"calculator-content\">\n <h2 class=\"section-title\">Data Pipa Karbon<\/h2>\n \n <div class=\"segments-container\">\n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 1<\/div>\n <div class=\"input-group\">\n <label for=\"thickness1\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness1\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <option value=\"4.0\">4.0 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size1\">Ukuran Pipa (inci)<\/label>\n <select id=\"size1\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"3.5\">3.5″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <option value=\"8\">8″<\/option>\n <option value=\"10\">10″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length1\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length1\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\">\n <\/div>\n <\/div>\n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 2<\/div>\n <div class=\"input-group\">\n <label for=\"thickness2\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness2\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <option value=\"4.0\">4.0 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size2\">Ukuran Pipa (inci)<\/label>\n <select id=\"size2\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"3.5\">3.5″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <option value=\"8\">8″<\/option>\n <option value=\"10\">10″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length2\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length2\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\">\n <\/div>\n <\/div>\n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 3<\/div>\n <div class=\"input-group\">\n <label for=\"thickness3\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness3\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <option value=\"4.0\">4.0 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size3\">Ukuran Pipa (inci)<\/label>\n <select id=\"size3\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"3.5\">3.5″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <option value=\"8\">8″<\/option>\n <option value=\"10\">10″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length3\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length3\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\">\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"order-section\">\n <h2 class=\"section-title\">Informasi Pesanan<\/h2>\n <div class=\"input-group\">\n <label for=\"quantity\">Jumlah Pipa (unit)<\/label>\n <input type=\"number\" id=\"quantity\" min=\"1\" value=\"1\" placeholder=\"Masukkan jumlah pipa\">\n <\/div>\n <\/div>\n \n <button id=\"calculateBtn\" class=\"calculate-btn\">Hitung Berat Pipa<\/button>\n \n <div id=\"resultsSection\" class=\"results-section\">\n <h3>Hasil Perhitungan<\/h3>\n \n <div id=\"segmentResults\" class=\"segment-results\">\n \n <\/div>\n \n <div id=\"totalPerPipe\" class=\"total-weight\">\n \n <\/div>\n \n <div id=\"totalOrder\" class=\"total-weight\">\n \n <\/div>\n \n <p class=\"note\">* Berat dihitung berdasarkan densitas baja karbon 7850 kg\/m\u00b3<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ JavaScript untuk kalkulator\n document.getElementById('calculateBtn').addEventListener('click', function() {\n \/\/ Densitas baja karbon (kg\/m\u00b3)\n const density = 7850;\n \n let totalWeight = 0;\n let segmentDetails = [];\n \n \/\/ Hitung berat untuk setiap segmen\n for (let i = 1; i <= 3; i++) {\n const thickness = parseFloat(document.getElementById('thickness' + i).value);\n const size = parseFloat(document.getElementById('size' + i).value);\n const length = parseFloat(document.getElementById('length' + i).value);\n \n \/\/ Lewati segmen jika tidak ada data\n if (isNaN(thickness) || isNaN(size) || isNaN(length) || length <= 0) {\n segmentDetails.push(null);\n continue;\n }\n \n \/\/ Konversi inci ke meter untuk diameter luar\n const outerDiameter = size * 0.0254;\n \n \/\/ Konversi mm ke meter untuk ketebalan\n const thicknessMeter = thickness \/ 1000;\n \n \/\/ Hitung diameter dalam\n const innerDiameter = outerDiameter - (2 * thicknessMeter);\n \n \/\/ Hitung luas penampang pipa\n const crossSectionalArea = Math.PI * (Math.pow(outerDiameter\/2, 2) - Math.pow(innerDiameter\/2, 2));\n \n \/\/ Hitung volume pipa\n const volume = crossSectionalArea * length;\n \n \/\/ Hitung berat pipa (kg)\n const weight = volume * density;\n \n totalWeight += weight;\n segmentDetails.push({\n thickness: thickness,\n size: size,\n length: length,\n weight: weight\n });\n }\n \n \/\/ Ambil jumlah pesanan\n const quantity = parseInt(document.getElementById('quantity').value) || 1;\n \n \/\/ Hitung berat total\n const totalOrderWeight = totalWeight * quantity;\n \n \/\/ Tampilkan hasil\n const segmentResults = document.getElementById('segmentResults');\n const totalPerPipe = document.getElementById('totalPerPipe');\n const totalOrder = document.getElementById('totalOrder');\n const resultsSection = document.getElementById('resultsSection');\n \n let segmentHTML = '';\n \n for (let i = 0; i < segmentDetails.length; i++) {\n if (segmentDetails[i]) {\n segmentHTML += `\n <div class=\"segment-result\">\n <h4>Segmen ${i+1}<\/h4>\n <p>Tebal: ${segmentDetails[i].thickness} mm<\/p>\n <p>Ukuran: ${segmentDetails[i].size}\"<\/p>\n <p>Panjang: ${segmentDetails[i].length} m<\/p>\n <p class=\"weight-value\">${segmentDetails[i].weight.toFixed(2)} kg<\/p>\n <\/div>\n `;\n }\n }\n \n \/\/ Jika tidak ada segmen yang diisi\n if (segmentHTML === '') {\n segmentHTML = '<p>Silakan isi data untuk setidaknya satu segmen pipa<\/p>';\n }\n \n segmentResults.innerHTML = segmentHTML;\n totalPerPipe.textContent = `Berat Total per Pipa: ${totalWeight.toFixed(2)} kg`;\n totalOrder.textContent = `Berat Total Pesanan (${quantity} pipa): ${totalOrderWeight.toFixed(2)} kg`;\n \n resultsSection.style.display = 'block';\n \n \/\/ Scroll ke hasil\n resultsSection.scrollIntoView({ behavior: 'smooth' });\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n\r\n<p> <\/p>\r\n<p> <\/p>\r\n<p><style>\r\n table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n }\r\n table, th, td {\r\n border: 1px solid black;\r\n }\r\n th, td {\r\n padding: 8px;\r\n text-align: left;\r\n }\r\n <\/style><\/p>\r\n<h2>Tabel Harga Tiang<\/h2>\r\n\n\r\n<table style=\"height: 403px;\" width=\"386\">\r\n<tbody>\r\n<tr>\r\n<td width=\"101\">Tinggi Tiang<\/td>\r\n<td width=\"137\">Diameter<\/td>\r\n<td width=\"95\">\u00a0Harga (Rp.)\u00a0<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>2.5 inch full<\/td>\r\n<td>Rp. 500,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>3 inch full<\/td>\r\n<td>Rp. 550,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>4 inch full<\/td>\r\n<td>Rp. 650,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>5 inch full<\/td>\r\n<td>Rp. 800,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>7 Meter<\/td>\r\n<td>3 inch 2.5 inch<\/td>\r\n<td>Rp. 750,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>7 Meter<\/td>\r\n<td>4 inch 3 inch<\/td>\r\n<td>Rp. 850,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>7 Meter<\/td>\r\n<td>5 inch 4 inch<\/td>\r\n<td>Rp. 1,000,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>9 Meter<\/td>\r\n<td>3 inch 2.5 inch<\/td>\r\n<td>Rp. 1,150,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>9 Meter<\/td>\r\n<td>4 inch 3 inch<\/td>\r\n<td>Rp. 1,250,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>9 Meter<\/td>\r\n<td>5 inch 4 inch<\/td>\r\n<td>Rp. 1,400,000<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n<p>* Harga FRANKO PABRIK, diluar biaya dan jasa pengiriman. Harga diatas adalah untuk pemesanan minimal 100 batang. Harga dapat berubah sewaktu waktu menyesuaikan Kurs dollar. Untuk mengetahui harga saat ini, cara & syarat pemesanan hubungi marketing kami.\u00a0<\/p>\r\n\n\n\n\n\n\n\n<h4 style=\"cursor: text;\">Jenis Tiang Fiber Optik<\/h4>\n<p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong>Tiang fiber optik hadir dalam beberapa jenis, tergantung fungsinya:<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px; cursor: text;\"><strong>* <span style=\"cursor: text;\"><u>Tiang Distribusi<\/u><\/span><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Menghubungkan kabel dari jaringan utama ke pelanggan. Biasanya ramping dan dipasang lebih rapat.<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Aplikasi: Tiang tinggi, 6 meter, 7 Meter dan 8 Meter<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong>* <u>Tiang Transmisi<\/u><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong style=\"cursor: text;\"> Dirancang untuk jarak jauh antar wilayah. Lebih tinggi, Menyebrtang Jalan raya yang padat dan kuat.<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Aplikasi: Tiang tinggi, 9 Meter dan 12 Meter<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong style=\"cursor: text;\">* <u>Tiang Intermediate<\/u><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Menopang kabel di tikungan atau sambungan agar tetap stabil dan rapi.<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Aplikasi: Biasanya dibedakan dengan ketebalan Tiang. Jika kedua tiang diatas tebalnya 2,5 mm, maka Tiang ini disarankan diatas 3 mm<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong style=\"cursor: text;\">*<u> Tiang Multifungsi<\/u><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Selain kabel optik, juga bisa menopang CCTV, lampu jalan, hingga sensor IoT.<\/strong><\/span><\/p><p><br><\/p>\n\n\n\n\n\n\r\n<p>WARNA <span style=\"font-weight: normal;\">SESUKA HATI<\/span><\/p>\r\n\n\r\n<p><strong>TIDAK ADA BIAYA TAMBAHAN<\/strong><\/p>\r\n\n\n\r\n<p><strong><em>Pabrikasi Tiang Berkualitas di Bekasi, Jawa Barat<\/em><\/strong><\/p>\r\n<p>Pabrikasi tiang kami yang berlokasi di Bekasi, Jawa Barat, adalah solusi terbaik untuk kebutuhan tiang Fiber Optik dan Tiang Peju berbagai ukuran. Kami mengutamakan kualitas dengan dukungan mesin-mesin modern yang memastikan setiap produk memiliki standar tinggi. Dalam setiap proses produksi, kami memanfaatkan teknologi terkini untuk menghasilkan tiang yang kokoh, tahan lama, dan sesuai spesifikasi kebutuhan pelanggan.<\/p>\r\n<h3>Mesin Modern <br \/>untuk Produksi Berkualitas<\/h3>\r\n<p>Dalam operasional kami, mesin-mesin modern memainkan peran penting. Dengan peralatan canggih ini, kami dapat memproduksi tiang Fiber Optik dengan berbagai ukuran, termasuk panjang 6 meter, 7 meter, 9 meter, hingga ukuran khusus (custom). Selain itu, kami juga memproduksi Tiang Peju yang andal untuk berbagai keperluan infrastruktur. Proses yang presisi memastikan setiap produk memenuhi standar teknis dan estetika, memberikan nilai tambah bagi proyek pelanggan.<\/p>\r\n<h3>Tim Ahli Berpengalaman<\/h3>\r\n<p>Kami bangga memiliki tim ahli pengelasan yang telah berpengalaman puluhan tahun. Keahlian mereka menjamin setiap sambungan pada tiang memiliki kekuatan optimal dan ketahanan maksimal. Dengan kombinasi teknologi modern dan tenaga ahli, pabrikasi kami mampu memenuhi kebutuhan proyek kecil hingga besar dengan hasil yang konsisten.<\/p>\r\n<h3>Keuntungan Berbelanja <br \/>di Workshop Kami<\/h3>\r\n<p>Untuk pelanggan yang memilih berbelanja langsung di workshop kami, kami menawarkan layanan tambahan yang istimewa. Setiap pembelian tiang akan mendapatkan <strong>gratis custom pengecatan<\/strong>. Pelanggan dapat memilih warna sesuai keinginan tanpa biaya tambahan, memberikan fleksibilitas untuk mencocokkan produk dengan kebutuhan proyek mereka.<\/p>\r\n<p>Selain itu, kami memberikan <strong>potongan harga sebesar Rp 10 ribu per barang yang dipesan<\/strong> bagi pelanggan yang bersedia memberikan ulasan terbaik dan bintang lima di Google Maps untuk produk kami. Sebuah kesempatan yang sangat menarik, terutama jika Anda memesan dalam jumlah besar. Contohnya, dengan pemesanan minimal 100 batang, Anda akan mendapatkan potongan harga hingga <strong>Rp 1 juta<\/strong>!<\/p>\r\n<h3>Mengapa Memilih Kami?<\/h3>\r\n<ol>\r\n<li><strong>Kualitas Terjamin:<\/strong> Tiang yang diproduksi menggunakan bahan berkualitas tinggi dan proses modern.<\/li>\r\n<li><strong>Ahli Profesional:<\/strong> Tim pengelasan berpengalaman yang memastikan setiap produk tahan lama.<\/li>\r\n<li><strong>Harga Kompetitif:<\/strong> Harga langsung dari pabrik dengan berbagai penawaran diskon menarik.<\/li>\r\n<li><strong>Pelayanan Tambahan:<\/strong> Gratis custom pengecatan untuk semua tiang yang dipesan di workshop.<\/li>\r\n<li><strong>Potongan Harga:<\/strong> Peluang mendapatkan potongan besar melalui ulasan pelanggan di Google Maps.<\/li>\r\n<\/ol>\r\n<h3>Pemesanan Mudah dan Cepat<\/h3>\r\n<p>Kami memahami bahwa proyek Anda memerlukan produk tepat waktu dan dalam kondisi terbaik. Oleh karena itu, kami menyediakan layanan pemesanan yang cepat dan responsif. Cukup hubungi tim kami untuk berkonsultasi mengenai kebutuhan Anda, dan kami akan memastikan proses produksi hingga pengiriman berjalan lancar.<\/p>\r\n<h3>Hubungi Kami Sekarang<\/h3>\r\n<p> <\/p>\r\n<p>Untuk informasi lebih lanjut dan pemesanan, Anda dapat menghubungi kami melalui nomor kontak atau mengunjungi workshop kami di Bekasi. Kami siap membantu Anda mendapatkan tiang Fiber Optik dan Tiang Pju terbaik dengan harga terjangkau. Jangan lewatkan kesempatan untuk mendapatkan produk berkualitas dengan penawaran menarik dari kami!<\/p>\r\n\n\r\n<p><span style=\"font-size: 14.4px;\">Terima kasih telah berkunjung. Kami sangat menghargai jika Anda bersedia memberikan ulasan di Google Maps. Dapatkan potongan Rp 10.000 dari setiap batang yang anda beli.\u00a0 <a href=\"https:\/\/maps.app.goo.gl\/8pjfmTAbtTUfQMhV8\">Klik link berikut<\/a> untuk menulis ulasan.\u00a0<\/span><\/p>\r\n\n\n\n\n\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\n\r\n<h3><strong><span style=\"font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-size: 20.2px; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal;\">Apa yang Membuat Harga Tiang Fiber Optik Berbeda?<\/span><\/strong><\/h3>\r\n\n\r\n<p><span style=\"font-size: 14.4px;\">Bagi Anda yang sedang mencari tiang Fiber Optik (FO), mungkin pernah bertanya-tanya, \u201cMengapa harga tiang berbeda-beda?\u201d Beberapa faktor utama memengaruhi perbedaan harga ini. Memahami faktor-faktor ini akan membantu Anda membuat keputusan yang tepat sesuai dengan kebutuhan Anda. Berikut adalah faktor-faktor utama yang memengaruhi harga tiang Fiber Optik:<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">1. Panjang Tiang<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Panjang tiang menjadi faktor pertama yang memengaruhi harga. Tiang Fiber Optik tersedia dalam berbagai panjang, seperti 6 meter, 7 meter, dan 9 meter.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Tiang 6 meter: Ideal untuk kebutuhan instalasi dengan ketinggian yang tidak terlalu tinggi.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Tiang 7 meter: Cocok untuk kebutuhan menengah, menawarkan keseimbangan antara ketinggian dan harga.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Tiang 9 meter: Biasanya digunakan untuk proyek besar atau instalasi yang membutuhkan ketinggian lebih.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Semakin panjang tiang, semakin banyak bahan baku yang digunakan, yang otomatis meningkatkan harga produk.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">2. Segmen Tiang<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Segmen tiang adalah istilah yang digunakan untuk menggambarkan ukuran diameter pipa yang digunakan pada tiang. Tiang Fiber Optik biasanya terdiri dari beberapa segmen pipa dengan ukuran yang bervariasi, seperti:<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 5 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 4 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 3 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 2,5 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Setiap segmen ini memiliki fungsi untuk memberikan kekuatan struktural yang optimal. Semakin banyak segmen yang digunakan dan semakin besar diameter pipa, maka semakin tinggi pula harga tiang tersebut. Ini karena kebutuhan bahan baku yang lebih banyak dan proses produksi yang lebih kompleks.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">3. Ketebalan Tiang Fiber Optik<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Selain panjang dan segmen, ketebalan pipa juga menjadi faktor penting. Tiang Fiber Optik yang kami produksi tersedia dalam ketebalan:<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 2 mm<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 2,5 mm<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 3,5 mm<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Semakin tebal pipa, semakin kuat tiang tersebut, namun juga semakin tinggi harga produksinya. Pemilihan ketebalan tergantung pada kebutuhan proyek Anda.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">4. Berat Pipa<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Berat pipa sangat bergantung pada kombinasi panjang, segmen, dan ketebalan pipa yang digunakan. Semakin berat pipa, biaya produksi dan pengiriman juga akan meningkat.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">5. Ornamen Tambahan<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Harga tiang Fiber Optik akan bertambah jika dilengkapi dengan ornamen seperti:<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Emblem atau Logo: Menambahkan logo khusus pada tiang untuk identitas.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Lakop (Penutup Tambahan): Penutup tambahan pada body pipa. Ukuran lakop disesuaikan dengan panjang besi tambahan.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Fitur tambahan ini memberikan nilai estetika dan fungsional pada tiang, namun menambah biaya.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">6. Warna Identitas Tiang<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Kami menyediakan fasilitas gratis untuk satu warna identitas pada tiang. Jika Anda menginginkan lebih dari satu warna, akan dikenakan biaya tambahan untuk setiap warna berikutnya.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">7. Biaya Pengiriman<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Harga yang kami tawarkan adalah franko pabrik, artinya belum termasuk biaya pengiriman ke lokasi Anda. Biaya pengiriman akan dihitung terpisah sesuai jarak dan kebutuhan transportasi.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">8. Pajak<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Harga yang tertera belum termasuk pajak. Jika Anda membutuhkan faktur pajak, akan ditambahkan 11% dari total biaya pembelian produk. Harap dicatat bahwa biaya pengiriman tidak dimasukkan ke dalam faktur pajak.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\"><strong><u>\u00a0<\/u><\/strong><\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\"><u>Mengapa Penting Memahami Faktor Ini?<\/u><\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Dengan mengetahui berbagai faktor di atas, Anda dapat memilih tiang Fiber Optik yang sesuai dengan kebutuhan teknis dan anggaran Anda. Misalnya, jika Anda memiliki proyek besar dengan kebutuhan ketinggian tertentu, tiang yang lebih panjang, tebal, dan memiliki segmen lebih banyak mungkin menjadi pilihan terbaik. Namun, jika anggaran terbatas, Anda bisa memilih kombinasi yang lebih sederhana tanpa mengorbankan kualitas.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Kami di tiangjalan.com menyediakan berbagai pilihan tiang Fiber Optik dengan kualitas terbaik dan harga yang kompetitif. Jangan ragu untuk menghubungi kami untuk konsultasi atau penawaran harga khusus!<\/span><\/p>\r\n<p> <\/p>\r\n\n\n\n\n\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\n\n\n\r\n<h4>Harga Khusus,Anggota APJII<\/h4>\r\n\n\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Kami melayani pemesanan retail maupun partai besar dengan jaminan kualitas dan hasil terbaik. Kepuasan Anda adalah prioritas kami, dan kami siap membantu mewujudkan kebutuhan konstruksi tiang Anda dengan layanan profesional.<\/p>\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Hubungi Kami untuk Informasi Lebih Lanjut:\u00a0Jika Anda memerlukan spesifikasi detail atau ingin mengetahui penawaran harga terbaik,<br \/>jangan ragu untuk menghubungi kami:<\/p>\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Ayu<br \/>WhatsApp:\u00a008111150660<\/p>\r\n<p style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">\u00a0<\/p>\r\n<p style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-align: start; text-decoration-style: initial;\">\u00a0<\/p>\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Kami siap melayani Anda dengan sepenuh hati dan menjadi solusi terbaik untuk kebutuhan konstruksi tiang Anda. Terima kasih telah mengunjungi website kami!<br \/><br \/><\/p>\r\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\r\n<p style=\"text-align: center;\">Dapatkan harga khusus, bagi Anggota <strong>APJII<\/strong>. Silakan hubungi\u00a0 marketing kami, isi data yang tersedia, kirimkan kepada kami sekarang. Klik tombol dibawah ini untuk terhubung<\/p>\r\n\n\n\n\n\r\n<h5>Mitra Kerja Internet<\/h5>\r\n\n\n\n\n\n\n\n\n\n\n<!DOCTYPE html>\n<html>\n<head>\n <title>Kalkulator Berat Pipa Karbon<\/title>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n \n <style>\n \/* RESET STYLES *\/\n #pipe-calculator-container, \n #pipe-calculator-container * {\n box-sizing: border-box !important;\n margin: 0 !important;\n padding: 0 !important;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;\n line-height: 1.4 !important;\n }\n \n #pipe-calculator-container {\n max-width: 100% !important;\n background-color: #fff9e6 !important;\n border-radius: 12px !important;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;\n overflow: hidden !important;\n margin: 20px 0 !important;\n border: 1px solid #e0e0e0 !important;\n }\n \n \/* HEADER STYLES *\/\n #pipe-calculator-container .calculator-header {\n background: linear-gradient(135deg, #2c3e50 0%, #4a6491 100%) !important;\n color: white !important;\n padding: 20px !important;\n text-align: center !important;\n }\n \n #pipe-calculator-container .calculator-header h1 {\n font-size: 24px !important;\n margin-bottom: 8px !important;\n font-weight: 600 !important;\n }\n \n #pipe-calculator-container .calculator-header p {\n opacity: 0.9 !important;\n font-size: 14px !important;\n }\n \n \/* CONTENT STYLES *\/\n #pipe-calculator-container .calculator-content {\n padding: 20px !important;\n }\n \n #pipe-calculator-container .section-title {\n font-size: 18px !important;\n color: #2c3e50 !important;\n margin-bottom: 15px !important;\n padding-bottom: 8px !important;\n border-bottom: 1px solid #f0f0f0 !important;\n font-weight: 600 !important;\n }\n \n \/* SEGMENTS STYLES *\/\n #pipe-calculator-container .segments-container {\n display: flex !important;\n gap: 15px !important;\n margin-bottom: 20px !important;\n flex-wrap: wrap !important;\n }\n \n #pipe-calculator-container .segment {\n flex: 1 !important;\n min-width: 200px !important;\n background-color: #f8f9fa !important;\n border-radius: 8px !important;\n padding: 15px !important;\n box-shadow: 0 2px 6px rgba(0,0,0,0.05) !important;\n }\n \n #pipe-calculator-container .segment-title {\n font-size: 16px !important;\n font-weight: 600 !important;\n color: #2c3e50 !important;\n margin-bottom: 12px !important;\n text-align: center !important;\n padding-bottom: 8px !important;\n border-bottom: 1px solid #eaeaea !important;\n }\n \n \/* INPUT STYLES *\/\n #pipe-calculator-container .input-group {\n margin-bottom: 12px !important;\n }\n \n #pipe-calculator-container .input-group label {\n display: block !important;\n margin-bottom: 6px !important;\n font-size: 13px !important;\n color: #555 !important;\n font-weight: 500 !important;\n }\n \n #pipe-calculator-container .input-group input, \n #pipe-calculator-container .input-group select,\n #pipe-calculator-container .input-group textarea {\n width: 100% !important;\n padding: 10px !important;\n border: 1px solid #ddd !important;\n border-radius: 6px !important;\n font-size: 14px !important;\n background: white !important;\n }\n \n #pipe-calculator-container .input-group textarea {\n resize: vertical !important;\n min-height: 80px !important;\n font-family: inherit !important;\n }\n \n \/* ORDER SECTION *\/\n #pipe-calculator-container .order-section {\n background-color: #f0f7ff !important;\n padding: 15px !important;\n border-radius: 8px !important;\n margin-bottom: 15px !important;\n }\n \n \/* BUTTON STYLES *\/\n #pipe-calculator-container .button-group {\n display: flex !important;\n gap: 10px !important;\n margin-bottom: 15px !important;\n clear: both;\n }\n \n #pipe-calculator-container .calculate-btn, \n #pipe-calculator-container .save-btn {\n flex: 1 !important;\n color: white !important;\n border: none !important;\n padding: 12px !important;\n font-size: 16px !important;\n border-radius: 8px !important;\n cursor: pointer !important;\n font-weight: 600 !important;\n transition: all 0.3s ease !important;\n position: relative !important;\n z-index: 10 !important;\n }\n \n #pipe-calculator-container .calculate-btn:hover,\n #pipe-calculator-container .save-btn:hover {\n transform: translateY(-2px) !important;\n box-shadow: 0 4px 8px rgba(0,0,0,0.2) !important;\n }\n \n #pipe-calculator-container .calculate-btn {\n background: linear-gradient(135deg, #3498db 0%, #2980b9 100%) !important;\n }\n \n #pipe-calculator-container .save-btn {\n background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;\n }\n \n \/* RESULTS SECTION *\/\n #pipe-calculator-container .results-section {\n background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%) !important;\n padding: 20px !important;\n border-radius: 8px !important;\n display: none !important;\n }\n \n #pipe-calculator-container .results-section h3 {\n color: #2c3e50 !important;\n margin-bottom: 15px !important;\n text-align: center !important;\n font-size: 18px !important;\n font-weight: 600 !important;\n }\n \n \/* SEGMENT RESULTS *\/\n #pipe-calculator-container .segment-results {\n display: flex !important;\n gap: 10px !important;\n margin-bottom: 15px !important;\n flex-wrap: wrap !important;\n }\n \n #pipe-calculator-container .segment-result {\n flex: 1 !important;\n min-width: 150px !important;\n background-color: white !important;\n padding: 12px !important;\n border-radius: 6px !important;\n text-align: center !important;\n box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;\n }\n \n #pipe-calculator-container .weight-value {\n font-size: 18px !important;\n font-weight: bold !important;\n color: #2c3e50 !important;\n margin: 8px 0 !important;\n }\n \n #pipe-calculator-container .total-weight {\n font-size: 20px !important;\n color: #e74c3c !important;\n margin: 15px 0 !important;\n font-weight: bold !important;\n padding: 12px !important;\n background-color: white !important;\n border-radius: 6px !important;\n text-align: center !important;\n }\n \n \/* NOTE STYLES *\/\n #pipe-calculator-container .note {\n font-size: 12px !important;\n color: #7f8c8d !important;\n text-align: center !important;\n margin-top: 10px !important;\n }\n \n \/* RADIO GROUP *\/\n #pipe-calculator-container .radio-group {\n display: flex !important;\n gap: 15px !important;\n margin-top: 5px !important;\n }\n \n #pipe-calculator-container .radio-option {\n display: flex !important;\n align-items: center !important;\n gap: 5px !important;\n }\n \n #pipe-calculator-container .radio-option input[type=\"radio\"] {\n width: auto !important;\n }\n \n \/* COST BREAKDOWN *\/\n #pipe-calculator-container .cost-breakdown {\n background-color: #f8f9fa !important;\n border-radius: 8px !important;\n padding: 15px !important;\n margin-bottom: 15px !important;\n }\n \n #pipe-calculator-container .cost-item {\n display: flex !important;\n justify-content: space-between !important;\n margin-bottom: 8px !important;\n padding-bottom: 8px !important;\n border-bottom: 1px dashed #e0e0e0 !important;\n }\n \n #pipe-calculator-container .cost-item:last-child {\n border-bottom: none !important;\n font-weight: bold !important;\n font-size: 16px !important;\n color: #2c3e50 !important;\n }\n \n \/* PAYMENT INFO *\/\n #pipe-calculator-container .payment-info {\n background-color: #fff3cd !important;\n border: 1px solid #ffeaa7 !important;\n border-radius: 8px !important;\n padding: 15px !important;\n margin-top: 15px !important;\n }\n \n #pipe-calculator-container .payment-info h4 {\n color: #856404 !important;\n margin-bottom: 10px !important;\n font-weight: 600 !important;\n }\n \n #pipe-calculator-container .payment-details {\n margin-top: 10px !important;\n }\n \n #pipe-calculator-container .payment-details p {\n margin-bottom: 5px !important;\n font-size: 14px !important;\n }\n \n \/* ACCESSORIES SECTION *\/\n #pipe-calculator-container .accessories-section {\n background-color: #fff0f5 !important;\n padding: 15px !important;\n border-radius: 8px !important;\n margin-bottom: 15px !important;\n }\n \n #pipe-calculator-container .accessory-item {\n display: flex !important;\n justify-content: space-between !important;\n align-items: center !important;\n margin-bottom: 10px !important;\n padding: 10px !important;\n background-color: white !important;\n border-radius: 6px !important;\n border: 1px solid #e0e0e0 !important;\n }\n \n #pipe-calculator-container .accessory-label {\n flex: 0 0 150px !important;\n font-weight: 500 !important;\n }\n \n #pipe-calculator-container .accessory-price {\n flex: 0 0 120px !important;\n margin: 0 10px !important;\n }\n \n #pipe-calculator-container .accessory-price input {\n width: 100% !important;\n padding: 8px !important;\n border: 1px solid #ddd !important;\n border-radius: 4px !important;\n text-align: right !important;\n }\n \n #pipe-calculator-container .accessory-item-textarea {\n align-items: flex-start !important;\n }\n \n #pipe-calculator-container .accessory-textarea-container {\n flex: 1 !important;\n margin: 0 10px !important;\n display: flex !important;\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .accessory-textarea-container textarea {\n width: 100% !important;\n padding: 8px !important;\n border: 1px solid #ddd !important;\n border-radius: 4px !important;\n resize: vertical !important;\n min-height: 60px !important;\n font-family: inherit !important;\n font-size: 14px !important;\n }\n \n #pipe-calculator-container .accessory-total {\n flex: 0 0 100px !important;\n text-align: right !important;\n font-weight: bold !important;\n }\n \n \/* ORDER DETAILS *\/\n #pipe-calculator-container .order-details {\n background-color: #e8f4fd !important;\n border-radius: 8px !important;\n padding: 15px !important;\n margin-top: 15px !important;\n }\n \n #pipe-calculator-container .order-details h4 {\n color: #2c3e50 !important;\n margin-bottom: 10px !important;\n font-weight: 600 !important;\n }\n \n #pipe-calculator-container .segment-detail {\n margin-bottom: 8px !important;\n padding: 8px !important;\n background-color: white !important;\n border-radius: 4px !important;\n border-left: 4px solid #3498db !important;\n }\n \n \/* RESPONSIVE STYLES *\/\n @media (max-width: 768px) {\n #pipe-calculator-container .segments-container {\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .segment {\n min-width: 100% !important;\n }\n \n #pipe-calculator-container .segment-results {\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .segment-result {\n min-width: 100% !important;\n }\n \n #pipe-calculator-container .button-group {\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .accessory-item {\n flex-direction: column !important;\n align-items: flex-start !important;\n }\n \n #pipe-calculator-container .accessory-label {\n flex: 1 !important;\n margin-bottom: 5px !important;\n }\n \n #pipe-calculator-container .accessory-price {\n flex: 1 !important;\n width: 100% !important;\n margin: 5px 0 !important;\n }\n \n #pipe-calculator-container .accessory-textarea-container {\n width: 100% !important;\n margin: 5px 0 !important;\n }\n \n #pipe-calculator-container .accessory-total {\n flex: 1 !important;\n width: 100% !important;\n text-align: left !important;\n margin-top: 5px !important;\n }\n \n #pipe-calculator-container .radio-group {\n flex-direction: column !important;\n gap: 8px !important;\n }\n }\n\n \/* PRINT STYLES *\/\n @media print {\n body * {\n visibility: hidden;\n }\n \n #pipe-calculator-container, #pipe-calculator-container * {\n visibility: visible;\n }\n \n #pipe-calculator-container {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n }\n \n .button-group {\n display: none !important;\n }\n }\n \n \/* Loading indicator *\/\n .loading {\n display: inline-block;\n width: 20px;\n height: 20px;\n border: 3px solid rgba(255,255,255,.3);\n border-radius: 50%;\n border-top-color: #fff;\n animation: spin 1s ease-in-out infinite;\n }\n \n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n \n \/* Status message *\/\n .status-message {\n padding: 10px;\n margin: 10px 0;\n border-radius: 5px;\n text-align: center;\n display: none;\n }\n \n .status-message.error {\n background-color: #f8d7da;\n color: #721c24;\n border: 1px solid #f5c6cb;\n }\n \n .status-message.success {\n background-color: #d4edda;\n color: #155724;\n border: 1px solid #c3e6cb;\n }\n <\/style>\n<\/head>\n<body>\n \n <div id=\"pipe-calculator-container\">\n <div class=\"calculator-header\">\n <h1>Kalkulator Berat Pipa Karbon<\/h1>\n <p>Hitung berat pipa karbon berdasarkan ukuran, ketebalan, dan panjang<\/p>\n <\/div>\n \n <div id=\"statusMessage\" class=\"status-message\"><\/div>\n \n <div class=\"calculator-content\">\n \n <h2 class=\"section-title\">Data Pipa Karbon<\/h2>\n \n <div class=\"segments-container\">\n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 1<\/div>\n <div class=\"input-group\">\n <label for=\"thickness1\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness1\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"1.9\">1.9 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.1\">2.1 mm<\/option>\n <option value=\"2.2\">2.2 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.4\">2.4 mm<\/option>\n <option value=\"2.5\">2.5 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.7\">2.7 mm<\/option>\n <option value=\"2.8\">2.8 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.0\">3.0 mm<\/option>\n <option value=\"3.1\">3.1 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.3\">3.3 mm<\/option>\n <option value=\"3.4\">3.4 mm<\/option>\n <option value=\"3.5\">3.5 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size1\">Ukuran Pipa (inci)<\/label>\n <select id=\"size1\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2\">2″<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length1\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length1\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\" \/>\n <\/div>\n <\/div>\n \n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 2<\/div>\n <div class=\"input-group\">\n <label for=\"thickness2\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness2\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"1.9\">1.9 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.1\">2.1 mm<\/option>\n <option value=\"2.2\">2.2 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.4\">2.4 mm<\/option>\n <option value=\"2.5\">2.5 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.7\">2.7 mm<\/option>\n <option value=\"2.8\">2.8 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.0\">3.0 mm<\/option>\n <option value=\"3.1\">3.1 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.3\">3.3 mm<\/option>\n <option value=\"3.4\">3.4 mm<\/option>\n <option value=\"3.5\">3.5 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size2\">Ukuran Pipa (inci)<\/label>\n <select id=\"size2\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2\">2″<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length2\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length2\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\" \/>\n <\/div>\n <\/div>\n \n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 3<\/div>\n <div class=\"input-group\">\n <label for=\"thickness3\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness3\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"1.9\">1.9 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.1\">2.1 mm<\/option>\n <option value=\"2.2\">2.2 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.4\">2.4 mm<\/option>\n <option value=\"2.5\">2.5 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.7\">2.7 mm<\/option>\n <option value=\"2.8\">2.8 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.0\">3.0 mm<\/option>\n <option value=\"3.1\">3.1 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.3\">3.3 mm<\/option>\n <option value=\"3.4\">3.4 mm<\/option>\n <option value=\"3.5\">3.5 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size3\">Ukuran Pipa (inci)<\/label>\n <select id=\"size3\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2\">2″<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length3\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length3\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\" \/>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"order-section\">\n <h2 class=\"section-title\">Informasi Pesanan<\/h2>\n <div class=\"input-group\">\n <label for=\"quantity\">Jumlah Pipa (unit)<\/label>\n <input type=\"number\" id=\"quantity\" min=\"1\" value=\"1\" placeholder=\"Masukkan jumlah pipa\" \/>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"finish\">Jenis Finishing<\/label>\n <div class=\"radio-group\">\n <div class=\"radio-option\">\n <input type=\"radio\" id=\"galvanis\" name=\"finish\" value=\"galvanis\" checked \/>\n <label for=\"galvanis\">Galvanis (+Rp 14.300\/kg)<\/label>\n <\/div>\n <div class=\"radio-option\">\n <input type=\"radio\" id=\"cat\" name=\"finish\" value=\"cat\" \/>\n <label for=\"cat\">Cat Hitam (Gratis)<\/label>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"biayaKirim\">Biaya Kirim (Rp)<\/label>\n <input type=\"number\" id=\"biayaKirim\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya pengiriman\" \/>\n <\/div>\n\n <div class=\"input-group\">\n <label for=\"biayaTol\">Biaya Tol (Rp)<\/label>\n <input type=\"number\" id=\"biayaTol\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya tol\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"biayaRazia\">Biaya Razia (Rp)<\/label>\n <input type=\"number\" id=\"biayaRazia\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya razia\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"biayaPenurunan\">Biaya Penurunan Barang (Rp)<\/label>\n <input type=\"number\" id=\"biayaPenurunan\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya penurunan\" \/>\n <\/div>\n <\/div>\n\n \n <div class=\"accessories-section\">\n <h2 class=\"section-title\">Aksesoris Tiang<\/h2>\n <p class=\"note\">Masukkan harga untuk aksesoris tiang (diisi manual)<\/p>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Label Embos Tiang<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"embosPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"embosTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Tangga Tiang<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"tanggaPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"tanggaTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Sablon Label<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"sablonPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"sablonTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Baseplate<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"baseplatePrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"baseplateTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item accessory-item-textarea\">\n <div class=\"accessory-label\">Pekerjaan Lain<\/div>\n <div class=\"accessory-textarea-container\">\n <textarea id=\"pekerjaanLainText\" placeholder=\"Deskripsi pekerjaan lain (opsional)\"><\/textarea>\n <\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"pekerjaanLainPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"pekerjaanLainTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\" style=\"background-color: #f8f9fa; font-weight: bold;\">\n <div class=\"accessory-label\">Total Aksesoris<\/div>\n <div class=\"accessory-textarea-container\"><\/div>\n <div class=\"accessory-price\"><\/div>\n <div class=\"accessory-total\" id=\"totalAccessories\">Rp 0<\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"order-section\">\n <h2 class=\"section-title\">Data Pemesan<\/h2>\n <div class=\"input-group\">\n <label for=\"customerName\">Nama Pemesan<\/label>\n <input type=\"text\" id=\"customerName\" placeholder=\"Masukkan nama lengkap\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"email\">Email<\/label>\n <input type=\"email\" id=\"email\" placeholder=\"Masukkan alamat email\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"city\">Kota<\/label>\n <input type=\"text\" id=\"city\" placeholder=\"Masukkan kota\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"whatsapp\">WhatsApp<\/label>\n <input type=\"tel\" id=\"whatsapp\" placeholder=\"Masukkan nomor WhatsApp\" \/>\n <\/div>\n <\/div>\n \n \n <div class=\"button-group\">\n <button id=\"calculateBtn\" class=\"calculate-btn\" onclick=\"calculateCosts()\">Hitung Biaya Total<\/button>\n <button id=\"savePdfBtn\" class=\"save-btn\" onclick=\"saveToPDF()\">Save PDF<\/button>\n <\/div>\n \n \n <div id=\"resultsSection\" class=\"results-section\">\n <h3>Hasil Perhitungan<\/h3>\n \n <div id=\"segmentResults\" class=\"segment-results\">\n \n <\/div>\n \n <div id=\"totalPerPipe\" class=\"total-weight\">\n \n <\/div>\n \n <div id=\"totalOrder\" class=\"total-weight\">\n \n <\/div>\n \n \n <div class=\"order-details\">\n <h4>Detail Pesanan<\/h4>\n <div id=\"orderDetailsContent\">\n \n <\/div>\n <\/div>\n \n \n <div class=\"cost-breakdown\">\n <h4>Rincian Biaya<\/h4>\n <div class=\"cost-item\">\n <span>Harga Besi (Rp 23.000\/kg):<\/span>\n <span id=\"steelCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya galvanis:<\/span>\n <span id=\"finishCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya Pengiriman:<\/span>\n <span id=\"shippingCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya Tambahan:<\/span>\n <span id=\"additionalCosts\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya Aksesoris:<\/span>\n <span id=\"accessoriesCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>TOTAL BIAYA:<\/span>\n <span id=\"totalCost\">Rp 0<\/span>\n <\/div>\n <\/div>\n \n \n <div class=\"payment-info\">\n <h4>Informasi Pembayaran<\/h4>\n <div class=\"cost-item\">\n <span>Pembayaran DP\/Tanda Jadi (50%):<\/span>\n <span id=\"dpAmount\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Sisa Pembayaran (50%):<\/span>\n <span id=\"remainingAmount\">Rp 0<\/span>\n <\/div>\n \n <div class=\"payment-details\">\n <p><strong>Pembayaran ditransfer ke:<\/strong><\/p>\n <p>Nama Bank: Mandiri<\/p>\n <p>Cabang: Tebet, Jakarta Selatan<\/p>\n <p>Kode Bank: 008<\/p>\n <p>Nomor Rekening: 124 000 999 0707<\/p>\n <p>Nama Pemilik Rekening: CV Tokotower dot com<\/p>\n <p><strong>Catatan:<\/strong> Sisa pembayaran harus dilunasi sebelum barang dikirim, di transfer ke rekening yang sama<\/p>\n <\/div>\n <\/div>\n \n <p class=\"note\">* Berat dihitung berdasarkan densitas baja karbon 7850 kg\/m\u00b3<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2canvas\/1.4.1\/html2canvas.min.js\"><\/script>\n\n <script>\n \/\/ Konstanta harga\n const STEEL_PRICE_PER_KG = 23000;\n const GALVANIZING_PRICE_PER_KG = 14300;\n \n \/\/ Variabel global untuk menyimpan hasil perhitungan\n let calculationResults = null;\n \n \/\/ Fungsi untuk menampilkan pesan status\n function showStatus(message, isError = false) {\n const statusElement = document.getElementById('statusMessage');\n statusElement.textContent = message;\n statusElement.className = 'status-message ' + (isError ? 'error' : 'success');\n statusElement.style.display = 'block';\n \n \/\/ Sembunyikan pesan setelah 5 detik\n setTimeout(() => {\n statusElement.style.display = 'none';\n }, 5000);\n }\n \n \/\/ Fungsi untuk menunggu library dimuat\n function waitForLibraries() {\n return new Promise((resolve) => {\n const checkLibraries = () => {\n if (window.jspdf && window.html2canvas) {\n resolve();\n } else {\n setTimeout(checkLibraries, 100);\n }\n };\n checkLibraries();\n });\n }\n \n \/\/ Fungsi untuk inisialisasi setelah DOM dimuat\n function initCalculator() {\n \/\/ Event listener untuk input aksesoris\n document.getElementById('embosPrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('tanggaPrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('sablonPrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('baseplatePrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('pekerjaanLainPrice').addEventListener('input', updateAccessoriesTotal);\n \n console.log(\"Kalkulator pipa karbon siap digunakan!\");\n \n \/\/ Set nilai default untuk testing\n document.getElementById('thickness1').value = '2.5';\n document.getElementById('size1').value = '3';\n document.getElementById('length1').value = '7';\n \n showStatus(\"Kalkulator siap digunakan. Silakan isi data pipa dan klik 'Hitung Biaya Total'.\");\n }\n \n function updateAccessoriesTotal() {\n const embosPrice = parseFloat(document.getElementById('embosPrice').value) || 0;\n const tanggaPrice = parseFloat(document.getElementById('tanggaPrice').value) || 0;\n const sablonPrice = parseFloat(document.getElementById('sablonPrice').value) || 0;\n const baseplatePrice = parseFloat(document.getElementById('baseplatePrice').value) || 0;\n const pekerjaanLainPrice = parseFloat(document.getElementById('pekerjaanLainPrice').value) || 0;\n \n \/\/ Update individual totals\n document.getElementById('embosTotal').textContent = `Rp ${embosPrice.toLocaleString('id-ID')}`;\n document.getElementById('tanggaTotal').textContent = `Rp ${tanggaPrice.toLocaleString('id-ID')}`;\n document.getElementById('sablonTotal').textContent = `Rp ${sablonPrice.toLocaleString('id-ID')}`;\n document.getElementById('baseplateTotal').textContent = `Rp ${baseplatePrice.toLocaleString('id-ID')}`;\n document.getElementById('pekerjaanLainTotal').textContent = `Rp ${pekerjaanLainPrice.toLocaleString('id-ID')}`;\n \n const totalAccessories = embosPrice + tanggaPrice + sablonPrice + baseplatePrice + pekerjaanLainPrice;\n document.getElementById('totalAccessories').textContent = `Rp ${totalAccessories.toLocaleString('id-ID')}`;\n \n return totalAccessories;\n }\n \n function calculateCosts() {\n try {\n \/\/ Densitas baja karbon (kg\/m\u00b3)\n const density = 7850;\n \n let totalWeight = 0;\n let segmentDetails = [];\n let hasValidSegment = false;\n \n \/\/ Hitung berat untuk setiap segmen\n for (let i = 1; i <= 3; i++) {\n const thickness = parseFloat(document.getElementById('thickness' + i).value);\n const size = parseFloat(document.getElementById('size' + i).value);\n const length = parseFloat(document.getElementById('length' + i).value);\n \n \/\/ Lewati segmen jika tidak ada data\n if (isNaN(thickness) || isNaN(size) || isNaN(length) || length <= 0) {\n continue;\n }\n \n hasValidSegment = true;\n \n \/\/ Konversi inci ke meter untuk diameter luar\n const outerDiameter = size * 0.0254;\n \n \/\/ Konversi mm ke meter untuk ketebalan\n const thicknessMeter = thickness \/ 1000;\n \n \/\/ Hitung diameter dalam\n const innerDiameter = outerDiameter - (2 * thicknessMeter);\n \n \/\/ Hitung luas penampang pipa\n const crossSectionalArea = Math.PI * (Math.pow(outerDiameter\/2, 2) - Math.pow(innerDiameter\/2, 2));\n \n \/\/ Hitung volume pipa\n const volume = crossSectionalArea * length;\n \n \/\/ Hitung berat pipa (kg)\n const weight = volume * density;\n \n totalWeight += weight;\n segmentDetails.push({\n thickness: thickness,\n size: size,\n length: length,\n weight: weight\n });\n }\n \n if (!hasValidSegment) {\n showStatus(\"Silakan isi data untuk setidaknya satu segmen pipa (tebal, ukuran, dan panjang)\", true);\n return;\n }\n \n \/\/ Ambil jumlah pesanan\n const quantity = parseInt(document.getElementById('quantity').value) || 1;\n \n \/\/ Hitung berat total\n const totalOrderWeight = totalWeight * quantity;\n \n \/\/ Ambil jenis finishing\n const finishType = document.querySelector('input[name=\"finish\"]:checked').value;\n \n \/\/ Ambil biaya-biaya tambahan\n const biayaKirim = parseFloat(document.getElementById('biayaKirim').value) || 0;\n const biayaTol = parseFloat(document.getElementById('biayaTol').value) || 0;\n const biayaRazia = parseFloat(document.getElementById('biayaRazia').value) || 0;\n const biayaPenurunan = parseFloat(document.getElementById('biayaPenurunan').value) || 0;\n \n \/\/ Hitung biaya aksesoris\n const accessoriesCost = updateAccessoriesTotal();\n \n \/\/ Hitung biaya\n const steelCost = totalOrderWeight * STEEL_PRICE_PER_KG;\n \n let finishCost = 0;\n if (finishType === 'galvanis') {\n finishCost = totalOrderWeight * GALVANIZING_PRICE_PER_KG;\n }\n \n const additionalCosts = biayaTol + biayaRazia + biayaPenurunan;\n \n \/\/ Hitung total biaya\n const totalCost = steelCost + finishCost + biayaKirim + additionalCosts + accessoriesCost;\n \n \/\/ Hitung DP 50% dan sisa pembayaran\n const dpAmount = totalCost * 0.5;\n const remainingAmount = totalCost - dpAmount;\n \n \/\/ Simpan hasil perhitungan\n calculationResults = {\n segmentDetails: segmentDetails,\n totalWeight: totalWeight,\n totalOrderWeight: totalOrderWeight,\n quantity: quantity,\n steelCost: steelCost,\n finishCost: finishCost,\n shippingCost: biayaKirim,\n additionalCosts: additionalCosts,\n accessoriesCost: accessoriesCost,\n totalCost: totalCost,\n dpAmount: dpAmount,\n remainingAmount: remainingAmount\n };\n \n \/\/ Tampilkan hasil\n displayResults(calculationResults);\n showStatus(\"Perhitungan biaya berhasil! Anda sekarang dapat menyimpan hasilnya ke PDF.\");\n \n } catch (error) {\n console.error('Error calculating costs:', error);\n showStatus('Terjadi kesalahan saat menghitung biaya. Silakan periksa input Anda dan coba lagi.', true);\n }\n }\n \n function displayResults(results) {\n try {\n const segmentResults = document.getElementById('segmentResults');\n const totalPerPipe = document.getElementById('totalPerPipe');\n const totalOrder = document.getElementById('totalOrder');\n const resultsSection = document.getElementById('resultsSection');\n const orderDetailsContent = document.getElementById('orderDetailsContent');\n \n let segmentHTML = '';\n let orderDetailsHTML = '';\n \n results.segmentDetails.forEach((segment, index) => {\n segmentHTML += `\n <div class=\"segment-result\">\n <h4>Segmen ${index + 1}<\/h4>\n <p>Tebal: ${segment.thickness} mm<\/p>\n <p>Ukuran: ${segment.size}\"<\/p>\n <p>Panjang: ${segment.length} m<\/p>\n <p class=\"weight-value\">${segment.weight.toFixed(2)} kg<\/p>\n <\/div>\n `;\n \n orderDetailsHTML += `\n <div class=\"segment-detail\">\n <p><strong>Segmen ${index + 1}:<\/strong> Tebal ${segment.thickness} mm, Ukuran ${segment.size}\", Panjang ${segment.length} m<\/p>\n <\/div>\n `;\n });\n \n \/\/ Tambahkan info finishing dan aksesoris ke detail pesanan\n const finishType = document.querySelector('input[name=\"finish\"]:checked').value;\n const pekerjaanLainText = document.getElementById('pekerjaanLainText').value;\n \n orderDetailsHTML += `\n <p><strong>Jumlah Pipa:<\/strong> ${results.quantity} unit<\/p>\n <p><strong>Total Panjang:<\/strong> ${results.segmentDetails.reduce((sum, seg) => sum + seg.length, 0).toFixed(2)} meter<\/p>\n <p><strong>Finishing:<\/strong> ${finishType === 'galvanis' ? 'Galvanis' : 'Cat Hitam'}<\/p>\n `;\n \n if (results.accessoriesCost > 0) {\n orderDetailsHTML += `<p><strong>Total Aksesoris:<\/strong> Rp ${results.accessoriesCost.toLocaleString('id-ID')}<\/p>`;\n }\n \n if (pekerjaanLainText) {\n orderDetailsHTML += `<p><strong>Pekerjaan Lain:<\/strong> ${pekerjaanLainText}<\/p>`;\n }\n \n segmentResults.innerHTML = segmentHTML;\n totalPerPipe.textContent = `Berat Total per Pipa: ${results.totalWeight.toFixed(2)} kg`;\n totalOrder.textContent = `Berat Total Pesanan (${results.quantity} pipa): ${results.totalOrderWeight.toFixed(2)} kg`;\n orderDetailsContent.innerHTML = orderDetailsHTML;\n \n \/\/ Update rincian biaya\n document.getElementById('steelCost').textContent = `Rp ${results.steelCost.toLocaleString('id-ID')}`;\n document.getElementById('finishCost').textContent = `Rp ${results.finishCost.toLocaleString('id-ID')}`;\n document.getElementById('shippingCost').textContent = `Rp ${results.shippingCost.toLocaleString('id-ID')}`;\n document.getElementById('additionalCosts').textContent = `Rp ${results.additionalCosts.toLocaleString('id-ID')}`;\n document.getElementById('accessoriesCost').textContent = `Rp ${results.accessoriesCost.toLocaleString('id-ID')}`;\n document.getElementById('totalCost').textContent = `Rp ${results.totalCost.toLocaleString('id-ID')}`;\n \n \/\/ Update informasi pembayaran\n document.getElementById('dpAmount').textContent = `Rp ${results.dpAmount.toLocaleString('id-ID')}`;\n document.getElementById('remainingAmount').textContent = `Rp ${results.remainingAmount.toLocaleString('id-ID')}`;\n \n resultsSection.style.display = 'block';\n \n \/\/ Scroll ke hasil\n resultsSection.scrollIntoView({ behavior: 'smooth' });\n } catch (error) {\n console.error('Error displaying results:', error);\n showStatus('Terjadi kesalahan saat menampilkan hasil. Silakan coba lagi.', true);\n }\n }\n \n async function saveToPDF() {\n try {\n \/\/ Pastikan hasil perhitungan sudah ditampilkan\n const resultsSection = document.getElementById('resultsSection');\n if (resultsSection.style.display === 'none' || !calculationResults) {\n showStatus(\"Silakan hitung biaya total terlebih dahulu sebelum menyimpan ke PDF\", true);\n return;\n }\n \n \/\/ Tampilkan indikator loading\n const saveBtn = document.getElementById('savePdfBtn');\n const originalText = saveBtn.innerHTML;\n saveBtn.innerHTML = '<span class=\"loading\"><\/span> Membuat PDF...';\n saveBtn.disabled = true;\n \n \/\/ Tunggu library dimuat\n await waitForLibraries();\n \n \/\/ Ambil data pemesan untuk nama file\n const whatsapp = document.getElementById('whatsapp').value || 'unknown';\n const customerName = document.getElementById('customerName').value || 'unknown';\n \n \/\/ Ambil data segmen pertama yang valid untuk panjang dan tebal\n let totalLength = 0;\n let thickness = 0;\n \n for (let i = 1; i <= 3; i++) {\n const segLength = parseFloat(document.getElementById('length' + i).value);\n const segThickness = parseFloat(document.getElementById('thickness' + i).value);\n \n if (!isNaN(segLength) && segLength > 0) {\n totalLength += segLength;\n if (thickness === 0 && !isNaN(segThickness)) {\n thickness = segThickness;\n }\n }\n }\n \n \/\/ Format nama file: nomor whatsapp, nama pemesan, ukuran panjang dan tebal tower\n const fileName = `${whatsapp}_${customerName.replace(\/\\s+\/g, '_')}_panjang${totalLength}m_tebal${thickness}mm.pdf`;\n \n \/\/ Sembunyikan tombol sebelum membuat PDF\n document.querySelector('.button-group').style.display = 'none';\n \n \/\/ Gunakan html2canvas dan jsPDF untuk membuat PDF\n const canvas = await html2canvas(resultsSection, {\n scale: 2,\n logging: false,\n useCORS: true,\n allowTaint: true\n });\n \n const imgData = canvas.toDataURL('image\/png');\n const pdf = new jspdf.jsPDF({\n orientation: 'portrait',\n unit: 'mm',\n format: 'a4'\n });\n \n const imgWidth = 210; \/\/ Lebar A4 dalam mm\n const pageHeight = 295; \/\/ Tinggi A4 dalam mm\n const imgHeight = (canvas.height * imgWidth) \/ canvas.width;\n let heightLeft = imgHeight;\n let position = 0;\n \n \/\/ Tambahkan gambar ke PDF\n pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);\n heightLeft -= pageHeight;\n \n \/\/ Tambahkan halaman baru jika konten lebih dari satu halaman\n while (heightLeft >= 0) {\n position = heightLeft - imgHeight;\n pdf.addPage();\n pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);\n heightLeft -= pageHeight;\n }\n \n \/\/ Simpan PDF dengan nama file yang telah diformat\n pdf.save(fileName);\n \n \/\/ Tampilkan kembali tombol setelah membuat PDF\n document.querySelector('.button-group').style.display = 'flex';\n \n \/\/ Kembalikan tombol ke keadaan semula\n saveBtn.innerHTML = originalText;\n saveBtn.disabled = false;\n \n showStatus(`PDF berhasil disimpan dengan nama: ${fileName}`);\n \n } catch (error) {\n console.error('Error generating PDF:', error);\n showStatus('Terjadi kesalahan saat membuat PDF. Pastikan semua library telah dimuat dengan benar dan coba lagi.', true);\n \n \/\/ Tampilkan kembali tombol jika terjadi kesalahan\n document.querySelector('.button-group').style.display = 'flex';\n \n \/\/ Kembalikan tombol ke keadaan semula\n const saveBtn = document.getElementById('savePdfBtn');\n saveBtn.innerHTML = 'Save PDF';\n saveBtn.disabled = false;\n }\n }\n \n \/\/ Inisialisasi kalkulator setelah DOM dimuat\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initCalculator);\n } else {\n initCalculator();\n }\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-126","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages\/126","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/comments?post=126"}],"version-history":[{"count":87,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages\/126\/revisions"}],"predecessor-version":[{"id":756,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages\/126\/revisions\/756"}],"wp:attachment":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/media?parent=126"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":126,"date":"2025-01-17T13:57:50","date_gmt":"2025-01-17T13:57:50","guid":{"rendered":"https:\/\/tiangjalan.com\/pabrik\/?page_id=126"},"modified":"2025-10-08T13:17:56","modified_gmt":"2025-10-08T13:17:56","slug":"tiang-fiber-optik","status":"publish","type":"page","link":"https:\/\/tiangjalan.com\/pabrik\/tiang-fiber-optik\/","title":{"rendered":"Tiang Fiber Optik"},"content":{"rendered":"\n\n\n\n\n\n\n\n \n \n Form Permintaan Harga Tiang<\/title>\n <style>\n \/* CSS yang diisolasi dengan prefix khusus untuk mencegah konflik *\/\n .tiang-form-container {\n --primary-color: #2c3e50;\n --secondary-color: #4ca1af;\n --light-bg: #f8f9fa;\n --border-color: #e0e0e0;\n --text-color: #555;\n --error-color: #e74c3c;\n \n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n max-width: 100%;\n margin: 0 auto;\n padding: 15px;\n background-color: #f5f7fa;\n border-radius: 10px;\n box-sizing: border-box;\n }\n \n .tiang-form-header {\n background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));\n color: white;\n padding: 20px;\n text-align: center;\n border-radius: 8px 8px 0 0;\n margin-bottom: 20px;\n }\n \n .tiang-form-header h2 {\n font-size: 22px;\n margin-bottom: 8px;\n }\n \n .tiang-form-header p {\n font-size: 14px;\n opacity: 0.9;\n }\n \n .tiang-form-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 20px;\n }\n \n @media (min-width: 768px) {\n .tiang-form-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n \n @media (min-width: 1024px) {\n .tiang-form-grid {\n grid-template-columns: 1fr 1fr 1fr;\n }\n }\n \n .tiang-form-section {\n padding: 20px 20px 20px 25px;\n background-color: var(--light-bg);\n border-radius: 8px;\n border-left: 5px solid var(--secondary-color);\n position: relative;\n margin-left: 5px;\n }\n \n .tiang-section-title {\n font-size: 16px;\n color: var(--primary-color);\n margin-bottom: 15px;\n padding-bottom: 8px;\n border-bottom: 1px solid var(--border-color);\n font-weight: 600;\n }\n \n .tiang-form-group {\n margin-bottom: 15px;\n }\n \n .tiang-form-group label {\n display: block;\n margin-bottom: 5px;\n font-size: 14px;\n color: var(--text-color);\n font-weight: 500;\n }\n \n .tiang-form-group select, \n .tiang-form-group input[type=\"text\"],\n .tiang-form-group input[type=\"email\"],\n .tiang-form-group input[type=\"tel\"],\n .tiang-form-group input[type=\"number\"] {\n width: 100%;\n padding: 8px 10px;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n font-size: 14px;\n box-sizing: border-box;\n height: 38px;\n }\n \n .tiang-form-group select:focus, \n .tiang-form-group input:focus {\n border-color: var(--secondary-color);\n outline: none;\n box-shadow: 0 0 0 2px rgba(76, 161, 175, 0.2);\n }\n \n .tiang-custom-input {\n display: none;\n margin-top: 8px;\n }\n \n .tiang-tiang-group {\n margin-bottom: 15px;\n padding: 12px;\n background-color: white;\n border-radius: 6px;\n border: 1px solid var(--border-color);\n }\n \n .tiang-tiang-title {\n font-weight: 600;\n margin-bottom: 10px;\n color: var(--primary-color);\n font-size: 14px;\n }\n \n .tiang-form-row {\n display: flex;\n gap: 10px;\n margin-bottom: 10px;\n align-items: flex-start;\n }\n \n .tiang-form-row > div {\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n \n .tiang-rencana-order-row {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 10px;\n margin-bottom: 10px;\n }\n \n .tiang-rencana-order-row > div {\n display: flex;\n flex-direction: column;\n }\n \n .tiang-submit-btn {\n grid-column: 1 \/ -1;\n width: 100%;\n padding: 12px;\n background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));\n color: white;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 16px;\n font-weight: 600;\n margin-top: 10px;\n transition: all 0.3s;\n }\n \n .tiang-submit-btn:hover {\n background: linear-gradient(90deg, var(--secondary-color), var(--primary-color));\n }\n \n .tiang-required::after {\n content: \" *\";\n color: var(--error-color);\n }\n \n .tiang-error-message {\n color: var(--error-color);\n font-size: 12px;\n margin-top: 5px;\n display: none;\n }\n \n .tiang-form-group.error input,\n .tiang-form-group.error select {\n border-color: var(--error-color);\n }\n \n .tiang-catatan {\n grid-column: 1 \/ -1;\n background-color: #e8f4f8;\n padding: 15px;\n border-radius: 5px;\n border-left: 4px solid #4ca1af;\n margin-top: 20px;\n font-size: 14px;\n line-height: 1.5;\n }\n \n .tiang-catatan p {\n margin-bottom: 10px;\n }\n \n .tiang-catatan strong {\n color: #2c3e50;\n }\n \n \/* Reset untuk elemen dalam form container *\/\n .tiang-form-container * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n \n .tiang-form-container h1,\n .tiang-form-container h2,\n .tiang-form-container h3,\n .tiang-form-container h4,\n .tiang-form-container h5,\n .tiang-form-container h6 {\n margin-top: 0;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"tiang-form-container\">\n <div class=\"tiang-form-header\">\n <h2>Permintaan Harga Tiang<\/h2>\n <p>Isi formulir berikut untuk mendapatkan penawaran harga terbaik<\/p>\n <\/div>\n \n <form class=\"tiang-form-grid\" id=\"tiangPriceRequestForm\">\n \n <div class=\"tiang-form-section\">\n <div class=\"tiang-section-title\">Spesifikasi Umum<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_spesifikasi_umum\" class=\"tiang-required\">Spesifikasi Umum<\/label>\n <select id=\"tiang_spesifikasi_umum\" name=\"spesifikasi_umum\" required>\n <option value=\"\">Pilih Spesifikasi<\/option>\n <option value=\"Telkom\">Telkom<\/option>\n <option value=\"My republik\">My republik<\/option>\n <option value=\"Firsmedia\">Firsmedia<\/option>\n <option value=\"Linknet\">Linknet<\/option>\n <option value=\"XLHome\">XLHome<\/option>\n <option value=\"Wifi\">Wifi<\/option>\n <option value=\"Moratel\">Moratel<\/option>\n <option value=\"ISP sendiri\">ISP sendiri<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_spesifikasi_umum_error\">Silakan isi Spesifikasi Umum<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_pekerjaan\" class=\"tiang-required\">Rencana Pekerjaan<\/label>\n <select id=\"tiang_rencana_pekerjaan\" name=\"rencana_pekerjaan\" required>\n <option value=\"\">Pilih Rencana Pekerjaan<\/option>\n <option value=\"Proyek sendiri\">Proyek sendiri<\/option>\n <option value=\"Sebagai Kontraktor\">Sebagai Kontraktor<\/option>\n <option value=\"Ikut Tender\">Ikut Tender<\/option>\n <option value=\"lain-lain\">Lain-lain<\/option>\n <\/select>\n <div id=\"tiang_custom_rencana_pekerjaan\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Jelaskan rencana pekerjaan Anda\" name=\"custom_rencana_pekerjaan\">\n <\/div>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_pekerjaan_error\">Silakan isi Rencana Pekerjaan<\/div>\n <\/div>\n \n <div class=\"tiang-section-title\">Data Pribadi<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_nama\" class=\"tiang-required\">Nama Anda<\/label>\n <input type=\"text\" id=\"tiang_nama\" name=\"nama\" required>\n <div class=\"tiang-error-message\" id=\"tiang_nama_error\">Silakan isi Nama Anda<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_email\" class=\"tiang-required\">Email<\/label>\n <input type=\"email\" id=\"tiang_email\" name=\"email\" required>\n <div class=\"tiang-error-message\" id=\"tiang_email_error\">Silakan isi Email<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_perusahaan\" class=\"tiang-required\">Nama Perusahaan<\/label>\n <input type=\"text\" id=\"tiang_perusahaan\" name=\"perusahaan\" required>\n <div class=\"tiang-error-message\" id=\"tiang_perusahaan_error\">Silakan isi Nama Perusahaan<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_jabatan\" class=\"tiang-required\">Jabatan<\/label>\n <input type=\"text\" id=\"tiang_jabatan\" name=\"jabatan\" required>\n <div class=\"tiang-error-message\" id=\"tiang_jabatan_error\">Silakan isi Jabatan<\/div>\n <\/div>\n \n <div class=\"tiang-section-title\">Data Kontak<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_kota\" class=\"tiang-required\">Kota<\/label>\n <input type=\"text\" id=\"tiang_kota\" name=\"kota\" required>\n <div class=\"tiang-error-message\" id=\"tiang_kota_error\">Silakan isi Kota<\/div>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_website\">Website Perusahaan<\/label>\n <input type=\"text\" id=\"tiang_website\" name=\"website\" placeholder=\"https:\/\/\">\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_tel_kantor\">Tel. Kantor<\/label>\n <input type=\"tel\" id=\"tiang_tel_kantor\" name=\"tel_kantor\">\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_whatsapp\" class=\"tiang-required\">No. WhatsApp<\/label>\n <input type=\"tel\" id=\"tiang_whatsapp\" name=\"whatsapp\" required>\n <div class=\"tiang-error-message\" id=\"tiang_whatsapp_error\">Silakan isi No. WhatsApp<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tiang-form-section\">\n <div class=\"tiang-section-title\">Jenis dan Ukuran Tiang<\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 6 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi6_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi6_segmen\" name=\"tinggi6_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi6_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi6_tebal\" name=\"tinggi6_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi6\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi6\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi6_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi6_jumlah\" name=\"tinggi6_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 7 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi7_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi7_segmen\" name=\"tinggi7_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi7_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi7_tebal\" name=\"tinggi7_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi7\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi7\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi7_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi7_jumlah\" name=\"tinggi7_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 8 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi8_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi8_segmen\" name=\"tinggi8_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <option value=\"3\">3 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi8_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi8_tebal\" name=\"tinggi8_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi8\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi8\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi8_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi8_jumlah\" name=\"tinggi8_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 9 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi9_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi9_segmen\" name=\"tinggi9_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <option value=\"3\">3 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi9_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi9_tebal\" name=\"tinggi9_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi9\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi9\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi9_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi9_jumlah\" name=\"tinggi9_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n \n \n <div class=\"tiang-tiang-group\">\n <div class=\"tiang-tiang-title\">Tiang 13 Meter<\/div>\n <div class=\"tiang-form-row\">\n <div>\n <label for=\"tiang_tinggi13_segmen\">Jumlah Segmen<\/label>\n <select id=\"tiang_tinggi13_segmen\" name=\"tinggi13_segmen\">\n <option value=\"\">Pilih<\/option>\n <option value=\"1\">1 Segmen<\/option>\n <option value=\"2\">2 Segmen<\/option>\n <option value=\"3\">3 Segmen<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"tiang_tinggi13_tebal\">Tebal Besi<\/label>\n <select id=\"tiang_tinggi13_tebal\" name=\"tinggi13_tebal\" class=\"tiang-tebal-select\">\n <option value=\"\">Pilih<\/option>\n <option value=\"2\">2 mm<\/option>\n <option value=\"2.5\">2,5 mm<\/option>\n <option value=\"3\">3 mm<\/option>\n <option value=\"custom\">Custom<\/option>\n <\/select>\n <div id=\"tiang_custom_tinggi13\" class=\"tiang-custom-input\">\n <input type=\"text\" placeholder=\"Masukkan tebal custom (mm)\" name=\"custom_tinggi13\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_tinggi13_jumlah\">Jumlah Pesanan<\/label>\n <input type=\"number\" id=\"tiang_tinggi13_jumlah\" name=\"tinggi13_jumlah\" placeholder=\"Jumlah\">\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tiang-form-section\">\n <div class=\"tiang-section-title\">Pengiriman<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_tujuan_pengiriman\">Tujuan Pengiriman: Kota\/Propinsi<\/label>\n <input type=\"text\" id=\"tiang_tujuan_pengiriman\" name=\"tujuan_pengiriman\" placeholder=\"Contoh: Jakarta, Jawa Barat\">\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_kendaraan\">Kendaraan<\/label>\n <select id=\"tiang_kendaraan\" name=\"kendaraan\">\n <option value=\"\">Pilih Kendaraan<\/option>\n <option value=\"Dari Pemesan\">Dari Pemesan<\/option>\n <option value=\"Dicarikan\">Dicarikan<\/option>\n <option value=\"Antar sampai pelabuhan\">Antar sampai pelabuhan<\/option>\n <option value=\"Lain-lain\">Lain-lain<\/option>\n <\/select>\n <\/div>\n \n <div class=\"tiang-section-title\">Deadline Pekerjaan<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_deadline\">Jumlah Hari<\/label>\n <input type=\"number\" id=\"tiang_deadline\" name=\"deadline\" min=\"1\" max=\"60\" placeholder=\"Contoh: 30\">\n <\/div>\n \n <div class=\"tiang-section-title\">Aksesoris dan Warna<\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_aksesoris\">Aksesoris<\/label>\n <select id=\"tiang_aksesoris\" name=\"aksesoris\">\n <option value=\"\">Pilih Aksesoris<\/option>\n <option value=\"Tiang Polos\">Tiang Polos<\/option>\n <option value=\"Label Embosse\">Label Embosse<\/option>\n <option value=\"Label Sablon\">Label Sablon<\/option>\n <\/select>\n <\/div>\n \n <div class=\"tiang-form-group\">\n <label for=\"tiang_warna_kepala\">Warna Kepala<\/label>\n <input type=\"text\" id=\"tiang_warna_kepala\" name=\"warna_kepala\" placeholder=\"Misal: Merah, Biru, dll\">\n <\/div>\n \n <div class=\"tiang-section-title\">Rencana Order<\/div>\n \n <div class=\"tiang-rencana-order-row\">\n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_tanggal\" class=\"tiang-required\">Tanggal<\/label>\n <select id=\"tiang_rencana_tanggal\" name=\"rencana_tanggal\" required>\n <option value=\"\">Pilih Tanggal<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_tanggal_error\">Silakan isi Tanggal<\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_bulan\" class=\"tiang-required\">Bulan<\/label>\n <select id=\"tiang_rencana_bulan\" name=\"rencana_bulan\" required>\n <option value=\"\">Pilih Bulan<\/option>\n <option value=\"1\">Januari<\/option>\n <option value=\"2\">Februari<\/option>\n <option value=\"3\">Maret<\/option>\n <option value=\"4\">April<\/option>\n <option value=\"5\">Mei<\/option>\n <option value=\"6\">Juni<\/option>\n <option value=\"7\">Juli<\/option>\n <option value=\"8\">Agustus<\/option>\n <option value=\"9\">September<\/option>\n <option value=\"10\">Oktober<\/option>\n <option value=\"11\">November<\/option>\n <option value=\"12\">Desember<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_bulan_error\">Silakan isi Bulan<\/div>\n <\/div>\n <div class=\"tiang-form-group\">\n <label for=\"tiang_rencana_tahun\" class=\"tiang-required\">Tahun<\/label>\n <select id=\"tiang_rencana_tahun\" name=\"rencana_tahun\" required>\n <option value=\"\">Pilih Tahun<\/option>\n <\/select>\n <div class=\"tiang-error-message\" id=\"tiang_rencana_tahun_error\">Silakan isi Tahun<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"tiang-catatan\">\n <p><strong>Kami akan memberikan harga terbaik untuk penawaran ini.<\/strong> Setelah pesan Anda dikirimkan, kami akan menghitung sesuai kebutuhan Anda, dan segera akan mengirimkan harga melalui WhatsApp dan email yang Anda berikan.<\/p>\n <p><strong>Seluruh pembayaran atas nama PT Tokototower Sukses Makmur, atau NON Faktur Pajak ke CV. Tokotower dot com.<\/strong><\/p>\n <p><strong>Waspada penipuan!<\/strong> Jika ada permintaan pembayaran ke rekening atas nama pribadi, abaikan saja.<\/p>\n <\/div>\n \n <button type=\"button\" class=\"tiang-submit-btn\" onclick=\"tiangSendToWhatsApp()\">Kirim Permintaan Harga<\/button>\n <\/form>\n <\/div>\n\n <script>\n \/\/ Fungsi untuk menampilkan input custom ketika opsi \"custom\" dipilih\n document.querySelectorAll('.tiang-tebal-select').forEach(select => {\n select.addEventListener('change', function() {\n const tiangId = this.id.replace('tiang_tinggi', '').replace('_tebal', '');\n const customInput = document.getElementById(`tiang_custom_tinggi${tiangId}`);\n \n if (this.value === 'custom') {\n customInput.style.display = 'block';\n } else {\n customInput.style.display = 'none';\n }\n });\n });\n \n \/\/ Fungsi untuk menampilkan input custom ketika opsi \"lain-lain\" dipilih pada rencana pekerjaan\n document.getElementById('tiang_rencana_pekerjaan').addEventListener('change', function() {\n const customInput = document.getElementById('tiang_custom_rencana_pekerjaan');\n \n if (this.value === 'lain-lain') {\n customInput.style.display = 'block';\n } else {\n customInput.style.display = 'none';\n }\n });\n \n \/\/ Generate tanggal\n const tanggalSelect = document.getElementById('tiang_rencana_tanggal');\n for (let i = 1; i <= 31; i++) {\n const option = document.createElement('option');\n option.value = i;\n option.textContent = i;\n tanggalSelect.appendChild(option);\n }\n \n \/\/ Generate tahun\n const tahunSelect = document.getElementById('tiang_rencana_tahun');\n const currentYear = new Date().getFullYear();\n for (let i = currentYear; i <= currentYear + 3; i++) {\n const option = document.createElement('option');\n option.value = i;\n option.textContent = i;\n tahunSelect.appendChild(option);\n }\n \n \/\/ Fungsi untuk menampilkan pesan error\n function showError(fieldId, message) {\n const field = document.getElementById(fieldId);\n const errorElement = document.getElementById(fieldId + '_error');\n \n field.parentElement.classList.add('error');\n errorElement.textContent = message;\n errorElement.style.display = 'block';\n }\n \n \/\/ Fungsi untuk menghapus pesan error\n function hideError(fieldId) {\n const field = document.getElementById(fieldId);\n const errorElement = document.getElementById(fieldId + '_error');\n \n field.parentElement.classList.remove('error');\n errorElement.style.display = 'none';\n }\n \n \/\/ Fungsi untuk validasi form\n function validateForm() {\n let isValid = true;\n \n \/\/ Daftar field yang wajib diisi\n const requiredFields = [\n 'tiang_spesifikasi_umum',\n 'tiang_rencana_pekerjaan',\n 'tiang_nama',\n 'tiang_email',\n 'tiang_perusahaan',\n 'tiang_jabatan',\n 'tiang_kota',\n 'tiang_whatsapp',\n 'tiang_rencana_tanggal',\n 'tiang_rencana_bulan',\n 'tiang_rencana_tahun'\n ];\n \n \/\/ Validasi setiap field\n requiredFields.forEach(fieldId => {\n const field = document.getElementById(fieldId);\n if (!field.value) {\n showError(fieldId, 'Silakan isi ' + field.previousElementSibling.textContent.replace(' *', ''));\n isValid = false;\n } else {\n hideError(fieldId);\n }\n });\n \n \/\/ Validasi khusus untuk email\n const emailField = document.getElementById('tiang_email');\n const emailRegex = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n if (emailField.value && !emailRegex.test(emailField.value)) {\n showError('tiang_email', 'Format email tidak valid');\n isValid = false;\n }\n \n return isValid;\n }\n \n \/\/ Fungsi untuk mengirim data ke WhatsApp\n function tiangSendToWhatsApp() {\n \/\/ Validasi form\n if (!validateForm()) {\n alert('Harap isi semua field yang wajib diisi!');\n return;\n }\n \n \/\/ Mengumpulkan data form\n const formData = new FormData(document.getElementById('tiangPriceRequestForm'));\n let message = \"Halo, saya ingin meminta informasi harga tiang dengan spesifikasi berikut:%0A%0A\";\n \n \/\/ Spesifikasi umum\n message += \"*Spesifikasi Umum:*%0A\";\n message += \"- \" + formData.get('spesifikasi_umum') + \"%0A\";\n \n \/\/ Rencana pekerjaan\n let rencanaPekerjaan = formData.get('rencana_pekerjaan');\n if (rencanaPekerjaan === 'lain-lain') {\n rencanaPekerjaan = formData.get('custom_rencana_pekerjaan') || 'Lain-lain (tidak dijelaskan)';\n }\n message += \"- Rencana Pekerjaan: \" + rencanaPekerjaan + \"%0A%0A\";\n \n \/\/ Detail tiang\n message += \"*Detail Tiang:*%0A\";\n \n const tinggiList = ['6', '7', '8', '9', '13'];\n let hasTiangData = false;\n \n tinggiList.forEach(tinggi => {\n const segmen = formData.get(`tinggi${tinggi}_segmen`);\n const tebal = formData.get(`tinggi${tinggi}_tebal`);\n const jumlah = formData.get(`tinggi${tinggi}_jumlah`);\n \n if (segmen || tebal || jumlah) {\n hasTiangData = true;\n message += `*Tiang ${tinggi} Meter:*%0A`;\n message += `- Segmen: ${segmen || 'Tidak ditentukan'}%0A`;\n \n if (tebal === 'custom') {\n const customTebal = formData.get(`custom_tinggi${tinggi}`);\n message += `- Tebal Besi: Custom (${customTebal} mm)%0A`;\n } else {\n message += `- Tebal Besi: ${tebal || 'Tidak ditentukan'} mm%0A`;\n }\n \n message += `- Jumlah: ${jumlah || 'Tidak ditentukan'}%0A%0A`;\n }\n });\n \n if (!hasTiangData) {\n message += \"Tidak ada tiang yang dipesan%0A%0A\";\n }\n \n \/\/ Aksesoris dan warna\n message += \"*Aksesoris dan Warna:*%0A\";\n message += \"- Aksesoris: \" + (formData.get('aksesoris') || 'Tidak ditentukan') + \"%0A\";\n message += \"- Warna Kepala: \" + (formData.get('warna_kepala') || 'Tidak ditentukan') + \"%0A%0A\";\n \n \/\/ Data pribadi\n message += \"*Data Pemesan:*%0A\";\n message += \"- Nama: \" + formData.get('nama') + \"%0A\";\n message += \"- Email: \" + formData.get('email') + \"%0A\";\n message += \"- Perusahaan: \" + formData.get('perusahaan') + \"%0A\";\n message += \"- Jabatan: \" + formData.get('jabatan') + \"%0A\";\n message += \"- Kota: \" + formData.get('kota') + \"%0A\";\n message += \"- Website: \" + (formData.get('website') || 'Tidak ditentukan') + \"%0A\";\n message += \"- Tel. Kantor: \" + (formData.get('tel_kantor') || 'Tidak ditentukan') + \"%0A\";\n message += \"- WhatsApp: \" + formData.get('whatsapp') + \"%0A%0A\";\n \n \/\/ Pengiriman\n message += \"*Pengiriman:*%0A\";\n message += \"- Tujuan: \" + (formData.get('tujuan_pengiriman') || 'Tidak ditentukan') + \"%0A\";\n message += \"- Kendaraan: \" + (formData.get('kendaraan') || 'Tidak ditentukan') + \"%0A%0A\";\n \n \/\/ Deadline\n const deadline = formData.get('deadline');\n if (deadline) {\n message += \"- Deadline: \" + deadline + \" hari%0A%0A\";\n }\n \n \/\/ Rencana order\n const tanggal = formData.get('rencana_tanggal');\n const bulan = formData.get('rencana_bulan');\n const tahun = formData.get('rencana_tahun');\n \n if (tanggal && bulan && tahun) {\n const bulanNames = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', \n 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];\n message += \"- Rencana Order: \" + tanggal + \" \" + bulanNames[bulan-1] + \" \" + tahun + \"%0A\";\n }\n \n \/\/ Nomor WhatsApp tujuan\n const phoneNumber = \"628111150660\";\n \n \/\/ Membuka WhatsApp dengan pesan yang sudah disiapkan\n window.open(`https:\/\/wa.me\/${phoneNumber}?text=${message}`, '_blank');\n }\n \n \/\/ Menambahkan event listener untuk menghilangkan error saat user mulai mengisi\n document.querySelectorAll('.tiang-form-group input, .tiang-form-group select').forEach(field => {\n field.addEventListener('input', function() {\n hideError(this.id);\n });\n \n field.addEventListener('change', function() {\n hideError(this.id);\n });\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Kalkulator Berat Pipa Karbon<\/title>\n <style>\n \/* CSS Terisolasi - Hanya untuk kalkulator *\/\n #pipe-calculator-container * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n \n #pipe-calculator-container {\n max-width: 100%;\n background-color: #fff9e6;\n border-radius: 12px;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n overflow: hidden;\n margin: 20px 0;\n border: 1px solid #e0e0e0;\n }\n \n #pipe-calculator-container .calculator-header {\n background: linear-gradient(135deg, #2c3e50 0%, #4a6491 100%);\n color: white;\n padding: 20px;\n text-align: center;\n }\n \n #pipe-calculator-container .calculator-header h1 {\n font-size: 24px;\n margin-bottom: 8px;\n }\n \n #pipe-calculator-container .calculator-header p {\n opacity: 0.9;\n font-size: 14px;\n }\n \n #pipe-calculator-container .calculator-content {\n padding: 20px;\n }\n \n #pipe-calculator-container .section-title {\n font-size: 18px;\n color: #2c3e50;\n margin-bottom: 15px;\n padding-bottom: 8px;\n border-bottom: 1px solid #f0f0f0;\n }\n \n #pipe-calculator-container .segments-container {\n display: flex;\n gap: 15px;\n margin-bottom: 20px;\n flex-wrap: wrap;\n }\n \n #pipe-calculator-container .segment {\n flex: 1;\n min-width: 200px;\n background-color: #f8f9fa;\n border-radius: 8px;\n padding: 15px;\n box-shadow: 0 2px 6px rgba(0,0,0,0.05);\n }\n \n #pipe-calculator-container .segment-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 12px;\n text-align: center;\n padding-bottom: 8px;\n border-bottom: 1px solid #eaeaea;\n }\n \n #pipe-calculator-container .input-group {\n margin-bottom: 12px;\n }\n \n #pipe-calculator-container .input-group label {\n display: block;\n margin-bottom: 6px;\n font-size: 13px;\n color: #555;\n font-weight: 500;\n }\n \n #pipe-calculator-container .input-group input, \n #pipe-calculator-container .input-group select {\n width: 100%;\n padding: 10px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n }\n \n #pipe-calculator-container .order-section {\n background-color: #f0f7ff;\n padding: 15px;\n border-radius: 8px;\n margin-bottom: 15px;\n }\n \n #pipe-calculator-container .calculate-btn {\n background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);\n color: white;\n border: none;\n padding: 12px;\n font-size: 16px;\n border-radius: 8px;\n cursor: pointer;\n width: 100%;\n font-weight: 600;\n margin-bottom: 15px;\n }\n \n #pipe-calculator-container .results-section {\n background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);\n padding: 20px;\n border-radius: 8px;\n display: none;\n }\n \n #pipe-calculator-container .results-section h3 {\n color: #2c3e50;\n margin-bottom: 15px;\n text-align: center;\n font-size: 18px;\n }\n \n #pipe-calculator-container .segment-results {\n display: flex;\n gap: 10px;\n margin-bottom: 15px;\n flex-wrap: wrap;\n }\n \n #pipe-calculator-container .segment-result {\n flex: 1;\n min-width: 150px;\n background-color: white;\n padding: 12px;\n border-radius: 6px;\n text-align: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.05);\n }\n \n #pipe-calculator-container .weight-value {\n font-size: 18px;\n font-weight: bold;\n color: #2c3e50;\n margin: 8px 0;\n }\n \n #pipe-calculator-container .total-weight {\n font-size: 20px;\n color: #e74c3c;\n margin: 15px 0;\n font-weight: bold;\n padding: 12px;\n background-color: white;\n border-radius: 6px;\n text-align: center;\n }\n \n #pipe-calculator-container .note {\n font-size: 12px;\n color: #7f8c8d;\n text-align: center;\n margin-top: 10px;\n }\n \n \/* Responsive Styles *\/\n @media (max-width: 768px) {\n #pipe-calculator-container .segments-container {\n flex-direction: column;\n }\n \n #pipe-calculator-container .segment {\n min-width: 100%;\n }\n \n #pipe-calculator-container .segment-results {\n flex-direction: column;\n }\n \n #pipe-calculator-container .segment-result {\n min-width: 100%;\n }\n }\n <\/style>\n<\/head>\n<body>\n \n <div id=\"pipe-calculator-container\">\n <div class=\"calculator-header\">\n <h1>Kalkulator Berat Pipa Karbon<\/h1>\n <p>Hitung berat pipa karbon berdasarkan ukuran, ketebalan, dan panjang<\/p>\n <\/div>\n \n <div class=\"calculator-content\">\n <h2 class=\"section-title\">Data Pipa Karbon<\/h2>\n \n <div class=\"segments-container\">\n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 1<\/div>\n <div class=\"input-group\">\n <label for=\"thickness1\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness1\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <option value=\"4.0\">4.0 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size1\">Ukuran Pipa (inci)<\/label>\n <select id=\"size1\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"3.5\">3.5″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <option value=\"8\">8″<\/option>\n <option value=\"10\">10″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length1\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length1\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\">\n <\/div>\n <\/div>\n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 2<\/div>\n <div class=\"input-group\">\n <label for=\"thickness2\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness2\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <option value=\"4.0\">4.0 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size2\">Ukuran Pipa (inci)<\/label>\n <select id=\"size2\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"3.5\">3.5″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <option value=\"8\">8″<\/option>\n <option value=\"10\">10″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length2\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length2\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\">\n <\/div>\n <\/div>\n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 3<\/div>\n <div class=\"input-group\">\n <label for=\"thickness3\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness3\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <option value=\"4.0\">4.0 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size3\">Ukuran Pipa (inci)<\/label>\n <select id=\"size3\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"3.5\">3.5″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <option value=\"8\">8″<\/option>\n <option value=\"10\">10″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length3\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length3\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\">\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"order-section\">\n <h2 class=\"section-title\">Informasi Pesanan<\/h2>\n <div class=\"input-group\">\n <label for=\"quantity\">Jumlah Pipa (unit)<\/label>\n <input type=\"number\" id=\"quantity\" min=\"1\" value=\"1\" placeholder=\"Masukkan jumlah pipa\">\n <\/div>\n <\/div>\n \n <button id=\"calculateBtn\" class=\"calculate-btn\">Hitung Berat Pipa<\/button>\n \n <div id=\"resultsSection\" class=\"results-section\">\n <h3>Hasil Perhitungan<\/h3>\n \n <div id=\"segmentResults\" class=\"segment-results\">\n \n <\/div>\n \n <div id=\"totalPerPipe\" class=\"total-weight\">\n \n <\/div>\n \n <div id=\"totalOrder\" class=\"total-weight\">\n \n <\/div>\n \n <p class=\"note\">* Berat dihitung berdasarkan densitas baja karbon 7850 kg\/m\u00b3<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ JavaScript untuk kalkulator\n document.getElementById('calculateBtn').addEventListener('click', function() {\n \/\/ Densitas baja karbon (kg\/m\u00b3)\n const density = 7850;\n \n let totalWeight = 0;\n let segmentDetails = [];\n \n \/\/ Hitung berat untuk setiap segmen\n for (let i = 1; i <= 3; i++) {\n const thickness = parseFloat(document.getElementById('thickness' + i).value);\n const size = parseFloat(document.getElementById('size' + i).value);\n const length = parseFloat(document.getElementById('length' + i).value);\n \n \/\/ Lewati segmen jika tidak ada data\n if (isNaN(thickness) || isNaN(size) || isNaN(length) || length <= 0) {\n segmentDetails.push(null);\n continue;\n }\n \n \/\/ Konversi inci ke meter untuk diameter luar\n const outerDiameter = size * 0.0254;\n \n \/\/ Konversi mm ke meter untuk ketebalan\n const thicknessMeter = thickness \/ 1000;\n \n \/\/ Hitung diameter dalam\n const innerDiameter = outerDiameter - (2 * thicknessMeter);\n \n \/\/ Hitung luas penampang pipa\n const crossSectionalArea = Math.PI * (Math.pow(outerDiameter\/2, 2) - Math.pow(innerDiameter\/2, 2));\n \n \/\/ Hitung volume pipa\n const volume = crossSectionalArea * length;\n \n \/\/ Hitung berat pipa (kg)\n const weight = volume * density;\n \n totalWeight += weight;\n segmentDetails.push({\n thickness: thickness,\n size: size,\n length: length,\n weight: weight\n });\n }\n \n \/\/ Ambil jumlah pesanan\n const quantity = parseInt(document.getElementById('quantity').value) || 1;\n \n \/\/ Hitung berat total\n const totalOrderWeight = totalWeight * quantity;\n \n \/\/ Tampilkan hasil\n const segmentResults = document.getElementById('segmentResults');\n const totalPerPipe = document.getElementById('totalPerPipe');\n const totalOrder = document.getElementById('totalOrder');\n const resultsSection = document.getElementById('resultsSection');\n \n let segmentHTML = '';\n \n for (let i = 0; i < segmentDetails.length; i++) {\n if (segmentDetails[i]) {\n segmentHTML += `\n <div class=\"segment-result\">\n <h4>Segmen ${i+1}<\/h4>\n <p>Tebal: ${segmentDetails[i].thickness} mm<\/p>\n <p>Ukuran: ${segmentDetails[i].size}\"<\/p>\n <p>Panjang: ${segmentDetails[i].length} m<\/p>\n <p class=\"weight-value\">${segmentDetails[i].weight.toFixed(2)} kg<\/p>\n <\/div>\n `;\n }\n }\n \n \/\/ Jika tidak ada segmen yang diisi\n if (segmentHTML === '') {\n segmentHTML = '<p>Silakan isi data untuk setidaknya satu segmen pipa<\/p>';\n }\n \n segmentResults.innerHTML = segmentHTML;\n totalPerPipe.textContent = `Berat Total per Pipa: ${totalWeight.toFixed(2)} kg`;\n totalOrder.textContent = `Berat Total Pesanan (${quantity} pipa): ${totalOrderWeight.toFixed(2)} kg`;\n \n resultsSection.style.display = 'block';\n \n \/\/ Scroll ke hasil\n resultsSection.scrollIntoView({ behavior: 'smooth' });\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n\r\n<p> <\/p>\r\n<p> <\/p>\r\n<p><style>\r\n table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n }\r\n table, th, td {\r\n border: 1px solid black;\r\n }\r\n th, td {\r\n padding: 8px;\r\n text-align: left;\r\n }\r\n <\/style><\/p>\r\n<h2>Tabel Harga Tiang<\/h2>\r\n\n\r\n<table style=\"height: 403px;\" width=\"386\">\r\n<tbody>\r\n<tr>\r\n<td width=\"101\">Tinggi Tiang<\/td>\r\n<td width=\"137\">Diameter<\/td>\r\n<td width=\"95\">\u00a0Harga (Rp.)\u00a0<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>2.5 inch full<\/td>\r\n<td>Rp. 500,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>3 inch full<\/td>\r\n<td>Rp. 550,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>4 inch full<\/td>\r\n<td>Rp. 650,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>6 Meter<\/td>\r\n<td>5 inch full<\/td>\r\n<td>Rp. 800,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>7 Meter<\/td>\r\n<td>3 inch 2.5 inch<\/td>\r\n<td>Rp. 750,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>7 Meter<\/td>\r\n<td>4 inch 3 inch<\/td>\r\n<td>Rp. 850,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>7 Meter<\/td>\r\n<td>5 inch 4 inch<\/td>\r\n<td>Rp. 1,000,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>9 Meter<\/td>\r\n<td>3 inch 2.5 inch<\/td>\r\n<td>Rp. 1,150,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>9 Meter<\/td>\r\n<td>4 inch 3 inch<\/td>\r\n<td>Rp. 1,250,000<\/td>\r\n<\/tr>\r\n<tr>\r\n<td>9 Meter<\/td>\r\n<td>5 inch 4 inch<\/td>\r\n<td>Rp. 1,400,000<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n<p>* Harga FRANKO PABRIK, diluar biaya dan jasa pengiriman. Harga diatas adalah untuk pemesanan minimal 100 batang. Harga dapat berubah sewaktu waktu menyesuaikan Kurs dollar. Untuk mengetahui harga saat ini, cara & syarat pemesanan hubungi marketing kami.\u00a0<\/p>\r\n\n\n\n\n\n\n\n<h4 style=\"cursor: text;\">Jenis Tiang Fiber Optik<\/h4>\n<p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong>Tiang fiber optik hadir dalam beberapa jenis, tergantung fungsinya:<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px; cursor: text;\"><strong>* <span style=\"cursor: text;\"><u>Tiang Distribusi<\/u><\/span><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Menghubungkan kabel dari jaringan utama ke pelanggan. Biasanya ramping dan dipasang lebih rapat.<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Aplikasi: Tiang tinggi, 6 meter, 7 Meter dan 8 Meter<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong>* <u>Tiang Transmisi<\/u><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong style=\"cursor: text;\"> Dirancang untuk jarak jauh antar wilayah. Lebih tinggi, Menyebrtang Jalan raya yang padat dan kuat.<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Aplikasi: Tiang tinggi, 9 Meter dan 12 Meter<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong style=\"cursor: text;\">* <u>Tiang Intermediate<\/u><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Menopang kabel di tikungan atau sambungan agar tetap stabil dan rapi.<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Aplikasi: Biasanya dibedakan dengan ketebalan Tiang. Jika kedua tiang diatas tebalnya 2,5 mm, maka Tiang ini disarankan diatas 3 mm<\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong><br><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong style=\"cursor: text;\">*<u> Tiang Multifungsi<\/u><\/strong><\/span><\/p><p style=\"cursor: text;\"><span style=\"font-size: 14.4px;\"><strong> Selain kabel optik, juga bisa menopang CCTV, lampu jalan, hingga sensor IoT.<\/strong><\/span><\/p><p><br><\/p>\n\n\n\n\n\n\r\n<p>WARNA <span style=\"font-weight: normal;\">SESUKA HATI<\/span><\/p>\r\n\n\r\n<p><strong>TIDAK ADA BIAYA TAMBAHAN<\/strong><\/p>\r\n\n\n\r\n<p><strong><em>Pabrikasi Tiang Berkualitas di Bekasi, Jawa Barat<\/em><\/strong><\/p>\r\n<p>Pabrikasi tiang kami yang berlokasi di Bekasi, Jawa Barat, adalah solusi terbaik untuk kebutuhan tiang Fiber Optik dan Tiang Peju berbagai ukuran. Kami mengutamakan kualitas dengan dukungan mesin-mesin modern yang memastikan setiap produk memiliki standar tinggi. Dalam setiap proses produksi, kami memanfaatkan teknologi terkini untuk menghasilkan tiang yang kokoh, tahan lama, dan sesuai spesifikasi kebutuhan pelanggan.<\/p>\r\n<h3>Mesin Modern <br \/>untuk Produksi Berkualitas<\/h3>\r\n<p>Dalam operasional kami, mesin-mesin modern memainkan peran penting. Dengan peralatan canggih ini, kami dapat memproduksi tiang Fiber Optik dengan berbagai ukuran, termasuk panjang 6 meter, 7 meter, 9 meter, hingga ukuran khusus (custom). Selain itu, kami juga memproduksi Tiang Peju yang andal untuk berbagai keperluan infrastruktur. Proses yang presisi memastikan setiap produk memenuhi standar teknis dan estetika, memberikan nilai tambah bagi proyek pelanggan.<\/p>\r\n<h3>Tim Ahli Berpengalaman<\/h3>\r\n<p>Kami bangga memiliki tim ahli pengelasan yang telah berpengalaman puluhan tahun. Keahlian mereka menjamin setiap sambungan pada tiang memiliki kekuatan optimal dan ketahanan maksimal. Dengan kombinasi teknologi modern dan tenaga ahli, pabrikasi kami mampu memenuhi kebutuhan proyek kecil hingga besar dengan hasil yang konsisten.<\/p>\r\n<h3>Keuntungan Berbelanja <br \/>di Workshop Kami<\/h3>\r\n<p>Untuk pelanggan yang memilih berbelanja langsung di workshop kami, kami menawarkan layanan tambahan yang istimewa. Setiap pembelian tiang akan mendapatkan <strong>gratis custom pengecatan<\/strong>. Pelanggan dapat memilih warna sesuai keinginan tanpa biaya tambahan, memberikan fleksibilitas untuk mencocokkan produk dengan kebutuhan proyek mereka.<\/p>\r\n<p>Selain itu, kami memberikan <strong>potongan harga sebesar Rp 10 ribu per barang yang dipesan<\/strong> bagi pelanggan yang bersedia memberikan ulasan terbaik dan bintang lima di Google Maps untuk produk kami. Sebuah kesempatan yang sangat menarik, terutama jika Anda memesan dalam jumlah besar. Contohnya, dengan pemesanan minimal 100 batang, Anda akan mendapatkan potongan harga hingga <strong>Rp 1 juta<\/strong>!<\/p>\r\n<h3>Mengapa Memilih Kami?<\/h3>\r\n<ol>\r\n<li><strong>Kualitas Terjamin:<\/strong> Tiang yang diproduksi menggunakan bahan berkualitas tinggi dan proses modern.<\/li>\r\n<li><strong>Ahli Profesional:<\/strong> Tim pengelasan berpengalaman yang memastikan setiap produk tahan lama.<\/li>\r\n<li><strong>Harga Kompetitif:<\/strong> Harga langsung dari pabrik dengan berbagai penawaran diskon menarik.<\/li>\r\n<li><strong>Pelayanan Tambahan:<\/strong> Gratis custom pengecatan untuk semua tiang yang dipesan di workshop.<\/li>\r\n<li><strong>Potongan Harga:<\/strong> Peluang mendapatkan potongan besar melalui ulasan pelanggan di Google Maps.<\/li>\r\n<\/ol>\r\n<h3>Pemesanan Mudah dan Cepat<\/h3>\r\n<p>Kami memahami bahwa proyek Anda memerlukan produk tepat waktu dan dalam kondisi terbaik. Oleh karena itu, kami menyediakan layanan pemesanan yang cepat dan responsif. Cukup hubungi tim kami untuk berkonsultasi mengenai kebutuhan Anda, dan kami akan memastikan proses produksi hingga pengiriman berjalan lancar.<\/p>\r\n<h3>Hubungi Kami Sekarang<\/h3>\r\n<p> <\/p>\r\n<p>Untuk informasi lebih lanjut dan pemesanan, Anda dapat menghubungi kami melalui nomor kontak atau mengunjungi workshop kami di Bekasi. Kami siap membantu Anda mendapatkan tiang Fiber Optik dan Tiang Pju terbaik dengan harga terjangkau. Jangan lewatkan kesempatan untuk mendapatkan produk berkualitas dengan penawaran menarik dari kami!<\/p>\r\n\n\r\n<p><span style=\"font-size: 14.4px;\">Terima kasih telah berkunjung. Kami sangat menghargai jika Anda bersedia memberikan ulasan di Google Maps. Dapatkan potongan Rp 10.000 dari setiap batang yang anda beli.\u00a0 <a href=\"https:\/\/maps.app.goo.gl\/8pjfmTAbtTUfQMhV8\">Klik link berikut<\/a> untuk menulis ulasan.\u00a0<\/span><\/p>\r\n\n\n\n\n\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\n\r\n<h3><strong><span style=\"font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-size: 20.2px; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal;\">Apa yang Membuat Harga Tiang Fiber Optik Berbeda?<\/span><\/strong><\/h3>\r\n\n\r\n<p><span style=\"font-size: 14.4px;\">Bagi Anda yang sedang mencari tiang Fiber Optik (FO), mungkin pernah bertanya-tanya, \u201cMengapa harga tiang berbeda-beda?\u201d Beberapa faktor utama memengaruhi perbedaan harga ini. Memahami faktor-faktor ini akan membantu Anda membuat keputusan yang tepat sesuai dengan kebutuhan Anda. Berikut adalah faktor-faktor utama yang memengaruhi harga tiang Fiber Optik:<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">1. Panjang Tiang<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Panjang tiang menjadi faktor pertama yang memengaruhi harga. Tiang Fiber Optik tersedia dalam berbagai panjang, seperti 6 meter, 7 meter, dan 9 meter.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Tiang 6 meter: Ideal untuk kebutuhan instalasi dengan ketinggian yang tidak terlalu tinggi.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Tiang 7 meter: Cocok untuk kebutuhan menengah, menawarkan keseimbangan antara ketinggian dan harga.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Tiang 9 meter: Biasanya digunakan untuk proyek besar atau instalasi yang membutuhkan ketinggian lebih.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Semakin panjang tiang, semakin banyak bahan baku yang digunakan, yang otomatis meningkatkan harga produk.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">2. Segmen Tiang<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Segmen tiang adalah istilah yang digunakan untuk menggambarkan ukuran diameter pipa yang digunakan pada tiang. Tiang Fiber Optik biasanya terdiri dari beberapa segmen pipa dengan ukuran yang bervariasi, seperti:<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 5 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 4 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 3 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 2,5 inci<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Setiap segmen ini memiliki fungsi untuk memberikan kekuatan struktural yang optimal. Semakin banyak segmen yang digunakan dan semakin besar diameter pipa, maka semakin tinggi pula harga tiang tersebut. Ini karena kebutuhan bahan baku yang lebih banyak dan proses produksi yang lebih kompleks.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">3. Ketebalan Tiang Fiber Optik<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Selain panjang dan segmen, ketebalan pipa juga menjadi faktor penting. Tiang Fiber Optik yang kami produksi tersedia dalam ketebalan:<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 2 mm<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 2,5 mm<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 3,5 mm<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Semakin tebal pipa, semakin kuat tiang tersebut, namun juga semakin tinggi harga produksinya. Pemilihan ketebalan tergantung pada kebutuhan proyek Anda.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">4. Berat Pipa<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Berat pipa sangat bergantung pada kombinasi panjang, segmen, dan ketebalan pipa yang digunakan. Semakin berat pipa, biaya produksi dan pengiriman juga akan meningkat.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">5. Ornamen Tambahan<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Harga tiang Fiber Optik akan bertambah jika dilengkapi dengan ornamen seperti:<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Emblem atau Logo: Menambahkan logo khusus pada tiang untuk identitas.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">\u2022 Lakop (Penutup Tambahan): Penutup tambahan pada body pipa. Ukuran lakop disesuaikan dengan panjang besi tambahan.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Fitur tambahan ini memberikan nilai estetika dan fungsional pada tiang, namun menambah biaya.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">6. Warna Identitas Tiang<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Kami menyediakan fasilitas gratis untuk satu warna identitas pada tiang. Jika Anda menginginkan lebih dari satu warna, akan dikenakan biaya tambahan untuk setiap warna berikutnya.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">7. Biaya Pengiriman<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Harga yang kami tawarkan adalah franko pabrik, artinya belum termasuk biaya pengiriman ke lokasi Anda. Biaya pengiriman akan dihitung terpisah sesuai jarak dan kebutuhan transportasi.<\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\">8. Pajak<\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Harga yang tertera belum termasuk pajak. Jika Anda membutuhkan faktur pajak, akan ditambahkan 11% dari total biaya pembelian produk. Harap dicatat bahwa biaya pengiriman tidak dimasukkan ke dalam faktur pajak.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\"><strong><u>\u00a0<\/u><\/strong><\/span><\/p>\r\n<p><strong><span style=\"font-size: 14.4px;\"><u>Mengapa Penting Memahami Faktor Ini?<\/u><\/span><\/strong><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Dengan mengetahui berbagai faktor di atas, Anda dapat memilih tiang Fiber Optik yang sesuai dengan kebutuhan teknis dan anggaran Anda. Misalnya, jika Anda memiliki proyek besar dengan kebutuhan ketinggian tertentu, tiang yang lebih panjang, tebal, dan memiliki segmen lebih banyak mungkin menjadi pilihan terbaik. Namun, jika anggaran terbatas, Anda bisa memilih kombinasi yang lebih sederhana tanpa mengorbankan kualitas.<\/span><\/p>\r\n<p><span style=\"font-size: 14.4px;\">Kami di tiangjalan.com menyediakan berbagai pilihan tiang Fiber Optik dengan kualitas terbaik dan harga yang kompetitif. Jangan ragu untuk menghubungi kami untuk konsultasi atau penawaran harga khusus!<\/span><\/p>\r\n<p> <\/p>\r\n\n\n\n\n\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\n\n\n\r\n<h4>Harga Khusus,Anggota APJII<\/h4>\r\n\n\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Kami melayani pemesanan retail maupun partai besar dengan jaminan kualitas dan hasil terbaik. Kepuasan Anda adalah prioritas kami, dan kami siap membantu mewujudkan kebutuhan konstruksi tiang Anda dengan layanan profesional.<\/p>\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Hubungi Kami untuk Informasi Lebih Lanjut:\u00a0Jika Anda memerlukan spesifikasi detail atau ingin mengetahui penawaran harga terbaik,<br \/>jangan ragu untuk menghubungi kami:<\/p>\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Ayu<br \/>WhatsApp:\u00a008111150660<\/p>\r\n<p style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">\u00a0<\/p>\r\n<p style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-align: start; text-decoration-style: initial;\">\u00a0<\/p>\r\n<p class=\"MsoNormal\" style=\"font-variant-numeric: inherit; font-variant-east-asian: inherit; font-variant-alternates: inherit; font-variant-position: inherit; font-variant-emoji: inherit; font-size: 14.4px; line-height: normal; font-family: Lato, sans-serif; color: #5b5b5b; letter-spacing: normal; text-decoration-style: initial;\">Kami siap melayani Anda dengan sepenuh hati dan menjadi solusi terbaik untuk kebutuhan konstruksi tiang Anda. Terima kasih telah mengunjungi website kami!<br \/><br \/><\/p>\r\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\r\n<p style=\"text-align: center;\">Dapatkan harga khusus, bagi Anggota <strong>APJII<\/strong>. Silakan hubungi\u00a0 marketing kami, isi data yang tersedia, kirimkan kepada kami sekarang. Klik tombol dibawah ini untuk terhubung<\/p>\r\n\n\n\n\n\r\n<h5>Mitra Kerja Internet<\/h5>\r\n\n\n\n\n\n\n\n\n\n\n<!DOCTYPE html>\n<html>\n<head>\n <title>Kalkulator Berat Pipa Karbon<\/title>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n \n <style>\n \/* RESET STYLES *\/\n #pipe-calculator-container, \n #pipe-calculator-container * {\n box-sizing: border-box !important;\n margin: 0 !important;\n padding: 0 !important;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;\n line-height: 1.4 !important;\n }\n \n #pipe-calculator-container {\n max-width: 100% !important;\n background-color: #fff9e6 !important;\n border-radius: 12px !important;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;\n overflow: hidden !important;\n margin: 20px 0 !important;\n border: 1px solid #e0e0e0 !important;\n }\n \n \/* HEADER STYLES *\/\n #pipe-calculator-container .calculator-header {\n background: linear-gradient(135deg, #2c3e50 0%, #4a6491 100%) !important;\n color: white !important;\n padding: 20px !important;\n text-align: center !important;\n }\n \n #pipe-calculator-container .calculator-header h1 {\n font-size: 24px !important;\n margin-bottom: 8px !important;\n font-weight: 600 !important;\n }\n \n #pipe-calculator-container .calculator-header p {\n opacity: 0.9 !important;\n font-size: 14px !important;\n }\n \n \/* CONTENT STYLES *\/\n #pipe-calculator-container .calculator-content {\n padding: 20px !important;\n }\n \n #pipe-calculator-container .section-title {\n font-size: 18px !important;\n color: #2c3e50 !important;\n margin-bottom: 15px !important;\n padding-bottom: 8px !important;\n border-bottom: 1px solid #f0f0f0 !important;\n font-weight: 600 !important;\n }\n \n \/* SEGMENTS STYLES *\/\n #pipe-calculator-container .segments-container {\n display: flex !important;\n gap: 15px !important;\n margin-bottom: 20px !important;\n flex-wrap: wrap !important;\n }\n \n #pipe-calculator-container .segment {\n flex: 1 !important;\n min-width: 200px !important;\n background-color: #f8f9fa !important;\n border-radius: 8px !important;\n padding: 15px !important;\n box-shadow: 0 2px 6px rgba(0,0,0,0.05) !important;\n }\n \n #pipe-calculator-container .segment-title {\n font-size: 16px !important;\n font-weight: 600 !important;\n color: #2c3e50 !important;\n margin-bottom: 12px !important;\n text-align: center !important;\n padding-bottom: 8px !important;\n border-bottom: 1px solid #eaeaea !important;\n }\n \n \/* INPUT STYLES *\/\n #pipe-calculator-container .input-group {\n margin-bottom: 12px !important;\n }\n \n #pipe-calculator-container .input-group label {\n display: block !important;\n margin-bottom: 6px !important;\n font-size: 13px !important;\n color: #555 !important;\n font-weight: 500 !important;\n }\n \n #pipe-calculator-container .input-group input, \n #pipe-calculator-container .input-group select,\n #pipe-calculator-container .input-group textarea {\n width: 100% !important;\n padding: 10px !important;\n border: 1px solid #ddd !important;\n border-radius: 6px !important;\n font-size: 14px !important;\n background: white !important;\n }\n \n #pipe-calculator-container .input-group textarea {\n resize: vertical !important;\n min-height: 80px !important;\n font-family: inherit !important;\n }\n \n \/* ORDER SECTION *\/\n #pipe-calculator-container .order-section {\n background-color: #f0f7ff !important;\n padding: 15px !important;\n border-radius: 8px !important;\n margin-bottom: 15px !important;\n }\n \n \/* BUTTON STYLES *\/\n #pipe-calculator-container .button-group {\n display: flex !important;\n gap: 10px !important;\n margin-bottom: 15px !important;\n clear: both;\n }\n \n #pipe-calculator-container .calculate-btn, \n #pipe-calculator-container .save-btn {\n flex: 1 !important;\n color: white !important;\n border: none !important;\n padding: 12px !important;\n font-size: 16px !important;\n border-radius: 8px !important;\n cursor: pointer !important;\n font-weight: 600 !important;\n transition: all 0.3s ease !important;\n position: relative !important;\n z-index: 10 !important;\n }\n \n #pipe-calculator-container .calculate-btn:hover,\n #pipe-calculator-container .save-btn:hover {\n transform: translateY(-2px) !important;\n box-shadow: 0 4px 8px rgba(0,0,0,0.2) !important;\n }\n \n #pipe-calculator-container .calculate-btn {\n background: linear-gradient(135deg, #3498db 0%, #2980b9 100%) !important;\n }\n \n #pipe-calculator-container .save-btn {\n background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;\n }\n \n \/* RESULTS SECTION *\/\n #pipe-calculator-container .results-section {\n background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%) !important;\n padding: 20px !important;\n border-radius: 8px !important;\n display: none !important;\n }\n \n #pipe-calculator-container .results-section h3 {\n color: #2c3e50 !important;\n margin-bottom: 15px !important;\n text-align: center !important;\n font-size: 18px !important;\n font-weight: 600 !important;\n }\n \n \/* SEGMENT RESULTS *\/\n #pipe-calculator-container .segment-results {\n display: flex !important;\n gap: 10px !important;\n margin-bottom: 15px !important;\n flex-wrap: wrap !important;\n }\n \n #pipe-calculator-container .segment-result {\n flex: 1 !important;\n min-width: 150px !important;\n background-color: white !important;\n padding: 12px !important;\n border-radius: 6px !important;\n text-align: center !important;\n box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;\n }\n \n #pipe-calculator-container .weight-value {\n font-size: 18px !important;\n font-weight: bold !important;\n color: #2c3e50 !important;\n margin: 8px 0 !important;\n }\n \n #pipe-calculator-container .total-weight {\n font-size: 20px !important;\n color: #e74c3c !important;\n margin: 15px 0 !important;\n font-weight: bold !important;\n padding: 12px !important;\n background-color: white !important;\n border-radius: 6px !important;\n text-align: center !important;\n }\n \n \/* NOTE STYLES *\/\n #pipe-calculator-container .note {\n font-size: 12px !important;\n color: #7f8c8d !important;\n text-align: center !important;\n margin-top: 10px !important;\n }\n \n \/* RADIO GROUP *\/\n #pipe-calculator-container .radio-group {\n display: flex !important;\n gap: 15px !important;\n margin-top: 5px !important;\n }\n \n #pipe-calculator-container .radio-option {\n display: flex !important;\n align-items: center !important;\n gap: 5px !important;\n }\n \n #pipe-calculator-container .radio-option input[type=\"radio\"] {\n width: auto !important;\n }\n \n \/* COST BREAKDOWN *\/\n #pipe-calculator-container .cost-breakdown {\n background-color: #f8f9fa !important;\n border-radius: 8px !important;\n padding: 15px !important;\n margin-bottom: 15px !important;\n }\n \n #pipe-calculator-container .cost-item {\n display: flex !important;\n justify-content: space-between !important;\n margin-bottom: 8px !important;\n padding-bottom: 8px !important;\n border-bottom: 1px dashed #e0e0e0 !important;\n }\n \n #pipe-calculator-container .cost-item:last-child {\n border-bottom: none !important;\n font-weight: bold !important;\n font-size: 16px !important;\n color: #2c3e50 !important;\n }\n \n \/* PAYMENT INFO *\/\n #pipe-calculator-container .payment-info {\n background-color: #fff3cd !important;\n border: 1px solid #ffeaa7 !important;\n border-radius: 8px !important;\n padding: 15px !important;\n margin-top: 15px !important;\n }\n \n #pipe-calculator-container .payment-info h4 {\n color: #856404 !important;\n margin-bottom: 10px !important;\n font-weight: 600 !important;\n }\n \n #pipe-calculator-container .payment-details {\n margin-top: 10px !important;\n }\n \n #pipe-calculator-container .payment-details p {\n margin-bottom: 5px !important;\n font-size: 14px !important;\n }\n \n \/* ACCESSORIES SECTION *\/\n #pipe-calculator-container .accessories-section {\n background-color: #fff0f5 !important;\n padding: 15px !important;\n border-radius: 8px !important;\n margin-bottom: 15px !important;\n }\n \n #pipe-calculator-container .accessory-item {\n display: flex !important;\n justify-content: space-between !important;\n align-items: center !important;\n margin-bottom: 10px !important;\n padding: 10px !important;\n background-color: white !important;\n border-radius: 6px !important;\n border: 1px solid #e0e0e0 !important;\n }\n \n #pipe-calculator-container .accessory-label {\n flex: 0 0 150px !important;\n font-weight: 500 !important;\n }\n \n #pipe-calculator-container .accessory-price {\n flex: 0 0 120px !important;\n margin: 0 10px !important;\n }\n \n #pipe-calculator-container .accessory-price input {\n width: 100% !important;\n padding: 8px !important;\n border: 1px solid #ddd !important;\n border-radius: 4px !important;\n text-align: right !important;\n }\n \n #pipe-calculator-container .accessory-item-textarea {\n align-items: flex-start !important;\n }\n \n #pipe-calculator-container .accessory-textarea-container {\n flex: 1 !important;\n margin: 0 10px !important;\n display: flex !important;\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .accessory-textarea-container textarea {\n width: 100% !important;\n padding: 8px !important;\n border: 1px solid #ddd !important;\n border-radius: 4px !important;\n resize: vertical !important;\n min-height: 60px !important;\n font-family: inherit !important;\n font-size: 14px !important;\n }\n \n #pipe-calculator-container .accessory-total {\n flex: 0 0 100px !important;\n text-align: right !important;\n font-weight: bold !important;\n }\n \n \/* ORDER DETAILS *\/\n #pipe-calculator-container .order-details {\n background-color: #e8f4fd !important;\n border-radius: 8px !important;\n padding: 15px !important;\n margin-top: 15px !important;\n }\n \n #pipe-calculator-container .order-details h4 {\n color: #2c3e50 !important;\n margin-bottom: 10px !important;\n font-weight: 600 !important;\n }\n \n #pipe-calculator-container .segment-detail {\n margin-bottom: 8px !important;\n padding: 8px !important;\n background-color: white !important;\n border-radius: 4px !important;\n border-left: 4px solid #3498db !important;\n }\n \n \/* RESPONSIVE STYLES *\/\n @media (max-width: 768px) {\n #pipe-calculator-container .segments-container {\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .segment {\n min-width: 100% !important;\n }\n \n #pipe-calculator-container .segment-results {\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .segment-result {\n min-width: 100% !important;\n }\n \n #pipe-calculator-container .button-group {\n flex-direction: column !important;\n }\n \n #pipe-calculator-container .accessory-item {\n flex-direction: column !important;\n align-items: flex-start !important;\n }\n \n #pipe-calculator-container .accessory-label {\n flex: 1 !important;\n margin-bottom: 5px !important;\n }\n \n #pipe-calculator-container .accessory-price {\n flex: 1 !important;\n width: 100% !important;\n margin: 5px 0 !important;\n }\n \n #pipe-calculator-container .accessory-textarea-container {\n width: 100% !important;\n margin: 5px 0 !important;\n }\n \n #pipe-calculator-container .accessory-total {\n flex: 1 !important;\n width: 100% !important;\n text-align: left !important;\n margin-top: 5px !important;\n }\n \n #pipe-calculator-container .radio-group {\n flex-direction: column !important;\n gap: 8px !important;\n }\n }\n\n \/* PRINT STYLES *\/\n @media print {\n body * {\n visibility: hidden;\n }\n \n #pipe-calculator-container, #pipe-calculator-container * {\n visibility: visible;\n }\n \n #pipe-calculator-container {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n }\n \n .button-group {\n display: none !important;\n }\n }\n \n \/* Loading indicator *\/\n .loading {\n display: inline-block;\n width: 20px;\n height: 20px;\n border: 3px solid rgba(255,255,255,.3);\n border-radius: 50%;\n border-top-color: #fff;\n animation: spin 1s ease-in-out infinite;\n }\n \n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n \n \/* Status message *\/\n .status-message {\n padding: 10px;\n margin: 10px 0;\n border-radius: 5px;\n text-align: center;\n display: none;\n }\n \n .status-message.error {\n background-color: #f8d7da;\n color: #721c24;\n border: 1px solid #f5c6cb;\n }\n \n .status-message.success {\n background-color: #d4edda;\n color: #155724;\n border: 1px solid #c3e6cb;\n }\n <\/style>\n<\/head>\n<body>\n \n <div id=\"pipe-calculator-container\">\n <div class=\"calculator-header\">\n <h1>Kalkulator Berat Pipa Karbon<\/h1>\n <p>Hitung berat pipa karbon berdasarkan ukuran, ketebalan, dan panjang<\/p>\n <\/div>\n \n <div id=\"statusMessage\" class=\"status-message\"><\/div>\n \n <div class=\"calculator-content\">\n \n <h2 class=\"section-title\">Data Pipa Karbon<\/h2>\n \n <div class=\"segments-container\">\n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 1<\/div>\n <div class=\"input-group\">\n <label for=\"thickness1\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness1\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"1.9\">1.9 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.1\">2.1 mm<\/option>\n <option value=\"2.2\">2.2 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.4\">2.4 mm<\/option>\n <option value=\"2.5\">2.5 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.7\">2.7 mm<\/option>\n <option value=\"2.8\">2.8 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.0\">3.0 mm<\/option>\n <option value=\"3.1\">3.1 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.3\">3.3 mm<\/option>\n <option value=\"3.4\">3.4 mm<\/option>\n <option value=\"3.5\">3.5 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size1\">Ukuran Pipa (inci)<\/label>\n <select id=\"size1\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2\">2″<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length1\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length1\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\" \/>\n <\/div>\n <\/div>\n \n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 2<\/div>\n <div class=\"input-group\">\n <label for=\"thickness2\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness2\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"1.9\">1.9 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.1\">2.1 mm<\/option>\n <option value=\"2.2\">2.2 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.4\">2.4 mm<\/option>\n <option value=\"2.5\">2.5 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.7\">2.7 mm<\/option>\n <option value=\"2.8\">2.8 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.0\">3.0 mm<\/option>\n <option value=\"3.1\">3.1 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.3\">3.3 mm<\/option>\n <option value=\"3.4\">3.4 mm<\/option>\n <option value=\"3.5\">3.5 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size2\">Ukuran Pipa (inci)<\/label>\n <select id=\"size2\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2\">2″<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length2\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length2\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\" \/>\n <\/div>\n <\/div>\n \n \n <div class=\"segment\">\n <div class=\"segment-title\">Segmen 3<\/div>\n <div class=\"input-group\">\n <label for=\"thickness3\">Tebal Pipa (mm)<\/label>\n <select id=\"thickness3\">\n <option value=\"\">Pilih ketebalan<\/option>\n <option value=\"1.8\">1.8 mm<\/option>\n <option value=\"1.9\">1.9 mm<\/option>\n <option value=\"2.0\">2.0 mm<\/option>\n <option value=\"2.1\">2.1 mm<\/option>\n <option value=\"2.2\">2.2 mm<\/option>\n <option value=\"2.3\">2.3 mm<\/option>\n <option value=\"2.4\">2.4 mm<\/option>\n <option value=\"2.5\">2.5 mm<\/option>\n <option value=\"2.6\">2.6 mm<\/option>\n <option value=\"2.7\">2.7 mm<\/option>\n <option value=\"2.8\">2.8 mm<\/option>\n <option value=\"2.9\">2.9 mm<\/option>\n <option value=\"3.0\">3.0 mm<\/option>\n <option value=\"3.1\">3.1 mm<\/option>\n <option value=\"3.2\">3.2 mm<\/option>\n <option value=\"3.3\">3.3 mm<\/option>\n <option value=\"3.4\">3.4 mm<\/option>\n <option value=\"3.5\">3.5 mm<\/option>\n <option value=\"3.6\">3.6 mm<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"size3\">Ukuran Pipa (inci)<\/label>\n <select id=\"size3\">\n <option value=\"\">Pilih ukuran<\/option>\n <option value=\"2\">2″<\/option>\n <option value=\"2.5\">2.5″<\/option>\n <option value=\"3\">3″<\/option>\n <option value=\"4\">4″<\/option>\n <option value=\"5\">5″<\/option>\n <option value=\"6\">6″<\/option>\n <\/select>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"length3\">Panjang Pipa (meter)<\/label>\n <input type=\"number\" id=\"length3\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan panjang\" \/>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"order-section\">\n <h2 class=\"section-title\">Informasi Pesanan<\/h2>\n <div class=\"input-group\">\n <label for=\"quantity\">Jumlah Pipa (unit)<\/label>\n <input type=\"number\" id=\"quantity\" min=\"1\" value=\"1\" placeholder=\"Masukkan jumlah pipa\" \/>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"finish\">Jenis Finishing<\/label>\n <div class=\"radio-group\">\n <div class=\"radio-option\">\n <input type=\"radio\" id=\"galvanis\" name=\"finish\" value=\"galvanis\" checked \/>\n <label for=\"galvanis\">Galvanis (+Rp 14.300\/kg)<\/label>\n <\/div>\n <div class=\"radio-option\">\n <input type=\"radio\" id=\"cat\" name=\"finish\" value=\"cat\" \/>\n <label for=\"cat\">Cat Hitam (Gratis)<\/label>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"biayaKirim\">Biaya Kirim (Rp)<\/label>\n <input type=\"number\" id=\"biayaKirim\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya pengiriman\" \/>\n <\/div>\n\n <div class=\"input-group\">\n <label for=\"biayaTol\">Biaya Tol (Rp)<\/label>\n <input type=\"number\" id=\"biayaTol\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya tol\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"biayaRazia\">Biaya Razia (Rp)<\/label>\n <input type=\"number\" id=\"biayaRazia\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya razia\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"biayaPenurunan\">Biaya Penurunan Barang (Rp)<\/label>\n <input type=\"number\" id=\"biayaPenurunan\" min=\"0\" step=\"0.01\" placeholder=\"Masukkan biaya penurunan\" \/>\n <\/div>\n <\/div>\n\n \n <div class=\"accessories-section\">\n <h2 class=\"section-title\">Aksesoris Tiang<\/h2>\n <p class=\"note\">Masukkan harga untuk aksesoris tiang (diisi manual)<\/p>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Label Embos Tiang<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"embosPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"embosTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Tangga Tiang<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"tanggaPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"tanggaTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Sablon Label<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"sablonPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"sablonTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\">\n <div class=\"accessory-label\">Baseplate<\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"baseplatePrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"baseplateTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item accessory-item-textarea\">\n <div class=\"accessory-label\">Pekerjaan Lain<\/div>\n <div class=\"accessory-textarea-container\">\n <textarea id=\"pekerjaanLainText\" placeholder=\"Deskripsi pekerjaan lain (opsional)\"><\/textarea>\n <\/div>\n <div class=\"accessory-price\">\n <input type=\"number\" id=\"pekerjaanLainPrice\" min=\"0\" step=\"0.01\" placeholder=\"Rp 0\" value=\"0\" \/>\n <\/div>\n <div class=\"accessory-total\" id=\"pekerjaanLainTotal\">Rp 0<\/div>\n <\/div>\n \n <div class=\"accessory-item\" style=\"background-color: #f8f9fa; font-weight: bold;\">\n <div class=\"accessory-label\">Total Aksesoris<\/div>\n <div class=\"accessory-textarea-container\"><\/div>\n <div class=\"accessory-price\"><\/div>\n <div class=\"accessory-total\" id=\"totalAccessories\">Rp 0<\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"order-section\">\n <h2 class=\"section-title\">Data Pemesan<\/h2>\n <div class=\"input-group\">\n <label for=\"customerName\">Nama Pemesan<\/label>\n <input type=\"text\" id=\"customerName\" placeholder=\"Masukkan nama lengkap\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"email\">Email<\/label>\n <input type=\"email\" id=\"email\" placeholder=\"Masukkan alamat email\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"city\">Kota<\/label>\n <input type=\"text\" id=\"city\" placeholder=\"Masukkan kota\" \/>\n <\/div>\n <div class=\"input-group\">\n <label for=\"whatsapp\">WhatsApp<\/label>\n <input type=\"tel\" id=\"whatsapp\" placeholder=\"Masukkan nomor WhatsApp\" \/>\n <\/div>\n <\/div>\n \n \n <div class=\"button-group\">\n <button id=\"calculateBtn\" class=\"calculate-btn\" onclick=\"calculateCosts()\">Hitung Biaya Total<\/button>\n <button id=\"savePdfBtn\" class=\"save-btn\" onclick=\"saveToPDF()\">Save PDF<\/button>\n <\/div>\n \n \n <div id=\"resultsSection\" class=\"results-section\">\n <h3>Hasil Perhitungan<\/h3>\n \n <div id=\"segmentResults\" class=\"segment-results\">\n \n <\/div>\n \n <div id=\"totalPerPipe\" class=\"total-weight\">\n \n <\/div>\n \n <div id=\"totalOrder\" class=\"total-weight\">\n \n <\/div>\n \n \n <div class=\"order-details\">\n <h4>Detail Pesanan<\/h4>\n <div id=\"orderDetailsContent\">\n \n <\/div>\n <\/div>\n \n \n <div class=\"cost-breakdown\">\n <h4>Rincian Biaya<\/h4>\n <div class=\"cost-item\">\n <span>Harga Besi (Rp 23.000\/kg):<\/span>\n <span id=\"steelCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya galvanis:<\/span>\n <span id=\"finishCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya Pengiriman:<\/span>\n <span id=\"shippingCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya Tambahan:<\/span>\n <span id=\"additionalCosts\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Biaya Aksesoris:<\/span>\n <span id=\"accessoriesCost\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>TOTAL BIAYA:<\/span>\n <span id=\"totalCost\">Rp 0<\/span>\n <\/div>\n <\/div>\n \n \n <div class=\"payment-info\">\n <h4>Informasi Pembayaran<\/h4>\n <div class=\"cost-item\">\n <span>Pembayaran DP\/Tanda Jadi (50%):<\/span>\n <span id=\"dpAmount\">Rp 0<\/span>\n <\/div>\n <div class=\"cost-item\">\n <span>Sisa Pembayaran (50%):<\/span>\n <span id=\"remainingAmount\">Rp 0<\/span>\n <\/div>\n \n <div class=\"payment-details\">\n <p><strong>Pembayaran ditransfer ke:<\/strong><\/p>\n <p>Nama Bank: Mandiri<\/p>\n <p>Cabang: Tebet, Jakarta Selatan<\/p>\n <p>Kode Bank: 008<\/p>\n <p>Nomor Rekening: 124 000 999 0707<\/p>\n <p>Nama Pemilik Rekening: CV Tokotower dot com<\/p>\n <p><strong>Catatan:<\/strong> Sisa pembayaran harus dilunasi sebelum barang dikirim, di transfer ke rekening yang sama<\/p>\n <\/div>\n <\/div>\n \n <p class=\"note\">* Berat dihitung berdasarkan densitas baja karbon 7850 kg\/m\u00b3<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2canvas\/1.4.1\/html2canvas.min.js\"><\/script>\n\n <script>\n \/\/ Konstanta harga\n const STEEL_PRICE_PER_KG = 23000;\n const GALVANIZING_PRICE_PER_KG = 14300;\n \n \/\/ Variabel global untuk menyimpan hasil perhitungan\n let calculationResults = null;\n \n \/\/ Fungsi untuk menampilkan pesan status\n function showStatus(message, isError = false) {\n const statusElement = document.getElementById('statusMessage');\n statusElement.textContent = message;\n statusElement.className = 'status-message ' + (isError ? 'error' : 'success');\n statusElement.style.display = 'block';\n \n \/\/ Sembunyikan pesan setelah 5 detik\n setTimeout(() => {\n statusElement.style.display = 'none';\n }, 5000);\n }\n \n \/\/ Fungsi untuk menunggu library dimuat\n function waitForLibraries() {\n return new Promise((resolve) => {\n const checkLibraries = () => {\n if (window.jspdf && window.html2canvas) {\n resolve();\n } else {\n setTimeout(checkLibraries, 100);\n }\n };\n checkLibraries();\n });\n }\n \n \/\/ Fungsi untuk inisialisasi setelah DOM dimuat\n function initCalculator() {\n \/\/ Event listener untuk input aksesoris\n document.getElementById('embosPrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('tanggaPrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('sablonPrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('baseplatePrice').addEventListener('input', updateAccessoriesTotal);\n document.getElementById('pekerjaanLainPrice').addEventListener('input', updateAccessoriesTotal);\n \n console.log(\"Kalkulator pipa karbon siap digunakan!\");\n \n \/\/ Set nilai default untuk testing\n document.getElementById('thickness1').value = '2.5';\n document.getElementById('size1').value = '3';\n document.getElementById('length1').value = '7';\n \n showStatus(\"Kalkulator siap digunakan. Silakan isi data pipa dan klik 'Hitung Biaya Total'.\");\n }\n \n function updateAccessoriesTotal() {\n const embosPrice = parseFloat(document.getElementById('embosPrice').value) || 0;\n const tanggaPrice = parseFloat(document.getElementById('tanggaPrice').value) || 0;\n const sablonPrice = parseFloat(document.getElementById('sablonPrice').value) || 0;\n const baseplatePrice = parseFloat(document.getElementById('baseplatePrice').value) || 0;\n const pekerjaanLainPrice = parseFloat(document.getElementById('pekerjaanLainPrice').value) || 0;\n \n \/\/ Update individual totals\n document.getElementById('embosTotal').textContent = `Rp ${embosPrice.toLocaleString('id-ID')}`;\n document.getElementById('tanggaTotal').textContent = `Rp ${tanggaPrice.toLocaleString('id-ID')}`;\n document.getElementById('sablonTotal').textContent = `Rp ${sablonPrice.toLocaleString('id-ID')}`;\n document.getElementById('baseplateTotal').textContent = `Rp ${baseplatePrice.toLocaleString('id-ID')}`;\n document.getElementById('pekerjaanLainTotal').textContent = `Rp ${pekerjaanLainPrice.toLocaleString('id-ID')}`;\n \n const totalAccessories = embosPrice + tanggaPrice + sablonPrice + baseplatePrice + pekerjaanLainPrice;\n document.getElementById('totalAccessories').textContent = `Rp ${totalAccessories.toLocaleString('id-ID')}`;\n \n return totalAccessories;\n }\n \n function calculateCosts() {\n try {\n \/\/ Densitas baja karbon (kg\/m\u00b3)\n const density = 7850;\n \n let totalWeight = 0;\n let segmentDetails = [];\n let hasValidSegment = false;\n \n \/\/ Hitung berat untuk setiap segmen\n for (let i = 1; i <= 3; i++) {\n const thickness = parseFloat(document.getElementById('thickness' + i).value);\n const size = parseFloat(document.getElementById('size' + i).value);\n const length = parseFloat(document.getElementById('length' + i).value);\n \n \/\/ Lewati segmen jika tidak ada data\n if (isNaN(thickness) || isNaN(size) || isNaN(length) || length <= 0) {\n continue;\n }\n \n hasValidSegment = true;\n \n \/\/ Konversi inci ke meter untuk diameter luar\n const outerDiameter = size * 0.0254;\n \n \/\/ Konversi mm ke meter untuk ketebalan\n const thicknessMeter = thickness \/ 1000;\n \n \/\/ Hitung diameter dalam\n const innerDiameter = outerDiameter - (2 * thicknessMeter);\n \n \/\/ Hitung luas penampang pipa\n const crossSectionalArea = Math.PI * (Math.pow(outerDiameter\/2, 2) - Math.pow(innerDiameter\/2, 2));\n \n \/\/ Hitung volume pipa\n const volume = crossSectionalArea * length;\n \n \/\/ Hitung berat pipa (kg)\n const weight = volume * density;\n \n totalWeight += weight;\n segmentDetails.push({\n thickness: thickness,\n size: size,\n length: length,\n weight: weight\n });\n }\n \n if (!hasValidSegment) {\n showStatus(\"Silakan isi data untuk setidaknya satu segmen pipa (tebal, ukuran, dan panjang)\", true);\n return;\n }\n \n \/\/ Ambil jumlah pesanan\n const quantity = parseInt(document.getElementById('quantity').value) || 1;\n \n \/\/ Hitung berat total\n const totalOrderWeight = totalWeight * quantity;\n \n \/\/ Ambil jenis finishing\n const finishType = document.querySelector('input[name=\"finish\"]:checked').value;\n \n \/\/ Ambil biaya-biaya tambahan\n const biayaKirim = parseFloat(document.getElementById('biayaKirim').value) || 0;\n const biayaTol = parseFloat(document.getElementById('biayaTol').value) || 0;\n const biayaRazia = parseFloat(document.getElementById('biayaRazia').value) || 0;\n const biayaPenurunan = parseFloat(document.getElementById('biayaPenurunan').value) || 0;\n \n \/\/ Hitung biaya aksesoris\n const accessoriesCost = updateAccessoriesTotal();\n \n \/\/ Hitung biaya\n const steelCost = totalOrderWeight * STEEL_PRICE_PER_KG;\n \n let finishCost = 0;\n if (finishType === 'galvanis') {\n finishCost = totalOrderWeight * GALVANIZING_PRICE_PER_KG;\n }\n \n const additionalCosts = biayaTol + biayaRazia + biayaPenurunan;\n \n \/\/ Hitung total biaya\n const totalCost = steelCost + finishCost + biayaKirim + additionalCosts + accessoriesCost;\n \n \/\/ Hitung DP 50% dan sisa pembayaran\n const dpAmount = totalCost * 0.5;\n const remainingAmount = totalCost - dpAmount;\n \n \/\/ Simpan hasil perhitungan\n calculationResults = {\n segmentDetails: segmentDetails,\n totalWeight: totalWeight,\n totalOrderWeight: totalOrderWeight,\n quantity: quantity,\n steelCost: steelCost,\n finishCost: finishCost,\n shippingCost: biayaKirim,\n additionalCosts: additionalCosts,\n accessoriesCost: accessoriesCost,\n totalCost: totalCost,\n dpAmount: dpAmount,\n remainingAmount: remainingAmount\n };\n \n \/\/ Tampilkan hasil\n displayResults(calculationResults);\n showStatus(\"Perhitungan biaya berhasil! Anda sekarang dapat menyimpan hasilnya ke PDF.\");\n \n } catch (error) {\n console.error('Error calculating costs:', error);\n showStatus('Terjadi kesalahan saat menghitung biaya. Silakan periksa input Anda dan coba lagi.', true);\n }\n }\n \n function displayResults(results) {\n try {\n const segmentResults = document.getElementById('segmentResults');\n const totalPerPipe = document.getElementById('totalPerPipe');\n const totalOrder = document.getElementById('totalOrder');\n const resultsSection = document.getElementById('resultsSection');\n const orderDetailsContent = document.getElementById('orderDetailsContent');\n \n let segmentHTML = '';\n let orderDetailsHTML = '';\n \n results.segmentDetails.forEach((segment, index) => {\n segmentHTML += `\n <div class=\"segment-result\">\n <h4>Segmen ${index + 1}<\/h4>\n <p>Tebal: ${segment.thickness} mm<\/p>\n <p>Ukuran: ${segment.size}\"<\/p>\n <p>Panjang: ${segment.length} m<\/p>\n <p class=\"weight-value\">${segment.weight.toFixed(2)} kg<\/p>\n <\/div>\n `;\n \n orderDetailsHTML += `\n <div class=\"segment-detail\">\n <p><strong>Segmen ${index + 1}:<\/strong> Tebal ${segment.thickness} mm, Ukuran ${segment.size}\", Panjang ${segment.length} m<\/p>\n <\/div>\n `;\n });\n \n \/\/ Tambahkan info finishing dan aksesoris ke detail pesanan\n const finishType = document.querySelector('input[name=\"finish\"]:checked').value;\n const pekerjaanLainText = document.getElementById('pekerjaanLainText').value;\n \n orderDetailsHTML += `\n <p><strong>Jumlah Pipa:<\/strong> ${results.quantity} unit<\/p>\n <p><strong>Total Panjang:<\/strong> ${results.segmentDetails.reduce((sum, seg) => sum + seg.length, 0).toFixed(2)} meter<\/p>\n <p><strong>Finishing:<\/strong> ${finishType === 'galvanis' ? 'Galvanis' : 'Cat Hitam'}<\/p>\n `;\n \n if (results.accessoriesCost > 0) {\n orderDetailsHTML += `<p><strong>Total Aksesoris:<\/strong> Rp ${results.accessoriesCost.toLocaleString('id-ID')}<\/p>`;\n }\n \n if (pekerjaanLainText) {\n orderDetailsHTML += `<p><strong>Pekerjaan Lain:<\/strong> ${pekerjaanLainText}<\/p>`;\n }\n \n segmentResults.innerHTML = segmentHTML;\n totalPerPipe.textContent = `Berat Total per Pipa: ${results.totalWeight.toFixed(2)} kg`;\n totalOrder.textContent = `Berat Total Pesanan (${results.quantity} pipa): ${results.totalOrderWeight.toFixed(2)} kg`;\n orderDetailsContent.innerHTML = orderDetailsHTML;\n \n \/\/ Update rincian biaya\n document.getElementById('steelCost').textContent = `Rp ${results.steelCost.toLocaleString('id-ID')}`;\n document.getElementById('finishCost').textContent = `Rp ${results.finishCost.toLocaleString('id-ID')}`;\n document.getElementById('shippingCost').textContent = `Rp ${results.shippingCost.toLocaleString('id-ID')}`;\n document.getElementById('additionalCosts').textContent = `Rp ${results.additionalCosts.toLocaleString('id-ID')}`;\n document.getElementById('accessoriesCost').textContent = `Rp ${results.accessoriesCost.toLocaleString('id-ID')}`;\n document.getElementById('totalCost').textContent = `Rp ${results.totalCost.toLocaleString('id-ID')}`;\n \n \/\/ Update informasi pembayaran\n document.getElementById('dpAmount').textContent = `Rp ${results.dpAmount.toLocaleString('id-ID')}`;\n document.getElementById('remainingAmount').textContent = `Rp ${results.remainingAmount.toLocaleString('id-ID')}`;\n \n resultsSection.style.display = 'block';\n \n \/\/ Scroll ke hasil\n resultsSection.scrollIntoView({ behavior: 'smooth' });\n } catch (error) {\n console.error('Error displaying results:', error);\n showStatus('Terjadi kesalahan saat menampilkan hasil. Silakan coba lagi.', true);\n }\n }\n \n async function saveToPDF() {\n try {\n \/\/ Pastikan hasil perhitungan sudah ditampilkan\n const resultsSection = document.getElementById('resultsSection');\n if (resultsSection.style.display === 'none' || !calculationResults) {\n showStatus(\"Silakan hitung biaya total terlebih dahulu sebelum menyimpan ke PDF\", true);\n return;\n }\n \n \/\/ Tampilkan indikator loading\n const saveBtn = document.getElementById('savePdfBtn');\n const originalText = saveBtn.innerHTML;\n saveBtn.innerHTML = '<span class=\"loading\"><\/span> Membuat PDF...';\n saveBtn.disabled = true;\n \n \/\/ Tunggu library dimuat\n await waitForLibraries();\n \n \/\/ Ambil data pemesan untuk nama file\n const whatsapp = document.getElementById('whatsapp').value || 'unknown';\n const customerName = document.getElementById('customerName').value || 'unknown';\n \n \/\/ Ambil data segmen pertama yang valid untuk panjang dan tebal\n let totalLength = 0;\n let thickness = 0;\n \n for (let i = 1; i <= 3; i++) {\n const segLength = parseFloat(document.getElementById('length' + i).value);\n const segThickness = parseFloat(document.getElementById('thickness' + i).value);\n \n if (!isNaN(segLength) && segLength > 0) {\n totalLength += segLength;\n if (thickness === 0 && !isNaN(segThickness)) {\n thickness = segThickness;\n }\n }\n }\n \n \/\/ Format nama file: nomor whatsapp, nama pemesan, ukuran panjang dan tebal tower\n const fileName = `${whatsapp}_${customerName.replace(\/\\s+\/g, '_')}_panjang${totalLength}m_tebal${thickness}mm.pdf`;\n \n \/\/ Sembunyikan tombol sebelum membuat PDF\n document.querySelector('.button-group').style.display = 'none';\n \n \/\/ Gunakan html2canvas dan jsPDF untuk membuat PDF\n const canvas = await html2canvas(resultsSection, {\n scale: 2,\n logging: false,\n useCORS: true,\n allowTaint: true\n });\n \n const imgData = canvas.toDataURL('image\/png');\n const pdf = new jspdf.jsPDF({\n orientation: 'portrait',\n unit: 'mm',\n format: 'a4'\n });\n \n const imgWidth = 210; \/\/ Lebar A4 dalam mm\n const pageHeight = 295; \/\/ Tinggi A4 dalam mm\n const imgHeight = (canvas.height * imgWidth) \/ canvas.width;\n let heightLeft = imgHeight;\n let position = 0;\n \n \/\/ Tambahkan gambar ke PDF\n pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);\n heightLeft -= pageHeight;\n \n \/\/ Tambahkan halaman baru jika konten lebih dari satu halaman\n while (heightLeft >= 0) {\n position = heightLeft - imgHeight;\n pdf.addPage();\n pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);\n heightLeft -= pageHeight;\n }\n \n \/\/ Simpan PDF dengan nama file yang telah diformat\n pdf.save(fileName);\n \n \/\/ Tampilkan kembali tombol setelah membuat PDF\n document.querySelector('.button-group').style.display = 'flex';\n \n \/\/ Kembalikan tombol ke keadaan semula\n saveBtn.innerHTML = originalText;\n saveBtn.disabled = false;\n \n showStatus(`PDF berhasil disimpan dengan nama: ${fileName}`);\n \n } catch (error) {\n console.error('Error generating PDF:', error);\n showStatus('Terjadi kesalahan saat membuat PDF. Pastikan semua library telah dimuat dengan benar dan coba lagi.', true);\n \n \/\/ Tampilkan kembali tombol jika terjadi kesalahan\n document.querySelector('.button-group').style.display = 'flex';\n \n \/\/ Kembalikan tombol ke keadaan semula\n const saveBtn = document.getElementById('savePdfBtn');\n saveBtn.innerHTML = 'Save PDF';\n saveBtn.disabled = false;\n }\n }\n \n \/\/ Inisialisasi kalkulator setelah DOM dimuat\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initCalculator);\n } else {\n initCalculator();\n }\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-126","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages\/126","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/comments?post=126"}],"version-history":[{"count":87,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages\/126\/revisions"}],"predecessor-version":[{"id":756,"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/pages\/126\/revisions\/756"}],"wp:attachment":[{"href":"https:\/\/tiangjalan.com\/pabrik\/wp-json\/wp\/v2\/media?parent=126"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}