<!文档类型 网页类型>
<网页 语言代码="中文">
    <网页头部>
        <网页信息 文档编码="UTF8" />
        <网页信息 名称="页面视图" 关联数据="视图宽度=填充视图宽度,初始缩放值=1,最大缩放值=1,用户缩放状态=假" />
        <网页信息 关联HTTP="兼容模式" 关联数据="最高IE版本" />
        <网页标题>数据表格</网页标题>
        
    </网页头部>
    <网页主体 类名="内容页面">
        <区块 类名="lay-卡片面板">
            <区块 类名="lay-卡片面板-主体">
                <表单 类名="lay-表单" 表单地址="">
                    <区块 类名="lay-表单-项目">
                        <区块 类名="lay-表单-项目 lay-内联元素">
                            <数据框标注 类名="lay-表单-标签">查询用户名</数据框标注>
                            <区块 类名="lay-输入框-内联块">
                                <数据框 数据类型="文本输入" 属性名称="用户名" 默认提示="" 类名="lay-输入框" />
                            </区块>
                        </区块>
                        <区块 类名="lay-表单-项目 lay-内联元素">
                            <数据框标注 类名="lay-表单-标签">查询手机号</数据框标注>
                            <区块 类名="lay-输入框-内联块">
                                <数据框 数据类型="文本输入" 属性名称="手机号" 默认提示="" 类名="lay-输入框" />
                            </区块>
                        </区块>
                        <区块 类名="lay-表单-项目 lay-内联元素">
                            <按钮 类名="lay-按钮" lay-提交 lay-过滤器="搜索用户">
                                <斜体文本 类名="lay-图标 lay-图标搜索"></斜体文本>
                                查询
                            </按钮>
                            <按钮 按钮类型="重置按钮" 类名="lay-按钮 lay-按钮-原始">
                                <斜体文本 类名="lay-图标 lay-图标刷新"></斜体文本>
                                重置
                            </按钮>
                        </区块>
                    </区块>
                </表单>
            </区块>
        </区块>
        <区块 类名="lay-卡片面板">
            <区块 类名="lay-卡片面板-主体">
                <表格 id="用户表格" lay-过滤器="用户表格"></表格>
                <脚本 因特网标准="text/网页标准" id="barDemo">
                    <超链接 类名="lay-按钮 lay-按钮-迷你" lay-事件="编辑">编辑</超链接>
                    <超链接 类名="lay-按钮 lay-按钮-警告 lay-按钮-迷你" lay-事件="删除">删除</超链接>
                </脚本>
            </区块>
        </区块>

    </网页主体>
    <脚本>
        新建对象 lay_表格({
    [lay_表格.配置.绑定元素]: "#用户表格",
    [lay_表格.配置.工具栏]: "默认",
    [lay_表格.配置.id]: "用户数据",
    [lay_表格.配置.分页]: 真,
    [lay_表格.配置.条数选择]: [5, 10, 15, 20, 25, 300],
    [lay_表格.配置.地址]: "http://127.0.0.1/getxxx2List", 
    [lay_表格.配置.条数]: 15, // 不设置默认15条
    [lay_表格.配置.表头]: [
        [
            {
                [lay_表格.表头配置.类型]: lay_表格.类型.复选框,
                [lay_表格.表头配置.固定]: "左侧"
            },
            {
                [lay_表格.表头配置.字段]: "ID",
                [lay_表格.表头配置.标题]: "ID",
/*                [lay_表格.表头配置.宽度]: "60",*/
                [lay_表格.表头配置.排序]: 真
            },
            {
                [lay_表格.表头配置.字段]: "datas",
                [lay_表格.表头配置.标题]: "数据",
                [lay_表格.表头配置.排序]: 真,
/*                [lay_表格.表头配置.宽度]: "90"*/
            },
            {
                [lay_表格.表头配置.标题]: "ToolBar",
                [lay_表格.表头配置.功能条]: "#barDemo",
/*                [lay_表格.表头配置.最小宽度]: "150"*/
            }
        ]
    ]
});

// 更新数据
定义函数 更新数据(数据) {
    局部变量 返回结果 = 网页访问_同步("删除接口", 真, 数据);
}
// 删除数据
定义函数 删除数据(数据) {
    局部变量 返回结果 = 网页访问_同步("删除接口", 真, 数据);
}
// 监听单元格更改
lay_表格.更改事件("用户表格", 定义函数 (obj) {
    变量 value = obj.value, //得到修改后的值
        data = obj.data, //得到所在行所有键值
        field = obj.field; //得到字段
    // 操作数据框
    如果 (取类型 value === "string") {
        value = `"${value}"`;
    }
    更新数据("账号='" + data["账号"] + "'", field + "=" + value);
});
//监听锁定操作
lay_表单.表单复选框事件("lockDemo", 定义函数 (表单复选框对象) {
    layer.tips($(表单复选框对象.elem).属性值("name") + " " + $(表单复选框对象.elem).设置或获取值() + "：" + $(表单复选框对象.elem).属性值("checked"), 表单复选框对象.othis);
    // 操作数据框
    局部变量 数据值 = $(表单复选框对象.elem).设置或获取值();
    局部变量 账号 = $(表单复选框对象.elem).属性值("name");
    $(表单复选框对象.elem).设置或获取值();
    更新数据("账号='" + 表单复选框对象.elem.名称 + "'", 表单复选框对象.elem.value + "=" + (表单复选框对象.elem.checked ? 1 : 2));
});
//监听登录操作
lay_表单.表单开关事件("sexDemo", 定义函数 (表单开关对象) {
    调试输出(表单开关对象);
    layer.tips(本对象.名称 + " " + 本对象.value + "：" + obj.elem.checked, obj.othis);
    // 操作数据框
    更新数据("账号='" + 本对象.名称 + "'", 本对象.value + "=" + (obj.elem.checked ? 1 : 2));
});
// 查询表单监听
lay_表单.表单提交事件(
    "搜索用户",
    定义函数 (表单提交对象) {
        调试输出(表单提交对象);
    },
    假
);
// 监听表格工具条事件
lay_表格.工具事件("用户表格", 定义函数 (obj) {
    //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
    变量 data = obj.data; //获得当前行数据
    变量 事件 = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
    变量 tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
    如果 (事件 === "删除") {
        调试输出("事件 === 删除", data);
        //删除
        lay_弹出层.询问框("真的删除行么", 定义函数 (index) {
            obj.del();
            lay_弹出层.关闭(index);
            //向服务端发送删除指令
            删除数据(`id='${obj.data.a1}'`);
        });
    } 否则 如果 (事件 === "编辑") {
        //编辑
        调试输出("事件 === 编辑", data);
        lay_弹出层.创建({
            [lay_弹出层.配置.类型]: lay_弹出层.类型.页面,
            [lay_弹出层.配置.标题]: "编辑数据",
            [lay_弹出层.配置.遮罩]: 0.1,
            [lay_弹出层.配置.宽高]: ["500px", "400px"],
            [lay_弹出层.配置.内容]: "@代码_编辑数据.lhtml" + "?id=" + data.a1
        });
    }
});
//触发事件
lay_表格.工具栏事件("用户表格", 定义函数 (obj) {
    调试输出(obj);
    变量 checkStatus = lay_表格.选中行(obj.config.id);
    如果 (obj.event === "添加") {
        lay_弹出层.创建({
            [lay_弹出层.配置.类型]: lay_弹出层.类型.页面,
            [lay_弹出层.配置.标题]: "新增用户",
            [lay_弹出层.配置.遮罩]: 0.1,
            [lay_弹出层.配置.宽高]: ["500px", "400px"],
            [lay_弹出层.配置.内容]: "@代码_添加数据.lhtml"
        });
    } 否则 如果 (obj.event === "删除") {
        lay_弹出层.消息框("删除");
    } 否则 如果 (obj.event === "编辑") {
        lay_弹出层.创建({
            [lay_弹出层.配置.类型]: lay_弹出层.类型.页面,
            [lay_弹出层.配置.标题]: "编辑数据",
            [lay_弹出层.配置.遮罩]: 0.1,
            [lay_弹出层.配置.宽高]: ["500px", "400px"],
            [lay_弹出层.配置.内容]: "@代码_编辑数据.lhtml"
        });
    }
});
    </脚本>
</网页>