fix: 修复安装明细日期范围筛选 #496
@ -238,6 +238,42 @@
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.installation-date-filter {
|
||||
display: flex;
|
||||
grid-column: span 2;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
min-width: 0;
|
||||
color: #595959;
|
||||
font-size: 0.75rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.installation-date-filter__label {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.installation-date-filter__range {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.installation-date-filter .upstream-data-date input {
|
||||
height: 2.1rem;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.installation-date-range-error {
|
||||
grid-column: 1 / -1;
|
||||
margin: 0;
|
||||
color: #b80000;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.installation-date-range-error[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.installation-filter-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -246,9 +282,15 @@
|
||||
|
||||
@media (max-width: 1100px) {
|
||||
.installation-filter-bar { grid-template-columns: repeat(2, minmax(14rem, 1fr)); }
|
||||
.installation-date-filter { grid-column: 1 / -1; }
|
||||
}
|
||||
@media (max-width: 650px) {
|
||||
.installation-filter-bar { grid-template-columns: minmax(0, 1fr); padding: 1rem; }
|
||||
.installation-date-filter {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.biz-card-head {
|
||||
@ -730,12 +772,15 @@
|
||||
@elseif ($descriptor)
|
||||
<div class="biz-card mt-6">
|
||||
@if ($page['slug'] === 'installation-details')
|
||||
<form method="GET" action="{{ request()->url() }}" class="installation-filter-bar" aria-label="安装明细筛选查询栏">
|
||||
@include('business.pages.partials.date-range-picker')
|
||||
<form method="GET" id="installationFilterForm" action="{{ request()->url() }}" class="installation-filter-bar" aria-label="安装明细筛选查询栏" autocomplete="off">
|
||||
@php
|
||||
$dateRangeFilters = [
|
||||
['from' => 'created_from', 'to' => 'created_to', 'label' => '创建日期:', 'aria' => '创建日期'],
|
||||
['from' => 'customer_review_from', 'to' => 'customer_review_to', 'label' => '客服审核时间:', 'aria' => '客服审核时间'],
|
||||
['from' => 'finance_review_from', 'to' => 'finance_review_to', 'label' => '财务审核时间:', 'aria' => '财务审核时间'],
|
||||
];
|
||||
$filterFields = [
|
||||
['name' => 'created_from', 'label' => '创建日期:', 'type' => 'date'], ['name' => 'created_to', 'label' => '至:', 'type' => 'date'],
|
||||
['name' => 'customer_review_from', 'label' => '客服审核时间:', 'type' => 'date'], ['name' => 'customer_review_to', 'label' => '至:', 'type' => 'date'],
|
||||
['name' => 'finance_review_from', 'label' => '财务审核时间:', 'type' => 'date'], ['name' => 'finance_review_to', 'label' => '至:', 'type' => 'date'],
|
||||
['name' => 'push_status', 'label' => '推送状态:'], ['name' => 'order_no', 'label' => '订单编号:'],
|
||||
['name' => 'customer_review', 'label' => '客服审核:', 'options' => ['0'=>'未审核','1'=>'已审核']], ['name' => 'finance_review', 'label' => '财务审核:', 'options' => ['0'=>'未审核','1'=>'已审核']],
|
||||
['name' => 'quote_status', 'label' => '报价状态:'], ['name' => 'arranged_status', 'label' => '是否安排:', 'options' => ['0'=>'未安排','1'=>'已安排']],
|
||||
@ -745,6 +790,34 @@
|
||||
['name' => 'order_type', 'label' => '订单类型:'], ['name' => 'product_id', 'label' => '商品ID:'],
|
||||
];
|
||||
@endphp
|
||||
@foreach ($dateRangeFilters as $dateRange)
|
||||
<div class="installation-date-filter">
|
||||
<span class="installation-date-filter__label">{{ $dateRange['label'] }}</span>
|
||||
<div class="upstream-data-date-range installation-date-filter__range">
|
||||
<span class="upstream-data-date" data-date-picker>
|
||||
<input id="{{ $dateRange['from'] }}" type="text" name="{{ $dateRange['from'] }}" value="{{ request($dateRange['from']) }}" readonly autocomplete="off" placeholder="开始日期" aria-label="{{ $dateRange['aria'] }}开始日期" aria-describedby="installationDateRangeError" data-date-input>
|
||||
<button type="button" class="upstream-data-date__clear" data-date-clear hidden aria-label="清除{{ $dateRange['aria'] }}开始日期">
|
||||
<span class="material-icons-outlined" aria-hidden="true">close</span>
|
||||
</button>
|
||||
<button type="button" class="upstream-data-date__pick" data-date-toggle aria-label="选择{{ $dateRange['aria'] }}开始日期">
|
||||
<span class="material-icons-outlined" aria-hidden="true">calendar_today</span>
|
||||
</button>
|
||||
<div class="upstream-data-calendar" role="dialog" aria-label="{{ $dateRange['aria'] }}开始日期日历" data-date-calendar hidden></div>
|
||||
</span>
|
||||
<b class="upstream-data-date-range__sep">至</b>
|
||||
<span class="upstream-data-date" data-date-picker>
|
||||
<input id="{{ $dateRange['to'] }}" type="text" name="{{ $dateRange['to'] }}" value="{{ request($dateRange['to']) }}" readonly autocomplete="off" placeholder="结束日期" aria-label="{{ $dateRange['aria'] }}结束日期" aria-describedby="installationDateRangeError" data-date-input>
|
||||
<button type="button" class="upstream-data-date__clear" data-date-clear hidden aria-label="清除{{ $dateRange['aria'] }}结束日期">
|
||||
<span class="material-icons-outlined" aria-hidden="true">close</span>
|
||||
</button>
|
||||
<button type="button" class="upstream-data-date__pick" data-date-toggle aria-label="选择{{ $dateRange['aria'] }}结束日期">
|
||||
<span class="material-icons-outlined" aria-hidden="true">calendar_today</span>
|
||||
</button>
|
||||
<div class="upstream-data-calendar" role="dialog" aria-label="{{ $dateRange['aria'] }}结束日期日历" data-date-calendar hidden></div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
@foreach ($filterFields as $filter)
|
||||
<label class="installation-filter-field">
|
||||
<span>{{ $filter['label'] }}</span>
|
||||
@ -755,12 +828,47 @@
|
||||
@endif
|
||||
</label>
|
||||
@endforeach
|
||||
<p id="installationDateRangeError" class="installation-date-range-error" role="alert" hidden>结束日期不能早于开始日期。</p>
|
||||
<div class="installation-filter-actions">
|
||||
<button type="submit" class="biz-btn biz-btn-primary">查询</button>
|
||||
<a href="{{ request()->url() }}" class="biz-btn biz-btn-ghost">清除</a>
|
||||
<a href="{{ route('business.installation-details.export', request()->query()) }}" class="biz-btn biz-btn-ghost">导出</a>
|
||||
</div>
|
||||
</form>
|
||||
<script>
|
||||
(function () {
|
||||
var form = document.getElementById('installationFilterForm');
|
||||
if (!form) { return; }
|
||||
|
||||
if (window.CaiWuDatePicker) {
|
||||
window.CaiWuDatePicker.setup(form);
|
||||
}
|
||||
|
||||
var error = document.getElementById('installationDateRangeError');
|
||||
var ranges = [
|
||||
['created_from', 'created_to'],
|
||||
['customer_review_from', 'customer_review_to'],
|
||||
['finance_review_from', 'finance_review_to']
|
||||
];
|
||||
|
||||
form.addEventListener('submit', function (event) {
|
||||
var invalidEnd = null;
|
||||
ranges.forEach(function (names) {
|
||||
var from = form.elements.namedItem(names[0]);
|
||||
var to = form.elements.namedItem(names[1]);
|
||||
var invalid = Boolean(from && to && from.value && to.value && from.value > to.value);
|
||||
if (from) { from.setAttribute('aria-invalid', invalid ? 'true' : 'false'); }
|
||||
if (to) { to.setAttribute('aria-invalid', invalid ? 'true' : 'false'); }
|
||||
if (invalid && !invalidEnd) { invalidEnd = to; }
|
||||
});
|
||||
error.hidden = !invalidEnd;
|
||||
if (invalidEnd) {
|
||||
event.preventDefault();
|
||||
invalidEnd.focus();
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
@endif
|
||||
<div class="biz-card-head">
|
||||
<div class="biz-card-title">
|
||||
|
||||
@ -247,6 +247,17 @@ class ManagementCrudTest extends FeatureTestCase
|
||||
->assertSeeText('订单类型:')
|
||||
->assertSeeText('商品ID:')
|
||||
->assertSeeText('导出')
|
||||
->assertSee('id="installationFilterForm"', false)
|
||||
->assertSee('name="created_from"', false)
|
||||
->assertSee('name="created_to"', false)
|
||||
->assertSee('name="customer_review_from"', false)
|
||||
->assertSee('name="customer_review_to"', false)
|
||||
->assertSee('name="finance_review_from"', false)
|
||||
->assertSee('name="finance_review_to"', false)
|
||||
->assertSee('data-date-picker', false)
|
||||
->assertSee('data-date-calendar', false)
|
||||
->assertSee("window.CaiWuDatePicker.setup(form)", false)
|
||||
->assertSee('结束日期不能早于开始日期。')
|
||||
->assertSee('installation-details-table-wrap', false)
|
||||
->assertSee('installation-details-table', false)
|
||||
->assertSee('writing-mode: horizontal-tb', false)
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user