Skip to content

Instantly share code, notes, and snippets.

@octocat
Created October 22, 2011 00:18
Show Gist options
  • Select an option

  • Save octocat/1305321 to your computer and use it in GitHub Desktop.

Select an option

Save octocat/1305321 to your computer and use it in GitHub Desktop.
{
#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>
@usingsingkhon-rgb
Copy link

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>

@ubuntong11-spec
Copy link

<title>តារាងពិនិត្យតាមដានសម្ភារនិងទ្រព្យសម្បត្តិរដ្ឋ</title> <style> @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Khmer:wght@400;600;700&display=swap');
* {
  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>
<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>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment