系统微信小程序接口,实际上除了可以应用在微信小程序,还能应用在vue、ajax等等各种场景。
上个月就接到这样跨平台调用节点数据的需求,因为都是动易系统,所以我直接就做成标签这样扩展性复用性好一些,如果是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 = "节点标识符", 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 = "是否显示发布时间", Type = "Boolean", DefaultValue = true, ControlType = "Boolean" },
DateFormat = new { DisplayName = "发布时间日期格式", 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 = "节点标识符", 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 = "是否显示发布时间", Type = "Boolean", DefaultValue = true, ControlType = "Boolean" },
DateFormat = new { DisplayName = "发布时间日期格式", 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);
}
});
}
// 创建分页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 = "节点标识符", 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 = "是否显示发布时间", Type = "Boolean", DefaultValue = true, ControlType = "Boolean" },
DateFormat = new { DisplayName = "发布时间日期格式", 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);
}
});
}
// 创建分页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>
以上是用标签调用的方法,如非动易系统,把 script 中的代码复制到页面,把@符后面的参数替换成实际参数,即可