xuan/pda-cli
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 统一列表筛选缓存高亮并精简底部Tab

Browse Source
This commit is contained in:
xuan
2026-10-08 17:59:54 +08:00
parent 30e20853df
commit b259e0c2e7
11 changed files with 704 additions and 255 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/common/list-filter.scss
+149
View File
@@ -0,0 +1,149 @@
@import '@/common/pda-typography.scss';
page { background-color: #F8F8F8; }
.filterBar { display: flex; align-items: center; padding: 16rpx 20rpx; background: #fff; gap: 16rpx; }
.filterBtn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-width: 88rpx;
min-height: 76rpx;
padding: 8rpx 10rpx;
border: 2rpx solid transparent;
border-radius: 12rpx;
box-sizing: border-box;
font-size: $pda-font-nav-sub;
line-height: 1.2;
color: #666;
background: #f5f6f8;
}
.filter-active {
color: #2979ff !important;
background: #d6e8ff !important;
border-color: #2979ff !important;
}
.filterBtn__icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.filterBtn__badge {
position: absolute;
top: -8rpx;
right: -10rpx;
width: 18rpx;
height: 18rpx;
border: 4rpx solid #fff;
border-radius: 50%;
background: #ff4d4f;
box-sizing: content-box;
}
.filterPanel {
min-height: 100%;
padding: 32rpx 28rpx;
box-sizing: border-box;
}
.filterTitle {
margin-bottom: 30rpx;
font-size: $pda-font-popup-title;
font-weight: bold;
color: #202328;
}
.filterItem { margin-bottom: 28rpx; }
.filterLabel {
display: block;
margin-bottom: 14rpx;
font-size: $pda-font-body;
line-height: 1.35;
color: #555b66;
}
.filterInput {
display: flex;
align-items: center;
min-height: $pda-row-min-height;
padding: 0 18rpx;
background: #f5f6f8;
border-radius: 8rpx;
box-sizing: border-box;
}
::v-deep .filterInput .u-input__input {
font-size: $pda-font-body !important;
color: #202328;
}
::v-deep .filterInput .u-input__input::placeholder {
font-size: $pda-font-placeholder;
color: #aeb4bf;
}
.filterValue {
display: flex;
align-items: center;
justify-content: space-between;
min-height: $pda-row-min-height;
padding: 0 18rpx;
background: #f5f6f8;
border-radius: 8rpx;
box-sizing: border-box;
font-size: $pda-font-body;
color: #202328;
}
.dateRow {
display: flex;
align-items: center;
gap: 10rpx;
}
.datePicker {
flex: 1;
min-width: 0;
}
.dateInput {
display: flex;
align-items: center;
justify-content: center;
min-height: $pda-row-min-height;
padding: 0 8rpx;
background: #f5f6f8;
border-radius: 8rpx;
box-sizing: border-box;
font-size: $pda-font-body;
color: #202328;
text-align: center;
white-space: nowrap;
}
.dateInput--placeholder {
font-size: $pda-font-placeholder;
color: #7d8490;
}
.dateSeparator {
flex-shrink: 0;
font-size: $pda-font-body;
color: #555b66;
}
.filterActions {
display: flex;
gap: 20rpx;
margin-top: 40rpx;
}
.filterActions .u-btn {
flex: 1;
height: $pda-button-height !important;
line-height: $pda-button-height !important;
padding: 0 !important;
font-size: $pda-font-button !important;
}
::v-deep .pdaSelect .u-select__header {
height: $pda-row-min-height;
}
::v-deep .pdaSelect .u-select__header__btn,
::v-deep .pdaSelect .u-select__header__title,
::v-deep .pdaSelect .u-select__body__picker-view__item {
font-size: $pda-font-popup-item !important;
}
::v-deep .pdaSelect .u-select__search__input {
font-size: $pda-font-body !important;
}
::v-deep .pdaSelect .u-select__loading,
::v-deep .pdaSelect .u-select__empty {
font-size: $pda-font-popup-sub !important;
}
src/common/listFilter.js
+49
View File
@@ -0,0 +1,49 @@
export function hasFilterValue(value) {
if (value === '' || value === null || value === undefined) return false;
if (typeof value === 'string') return value.trim() !== '';
return true;
}
export function normalizeAuditStatus(value) {
if (!hasFilterValue(value) && value !== 0) return '';
const status = Number(value);
return Number.isNaN(status) ? '' : status;
}
export function isActiveFilterState(filters) {
if (!filters) return false;
return Object.keys(filters).some((key) => {
if (/_name$/.test(key)) return false;
return hasFilterValue(filters[key]);
});
}
export function normalizeFilterState(value, defaults) {
const filters = { ...defaults };
if (!value || typeof value !== 'object' || Array.isArray(value)) return filters;
Object.keys(filters).forEach((key) => {
if (key === 'audit_status') return;
if (typeof value[key] === 'string' || typeof value[key] === 'number') {
filters[key] = value[key];
}
});
Object.keys(filters).forEach((key) => {
if (!key.endsWith('_id') || hasFilterValue(filters[key])) return;
const nameKey = `${key.slice(0, -3)}_name`;
if (nameKey in filters) filters[nameKey] = '';
});
if (Object.prototype.hasOwnProperty.call(value, 'audit_status')) {
filters.audit_status = normalizeAuditStatus(value.audit_status);
}
return filters;
}
export function withSelectedOption(list, selectedValue, selectedLabel) {
const rows = Array.isArray(list) ? list.slice() : [];
const exists = rows.some((item) => String(item.value) === String(selectedValue));
if (hasFilterValue(selectedValue) && !exists) {
rows.unshift({ value: selectedValue, label: selectedLabel || String(selectedValue) });
}
return [{ value: '', label: '全部' }].concat(rows);
}
src/common/pda-typography.scss
+19
View File
@@ -0,0 +1,19 @@
/**
* PDA 小屏字号标准（以手动进仓页为准）
* 业务页请优先引用这些变量，避免字号再次变小。
*/
$pda-font-body: 36rpx;
$pda-font-placeholder: 34rpx;
$pda-font-action: 34rpx;
$pda-font-unit: 32rpx;
$pda-font-nav-sub: 32rpx;
$pda-font-button: 36rpx;
$pda-font-popup-title: 36rpx;
$pda-font-popup-item: 36rpx;
$pda-font-popup-sub: 34rpx;
$pda-row-min-height: 100rpx;
$pda-scan-input-height: 100rpx;
$pda-button-height: 92rpx;
$pda-label-width: 200rpx;
src/components/u-select/u-select.vue
+5 -1
View File
@@ -308,7 +308,11 @@ export default {
this.setSelectValue();
},
setDefaultSelector() {
this.defaultSelector = Array(this.columnNum || 1).fill(0);
const columnNum = this.columnNum || 1;
const defaultValue = Array.isArray(this.defaultValue) ? this.defaultValue.slice() : [];
this.defaultSelector = defaultValue.length === columnNum
? defaultValue
: Array(columnNum).fill(0);
this.lastSelectIndex = this.defaultSelector.slice();
},
setColumnNum() {
src/mixins/listFilterMixin.js
+119
View File
@@ -0,0 +1,119 @@
import {
hasFilterValue,
normalizeAuditStatus,
isActiveFilterState,
normalizeFilterState,
withSelectedOption,
} from '@/common/listFilter';
export default {
data() {
return {
appliedFilters: null,
};
},
computed: {
hasActiveFilter() {
return isActiveFilterState(this.appliedFilters || this.filters);
},
filterIconColor() {
return this.hasActiveFilter ? '#2979ff' : '#666666';
},
statusSelectDefault() {
const list = this.statusSelectList || [];
const index = list.findIndex(
(item) => String(item.value) === String(this.filters && this.filters.audit_status)
);
return [index >= 0 ? index : 0];
},
unitSelectDefault() {
const selectedValue = this.getUnitSelectValue();
const index = (this.unitSelectList || []).findIndex(
(item) => String(item.value) === String(selectedValue)
);
return [index >= 0 ? index : 0];
},
},
methods: {
hasFilterValue,
getDefaultFilters() {
return typeof this.createDefaultFilters === 'function'
? this.createDefaultFilters()
: {};
},
getUnitSelectValue() {
const type = this.unitSelectType;
const filters = this.filters || {};
if (type === 'warehouse') return filters.warehouse_id;
if (type === 'delivery') return filters.delivery_unit_id;
if (type === 'business') return filters.business_unit_id;
if (type === 'supplier') return filters.supplier_id;
if (type === 'process') return filters.process_unit_id;
return filters.process_unit_id || filters.supplier_id || filters.business_unit_id || '';
},
getUnitSelectLabel() {
const type = this.unitSelectType;
const filters = this.filters || {};
if (type === 'warehouse') return filters.warehouse_name;
if (type === 'delivery') return filters.delivery_unit_name;
if (type === 'business') return filters.business_unit_name;
if (type === 'supplier') return filters.supplier_name;
if (type === 'process') return filters.process_name;
return filters.process_name || filters.supplier_name || filters.business_unit_name || '';
},
restoreFilterCache() {
const defaults = this.getDefaultFilters();
try {
const cached = this.filterStorageKey ? uni.getStorageSync(this.filterStorageKey) : null;
if (!cached || typeof cached !== 'object' || Array.isArray(cached)) {
this.filters = { ...defaults };
this.appliedFilters = { ...defaults };
this.saveFilterCache();
return;
}
const filters = normalizeFilterState(cached, defaults);
this.filters = { ...filters };
this.appliedFilters = { ...filters };
} catch (e) {
this.filters = { ...defaults };
this.appliedFilters = { ...defaults };
}
},
saveFilterCache() {
if (!this.filterStorageKey) return;
try {
uni.setStorageSync(this.filterStorageKey, { ...this.appliedFilters });
} catch (e) {
// 缓存失败不影响列表筛选
}
},
commitFilters() {
const filters = normalizeFilterState(this.filters, this.getDefaultFilters());
this.filters = { ...filters };
this.appliedFilters = { ...filters };
this.saveFilterCache();
this.loadList();
},
applySearch() {
this.commitFilters();
},
cancelFilterEdit() {
this.filters = { ...(this.appliedFilters || this.getDefaultFilters()) };
},
applyFilter() {
this.commitFilters();
this.filterShow = false;
},
resetFilter() {
this.filters = this.getDefaultFilters();
},
onStatusConfirm(e) {
this.filters.audit_status = normalizeAuditStatus((e[0] || {}).value);
},
applyUnitSelectList(list, preserveSelected = true) {
const selectedValue = preserveSelected ? this.getUnitSelectValue() : '';
const selectedLabel = preserveSelected ? this.getUnitSelectLabel() : '';
this.unitSelectList = withSelectedOption(list, selectedValue, selectedLabel);
},
},
};
src/pages.json
-12
View File
@@ -915,12 +915,6 @@
"backgroundColor": "#ffffff",
"borderStyle": "white",
"list": [
{
"pagePath": "pages/sys/msg/index",
"iconPath": "static/aidex/tabbar/msg_1.png",
"selectedIconPath": "static/aidex/tabbar/msg_2.png",
"text": "消息"
},
// {
// "pagePath": "pages/sys/home/index",
// "iconPath": "static/aidex/tabbar/home_1.png",
@@ -933,12 +927,6 @@
"selectedIconPath": "static/aidex/tabbar/apply_2.png",
"text": "工作台"
},
{
"pagePath": "pages/sys/book/index",
"iconPath": "static/aidex/tabbar/book_1.png",
"selectedIconPath": "static/aidex/tabbar/book_2.png",
"text": "通讯录"
},
{
"pagePath": "pages/sys/user/index",
"iconPath": "static/aidex/tabbar/my_1.png",
src/pages/storefabric/storeFabricBusinessOutList.vue
+203 -58
View File
@@ -1,9 +1,28 @@
<template>
<view>
<view class="filterBar">
<u-search v-model="filters.order_no" placeholder="出仓单号" :show-action="false" @search="loadList" @custom="loadList" />
<view class="filterBtn" @click="filterShow = true">
<u-icon name="list" size="40" color="#666"></u-icon>
<u-search
v-model="filters.order_no"
placeholder="出仓单号"
:show-action="false"
@search="applySearch"
@custom="applySearch"
@clear="applySearch"
/>
<view
class="filterBtn"
:class="{ 'filter-active': hasActiveFilter }"
@click="filterShow = true"
>
<view class="filterBtn__icon">
<u-icon
:key="hasActiveFilter ? 'on' : 'off'"
name="list"
size="44"
:color="hasActiveFilter ? '#2979ff' : '#666'"
></u-icon>
<view v-if="hasActiveFilter" class="filterBtn__badge"></view>
</view>
<text>筛选</text>
</view>
</view>
@@ -20,22 +39,34 @@
<addBtn url="./storeFabricBusinessOutAdd"></addBtn>
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true">
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true" @close="cancelFilterEdit">
<view class="filterPanel">
<view class="filterTitle">筛选条件</view>
<view class="filterItem">
<text class="filterLabel">出仓单号</text>
<u-input v-model="filters.order_no" placeholder="请输入出仓单号" />
<view class="filterInput">
<u-input
v-model="filters.order_no"
placeholder="请输入出仓单号"
:height="100"
:custom-style="{ fontSize: '36rpx', color: '#202328' }"
placeholder-style="color: #aeb4bf; font-size: 34rpx;"
/>
</view>
</view>
<view class="filterItem">
<text class="filterLabel">出仓日期</text>
<view class="dateRow">
<picker mode="date" :value="filters.start_date" @change="e => filters.start_date = e.detail.value">
<view class="dateInput">{{ filters.start_date || '开始日期' }}</view>
<picker class="datePicker" mode="date" :value="filters.start_date" @change="e => filters.start_date = e.detail.value">
<view class="dateInput" :class="{ 'dateInput--placeholder': !filters.start_date }">
{{ filters.start_date || '开始日期' }}
</view>
</picker>
<text>~</text>
<picker mode="date" :value="filters.end_date" @change="e => filters.end_date = e.detail.value">
<view class="dateInput">{{ filters.end_date || '结束日期' }}</view>
<text class="dateSeparator">~</text>
<picker class="datePicker" mode="date" :value="filters.end_date" @change="e => filters.end_date = e.detail.value">
<view class="dateInput" :class="{ 'dateInput--placeholder': !filters.end_date }">
{{ filters.end_date || '结束日期' }}
</view>
</picker>
</view>
</view>
@@ -45,11 +76,11 @@
<!-- </view>-->
<view class="filterItem" @click="openBusinessUnitSelect">
<text class="filterLabel">染厂</text>
<view class="filterValue">{{ businessUnitLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ businessUnitLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openStatusSelect">
<text class="filterLabel">订单状态</text>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterActions">
<u-button type="warning" size="medium" @click="resetFilter">重置</u-button>
@@ -58,8 +89,25 @@
</view>
</u-popup>
<u-select v-model="statusSelectShow" :list="statusSelectList" @confirm="onStatusConfirm"></u-select>
<u-select v-model="unitSelectShow" :list="unitSelectList" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
<u-select
class="pdaSelect"
v-model="statusSelectShow"
title="选择订单状态"
:list="statusSelectList"
:default-value="statusSelectDefault"
@confirm="onStatusConfirm"
></u-select>
<u-select
class="pdaSelect"
v-model="unitSelectShow"
title="选择染厂"
:list="unitSelectList"
:default-value="unitSelectDefault"
remote
:loading="selectSearching"
@search="onUnitSearch"
@confirm="onUnitConfirm"
></u-select>
</view>
</template>
@@ -68,6 +116,7 @@ import addBtn from '@/components/addBtn/addBtn.vue';
import FabricOutItem from '@/components/card/storeFabricBusinessOutItem.vue';
import {
getStatusOptions,
AUDIT_STATUS,
AUDIT_STATUS_MAP,
BILL_TYPES,
BUSINESS_UNIT_TYPE_DYE_FACTORY,
@@ -77,6 +126,45 @@ import {
} from '@/common/storeFabricBusinessOut';
import { withNameParam } from '@/common/remoteSelect';
const FILTER_STORAGE_KEY = 'storeFabricBusinessOutListFilters_v2';
const hasFilterValue = (value) => value !== '' && value !== null && value !== undefined;
const normalizeAuditStatus = (value) => {
if (!hasFilterValue(value)) return '';
const status = Number(value);
return Number.isNaN(status) ? '' : status;
};
const createDefaultFilters = () => ({
order_no: '',
start_date: '',
end_date: '',
delivery_unit_id: '',
delivery_unit_name: '',
business_unit_id: '',
business_unit_name: '',
audit_status: AUDIT_STATUS.PENDING,
});
const normalizeFilters = (value) => {
const filters = createDefaultFilters();
if (!value || typeof value !== 'object' || Array.isArray(value)) return filters;
Object.keys(filters).forEach((key) => {
if (key === 'audit_status') return;
if (typeof value[key] === 'string' || typeof value[key] === 'number') {
filters[key] = value[key];
}
});
if (!filters.delivery_unit_id) filters.delivery_unit_name = '';
if (!filters.business_unit_id) filters.business_unit_name = '';
if (Object.prototype.hasOwnProperty.call(value, 'audit_status')) {
filters.audit_status = normalizeAuditStatus(value.audit_status);
}
return filters;
};
export default {
components: { addBtn, FabricOutItem },
data() {
@@ -95,16 +183,8 @@ export default {
unitSearchSeq: 0,
unitSelectList: [{ value: '', label: '全部' }],
billTypeName: (BILL_TYPES[0] || {}).label || '坯布其他出货单',
filters: {
order_no: '',
start_date: '',
end_date: '',
delivery_unit_id: '',
delivery_unit_name: '',
business_unit_id: '',
business_unit_name: '',
audit_status: '',
},
filters: createDefaultFilters(),
appliedFilters: createDefaultFilters(),
statusSelectList: [
{ value: '', label: '全部' },
...getStatusOptions(),
@@ -122,20 +202,85 @@ export default {
businessUnitLabel() {
return this.filters.business_unit_name || '';
},
statusSelectDefault() {
const index = this.statusSelectList.findIndex(
(item) => String(item.value) === String(this.filters.audit_status)
);
return [index >= 0 ? index : 0];
},
unitSelectDefault() {
const selectedValue = this.unitSelectType === 'delivery'
? this.filters.delivery_unit_id
: this.filters.business_unit_id;
const index = this.unitSelectList.findIndex(
(item) => String(item.value) === String(selectedValue)
);
return [index >= 0 ? index : 0];
},
hasActiveFilter() {
const filters = this.appliedFilters || {};
return Boolean(
String(filters.order_no || '').trim()
|| filters.start_date
|| filters.end_date
|| filters.delivery_unit_id
|| filters.business_unit_id
|| hasFilterValue(filters.audit_status)
);
},
},
onLoad() {
uni.setNavigationBarTitle({ title: '坯布出库列表' });
this.restoreFilterCache();
uni.getSystemInfo({
success: (res) => {
this.scrollHeight = `${res.windowHeight - 50}px`;
},
});
this.loadList();
},
onShow() {
this.loadList();
},
methods: {
restoreFilterCache() {
try {
const cached = uni.getStorageSync(FILTER_STORAGE_KEY);
if (!cached || typeof cached !== 'object' || Array.isArray(cached)) {
const filters = createDefaultFilters();
this.filters = { ...filters };
this.appliedFilters = { ...filters };
this.saveFilterCache();
return;
}
const filters = normalizeFilters(cached);
this.filters = { ...filters };
this.appliedFilters = { ...filters };
} catch (e) {
const filters = createDefaultFilters();
this.filters = { ...filters };
this.appliedFilters = { ...filters };
}
},
saveFilterCache() {
try {
uni.setStorageSync(FILTER_STORAGE_KEY, { ...this.appliedFilters });
} catch (e) {
// 缓存失败不影响列表筛选
}
},
commitFilters() {
const filters = normalizeFilters(this.filters);
this.filters = { ...filters };
this.appliedFilters = { ...filters };
this.saveFilterCache();
this.loadList();
},
applySearch() {
this.commitFilters();
},
cancelFilterEdit() {
this.filters = { ...this.appliedFilters };
},
loadDeliveryUnitOptions() {
if (this.deliveryUnitOptions.length) return Promise.resolve(this.deliveryUnitOptions);
return this.$u.api.businessUnit.list({})
@@ -160,8 +305,23 @@ export default {
return this.businessUnitOptions;
});
},
applyUnitSelectList(list) {
applyUnitSelectList(list, preserveSelected = true) {
const rows = Array.isArray(list) ? list.slice() : [];
if (preserveSelected) {
const isDelivery = this.unitSelectType === 'delivery';
const selectedValue = isDelivery
? this.filters.delivery_unit_id
: this.filters.business_unit_id;
const selectedLabel = isDelivery
? this.filters.delivery_unit_name
: this.filters.business_unit_name;
const selectedExists = rows.some(
(item) => String(item.value) === String(selectedValue)
);
if (selectedValue !== '' && selectedValue !== null && selectedValue !== undefined && !selectedExists) {
rows.unshift({ value: selectedValue, label: selectedLabel || String(selectedValue) });
}
}
this.unitSelectList = [{ value: '', label: '全部' }].concat(rows);
},
openUnitSelect(type) {
@@ -184,7 +344,7 @@ export default {
if (isDelivery) this.deliveryUnitOptions = list;
else this.businessUnitOptions = list;
}
this.applyUnitSelectList(list);
this.applyUnitSelectList(list, empty);
})
.catch((e) => {
if (seq !== this.unitSearchSeq) return;
@@ -213,10 +373,11 @@ export default {
}
},
loadList() {
const filters = this.appliedFilters;
const params = {};
if (this.filters.order_no) params.order_no = this.filters.order_no;
if (this.filters.audit_status !== '' && this.filters.audit_status !== null) {
params.audit_status = this.filters.audit_status;
if (filters.order_no) params.order_no = filters.order_no;
if (hasFilterValue(filters.audit_status)) {
params.audit_status = filters.audit_status;
}
fetchAllOrderList((p) => this.$u.api.gfmOtherDeliveryOrder.list(p), params)
.then((rows) => {
@@ -250,12 +411,13 @@ export default {
},
// 后端列表仅支持 单号/状态 过滤，出仓日期与单位在前端做本地过滤
matchClientFilter(item) {
if (this.filters.start_date && item.out_date < this.filters.start_date) return false;
if (this.filters.end_date && item.out_date > this.filters.end_date) return false;
if (this.filters.delivery_unit_id && String(item.delivery_unit_id) !== String(this.filters.delivery_unit_id)) {
const filters = this.appliedFilters;
if (filters.start_date && item.out_date < filters.start_date) return false;
if (filters.end_date && item.out_date > filters.end_date) return false;
if (filters.delivery_unit_id && String(item.delivery_unit_id) !== String(filters.delivery_unit_id)) {
return false;
}
if (this.filters.business_unit_id && String(item.business_unit_id) !== String(this.filters.business_unit_id)) {
if (filters.business_unit_id && String(item.business_unit_id) !== String(filters.business_unit_id)) {
return false;
}
return true;
@@ -268,37 +430,20 @@ export default {
uni.navigateTo({ url: `./storeFabricBusinessOutView?id=${item.id}` });
},
openStatusSelect() { this.statusSelectShow = true; },
onStatusConfirm(e) { this.filters.audit_status = e[0].value; },
onStatusConfirm(e) {
this.filters.audit_status = normalizeAuditStatus((e[0] || {}).value);
},
resetFilter() {
this.filters = {
order_no: '',
start_date: '',
end_date: '',
delivery_unit_id: '',
delivery_unit_name: '',
business_unit_id: '',
business_unit_name: '',
audit_status: '',
};
this.filters = createDefaultFilters();
},
applyFilter() {
this.commitFilters();
this.filterShow = false;
this.loadList();
},
},
};
</script>
<style>
page { background-color: #F8F8F8; }
.filterBar { display: flex; align-items: center; padding: 16rpx 20rpx; background: #fff; gap: 16rpx; }
.filterBtn { display: flex; flex-direction: column; align-items: center; font-size: 22rpx; color: #666; min-width: 80rpx; }
.filterPanel { padding: 30rpx; }
.filterTitle { font-size: 32rpx; font-weight: bold; margin-bottom: 30rpx; }
.filterItem { margin-bottom: 24rpx; }
.filterLabel { display: block; font-size: 28rpx; color: #666; margin-bottom: 12rpx; }
.filterValue { display: flex; align-items: center; justify-content: space-between; padding: 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 28rpx; }
.dateRow { display: flex; align-items: center; gap: 12rpx; }
.dateInput { padding: 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 26rpx; min-width: 200rpx; text-align: center; }
.filterActions { display: flex; gap: 20rpx; margin-top: 40rpx; }
<style lang="scss">
@import '@/common/list-filter.scss';
</style>
src/pages/storegoods/storeGoodsProcessInList.vue
+40 -46
View File
@@ -1,9 +1,12 @@
<template>
<view>
<view class="filterBar">
<u-search v-model="filters.order_no" placeholder="进仓单号" :show-action="false" @search="loadList" @custom="loadList" />
<view class="filterBtn" @click="filterShow = true">
<u-icon name="list" size="40" color="#666"></u-icon>
<u-search v-model="filters.order_no" placeholder="进仓单号" :show-action="false" @search="applySearch" @custom="applySearch" @clear="applySearch" />
<view class="filterBtn" :class="{ 'filter-active': hasActiveFilter }" @click="filterShow = true">
<view class="filterBtn__icon">
<u-icon :key="filterIconColor" name="list" size="44" :color="filterIconColor"></u-icon>
<view v-if="hasActiveFilter" class="filterBtn__badge"></view>
</view>
<text>筛选</text>
</view>
</view>
@@ -20,24 +23,26 @@
<addBtn url="./storeGoodsProcessInAdd"></addBtn>
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true">
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true" @close="cancelFilterEdit">
<view class="filterPanel">
<view class="filterTitle">筛选条件</view>
<view class="filterItem">
<text class="filterLabel">进仓单号</text>
<u-input v-model="filters.order_no" placeholder="请输入进仓单号" />
<view class="filterInput">
<u-input v-model="filters.order_no" placeholder="请输入进仓单号" :height="100" :custom-style="{ fontSize: '36rpx', color: '#202328' }" placeholder-style="color: #aeb4bf; font-size: 34rpx;" />
</view>
</view>
<view class="filterItem" @click="openProcessUnitSelect">
<text class="filterLabel">加工单位</text>
<view class="filterValue">{{ processUnitLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ processUnitLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openWarehouseSelect">
<text class="filterLabel">仓库</text>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openStatusSelect">
<text class="filterLabel">订单状态</text>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterActions">
<u-button type="warning" size="medium" @click="resetFilter">重置</u-button>
@@ -46,8 +51,8 @@
</view>
</u-popup>
<u-select v-model="statusSelectShow" :list="statusSelectList" @confirm="onStatusConfirm"></u-select>
<u-select v-model="unitSelectShow" :list="unitSelectList" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
<u-select class="pdaSelect" v-model="statusSelectShow" title="选择订单状态" :list="statusSelectList" :default-value="statusSelectDefault" @confirm="onStatusConfirm"></u-select>
<u-select class="pdaSelect" v-model="unitSelectShow" :list="unitSelectList" :default-value="unitSelectDefault" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
</view>
</template>
@@ -56,6 +61,7 @@ import addBtn from '@/components/addBtn/addBtn.vue';
import ProcessInItem from '@/components/card/storeGoodsProcessInItem.vue';
import {
getStatusOptions,
AUDIT_STATUS,
AUDIT_STATUS_MAP,
BUSINESS_UNIT_TYPE_PROCESS,
WAREHOUSE_TYPE_FINISHED,
@@ -64,9 +70,11 @@ import {
fetchAllOrderList,
} from '@/common/storeGoodsProcessIn';
import { withNameParam } from '@/common/remoteSelect';
import listFilterMixin from '@/mixins/listFilterMixin';
export default {
components: { addBtn, ProcessInItem },
mixins: [listFilterMixin],
data() {
return {
list: [],
@@ -83,13 +91,14 @@ export default {
selectSearching: false,
unitSearchSeq: 0,
unitSelectList: [{ value: '', label: '全部' }],
filterStorageKey: 'storeGoodsProcessInListFilters_v2',
filters: {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
audit_status: AUDIT_STATUS.PENDING,
},
statusSelectList: [
{ value: '', label: '全部' },
@@ -111,6 +120,7 @@ export default {
},
onLoad() {
uni.setNavigationBarTitle({ title: '加工进仓列表' });
this.restoreFilterCache();
uni.getSystemInfo({
success: (res) => {
this.scrollHeight = `${res.windowHeight - 50}px`;
@@ -121,6 +131,16 @@ export default {
this.loadList();
},
methods: {
createDefaultFilters() {
return {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: AUDIT_STATUS.PENDING,
};
},
loadProcessUnitOptions() {
if (this.processUnitOptions.length) return Promise.resolve(this.processUnitOptions);
return this.$u.api.businessUnit.list({ unit_type_id: BUSINESS_UNIT_TYPE_PROCESS })
@@ -145,10 +165,6 @@ export default {
return this.warehouseOptions;
});
},
applyUnitSelectList(list) {
const rows = Array.isArray(list) ? list.slice() : [];
this.unitSelectList = [{ value: '', label: '全部' }].concat(rows);
},
openUnitSelect(type) {
this.unitSelectType = type;
const cache = type === 'warehouse' ? this.warehouseOptions : this.processUnitOptions;
@@ -170,7 +186,7 @@ export default {
if (type === 'warehouse') this.warehouseOptions = list;
else this.processUnitOptions = list;
}
this.applyUnitSelectList(list);
this.applyUnitSelectList(list, empty);
}).catch((e) => {
if (seq !== this.unitSearchSeq) return;
uni.showToast({ title: (e && e.message) || '搜索失败', icon: 'none' });
@@ -199,12 +215,13 @@ export default {
loadList() {
if (this.listLoading) return;
this.listLoading = true;
const filters = this.appliedFilters || this.filters;
const params = {};
if (this.filters.order_no) params.order_no = this.filters.order_no;
if (this.filters.process_unit_id) params.process_unit_id = this.filters.process_unit_id;
if (this.filters.warehouse_id) params.warehouse_id = this.filters.warehouse_id;
if (this.filters.audit_status !== '' && this.filters.audit_status !== null) {
params.audit_status = this.filters.audit_status;
if (filters.order_no) params.order_no = filters.order_no;
if (filters.process_unit_id) params.process_unit_id = filters.process_unit_id;
if (filters.warehouse_id) params.warehouse_id = filters.warehouse_id;
if (this.hasFilterValue(filters.audit_status)) {
params.audit_status = filters.audit_status;
}
fetchAllOrderList((p) => this.$u.api.fpmProcessInOrder.list(p), params)
.then((rows) => {
@@ -249,33 +266,10 @@ export default {
uni.navigateTo({ url: `./${page}?id=${item.id}` });
},
openStatusSelect() { this.statusSelectShow = true; },
onStatusConfirm(e) { this.filters.audit_status = e[0].value; },
resetFilter() {
this.filters = {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
};
},
applyFilter() {
this.filterShow = false;
this.loadList();
},
},
};
</script>
<style>
page { background-color: #F8F8F8; }
.filterBar { display: flex; align-items: center; padding: 16rpx 20rpx; background: #fff; gap: 16rpx; }
.filterBtn { display: flex; flex-direction: column; align-items: center; font-size: 22rpx; color: #666; min-width: 80rpx; }
.filterPanel { padding: 30rpx; }
.filterTitle { font-size: 32rpx; font-weight: bold; margin-bottom: 30rpx; }
.filterItem { margin-bottom: 24rpx; }
.filterLabel { display: block; font-size: 28rpx; color: #666; margin-bottom: 12rpx; }
.filterValue { display: flex; align-items: center; justify-content: space-between; padding: 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 28rpx; }
.filterActions { display: flex; gap: 20rpx; margin-top: 40rpx; }
<style lang="scss">
@import '@/common/list-filter.scss';
</style>
src/pages/storegoods/storeGoodsProcessOutList.vue
+40 -46
View File
@@ -1,9 +1,12 @@
<template>
<view>
<view class="filterBar">
<u-search v-model="filters.order_no" placeholder="出仓单号" :show-action="false" @search="loadList" @custom="loadList" />
<view class="filterBtn" @click="filterShow = true">
<u-icon name="list" size="40" color="#666"></u-icon>
<u-search v-model="filters.order_no" placeholder="出仓单号" :show-action="false" @search="applySearch" @custom="applySearch" @clear="applySearch" />
<view class="filterBtn" :class="{ 'filter-active': hasActiveFilter }" @click="filterShow = true">
<view class="filterBtn__icon">
<u-icon :key="filterIconColor" name="list" size="44" :color="filterIconColor"></u-icon>
<view v-if="hasActiveFilter" class="filterBtn__badge"></view>
</view>
<text>筛选</text>
</view>
</view>
@@ -20,24 +23,26 @@
<addBtn url="./storeGoodsProcessOutAdd"></addBtn>
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true">
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true" @close="cancelFilterEdit">
<view class="filterPanel">
<view class="filterTitle">筛选条件</view>
<view class="filterItem">
<text class="filterLabel">出仓单号</text>
<u-input v-model="filters.order_no" placeholder="请输入出仓单号" />
<view class="filterInput">
<u-input v-model="filters.order_no" placeholder="请输入出仓单号" :height="100" :custom-style="{ fontSize: '36rpx', color: '#202328' }" placeholder-style="color: #aeb4bf; font-size: 34rpx;" />
</view>
</view>
<view class="filterItem" @click="openProcessUnitSelect">
<text class="filterLabel">加工单位</text>
<view class="filterValue">{{ processUnitLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ processUnitLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openWarehouseSelect">
<text class="filterLabel">仓库</text>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openStatusSelect">
<text class="filterLabel">订单状态</text>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterActions">
<u-button type="warning" size="medium" @click="resetFilter">重置</u-button>
@@ -46,8 +51,8 @@
</view>
</u-popup>
<u-select v-model="statusSelectShow" :list="statusSelectList" @confirm="onStatusConfirm"></u-select>
<u-select v-model="unitSelectShow" :list="unitSelectList" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
<u-select class="pdaSelect" v-model="statusSelectShow" title="选择订单状态" :list="statusSelectList" :default-value="statusSelectDefault" @confirm="onStatusConfirm"></u-select>
<u-select class="pdaSelect" v-model="unitSelectShow" :list="unitSelectList" :default-value="unitSelectDefault" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
</view>
</template>
@@ -56,6 +61,7 @@ import addBtn from '@/components/addBtn/addBtn.vue';
import ProcessOutItem from '@/components/card/storeGoodsProcessOutItem.vue';
import {
getStatusOptions,
AUDIT_STATUS,
AUDIT_STATUS_MAP,
BUSINESS_UNIT_TYPE_PROCESS,
WAREHOUSE_TYPE_FINISHED,
@@ -64,9 +70,11 @@ import {
fetchAllOrderList,
} from '@/common/storeGoodsProcessOut';
import { withNameParam } from '@/common/remoteSelect';
import listFilterMixin from '@/mixins/listFilterMixin';
export default {
components: { addBtn, ProcessOutItem },
mixins: [listFilterMixin],
data() {
return {
list: [],
@@ -83,13 +91,14 @@ export default {
selectSearching: false,
unitSearchSeq: 0,
unitSelectList: [{ value: '', label: '全部' }],
filterStorageKey: 'storeGoodsProcessOutListFilters_v2',
filters: {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
audit_status: AUDIT_STATUS.PENDING,
},
statusSelectList: [
{ value: '', label: '全部' },
@@ -111,6 +120,7 @@ export default {
},
onLoad() {
uni.setNavigationBarTitle({ title: '加工出仓列表' });
this.restoreFilterCache();
uni.getSystemInfo({
success: (res) => {
this.scrollHeight = `${res.windowHeight - 50}px`;
@@ -121,6 +131,16 @@ export default {
this.loadList();
},
methods: {
createDefaultFilters() {
return {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: AUDIT_STATUS.PENDING,
};
},
loadProcessUnitOptions() {
if (this.processUnitOptions.length) return Promise.resolve(this.processUnitOptions);
return this.$u.api.businessUnit.list({ unit_type_id: BUSINESS_UNIT_TYPE_PROCESS })
@@ -145,10 +165,6 @@ export default {
return this.warehouseOptions;
});
},
applyUnitSelectList(list) {
const rows = Array.isArray(list) ? list.slice() : [];
this.unitSelectList = [{ value: '', label: '全部' }].concat(rows);
},
openUnitSelect(type) {
this.unitSelectType = type;
const cache = type === 'warehouse' ? this.warehouseOptions : this.processUnitOptions;
@@ -170,7 +186,7 @@ export default {
if (type === 'warehouse') this.warehouseOptions = list;
else this.processUnitOptions = list;
}
this.applyUnitSelectList(list);
this.applyUnitSelectList(list, empty);
}).catch((e) => {
if (seq !== this.unitSearchSeq) return;
uni.showToast({ title: (e && e.message) || '搜索失败', icon: 'none' });
@@ -199,12 +215,13 @@ export default {
loadList() {
if (this.listLoading) return;
this.listLoading = true;
const filters = this.appliedFilters || this.filters;
const params = {};
if (this.filters.order_no) params.order_no = this.filters.order_no;
if (this.filters.process_unit_id) params.process_unit_id = this.filters.process_unit_id;
if (this.filters.warehouse_id) params.warehouse_id = this.filters.warehouse_id;
if (this.filters.audit_status !== '' && this.filters.audit_status !== null) {
params.audit_status = this.filters.audit_status;
if (filters.order_no) params.order_no = filters.order_no;
if (filters.process_unit_id) params.process_unit_id = filters.process_unit_id;
if (filters.warehouse_id) params.warehouse_id = filters.warehouse_id;
if (this.hasFilterValue(filters.audit_status)) {
params.audit_status = filters.audit_status;
}
fetchAllOrderList((p) => this.$u.api.fpmProcessOutOrder.list(p), params)
.then((rows) => {
@@ -251,33 +268,10 @@ export default {
uni.navigateTo({ url: `./${page}?id=${item.id}` });
},
openStatusSelect() { this.statusSelectShow = true; },
onStatusConfirm(e) { this.filters.audit_status = e[0].value; },
resetFilter() {
this.filters = {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
};
},
applyFilter() {
this.filterShow = false;
this.loadList();
},
},
};
</script>
<style>
page { background-color: #F8F8F8; }
.filterBar { display: flex; align-items: center; padding: 16rpx 20rpx; background: #fff; gap: 16rpx; }
.filterBtn { display: flex; flex-direction: column; align-items: center; font-size: 22rpx; color: #666; min-width: 80rpx; }
.filterPanel { padding: 30rpx; }
.filterTitle { font-size: 32rpx; font-weight: bold; margin-bottom: 30rpx; }
.filterItem { margin-bottom: 24rpx; }
.filterLabel { display: block; font-size: 28rpx; color: #666; margin-bottom: 12rpx; }
.filterValue { display: flex; align-items: center; justify-content: space-between; padding: 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 28rpx; }
.filterActions { display: flex; gap: 20rpx; margin-top: 40rpx; }
<style lang="scss">
@import '@/common/list-filter.scss';
</style>
src/pages/storegoods/storeGoodsProcessReturnInList.vue
+40 -46
View File
@@ -1,9 +1,12 @@
<template>
<view>
<view class="filterBar">
<u-search v-model="filters.order_no" placeholder="进仓单号" :show-action="false" @search="loadList" @custom="loadList" />
<view class="filterBtn" @click="filterShow = true">
<u-icon name="list" size="40" color="#666"></u-icon>
<u-search v-model="filters.order_no" placeholder="进仓单号" :show-action="false" @search="applySearch" @custom="applySearch" @clear="applySearch" />
<view class="filterBtn" :class="{ 'filter-active': hasActiveFilter }" @click="filterShow = true">
<view class="filterBtn__icon">
<u-icon :key="filterIconColor" name="list" size="44" :color="filterIconColor"></u-icon>
<view v-if="hasActiveFilter" class="filterBtn__badge"></view>
</view>
<text>筛选</text>
</view>
</view>
@@ -20,24 +23,26 @@
<addBtn url="./storeGoodsProcessReturnInAdd"></addBtn>
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true">
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true" @close="cancelFilterEdit">
<view class="filterPanel">
<view class="filterTitle">筛选条件</view>
<view class="filterItem">
<text class="filterLabel">进仓单号</text>
<u-input v-model="filters.order_no" placeholder="请输入进仓单号" />
<view class="filterInput">
<u-input v-model="filters.order_no" placeholder="请输入进仓单号" :height="100" :custom-style="{ fontSize: '36rpx', color: '#202328' }" placeholder-style="color: #aeb4bf; font-size: 34rpx;" />
</view>
</view>
<view class="filterItem" @click="openProcessUnitSelect">
<text class="filterLabel">加工单位</text>
<view class="filterValue">{{ processUnitLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ processUnitLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openWarehouseSelect">
<text class="filterLabel">仓库</text>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openStatusSelect">
<text class="filterLabel">订单状态</text>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterActions">
<u-button type="warning" size="medium" @click="resetFilter">重置</u-button>
@@ -46,8 +51,8 @@
</view>
</u-popup>
<u-select v-model="statusSelectShow" :list="statusSelectList" @confirm="onStatusConfirm"></u-select>
<u-select v-model="unitSelectShow" :list="unitSelectList" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
<u-select class="pdaSelect" v-model="statusSelectShow" title="选择订单状态" :list="statusSelectList" :default-value="statusSelectDefault" @confirm="onStatusConfirm"></u-select>
<u-select class="pdaSelect" v-model="unitSelectShow" :list="unitSelectList" :default-value="unitSelectDefault" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
</view>
</template>
@@ -56,6 +61,7 @@ import addBtn from '@/components/addBtn/addBtn.vue';
import ProcessReturnInItem from '@/components/card/storeGoodsProcessReturnInItem.vue';
import {
getStatusOptions,
AUDIT_STATUS,
AUDIT_STATUS_MAP,
BUSINESS_UNIT_TYPE_PROCESS,
WAREHOUSE_TYPE_FINISHED,
@@ -64,9 +70,11 @@ import {
fetchAllOrderList,
} from '@/common/storeGoodsProcessReturnIn';
import { withNameParam } from '@/common/remoteSelect';
import listFilterMixin from '@/mixins/listFilterMixin';
export default {
components: { addBtn, ProcessReturnInItem },
mixins: [listFilterMixin],
data() {
return {
list: [],
@@ -83,13 +91,14 @@ export default {
selectSearching: false,
unitSearchSeq: 0,
unitSelectList: [{ value: '', label: '全部' }],
filterStorageKey: 'storeGoodsProcessReturnInListFilters_v2',
filters: {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
audit_status: AUDIT_STATUS.PENDING,
},
statusSelectList: [
{ value: '', label: '全部' },
@@ -111,6 +120,7 @@ export default {
},
onLoad() {
uni.setNavigationBarTitle({ title: '加工退货进仓列表' });
this.restoreFilterCache();
uni.getSystemInfo({
success: (res) => {
this.scrollHeight = `${res.windowHeight - 50}px`;
@@ -121,6 +131,16 @@ export default {
this.loadList();
},
methods: {
createDefaultFilters() {
return {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: AUDIT_STATUS.PENDING,
};
},
loadProcessUnitOptions() {
if (this.processUnitOptions.length) return Promise.resolve(this.processUnitOptions);
return this.$u.api.businessUnit.list({ unit_type_id: BUSINESS_UNIT_TYPE_PROCESS })
@@ -145,10 +165,6 @@ export default {
return this.warehouseOptions;
});
},
applyUnitSelectList(list) {
const rows = Array.isArray(list) ? list.slice() : [];
this.unitSelectList = [{ value: '', label: '全部' }].concat(rows);
},
openUnitSelect(type) {
this.unitSelectType = type;
const cache = type === 'warehouse' ? this.warehouseOptions : this.processUnitOptions;
@@ -170,7 +186,7 @@ export default {
if (type === 'warehouse') this.warehouseOptions = list;
else this.processUnitOptions = list;
}
this.applyUnitSelectList(list);
this.applyUnitSelectList(list, empty);
}).catch((e) => {
if (seq !== this.unitSearchSeq) return;
uni.showToast({ title: (e && e.message) || '搜索失败', icon: 'none' });
@@ -199,12 +215,13 @@ export default {
loadList() {
if (this.listLoading) return;
this.listLoading = true;
const filters = this.appliedFilters || this.filters;
const params = {};
if (this.filters.order_no) params.order_no = this.filters.order_no;
if (this.filters.process_unit_id) params.supplier_id = this.filters.process_unit_id;
if (this.filters.warehouse_id) params.warehouse_id = this.filters.warehouse_id;
if (this.filters.audit_status !== '' && this.filters.audit_status !== null) {
params.audit_status = this.filters.audit_status;
if (filters.order_no) params.order_no = filters.order_no;
if (filters.process_unit_id) params.supplier_id = filters.process_unit_id;
if (filters.warehouse_id) params.warehouse_id = filters.warehouse_id;
if (this.hasFilterValue(filters.audit_status)) {
params.audit_status = filters.audit_status;
}
fetchAllOrderList((p) => this.$u.api.fpmProcessReturnInOrder.list(p), params)
.then((rows) => {
@@ -249,33 +266,10 @@ export default {
uni.navigateTo({ url: `./${page}?id=${item.id}` });
},
openStatusSelect() { this.statusSelectShow = true; },
onStatusConfirm(e) { this.filters.audit_status = e[0].value; },
resetFilter() {
this.filters = {
order_no: '',
process_unit_id: '',
process_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
};
},
applyFilter() {
this.filterShow = false;
this.loadList();
},
},
};
</script>
<style>
page { background-color: #F8F8F8; }
.filterBar { display: flex; align-items: center; padding: 16rpx 20rpx; background: #fff; gap: 16rpx; }
.filterBtn { display: flex; flex-direction: column; align-items: center; font-size: 22rpx; color: #666; min-width: 80rpx; }
.filterPanel { padding: 30rpx; }
.filterTitle { font-size: 32rpx; font-weight: bold; margin-bottom: 30rpx; }
.filterItem { margin-bottom: 24rpx; }
.filterLabel { display: block; font-size: 28rpx; color: #666; margin-bottom: 12rpx; }
.filterValue { display: flex; align-items: center; justify-content: space-between; padding: 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 28rpx; }
.filterActions { display: flex; gap: 20rpx; margin-top: 40rpx; }
<style lang="scss">
@import '@/common/list-filter.scss';
</style>
src/pages/storegoods/storeGoodsPurchaseInList.vue
+40 -46
View File
@@ -1,9 +1,12 @@
<template>
<view>
<view class="filterBar">
<u-search v-model="filters.order_no" placeholder="进仓单号" :show-action="false" @search="loadList" @custom="loadList" />
<view class="filterBtn" @click="filterShow = true">
<u-icon name="list" size="40" color="#666"></u-icon>
<u-search v-model="filters.order_no" placeholder="进仓单号" :show-action="false" @search="applySearch" @custom="applySearch" @clear="applySearch" />
<view class="filterBtn" :class="{ 'filter-active': hasActiveFilter }" @click="filterShow = true">
<view class="filterBtn__icon">
<u-icon :key="filterIconColor" name="list" size="44" :color="filterIconColor"></u-icon>
<view v-if="hasActiveFilter" class="filterBtn__badge"></view>
</view>
<text>筛选</text>
</view>
</view>
@@ -20,24 +23,26 @@
<addBtn url="./storeGoodsPurchaseInAdd"></addBtn>
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true">
<u-popup v-model="filterShow" mode="right" width="580rpx" :safe-area-inset-bottom="true" @close="cancelFilterEdit">
<view class="filterPanel">
<view class="filterTitle">筛选条件</view>
<view class="filterItem">
<text class="filterLabel">进仓单号</text>
<u-input v-model="filters.order_no" placeholder="请输入进仓单号" />
<view class="filterInput">
<u-input v-model="filters.order_no" placeholder="请输入进仓单号" :height="100" :custom-style="{ fontSize: '36rpx', color: '#202328' }" placeholder-style="color: #aeb4bf; font-size: 34rpx;" />
</view>
</view>
<view class="filterItem" @click="openSupplierSelect">
<text class="filterLabel">供应商</text>
<view class="filterValue">{{ supplierLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ supplierLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openWarehouseSelect">
<text class="filterLabel">仓库</text>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ warehouseLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterItem" @click="openStatusSelect">
<text class="filterLabel">订单状态</text>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="28"></u-icon></view>
<view class="filterValue">{{ statusLabel || '全部' }} <u-icon name="arrow-right" size="36"></u-icon></view>
</view>
<view class="filterActions">
<u-button type="warning" size="medium" @click="resetFilter">重置</u-button>
@@ -46,8 +51,8 @@
</view>
</u-popup>
<u-select v-model="statusSelectShow" :list="statusSelectList" @confirm="onStatusConfirm"></u-select>
<u-select v-model="unitSelectShow" :list="unitSelectList" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
<u-select class="pdaSelect" v-model="statusSelectShow" title="选择订单状态" :list="statusSelectList" :default-value="statusSelectDefault" @confirm="onStatusConfirm"></u-select>
<u-select class="pdaSelect" v-model="unitSelectShow" :list="unitSelectList" :default-value="unitSelectDefault" remote :loading="selectSearching" @search="onUnitSearch" @confirm="onUnitConfirm"></u-select>
</view>
</template>
@@ -56,6 +61,7 @@ import addBtn from '@/components/addBtn/addBtn.vue';
import PurchaseInItem from '@/components/card/storeGoodsPurchaseInItem.vue';
import {
getStatusOptions,
AUDIT_STATUS,
AUDIT_STATUS_MAP,
BUSINESS_UNIT_TYPE_PRODUCT_SUPPLIER,
WAREHOUSE_TYPE_FINISHED,
@@ -64,9 +70,11 @@ import {
fetchAllOrderList,
} from '@/common/storeGoodsPurchaseIn';
import { withNameParam } from '@/common/remoteSelect';
import listFilterMixin from '@/mixins/listFilterMixin';
export default {
components: { addBtn, PurchaseInItem },
mixins: [listFilterMixin],
data() {
return {
list: [],
@@ -83,13 +91,14 @@ export default {
selectSearching: false,
unitSearchSeq: 0,
unitSelectList: [{ value: '', label: '全部' }],
filterStorageKey: 'storeGoodsPurchaseInListFilters_v2',
filters: {
order_no: '',
supplier_id: '',
supplier_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
audit_status: AUDIT_STATUS.PENDING,
},
statusSelectList: [
{ value: '', label: '全部' },
@@ -111,6 +120,7 @@ export default {
},
onLoad() {
uni.setNavigationBarTitle({ title: '成品采购进仓' });
this.restoreFilterCache();
uni.getSystemInfo({
success: (res) => {
this.scrollHeight = `${res.windowHeight - 50}px`;
@@ -121,6 +131,16 @@ export default {
this.loadList();
},
methods: {
createDefaultFilters() {
return {
order_no: '',
supplier_id: '',
supplier_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: AUDIT_STATUS.PENDING,
};
},
loadSupplierOptions() {
if (this.supplierOptions.length) return Promise.resolve(this.supplierOptions);
return this.$u.api.businessUnit.list({ unit_type_id: BUSINESS_UNIT_TYPE_PRODUCT_SUPPLIER })
@@ -145,10 +165,6 @@ export default {
return this.warehouseOptions;
});
},
applyUnitSelectList(list) {
const rows = Array.isArray(list) ? list.slice() : [];
this.unitSelectList = [{ value: '', label: '全部' }].concat(rows);
},
openUnitSelect(type) {
this.unitSelectType = type;
const cache = type === 'warehouse' ? this.warehouseOptions : this.supplierOptions;
@@ -170,7 +186,7 @@ export default {
if (type === 'warehouse') this.warehouseOptions = list;
else this.supplierOptions = list;
}
this.applyUnitSelectList(list);
this.applyUnitSelectList(list, empty);
}).catch((e) => {
if (seq !== this.unitSearchSeq) return;
uni.showToast({ title: (e && e.message) || '搜索失败', icon: 'none' });
@@ -199,12 +215,13 @@ export default {
loadList() {
if (this.listLoading) return;
this.listLoading = true;
const filters = this.appliedFilters || this.filters;
const params = {};
if (this.filters.order_no) params.order_no = this.filters.order_no;
if (this.filters.supplier_id) params.supplier_id = this.filters.supplier_id;
if (this.filters.warehouse_id) params.warehouse_id = this.filters.warehouse_id;
if (this.filters.audit_status !== '' && this.filters.audit_status !== null) {
params.audit_status = this.filters.audit_status;
if (filters.order_no) params.order_no = filters.order_no;
if (filters.supplier_id) params.supplier_id = filters.supplier_id;
if (filters.warehouse_id) params.warehouse_id = filters.warehouse_id;
if (this.hasFilterValue(filters.audit_status)) {
params.audit_status = filters.audit_status;
}
fetchAllOrderList((p) => this.$u.api.fpmPrcInOrder.list(p), params)
.then((rows) => {
@@ -249,33 +266,10 @@ export default {
uni.navigateTo({ url: `./${page}?id=${item.id}` });
},
openStatusSelect() { this.statusSelectShow = true; },
onStatusConfirm(e) { this.filters.audit_status = e[0].value; },
resetFilter() {
this.filters = {
order_no: '',
supplier_id: '',
supplier_name: '',
warehouse_id: '',
warehouse_name: '',
audit_status: '',
};
},
applyFilter() {
this.filterShow = false;
this.loadList();
},
},
};
</script>
<style>
page { background-color: #F8F8F8; }
.filterBar { display: flex; align-items: center; padding: 16rpx 20rpx; background: #fff; gap: 16rpx; }
.filterBtn { display: flex; flex-direction: column; align-items: center; font-size: 22rpx; color: #666; min-width: 80rpx; }
.filterPanel { padding: 30rpx; }
.filterTitle { font-size: 32rpx; font-weight: bold; margin-bottom: 30rpx; }
.filterItem { margin-bottom: 24rpx; }
.filterLabel { display: block; font-size: 28rpx; color: #666; margin-bottom: 12rpx; }
.filterValue { display: flex; align-items: center; justify-content: space-between; padding: 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 28rpx; }
.filterActions { display: flex; gap: 20rpx; margin-top: 40rpx; }
<style lang="scss">
@import '@/common/list-filter.scss';
</style>