修正手機點歌
This commit is contained in:
parent
e9ba3b229e
commit
9f5b51649d
@ -254,7 +254,7 @@
|
|||||||
<tr>
|
<tr>
|
||||||
<th>歌名</th>
|
<th>歌名</th>
|
||||||
<th>歌手</th>
|
<th>歌手</th>
|
||||||
<th>語別</th>
|
<!-- <th>語別</th> -->
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@ -270,7 +270,7 @@
|
|||||||
<p>歌名:<span id="detail-song-name"></span></p>
|
<p>歌名:<span id="detail-song-name"></span></p>
|
||||||
<p>編號:<span id="detail-song-number"></span></p>
|
<p>編號:<span id="detail-song-number"></span></p>
|
||||||
<p>歌手:<span id="detail-singer"></span></p>
|
<p>歌手:<span id="detail-singer"></span></p>
|
||||||
<p>語別:<span id="detail-language"></span></p>
|
<!-- <p>語別:<span id="detail-language"></span></p> -->
|
||||||
<button id="order-song-button">包廂點歌</button>
|
<button id="order-song-button">包廂點歌</button>
|
||||||
<button id="insert-song-button">插播歌曲</button>
|
<button id="insert-song-button">插播歌曲</button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -80,14 +80,20 @@
|
|||||||
}
|
}
|
||||||
.content {
|
.content {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
|
grid-template-columns: repeat(3, 1fr); /* 固定3欄 */
|
||||||
gap: 5px;
|
gap: 5px; /* 移除格子之間的空隙 */
|
||||||
|
margin: 0; /* 沒有外邊距 */
|
||||||
|
padding: 0; /* 沒有內邊距 */
|
||||||
|
width: 36.5vw; /* 滿版寬度 */
|
||||||
}
|
}
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 600px) {
|
||||||
.content {
|
.content {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
|
grid-template-columns: repeat(3, 1fr); /* 固定3欄 */
|
||||||
gap: 10px;
|
gap: 5px; /* 移除格子之間的空隙 */
|
||||||
|
margin: 0; /* 沒有外邊距 */
|
||||||
|
padding: 0; /* 沒有內邊距 */
|
||||||
|
width: 78vw; /* 滿版寬度 */
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.card {
|
.card {
|
||||||
|
@ -259,7 +259,7 @@
|
|||||||
<tr>
|
<tr>
|
||||||
<th>歌名</th>
|
<th>歌名</th>
|
||||||
<th>歌手</th>
|
<th>歌手</th>
|
||||||
<th>語別</th>
|
<!--<th>語別</th>-->
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@ -275,7 +275,7 @@
|
|||||||
<p>歌名:<span id="detail-song-name"></span></p>
|
<p>歌名:<span id="detail-song-name"></span></p>
|
||||||
<p>編號:<span id="detail-song-number"></span></p>
|
<p>編號:<span id="detail-song-number"></span></p>
|
||||||
<p>歌手:<span id="detail-singer"></span></p>
|
<p>歌手:<span id="detail-singer"></span></p>
|
||||||
<p>語別:<span id="detail-language"></span></p>
|
<!---<p>語別:<span id="detail-language"></span></p>-->
|
||||||
<button id="order-song-button">包廂點歌</button>
|
<button id="order-song-button">包廂點歌</button>
|
||||||
<button id="insert-song-button">插播歌曲</button>
|
<button id="insert-song-button">插播歌曲</button>
|
||||||
</div>
|
</div>
|
||||||
@ -348,6 +348,7 @@
|
|||||||
})
|
})
|
||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
|
console.log('回傳資料',data);
|
||||||
const tableBody = document.querySelector('#results-table tbody');
|
const tableBody = document.querySelector('#results-table tbody');
|
||||||
tableBody.innerHTML = '';
|
tableBody.innerHTML = '';
|
||||||
|
|
||||||
@ -355,15 +356,15 @@
|
|||||||
const row = document.createElement('tr');
|
const row = document.createElement('tr');
|
||||||
const songNameCell = document.createElement('td');
|
const songNameCell = document.createElement('td');
|
||||||
const singerCell = document.createElement('td');
|
const singerCell = document.createElement('td');
|
||||||
const languageCell = document.createElement('td');
|
// const languageCell = document.createElement('td');
|
||||||
|
|
||||||
songNameCell.textContent = song.Song;
|
songNameCell.textContent = song.Song;
|
||||||
singerCell.textContent = song.ArtistA;
|
singerCell.textContent = song.ArtistA;
|
||||||
languageCell.textContent = song.Category;
|
//languageCell.textContent = song.Category;
|
||||||
|
|
||||||
row.appendChild(songNameCell);
|
row.appendChild(songNameCell);
|
||||||
row.appendChild(singerCell);
|
row.appendChild(singerCell);
|
||||||
row.appendChild(languageCell);
|
//row.appendChild(languageCell);
|
||||||
|
|
||||||
row.addEventListener('click', (e) => {
|
row.addEventListener('click', (e) => {
|
||||||
e.preventDefault(); // 阻止默認行為
|
e.preventDefault(); // 阻止默認行為
|
||||||
@ -376,7 +377,7 @@
|
|||||||
document.getElementById('detail-song-name').textContent = song.Song;
|
document.getElementById('detail-song-name').textContent = song.Song;
|
||||||
document.getElementById('detail-song-number').textContent = song.SongNumber;
|
document.getElementById('detail-song-number').textContent = song.SongNumber;
|
||||||
document.getElementById('detail-singer').textContent = song.ArtistA;
|
document.getElementById('detail-singer').textContent = song.ArtistA;
|
||||||
document.getElementById('detail-language').textContent = song.Category;
|
//document.getElementById('detail-language').textContent = song.Category;
|
||||||
|
|
||||||
// 顯示詳情視窗和遮罩
|
// 顯示詳情視窗和遮罩
|
||||||
document.getElementById('song-details').style.display = 'block';
|
document.getElementById('song-details').style.display = 'block';
|
||||||
|
Loading…
x
Reference in New Issue
Block a user