jh-admin/app/shop/view/member/select_member.html

<style>
  .member-select {
    position: absolute;
    left: 400px;
    top: 175px;
  }
  .member-select-add{
    border:1px solid #ff6a00;
    padding: 5px 10px;
  }
  .layui-unselect.layui-form-radio.layui-form-radioed i:after {
    width: 0 !important;
    height: 0 !important;
  }
  .layui-table-body {
    max-height: 530px;
  }
  .inline{width: 205px;}
  .layui-btn-primary1{height: 32px; line-height: 32px; position: absolute; right: 1px; top: 1px; border-width: 0; border-left-width: 1px;}
</style>
<div class="layui-card card-common card-brief">
  <div class="layui-card-header">
    <div>
      <span class="card-title">关联会员</span>
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label"><span class="required">*</span>选择会员：</label>
    <div class="layui-input-block">
      <input type="text" name="nickname" disabled value="" lay-verify="required" autocomplete="off" class="layui-input len-long">
      <input type="hidden" name="member_id" lay-verify="required" value="">
      <button class="layui-btn layui-btn" onclick="addMember()">选择会员</button>
    </div>
    <div class="word-aux">
      <p>关联前端会员信息</p>
    </div>
  </div>
</div>
<script type="text/html" id="addMember">
  <div class="layui-form">
    <div class="layui-input-inline inline">
      <input type="text" name="member_search" placeholder="请输入会员昵称" autocomplete="off" class="layui-input ">
      <button type="button" class="layui-btn layui-btn-primary1 member-search" lay-filter="search" lay-submit>
        <i class="layui-icon"></i>
      </button>
    </div>
    <table id="member_list" lay-filter="member_list"></table>
  </div>
</script>
<script type="text/javascript">
  var form, laydate, laytpl;
  layui.use(['form', 'upload', 'util', 'laytpl'], function () {
    form = layui.form;
    laytpl = layui.laytpl;
    form.render();
  });
  let site_id = "";
  let add_Member_radioState2 = 0;
  let new_user_member_id =0;
  let nickname = '';
  function addMember() {
    let _this = this;
    var add_attr2 = $("#addMember").html();
    form.on('radio(laymemberid)', function(obj){
      new_user_member_id = obj.value;
      nickname = obj.elem.attributes.dataIndex.value;
      _this.add_Member_radioState2 = obj.value;
    });
    laytpl(add_attr2).render({}, function (html) {
      add_attr_index2 = layer.open({
        title: '选择会员',
        skin: 'layer-tips-class',
        type: 1,
        area: ['50%', '82%'],
        content: html,
        btn: ["保存", "返回"],
        yes: function () {
          $("input[name='nickname']").val(nickname);
          $("input[name='member_id']").val(new_user_member_id);
          layer.close(add_attr_index2);
        }
      });
    });
    //展示已知数据
    table = new Table({
      elem: '#member_list',
      url: ns.url("shop/member/getMemberList"),
      cols: [
        [{
          width: "12%",
          title: '会员选择',
          unresize: 'false',
          templet: function(data) {
            var html = '';
            if(data.member_id == Number(add_Member_radioState2)){
              html += `
									<div>
									<input type="radio" name="layTableRadioc" checked = true  value="${data.member_id}" dataIndex="${data.nickname}" lay-type="layTableRadio" lay-filter="laymemberid">
									</div>
								`;
            }else{
              html += `
									<div>
									<input type="radio" name="layTableRadioc" value="${data.member_id}" dataIndex="${data.nickname}" lay-type="layTableRadio" lay-filter="laymemberid">
									</div>
								`;
            }
            return html;
          }
        },{
          title: '昵称',
          width: '50%',
          unresize: 'false',
          templet: function(data) {
            var html = '';
            html += `
									<div>
									<img style="width:40px; height:40px; margin-right:20px;" layer-src src="${ns.img(data.headimg)}" onerror="this.src = '{:img('public/static/img/default_img/head.png')}' "><span>${data.nickname}</span>
									</div>
								`;
            return html;
          }
        }, {
          field: 'balance',
          title: '余额',
          unresize: 'false',
          width: '15%',
        },{
          field: 'point',
          title: '积分',
          unresize: 'false',
          width: '15%',
        },
        ]
      ],
    });
    /**
     * 搜索功能
     */
    form.on('submit(search)', function (data) {
      table.reload({
        page: {
          curr: 1
        },
        where: data.field
      });
    });

    $(document).keydown(function (event) {
      if (event.keyCode == 13) {
        $(".member-search").trigger("click");
      }
    });
  }
</script>