diff --git a/src/pages_function/pages/equipmentLedger/index.vue b/src/pages_function/pages/equipmentLedger/index.vue
index c12655c..34fad8b 100644
--- a/src/pages_function/pages/equipmentLedger/index.vue
+++ b/src/pages_function/pages/equipmentLedger/index.vue
@@ -82,54 +82,28 @@
{{ t('equipmentLedger.moreFilter') }}
-
-
- {{ t('equipmentLedger.basicInfo') }}
+
+
+ {{ t('equipmentLedger.deviceBrand') }}
+
-
-
- {{ t('equipmentLedger.deviceBrand') }}
-
-
-
- {{ t('equipmentLedger.sn') }}
-
-
-
-
-
-
-
- {{ t('equipmentLedger.categoryInfo') }}
+
+ {{ t('equipmentLedger.sn') }}
+
-
-
- {{ t('equipmentLedger.deviceType') }}
-
+
+ {{ t('equipmentLedger.deviceType') }}
+
+
{{ selectedDeviceTypeLabel }}
-
-
- {{ option.name }}
-
-
-
-
-
-
-
-
- {{ t('equipmentLedger.dateFilter') }}
+
{{ t('equipmentLedger.outgoingTime') }}
@@ -155,10 +129,6 @@
:data="lineCascaderOptions" value-key="value" label-key="label" children-key="children" header-direction="row"
:options-cols="2" :auto-close="false" @confirm="onLineCascaderConfirm" />
-
-
@@ -187,7 +157,6 @@ const selectedDeviceTypeId = ref('');
const deviceBrandFilter = ref('');
const snFilter = ref('');
const outgoingTimeFilter = ref([]);
-const drawerDeviceTypePanelOpen = ref(false);
const filterPopupRef = ref(null);
const lineTree = ref([]);
const deviceTypeTree = ref([]);
@@ -195,9 +164,6 @@ const lineCascaderShow = ref(false);
const lineCascaderOpenedFromDrawer = ref(false);
const lineCascaderValue = ref([]);
const lineCascaderKey = ref(0);
-const deviceTypeCascaderShow = ref(false);
-const deviceTypeCascaderValue = ref([]);
-const deviceTypeCascaderKey = ref(0);
const list = ref([]);
const loading = ref(false);
const loadingMore = ref(false);
@@ -254,10 +220,6 @@ const selectedLineLabel = computed(() => {
return found?.name || t('equipmentLedger.lineFilter');
});
const deviceTypeOptions = computed(() => flattenLineTree(deviceTypeTree.value));
-const deviceTypeCascaderOptions = computed(() => [
- { label: t('functionCommon.all'), value: '' },
- ...normalizeLineTreeForCascader(deviceTypeTree.value),
-]);
const selectedDeviceTypeLabel = computed(() => {
if (selectedDeviceTypeId.value === '') return t('equipmentLedger.deviceType');
const found = deviceTypeOptions.value.find(
@@ -265,10 +227,19 @@ const selectedDeviceTypeLabel = computed(() => {
);
return found?.name || t('equipmentLedger.deviceType');
});
-const drawerDeviceTypeOptions = computed(() => [
- { id: '', name: t('functionCommon.all'), level: 0 },
- ...deviceTypeOptions.value,
+const drawerDeviceTypePickerOptions = computed(() => [
+ { id: '', label: t('functionCommon.all') },
+ ...deviceTypeOptions.value.map((item) => ({
+ id: item.id,
+ label: `${' '.repeat(item.level)}${item.name}`,
+ })),
]);
+const drawerDeviceTypePickerIndex = computed(() => {
+ const idx = drawerDeviceTypePickerOptions.value.findIndex(
+ (item) => String(item.id) === String(selectedDeviceTypeId.value),
+ );
+ return idx >= 0 ? idx : 0;
+});
onLoad(async () => {
activateKeywordFocus();
await initAllDict();
@@ -474,35 +445,15 @@ function closeFilterDrawer() {
}
async function confirmFilterDrawer() {
- drawerDeviceTypePanelOpen.value = false;
closeFilterDrawer();
await fetchList(true);
}
-function toggleDrawerDeviceTypePanel() {
- drawerDeviceTypePanelOpen.value = !drawerDeviceTypePanelOpen.value;
-}
-
-
-function selectDrawerDeviceType(option) {
+function onDrawerDeviceTypePickerChange(e) {
+ const idx = Number(e?.detail?.value || 0);
+ const option = drawerDeviceTypePickerOptions.value[idx];
selectedDeviceTypeId.value = option?.id === '' ? '' : String(option?.id ?? '');
- deviceTypeCascaderValue.value = selectedDeviceTypeId.value
- ? findLinePath(deviceTypeTree.value, selectedDeviceTypeId.value)
- : [];
- drawerDeviceTypePanelOpen.value = false;
-}
-
-function openDeviceTypeCascader() {
- deviceTypeCascaderShow.value = true;
-}
-
-function onDeviceTypeCascaderConfirm(values) {
- const selectedValues = Array.isArray(values) ? values : [];
- const nextValue = selectedValues[selectedValues.length - 1] ?? '';
- selectedDeviceTypeId.value = nextValue === '' ? '' : String(nextValue);
- deviceTypeCascaderValue.value =
- nextValue === '' ? [] : selectedValues.map((item) => String(item));
}
function openLineCascader(fromDrawer = false) {
@@ -519,6 +470,7 @@ function onLineCascaderConfirm(values) {
if (!lineCascaderOpenedFromDrawer.value) fetchList(true);
lineCascaderOpenedFromDrawer.value = false;
}
+
async function resetFilters() {
searchKeyword.value = '';
deviceBrandFilter.value = '';
@@ -527,14 +479,10 @@ async function resetFilters() {
selectedStatus.value = '';
selectedLineId.value = '';
selectedDeviceTypeId.value = '';
- drawerDeviceTypePanelOpen.value = false;
lineCascaderValue.value = [];
- deviceTypeCascaderValue.value = [];
lineCascaderShow.value = false;
lineCascaderOpenedFromDrawer.value = false;
- deviceTypeCascaderShow.value = false;
lineCascaderKey.value += 1;
- deviceTypeCascaderKey.value += 1;
closeFilterDrawer();
activateKeywordFocus();
await fetchList(true);
@@ -823,54 +771,56 @@ function formatDateValue(value) {
}
.drawer-section {
- // margin-top: 20rpx;
margin-bottom: 18rpx;
- padding: 28rpx 28rpx 30rpx;
+ padding: 8rpx 28rpx;
border-radius: 24rpx;
background: #ffffff;
box-sizing: border-box;
}
-.drawer-section-head {
+.drawer-fields {
display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 24rpx;
-}
-
-.drawer-section-title {
- font-size: 32rpx;
- line-height: 1.3;
- color: #1f2937;
- font-weight: 700;
-}
-
-.drawer-grid {
- display: grid;
- grid-template-columns: repeat(2, minmax(0, 1fr));
- gap: 22rpx 20rpx;
+ flex-direction: column;
}
.drawer-field {
min-width: 0;
+ min-height: 98rpx;
+ display: flex;
+ align-items: center;
+ gap: 20rpx;
+ border-bottom: 1rpx solid #eceff3;
+ box-sizing: border-box;
+}
+
+.drawer-field:last-child {
+ border-bottom: 0;
}
.drawer-field-wide {
- grid-column: 1 / -1;
+ grid-column: auto;
}
.drawer-label {
- display: block;
- margin-bottom: 12rpx;
+ width: 160rpx;
+ flex: 0 0 160rpx;
font-size: 24rpx;
line-height: 1.3;
color: #4b5563;
font-weight: 500;
}
+.drawer-picker-host {
+ min-width: 0;
+ flex: 1;
+ display: block;
+}
+
.drawer-input,
.drawer-picker,
.drawer-date {
+ min-width: 0;
+ flex: 1;
width: 100%;
min-height: 74rpx;
border: 0;
@@ -884,25 +834,26 @@ function formatDateValue(value) {
padding: 0 18rpx;
font-size: 26rpx;
color: #111827;
- text-align: center;
+ text-align: right;
}
.drawer-picker {
display: flex;
align-items: center;
- justify-content: center;
+ justify-content: flex-end;
padding: 0 18rpx;
gap: 8rpx;
}
.drawer-picker-text {
min-width: 0;
+ flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 26rpx;
color: #111827;
- text-align: center;
+ text-align: right;
}
.drawer-picker-text.placeholder {
@@ -915,46 +866,6 @@ function formatDateValue(value) {
padding: 0 12rpx;
}
-.drawer-option-panel {
- max-height: 360rpx;
- margin-top: 12rpx;
- border-radius: 12rpx;
- background: #f7f8fb;
- overflow: hidden;
-}
-
-.drawer-option-item {
- min-height: 72rpx;
- padding-right: 24rpx;
- display: flex;
- align-items: center;
- border-bottom: 1rpx solid #eceff3;
- box-sizing: border-box;
-}
-
-.drawer-option-item:last-child {
- border-bottom: 0;
-}
-
-.drawer-option-item.active {
- background: rgba(23, 75, 120, 0.1);
-}
-
-.drawer-option-item.active .drawer-option-text {
- color: #174b78;
- font-weight: 600;
-}
-
-.drawer-option-text {
- min-width: 0;
- flex: 1;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- font-size: 26rpx;
- color: #1f2937;
-}
-
.drawer-date :deep(.uni-date),
.drawer-date :deep(.uni-date-editor),
.drawer-date :deep(.uni-date-editor--x),