From 9d878bc8c45d2fac7e1ab44b768f6b4f1cdf8b2d Mon Sep 17 00:00:00 2001
From: Administrator <15274802129@163.com>
Date: Wed, 30 Apr 2025 14:02:47 +0800
Subject: [PATCH] feat(mall): 新增社交圈功能
---
src/main/resources/templates/febs/views/modules/leader/leaderUpdate.html | 151 ++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 122 insertions(+), 29 deletions(-)
diff --git a/src/main/resources/templates/febs/views/modules/leader/leaderUpdate.html b/src/main/resources/templates/febs/views/modules/leader/leaderUpdate.html
index 3286716..b7c033b 100644
--- a/src/main/resources/templates/febs/views/modules/leader/leaderUpdate.html
+++ b/src/main/resources/templates/febs/views/modules/leader/leaderUpdate.html
@@ -18,6 +18,10 @@
#febs-leader-update img{
max-width:200px
}
+ .map{
+ width: 50%;
+ height: 500px!important;
+ }
</style>
<div class="layui-fluid" id="febs-leader-update">
@@ -31,62 +35,75 @@
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">姓名：</label>
<div class="layui-input-block">
- <input type="text" name="name" class="layui-input" readonly>
+ <input type="text" name="name" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">手机号码：</label>
<div class="layui-input-block">
- <input type="text" name="phone" class="layui-input" readonly>
+ <input type="text" name="phone" class="layui-input">
</div>
</div>
- <div class="layui-form-item">
- <label class="layui-form-label febs-form-item-require">省：</label>
- <div class="layui-input-block">
- <input type="text" name="province" class="layui-input" readonly>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label febs-form-item-require">市：</label>
- <div class="layui-input-block">
- <input type="text" name="city" class="layui-input" readonly>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label febs-form-item-require">区：</label>
- <div class="layui-input-block">
- <input type="text" name="township" class="layui-input" readonly>
- </div>
- </div>
+<!-- <div class="layui-form-item">-->
+<!-- <label class="layui-form-label febs-form-item-require">收益率：</label>-->
+<!-- <div class="layui-input-block">-->
+<!-- <input type="text" name="bonusPercent"-->
+<!-- lay-verify="text" autocomplete="off" class="layui-input" >-->
+<!-- <div class="layui-form-mid layui-word-aux">请输入0到1之间的小数,团长收益百分比如0.15表示15%</div>-->
+<!-- </div>-->
+<!-- </div>-->
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">详细地址：</label>
<div class="layui-input-block">
- <input type="text" name="detailAddress" class="layui-input" readonly>
+ <input type="text" id="detailAddress" name="detailAddress" class="layui-input">
+ <div class="layui-form-mid layui-word-aux">地图选择后，可以继续填写楼栋单元号</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">自提点名称：</label>
<div class="layui-input-block">
- <input type="text" name="addressArea" class="layui-input" readonly>
+ <input type="text" name="addressArea" class="layui-input">
<div class="layui-form-mid layui-word-aux">小区名称(自提点名称)</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">自提点照片：</label>
<div class="layui-input-block">
- <img alt="头像" data-th-src="${leaderInfo.addressPic}" readonly>
+ <button type="button" class="layui-btn" id="imageUpload" style="background-color: #009688; margin-bottom: 2px">图片上传</button>
+ <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
+ <div class=" layui-upload-list view-images" id="addressPicImage">
+ </div>
+ </blockquote>
+ <div>
+ <input type="text" id="addressPic" name="addressPic" lay-verify="required" placeholder="" autocomplete="off" class="layui-input" readonly>
+ </div>
+ </div>
+ </div>
+ <div class="layui-form-item">
+ <label class="layui-form-label febs-form-item-require">地图选择：</label>
+ <div class="layui-input-block">
+ <div class="layui-fluid layui-anim febs-anim" id="febs-map-demo-update" lay-title="高德地图">
+ <div class="layui-row febs-container">
+ <div class="layui-card">
+ <div style="padding: .1rem;">
+ <div id="container" class="map"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="layui-form-mid layui-word-aux">自提点位置,修改团长位置，请点击地图上的具体位置，待弹出【地址】，即可保存新位置</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">经度：</label>
<div class="layui-input-block">
- <input type="text" name="longitude" class="layui-input" readonly>
+ <input type="text" id="longitude" name="longitude" class="layui-input" readonly>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label febs-form-item-require">纬度：</label>
<div class="layui-input-block">
- <input type="text" name="latitude" class="layui-input" readonly>
+ <input type="text" id="latitude" name="latitude" class="layui-input" readonly>
</div>
</div>
<div class="layui-form-item">
@@ -103,30 +120,106 @@
</div>
<script data-th-inline="javascript">
- layui.use(['febs', 'form', 'formSelects', 'treeSelect', 'eleTree'], function () {
+ layui.use(['febs', 'form', 'formSelects', 'treeSelect', 'eleTree', 'upload'], function () {
var $ = layui.$,
febs = layui.febs,
layer = layui.layer,
form = layui.form,
leaderInfo = [[${leaderInfo}]],
$view = $('#febs-leader-update'),
+ $viewMap = $('#febs-map-demo-update'),
+ upload = layui.upload,
_deptTree;
+
+ $viewMap.find('#container').css({"height": document.documentElement.clientHeight - 97 + 'px'});
+ var map = new AMap.Map("container", {
+ center: [leaderInfo.longitude, leaderInfo.latitude],
+ resizeEnable: true,
+ zoom: 16.8 //初始地图级别
+ });
+ //为地图注册click事件获取鼠标点击出的经纬度坐标
+ map.on('click', function (e) {
+ console.log(e);
+ febs.alert.success('经度：' + e.lnglat.getLng() + '，纬度：' + e.lnglat.getLat());
+ $("#longitude").val(e.lnglat.getLng());
+ $("#latitude").val(e.lnglat.getLat());
+
+ //这边是数组
+ var lnglatXY=[e.lnglat.getLng(),e.lnglat.getLat()];
+ regeocoder(lnglatXY);
+ });
+ //坐标-地址
+ function regeocoder(lnglatXY) { //逆地理编码
+ var geocoder = new AMap.Geocoder({
+ radius: 1000,
+ extensions: "all"
+ });
+ geocoder.getAddress(lnglatXY, function(status, result) {
+ if (status === 'complete' && result.info === 'OK') {
+ geocoder_CallBack(result);
+ }
+ });
+ }
+ function geocoder_CallBack(data) {
+ var address = data.regeocode.formattedAddress; //返回地址描述
+ febs.alert.success('地址：' +address);
+ document.getElementById("detailAddress").value=address;
+ }
+
+ upload.render({
+ elem: '#imageUpload'
+ ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
+ ,multiple: false
+ ,before: function(obj){
+ //预读本地文件示例，不支持ie8
+ obj.preview(function(index, file, result){
+ $('#addressPicImage').html('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" style="width: 100px">')
+ });
+ }
+ ,done: function(res){
+ $("#addressPic").val(res.data.src);
+ }
+ });
form.render();
initUserValue();
function initUserValue() {
+ var marker = new AMap.Marker({
+ position: map.getCenter(),
+ icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+ anchor:'bottom-center',
+ offset: new AMap.Pixel(0, 0)
+ });
+
+ marker.setMap(map);
+
+ // 设置鼠标划过点标记显示的文字提示
+ marker.setTitle('团长位置');
+
+ // 设置label标签
+ // label默认蓝框白底左上角显示，样式className为：amap-marker-label
+ marker.setLabel({
+ direction:'right',
+ offset: new AMap.Pixel(10, 0), //设置文本标注偏移量
+ content: "<div class='info'>团长位置</div>", //设置文本标注内容
+ });
+ //图片回显
+ if(leaderInfo.addressPic != null || leaderInfo.addressPic != ''){
+ $('#addressPicImage').append('<img src="'+ leaderInfo.addressPic +'" class="layui-upload-img" style="width: 100px">')
+ }
form.val("febs-leader-update-form", {
"id": leaderInfo.id,
"name": leaderInfo.name,
"phone": leaderInfo.phone,
"addressPic": leaderInfo.addressPic,
- "province": leaderInfo.province,
- "city": leaderInfo.city,
- "township": leaderInfo.township,
+ // "province": leaderInfo.province,
+ // "city": leaderInfo.city,
+ // "township": leaderInfo.township,
"addressArea": leaderInfo.addressArea,
"detailAddress": leaderInfo.detailAddress,
"longitude": leaderInfo.longitude,
+ // "bonusPercent": leaderInfo.bonusPercent,
"latitude": leaderInfo.latitude
});
}
--
Gitblit v1.9.1