移动系统liao
2024-05-15 d7c7a6e9d05eec7b38b41b8ae39f373f650ca891
CoreCms.Net.Web.Admin/wwwroot/views/shop/store/edit.html
@@ -1,236 +1,434 @@
<script type="text/html" template lay-done="layui.data.sendParams(d);">
    <div class="layui-form coreshop-form layui-form-pane" lay-filter="LAY-app-CoreCmsStore-editForm" id="LAY-app-CoreCmsStore-editForm">
        <input type="hidden" name="id" id="id" value="{{d.params.data.id || '' }}" />
  <div
    class="layui-form coreshop-form layui-form-pane"
    lay-filter="LAY-app-CoreCmsStore-editForm"
    id="LAY-app-CoreCmsStore-editForm"
  >
    <input
      type="hidden"
      name="id"
      id="id"
      value="{{d.params.data.id || '' }}"
    />
        <div class="layui-form-item">
            <label for="storeName" class="layui-form-label layui-form-required">门店名称</label>
            <div class="layui-input-block">
                <input name="storeName" id="storeName" lay-verType="tips" lay-verify="required|verifystoreName" class="layui-input" placeholder="请输入门店名称" lay-reqText="请输入门店名称" value="{{d.params.data.storeName || '' }}" />
            </div>
        </div>
        <div class="layui-form-item">
            <label for="mobile" class="layui-form-label layui-form-required">门店电话/手机号</label>
            <div class="layui-input-block">
                <input name="mobile" id="mobile" lay-verType="tips" lay-verify="required|verifymobile" class="layui-input" placeholder="请输入门店电话/手机号" lay-reqText="请输入门店电话/手机号" value="{{d.params.data.mobile || '' }}" />
            </div>
        </div>
        <div class="layui-form-item">
            <label for="linkMan" class="layui-form-label layui-form-required">门店联系人</label>
            <div class="layui-input-block">
                <input name="linkMan" id="linkMan" lay-verType="tips" lay-verify="required|verifylinkMan" class="layui-input" placeholder="请输入门店联系人" lay-reqText="请输入门店联系人" value="{{d.params.data.linkMan || '' }}" />
            </div>
        </div>
        <div class="layui-form-item">
            <label for="logoImage" class="layui-form-label layui-form-required">门店logo</label>
            <input name="logoImage" type="hidden" id="logoImage" lay-verType="tips" lay-verify="required" class="layui-input" value="{{d.params.data.logoImage || '' }}" placeholder="请上传门店logo" lay-reqText="请上传门店logo" />
            <div class="layui-input-block">
                <div class="layui-upload">
                    <button type="button" class="layui-btn" id="upBtnlogoImage">上传图片</button>
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="viewImgBoxlogoImage" src="{{d.params.data.logoImage || layui.setter.noImagePicUrl }}">
                        <p id="viewTextBoxlogoImage"></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label for="areaId" class="layui-form-label layui-form-required">门店地区</label>
            <div class="layui-input-block layui-inline-4 address-class">
                <input type="hidden" name="areaId" value="{{d.params.data.areaId || '' }}">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="coordinate" class="layui-form-label layui-form-required">坐标位置</label>
            <div class="layui-input-block">
                <input name="coordinate" id="coordinateBox" lay-active="showMap" lay-verType="tips" value="{{d.params.data.coordinate || '' }}" lay-verify="required|verifycoordinate" class="layui-input" lay-reqText="请输入坐标位置" placeholder="请输入坐标位置" />
            </div>
        </div>
        <div class="layui-form-item">
            <label for="address" class="layui-form-label layui-form-required">门店详细地址</label>
            <div class="layui-input-block">
                <input name="address" id="addressBox" lay-verType="tips" lay-verify="required|verifyaddress" class="layui-input" value="{{d.params.data.address || '' }}" lay-reqText="请输入门店详细地址" placeholder="请输入门店详细地址" />
            </div>
        </div>
        <div class="layui-form-item" pane>
            <label for="isDefault" class="layui-form-label layui-form-required">是否默认</label>
            <div class="layui-input-block">
                <input type="checkbox" lay-filter="switch" name="isDefault" id="isDefault" {{ d.params.data.isDefault ? 'checked' : '' }} lay-skin="switch" lay-text="开启|关闭">
            </div>
        </div>
        <div class="layui-form-item text-right core-hidden">
            <input type="button" class="layui-btn" lay-submit lay-filter="LAY-app-CoreCmsStore-editForm-submit" id="LAY-app-CoreCmsStore-editForm-submit" value="确认编辑">
        </div>
    <div class="layui-form-item">
      <label for="storeName" class="layui-form-label layui-form-required"
        >门店名称</label
      >
      <div class="layui-input-block">
        <input
          name="storeName"
          id="storeName"
          lay-verType="tips"
          lay-verify="required|verifystoreName"
          class="layui-input"
          placeholder="请输入门店名称"
          lay-reqText="请输入门店名称"
          value="{{d.params.data.storeName || '' }}"
        />
      </div>
    </div>
    <div class="layui-form-item">
      <label for="mobile" class="layui-form-label layui-form-required"
        >门店电话/手机号</label
      >
      <div class="layui-input-block">
        <input
          name="mobile"
          id="mobile"
          lay-verType="tips"
          lay-verify="required|verifymobile"
          class="layui-input"
          placeholder="请输入门店电话/手机号"
          lay-reqText="请输入门店电话/手机号"
          value="{{d.params.data.mobile || '' }}"
        />
      </div>
    </div>
    <div class="layui-form-item">
      <label for="linkMan" class="layui-form-label layui-form-required"
        >门店联系人</label
      >
      <div class="layui-input-block">
        <input
          name="linkMan"
          id="linkMan"
          lay-verType="tips"
          lay-verify="required|verifylinkMan"
          class="layui-input"
          placeholder="请输入门店联系人"
          lay-reqText="请输入门店联系人"
          value="{{d.params.data.linkMan || '' }}"
        />
      </div>
    </div>
    <div class="layui-form-item">
      <label for="logoImage" class="layui-form-label layui-form-required"
        >门店logo</label
      >
      <input
        name="logoImage"
        type="hidden"
        id="logoImage"
        lay-verType="tips"
        lay-verify="required"
        class="layui-input"
        value="{{d.params.data.logoImage || '' }}"
        placeholder="请上传门店logo"
        lay-reqText="请上传门店logo"
      />
      <div class="layui-input-block">
        <div class="layui-upload">
          <button type="button" class="layui-btn" id="upBtnlogoImage">
            上传图片
          </button>
          <div class="layui-upload-list">
            <img
              class="layui-upload-img"
              id="viewImgBoxlogoImage"
              src="{{d.params.data.logoImage || layui.setter.noImagePicUrl }}"
            />
            <p id="viewTextBoxlogoImage"></p>
          </div>
        </div>
      </div>
    </div>
    <div class="layui-form-item">
      <label for="areaId" class="layui-form-label layui-form-required"
        >门店地区</label
      >
      <div class="layui-input-block layui-inline-4 address-class">
        <input
          type="hidden"
          name="areaId"
          value="{{d.params.data.areaId || '' }}"
        />
      </div>
    </div>
    <div class="layui-form-item">
      <label for="coordinate" class="layui-form-label layui-form-required"
        >坐标位置</label
      >
      <div class="layui-input-block">
        <input
          name="coordinate"
          id="coordinateBox"
          lay-active="showMap"
          lay-verType="tips"
          value="{{d.params.data.coordinate || '' }}"
          lay-verify="required|verifycoordinate"
          class="layui-input"
          lay-reqText="请输入坐标位置"
          placeholder="请输入坐标位置"
        />
      </div>
    </div>
    <div class="layui-form-item">
      <label for="address" class="layui-form-label layui-form-required"
        >门店详细地址</label
      >
      <div class="layui-input-block">
        <input
          name="address"
          id="addressBox"
          lay-verType="tips"
          lay-verify="required|verifyaddress"
          class="layui-input"
          value="{{d.params.data.address || '' }}"
          lay-reqText="请输入门店详细地址"
          placeholder="请输入门店详细地址"
        />
      </div>
    </div>
    <div class="layui-form-item" pane>
      <label for="isDefault" class="layui-form-label layui-form-required"
        >是否默认</label
      >
      <div class="layui-input-block">
        <input type="checkbox" lay-filter="switch" name="isDefault"
        id="isDefault" {{ d.params.data.isDefault ? 'checked' : '' }}
        lay-skin="switch" lay-text="开启|关闭">
      </div>
    </div>
    <div class="layui-form-item text-right core-hidden">
      <input
        type="button"
        class="layui-btn"
        lay-submit
        lay-filter="LAY-app-CoreCmsStore-editForm-submit"
        id="LAY-app-CoreCmsStore-editForm-submit"
        value="确认编辑"
      />
    </div>
  </div>
</script>
<script>
    var debug = layui.setter.debug;
    layui.data.sendParams = function (d) {
        //开启调试情况下获取接口赋值数据
        if (debug) { console.log(d.params.data); }
        layui.use(['admin', 'form', 'laydate', 'upload', 'coreHelper', 'cropperImg','util'],
            function () {
                var $ = layui.$
                    , form = layui.form
                    , admin = layui.admin
                    , laydate = layui.laydate
                    , upload = layui.upload
                    , cropperImg = layui.cropperImg
                    , util = layui.util
                    , coreHelper = layui.coreHelper;
                coreHelper.Post("Api/Tools/GetAreaCheckedList", { id: d.params.data.areaId }, function (data) {
                    if (debug) { console.log(data); } //开启调试返回数据
                    var str = "";
                    $.each(data, function (i, n) {
                        str += "<select lay-ignore name='areaId_" + (i + 1) + "' dep='" + (i + 1) + "'  class='select-address'>";
                        str += "<option value='' >请选择</option>";
                        $.each(n.list, function (h, z) {
                            if (n.hasOwnProperty('info') && n.info.id == z.id) {
                                str += "<option value='" + z.id + "' selected='selected'>" + z.name + "</option>";
                            } else {
                                str += "<option value='" + z.id + "' >" + z.name + "</option>";
                            }
                        });
                        str += "</select>";
                    });
                    $("input[name='areaId']").after(str);
                    //以上数据输出完,以下绑定事件
                    $.each(data, function (i, n) {
                        if (i < (data.length)) {
                            $("select[name='areaId_" + (i + 1) + "']").change(function () {
                                changeareaIdArea(i + 1, data.length);
                            });
                        }
                    });
  var debug = layui.setter.debug;
  layui.data.sendParams = function (d) {
    //开启调试情况下获取接口赋值数据
    if (debug) {
      console.log(d.params.data);
    }
    layui.use(
      [
        "admin",
        "form",
        "laydate",
        "upload",
        "coreHelper",
        "cropperImg",
        "util",
      ],
      function () {
        var $ = layui.$,
          form = layui.form,
          admin = layui.admin,
          laydate = layui.laydate,
          upload = layui.upload,
          cropperImg = layui.cropperImg,
          util = layui.util,
          coreHelper = layui.coreHelper;
        debugger;
        coreHelper.Post(
          "Api/Tools/GetAreaCheckedList",
          { id: d.params.data.areaId },
          function (data) {
            if (debug) {
              console.log(data);
            } //开启调试返回数据
            var str = "";
            $.each(data, function (i, n) {
              str +=
                "<select lay-ignore name='areaId_" +
                (i + 1) +
                "' dep='" +
                (i + 1) +
                "'  class='select-address'>";
              str += "<option value='' >请选择</option>";
            //   if (n.list.length>1) {
                $.each(n.list, function (h, z) {
                  if (n.hasOwnProperty("info") && n.info?.id == z.id) {
                    str +=
                      "<option value='" +
                      z.id +
                      "' selected='selected'>" +
                      z.name +
                      "</option>";
                  } else {
                    str +=
                      "<option value='" + z.id + "' >" + z.name + "</option>";
                  }
                });
            //   } else {
            //     $.each(n.thisList, function (h, z) {
            //       if (n.hasOwnProperty("info") && n.info?.id == z.id) {
            //         str +=
            //           "<option value='" +
            //           z.id +
            //           "' selected='selected'>" +
            //           z.name +
            //           "</option>";
            //       } else {
            //         str +=
            //           "<option value='" + z.id + "' >" + z.name + "</option>";
            //       }
            //     });
            //   }
              str += "</select>";
            });
            $("input[name='areaId']").after(str);
            //以上数据输出完,以下绑定事件
            $.each(data, function (i, n) {
              if (i < data.length) {
                $("select[name='areaId_" + (i + 1) + "']").change(function () {
                  changeareaIdArea(i + 1, data.length);
                });
              }
            });
          }
        );
                function changeareaIdArea(i, max_i) {
                    //清除后面节点
                    for (var x = i + 1; x <= 6; x++) {  //最多6层,足够了
                        $("select[name='areaId_" + x + "']").remove();
        function changeareaIdArea(i, max_i) {
          //清除后面节点
          for (var x = i + 1; x <= 6; x++) {
            //最多6层,足够了
            $("select[name='areaId_" + x + "']").remove();
          }
          var val = $("select[name='areaId_" + i + "']").val();
          if (val != "") {
            //取子节点数据,然后显示下一级
            coreHelper.Post(
              "Api/Tools/GetAreaChildren",
              { id: val },
              function (e) {
                if (debug) {
                  console.log(e);
                } //开启调试返回数据
                if (e.length > 0) {
                  var str = "";
                  str +=
                    "<select lay-ignore name='areaId_" +
                    (i + 1) +
                    "' dep='" +
                    (i + 1) +
                    "'  class='select-address'>";
                  str += "<option value='' >请选择</option>";
                  $.each(e, function (h, z) {
                    str +=
                      "<option value='" + z.id + "' >" + z.name + "</option>";
                  });
                  str += "</select>";
                  $("select[name='areaId_" + i + "']").after(str);
                  //以上数据输出完,以下绑定事件
                  $("select[name='areaId_" + (i + 1) + "']").change(
                    function () {
                      changeareaIdArea(i + 1, i + 2);
                    }
                    var val = $("select[name='areaId_" + i + "']").val();
                    if (val != "") {
                        //取子节点数据,然后显示下一级
                        coreHelper.Post("Api/Tools/GetAreaChildren", { id: val }, function (e) {
                            if (debug) { console.log(e); } //开启调试返回数据
                  );
                            if (e.length > 0) {
                                var str = "";
                                str += "<select lay-ignore name='areaId_" + (i + 1) + "' dep='" + (i + 1) + "'  class='select-address'>";
                                str += "<option value='' >请选择</option>";
                                $.each(e, function (h, z) {
                                    str += "<option value='" + z.id + "' >" + z.name + "</option>";
                                });
                                str += "</select>";
                                $("select[name='areaId_" + i + "']").after(str);
                                //以上数据输出完,以下绑定事件
                                $("select[name='areaId_" + (i + 1) + "']").change(function () {
                                    changeareaIdArea(i + 1, i + 2);
                                });
                                //如果有返回值,就说明省市区没有选择到最终节点
                                if (1 == 1) {
                                    $("input[name='areaId']").val("");
                                } else {
                                    $("input[name='areaId']").val($("select[name='areaId_" + i + "']").val());
                                }
                            } else {
                                $("input[name='areaId']").val($("select[name='areaId_" + i + "']").val());
                            }
                        });
                    } else {
                        if (1 == 1) {
                            $("input[name='areaId']").val("");
                        } else {
                            //第一级的元素就直接赋值为空就是了
                            if (i == 1) {
                                $("input[name='areaId']").val("");
                            } else {
                                i--;
                                $("input[name='areaId']").val($("select[name='areaId_" + i + "']").val());
                            }
                        }
                    }
                  //如果有返回值,就说明省市区没有选择到最终节点
                  if (1 == 1) {
                    $("input[name='areaId']").val("");
                  } else {
                    $("input[name='areaId']").val(
                      $("select[name='areaId_" + i + "']").val()
                    );
                  }
                } else {
                  $("input[name='areaId']").val(
                    $("select[name='areaId_" + i + "']").val()
                  );
                }
              }
            );
          } else {
            if (1 == 1) {
              $("input[name='areaId']").val("");
            } else {
              //第一级的元素就直接赋值为空就是了
              if (i == 1) {
                $("input[name='areaId']").val("");
              } else {
                i--;
                $("input[name='areaId']").val(
                  $("select[name='areaId_" + i + "']").val()
                );
              }
            }
          }
        }
                //封面图图片上传
                $('#upBtnlogoImage').click(function () {
                    cropperImg.cropImg({
                        aspectRatio: 16 / 9,
                        imgSrc: $('#viewImgBoxlogoImage').attr('src'),
                        onCrop: function (data) {
                            var loadIndex = layer.load(2);
                            coreHelper.Post("api/Tools/UploadFilesFByBase64", { base64: data }, function (res) {
                                if (0 === res.code) {
                                    $('#viewImgBoxlogoImage').attr('src', res.data.fileUrl);
                                    $("#logoImage").val(res.data.fileUrl);
                                    layer.msg(res.msg);
                                    layer.close(loadIndex);
                                } else {
                                    layer.close(loadIndex);
                                    layer.msg(res.msg, { icon: 2, anim: 6 });
                                }
                            });
                        }
                    });
                });
        //封面图图片上传
        $("#upBtnlogoImage").click(function () {
          cropperImg.cropImg({
            aspectRatio: 16 / 9,
            imgSrc: $("#viewImgBoxlogoImage").attr("src"),
            onCrop: function (data) {
              var loadIndex = layer.load(2);
              coreHelper.Post(
                "api/Tools/UploadFilesFByBase64",
                { base64: data },
                function (res) {
                  if (0 === res.code) {
                    $("#viewImgBoxlogoImage").attr("src", res.data.fileUrl);
                    $("#logoImage").val(res.data.fileUrl);
                    layer.msg(res.msg);
                    layer.close(loadIndex);
                  } else {
                    layer.close(loadIndex);
                    layer.msg(res.msg, { icon: 2, anim: 6 });
                  }
                }
              );
            },
          });
        });
                laydate.render({
                    elem: '#editTime-CoreCmsStore-createTime',
                    type: 'datetime'
                });
                laydate.render({
                    elem: '#editTime-CoreCmsStore-updateTime',
                    type: 'datetime'
                });
                form.verify({
        laydate.render({
          elem: "#editTime-CoreCmsStore-createTime",
          type: "datetime",
        });
        laydate.render({
          elem: "#editTime-CoreCmsStore-updateTime",
          type: "datetime",
        });
        form.verify({
          verifystoreName: [
            /^[\S]{0,125}$/,
            "门店名称最大只允许输入125位字符,且不能出现空格",
          ],
          verifymobile: [
            /^[\S]{0,13}$/,
            "门店电话/手机号最大只允许输入13位字符,且不能出现空格",
          ],
          verifylinkMan: [
            /^[\S]{0,32}$/,
            "门店联系人最大只允许输入32位字符,且不能出现空格",
          ],
          verifylogoImage: [
            /^[\S]{0,255}$/,
            "门店logo最大只允许输入255位字符,且不能出现空格",
          ],
          verifyaddress: [
            /^[\S]{0,200}$/,
            "门店详细地址最大只允许输入200位字符,且不能出现空格",
          ],
          verifycoordinate: [
            /^[\S]{0,50}$/,
            "坐标位置最大只允许输入50位字符,且不能出现空格",
          ],
          verifylatitude: [
            /^[\S]{0,40}$/,
            "纬度最大只允许输入40位字符,且不能出现空格",
          ],
          verifylongitude: [
            /^[\S]{0,40}$/,
            "经度最大只允许输入40位字符,且不能出现空格",
          ],
        });
                    verifystoreName: [/^[\S]{0,125}$/, '门店名称最大只允许输入125位字符,且不能出现空格'],
                    verifymobile: [/^[\S]{0,13}$/, '门店电话/手机号最大只允许输入13位字符,且不能出现空格'],
                    verifylinkMan: [/^[\S]{0,32}$/, '门店联系人最大只允许输入32位字符,且不能出现空格'],
                    verifylogoImage: [/^[\S]{0,255}$/, '门店logo最大只允许输入255位字符,且不能出现空格'],
                    verifyaddress: [/^[\S]{0,200}$/, '门店详细地址最大只允许输入200位字符,且不能出现空格'],
                    verifycoordinate: [/^[\S]{0,50}$/, '坐标位置最大只允许输入50位字符,且不能出现空格'],
                    verifylatitude: [/^[\S]{0,40}$/, '纬度最大只允许输入40位字符,且不能出现空格'],
                    verifylongitude: [/^[\S]{0,40}$/, '经度最大只允许输入40位字符,且不能出现空格'],
                });
        //处理属性 为 lay-active 的所有元素事件
        util.event("lay-active", {
          showMap: function () {
            var oldData = $("#coordinateBox").val();
            let data = {
              oldData: oldData,
              coordinateBoxIdName: "coordinateBox",
              addressBoxIdName: "addressBox",
            };
                //处理属性 为 lay-active 的所有元素事件
                util.event('lay-active', {
                    showMap: function () {
                        var oldData = $('#coordinateBox').val();
                        let data = {
                            oldData: oldData,
                            coordinateBoxIdName: 'coordinateBox',
                            addressBoxIdName: 'addressBox'
                        }
            admin.popup({
              shadeClose: false,
              title: "查看详情",
              area: ["1000px", "570px"],
              id: "LAY-popup-common-getQQMap",
              success: function (layero, index) {
                layui
                  .view(this.id)
                  .render("common/getQQMap", { data })
                  .done(function () {
                    form.render();
                  });
                // 禁止弹窗出现滚动条
                $(layero)
                  .children(".layui-layer-content")
                  .css("overflow", "visible");
              },
            });
          },
        });
                        admin.popup({ shadeClose: false,
                            title: '查看详情',
                            area: ['1000px', '570px'],
                            id: 'LAY-popup-common-getQQMap',
                            success: function (layero, index) {
                                layui.view(this.id).render('common/getQQMap', { data }).done(function () {
                                    form.render();
                                });
                                // 禁止弹窗出现滚动条
                                $(layero).children('.layui-layer-content').css('overflow', 'visible');
                            }
                        });
                    }
                });
                //重载form
                form.render(null, 'LAY-app-CoreCmsStore-editForm');
            })
    };
</script>
        //重载form
        form.render(null, "LAY-app-CoreCmsStore-editForm");
      }
    );
  };
</script>