Files
shanxia2.0/miniprogram/pages/db/inventory/list.vue
T

247 lines
8.1 KiB
Vue

<template>
<view class="db-page">
<view class="db-header" :style="safeAreaStyle">
<view class="db-header__nav">
<view class="db-header__left">
<text class="db-header__back" @click="goBack">←</text>
<text class="db-header__title">出入库管理</text>
</view>
<view />
<view />
</view>
</view>
<view class="db-search-wrap">
<db-search
v-model="keyword"
placeholder="搜索往来单位 / 车牌 / 产品"
@change="onKeyword"
@search="reload"
@clear="onClear"
/>
</view>
<view class="db-filter-bar">
<view
v-for="item in dateFilters"
:key="item.value"
class="db-filter-chip"
:class="{ 'db-filter-chip--active': dateFilter === item.value }"
@click="setFilter(item.value)"
>
{{ item.label }}
</view>
</view>
<view class="db-list">
<view v-if="!loading && !list.length" class="db-empty">暂无数据</view>
<view v-for="item in list" :key="item.id" class="db-card" @click="viewItem(item)">
<view class="db-card__head">
<text class="db-card__title">{{ item.vehicleNo || '未填车牌' }}</text>
<db-tag :type="item.businessType === '入库' ? 'success' : 'warning'">
{{ item.businessType }}
</db-tag>
</view>
<view class="db-card__row">
<text class="db-card__label">日期</text>
<text>{{ item.date || '--' }}</text>
</view>
<view class="db-card__row">
<text class="db-card__label">往来单位</text>
<text>{{ item.partnerCompany || '--' }}</text>
</view>
<view class="db-card__row">
<text class="db-card__label">产品</text>
<text>{{ item.product || '--' }}</text>
</view>
<view class="db-card__row">
<text class="db-card__label">数量</text>
<text>{{ item.quantity ?? '--' }} 吨</text>
</view>
<view class="db-card__row">
<text class="db-card__label">状态</text>
<text>{{ item.status || '待处理' }}</text>
</view>
<view class="db-card__foot" @click.stop>
<db-btn size="small" type="primary" plain @click="viewRelated(item)">关联</db-btn>
<db-btn size="small" type="primary" plain @click="editItem(item)">编辑</db-btn>
<db-btn
v-if="!item.hasWeighingSlip"
size="small"
type="primary"
@click="genWeighing(item)"
>
生成地磅单
</db-btn>
<db-btn size="small" type="danger" plain @click="removeItem(item)">删除</db-btn>
</view>
</view>
<view v-if="loading" class="db-empty">加载中...</view>
</view>
<db-popup :show="relatedOpen" height="75vh" @close="relatedOpen = false" @update:show="(v) => (relatedOpen = v)">
<view style="padding: 16px">
<view class="db-header__title" style="margin-bottom: 12px">关联数据</view>
<view v-if="relatedLoading" class="db-empty">加载中...</view>
<template v-else>
<view v-if="related.plan" class="db-card">
<db-tag type="primary">计划</db-tag>
<view class="db-card__row" style="margin-top: 8px">
<text class="db-card__label">计划号</text>
<text>{{ related.plan.planNo || '--' }}</text>
</view>
<view class="db-card__row">
<text class="db-card__label">产品</text>
<text>{{ related.plan.product || '--' }}</text>
</view>
</view>
<view v-if="related.weighing" class="db-card">
<db-tag type="warning">地磅单</db-tag>
<view class="db-card__row" style="margin-top: 8px">
<text class="db-card__label">车牌</text>
<text>{{ related.weighing.vehicleNo || '--' }}</text>
</view>
<view class="db-card__row">
<text class="db-card__label">净重</text>
<text>{{ related.weighing.netWeight ?? '--' }} kg</text>
</view>
</view>
<view v-if="!related.plan && !related.weighing" class="db-empty">暂无关联数据</view>
</template>
</view>
</db-popup>
</view>
</template>
<script setup>
import { ref } from 'vue'
import { onShow } from '@dcloudio/uni-app'
import { PAGE_PATHS } from '@/config/api'
import { getSafeAreaStyle } from '@/utils/safeArea'
import { inventoryApi } from '@/pages/db/api/db'
import { formatYmd, addDays, weekRange } from '@/pages/db/utils/dbDate'
import DbSearch from '@/components/db-ui/db-search.vue'
import DbTag from '@/components/db-ui/db-tag.vue'
import DbBtn from '@/components/db-ui/db-btn.vue'
import DbPopup from '@/components/db-ui/db-popup.vue'
const safeAreaStyle = getSafeAreaStyle()
const keyword = ref('')
const dateFilter = ref('today')
const loading = ref(false)
const list = ref([])
const relatedOpen = ref(false)
const relatedLoading = ref(false)
const related = ref({ plan: null, weighing: null })
let debounce = null
const dateFilters = [
{ label: '全部', value: 'all' },
{ label: '今日', value: 'today' },
{ label: '明日', value: 'tomorrow' },
{ label: '昨日', value: 'yesterday' },
{ label: '本周', value: 'week' }
]
function buildParams() {
const params = { q: keyword.value || undefined }
const today = new Date()
if (dateFilter.value === 'today') {
const d = formatYmd(today)
params.dateFrom = d
params.dateTo = d
} else if (dateFilter.value === 'tomorrow') {
const t = formatYmd(addDays(today, 1))
params.dateFrom = t
params.dateTo = t
} else if (dateFilter.value === 'yesterday') {
const y = formatYmd(addDays(today, -1))
params.dateFrom = y
params.dateTo = y
} else if (dateFilter.value === 'week') {
const w = weekRange(today)
params.dateFrom = w.from
params.dateTo = w.to
}
return params
}
async function reload() {
loading.value = true
try {
list.value = (await inventoryApi.list(buildParams())) || []
} catch (e) {
list.value = []
} finally {
loading.value = false
}
}
function onKeyword(v) {
keyword.value = typeof v === 'string' ? v : keyword.value
if (debounce) clearTimeout(debounce)
debounce = setTimeout(reload, 300)
}
function onClear() {
keyword.value = ''
reload()
}
function setFilter(v) {
if (dateFilter.value === v) return
dateFilter.value = v
reload()
}
function goBack() {
uni.navigateBack({ fail: () => uni.reLaunch({ url: PAGE_PATHS.workbench }) })
}
function editItem(item) {
uni.navigateTo({ url: `${PAGE_PATHS.dbInventoryDetail}?id=${item.id}&mode=edit` })
}
function viewItem(item) {
uni.navigateTo({ url: `${PAGE_PATHS.dbInventoryDetail}?id=${item.id}&mode=view` })
}
async function viewRelated(item) {
relatedOpen.value = true
relatedLoading.value = true
try {
related.value = (await inventoryApi.getRelated(item.id)) || { plan: null, weighing: null }
} catch (e) {
relatedOpen.value = false
} finally {
relatedLoading.value = false
}
}
function genWeighing(item) {
const q = [
`vehicleNo=${encodeURIComponent(item.vehicleNo || '')}`,
`productId=${encodeURIComponent(item.productId || '')}`,
`cargoName=${encodeURIComponent(item.product || '')}`,
`businessType=${encodeURIComponent(item.businessType || '')}`,
`supplier=${encodeURIComponent(item.partnerCompany || '')}`,
`consignee=${encodeURIComponent(item.partnerCompany || '')}`,
`planNo=${encodeURIComponent(item.planNo || '')}`,
`inboundOutboundId=${encodeURIComponent(item.id)}`,
`purchasePlanId=${encodeURIComponent(item.purchasePlanId || '')}`,
'mode=create'
].join('&')
uni.navigateTo({ url: `${PAGE_PATHS.dbWeighingDetail}?${q}` })
}
function removeItem(item) {
uni.showModal({
title: '确认删除',
content: '确定删除该出入库单吗?',
success: async (res) => {
if (!res.confirm) return
await inventoryApi.delete(item.id)
uni.showToast({ title: '删除成功', icon: 'success' })
reload()
}
})
}
onShow(reload)
</script>
<style lang="scss">
@import '@/styles/db-theme.scss';
</style>