layui 同时调用多个数据

浪淘沙1年前前端422
<div class="layui-col-md6">
    <div class="layui-card">
        <div class="layui-card-header">销售展板</div>
        <div class="layui-card-body">

            <div class="layui-carousel layadmin-carousel layadmin-backlog">
                <div>
                    <ul class="layui-row layui-col-space10">
                        <li class="layui-col-xs6">
                            <a lay-href="app/content/comment.html" class="layadmin-backlog-body" lay-title="学校总数">
                                <h3>学校总数</h3>
                                <p><cite id="SchoolZs"></cite></p>
                            </a>
                        </li>
                        <li class="layui-col-xs6">
                            <a lay-href="app/forum/list.html" class="layadmin-backlog-body" lay-title="项目总数">
                                <h3>项目总数</h3>
                                <p><cite id="XmZs"></cite></p>
                            </a>
                        </li>
                        <li class="layui-col-xs6">
                            <a lay-href="template/goodslist.html" class="layadmin-backlog-body" lay-title="收款统计">
                                <h3>收款统计</h3>
                                <p><cite id="PayZs"></cite></p>
                            </a>
                        </li>
                        <li class="layui-col-xs6">
                            <a href="javascript:;" onclick="layer.tips('不跳转', this, {tips: 3});" class="layadmin-backlog-body" lay-title="退款统计">
                                <h3>退款统计</h3>
                                <p><cite id="TkZs"></cite></p>
                            </a>
                        </li>
                    </ul>

                </div>
            </div>
        </div>
    </div>
</div>


<script>
    layui.config({
        base: '/layui/' // 静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use('index',

        function () {
            var $ = layui.jquery;
            //学校总数
            $.ajax({
                url: '/api/pay/ReadSchoolZs',
                type: "POST",
                contentType: 'application/json', // 设置请求头中的 Content-Type 为 application/json
                success: function (response) {
                    var data = response.data;

                    if (response.statusCode == 200) {
                       // console.log("学校:" + data);

                        $("#SchoolZs").html(data);
                    }

                    getXmzs();
                }
            });
            //项目总数
            function getXmzs() {
                $.ajax({
                    url: "/api/pay/ReadXmZs?roleid=@Model.loginRole&depmentid=@Model.depmentid",
                    type: "POST",
                    contentType: 'application/json', // 设置请求头中的 Content-Type 为 application/json
                    success: function (response) {
                        var data = response.data;

                        if (response.statusCode == 200) {
                            $("#XmZs").html(data);
                        }

                        getPayZs();
                    }
                });
            }
            //支付总数
            function getPayZs() {
                $.ajax({
                    url: "/api/pay/ReadPayZs?roleid=@Model.loginRole&depmentid=@Model.depmentid",
                    type: "POST",
                    contentType: 'application/json', // 设置请求头中的 Content-Type 为 application/json
                    success: function (response) {
                        var data = response.data;
                        // console.log(data.TotalAmount);
                        if (response.statusCode == 200) {
                            $("#PayZs").html(formatMoney(data.TotalAmount));
                        }

                        getPayTkZs();
                    }
                });
            }
            //退款总数
            function getPayTkZs() {
                $.ajax({
                    url: "/api/pay/ReadPayTkZs?roleid=@Model.loginRole&depmentid=@Model.depmentid",
                    type: "POST",
                    contentType: 'application/json', // 设置请求头中的 Content-Type 为 application/json
                    success: function (response) {
                        var data = response.data;

                        if (response.statusCode == 200) {
                            $("#TkZs").html(formatMoney(data.TotalAmount));
                        }


                    }
                });
            }
            //金额数字化
            function formatMoney(number, decimals = 2, locale = 'zh-CN') {
                // 确保number是一个数字
                number = Number(number).toFixed(decimals);

                // 使用Intl.NumberFormat进行格式化
                // 第二个参数是locale,用于指定地区格式(如千分位分隔符等),默认为'en-US'
                // options中的minimumFractionDigits和maximumFractionDigits控制小数点后的位数
                const formatter = new Intl.NumberFormat(locale, {
                    minimumFractionDigits: decimals,
                    maximumFractionDigits: decimals,
                    style: 'decimal'
                });

                return formatter.format(number);
            }
        });

</script>


相关文章

layui 弹出页面,并且页面保留不变,不跳回头部

 <td>【<a href="#" onclick="return false;" &nbs...

vxe-table 改变每一列颜色值

<div id="app">     <div class="table-responsi...

layui asp.net core razor集大成应用

layui asp.net core razor集大成应用

@page @model xxtsoft.Web.Entry.Pages.sysadmins.kh.kh_pjbModel @{     Lay...

asp.net core razor  CKEDITOR 添加等使用详细

asp.net core razor CKEDITOR 添加等使用详细

<script src="/ckeditor/ckeditor.js"></script>     &l...

js 获取数组的值

js 获取数组的值

一、如图,获取responseItems的值二、js获取 var responseItems=JSON.parse(res.data.retBody).responseItems;...

layui 只有点击“导出Excel”按钮时,才改变“导出Excel”按钮的状态

<form class="layui-form layui-form-pane" method="post"> &n...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。