添加后台管理基地数据
parent
87e45da1d1
commit
363359b765
|
|
@ -59,3 +59,7 @@ VITE_PUSHER_HOST="${PUSHER_HOST}"
|
|||
VITE_PUSHER_PORT="${PUSHER_PORT}"
|
||||
VITE_PUSHER_SCHEME="${PUSHER_SCHEME}"
|
||||
VITE_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
|
||||
|
||||
AMAP_WEB_KEY=
|
||||
AMAP_JS_KEY=
|
||||
AMAP_JS_SECRET=
|
||||
|
|
|
|||
|
|
@ -0,0 +1,102 @@
|
|||
<?php
|
||||
|
||||
namespace App\Admin\Controllers;
|
||||
|
||||
use Dcat\Admin\Form;
|
||||
use Dcat\Admin\Grid;
|
||||
use Dcat\Admin\Show;
|
||||
use Dcat\Admin\Admin;
|
||||
use App\Enums\BaseType;
|
||||
use App\Models\AgriculturalBase;
|
||||
use Illuminate\Support\Facades\DB;
|
||||
use Dcat\Admin\Http\Controllers\AdminController;
|
||||
|
||||
class AgriculturalBaseController extends AdminController
|
||||
{
|
||||
/**
|
||||
* Make a grid builder.
|
||||
*
|
||||
* @return Grid
|
||||
*/
|
||||
protected function grid()
|
||||
{
|
||||
return Grid::make(new AgriculturalBase(), function (Grid $grid) {
|
||||
$grid->model()->where('type', BaseType::Base);
|
||||
// $grid->column('id')->sortable();
|
||||
$grid->column('name');
|
||||
$grid->column('person');
|
||||
$grid->column('address');
|
||||
$grid->column('address_lat');
|
||||
$grid->column('address_lng');
|
||||
// $grid->column('description');
|
||||
// $grid->column('map');
|
||||
$grid->column('areas');
|
||||
$grid->column('workforce');
|
||||
$grid->column('created_at')->sortable();
|
||||
|
||||
$grid->model()->orderBy('created_at', 'desc');
|
||||
|
||||
$grid->showCreateButton(! config('admin.permission.enable') || Admin::user()->can('dcat.admin.agricultural_bases.create'));
|
||||
$grid->showQuickEditButton(! config('admin.permission.enable') || Admin::user()->can('dcat.admin.agricultural_bases.edit'));
|
||||
$grid->showDeleteButton(! config('admin.permission.enable') || Admin::user()->can('dcat.admin.agricultural_bases.destroy'));
|
||||
|
||||
$grid->filter(function (Grid\Filter $filter) {
|
||||
$filter->like('name')->width(3);
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Make a form builder.
|
||||
*
|
||||
* @return Form
|
||||
*/
|
||||
protected function form()
|
||||
{
|
||||
return Form::make(new AgriculturalBase(), function (Form $form) {
|
||||
$model = $form->model();
|
||||
|
||||
$form->display('id');
|
||||
$form->text('name');
|
||||
$form->text('person');
|
||||
$form->number('areas');
|
||||
$form->number('workforce');
|
||||
$form->textarea('description');
|
||||
$form->amap('position')
|
||||
->key(config('amap.js.key'))
|
||||
->code(config('amap.js.secret'))
|
||||
->address(data_get($model, 'address'))
|
||||
->lng(data_get($model, 'address_lng', 105.287612))
|
||||
->lat(data_get($model, 'address_lat', 29.339476));
|
||||
|
||||
$form->hidden('address');
|
||||
$form->hidden('address_lng');
|
||||
$form->hidden('address_lat');
|
||||
|
||||
$form->hidden('type')->value(BaseType::Base->value);
|
||||
|
||||
$form->saving(function($form){
|
||||
$position = json_decode($form->position);
|
||||
|
||||
$form->address = $position->address ?? '';
|
||||
$form->address_lng = $position->lng ?? '';
|
||||
$form->address_lat = $position->lat ?? '';
|
||||
|
||||
$form->deleteInput('position');
|
||||
});
|
||||
|
||||
$form->display('created_at');
|
||||
$form->display('updated_at');
|
||||
});
|
||||
}
|
||||
|
||||
public function destroy($id)
|
||||
{
|
||||
$agriculturalBasic = AgriculturalBase::findOrFail($id);
|
||||
|
||||
$agriculturalBasic->crops()->sync([]);
|
||||
|
||||
return parent::destroy($id);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
<?php
|
||||
|
||||
namespace App\Admin\Form;
|
||||
|
||||
use Dcat\Admin\Form\Field;
|
||||
use Illuminate\Support\Arr;
|
||||
|
||||
/**
|
||||
* 高德地图地址检索
|
||||
* 1. 去开放平台(https://lbs.amap.com/)申请应用, 勾选 Web端(JS API), 得到 key 和 安全密钥
|
||||
* 2. 一个页面只允许出现一个高德地图
|
||||
*/
|
||||
class Amap extends Field
|
||||
{
|
||||
protected $variables = [
|
||||
// 高德地图应用 key
|
||||
'key' => '',
|
||||
// 高德地图应用 安全密钥
|
||||
'security_code' => '',
|
||||
'address' => '',
|
||||
'lng' => '',
|
||||
'lat' => '',
|
||||
];
|
||||
|
||||
protected $view = 'admin.form.amap';
|
||||
|
||||
protected function formatFieldData($data)
|
||||
{
|
||||
// 获取到当前字段值
|
||||
// $value = parent::formatFieldData($data);
|
||||
|
||||
$value = Arr::only($this->variables, ['address', 'lng', 'lat']);
|
||||
|
||||
return $value;
|
||||
}
|
||||
|
||||
protected function prepareInputValue($value)
|
||||
{
|
||||
return json_decode($value);
|
||||
}
|
||||
|
||||
public function config($options)
|
||||
{
|
||||
return $this->addVariables($options);
|
||||
}
|
||||
|
||||
public function key($key)
|
||||
{
|
||||
return $this->addVariables(['key' => $key]);
|
||||
}
|
||||
|
||||
public function code($code)
|
||||
{
|
||||
return $this->addVariables(['security_code' => $code]);
|
||||
}
|
||||
|
||||
public function address($address)
|
||||
{
|
||||
return $this->addVariables(['address' => $address]);
|
||||
}
|
||||
|
||||
public function lng($lng)
|
||||
{
|
||||
return $this->addVariables(['lng' => $lng]);
|
||||
}
|
||||
|
||||
public function lat($lat)
|
||||
{
|
||||
return $this->addVariables(['lat' => $lat]);
|
||||
}
|
||||
}
|
||||
|
|
@ -4,6 +4,7 @@ use Dcat\Admin\Form;
|
|||
use Dcat\Admin\Grid;
|
||||
use Dcat\Admin\Show;
|
||||
use Dcat\Admin\Admin;
|
||||
use App\Admin\Form\Amap;
|
||||
|
||||
/**
|
||||
* Dcat-admin - admin builder based on Laravel.
|
||||
|
|
@ -24,7 +25,6 @@ use Dcat\Admin\Admin;
|
|||
* Admin::js('/packages/prettydocs/js/main.js');
|
||||
*/
|
||||
Form::extend('amap', Amap::class);
|
||||
Form::extend('region', Region::class);
|
||||
|
||||
Grid::resolving(function (Grid $grid) {
|
||||
$grid->disableRowSelector();
|
||||
|
|
|
|||
|
|
@ -14,4 +14,6 @@ Route::group([
|
|||
$router->get('/', 'HomeController@index');
|
||||
|
||||
$router->resource('friend-links', 'FriendLinkController')->names('friend_links');
|
||||
|
||||
$router->resource('agricultural-bases', 'AgriculturalBaseController')->names('agricultural_bases');
|
||||
});
|
||||
|
|
|
|||
|
|
@ -5,11 +5,11 @@ namespace App\Models;
|
|||
use App\Enums\BaseType;
|
||||
use EloquentFilter\Filterable;
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
use Peidikeji\Keywords\Models\Keywords;
|
||||
use Dcat\Admin\Traits\HasDateTimeFormatter;
|
||||
|
||||
class AgriculturalBase extends Model
|
||||
{
|
||||
use Filterable;
|
||||
use Filterable, HasDateTimeFormatter;
|
||||
|
||||
protected $casts = [
|
||||
'type' => BaseType::class,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
<?php
|
||||
|
||||
return [
|
||||
// Web服务API
|
||||
'web' => [
|
||||
'key' => env('AMAP_WEB_KEY'),
|
||||
],
|
||||
// 地图 JS API
|
||||
'js' => [
|
||||
'key' => env('AMAP_JS_KEY'),
|
||||
'secret' => env('AMAP_JS_SECRET'),
|
||||
],
|
||||
];
|
||||
|
|
@ -20,8 +20,8 @@ return new class extends Migration
|
|||
$table->unsignedBigInteger('parent_id')->nullable()->default('父级');
|
||||
$table->string('person')->nullable()->comment('负责人');
|
||||
$table->string('address')->nullable()->comment('地址');
|
||||
$table->string('address_lat')->nullable()->comment('地址经度');
|
||||
$table->string('address_lng')->nullable()->comment('地址维度');
|
||||
$table->string('address_lat')->nullable()->comment('地址维度');
|
||||
$table->string('address_lng')->nullable()->comment('地址经度');
|
||||
$table->text('description')->nullable()->comment('基地描述');
|
||||
$table->string('map')->nullable()->comment('基地地图');
|
||||
$table->decimal('areas', 12, 2)->nullable()->comment('基地面积');
|
||||
|
|
|
|||
|
|
@ -503,7 +503,8 @@ namespace Dcat\Admin {
|
|||
class Show {}
|
||||
|
||||
/**
|
||||
|
||||
* @method \Amap amap(...$params)
|
||||
* @method \Region region(...$params)
|
||||
*/
|
||||
class Form {}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
<?php
|
||||
return [
|
||||
'labels' => [
|
||||
'AgriculturalBase' => '基地数据',
|
||||
'agricultural-bases' => '基地数据',
|
||||
],
|
||||
'fields' => [
|
||||
'name' => '基地名称',
|
||||
'person' => '基地负责人',
|
||||
'address' => '基地地址',
|
||||
'address_lat' => '地址维度',
|
||||
'address_lng' => '地址经度',
|
||||
'description' => '基地描述',
|
||||
'map' => '基地地图',
|
||||
'areas' => '基地面积',
|
||||
'workforce' => '职工数量',
|
||||
],
|
||||
'options' => [
|
||||
],
|
||||
];
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
<div class="form-group row">
|
||||
<div class="col-md-2 control-label">地址</div>
|
||||
<div class="col-md-8">
|
||||
<input type="text" class="form-control prevent-default" value="{{ $value['address'] }}" id="address-input" autocomplete="off" placeholder="输入地址搜索" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group row">
|
||||
<div class="col-md-2 control-label">坐标</div>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control prevent-default" value="{{ $value['lng'] }}" id="lng-input" autocomplete="off" />
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control prevent-default" value="{{ $value['lat'] }}" id="lat-input" autocomplete="off" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="hidden" name="{{ $name }}" value="{{ json_encode($value) }}" id="value-input">
|
||||
<div id="amap" style="width:100%; height: 600px;"></div>
|
||||
<script type="text/javascript">
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: '{{ $security_code }}',
|
||||
}
|
||||
</script>
|
||||
<script src="https://webapi.amap.com/loader.js"></script>
|
||||
<script>
|
||||
var value = JSON.parse('{!! json_encode($value) !!}')
|
||||
|
||||
var elements = document.getElementsByClassName('prevent-default')
|
||||
for (let i = 0; i < elements.length; i++) {
|
||||
elements[i].addEventListener('keydown', (e) => {
|
||||
// 阻止默认的回车事件
|
||||
if (e.keyCode === 13) {
|
||||
e.preventDefault()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
AMapLoader.load({
|
||||
"key": "{{ $key }}",
|
||||
"version": "2.0",
|
||||
"plugins": ["AMap.AutoComplete", "AMap.Geocoder"],
|
||||
}).then((AMap)=>{
|
||||
var lngInput = document.getElementById('lng-input')
|
||||
var latInput = document.getElementById('lat-input')
|
||||
var addressInput = document.getElementById('address-input')
|
||||
var point = (value.lng && value.lat) ? [value.lng, value.lat] : [116.397428, 39.90923]
|
||||
var pointMarker = new AMap.Marker({ position: point })
|
||||
|
||||
var map = new AMap.Map("amap", {
|
||||
zoom: 12,
|
||||
center: point
|
||||
});
|
||||
|
||||
// 添加默认标记
|
||||
map.add(pointMarker)
|
||||
|
||||
// 更新点标记
|
||||
function updatePoint(lng, lat) {
|
||||
if (pointMarker) {
|
||||
map.remove(pointMarker)
|
||||
}
|
||||
|
||||
point = [lng, lat]
|
||||
pointMarker = new AMap.Marker({ position: point })
|
||||
map.add(pointMarker)
|
||||
map.setCenter(point)
|
||||
lngInput.value = lng
|
||||
latInput.value = lat
|
||||
document.getElementById('value-input').value = JSON.stringify({ address: addressInput.value, lng, lat })
|
||||
}
|
||||
|
||||
// 输入框自动补全
|
||||
var autoComplete = new AMap.AutoComplete({ input: 'address-input' })
|
||||
autoComplete.on('select', (e) => {
|
||||
if (e.poi && e.poi.location) {
|
||||
addressInput.value = e.poi.name
|
||||
updatePoint(e.poi.location.lng, e.poi.location.lat)
|
||||
}
|
||||
})
|
||||
|
||||
// 地址解析
|
||||
var geocoder = new AMap.Geocoder()
|
||||
|
||||
// 监听地图单击事件
|
||||
map.on("click", (e) => {
|
||||
if (e.lnglat) {
|
||||
geocoder.getAddress([e.lnglat.lng, e.lnglat.lat], (status, result) => {
|
||||
if (status === 'complete' && result.regeocode) {
|
||||
addressInput.value = result.regeocode.formattedAddress
|
||||
updatePoint(e.lnglat.lng, e.lnglat.lat)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// 监听坐标, 解析出地址
|
||||
function handlePositionInput(e) {
|
||||
if (lngInput.value && latInput.value) {
|
||||
geocoder.getAddress([lngInput.value, latInput.value], (status, result) => {
|
||||
if (status === 'complete' && result.regeocode) {
|
||||
addressInput.value = result.regeocode.formattedAddress
|
||||
updatePoint(lngInput.value, latInput.value)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
lngInput.addEventListener('blur', handlePositionInput)
|
||||
latInput.addEventListener('blur', handlePositionInput)
|
||||
|
||||
}).catch((e)=>{
|
||||
if (e === '禁止多种API加载方式混用') {
|
||||
window.location.reload()
|
||||
}
|
||||
console.error(e);
|
||||
});
|
||||
|
||||
</script>
|
||||
Loading…
Reference in New Issue