generated from spatie/package-skeleton-laravel
-
Notifications
You must be signed in to change notification settings - Fork 0
Usage
Jerry edited this page Aug 4, 2023
·
4 revisions
composer require midsmr/laravel-angular
php artisan vendor:publish --tag="angular-assets"
layout.app.blade.php
<x-angular::app main-title="test">
<x-slot:title>@yield('title')</x-slot:title>
@push('styles')
<style>
.app {color: white;}
//这个push块需要自定义样式使用
</style>
@endpush
<x-slot:dropdwon>
<x-angular::dropdown
avatar="https://via.placeholder.com/100x100.png/0077dd?text=illo"
name="User">
<x-angular::dropdown-link href="javascript:logout();">
test
</x-angular::dropdown-link>
</x-angular::dropdown>
</x-slot:dropdwon>
<x-slot:aside>
<x-angular::aside>
<x-angular::router-title>导航</x-angular::router-title>
<x-angular::router-link
class="fa fa-user"
:is-active="str(url()->current())->is(route('user.dashboard').'*')"
href="{{route('user.dashboard')}}"
>首页</x-angular::router-link>
</x-angular::aside>
</x-slot:aside>
@yield('content')
<x-slot:footer>
<x-angular::footer>Copyright © 2022 Jerry</x-angular::footer>
</x-slot:footer>
@push('scripts')
<script>
console.log('layout');
//这个push块需要自定义脚本时使用
</script>
@endpush
</x-angular::app>
dashboard.blade.php
@extends('layout.app')
@section('title', '测试')
@push('styles')
<style>
.app {color: white;}
//这个push块需要自定义样式使用
</style>
@endpush
@section('content')
<x-angular::content title="test" description="ceshi">
Helloworld
</x-angular::content>
@endsection
@push('scripts')
<script>
console.log('dashboard')
</script>
@endpush
layout.auth.blade.php
<x-angular::auth :main-title="config('app.name')">
<x-slot:title>@yield('title')</x-slot:title>
<x-slot:keywords>@yield('keywords')</x-slot:keywords>
<x-slot:description>@yield('description')</x-slot:description>
<x-slot:slot>
@yield('content')
</x-slot:slot>
<x-slot:footer>
<x-angular::auth-footer>Jerry</x-angular::auth-footer>
</x-slot:footer>
@push('scripts')
<script src="{{ asset('js/axios.min.js') }}"></script>
<script src="{{ asset('js/app.js') }}"></script>
<script src="{{ asset('js/layer/layer.js') }}"></script>
@endpush
</x-angular::auth>
login.blade.php
@extends('layout.auth')
@section('title', '登录')
@section('content')
<form name="form" class="form-validation" action="{{route('auth.login')}}" method="post" app-ajax>
<div class="text-danger wrapper text-center"></div>
<div class="list-group list-group-sm">
<div class="list-group-item">
<input type="text" name="email" placeholder="Email" class="form-control no-border">
</div>
<div class="list-group-item">
<input type="password" name="password" placeholder="Password" class="form-control no-border">
</div>
</div>
<button type="submit" class="btn btn-lg btn-primary btn-block">Log in</button>
<div class="text-center m-t m-b"><a ui-sref="access.forgotpwd">Forgot password?</a></div>
<div class="line line-dashed"></div>
<p class="text-center"><small>Do not have an account?</small></p>
<a ui-sref="access.signup" class="btn btn-lg btn-default btn-block">Create an account</a>
</form>
@endsection
@push('scripts')
<script>
document.querySelector('form[app-ajax]').callback = function (response) {
if (response.data.status === 1) {
layer.msg('登录成功', {icon: 1}, function () {
window.location.href = '{{route('user.dashboard')}}'
})
} else {
layer.msg(response.data.message, {icon: 2})
}
}
</script>
@endpush
result: