129 lines
4.4 KiB
PHP
129 lines
4.4 KiB
PHP
@extends('admin::layouts.master')
|
|
|
|
@section('title', __('admin/order.list'))
|
|
|
|
@section('content')
|
|
<div id="customer-app" class="card">
|
|
<div class="card-body">
|
|
<div class="bg-light p-4 mb-3" id="app">
|
|
<el-form :inline="true" :model="filter" class="demo-form-inline" label-width="100px">
|
|
<div>
|
|
<el-form-item label="订单号">
|
|
<el-input v-model="filter.number" size="small" placeholder="订单号"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="客户姓名">
|
|
<el-input v-model="filter.customer_name" size="small" placeholder="客户姓名"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="邮箱">
|
|
<el-input v-model="filter.email" size="small" placeholder="邮箱"></el-input>
|
|
</el-form-item>
|
|
</div>
|
|
<el-form-item label="订单日期">
|
|
<el-form-item>
|
|
<el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" size="small"
|
|
placeholder="选择日期" v-model="filter.start" style="width: 100%;"></el-date-picker>
|
|
</el-form-item>
|
|
<span>-</span>
|
|
<el-form-item>
|
|
<el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" size="small"
|
|
placeholder="选择日期" v-model="filter.end" style="width: 100%;"></el-date-picker>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<div class="row">
|
|
<label class="wp-100"></label>
|
|
<div class="col-auto">
|
|
<button type="button" @click="search" class="btn btn-outline-primary btn-sm">筛选</button>
|
|
<button type="button" @click="exportOrder" class="btn btn-outline-primary btn-sm ms-1">导出</button>
|
|
<button type="button" @click="resetSearch" class="btn btn-outline-secondary btn-sm ms-1">重置</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>{{ __('order.id') }}</th>
|
|
<th>{{ __('order.number') }}</th>
|
|
<th>{{ __('order.customer_name') }}</th>
|
|
<th>{{ __('order.payment_method') }}</th>
|
|
<th>{{ __('order.status') }}</th>
|
|
<th>{{ __('order.total') }}</th>
|
|
<th>{{ __('order.created_at') }}</th>
|
|
<th>{{ __('order.updated_at') }}</th>
|
|
<th>{{ __('common.action') }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach ($orders as $order)
|
|
<tr>
|
|
<td>{{ $order->id }}</td>
|
|
<td>{{ $order->number }}</td>
|
|
<td>{{ sub_string($order->customer_name, 14) }}</td>
|
|
<td>{{ $order->payment_method_name }}</td>
|
|
<td>{{ $order->status_format }}</td>
|
|
<td>{{ $order->total_format }}</td>
|
|
<td>{{ $order->created_at }}</td>
|
|
<td>{{ $order->updated_at }}</td>
|
|
<td><a href="{{ admin_route('orders.show', [$order->id]) }}" class="btn btn-outline-secondary btn-sm">查看</a>
|
|
</td>
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
|
|
{{ $orders->withQueryString()->links('admin::vendor/pagination/bootstrap-4') }}
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('footer')
|
|
<script>
|
|
new Vue({
|
|
el: '#app',
|
|
data: {
|
|
url: @json(admin_route('orders.index')),
|
|
exportUrl: @json(admin_route('orders.export')),
|
|
filter: {
|
|
number: bk.getQueryString('number'),
|
|
customer_name: bk.getQueryString('customer_name'),
|
|
email: bk.getQueryString('email'),
|
|
start: bk.getQueryString('start'),
|
|
end: bk.getQueryString('end'),
|
|
},
|
|
},
|
|
|
|
computed: {
|
|
query() {
|
|
let query = '';
|
|
const filter = Object.keys(this.filter)
|
|
.filter(key => this.filter[key])
|
|
.map(key => key + '=' + this.filter[key])
|
|
.join('&');
|
|
|
|
if (filter) {
|
|
query += '?' + filter;
|
|
}
|
|
|
|
return query;
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
search() {
|
|
location = this.url + this.query
|
|
},
|
|
|
|
resetSearch() {
|
|
Object.keys(this.filter).forEach(key => this.filter[key] = '')
|
|
location = this.url + this.query
|
|
},
|
|
|
|
exportOrder() {
|
|
location = this.exportUrl + this.query
|
|
},
|
|
}
|
|
});
|
|
</script>
|
|
@endpush
|