layui-admin/admin/static/js/tab/index.js

layui.use(["index", "api", "tpl", "dialog", "laypage"], function () {
  var $ = layui.$,
    table = layui.table,
    element = layui.element,
    form = layui.form,
    admin = layui.admin,
    laypage = layui.laypage;
  var LIST_TABLE_URL = layui.api.getApiUrl("app", "list");
  var DELETE_TABLE_URL = layui.api.getApiUrl("app", "remove");
  var where = {};

  var FORM_QUERY_ID = "lay-form-submit"; // form seach ElementId

  var LIST_TABLE_ID = "listTable"; // table ElementId

  var LIST_TABLE_DATA = [
    { id: 1, name: "我的名字", remark: "我是一个备注" },
    { id: 2, name: "我的名字", remark: "我是一个备注" },
    { id: 3, name: "我的名字", remark: "我是一个备注" },
    { id: 4, name: "我的名字", remark: "我是一个备注" },
    { id: 5, name: "我的名字", remark: "我是一个备注" },
    { id: 6, name: "我的名字", remark: "我是一个备注" },
    { id: 7, name: "我的名字", remark: "我是一个备注" },
    { id: 8, name: "我的名字", remark: "我是一个备注" },
    { id: 9, name: "我的名字", remark: "我是一个备注" },
    { id: 10, name: "我的名字", remark: "我是一个备注" },

  ];
  // table field 配置
  var LIST_TABLE_COLS = [
    {
      field: "id",
      title: "id",
      align: "center",
      hide: true,
    },
    {
      field: "name",
      title: "分组名称",
      align: "center",
    },
    {
      field: "remark",
      title: "备注",
      align: "center",
    },
    {
      fixed: "right",
      title: "操作",
      width: 150,
      align: "center",
      toolbar: "#cellOperating",
    },
  ];
  init();
  // 创建
  $(".add-dialog").click(function (e) {
    e.stopPropagation();
    addDialog();
  });
  //单元格 操作列中 操作事件
  table.on(`tool(${LIST_TABLE_ID})`, function (obj) {
    var data = obj.data;
    var layEvent = obj.event;
    if (layEvent === "edit") {
      editDialog(data);
    } else if (layEvent === "delete") {
      layer.confirm("",
        {
          title: "提示",
          area: ["520px", "270px"],
          content: '<div style="margin: 50px auto;">确定删除该数据源吗？</div>',
          btnAlign: 'r',
          btn: ['取消', '确认']
        }, function (index, layero) {
          layer.close(index);
        }, function (index) {
          console.log("按钮【按钮二】的回调");
          layui.dialog.showOkMsgDialog({ msg: "该数据源存在同步任务，不能删除！" });
          return false;
        }
      );
    }
  });

  function init() {
    getTableData();
  }
  function getTableData() {
    var tableRenderOptions = {
      height: 600,
      id: LIST_TABLE_ID,
      elem: "#" + LIST_TABLE_ID,
      data: LIST_TABLE_DATA,
      even: "false",
      defaultToolbar: [],
      page: false,
      cols: [LIST_TABLE_COLS],
      where: where,
    };
    table.render(tableRenderOptions);
    laypage.render({
      elem: "pages",
      count: 100,
      layout: ["count", "prev", "page", "next", "limit", "refresh", "skip"],
      jump: function (obj) {
        console.log(obj);
      },
    });
    // admin.req({
    //   url: LIST_TABLE_URL,
    //   data: where,
    //   success: function (res) {
    //     tableRenderOptions.data = res;
    //     table.render(tableRenderOptions);
    //    console.log('success:',res);
    //   },
    //   error:function(err){
    //     console.log('error:',err);
    //     table.render(tableRenderOptions);
    //   }
    // });
  }

});