路由
Route::get('/fangattr/index','User\FangAttrController@index')->name('user.fangattr.index');
Route::post('fangattr/upfile','User\FangAttrController@upfile')->name('user.fangattr.upfile');
Route::get('/fangattr/create','User\FangAttrController@create')->name('user.fangattr.create');
Route::post('/fangattr/store','User\FangAttrController@store')->name('user.fangattr.store');
Route::get('/fangattr/{id}/edit','User\FangAttrController@edit')->name('user.fangattr.edit');
Route::put('/fangattr/{id}','User\FangAttrController@update')->name('user.fangattr.update');
Route::delete('/fangattr/delete/{id}','User\FangAttrController@delete')->name('user.fangattr.delete');
控制器
<?php
namespace App\Http\Controllers\User;
use App\Models\Fangattr;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
class FangAttrController extends Controller {
public function index() {
$model = new Fangattr();
$data = $model->getList();
return view('user.fangattr.index', compact('data'));
}
public function create() {
$data = Fangattr::where('pid', 0)->get();
return view('user.fangattr.create', compact('data'));
}
public function upfile(Request $request) {
$pic = config('up.pic');
if ($request->hasFile('file')) {
$ret = $request->file('file')->store('', 'fangattr');
$pic = '/uploads/fangattr/' . $ret;
}
return ['status' => 0, 'url' => $pic];
}
public function store(Request $request) {
$this->validate($request, [
'name' => 'required',
]);
$postData = $request->except(['_token', 'file']);
$postData['field_name'] = !empty($postData['field_name']) ? $postData['field_name'] : '';
Fangattr::create($postData);
return redirect(route('user.fangattr.index'));
}
public function edit(Fangattr $fangattr ,$id) {
$fangattr=Fangattr::where('id',$id)->first();
$data = Fangattr::where('pid', 0)->get();
return view('user.fangattr.edit', compact('data', 'fangattr','id'));
}
public function update(Request $request, Fangattr $fangattr,$id) {
$this->validate($request, [
'name' => 'required',
]);
$postData = $request->except(['_token', 'file', '_method']);
$postData['field_name'] = !empty($postData['field_name']) ? $postData['field_name'] : '';
Fangattr::where('id',$id)->update($postData);
return redirect(route('user.fangattr.index'));
}
public function delete(Fangattr $fangattr,$id) {
Fangattr::find($id)->delete();
return ['status' => 0, 'msg' => '删除成功'];
}
}
模型
<?php
namespace App\Models;
class Fangattr extends Base
{
public function getList() {
$data = self::get()->toArray();
return $this->treeLevel($data);
}
public function getIconAttribute() {
return config('url.domain').$this->attributes['icon'];
}
}
配置上传文件的配置节点
'fangattr' => [
'driver' => 'local',
'root' => public_path('uploads/fangattr'),
],
'public' => [
'driver' => 'local',
'root' => storage_path('app/public'),
'url' => env('APP_URL').'/storage',
'visibility' => 'public',
],
列表模板
@extends('user.common.main')
@section('cnt')
<nav class="breadcrumb">
<i class="Hui-iconfont"></i> 首页
<span class="c-gray en">></span> 房源属性管理
<span class="c-gray en">></span> 房源属性列表
<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont"></i></a>
</nav>
{{-- 消息提示 --}}
@include('user.common.msg')
<div class="page-container">
<form method="get" class="text-c"> 输入想要搜索的权限名称:
<input type="text" class="input-text" style="width:250px" placeholder="节点" value="{{ request()->get('name') }}" name="name" autocomplete="off">
<button type="submit" class="btn btn-success radius"><i class="Hui-iconfont"></i> 搜节点</button>
</form>
<div class="cl pd-5 bg-1 bk-gray mt-20">
<span class="l">
<a href="/fangattr/create" class="btn btn-primary radius">
<i class="Hui-iconfont"></i> 添加房源属性
</a>
</span>
</div>
<div class="mt-20">
<table class="table table-border table-bordered table-hover table-bg table-sort">
<thead>
<tr class="text-c">
<th width="80">ID</th>
<th width="80">字段名</th>
<th width="80">上级ID</th>
<th width="100">属性名称</th>
<th width="100">图标</th>
<th width="130">加入时间</th>
<th width="100">操作</th>
</tr>
</thead>
<tbody>
@foreach($data as $item)
<tr class="text-c">
<td>{{ $item['id'] }}</td>
<td class="text-l">
{{ $item['html'] }}
{{ $item['name'] }}
</td>
<td>{{$item['pid']}}</td>
<td>{{$item['field_name']}}</td>
<td><img src="{{ $item['icon'] }}" style="width: 50px;"/></td>
<td>{{ $item['created_at'] }}</td>
<td class="td-manage">
<a href="{{ route('user.fangattr.edit',['id'=>$item['id']]) }}" class="label label-secondary radius">修改</a>
<a data-href="{{ route('user.fangattr.delete',['id'=>$item['id']]) }}" class="delbtn label label-warning radius">删除</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
@endsection
@section('js')
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="/admin/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/admin/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/admin/lib/laypage/1.2/laypage.js"></script>
<script>
$('.delbtn').click(function (evt) {
let _this = $(this);
let url = _this.attr('data-href');
layer.confirm('您真的要删除此条记录信息吗?', {
btn: ['确认删除', '考虑一下']
}, () => {
$.ajax({
url,
type: 'delete',
data: {_token: "{{csrf_token()}}"}
}).then(ret => {
layer.msg(ret.msg, {icon: 1, time: 2000}, () => {
_this.parents('tr').remove();
});
});
});
});
</script>
@endsection
添加模板
@extends('user.common.main')
@section('css')
{{-- webuploader上传样式 --}}
<link rel="stylesheet" type="text/css" href="/webuploader/webuploader.css"/>
@endsection
@section('cnt')
<nav class="breadcrumb">
<i class="Hui-iconfont"></i> 首页
<span class="c-gray en">></span> 房源属性管理
<span class="c-gray en">></span> 添加房源属性
<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont"></i></a>
</nav>
<article class="page-container">
{{-- 表单验证提示 --}}
@include('user.common.validate')
<form action="{{ route('user.fangattr.store') }}" id="form-member-add" method="post" class="form form-horizontal">
@csrf
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>是否顶级:</label>
<div class="formControls col-xs-8 col-sm-9">
<span class="select-box">
<select class="select" name="pid">
<option value="0">==顶级==</option>
@foreach($data as $item)
<option value="{{ $item->id }}">{{ $item->name }}</option>
@endforeach
</select>
</span>
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>属性名称:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" name="name"/>
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>属性图标:</label>
<div class="formControls col-xs-4 col-sm-5">
<!-- 图片上传 -->
<div id="picker">选择图标</div>
</div>
<div class="formControls col-xs-4 col-sm-4">
<input type="hidden" value="{{ config('up.pic') }}" name="icon" id="icon"/>
<img src="{{ config('up.pic') }}" id="pic" style="width: 50px;">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3">字段名称:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" name="field_name"/>
</div>
</div>
<div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
<input class="btn btn-primary radius" type="submit" value="添加属性">
</div>
</div>
</form>
</article>
@endsection
@section('js')
<!-- webuploader上传js -->
<script type="text/javascript" src="/webuploader/webuploader.js"></script>
<!-- 前端验证 --->
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script>
$("#form-member-add").validate({
rules: {
name: {
required: true
}
},
onkeyup: false,
success: "valid",
submitHandler: function (form) {
form.submit();
}
});
var uploader = WebUploader.create({
auto: true,
swf: '/webuploader/Uploader.swf',
server: '{{ route('user.fangattr.upfile') }}',
formData: {
_token: '{{csrf_token()}}'
},
fileVal: 'file',
pick: {
id: '#picker',
multiple: false
},
resize: true
});
uploader.on('uploadSuccess', function (file, ret) {
let src = ret.url;
$('#icon').val(src);
$('#pic').attr('src', src);
});
</script>
@endsection
修改模板
@extends('user.common.main')
@section('css')
{{-- webuploader上传样式 --}}
<link rel="stylesheet" type="text/css" href="/webuploader/webuploader.css"/>
@endsection
@section('cnt')
<nav class="breadcrumb">
<i class="Hui-iconfont"></i> 首页
<span class="c-gray en">></span> 房源属性管理
<span class="c-gray en">></span> 修改房源属性
<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont"></i></a>
</nav>
<article class="page-container">
{{-- 表单验证提示 --}}
@include('user.common.validate')
<form action="{{ route('user.fangattr.update',$id) }}" id="form-member-add" method="post" class="form form-horizontal">
@method('PUT')
@csrf
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>是否顶级:</label>
<div class="formControls col-xs-8 col-sm-9">
<span class="select-box">
<select class="select" name="pid">
<option value="0" @if($fangattr->pid==0) selected @endif>==顶级==</option>
@foreach($data as $item)
<option value="{{ $item->id }}" @if($fangattr->pid==$item->id) selected @endif>{{ $item->name }}</option>
@endforeach
</select>
</span>
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>属性名称:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" name="name" value="{{ $fangattr->name }}"/>
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>属性图标:</label>
<div class="formControls col-xs-4 col-sm-5">
<!-- 图片上传 -->
<div id="picker">选择图标</div>
</div>
<div class="formControls col-xs-4 col-sm-4">
<input type="hidden" value="{{ $fangattr->icon }}" name="icon" id="icon"/>
<img src="{{ $fangattr->icon }}" id="pic" style="width: 50px;">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3">字段名称:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" name="field_name" value="{{ $fangattr->field_name }}"/>
</div>
</div>
<div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
<input class="btn btn-primary radius" type="submit" value="修改属性">
</div>
</div>
</form>
</article>
@endsection
@section('js')
<!-- webuploader上传js -->
<script type="text/javascript" src="/webuploader/webuploader.js"></script>
<!-- 前端验证 --->
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script>
$("#form-member-add").validate({
rules: {
name: {
required: true
}
},
onkeyup: false,
success: "valid",
submitHandler: function (form) {
form.submit();
}
});
var uploader = WebUploader.create({
auto: true,
swf: '/webuploader/Uploader.swf',
server: '{{ route('user.fangattr.upfile') }}',
formData: {
_token: '{{csrf_token()}}'
},
fileVal: 'file',
pick: {
id: '#picker',
multiple: false
},
resize: true
});
uploader.on('uploadSuccess', function (file, ret) {
let src = ret.url;
$('#icon').val(src);
$('#pic').attr('src', src);
});
</script>
@endsection