系統(tǒng)微信小程序接口，實際上除了可以應用在微信小程序，還能應用在vue、ajax等等各種場景。
上個月就接到這樣跨平臺調用節(jié)點數據的需求，因為都是動易系統(tǒng)，所以我直接就做成標簽這樣擴展性復用性好一些，如果是vue或小程序我們可以做成組件的形式
這里我先整理出用ajax調用方法
以下是模板的調用方法
<ul id="qyinfo" class="infoList"></ul>
<div class="page"></div>
@Power.Partial("動易API信息分頁列表-圖文式", new { Domain = "要調用的站點域名", NodeIdentifier = "zyzw", Count = 20, Split = 0, TitleLength = 50, ContentLength = 200, ShowDate = true, DateFormat = "yyyy-MM-dd", HtmlID = "qyinfo", PaginationClass = "page", ShowPageCount = 9, orderBy = "Priority DESC,PublishTime DESC,ContentId DESC" })
@Power.Partial("動易API信息分頁列表", new { Domain = "要調用的站點域名", NodeIdentifier = "zyzw", Count = 20, Split = 0, TitleLength = 50, ShowDate = true, DateFormat = "yyyy-MM-dd", HtmlID = "qyinfo", PaginationClass = "page", ShowPageCount = 9, orderBy = "Priority DESC,PublishTime DESC,ContentId DESC" })
@Power.Partial("動易API信息列表", new { Domain = "要調用的站點域名", NodeIdentifier = "zyzw", Count = 6, TitleLength = 50, ShowDate = true, DateFormat = "MM-dd", HtmlID = "qyinfo", orderBy = "Priority DESC,PublishTime DESC,ContentId DESC" })這里要注意幾個問題
1、使用這些標簽前需要確保AP已開啟微信小程序接口
2、確保域名沒有跨域問題
3、這里的DateFormat只提供yyyy-MM-dd、MM-dd兩種格式
動易API信息列表.cshtml
@Power.VisualizationPartialView(new
{
Description = "動易API信息列表",
Parameters = new
{
HtmlID = new { DisplayName = "目標html元素，會往里面插入信息", Type = "String", DefaultValue = "qyinfo" },
domain = new { DisplayName = "域名", Type = "String", DefaultValue = "www.zgqingyang.gov.cn" },
nodeIdentifier = new { DisplayName = "節(jié)點標識符", Type = "String", DefaultValue = "zyzw" },
Count = new { DisplayName = "輸出信息數量", Type = "Int32", ControlType = "Integer", DefaultValue = 20 },
TitleLength = new { DisplayName = "標題長度", Type = "Int32", ControlType = "Integer", DefaultValue = 50 },
ShowDate = new { DisplayName = "是否顯示發(fā)布時間", Type = "Boolean", DefaultValue = true, ControlType = "Boolean" },
DateFormat = new { DisplayName = "發(fā)布時間日期格式", Type = "String", DefaultValue = "yyyy-MM-dd", ControlType = "ComboBox", ListItems = "{'yyyy-MM-dd':'yyyy-MM-dd（年-月-日）','MM-dd':'MM-dd（月-日）'}" },
orderBy = new { DisplayName = "排序條件", Type = "String", DefaultValue = "Priority DESC,PublishTime DESC,ContentId DESC" }
}
})
@{
string HtmlID = Param.HtmlID ?? "qyinfo";
int TitleLength = Param.TitleLength ?? 50;
string domain = Param.Domain ?? "www.gov.cn";
string nodeIdentifier = Param.NodeIdentifier ?? "zyzw";
int Count = Param.Count ?? 7;
bool ShowDate = Param.ShowDate ?? true;
string DateFormat = Param.DateFormat ?? "MM-dd";
string orderBy = Param.orderBy ?? "Priority DESC,PublishTime DESC,ContentId DESC";
}
<script>
var showdate = "@ShowDate".toLowerCase();
$(document).ready(function() {
$.ajax({
url: 'https://@domain/api/ContentManage/Article/GetList',
data: {
identifier: '@nodeIdentifier',
count: @Count,
orderBy: '@orderBy'
},
type: 'GET',
success: function (data) {
var html = "";
$.each(data, function (i, item) {
if (i >= @Count) return false;
var date = item.PublishTime;
if ('@DateFormat' == 'MM-dd') {
date = item.PublishTime.substring(5, 10);
}else if ('@DateFormat' == 'yyyy-MM-dd') {
date = item.PublishTime.substring(0, 10);
}
var title = item.Title;
if (title.length > @TitleLength) {
title = title.substring(0, @TitleLength - 1) + "…";
}
var linkUrl = item.LinkUrl && item.LinkUrl.trim() !== "" ? item.LinkUrl : item.ContentRouteUrl;
// 當 LinkUrl 不是http或https開頭時，加上域名和路徑
if (!/^https?:\/\//i.test(linkUrl)) {
linkUrl = "https://@domain/" + linkUrl;
}
html += "<li>" +
(showdate ? "<span class='date'>" + date + "</span>" : "") +
"<a href='" + linkUrl + "' title='" + item.Title + "' target='_blank'>" +
title + "</a></li>";
});
$("#" + "@HtmlID").html(html);
},
error: function (xhr, status, error) {
console.error('獲取數據失敗:', error);
}
});
});
</script>
動易API信息分頁列表.cshtml
@Power.VisualizationPartialView(new
{
Description = "動易API信息分頁列表",
Parameters = new
{
HtmlID = new { DisplayName = "目標html元素，會往里面插入信息", Type = "String", DefaultValue = "qyinfo" },
domain = new { DisplayName = "域名", Type = "String", DefaultValue = "www.zgqingyang.gov.cn" },
nodeIdentifier = new { DisplayName = "節(jié)點標識符", Type = "String", DefaultValue = "zyzw" },
Count = new { DisplayName = "輸出信息數量", Type = "Int32", ControlType = "Integer", DefaultValue = 20 },
TitleLength = new { DisplayName = "標題長度", Type = "Int32", ControlType = "Integer", DefaultValue = 50 },
ShowDate = new { DisplayName = "是否顯示發(fā)布時間", Type = "Boolean", DefaultValue = true, ControlType = "Boolean" },
DateFormat = new { DisplayName = "發(fā)布時間日期格式", Type = "String", DefaultValue = "yyyy-MM-dd", ControlType = "ComboBox", ListItems = "{'yyyy-MM-dd':'yyyy-MM-dd（年-月-日）','MM-dd':'MM-dd（月-日）'}" },
PageId = new { DisplayName = "頁碼", Type = "Int32", ControlType = "Integer", DefaultValue = 1 },
PaginationClass = new { DisplayName = "分頁控件Class", Type = "String", DefaultValue = "pagination" },
orderBy = new { DisplayName = "排序條件", Type = "String", DefaultValue = "Priority DESC,PublishTime DESC,ContentId DESC" },
ShowPageCount = new { DisplayName = "顯示的頁碼數量", Type = "Int32", ControlType = "Integer", DefaultValue = 9 },
Split = new { DisplayName = "每隔幾條信息添加分隔符", Type = "Int32", ControlType = "Integer", DefaultValue = 0 }
}
})
@{
string HtmlID = Param.HtmlID ?? "qyinfo";
int TitleLength = Param.TitleLength ?? 50;
string domain = Param.Domain ?? "www.zgqingyang.gov.cn";
string nodeIdentifier = Param.NodeIdentifier ?? "zyzw";
int Count = Param.Count ?? 20;
bool ShowDate = Param.ShowDate ?? true;
string DateFormat = Param.DateFormat ?? "MM-dd";
int PageId = Param.PageId ?? 1;
string PaginationClass = Param.PaginationClass ?? "pagination";
string orderBy = Param.orderBy ?? "Priority DESC,PublishTime DESC,ContentId DESC";
int ShowPageCount = Param.ShowPageCount ?? 9;
int Split = Param.Split ?? 0;
}
<script>
var showdate = "@ShowDate".toLowerCase();
var currentPage = @PageId;
var totalPages = 0;
$(document).ready(function() {
loadData(currentPage);
// 綁定分頁點擊事件委托
$(document).on('click', '.@PaginationClass a:not(.disabled)', function(e) {
e.preventDefault();
var page = $(this).data('page');
if (page) {
currentPage = page;
loadData(currentPage);
};
// 滾動到頂部
window.scrollTo(0, 0);
});
});
// 加載數據函數
function loadData(page) {
$.ajax({
url: 'https://@domain/api/ContentManage/Article/GetPageList',
data: {
identifier: '@nodeIdentifier',
pageId: page,
pageSize: @Count,
orderBy: '@orderBy'
},
type: 'GET',
success: function (data) {
// 處理列表數據
var html = "";
$.each(data, function (i, item) {
if (i >= @Count) return false;
var date = item.PublishTime;
if ('@DateFormat' == 'MM-dd') {
date = item.PublishTime.substring(5, 10);
}else if ('@DateFormat' == 'yyyy-MM-dd') {
date = item.PublishTime.substring(0, 10);
}
var title = item.Title;
if (title.length > @TitleLength) {
title = title.substring(0, @TitleLength - 1) + "…";
}
var linkUrl = item.LinkUrl && item.LinkUrl.trim() !== "" ? item.LinkUrl : item.ContentRouteUrl;
// 當 LinkUrl 不是http或https開頭時，加上域名和路徑
if (!/^https?:\/\//i.test(linkUrl)) {
linkUrl = "https://@domain/" + linkUrl;
}
html += "<li>" +
(showdate ? "<span class='date'>" + date + "</span>" : "") +
"<a href='" + linkUrl + "' title='" + item.Title + "' target='_blank'>" +
title + "</a></li>";
// 添加分隔符
if (@Split > 0 && (i + 1) % @Split === 0 && i < data.length - 1) {
html += "<li class=\"split\"></li>";
}
});
$("#" + "@HtmlID").html(html);
// 處理分頁
if (data.length > 0 && data[0].pageCount > 0) {
totalPages = data[0].pageCount;
var paginationHtml = createPagination(page, totalPages);
$("." + "@PaginationClass").html(paginationHtml);
}
},
error: function (xhr, status, error) {
console.error('獲取數據失敗:', error);
}
});
}
// 創(chuàng)建分頁HTML
$(document).on('click', '.@PaginationClass a:not(.disabled)', function() {
window.scrollTo(0, 0);
});
function createPagination(currentPage, totalPages) {
var html = '';
var halfCount = Math.floor(@ShowPageCount / 2);
var startPage = Math.max(1, currentPage - halfCount);
var endPage = Math.min(totalPages, startPage + @ShowPageCount - 1);
if (endPage - startPage + 1 < @ShowPageCount) {
startPage = Math.max(1, endPage - @ShowPageCount + 1);
}
// 首頁
if (currentPage == 1) {
html += '<a class="first disabled" href="nojavascript...void(0);">首頁</a> ';
} else {
html += '<a class="first" href="nojavascript...void(0);" data-page="1">首頁</a> ';
}
// 上一頁
if (currentPage == 1) {
html += '<a class="prev disabled" href="nojavascript...void(0);">上一頁</a> ';
} else {
html += '<a class="prev" href="nojavascript...void(0);" data-page="' + (currentPage - 1) + '">上一頁</a> ';
}
// 頁碼
for (var i = startPage; i <= endPage; i++) {
if (i == currentPage) {
html += '<a class="current">' + i + '</a> ';
} else {
html += '<a href="nojavascript...void(0);" data-page="' + i + '">' + i + '</a> ';
}
}
// 下一頁
if (currentPage == totalPages) {
html += '<a class="next disabled" href="nojavascript...void(0);">下一頁</a> ';
} else {
html += '<a class="next" href="nojavascript...void(0);" data-page="' + (currentPage + 1) + '">下一頁</a> ';
}
// 尾頁
if (currentPage == totalPages) {
html += '<a class="last disabled" href="nojavascript...void(0);">尾頁</a>';
} else {
html += '<a class="last" href="nojavascript...void(0);" data-page="' + totalPages + '">尾頁</a>';
}
return html;
}
</script>
動易API信息分頁列表-圖文式.cshtml
@Power.VisualizationPartialView(new
{
Description = "動易API信息分頁列表",
Parameters = new
{
HtmlID = new { DisplayName = "目標html元素，會往里面插入信息", Type = "String", DefaultValue = "qyinfo" },
domain = new { DisplayName = "域名", Type = "String", DefaultValue = "www.zgqingyang.gov.cn" },
nodeIdentifier = new { DisplayName = "節(jié)點標識符", Type = "String", DefaultValue = "zyzw" },
Count = new { DisplayName = "輸出信息數量", Type = "Int32", ControlType = "Integer", DefaultValue = 20 },
TitleLength = new { DisplayName = "標題長度", Type = "Int32", ControlType = "Integer", DefaultValue = 50 },
ContentLength = new { DisplayName = "內容長度", Type = "Int32", ControlType = "Integer", DefaultValue = 200 },
ShowDate = new { DisplayName = "是否顯示發(fā)布時間", Type = "Boolean", DefaultValue = true, ControlType = "Boolean" },
DateFormat = new { DisplayName = "發(fā)布時間日期格式", Type = "String", DefaultValue = "yyyy-MM-dd", ControlType = "ComboBox", ListItems = "{'yyyy-MM-dd':'yyyy-MM-dd（年-月-日）','MM-dd':'MM-dd（月-日）'}" },
PageId = new { DisplayName = "頁碼", Type = "Int32", ControlType = "Integer", DefaultValue = 1 },
PaginationClass = new { DisplayName = "分頁控件Class", Type = "String", DefaultValue = "pagination" },
orderBy = new { DisplayName = "排序條件", Type = "String", DefaultValue = "Priority DESC,PublishTime DESC,ContentId DESC" },
ShowPageCount = new { DisplayName = "顯示的頁碼數量", Type = "Int32", ControlType = "Integer", DefaultValue = 9 },
Split = new { DisplayName = "每隔幾條信息添加分隔符", Type = "Int32", ControlType = "Integer", DefaultValue = 0 }
}
})
@{
string HtmlID = Param.HtmlID ?? "qyinfo";
int TitleLength = Param.TitleLength ?? 50;
int ContentLength = Param.TitleLength ?? 200;
string domain = Param.Domain ?? "www.zgqingyang.gov.cn";
string nodeIdentifier = Param.NodeIdentifier ?? "zyzw";
int Count = Param.Count ?? 20;
bool ShowDate = Param.ShowDate ?? true;
string DateFormat = Param.DateFormat ?? "MM-dd";
int PageId = Param.PageId ?? 1;
string PaginationClass = Param.PaginationClass ?? "pagination";
string orderBy = Param.orderBy ?? "Priority DESC,PublishTime DESC,ContentId DESC";
int ShowPageCount = Param.ShowPageCount ?? 9;
int Split = Param.Split ?? 0;
}
<script>
var showdate = "@ShowDate".toLowerCase();
var currentPage = @PageId;
var totalPages = 0;
$(document).ready(function() {
loadData(currentPage);
// 綁定分頁點擊事件委托
$(document).on('click', '.@PaginationClass a:not(.disabled)', function(e) {
e.preventDefault();
// 獲取點擊的頁碼
var page = $(this).data('page');
if (page) {
currentPage = page;
loadData(currentPage);
};
// 滾動到頂部
window.scrollTo(0, 0);
});
});
// 加載數據函數
function loadData(page) {
$.ajax({
url: 'https://@domain/api/ContentManage/Article/GetPageList',
data: {
identifier: '@nodeIdentifier',
pageId: page,
pageSize: @Count,
orderBy: '@orderBy'
},
type: 'GET',
success: function (data) {
// 處理列表數據
var html = "";
$.each(data, function (i, item) {
if (i >= @Count) return false;
var date = item.PublishTime;
if ('@DateFormat' == 'MM-dd') {
date = item.PublishTime.substring(5, 10);
}else if ('@DateFormat' == 'yyyy-MM-dd') {
date = item.PublishTime.substring(0, 10);
}
var title = item.Title;
if (title.length > @TitleLength) {
title = title.substring(0, @TitleLength - 1) + "…";
}
var intro = item.Intro || '';
if (intro.length > @ContentLength) {
intro = intro.substring(0, @ContentLength - 1) + "…";
}
//增加圖片展示
var feaimage = item.FeaturedImage ? item.FeaturedImage : '';
if (feaimage && feaimage.indexOf("http") !== 0) {
feaimage = "https://@domain/" + feaimage;
}
if (item.FeaturedImage) {
feaimage = "<div class='pic'><img src='" + item.FeaturedImage + "' alt='" + title + "' style='max-width:360px; max-height:240px;' /></div>";
}
var linkUrl = item.LinkUrl && item.LinkUrl.trim() !== "" ? item.LinkUrl : item.ContentRouteUrl;
// 當 LinkUrl 不是http或https開頭時，加上域名和路徑
if (!/^https?:\/\//i.test(linkUrl)) {
linkUrl = "https://@domain/" + linkUrl;
}
html += "<li><div class='title'><a href='" + linkUrl + "' title='" + item.Title + "' target='_blank'>" +
title + "</a></div>" + feaimage + "<div class='con'><div class='intro'>" +
intro + "</div><div class='others'><span class='date'>" +
(showdate ? "<span class='date'>" + date + "</span>" : "") + "</span></div></li>";
// 添加分隔符
if (@Split > 0 && (i + 1) % @Split === 0 && i < data.length - 1) {
html += "<li class=\"split\"></li>";
}
});
$("#" + "@HtmlID").html(html);
// 處理分頁
if (data.length > 0 && data[0].pageCount > 0) {
totalPages = data[0].pageCount;
var paginationHtml = createPagination(page, totalPages);
$("." + "@PaginationClass").html(paginationHtml);
}
},
error: function (xhr, status, error) {
console.error('獲取數據失敗:', error);
}
});
}
// 創(chuàng)建分頁HTML
function createPagination(currentPage, totalPages) {
var html = '';
var halfCount = Math.floor(@ShowPageCount / 2);
var startPage = Math.max(1, currentPage - halfCount);
var endPage = Math.min(totalPages, startPage + @ShowPageCount - 1);
if (endPage - startPage + 1 < @ShowPageCount) {
startPage = Math.max(1, endPage - @ShowPageCount + 1);
}
// 首頁
if (currentPage == 1) {
html += '<a class="first disabled" href="nojavascript...void(0);">首頁</a> ';
} else {
html += '<a class="first" href="nojavascript...void(0);" data-page="1">首頁</a> ';
}
// 上一頁
if (currentPage == 1) {
html += '<a class="prev disabled" href="nojavascript...void(0);">上一頁</a> ';
} else {
html += '<a class="prev" href="nojavascript...void(0);" data-page="' + (currentPage - 1) + '">上一頁</a> ';
}
// 頁碼
for (var i = startPage; i <= endPage; i++) {
if (i == currentPage) {
html += '<a class="current">' + i + '</a> ';
} else {
html += '<a href="nojavascript...void(0);" data-page="' + i + '">' + i + '</a> ';
}
}
// 下一頁
if (currentPage == totalPages) {
html += '<a class="next disabled" href="nojavascript...void(0);">下一頁</a> ';
} else {
html += '<a class="next" href="nojavascript...void(0);" data-page="' + (currentPage + 1) + '">下一頁</a> ';
}
// 尾頁
if (currentPage == totalPages) {
html += '<a class="last disabled" href="nojavascript...void(0);">尾頁</a>';
} else {
html += '<a class="last" href="nojavascript...void(0);" data-page="' + totalPages + '">尾頁</a>';
}
return html;
}
</script>以上是用標簽調用的方法，如非動易系統(tǒng)，把 script 中的代碼復制到頁面，把@符后面的參數替換成實際參數，即可
用戶登錄
還沒有賬號？
立即注冊