Willian_Anggi_Devayu
/
E31221315_AnalisisSentimen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

perbaikan

This commit is contained in:
aarsyah0 2025-04-24 21:32:07 +07:00
parent 3fbc8fb111
commit a5be9f79a1
9 changed files with 328 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
public/assets/scss/soft-ui-dashboard/_typography.scss
View File

@ -179,7 +179,7 @@ p {
font-style: italic !important;
}
// Contextual colors
$text-gradient-bg-primary: linear-gradient(310deg, #cb0c9f, #a4087c);
.text-gradient {
background-clip: $text-gradient-bg-clip;
-webkit-background-clip: $text-gradient-bg-clip;
@ -187,6 +187,7 @@ p {
position: $text-gradient-position;
z-index: $text-gradient-zindex;
&.text-primary {
background-image: $text-gradient-bg-primary;
}

257
resources/views/dashboard.blade.php
View File

@ -43,21 +43,29 @@
<!-- Baris kartu -->
<div class="row gx-3">
<div class="col-md-4">
<div class="card text-white" style="background-color: #b22fa4;">
<div class="card-body d-flex justify-content-between align-items-center">
<div class="card text-white shadow-lg border-radius-xl"
style="background-color: #b22fa4; color: #fff; box-shadow: inset 2px 2px 6px rgba(255, 255, 255, 0.1), 6px 6px 20px rgba(178, 47, 164, 0.5);">
<div class="card-body d-flex justify-content-between align-items-center p-4">
<div>
<p class="mb-1 text-sm">Total Positif</p>
<h4 id="positifCount" class="mb-0 text-white">
<p class="mb-1 text-sm fw-bold opacity-85">Total Positif</p>
<h4 id="positifCount" class="mb-0 text-white fw-bolder">
{{ $cDana['positif'] + $cGoPay['positif'] + $cShopee['positif'] }}
</h4>
</div>
<i class="fa-solid fa-face-smile fa-4x opacity-8"></i>
<div class="d-flex align-items-center justify-content-center rounded-circle"
style="width: 64px; height: 64px; background-color: rgba(255, 255, 255, 0.15); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);">
<i class="fa-solid fa-face-smile fa-2x opacity-9"
style="transition: transform 0.3s ease, opacity 0.3s ease;"
onmouseover="this.style.transform='scale(1.2)'; this.style.opacity='1';"
onmouseout="this.style.transform='scale(1)'; this.style.opacity='0.9';"></i>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card text-white" style="background-color: #a95b91;">
<div class="card text-white"
style="background-color: #a95b91; color: #fff; box-shadow: inset 2px 2px 6px rgba(255, 255, 255, 0.1), 6px 6px 20px rgba(178, 47, 164, 0.5);">
<div class="card-body d-flex justify-content-between align-items-center">
<div>
<p class="mb-1 text-sm">Total Netral</p>
@ -65,13 +73,20 @@
{{ $cDana['netral'] + $cGoPay['netral'] + $cShopee['netral'] }}
</h4>
</div>
<i class="fa-solid fa-face-meh fa-4x opacity-8"></i>
<div class="d-flex align-items-center justify-content-center rounded-circle"
style="width: 64px; height: 64px; background-color: rgba(255, 255, 255, 0.15); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);">
<i class="fa-solid fa-face-meh fa-2x opacity-9"
style="transition: transform 0.3s ease, opacity 0.3s ease;"
onmouseover="this.style.transform='scale(1.2)'; this.style.opacity='1';"
onmouseout="this.style.transform='scale(1)'; this.style.opacity='0.9';"></i>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card text-white" style="background-color: #8b2f5e;">
<div class="card text-white"
style="background-color: #8b2f5e; color: #fff; box-shadow: inset 2px 2px 6px rgba(255, 255, 255, 0.1), 6px 6px 20px rgba(178, 47, 164, 0.5);">
<div class="card-body d-flex justify-content-between align-items-center">
<div>
<p class="mb-1 text-sm">Total Negatif</p>
@ -79,7 +94,13 @@
{{ $cDana['negatif'] + $cGoPay['negatif'] + $cShopee['negatif'] }}
</h4>
</div>
<i class="fa-solid fa-face-frown fa-4x opacity-8"></i>
<div class="d-flex align-items-center justify-content-center rounded-circle"
style="width: 64px; height: 64px; background-color: rgba(255, 255, 255, 0.15); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);">
<i class="fa-solid fa-face-frown fa-2x opacity-9"
style="transition: transform 0.3s ease, opacity 0.3s ease;"
onmouseover="this.style.transform='scale(1.2)'; this.style.opacity='1';"
onmouseout="this.style.transform='scale(1)'; this.style.opacity='0.9';"></i>
</div>
</div>
</div>
</div>
@ -87,6 +108,7 @@
</div>
</div>
</div>
<div class="row mt-4">
<!-- Bar Chart Card -->
@ -117,7 +139,7 @@
</div>
<div class="card-body p-3">
<div class="chart">
<canvas id="chart-line" class="chart-canvas" height="250" style="width:100%;"></canvas>
<canvas id="chart-line" class="chart-canvas" height="318" style="width:100%;"></canvas>
</div>
</div>
</div>
@ -126,8 +148,8 @@
<div class="row mt-4">
<!-- Pie Chart Card with filter -->
<div class="col-lg-6 mx-auto">
<div class="card z-index-2">
<div class="col-lg-5 mb-lg-0 mb-4 d-flex">
<div class="card z-index-2 flex-grow-1">
<div class="card-header pb-0 d-flex justify-content-between align-items-center">
<div>
<h6 class="mb-1">Distribusi Persentase Sentimen</h6>
@ -148,6 +170,72 @@
</div>
</div>
</div>
<div class="col-lg-7 d-flex">
<div class="card z-index-2 flex-grow-1">
<div class="card-header pb-0">
<h6>Perbandingan Sentimen Antar Brand</h6>
<p class="text-sm">Tabel ini menunjukkan jumlah dan proporsi sentimen untuk masing-masing e-wallet.</p>
</div>
<div class="card-body px-3 pt-0 pb-3">
<div class="table-responsive">
<table class="table align-items-center mb-0">
<thead>
<tr>
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7"
style="background-color: #f8f9fa;">E-Wallet</th>
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2"
style="background-color: #f8f9fa;">Positif</th>
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2"
style="background-color: #f8f9fa;">Netral</th>
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2"
style="background-color: #f8f9fa;">Negatif</th>
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2"
style="background-color: #f8f9fa;">Net Score</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>DANA</strong></td>
<td>{{ $cDana['positif'] }}</td>
<td>{{ $cDana['netral'] }}</td>
<td>{{ $cDana['negatif'] }}</td>
<td>
<span
class="badge {{ $cDana['positif'] - $cDana['negatif'] > 0 ? 'bg-success' : 'bg-danger' }}">
{{ number_format((($cDana['positif'] - $cDana['negatif']) / max(1, $cDana['positif'] + $cDana['netral'] + $cDana['negatif'])) * 100, 1) }}%
</span>
</td>
</tr>
<tr>
<td><strong>GoPay</strong></td>
<td>{{ $cGoPay['positif'] }}</td>
<td>{{ $cGoPay['netral'] }}</td>
<td>{{ $cGoPay['negatif'] }}</td>
<td>
<span
class="badge {{ $cGoPay['positif'] - $cGoPay['negatif'] > 0 ? 'bg-success' : 'bg-danger' }}">
{{ number_format((($cGoPay['positif'] - $cGoPay['negatif']) / max(1, $cGoPay['positif'] + $cGoPay['netral'] + $cGoPay['negatif'])) * 100, 1) }}%
</span>
</td>
</tr>
<tr>
<td><strong>ShopeePay</strong></td>
<td>{{ $cShopee['positif'] }}</td>
<td>{{ $cShopee['netral'] }}</td>
<td>{{ $cShopee['negatif'] }}</td>
<td>
<span
class="badge {{ $cShopee['positif'] - $cShopee['negatif'] > 0 ? 'bg-success' : 'bg-danger' }}">
{{ number_format((($cShopee['positif'] - $cShopee['negatif']) / max(1, $cShopee['positif'] + $cShopee['netral'] + $cShopee['negatif'])) * 100, 1) }}%
</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
@endsection
@ -313,6 +401,8 @@
},
options: {
responsive: true,
maintainAspectRatio: false, // Disable maintain aspect ratio
aspectRatio: 2, // Aspect ratio of 1 will give a square chart, you can adjust to your needs
animation: {
animateRotate: true,
duration: 1000
@ -381,5 +471,146 @@
negatifEl.textContent = d.negatif;
});
});
// Word Cloud
// var danaData = [{{ $cDana['positif'] }}, {{ $cDana['netral'] }}, {{ $cDana['negatif'] }}];
// var goPayData = [{{ $cGoPay['positif'] }}, {{ $cGoPay['netral'] }}, {{ $cGoPay['negatif'] }}];
// var shopeeData = [{{ $cShopee['positif'] }}, {{ $cShopee['netral'] }}, {{ $cShopee['negatif'] }}];
// var danaData = [{{ $cDana['positif'] }}, {{ $cDana['netral'] }}, {{ $cDana['negatif'] }}];
// var goPayData = [{{ $cGoPay['positif'] }}, {{ $cGoPay['netral'] }}, {{ $cGoPay['negatif'] }}];
// var shopeeData = [{{ $cShopee['positif'] }}, {{ $cShopee['netral'] }}, {{ $cShopee['negatif'] }}];
// var wordData = [{
// text: 'Positif Dana',
// weight: danaData[0]
// },
// {
// text: 'Netral Dana',
// weight: danaData[1]
// },
// {
// text: 'Negatif Dana',
// weight: danaData[2]
// },
// {
// text: 'Positif GoPay',
// weight: goPayData[0]
// },
// {
// text: 'Netral GoPay',
// weight: goPayData[1]
// },
// {
// text: 'Negatif GoPay',
// weight: goPayData[2]
// },
// {
// text: 'Positif Shopee',
// weight: shopeeData[0]
// },
// {
// text: 'Netral Shopee',
// weight: shopeeData[1]
// },
// {
// text: 'Negatif Shopee',
// weight: shopeeData[2]
// }
// ];
// // Menggunakan WordCloud.js untuk membuat visualisasi
// WordCloud(document.getElementById('wordCloud'), {
// list: wordData.map(function(item) {
// return [item.text, item.weight]; // Format: [kata, ukuran]
// }),
// gridSize: 10,
// weightFactor: 10,
// fontFamily: 'Arial',
// color: 'random-light',
// backgroundColor: '#f4f6f9',
// rotateRatio: 0.5
// });
// var wordData = [{
// text: 'Positif Dana',
// weight: danaData[0]
// },
// {
// text: 'Netral Dana',
// weight: danaData[1]
// },
// {
// text: 'Negatif Dana',
// weight: danaData[2]
// },
// {
// text: 'Positif GoPay',
// weight: goPayData[0]
// },
// {
// text: 'Netral GoPay',
// weight: goPayData[1]
// },
// {
// text: 'Negatif GoPay',
// weight: goPayData[2]
// },
// {
// text: 'Positif Shopee',
// weight: shopeeData[0]
// },
// {
// text: 'Netral Shopee',
// weight: shopeeData[1]
// },
// {
// text: 'Negatif Shopee',
// weight: shopeeData[2]
// }
// ];
// Pastikan canvas sudah siap
// setTimeout(() => {
// WordCloud(document.getElementById('wordCloud'), {
// list: wordData.map(item => [item.text, item.weight]),
// gridSize: 8,
// weightFactor: 2,
// fontFamily: 'Arial',
// color: 'random-dark',
// backgroundColor: '#f4f6f9',
// rotateRatio: 0.5,
// minSize: 12
// });
// }, 100);
var danaTotal = {{ $cDana['positif'] + $cDana['netral'] + $cDana['negatif'] }};
var goPayTotal = {{ $cGoPay['positif'] + $cGoPay['netral'] + $cGoPay['negatif'] }};
var shopeeTotal = {{ $cShopee['positif'] + $cShopee['netral'] + $cShopee['negatif'] }};
var wordData = [{
text: 'Dana',
weight: danaTotal
},
{
text: 'GoPay',
weight: goPayTotal
},
{
text: 'Shopee',
weight: shopeeTotal
}
];
// Render Word Cloud
setTimeout(() => {
WordCloud(document.getElementById('wordCloud'), {
list: wordData.map(item => [item.text, item.weight]),
gridSize: 6,
weightFactor: 4, // semakin besar, semakin beda ukurannya
fontFamily: 'Arial',
color: 'random-dark',
backgroundColor: '#f4f6f9',
rotateRatio: 0,
minSize: 12
});
}, 100);
</script>
@endpush

5
resources/views/layouts/app.blade.php
View File

@ -46,6 +46,7 @@
<link id="pagestyle" href="../assets/css/soft-ui-dashboard.css?v=1.0.3" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/wordcloud2.js/1.0.2/wordcloud2.min.js"></script>
</head>
<body
@ -58,10 +59,10 @@
@endguest
@if (session()->has('success'))
{{-- <div x-data="{ show: true }" x-init="setTimeout(() => show = false, 4000)" x-show="show"
<div x-data="{ show: true }" x-init="setTimeout(() => show = false, 4000)" x-show="show"
class="position-fixed bg-success rounded right-3 text-sm py-2 px-4">
<p class="m-0">{{ session('success') }}</p>
</div> --}}
</div>
@endif
<!-- Core JS Files -->
<script src="../assets/js/core/popper.min.js"></script>

4
resources/views/layouts/footers/auth/footer.blade.php
View File

@ -1,6 +1,6 @@
<footer class="footer pt-3 ">
{{-- <div class="container-fluid">
<div class="container-fluid">
<div class="row align-items-center justify-content-lg-between">
</div>
</div> --}}
</div>
</footer>

20
resources/views/layouts/footers/guest/footer.blade.php
View File

@ -4,6 +4,26 @@
<div class="row">
@if (!auth()->user() || \Request::is('static-sign-up'))
{{-- <div class="col-lg-8 mx-auto text-center mb-4 mt-2">
<a href="https://dribbble.com/creativetim" target="_blank" class="text-secondary me-xl-4 me-4">
<span class="text-lg fab fa-dribbble" aria-hidden="true"></span>
</a>
<a href="https://twitter.com/CreativeTim" target="_blank" class="text-secondary me-xl-4 me-4">
<span class="text-lg fab fa-twitter" aria-hidden="true"></span>
</a>
<a href="https://www.instagram.com/creativetimofficial/" target="_blank"
class="text-secondary me-xl-4 me-4">
<span class="text-lg fab fa-instagram" aria-hidden="true"></span>
</a>
<a href="https://ro.pinterest.com/thecreativetim/" target="_blank"
class="text-secondary me-xl-4 me-4">
<span class="text-lg fab fa-pinterest" aria-hidden="true"></span>
</a>
<a href="https://github.com/creativetimofficial" target="_blank"
class="text-secondary me-xl-4 me-4">
<span class="text-lg fab fa-github" aria-hidden="true"></span>
</a>
</div> --}}
@endif
</div>
@if (!auth()->user() || \Request::is('static-sign-up'))

2
resources/views/layouts/navbars/auth/nav.blade.php
View File

@ -6,7 +6,7 @@
<ol class="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5">
</ol>
<h6 class="font-weight-bolder mb-0 text-capitalize">{{ str_replace('-', ' ', Request::path()) }}</h6>
<h3 class="font-weight-bolder mb-0 text-capitalize">{{ str_replace('-', ' ', Request::path()) }}</h3>
</nav>
<div class="collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4 d-flex justify-content-end" id="navbar">
<div class="ms-md-3 pe-md-3 d-flex align-items-center">

12
resources/views/layouts/navbars/auth/sidebar.blade.php
View File

@ -34,7 +34,10 @@
</g>
</svg>
</div>
<span class="nav-link-text ms-1">Dashboard</span>
<span class="nav-link-text ms-1" style="color: {{ Request::is('dashboard') ? '#000' : '#fff' }};">
Dashboard
</span>
</a>
</li>
<li class="nav-item">
@ -65,7 +68,12 @@
</g>
</svg>
</div>
<span class="nav-link-text ms-1">Data Sentimen</span>
<span class="nav-link-text ms-1"
style="color: {{ Request::is('data-sentimen') ? '#000' : '#fff' }};">
Data Sentimen
</span>
</a>
</li>
</ul>

10
resources/views/layouts/navbars/guest/nav.blade.php
View File

@ -3,7 +3,11 @@
class="navbar navbar-expand-lg position-absolute top-0 z-index-3 my-3 {{ Request::is('static-sign-up') ? 'w-100 shadow-none navbar-transparent mt-4' : 'blur blur-rounded shadow py-2 start-0 end-0 mx4' }}">
<div class="container-fluid {{ Request::is('static-sign-up') ? 'container' : 'container-fluid' }}">
<a class="navbar-brand font-weight-bolder ms-lg-0 ms-3 {{ Request::is('static-sign-up') ? 'text-white' : '' }}"
href="{{ url('dashboard') }}">
href="{{ url('dashboard') }}"
style="background-image: linear-gradient(310deg, #cb0c9f, #d94db6, #f199d9);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;">
TwiSense
</a>
<button class="navbar-toggler shadow-none ms-2" type="button" data-bs-toggle="collapse"
@ -34,13 +38,13 @@
</li>
@endif
</ul>
<ul class="navbar-nav d-lg-block d-none">
{{-- <ul class="navbar-nav d-lg-block d-none">
<li class="nav-item">
<a href="#" target="_blank"
class="btn btn-sm btn-round mb-0 me-1 bg-gradient-{{ Request::is('static-sign-up') ? 'light' : 'dark' }}">Sign
In</a>
</li>
</ul>
</ul> --}}
</div>
</div>
</nav>

46
resources/views/session/login-session.blade.php
View File

@ -9,9 +9,15 @@
<div class="col-xl-4 col-lg-5 col-md-6 d-flex flex-column mx-auto">
<div class="card card-plain mt-8">
<div class="card-header pb-0 text-left bg-transparent">
<h3 class="font-weight-bolder text-info text-gradient">Welcome back</h3>
<p class="mb-0">Create a new acount<br></p>
<p class="mb-0">OR Sign in with these credentials:</p>
<h3 class="font-weight-bolder"
style="background-image: linear-gradient(310deg, #cb0c9f, #d94db6, #f199d9);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;">
Sign In
</h3>
{{-- <p class="mb-0">Create a new acount<br></p>
<p class="mb-0">OR Sign in with these credentials:</p> --}}
</div>
<div class="card-body">
<form role="form" method="POST" action="/session">
@ -27,19 +33,45 @@
</div>
<label>Password</label>
<div class="mb-3">
<input type="password" class="form-control" name="password" id="password"
placeholder="Password" value="secret" aria-label="Password"
aria-describedby="password-addon">
<div class="input-group">
<input type="password" class="form-control" name="password" id="password"
placeholder="Password" value="secret" aria-label="Password"
aria-describedby="password-addon">
<span class="input-group-text" id="password-addon" style="cursor: pointer;"
onclick="togglePassword()">
<i class="fa-solid fa-eye" id="eye-icon"></i>
</span>
</div>
@error('password')
<p class="text-danger text-xs mt-2">{{ $message }}</p>
@enderror
</div>
<script>
function togglePassword() {
var passwordField = document.getElementById("password");
var eyeIcon = document.getElementById("eye-icon");
// Toggle password visibility
if (passwordField.type === "password") {
passwordField.type = "text";
eyeIcon.classList.remove("fa-eye");
eyeIcon.classList.add("fa-eye-slash");
} else {
passwordField.type = "password";
eyeIcon.classList.remove("fa-eye-slash");
eyeIcon.classList.add("fa-eye");
}
}
</script>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="rememberMe" checked="">
<label class="form-check-label" for="rememberMe">Remember me</label>
</div>
<div class="text-center">
<button type="submit" class="btn bg-gradient-info w-100 mt-4 mb-0">Sign
<button type="submit" class="btn text-white w-100 mt-4 mb-0"
style="background-image: linear-gradient(310deg, #cb0c9f, #d94db6, #f199d9);">Sign
in</button>
</div>
</form>