????
Your IP : 216.73.216.209
<% layout('../layouts/userLayout.eta') %>
<style>
.k-listview {
display: flex !important;
border-style: none;
background-color: transparent;
}
</style>
<div class="content">
<div class="page-inner">
<div class="page-header">
<div class="btn-group">
<a href="/danhmuc/phong">
<button class="btn btn-primary">
<span class="btn-label"><i class="fas fa-angle-double-left"></i></span> Quay lại
</button>
</a>
<span class="btn btn-link">
<h4 class="page-title"><%= it.fondName %></h4>
</span>
</div>
<input id="fond-code" type="hidden" value="<%= it.fondCode %>">
</div>
<div class="row">
<div class="col">
<div class="card">
<form id="search-form">
<div class="card-body pb-0">
<div id="search-basic" class="form-group">
<div class="input-group">
<input id="search-input" class="form-control" name="content" placeholder="Nhập từ khóa tìm kiếm">
<div class="input-group-append btn-group">
<button class="btn btn-secondary btn-sm" type="submit">
<span class="btn-label"><i class="fas fa-search"></i></span> Tìm kiếm
</button>
<button id="advancedSearch" type="button" class="btn btn-border btn-sm btn-primary">
<span class="btn-label"><i class="fas fa-check collapse"></i></span> Nâng cao
</button>
</div>
</div>
</div>
</div>
<div id="advanced-group" class="collapse card-body pt-0">
<div class="row mx-auto" style="width: 90%">
<div class="form-group col-md-6">
<label>Phông lưu trữ</label>
<select id="fond" class="form-control" name="fond" value="003">
<option></option>
</select>
</div>
<div class="form-group col-md-6">
<label>Nhóm tài liệu</label>
<select id="group" class="form-control" name="type">
<option></option>
</select>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="row clearfix" id="file-list"></div>
<div id="file-pager"></div>
</div>
</div>
<!-- <script type="text/x-kendo-template" id="file-template">
<div class="file col-xl-2 col-md-3 col-sm-4 col-6">
<div class="card" title="#:Title#">
<div class="p-4">
<img class="card-img" src="/img/tailieu/folder-brown.png">
<div class="card-img-overlay p-1">
<div class="btn-group float-right">
<span class="btn btn-secondary btn-xs">Số: #:FileNumber#</span>
<button class="btn btn-icon btn-info btn-xs detail-btn"><i class="fas fa-info-circle"></i></button>
</div>
</div>
</div>
<div class="card-body">
<div class="fw-bold text-truncate">#:Title#</div>
<p class="text-muted small">#:countDoc# văn bản</p>
</div>
</div>
</div>
</script> -->
<script type="text/x-kendo-template" id="file-template">
<div class="file col-xl-2 col-md-3 col-sm-4 col-6">
<div class="card grid-item" title="#:Title#">
<div class="grid-thumb mx-3 mt-3 p-3">
<img class="card-img" src="/img/tailieu/folder-orange.png">
</div>
<div class="card-body">
<div class="fw-bold text-truncate">#:Title#</div>
<span>Hồ sơ số: #:FileNumber#</span>
<div class="text-muted small">#:countDoc# văn bản</div>
</div>
</div>
</div>
</script>
<!-- Thông tin chi tiết hồ sơ -->
<div class="modal fade" id="file-detail">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Thông tin hồ sơ</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<table class="table table-bordered table-striped">
<tr>
<td>Tiêu đề</td>
<td data-bind="text: file.Title"></td>
</tr>
<tr>
<td>Mục lục số</td>
<td data-bind="text: file.FileCatalog"></td>
</tr>
<tr>
<td>Hộp số</td>
<td data-bind="text: file.BoxNumber"></td>
</tr>
<tr>
<td>Hồ sơ số</td>
<td data-bind="text: file.FileNumber"></td>
</tr>
<tr>
<td>Ký hiệu</td>
<td data-bind="text: file.FileNotation"></td>
</tr>
<tr>
<td>Ngày bắt đầu</td>
<td data-bind="text: getStartDate()"></td>
</tr>
<tr>
<td>Ngày kết thúc</td>
<td data-bind="text: getEndDate()"></td>
</tr>
<tr>
<td>Số trang</td>
<td data-bind="text: file.PageNumber"></td>
</tr>
<tr>
<td>Số tờ</td>
<td data-bind="text: file.SheetNumber"></td>
</tr>
<tr>
<td>Ghi chú</td>
<td data-bind="text: file.Description"></td>
</tr>
</table>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Đóng lại</button>
</div>
</div>
</div>
</div>
<!--Modal xem chi tiết văn bản trong hồ sơ-->
<div id="detail-win">
<table id="detailTable" class="table table-bordered table-striped w-100">
<thead>
<tr>
<!-- <th style="width: 10px"></th> -->
<th style="width: 10px">STT</th>
<th>Số và ký hiệu</th>
<th style="min-width: 300px">Trích yếu</th>
<th>Ngày ban hành</th>
<th style="width: 10px">Số trang</th>
<th style="width: 10px">Số tờ</th>
<th style="width: 10px">Tờ số</th>
<th>Xóa/Sửa</th>
</tr>
</thead>
</table>
</div>
<ul id="context-menu">
<li class="info-item"><i class="fas fa-info-circle text-info mr-3"></i> Thông tin</li>
<!-- <li class="edit-item"><i class="fas fa-pencil-alt text-warning mr-3"></i> Sửa phông</li>
<li class="delete-item"><i class="fas fa-trash-alt text-danger mr-3"></i> Xóa phông</li> -->
<li class="list-item"><i class="fas fa-th-list text-primary mr-3"></i> Danh sách văn bản</li>
</ul>
<script type="text/javascript">
$(function () {
var fileVM = kendo.observable({
file: {},
getStartDate: function () {
var startDate = this.get('file.StartDate');
return moment(startDate).isValid() ? moment(startDate).format('DD/MM/YYYY') : ''
},
getEndDate: function () {
var endDate = this.get('file.EndDate');
return moment(endDate).isValid() ? moment(endDate).format('DD/MM/YYYY') : ''
}
});
kendo.bind($('#file-detail'), fileVM);
// Tìm kiếm
$("#fond").select2({
ajax: {
url: "/danhmuc/phong/json",
dataType: "json",
delay: 250,
processResults: function (data, params) {
params.page = params.page || 1;
return {
results: data.map(function (x) { return { id: x.FondCode, text: x.FondName } }),
pagination: { more: false }
}
}
},
theme: "bootstrap4",
allowClear: true,
placeholder: "Chọn phông lưu trữ",
minimumResultsForSearch: -1
});
$("#group").select2({
ajax: {
url: "/danhmuc/nhomtailieu",
dataType: "json",
delay: 250,
processResults: function (data, params) {
params.page = params.page || 1;
return {
results: data.map(function (x) { return { id: x.Id, text: x.GroupName } }),
pagination: { more: false }
}
}
},
theme: "bootstrap4",
allowClear: true,
placeholder: "Chọn nhóm tài liệu",
minimumResultsForSearch: -1
});
$("#advancedSearch").on("click", function (e) {
var content = $("#search-input").val();
$("#search-form").trigger("reset");
$("#search-input").val(content);
$(this).toggleClass("btn-border");
$("#advanced-group").toggle();
$(this).find(".fas").toggle();
});
//danh sách
var fileList = $('#file-list').kendoListView({
dataSource: {
transport: {
read: {
url: '/danhmuc/phong/chitiet/json?fondCode=' + $('#fond-code').val(),
dataType: 'json'
}
},
pageSize: 15,
serverPaging: true,
schema: {
type: 'json',
data: function (res) { return res.items },
total: function (res) { return res.itemCount }
}
},
filterable: {
placeholder: 'Nhập từ khóa tìm kiếm'
},
template: kendo.template($("#file-template").html())
}).data('kendoListView');
$('#file-pager').kendoPager({
dataSource: fileList.dataSource,
input: true,
refresh: true,
buttonCount: 4,
messages: {
display: "Hiển thị {0}-{1} trong tổng số {2} hồ sơ",
empty: "Không có dữ liệu",
page: "Trang thứ",
of: "trong {0} trang",
first: "Trang đầu",
previous: "Trang trước",
next: "Trang sau",
last: "Trang cuối",
refresh: "Tải lại"
}
});
//Chi tiết văn bản trong hồ sơ
$('#detail-win').kendoWindow({
width: '90%',
position: { top: 0, left: '5%' },
title: 'Danh sách văn bản trong hồ sơ',
animation: {
open: { duration: 500 },
close: { duration: 500 }
},
modal: true,
visible: false,
actions: ['Pin', 'Minimize', 'Maximize', 'Close']
});
$('#detailTable').on('xhr.dt', function (e, settings, json, xhr) {
if (json['data'] && json['data'].length) $('#detail-win').data('kendoWindow').open();
});
var detailTable = $('#detailTable').DataTable({
ajax: {
url: "/sohoa/vanban",
dataType: "json",
headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }
},
language: {
url: "/js/plugin/datatables/Vietnamese.json"
},
ordering: false,
columns: [
{ data: "DocOrdinal" },
{
data: null,
render: function (data, type, row) {
var code = [];
if (row.CodeNumber) code.push(row.CodeNumber);
if (row.CodeNotation) code.push(row.CodeNotation);
return code.join("/");
}
},
{ data: "Subject" },
{
data: "IssuedDate",
render: function (data, type, row) {
return data ? moment(data).format("DD/MM/YYYY") : "";
}
},
{ data: "PageAmount" },
{ data: "SheetAmount" },
{ data: "SheetIndex" },
{
data: "UUID",
orderable: false,
render: function (data, type, row) {
return `<div class="btn-group">
<button class="btn btn-success btn-xs btn-icon preview-btn"><i class="fas fa-eye"></i></button>
<a href="/sohoa/vanban/${data}?download=true"><button class="btn btn-primary btn-xs btn-icon"><i class="fas fa-download"></i></button></a>
</div>`;
}
}
]
});
$('#file-list').on('click', '.file .card', function (e) {
var file = fileList.dataItem($(this)).toJSON();
detailTable.ajax.url(`/sohoa/vanban?fileId=${file.UUID}`).load();
});
//Xem nội dung văn bản
$("#detailTable").on("click", ".preview-btn", function (e) {
var docId = $("#detailTable").DataTable().row($(this).closest("tr")).data().UUID;
$("<div/>").kendoDialog({
width: '80%',
height: '100%',
title: 'Xem trước nội dung văn bản',
content: `<iframe class="w-100 h-100" src="/viewer/${window.encodePath(`/sohoa/vanban/${docId}`)}"></iframe>`,
modal: true,
closable: true,
buttonLayout: 'normal',
animation: {
open: { duration: 500 },
close: { duration: 500 }
},
actions: [{ text: 'Đóng lại', primary: true }],
open: function () { $('#detail-win').data('kendoWindow').close() },
close: function (e) { $('#detail-win').data('kendoWindow').open(); e.sender.destroy() }
}).data('kendoDialog').open();
});
// Context menu
$('#context-menu').kendoContextMenu({
target: '#file-list',
filter: '.file',
animation: { duration: 500 },
select: function (e) {
var file = fileList.dataItem($(e.target)).toJSON();
if ($(e.item).hasClass('info-item')) {
fileVM.set('file', file);
$('#file-detail').modal('show');
} else if ($(e.item).hasClass('list-item')) {
detailTable.ajax.url(`/sohoa/vanban?fileId=${file.UUID}`).load();
}
}
})
})
</script>