| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> |
| <title>Stock Ownership Analytics Tool</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.3.0/papaparse.min.js"></script> |
| <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> |
| <link href="https://cdn.jsdelivr.net/npm/daisyui@3.9.4/dist/full.css" rel="stylesheet" type="text/css" /> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"/> |
| <style> |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); |
| body { |
| font-family: 'Inter', sans-serif; |
| } |
| .chart-container { |
| position: relative; |
| height: 350px; |
| width: 100%; |
| } |
| .loading-spinner { |
| border-top-color: #3498db; |
| animation: spinner 1.2s linear infinite; |
| } |
| @keyframes spinner { |
| 0% { transform: rotate(0deg); } |
| 100% { transform: rotate(360deg); } |
| } |
| .database-item { |
| transition: all 0.2s; |
| } |
| .database-item:hover { |
| transform: translateY(-2px); |
| box-shadow: 0 10px 20px rgba(0,0,0,0.1); |
| } |
| </style> |
| </head> |
| <body class="bg-gradient-to-br from-slate-50 to-slate-100 min-h-screen"> |
|
|
| |
| <nav class="bg-white shadow-lg sticky top-0 z-50 border-b"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="flex justify-between items-center h-16"> |
| <div class="flex items-center"> |
| <div class="text-2xl font-bold text-indigo-600 flex items-center gap-2"> |
| <i class="fas fa-chart-line"></i> |
| <span>StockOwnership Insights</span> |
| </div> |
| </div> |
| <div class="hidden md:flex space-x-8"> |
| <a href="#dashboard" class="text-gray-700 hover:text-indigo-600 font-medium">Dashboard</a> |
| <a href="#uploader" class="text-gray-700 hover:text-indigo-600 font-medium">Upload Data</a> |
| <a href="#database" class="text-gray-700 hover:text-indigo-600 font-medium">Database</a> |
| <a href="#download" class="text-gray-700 hover:text-indigo-600 font-medium">Export</a> |
| </div> |
| </div> |
| </div> |
| </nav> |
|
|
| |
| <section class="py-16 px-6 text-center bg-gradient-to-r from-indigo-600 to-purple-600 text-white"> |
| <div class="max-w-4xl mx-auto"> |
| <h1 class="text-4xl md:text-5xl font-bold mb-6 leading-tight"> |
| Analisis Kepemilikan Saham |
| </h1> |
| <p class="text-lg md:text-xl opacity-90 mb-10"> |
| Pantau pertumbuhan kepemilikan saham oleh investor lokal, asing, dan institusi secara real-time. |
| Ekstrak data dari KSEI dan analisis dalam dashboard interaktif. |
| </p> |
| <button onclick="scrollToSection('uploader')" class="bg-white text-indigo-700 font-semibold px-8 py-3 rounded-full shadow-lg hover:shadow-xl transform hover:-translate-y-1 transition-all duration-200 flex items-center gap-2 mx-auto"> |
| <i class="fas fa-file-import"></i> Mulai Analisis |
| </button> |
| </div> |
| </section> |
|
|
| |
| <section id="uploader" class="py-16 px-6 bg-white"> |
| <div class="max-w-4xl mx-auto"> |
| <div class="text-center mb-10"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">Unggah Data KSEI</h2> |
| <p class="text-gray-600"> |
| Unggah file CSV yang diunduh dari <a href="https://web.ksei.co.id/Download/" target="_blank" class="text-indigo-600 hover:underline">KSEI</a>. |
| Format yang didukung: CSV dengan pembatas <strong>|</strong> dan header <strong>Ticker|Nama Saham|Lokal|Asing|Institusi|Tanggal</strong>. |
| </p> |
| </div> |
|
|
| <div id="upload-box" class="border-2 border-dashed border-gray-300 rounded-xl p-10 text-center hover:border-indigo-400 transition-colors duration-200 cursor-pointer relative overflow-hidden group"> |
| <input type="file" id="csv-upload" accept=".csv" class="absolute inset-0 w-full h-full opacity-0 cursor-pointer" onchange="handleFileSelect(event)" /> |
| <div class="flex flex-col items-center"> |
| <i class="fas fa-cloud-upload-alt text-5xl text-gray-400 group-hover:text-indigo-500 transition-colors duration-200"></i> |
| <p class="mt-4 text-gray-600 font-medium">Seret dan lepas file CSV, atau klik untuk memilih</p> |
| <p class="text-sm text-gray-500 mt-2">Format: CSV dengan delimiter |, maks 10MB</p> |
| </div> |
| </div> |
|
|
| <div id="upload-meta" class="mt-6 bg-gray-50 p-6 rounded-xl hidden"> |
| <h3 class="text-lg font-semibold text-gray-800 mb-4">Informasi Data</h3> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
| <div> |
| <label class="block text-sm font-medium text-gray-700 mb-2">Bulan</label> |
| <select id="upload-month" class="w-full border border-gray-300 rounded-lg px-3 py-2"> |
| <option value="1">Januari</option> |
| <option value="2">Februari</option> |
| <option value="3">Maret</option> |
| <option value="4">April</option> |
| <option value="5">Mei</option> |
| <option value="6">Juni</option> |
| <option value="7">Juli</option> |
| <option value="8">Agustus</option> |
| <option value="9">September</option> |
| <option value="10">Oktober</option> |
| <option value="11">November</option> |
| <option value="12">Desember</option> |
| </select> |
| </div> |
| <div> |
| <label class="block text-sm font-medium text-gray-700 mb-2">Tahun</label> |
| <input type="number" id="upload-year" class="w-full border border-gray-300 rounded-lg px-3 py-2" |
| value="2023" min="2010" max="2030" /> |
| </div> |
| <div> |
| <label class="block text-sm font-medium text-gray-700 mb-2">Nomor Laporan</label> |
| <input type="number" id="upload-number" class="w-full border border-gray-300 rounded-lg px-3 py-2" |
| value="1" min="1" /> |
| </div> |
| </div> |
| <div class="mt-4 flex justify-end"> |
| <button onclick="saveToDatabase()" class="bg-indigo-600 text-white px-6 py-2 rounded-lg hover:bg-indigo-700 transition"> |
| Simpan ke Database |
| </button> |
| </div> |
| </div> |
|
|
| <div id="loading" class="flex flex-col items-center justify-center mt-8 hidden"> |
| <div class="w-16 h-16 border-4 border-gray-200 border-t-indigo-500 rounded-full loading-spinner"></div> |
| <p class="mt-4 text-gray-600">Memproses data...</p> |
| </div> |
|
|
| <div id="preview" class="mt-8 hidden"> |
| <h3 class="text-xl font-semibold text-gray-800 mb-4">Pratinjau Data</h3> |
| <div class="overflow-x-auto bg-gray-50 rounded-lg border"> |
| <table id="data-preview-table" class="min-w-full text-sm"></table> |
| </div> |
| <div class="mt-4 flex justify-end"> |
| <button onclick="processData()" class="bg-indigo-600 text-white px-6 py-2 rounded-lg hover:bg-indigo-700 transition"> |
| Proses Data |
| </button> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="database" class="py-16 px-6 bg-gray-50"> |
| <div class="max-w-6xl mx-auto"> |
| <div class="text-center mb-10"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">Database Laporan Kepemilikan</h2> |
| <p class="text-gray-600">Kelola dan akses laporan bulanan kepemilikan saham</p> |
| </div> |
|
|
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-10" id="database-container"> |
| |
| <div class="text-center py-10 text-gray-500"> |
| <i class="fas fa-database text-5xl mb-4 opacity-30"></i> |
| <p>Belum ada data dalam database</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="dashboard" class="py-16 px-6 bg-gray-50"> |
| <div class="max-w-7xl mx-auto"> |
| <div class="text-center mb-10"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">Dashboard Analitik</h2> |
| <p class="text-gray-600">Analisa perubahan kepemilikan saham secara mendalam</p> |
| </div> |
|
|
| |
| <div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-10"> |
| <div class="bg-white p-6 rounded-xl shadow-md border"> |
| <div class="flex items-center"> |
| <div class="p-3 rounded-full bg-blue-100 text-blue-600"> |
| <i class="fas fa-user-friends"></i> |
| </div> |
| <div class="ml-4"> |
| <p class="text-sm font-medium text-gray-600">Total Saham</p> |
| <p id="total-stocks" class="text-2xl font-bold text-gray-800">-</p> |
| </div> |
| </div> |
| </div> |
| <div class="bg-white p-6 rounded-xl shadow-md border"> |
| <div class="flex items-center"> |
| <div class="p-3 rounded-full bg-green-100 text-green-600"> |
| <i class="fas fa-arrow-up"></i> |
| </div> |
| <div class="ml-4"> |
| <p class="text-sm font-medium text-gray-600">Saham Asing Naik</p> |
| <p id="foreign-up" class="text-2xl font-bold text-gray-800">-</p> |
| </div> |
| </div> |
| </div> |
| <div class="bg-white p-6 rounded-xl shadow-md border"> |
| <div class="flex items-center"> |
| <div class="p-3 rounded-full bg-purple-100 text-purple-600"> |
| <i class="fas fa-building"></i> |
| </div> |
| <div class="ml-4"> |
| <p class="text-sm font-medium text-gray-600">Saham Institusi</p> |
| <p id="institutional-total" class="text-2xl font-bold text-gray-800">-</p> |
| </div> |
| </div> |
| </div> |
| <div class="bg-white p-6 rounded-xl shadow-md border"> |
| <div class="flex items-center"> |
| <div class="p-3 rounded-full bg-indigo-100 text-indigo-600"> |
| <i class="fas fa-trending-up"></i> |
| </div> |
| <div class="ml-4"> |
| <p class="text-sm font-medium text-gray-600">Rata-Rata Kenaikan Asing</p> |
| <p id="foreign-growth" class="text-2xl font-bold text-gray-800">-</p> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mb-10"> |
| |
| <div class="bg-white p-6 rounded-xl shadow-md border"> |
| <h3 class="text-lg font-semibold text-gray-800 mb-4">Distribusi Kepemilikan (Rata-rata)</h3> |
| <div class="chart-container"> |
| <canvas id="ownershipChart"></canvas> |
| </div> |
| </div> |
|
|
| |
| <div class="bg-white p-6 rounded-xl shadow-md border"> |
| <h3 class="text-lg font-semibold text-gray-800 mb-4">Trend Pertumbuhan Asing</h3> |
| <div class="chart-container"> |
| <canvas id="growthChart"></canvas> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="bg-white p-6 rounded-xl shadow-md border mb-10"> |
| <h3 class="text-lg font-semibold text-gray-800 mb-4">Saham dengan Kenaikan Kepemilikan Asing Tertinggi</h3> |
| <div class="overflow-x-auto"> |
| <table id="top-movers-table" class="min-w-full text-sm"> |
| <thead> |
| <tr class="border-b"> |
| <th class="py-2 text-left">Ticker</th> |
| <th class="py-2 text-left">Nama</th> |
| <th class="py-2 text-right">Kenaikan (%)</th> |
| </tr> |
| </thead> |
| <tbody></tbody> |
| </table> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="download" class="py-16 px-6 bg-white"> |
| <div class="max-w-4xl mx-auto text-center"> |
| <h2 class="text-3xl font-bold text-gray-800 mb-4">Ekspor Hasil Analisis</h2> |
| <p class="text-gray-600 mb-8"> |
| Ekspor data dan hasil analisis ke format CSV untuk disimpan atau digunakan di aplikasi lain. |
| </p> |
| <button onclick="exportAnalysis()" class="bg-green-600 hover:bg-green-700 text-white font-semibold px-8 py-3 rounded-full shadow-lg flex items-center gap-2 mx-auto transition"> |
| <i class="fas fa-file-export"></i> Ekspor ke CSV |
| </button> |
| </div> |
| </section> |
|
|
| |
| <footer class="py-8 bg-gray-800 text-white text-center"> |
| <div class="max-w-4xl mx-auto px-6"> |
| <p>StockOwnership Insights Tool © 2023 | Data bersumber dari <a href="https://web.ksei.co.id" class="text-indigo-400 hover:underline">KSEI</a></p> |
| <p class="text-sm text-gray-400 mt-2">Alat analisis ini tidak berafiliasi dengan KSEI. Gunakan dengan tanggung jawab Anda sendiri.</p> |
| </div> |
| </footer> |
|
|
| <script> |
| |
| let rawData = []; |
| let processedData = []; |
| let ownershipChart = null; |
| let growthChart = null; |
| let database = JSON.parse(localStorage.getItem('ownershipDatabase')) || []; |
| |
| |
| document.addEventListener('DOMContentLoaded', function() { |
| renderDatabase(); |
| }); |
| |
| |
| function scrollToSection(id) { |
| document.getElementById(id).scrollIntoView({ behavior: 'smooth' }); |
| } |
| |
| |
| function handleFileSelect(event) { |
| const file = event.target.files[0]; |
| if (!file) return; |
| |
| document.getElementById('loading').classList.remove('hidden'); |
| document.getElementById('preview').classList.add('hidden'); |
| document.getElementById('upload-meta').classList.add('hidden'); |
| |
| const reader = new FileReader(); |
| reader.onload = function(e) { |
| const csv = e.target.result; |
| Papa.parse(csv, { |
| header: true, |
| skipEmptyLines: true, |
| delimiter: "|", |
| complete: function(results) { |
| rawData = results.data; |
| previewData(rawData.slice(0, 10)); |
| document.getElementById('loading').classList.add('hidden'); |
| document.getElementById('preview').classList.remove('hidden'); |
| document.getElementById('upload-meta').classList.remove('hidden'); |
| }, |
| error: function(error) { |
| alert("Error parsing CSV: " + error); |
| document.getElementById('loading').classList.add('hidden'); |
| } |
| }); |
| }; |
| reader.readAsText(file); |
| } |
| |
| |
| function previewData(data) { |
| const table = document.getElementById('data-preview-table'); |
| table.innerHTML = ''; |
| |
| |
| const thead = document.createElement('thead'); |
| thead.innerHTML = '<tr class="border-b"><th class="py-2 text-left">Ticker</th><th class="py-2 text-left">Nama</th><th class="py-2 text-right">Lokal</th><th class="py-2 text-right">Asing</th><th class="py-2 text-right">Institusi</th><th class="py-2 text-right">Tanggal</th></tr>'; |
| table.appendChild(thead); |
| |
| |
| const tbody = document.createElement('tbody'); |
| data.forEach(row => { |
| const tr = document.createElement('tr'); |
| tr.className = 'border-b hover:bg-gray-50'; |
| tr.innerHTML = ` |
| <td class="py-2 font-mono">${row.Ticker || '-'}</td> |
| <td class="py-2">${row['Nama Saham'] || '-'}</td> |
| <td class="py-2 text-right">${formatNumber(row.Lokal)}</td> |
| <td class="py-2 text-right">${formatNumber(row.Asing)}</td> |
| <td class="py-2 text-right">${formatNumber(row.Institusi)}</td> |
| <td class="py-2 text-right">${row.Tanggal || '-'}</td> |
| `; |
| tbody.appendChild(tr); |
| }); |
| table.appendChild(tbody); |
| } |
| |
| |
| function processData() { |
| |
| processedData = rawData.map(row => ({ |
| ...row, |
| Lokal: parseFloat(row.Lokal) || 0, |
| Asing: parseFloat(row.Asing) || 0, |
| Institusi: parseFloat(row.Institusi) || 0 |
| })).filter(row => row.Ticker && !isNaN(row.Asing)); |
| |
| |
| updateMetrics(); |
| |
| |
| renderCharts(); |
| |
| |
| renderTopMovers(); |
| |
| |
| scrollToSection('dashboard'); |
| } |
| |
| |
| function formatNumber(num) { |
| if (typeof num !== 'number') num = parseFloat(num); |
| if (isNaN(num)) return '-'; |
| return num.toLocaleString('id-ID', { maximumFractionDigits: 2 }); |
| } |
| |
| |
| function updateMetrics() { |
| const totalStocks = processedData.length; |
| const foreignUp = processedData.filter(row => row.Asing > 0).length; |
| const institutionalTotal = processedData.reduce((sum, row) => sum + row.Institusi, 0); |
| const avgForeignGrowth = processedData.length > 0 |
| ? processedData.reduce((sum, row) => sum + row.Asing, 0) / processedData.length |
| : 0; |
| |
| document.getElementById('total-stocks').textContent = totalStocks; |
| document.getElementById('foreign-up').textContent = foreignUp; |
| document.getElementById('institutional-total').textContent = formatNumber(institutionalTotal); |
| document.getElementById('foreign-growth').textContent = formatNumber(avgForeignGrowth) + '%'; |
| } |
| |
| |
| function renderCharts() { |
| |
| const avgLocal = processedData.reduce((sum, row) => sum + row.Lokal, 0) / processedData.length; |
| const avgForeign = processedData.reduce((sum, row) => sum + row.Asing, 0) / processedData.length; |
| const avgInstitutional = processedData.reduce((sum, row) => sum + row.Institusi, 0) / processedData.length; |
| |
| const ctx1 = document.getElementById('ownershipChart').getContext('2d'); |
| if (ownershipChart) ownershipChart.destroy(); |
| ownershipChart = new Chart(ctx1, { |
| type: 'pie', |
| data: { |
| labels: ['Investor Lokal', 'Investor Asing', 'Institusi'], |
| datasets: [{ |
| data: [avgLocal, avgForeign, avgInstitutional], |
| backgroundColor: ['#6366F1', '#10B981', '#8B5CF6'], |
| borderWidth: 2, |
| borderColor: '#FFFFFF', |
| hoverOffset: 10 |
| }] |
| }, |
| options: { |
| responsive: true, |
| plugins: { |
| legend: { |
| position: 'bottom' |
| } |
| } |
| } |
| }); |
| |
| |
| |
| const groupedByDate = {}; |
| processedData.forEach(row => { |
| const date = row.Tanggal; |
| if (!groupedByDate[date]) { |
| groupedByDate[date] = { sum: 0, count: 0 }; |
| } |
| groupedByDate[date].sum += parseFloat(row.Asing) || 0; |
| groupedByDate[date].count++; |
| }); |
| |
| const dates = Object.keys(groupedByDate).sort(); |
| const avgGrowth = dates.map(date => groupedByDate[date].sum / groupedByDate[date].count); |
| |
| const ctx2 = document.getElementById('growthChart').getContext('2d'); |
| if (growthChart) growthChart.destroy(); |
| growthChart = new Chart(ctx2, { |
| type: 'line', |
| data: { |
| labels: dates, |
| datasets: [{ |
| label: 'Rata-rata Kepemilikan Asing (%)', |
| data: avgGrowth, |
| borderColor: '#EC4899', |
| backgroundColor: 'rgba(236, 72, 153, 0.1)', |
| fill: true, |
| tension: 0.4, |
| pointBackgroundColor: '#EC4899' |
| }] |
| }, |
| options: { |
| responsive: true, |
| plugins: { |
| legend: { |
| display: false |
| } |
| }, |
| scales: { |
| y: { |
| beginAtZero: true, |
| title: { |
| display: true, |
| text: 'Pertumbuhan (%)' |
| } |
| }, |
| x: { |
| title: { |
| display: true, |
| text: 'Tanggal' |
| } |
| } |
| } |
| } |
| }); |
| } |
| |
| |
| function renderTopMovers() { |
| const sorted = [...processedData] |
| .sort((a, b) => (parseFloat(b.Asing) || 0) - (parseFloat(a.Asing) || 0)) |
| .slice(0, 10); |
| |
| const table = document.getElementById('top-movers-table').getElementsByTagName('tbody')[0]; |
| table.innerHTML = ''; |
| |
| sorted.forEach(row => { |
| const tr = document.createElement('tr'); |
| tr.className = 'border-b hover:bg-gray-50'; |
| tr.innerHTML = ` |
| <td class="py-2 font-mono font-semibold">${row.Ticker}</td> |
| <td class="py-2">${row['Nama Saham'] || '-'}</td> |
| <td class="py-2 text-right text-green-600 font-semibold">${formatNumber(row.Asing)}%</td> |
| `; |
| table.appendChild(tr); |
| }); |
| } |
| |
| |
| function saveToDatabase() { |
| if (rawData.length === 0) { |
| alert('Belum ada data untuk disimpan.'); |
| return; |
| } |
| |
| const month = document.getElementById('upload-month').value; |
| const year = document.getElementById('upload-year').value; |
| const number = document.getElementById('upload-number').value; |
| const monthNames = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", |
| "Juli", "Agustus", "September", "Oktober", "November", "Desember"]; |
| |
| const entry = { |
| id: Date.now(), |
| month: parseInt(month), |
| year: parseInt(year), |
| number: parseInt(number), |
| monthName: monthNames[month - 1], |
| date: new Date().toISOString(), |
| recordCount: rawData.length |
| }; |
| |
| database.push(entry); |
| database.sort((a, b) => new Date(b.year, b.month) - new Date(a.year, a.month)); |
| |
| localStorage.setItem('ownershipDatabase', JSON.stringify(database)); |
| renderDatabase(); |
| |
| alert(`Data berhasil disimpan ke database!`); |
| } |
| |
| |
| function renderDatabase() { |
| const container = document.getElementById('database-container'); |
| container.innerHTML = ''; |
| |
| if (database.length === 0) { |
| container.innerHTML = ` |
| <div class="text-center py-10 text-gray-500 col-span-2"> |
| <i class="fas fa-database text-5xl mb-4 opacity-30"></i> |
| <p>Belum ada data dalam database</p> |
| </div> |
| `; |
| return; |
| } |
| |
| database.forEach(item => { |
| const monthNames = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", |
| "Juli", "Agustus", "September", "Oktober", "November", "Desember"]; |
| |
| const itemDiv = document.createElement('div'); |
| itemDiv.className = 'bg-white p-6 rounded-xl shadow-md border database-item'; |
| itemDiv.innerHTML = ` |
| <div class="flex justify-between items-start"> |
| <div> |
| <span class="inline-block bg-indigo-100 text-indigo-800 text-xs px-3 py-1 rounded-full font-medium"> |
| No. ${item.number} |
| </span> |
| <h3 class="text-xl font-bold text-gray-800 mt-2">${item.monthName} ${item.year}</h3> |
| <p class="text-gray-600">Diunggah: ${new Date(item.date).toLocaleDateString('id-ID')}</p> |
| </div> |
| <div class="text-right"> |
| <span class="inline-block bg-gray-100 text-gray-800 text-sm px-3 py-1 rounded-full"> |
| ${item.recordCount} saham |
| </span> |
| <div class="mt-2 space-x-2"> |
| <button onclick="loadFromDatabase(${item.id})" class="text-blue-600 hover:text-blue-800 text-sm"> |
| <i class="fas fa-chart-bar"></i> Lihat |
| </button> |
| <button onclick="deleteFromDatabase(${item.id})" class="text-red-600 hover:text-red-800 text-sm"> |
| <i class="fas fa-trash"></i> Hapus |
| </button> |
| </div> |
| </div> |
| </div> |
| `; |
| container.appendChild(itemDiv); |
| }); |
| } |
| |
| |
| function loadFromDatabase(id) { |
| const item = database.find(d => d.id === id); |
| if (!item) return; |
| |
| alert(`Fitur lengkap akan diintegrasikan. Saat ini, fungsi ini akan memuat data laporan ${item.monthName} ${item.year}`); |
| |
| |
| |
| } |
| |
| |
| function deleteFromDatabase(id) { |
| if (confirm('Apakah Anda yakin ingin menghapus laporan ini dari database?')) { |
| database = database.filter(d => d.id !== id); |
| localStorage.setItem('ownershipDatabase', JSON.stringify(database)); |
| renderDatabase(); |
| } |
| } |
| |
| |
| function exportAnalysis() { |
| if (processedData.length === 0) { |
| alert('Tidak ada data untuk diekspor. Silakan unggah dan proses data terlebih dahulu.'); |
| return; |
| } |
| |
| |
| const exportData = processedData.map(row => ({ |
| 'Ticker': row.Ticker, |
| 'Nama Saham': row['Nama Saham'], |
| 'Kepemilikan Lokal (%)': formatNumber(row.Lokal), |
| 'Kepemilikan Asing (%)': formatNumber(row.Asing), |
| 'Kepemilikan Institusi (%)': formatNumber(row.Institusi), |
| 'Tanggal': row.Tanggal, |
| 'Kategori': row.Asing > 0 ? 'Net Buy' : 'Net Sell' |
| })); |
| |
| |
| const csv = Papa.unparse(exportData); |
| |
| |
| const blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' }); |
| const url = URL.createObjectURL(blob); |
| const link = document.createElement('a'); |
| link.setAttribute('href', url); |
| link.setAttribute('download', 'analisis-kepemilikan-saham.csv'); |
| link.style.visibility = 'hidden'; |
| document.body.appendChild(link); |
| link.click(); |
| document.body.removeChild(link); |
| } |
| </script> |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-qwensite.hf.space/logo.svg" alt="qwensite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-qwensite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >QwenSite</a> - 🧬 <a href="https://enzostvs-qwensite.hf.space?remix=alterzick/ksei" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
| </html> |
