您现在的位置是：主页 > news > 广州天河网站建设/产品线上推广方式都有哪些
广州天河网站建设/产品线上推广方式都有哪些
admin2025/6/8 13:59:43【news】
简介广州天河网站建设,产品线上推广方式都有哪些,公众号下载wordpress,网站建设与网页设计入门此篇文章为项目代码，中间有包含未知引用的类不会提供，这里只是告诉大家asp.net 使用Layui显示后台数据的基本流程， 特别说明: 可以按照这个思路达到asp.net 使用layui显示后台数据的目的1 下载Layui，并放在web 项目中 1 官网下载…
广州天河网站建设,产品线上推广方式都有哪些,公众号下载wordpress,网站建设与网页设计入门此篇文章为项目代码，中间有包含未知引用的类不会提供，这里只是告诉大家asp.net 使用Layui显示后台数据的基本流程， 特别说明: 可以按照这个思路达到asp.net 使用layui显示后台数据的目的1 下载Layui，并放在web 项目中
1 官网下载…
此篇文章为项目代码，中间有包含未知引用的类不会提供，这里只是告诉大家asp.net 使用Layui显示后台数据的基本流程，
特别说明: 可以按照这个思路达到asp.net 使用layui显示后台数据的目的
1 下载Layui，并放在web 项目中
1 官网下载:https://www.ilayuis.com/
2 复制库到项目中
解压后放在项目目录中
2 创建自己的Layui样式文件
body {background-color: #b200ff;
} .layui-table {color: #F8F8FB; /* 所有字体颜色 */background-color: transparent;
}/*页导航 ....颜色*/
.layui-laypage .layui-laypage-spr {color: #0f0;
}/*第几页中间输入看字体颜色*/
.layui-input {color: #f00;
}.layui-table thead tr, .layui-table-click,
.layui-table-header, .layui-table-mend,
.layui-table-patch, .layui-table-tool, .layui-table-total,
.layui-table-total tr,
.layui-table[lay-even] tr:nth-child(even) {/* background-color: #2DA80F; 绿色*/background-color: transparent;
}.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table[lay-even] tr:nth-child(even) {background-color: transparent;
}/*table 头部和行的颜色 */
.layui-table thead tr {/*background-color: #0094ff; 蓝色*/background-color: transparent;
}/*行选中后,颜色*/
/*.layui-table-hover {color: #0094ff;
}*//*到第、页 文字颜色*/
.layui-laypage .layui-laypage-skip {color: #F8F8FB;
}/*页工具栏 背景颜色*/
/*.layui-laypage {background-color: #00f;
}*//*共1条颜色*/
.layui-laypage .layui-laypage-count {color: #F8F8FB;
}/*10条每页颜色*/
input, optgroup, option, select {color: #F8F8FB;/*background-color: #ebe7e7;*/background-color: transparent;
}/*确定按钮 颜色*/
.layui-laypage-skip button {color: #F8F8FB;/*background-color: #14243C;*/background-color: transparent;
}/*第几页的 input 输入框样式*/
.layui-laypage-skip input {color: #F8F8FB;background-color: #14243C;background-color: transparent;/*background-color: transparent;*/
}/*左右箭头的颜色*/
.layui-icon {color: #F8F8FB;
}/*页码的字体颜色*/
.layui-laypage a {color: #F8F8FB;
}/*当前选中页的按钮颜色*/
.layui-laypage .layui-laypage-curr .layui-laypage-em {color: #F8F8FB; /*白色*/background-color: #0094ff; /*蓝色*/background-color: transparent;
}
2 创建WebFrom.aspx
创建一个新aspx的web界面，且使用自定义Layui样式
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DeviceManage_TypeInfo.aspx.cs" Inherits="WisRoomWebApi.SZLS.DeviceManage_TypeInfo" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>设备类型统计</title> <link href="/CSS/Echart_CSS.css" rel="stylesheet" /> <script src="/Scripts/echarts.min.js"></script><script src="/Scripts/jquery-1.7.1.min.js"></script>
</head>
<body><form id="form1" runat="server"><span id="spandate" ></span><label id="lbMsg"></label><div id="div" class="div_css"> <div id="main" style="width:400px;height:300px;" ></div></div><script type="text/javascript">$(function(){run(); //加载页面时启动定时器// closeChat();});var interval;function run() {interval = setInterval(chat, "2000");}function chat() {/*spandate 和lbMsg测试数据*/var span = document.getElementById("spandate");var now = new Date();var year = now.getFullYear();//年var month = now.getMonth() + 1;//月 (注意：月份+1)var date = now.getDate();//日var intHours = now.getHours(); //得到小时 var intMinutes = now.getMinutes(); //得到分钟var intSeconds = now.getSeconds(); //得到秒钟if (month < 10) {month = "0" + month;}if (date < 10) {date = "0" + date;}if (intHours < 10) {intHours = "0" + intHours;}if (intMinutes < 10) {intMinutes = "0" + intMinutes;}if (intSeconds < 10) {intSeconds = "0" + intSeconds;}// span.innerText = year + "-" + month + "-" + date + " " + intHours + ":" + intMinutes + ":" + intSeconds;var a = parseInt($("#Num").text()) + 10;$("#Num").text(a);testPostHandler(a); }function closeChat(){$("#closeChat").click(function(){clearTimeout(interval); //关闭定时器});}function testPostHandler(num) {$.ajax({type: 'post',url: '/Handler.ashx',async: true,//contentType: 'application/json; charset=utf-8', 注释掉，否则type不能获取data: {type: 'DeviceTypeCount', },success: function (result) {setContainer(result); },error: function () {setContainer('ERROR!');}});}function setContainer(text) {var jsonStr = jQuery.parseJSON(text);// 测试json返回的数据// document.getElementById("lbMsg").innerHTML = ('<br/>text:' + text + "");var chartDom = document.getElementById('main');var myChart = echarts.init(chartDom);var option;const names = [];const datas = [];for (var i = 0; i < jsonStr.Result; i++) {var name = jsonStr.Data[i].Name;var count = jsonStr.Data[i].Count;names.push(name);datas.push(count);}option = {//backgroundColor: '#0C0C0D',tooltip: {trigger: 'axis',axisPointer: {type: 'shadow'}},legend: {data: [ '数量'],textStyle: {color: '#F8F8FB'},},xAxis: {data: names,show: true,axisLabel: { interval: 0, rotate: 90},axisLine: {lineStyle: {color: '#F8F8FB'}}},yAxis: {splitLine: {show: false//隐藏分隔线},axisLabel: { show: false, },axisLine: {lineStyle: {color: '#F8F8FB'}},},series: [{name: 'bar',type: 'bar',barWidth: 10,itemStyle: {borderRadius: 5,color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: '#14c8d4' },{ offset: 1, color: '#43eec6' }])},data: datas,label: {show: true,position: 'top'},},]};option && myChart.setOption(option); }</script></form>
</body>
</html>3 创建Handler.ashx
aspx和handler交互可以看https://blog.csdn.net/qq_40422692/article/details/107509382
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;
using Wis.Data.Wic;
using Wis.Data.Tools;
using WisRoomWebApi.Models;
using WisRoomWebApi.Utils;
using System.Configuration;namespace WisRoomWebApi
{/// <summary>/// Handler 的摘要说明/// </summary>public class Handler : IHttpHandler{Sql2008 sql = new Sql2008(ConfigurationManager.ConnectionStrings["WEBAPI_WR_SQL"].ConnectionString.ToString());ApiData data = new ApiData();//https://blog.csdn.net/qq_40422692/article/details/107509382public void ProcessRequest(HttpContext context){ string type = context.Request.Form["type"];if (type == "SKState"){BD_ClassState bds = sql.BD_ClassStateInfo_Get(""); data.Data = bds;data.ErrorString = sql.ErrorString;data.Result = (bds == null) ? "0" : "1";}else if (type == "DeviceTypeCount"){ List<Device> devs = sql.CM_DevList_SelectAll("");List<DeviceTypeInfo> DTI = new List<DeviceTypeInfo>() { };foreach (DevType suit in Enum.GetValues(typeof(DevType))){if (suit.GetEnumDescription().StartsWith("Device")){DeviceTypeInfo d = getTypes(suit, devs);if (d.Count != 0){DTI.Add(d);}} }data.Data = DTI;data.ErrorString = sql.ErrorString;data.Result = DTI.Count + "";}else{ data.Result = "0 "+ type;} string stuJsonString = JsonConvert.SerializeObject(data);context.Response.Write(stuJsonString); }public List<DeviceTypeInfo> GetDevice(string name){List<GradeInfo> gs = sql.CM_ClassGroup_Select_AttrSQL("where Name like '%"+ name + "%'");List<Device> devs = new List<Device>() { };for (int i = 0; i < gs.Count; i++){GradeInfo g = gs[i];g.GNode = sql.CM_ClassList_Select_GID(g.GID);for(int n = 0; n < g.GNode.Count; n++){devs.AddRange(sql.CM_DevList_SelectAll(g.GNode[n].CID));}} List<DeviceTypeInfo> DTI = new List<DeviceTypeInfo>() { };foreach (DevType suit in Enum.GetValues(typeof(DevType))){if (suit.GetEnumDescription().StartsWith("Device")){DeviceTypeInfo d = getTypes(suit, devs);if (d.Count != 0){DTI.Add(d);}}} return DTI;}public DeviceTypeInfo getTypes(DevType dt, List<Device> devs){DeviceTypeInfo dti = new DeviceTypeInfo();dti.Name = dt.GetEnumDescription().Split(new char[] { ':' })[1];for(int i = 0; i < devs.Count; i++){if(devs[i].Dt == dt){dti.Count++;}}return dti;}public bool IsReusable{get{return false;}} }public class DeviceTypeInfo{public string Name = "";public int Count = 0;}
}
返回给前台的类
public class ApiData{ public object Data = null; public string Result = "";public string AppQrCodeImageString = "";public string ErrorString = "";public string ClassIsLock = "0"; public string SystemTime{get { return DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"); }}}
4 使用注意
通过这个方法获取数据
type: ‘DeviceTypeCount’, 在handler.ashx根据 “DeviceTypeCount” 获取对应数据
function testPostHandler(num) {$.ajax({type: 'post',url: '/Handler.ashx',async: true,//contentType: 'application/json; charset=utf-8', 注释掉，否则type不能获取data: {type: 'DeviceTypeCount', },success: function (result) { setContainer(result); },error: function () {setContainer('ERROR!');}});}
5 效果
