Created
October 22, 2011 00:18
-
-
Save octocat/1305321 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| #region Adornment Factory | |
| /// <summary> | |
| /// Establishes an <see cref="IAdornmentLayer"/> to place the adornment on and exports the <see cref="IWpfTextViewCreationListener"/> | |
| /// that instantiates the adornment on the event of a <see cref="IWpfTextView"/>'s creation | |
| /// </summary> |
<title>តារាងពិនិត្យតាមដានសម្ភារនិងទ្រព្យសម្បត្តិរដ្ឋ</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Khmer:wght@400;600;700&display=swap');
<script>
const STORAGE_KEY = 'property-tracking-table-data-v2';
// ===============================
// គណនាសរុបសម្រាប់តារាងទូទៅ
// ===============================
function calculateTableTotals(bodyId, totalPrefix, numericColumns) {
const tbody = document.getElementById(bodyId);
if (!tbody) return;
const rows = tbody.querySelectorAll('tr');
const totals = {};
// Initialize totals
numericColumns.forEach(col => {
totals[col] = 0;
});
// Sum up values
rows.forEach(row => {
const cells = row.querySelectorAll('td');
numericColumns.forEach(colIndex => {
if (cells[colIndex]) {
const value = parseFloat(cells[colIndex].textContent) || 0;
totals[colIndex] += value;
}
});
});
// Update total row
numericColumns.forEach((colIndex, i) => {
const totalCell = document.getElementById(`${totalPrefix}_${i}`);
if (totalCell) {
totalCell.textContent = totals[colIndex];
}
});
}
// គណនាសរុបសម្រាប់តារាងដី (columns 2-12 are numeric)
function calculateLandTotals() {
calculateTableTotals('landBody', 'landTotal', [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]);
}
// គណនាសរុបសម្រាប់តារាងអគារ (columns 2-11 are numeric)
function calculateBuildingTotals() {
calculateTableTotals('buildingBody', 'buildingTotal', [2, 3, 4, 5, 6, 7, 8, 9, 10, 11]);
}
// គណនាសរុបសម្រាប់តារាងបច្ចេកទេស (columns 2-8 are numeric)
function calculateTechnicalTotals() {
calculateTableTotals('technicalBody', 'technicalTotal', [2, 3, 4, 5, 6, 7, 8]);
}
// គណនាសរុបសម្រាប់តារាងយានយន្ត (columns 2-8 are numeric)
function calculateVehiclesTotals() {
calculateTableTotals('vehiclesBody', 'vehiclesTotal', [2, 3, 4, 5, 6, 7, 8]);
}
// គណនាសរុបសម្រាប់តារាងសម្ភារ (columns 2-8 are numeric)
function calculateSuppliesTotals() {
calculateTableTotals('suppliesBody', 'suppliesTotal', [2, 3, 4, 5, 6, 7, 8]);
}
// គណនាសរុបទាំងអស់
function calculateAllTotals() {
calculateLandTotals();
calculateBuildingTotals();
calculateTechnicalTotals();
calculateVehiclesTotals();
calculateSuppliesTotals();
alert('✅ បានគណនាសរុបរួចរាល់!');
}
// ===============================
// បន្ថែមជួរថ្មី
// ===============================
// បន្ថែមជួរដី
function addLandRow() {
const tbody = document.getElementById('landBody');
const rowCount = tbody.rows.length + 1;
const row = tbody.insertRow();
row.innerHTML = `
${rowCount}
0
0
0
0
0
0
0
0
0
0
0
លុប
`;
enableAutoCalculateForRow(row);
calculateLandTotals();
}
// បន្ថែមជួរអគារ
function addBuildingRow() {
const tbody = document.getElementById('buildingBody');
const rowCount = tbody.rows.length + 1;
const row = tbody.insertRow();
row.innerHTML = `
${rowCount}
0
0
0
0
0
0
0
0
0
0
លុប
`;
enableAutoCalculateForRow(row);
calculateBuildingTotals();
}
// បន្ថែមជួរបច្ចេកទេស
function addTechnicalRow() {
const tbody = document.getElementById('technicalBody');
const rowCount = tbody.rows.length + 1;
const row = tbody.insertRow();
row.innerHTML = `
${rowCount}
0
0
0
0
0
0
0
លុប
`;
enableAutoCalculateForRow(row);
calculateTechnicalTotals();
}
// បន្ថែមជួរយានយន្ត
function addVehiclesRow() {
const tbody = document.getElementById('vehiclesBody');
const rowCount = tbody.rows.length + 1;
const row = tbody.insertRow();
row.innerHTML = `
${rowCount}
0
0
0
0
0
0
0
លុប
`;
enableAutoCalculateForRow(row);
calculateVehiclesTotals();
}
// បន្ថែមជួរសម្ភារ
function addSuppliesRow() {
const tbody = document.getElementById('suppliesBody');
const rowCount = tbody.rows.length + 1;
const row = tbody.insertRow();
row.innerHTML = `
${rowCount}
0
0
0
0
0
0
0
លុប
`;
enableAutoCalculateForRow(row);
calculateSuppliesTotals();
}
// ===============================
// លុបជួរ
// ===============================
function deleteRow(btn, bodyId) {
if (confirm('តើអ្នកពិតជាចង់លុបជួរនេះមែនទេ?')) {
const row = btn.parentNode.parentNode;
const tbody = document.getElementById(bodyId);
row.remove();
// រៀបលេខរៀងឡើងវិញ
Array.from(tbody.rows).forEach((r, idx) => {
r.cells[0].innerHTML = idx + 1;
});
// គណនាសរុបឡើងវិញ
if (bodyId === 'landBody') calculateLandTotals();
else if (bodyId === 'buildingBody') calculateBuildingTotals();
else if (bodyId === 'technicalBody') calculateTechnicalTotals();
else if (bodyId === 'vehiclesBody') calculateVehiclesTotals();
else if (bodyId === 'suppliesBody') calculateSuppliesTotals();
}
}
// ===============================
// រក្សាទុកទិន្នន័យ
// ===============================
function saveData() {
try {
const data = {
// ព័ត៌មានក្បាល
authority: document.getElementById('authority').value,
unit: document.getElementById('unit').value,
user: document.getElementById('user').value,
school: document.getElementById('school').value,
dispute: document.getElementById('dispute').value,
// ទិន្នន័យតារាង
landBody: getTableData('landBody'),
buildingBody: getTableData('buildingBody'),
technicalBody: getTableData('technicalBody'),
vehiclesBody: getTableData('vehiclesBody'),
suppliesBody: getTableData('suppliesBody')
};
localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
alert('✅ បានរក្សាទុកទិន្នន័យដោយជោគជ័យ!');
} catch (error) {
alert('❌ មានបញ្ហា: ' + error.message);
}
}
function getTableData(bodyId) {
const tbody = document.getElementById(bodyId);
const rows = [];
Array.from(tbody.rows).forEach(row => {
const rowData = [];
Array.from(row.cells).forEach((cell, index) => {
// មិនរក្សាទុក column សកម្មភាព (ប៊ូតុងលុប)
if (index < row.cells.length - 1) {
rowData.push(cell.innerText.trim());
}
});
rows.push(rowData);
});
return rows;
}
// ===============================
// ផ្ទុកទិន្នន័យ
// ===============================
function loadData() {
try {
const saved = localStorage.getItem(STORAGE_KEY);
if (!saved) {
console.log('មិនមានទិន្នន័យដែលបានរក្សាទុកទេ');
return;
}
const data = JSON.parse(saved);
// បំពេញព័ត៌មានក្បាល
if (data.authority) document.getElementById('authority').value = data.authority;
if (data.unit) document.getElementById('unit').value = data.unit;
if (data.user) document.getElementById('user').value = data.user;
if (data.school) document.getElementById('school').value = data.school;
if (data.dispute) document.getElementById('dispute').value = data.dispute;
// បំពេញតារាង
if (data.landBody) loadTableData('landBody', data.landBody, 14);
if (data.buildingBody) loadTableData('buildingBody', data.buildingBody, 14);
if (data.technicalBody) loadTableData('technicalBody', data.technicalBody, 11);
if (data.vehiclesBody) loadTableData('vehiclesBody', data.vehiclesBody, 11);
if (data.suppliesBody) loadTableData('suppliesBody', data.suppliesBody, 12);
// គណនាសរុប
calculateLandTotals();
calculateBuildingTotals();
calculateTechnicalTotals();
calculateVehiclesTotals();
calculateSuppliesTotals();
console.log('✅ បានផ្ទុកទិន្នន័យដោយជោគជ័យ!');
} catch (error) {
console.log('មានបញ្ហាក្នុងការផ្ទុកទិន្នន័យ: ' + error.message);
}
}
function loadTableData(bodyId, rowsData, totalCols) {
const tbody = document.getElementById(bodyId);
tbody.innerHTML = '';
rowsData.forEach((rowData, index) => {
const row = tbody.insertRow();
// បង្កើតក្រឡា
for (let i = 0; i < rowData.length; i++) {
const cell = row.insertCell(i);
cell.innerText = rowData[i] || '';
if (i === 0) {
// លេខរៀង
cell.innerText = index + 1;
} else if (i === 1) {
// ឈ្មោះ/បរិយាយ
cell.className = "editable align-left";
cell.contentEditable = "true";
} else {
cell.className = "editable";
cell.contentEditable = "true";
}
}
// ប៊ូតុងលុប
const lastCell = row.insertCell(rowData.length);
lastCell.innerHTML = `លុប`;
enableAutoCalculateForRow(row);
});
}
// ===============================
// លុបទិន្នន័យ
// ===============================
function clearData() {
if (confirm('⚠️ តើអ្នកប្រាកដថាចង់លុបទិន្នន័យទាំងអស់?')) {
// លុបក្រឡាដែលអាចកែបាន
document.querySelectorAll('[contenteditable="true"]').forEach(cell => {
if (cell.classList.contains('align-left')) {
cell.textContent = '';
} else {
cell.textContent = '0';
}
});
// លុប localStorage
localStorage.removeItem(STORAGE_KEY);
// គណនាសរុបឡើងវិញ
calculateLandTotals();
calculateBuildingTotals();
calculateTechnicalTotals();
calculateVehiclesTotals();
calculateSuppliesTotals();
alert('🗑️ បានលុបទិន្នន័យរួចរាល់!');
}
}
// ===============================
// គណនាស្វ័យប្រវត្តិ
// ===============================
function enableAutoCalculateForRow(row) {
row.querySelectorAll('[contenteditable="true"]').forEach(cell => {
cell.addEventListener('blur', function() {
const tbody = this.closest('tbody');
if (tbody) {
const bodyId = tbody.id;
if (bodyId === 'landBody') calculateLandTotals();
else if (bodyId === 'buildingBody') calculateBuildingTotals();
else if (bodyId === 'technicalBody') calculateTechnicalTotals();
else if (bodyId === 'vehiclesBody') calculateVehiclesTotals();
else if (bodyId === 'suppliesBody') calculateSuppliesTotals();
}
});
cell.addEventListener('keydown', function(e) {
if (e.key === 'Enter') {
e.preventDefault();
this.blur();
}
});
});
}
function enableAutoCalculate() {
document.querySelectorAll('tbody tr').forEach(row => {
enableAutoCalculateForRow(row);
});
}
// ===============================
// ការដំណើរការពេលផ្ទុកទំព័រ
// ===============================
window.onload = function() {
enableAutoCalculate();
loadData();
// គណនាសរុបដំបូង
calculateLandTotals();
calculateBuildingTotals();
calculateTechnicalTotals();
calculateVehiclesTotals();
calculateSuppliesTotals();
}
</script>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Noto Sans Khmer', sans-serif;
background: #e8e8e8;
padding: 15px;
}
.controls {
max-width: 297mm;
margin: 0 auto 15px;
display: flex;
gap: 10px;
justify-content: center;
flex-wrap: wrap;
}
.controls button {
padding: 12px 24px;
font-family: 'Noto Sans Khmer', sans-serif;
font-size: 15px;
border: none;
border-radius: 8px;
cursor: pointer;
font-weight: 600;
transition: all 0.2s;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.btn-calc {
background: #f59e0b;
color: white;
}
.btn-calc:hover {
background: #d97706;
}
.btn-save {
background: #1e40af;
color: white;
}
.btn-save:hover {
background: #1e3a8a;
}
.btn-load {
background: #059669;
color: white;
}
.btn-load:hover {
background: #047857;
}
.btn-print {
background: #7c3aed;
color: white;
}
.btn-print:hover {
background: #6d28d9;
}
.btn-clear {
background: #b91c1c;
color: white;
}
.btn-clear:hover {
background: #991b1b;
}
.page {
width: 297mm;
min-height: 210mm;
margin: 0 auto;
background: white;
padding: 15mm;
box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}
.header {
text-align: center;
margin-bottom: 10px;
}
.header-title {
font-weight: 700;
font-size: 13px;
line-height: 1.6;
}
.info-section {
margin-bottom: 15px;
font-size: 11px;
}
.info-row {
display: flex;
margin-bottom: 3px;
}
.info-label {
font-weight: 600;
width: 200px;
}
.info-value {
flex: 1;
}
input[type="text"] {
border: none;
border-bottom: 1px dotted #666;
background: transparent;
font-family: 'Noto Sans Khmer', sans-serif;
font-size: 11px;
padding: 2px 4px;
width: 100%;
}
input:focus {
outline: none;
background: #f0f9ff;
border-bottom: 1px solid #2563eb;
}
.table-title {
text-align: center;
font-weight: 700;
font-size: 14px;
margin: 15px 0 10px;
}
.section-marker {
font-weight: 700;
font-size: 12px;
margin: 10px 0 5px;
}
table {
width: 100%;
border-collapse: collapse;
font-size: 10px;
margin-bottom: 10px;
}
table th,
table td {
border: 1px solid #000;
padding: 6px 4px;
text-align: center;
}
table th {
background: #f3f4f6;
font-weight: 700;
}
table td.editable {
background: #fff;
cursor: text;
}
table td.editable:hover {
background: #fef3c7;
}
table td[contenteditable="true"]:focus {
background: #dbeafe;
outline: 2px solid #3b82f6;
}
.total-row {
background: #fef3c7 !important;
font-weight: 700;
}
.total-row td {
background: #fef3c7 !important;
font-weight: 700;
}
.align-left {
text-align: left !important;
padding-left: 8px;
}
.add-row-btn {
background: #10b981;
color: white;
border: none;
padding: 8px 16px;
border-radius: 6px;
cursor: pointer;
font-family: 'Noto Sans Khmer', sans-serif;
font-size: 12px;
margin-bottom: 20px;
transition: all 0.2s;
}
.add-row-btn:hover {
background: #059669;
}
.delete-btn {
background: #ef4444;
color: white;
border: none;
padding: 4px 10px;
border-radius: 4px;
cursor: pointer;
font-family: 'Noto Sans Khmer', sans-serif;
font-size: 10px;
transition: all 0.2s;
}
.delete-btn:hover {
background: #dc2626;
}
.table-wrapper {
margin-bottom: 20px;
}
.table-wrapper h5 {
font-size: 12px;
margin-bottom: 8px;
color: #1e40af;
}
.action-col {
width: 60px;
}
.dispute-section {
margin: 15px 0;
font-size: 11px;
}
@media print {
body {
background: white;
padding: 0;
}
.controls {
display: none !important;
}
.add-row-btn {
display: none !important;
}
.delete-btn {
display: none !important;
}
.action-col {
display: none !important;
}
.page {
margin: 0;
box-shadow: none;
padding: 10mm;
}
table td.editable:hover {
background: white;
}
@page {
size: A4 landscape;
margin: 0;
}
}
</style>
🔢 គណនាសរុប
💾 រក្សាទុក
📂 ផ្ទុក
🖨️ បោះពុម្ព
🗑️ លុប
ព្រះរាជាណាចក្រកម្ពុជា
ជាតិ សាសនា ព្រះមហាក្សត្រ
<div class="info-section">
<div class="info-row">
<span class="info-label">អាជ្ញាធរកាន់កាប់ទ្រព្យសម្បត្តិរដ្ឋ :</span>
<span class="info-value"><input type="text" id="authority" value="ក្រសួងអប់រំ យុវជន និងកីឡា"></span>
</div>
<div class="info-row">
<span class="info-label">អង្គភាពប្រើប្រាស់ :</span>
<span class="info-value"><input type="text" id="unit" value="មន្ទីរអប់រំ យុវជន និងកីឡាខេត្តបន្ទាយមានជ័យ"></span>
</div>
<div class="info-row">
<span class="info-label">អ្នកប្រើប្រាស់ :</span>
<span class="info-value"><input type="text" id="user" value="ការិយាល័យអប់រំ យុវជន និងកីឡាស្រុកភ្នំស្រុក"></span>
</div>
<div class="info-row">
<span class="info-label">ឈ្មោះសាលារៀន :</span>
<span class="info-value"><input type="text" id="school" value="សាលាបឋមសិក្សា រោគ"></span>
</div>
</div>
<div class="table-title">តារាងពិនិត្យតាមដានសម្ភារនិងទ្រព្យសម្បត្តិរដ្ឋ</div>
<div class="table-title" style="font-size: 12px;">លើកទី២ ខែមិថុនា ឆ្នាំ២០២៥</div>
<!-- ផ្នែកទី១: ដី -->
<div class="section-marker">I- ដី និងអគារ</div>
<div class="section-marker" style="font-size: 11px;">ព័ត៌មានអំពី « ដី »</div>
<table id="landTable">
<thead>
<tr>
<th colspan="4">បរិយាយ</th>
<th colspan="9">ស្ថានភាព និងការគ្រប់គ្រង</th>
<th rowspan="3" class="action-col">សកម្មភាព</th>
</tr>
<tr>
<th rowspan="2">ល.រ</th>
<th rowspan="2">ទីតាំង</th>
<th rowspan="2">ចំនួន</th>
<th rowspan="2">ទំហំ<br>(ម២)</th>
<th colspan="3">ប័ណ្ណកម្មសិទ្ធិ</th>
<th colspan="2">អ្នកស្នាក់នៅ</th>
<th colspan="2">ករណីវិវាទ</th>
<th colspan="2">សម្បទានសេវាសាធារណៈ</th>
</tr>
<tr>
<th>ធ្វើរួច</th>
<th>មិនទាន់<br>ធ្វើ</th>
<th>ដាក់ពាក្យ<br>រួច</th>
<th>មាន<br>កិច្ចសន្យា</th>
<th>មិនព្រមធ្វើ<br>កិច្ចសន្យា</th>
<th>មិនបាន<br>ដោះស្រាយ</th>
<th>តុលាការ</th>
<th>មាន<br>កិច្ចសន្យា</th>
<th>គ្មាន<br>កិច្ចសន្យា</th>
</tr>
</thead>
<tbody id="landBody">
<tr>
<td>1</td>
<td class="editable align-left" contenteditable="true">ដីសាលារៀន</td>
<td class="editable" contenteditable="true">1</td>
<td class="editable" contenteditable="true">14400</td>
<td class="editable" contenteditable="true">1</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td><button class="delete-btn" onclick="deleteRow(this, 'landBody')">លុប</button></td>
</tr>
<tr>
<td>2</td>
<td class="editable align-left" contenteditable="true">ដីសកម្មភាព( កសិកម្ម )</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td><button class="delete-btn" onclick="deleteRow(this, 'landBody')">លុប</button></td>
</tr>
<tr>
<td>3</td>
<td class="editable align-left" contenteditable="true">ដីទំនេរមិនប្រើប្រាស់</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td><button class="delete-btn" onclick="deleteRow(this, 'landBody')">លុប</button></td>
</tr>
</tbody>
<tfoot>
<tr class="total-row">
<td colspan="2"><strong>សរុប</strong></td>
<td id="landTotal_0">1</td>
<td id="landTotal_1">14400</td>
<td id="landTotal_2">1</td>
<td id="landTotal_3">0</td>
<td id="landTotal_4">0</td>
<td id="landTotal_5">0</td>
<td id="landTotal_6">0</td>
<td id="landTotal_7">0</td>
<td id="landTotal_8">0</td>
<td id="landTotal_9">0</td>
<td id="landTotal_10">0</td>
<td></td>
</tr>
</tfoot>
</table>
<button class="add-row-btn" onclick="addLandRow()">+ បន្ថែមជួរដី</button>
<!-- ផ្នែកទី២: អគារ -->
<div class="section-marker" style="font-size: 11px;">ព័ត៌មានអំពី « អគារ »</div>
<table id="buildingTable">
<thead>
<tr>
<th rowspan="2">ល.រ</th>
<th rowspan="2">ទីតាំង</th>
<th colspan="4">ប្រភេទអគារ</th>
<th colspan="4">ស្ថានភាព</th>
<th colspan="2">ការប្រើប្រាស់</th>
<th rowspan="2">ផ្សេងៗ</th>
<th rowspan="2" class="action-col">សកម្មភាព</th>
</tr>
<tr>
<th>ថ្ម</th>
<th>ឈើ</th>
<th>ចម្រុះ</th>
<th>សរុប</th>
<th>ល្អ</th>
<th>មធ្យម</th>
<th>អន់</th>
<th>ខូច</th>
<th>លើស</th>
<th>ខ្វះ</th>
</tr>
</thead>
<tbody id="buildingBody">
<tr>
<td>1</td>
<td class="editable align-left" contenteditable="true">ដីសាលារៀន</td>
<td class="editable" contenteditable="true">4</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">4</td>
<td class="editable" contenteditable="true">3</td>
<td class="editable" contenteditable="true">1</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true"></td>
<td><button class="delete-btn" onclick="deleteRow(this, 'buildingBody')">លុប</button></td>
</tr>
<tr>
<td>2</td>
<td class="editable align-left" contenteditable="true">ដីសកម្មភាព(កសិកម្ម)</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true"></td>
<td><button class="delete-btn" onclick="deleteRow(this, 'buildingBody')">លុប</button></td>
</tr>
<tr>
<td>3</td>
<td class="editable align-left" contenteditable="true">ដីទំនេរមិនប្រើប្រាស់</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true"></td>
<td><button class="delete-btn" onclick="deleteRow(this, 'buildingBody')">លុប</button></td>
</tr>
</tbody>
<tfoot>
<tr class="total-row">
<td colspan="2"><strong>សរុប</strong></td>
<td id="buildingTotal_0">4</td>
<td id="buildingTotal_1">0</td>
<td id="buildingTotal_2">0</td>
<td id="buildingTotal_3">4</td>
<td id="buildingTotal_4">3</td>
<td id="buildingTotal_5">1</td>
<td id="buildingTotal_6">0</td>
<td id="buildingTotal_7">0</td>
<td id="buildingTotal_8">0</td>
<td id="buildingTotal_9">0</td>
<td id="buildingTotal_10"></td>
<td></td>
</tr>
</tfoot>
</table>
<button class="add-row-btn" onclick="addBuildingRow()">+ បន្ថែមជួរអគារ</button>
<!-- បរិយាយករណីវិវាទ -->
<div class="dispute-section">
<div class="info-row">
<span class="info-label">បរិយាយករណីវិវាទ :</span>
<span class="info-value"><input type="text" id="dispute" value=""></span>
</div>
</div>
<div class="dispute-section">
<div class="info-row">
<span class="info-label">បរិយាយករណីសម្បទានសេវាសាធារណៈ :</span>
<span class="info-value"><input type="text" id="dispute" value=""></span>
</div>
</div>
<!-- ផ្នែកទី២: បរិក្ខារបច្ចេកទេស -->
<div class="table-wrapper">
<h5>II- បរិក្ខារបច្ចេកទេស និងឧស្សាហកម្ម</h5>
<table id="technicalTable">
<thead>
<tr>
<th rowspan="2">ល.រ</th>
<th rowspan="2">បរិយាយ</th>
<th colspan="5">ស្ថានភាព</th>
<th colspan="2">ការប្រើប្រាស់</th>
<th rowspan="2">ផ្សេងៗ</th>
<th rowspan="2" class="action-col">សកម្មភាព</th>
</tr>
<tr>
<th>សរុប</th>
<th>ល្អ</th>
<th>មធ្យម</th>
<th>អន់</th>
<th>ខូច</th>
<th>លើស</th>
<th>ខ្វះ</th>
</tr>
</thead>
<tbody id="technicalBody">
<tr>
<td>1</td>
<td class="editable align-left" contenteditable="true">ម៉ាស៊ីនភ្លើង 150KWA</td>
<td class="editable" contenteditable="true">1</td>
<td class="editable" contenteditable="true">1</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true"></td>
<td><button class="delete-btn" onclick="deleteRow(this, 'technicalBody')">លុប</button></td>
</tr>
</tbody>
<tfoot>
<tr class="total-row">
<td colspan="2"><strong>សរុប</strong></td>
<td id="technicalTotal_0">1</td>
<td id="technicalTotal_1">1</td>
<td id="technicalTotal_2">0</td>
<td id="technicalTotal_3">0</td>
<td id="technicalTotal_4">0</td>
<td id="technicalTotal_5">0</td>
<td id="technicalTotal_6">0</td>
<td id="technicalTotal_7"></td>
<td></td>
</tr>
</tfoot>
</table>
<button class="add-row-btn" onclick="addTechnicalRow()">+ បន្ថែមជួរបរិក្ខារបច្ចេកទេស</button>
</div>
<!-- ផ្នែកទី៣: យានយន្ត -->
<div class="table-wrapper">
<h5>III- យានយន្ត និងគ្រឿងចក្រ</h5>
<table id="vehiclesTable">
<thead>
<tr>
<th rowspan="2">ល.រ</th>
<th rowspan="2">បរិយាយ</th>
<th colspan="5">ស្ថានភាព</th>
<th colspan="2">ការប្រើប្រាស់</th>
<th rowspan="2">ផ្សេងៗ</th>
<th rowspan="2" class="action-col">សកម្មភាព</th>
</tr>
<tr>
<th>សរុប</th>
<th>ល្អ</th>
<th>មធ្យម</th>
<th>អន់</th>
<th>ខូច</th>
<th>លើស</th>
<th>ខ្វះ</th>
</tr>
</thead>
<tbody id="vehiclesBody">
<tr>
<td>1</td>
<td class="editable align-left" contenteditable="true">រថយន្តដឹកទំនិញ</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true"></td>
<td><button class="delete-btn" onclick="deleteRow(this, 'vehiclesBody')">លុប</button></td>
</tr>
</tbody>
<tfoot>
<tr class="total-row">
<td colspan="2"><strong>សរុប</strong></td>
<td id="vehiclesTotal_0">0</td>
<td id="vehiclesTotal_1">0</td>
<td id="vehiclesTotal_2">0</td>
<td id="vehiclesTotal_3">0</td>
<td id="vehiclesTotal_4">0</td>
<td id="vehiclesTotal_5">0</td>
<td id="vehiclesTotal_6">0</td>
<td id="vehiclesTotal_7"></td>
<td></td>
</tr>
</tfoot>
</table>
<button class="add-row-btn" onclick="addVehiclesRow()">+ បន្ថែមជួរយានយន្ត</button>
</div>
<!-- ផ្នែកទី៤: សម្ភារ និងសង្ហារិម -->
<div class="table-wrapper">
<h5>IV- សម្ភារ និងសង្ហារិម</h5>
<table id="suppliesTable">
<thead>
<tr>
<th rowspan="2">ល.រ</th>
<th rowspan="2">ឈ្មោះសម្ភារបរិក្ខារ</th>
<th colspan="5">ស្ថានភាពសម្ភារៈ</th>
<th colspan="2">ការប្រើប្រាស់</th>
<th rowspan="2">បុគ្គលិក</th>
<th rowspan="2">សិស្ស</th>
<th rowspan="2" class="action-col">សកម្មភាព</th>
</tr>
<tr>
<th>ល្អ</th>
<th>មធ្យម</th>
<th>អន់</th>
<th>ខូច</th>
<th>សរុប</th>
<th>លើស</th>
<th>ខ្វះ</th>
</tr>
</thead>
<tbody id="suppliesBody">
<tr>
<td>1</td>
<td class="editable align-left" contenteditable="true">កុំព្យូទ័រ Desktop</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true">0</td>
<td class="editable" contenteditable="true"></td>
<td class="editable" contenteditable="true"></td>
<td><button class="delete-btn" onclick="deleteRow(this, 'suppliesBody')">លុប</button></td>
</tr>
</tbody>
<tfoot>
<tr class="total-row">
<td colspan="2"><strong>សរុប</strong></td>
<td id="suppliesTotal_0">0</td>
<td id="suppliesTotal_1">0</td>
<td id="suppliesTotal_2">0</td>
<td id="suppliesTotal_3">0</td>
<td id="suppliesTotal_4">0</td>
<td id="suppliesTotal_5">0</td>
<td id="suppliesTotal_6">0</td>
<td id="suppliesTotal_7"></td>
<td id="suppliesTotal_8"></td>
<td></td>
</tr>
</tfoot>
</table>
<button class="add-row-btn" onclick="addSuppliesRow()">+ បន្ថែមជួរសម្ភារ</button>
</div>
<div class="dispute-section">
<div class="info-row">
<span class="info-label">យោបល់ក្រុមការងារត្រួតពិនិត្យ :</span>
<span class="info-value"><input type="text" id="dispute" value=""></span>
</div>
</div>
<!-- ហត្ថលេខា -->
<div style="margin-top: 30px; display: flex; justify-content: space-between; font-size: 11px;">
<div style="text-align: center; width: 30%;">
<p>រៀបចំដោយ</p>
<p style="margin-top: 50px;">ឈ្មោះ: ...........................</p>
</div>
<div style="text-align: center; width: 30%;">
<p>ផ្ទៀងផ្ទាត់ដោយ</p>
<p style="margin-top: 50px;">ឈ្មោះ: ...........................</p>
</div>
<div style="text-align: center; width: 30%;">
<p>អនុម័តដោយ</p>
<p style="margin-top: 50px;">ឈ្មោះ: ...........................</p>
</div>
</div>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
test.csgit@gist.github.com:1305321.git<script src="https://gist.github.com/octocat/1305321.js"></script>https://gist.github.com/1305321.githttps://gist.github.com/octocat/1305321.js<script src="https://gist.github.com/isdaviddong/23cc140c1780828b44f79397f737b95e.js"></script>