fix some bug

Signed-off-by: 吴文峰 <kevin@lmve.net>
This commit is contained in:
2026-04-29 19:09:51 +08:00
parent 98dfa3ac02
commit 89816f367b
6 changed files with 196 additions and 35 deletions
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "ops_vue_js",
"version": "1.3.2",
"version": "1.3.5",
"private": true,
"type": "module",
"engines": {
@@ -609,7 +609,7 @@ onMounted(async () => {
<RouterLink
v-for="customer in item.Customers.slice(0, 3)"
:key="customer.id"
:to="`/customer/${customer.id}`"
:to="`/customer/detail/${customer.id}`"
class="inline-flex items-center gap-1 rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 hover:bg-blue-200 dark:bg-blue-900/40 dark:text-blue-400 dark:hover:bg-blue-900/60"
@click.stop
>
@@ -1,6 +1,6 @@
<script setup>
import { ref, reactive, computed, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useRouter, RouterLink } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { useToastStore } from '@/stores/toast'
import { usePageTitle } from '@/composables/usePageTitle'
@@ -16,6 +16,8 @@ import {
IconSearch,
IconTrash,
IconEdit,
IconTool,
IconUser,
} from '@tabler/icons-vue'
usePageTitle('warehouse.container_list')
@@ -223,7 +225,7 @@ onMounted(() => {
</script>
<template>
<div class="mx-auto max-w-6xl px-6 py-6">
<div class="mx-auto max-w-7xl px-6 py-6">
<!-- 统计卡片 -->
<div class="mb-6 grid grid-cols-3 gap-4">
@@ -295,6 +297,8 @@ onMounted(() => {
<th class="px-6 py-3 font-medium">{{ t('warehouse.remark') }}</th>
<th class="px-6 py-3 font-medium w-24 text-center">{{ t('warehouse.child_containers') }}</th>
<th class="px-6 py-3 font-medium w-24 text-center">{{ t('warehouse.items') }}</th>
<th class="px-6 py-3 font-medium w-24 text-center">{{ t('work_order.work_order_count') }}</th>
<th class="px-6 py-3 font-medium">{{ t('customer.related_customers') }}</th>
<th class="px-6 py-3 font-medium whitespace-nowrap w-44">{{ t('warehouse.created_at') }}</th>
<th class="px-6 py-3 font-medium w-28 text-right">{{ t('warehouse.actions') }}</th>
</tr>
@@ -302,7 +306,7 @@ onMounted(() => {
<tbody>
<!-- 加载中 -->
<tr v-if="loading">
<td colspan="7" class="px-6 py-8 text-center text-gray-400">
<td colspan="9" class="px-6 py-8 text-center text-gray-400">
<svg class="mx-auto mb-2 h-5 w-5 animate-spin text-gray-400" viewBox="0 0 24 24" fill="none">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v8H4z" />
@@ -312,7 +316,7 @@ onMounted(() => {
</tr>
<!-- 空状态 -->
<tr v-else-if="containers.length === 0">
<td colspan="7" class="px-6 py-8 text-center text-gray-400 dark:text-gray-500">
<td colspan="9" class="px-6 py-8 text-center text-gray-400 dark:text-gray-500">
{{ t('warehouse.no_containers') }}
</td>
</tr>
@@ -348,6 +352,30 @@ onMounted(() => {
{{ c.ItemCount }}
</span>
</td>
<td class="px-6 py-3 text-center">
<span
class="inline-flex items-center gap-1 rounded-full bg-orange-100 px-2 py-0.5 text-xs font-medium text-orange-700 dark:bg-orange-900/40 dark:text-orange-400"
>
<IconTool :size="12" />
{{ c.WorkOrderCount }}
</span>
</td>
<td class="px-6 py-3">
<div v-if="c.Customers && c.Customers.length > 0" class="flex flex-wrap gap-1">
<RouterLink
v-for="customer in c.Customers.slice(0, 3)"
:key="customer.id"
:to="`/customer/detail/${customer.id}`"
class="inline-flex items-center gap-1 rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 hover:bg-blue-200 dark:bg-blue-900/40 dark:text-blue-400 dark:hover:bg-blue-900/60"
@click.stop
>
<IconUser :size="10" />
{{ customer.first_name }} {{ customer.last_name }}
</RouterLink>
<span v-if="c.Customers.length > 3" class="text-xs text-gray-400">+{{ c.Customers.length - 3 }}</span>
</div>
<span v-else class="text-gray-400"></span>
</td>
<td class="px-6 py-3 whitespace-nowrap text-gray-500 dark:text-gray-400">{{ formatDate(c.CreatedAt) }}</td>
<td class="px-6 py-3 text-right" @click.stop>
<div class="flex items-center justify-end gap-1">
@@ -30,6 +30,11 @@ const pageSize = ref(10)
const currentPage = ref(1)
const search = ref('')
const loading = ref(false)
const stats = reactive({
total: 0,
inContainer: 0,
unstored: 0,
})
// ── 权限判断 ──
function canModifyItem(idx) {
@@ -90,6 +95,9 @@ function goPage(p) {
}
}
const totalPages = computed(() => Math.ceil(totalCount.value / pageSize.value) || 1)
const isEn = computed(() => locale.value === 'en')
const pageNumbers = computed(() => {
const total = totalPages.value
const cur = currentPage.value
@@ -155,7 +163,7 @@ onMounted(fetchItems)
</script>
<template>
<div class="p-4 max-w-6xl mx-auto space-y-4">
<div class="p-4 max-w-7xl mx-auto space-y-4">
<!-- 统计卡片 -->
<div class="grid grid-cols-3 gap-3">
@@ -246,7 +254,7 @@ onMounted(fetchItems)
<RouterLink
v-for="customer in item.Customers.slice(0, 3)"
:key="customer.id"
:to="`/customer/${customer.id}`"
:to="`/customer/detail/${customer.id}`"
class="inline-flex items-center gap-1 rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 hover:bg-blue-200 dark:bg-blue-900/40 dark:text-blue-400 dark:hover:bg-blue-900/60"
@click.stop
>
@@ -1,6 +1,6 @@
<script setup>
import { ref, reactive, computed, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useRouter, RouterLink } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { useToastStore } from '@/stores/toast'
import { useUsersStore } from '@/stores/users'
@@ -18,6 +18,8 @@ import {
IconTrash,
IconEdit,
IconArrowRight,
IconTool,
IconUser,
} from '@tabler/icons-vue'
usePageTitle('warehouse.overview')
@@ -338,7 +340,7 @@ onMounted(() => {
</script>
<template>
<div class="mx-auto max-w-6xl px-6 py-6 space-y-4">
<div class="mx-auto max-w-7xl px-6 py-6 space-y-4">
<!-- 统计卡片 -->
<div class="grid grid-cols-3 gap-4">
@@ -532,19 +534,21 @@ onMounted(() => {
<table class="w-full text-left text-sm text-gray-900 dark:text-white">
<thead>
<tr class="border-b border-gray-200 bg-gray-50 text-gray-500 dark:border-dk-muted dark:bg-dk-base dark:text-gray-400">
<th class="px-6 py-3 font-medium">{{ t('warehouse.item_name') }}</th>
<th class="px-6 py-3 font-medium">{{ t('warehouse.serial_number') }}</th>
<th class="px-6 py-3 font-medium">{{ t('warehouse.remark') }}</th>
<th class="px-6 py-3 font-medium w-20 text-center">{{ t('warehouse.quantity') }}</th>
<th class="px-6 py-3 font-medium">{{ t('warehouse.location') }}</th>
<th class="px-6 py-3 font-medium whitespace-nowrap">{{ t('warehouse.created_at') }}</th>
<th class="px-6 py-3 font-medium whitespace-nowrap">{{ t('warehouse.updated_at') }}</th>
<th class="px-6 py-3 font-medium">{{ t('warehouse.created_by') }}</th>
<th class="px-5 py-3 font-medium">{{ t('warehouse.item_name') }}</th>
<th class="px-5 py-3 font-medium">{{ t('warehouse.serial_number') }}</th>
<th class="px-5 py-3 font-medium">{{ t('warehouse.remark') }}</th>
<th class="px-5 py-3 font-medium w-20 text-center">{{ t('warehouse.quantity') }}</th>
<th class="px-5 py-3 font-medium w-24 text-center">{{ t('work_order.work_order_count') }}</th>
<th class="px-5 py-3 font-medium">{{ t('customer.related_customers') }}</th>
<th class="px-5 py-3 font-medium whitespace-nowrap">{{ t('warehouse.created_at') }}</th>
<th class="px-5 py-3 font-medium whitespace-nowrap">{{ t('warehouse.updated_at') }}</th>
<th class="px-5 py-3 font-medium">{{ t('warehouse.created_by') }}</th>
<th class="px-5 py-3 font-medium w-20 text-right">{{ t('warehouse.actions') }}</th>
</tr>
</thead>
<tbody>
<tr v-if="itemLoading">
<td colspan="8" class="px-6 py-8 text-center text-gray-400">
<td colspan="10" class="px-6 py-8 text-center text-gray-400">
<svg class="mx-auto mb-2 h-5 w-5 animate-spin text-gray-400" viewBox="0 0 24 24" fill="none">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v8H4z" />
@@ -553,7 +557,7 @@ onMounted(() => {
</td>
</tr>
<tr v-else-if="items.length === 0">
<td colspan="8" class="px-6 py-8 text-center text-gray-400 dark:text-gray-500">
<td colspan="10" class="px-6 py-8 text-center text-gray-400 dark:text-gray-500">
{{ t('warehouse.no_items') }}
</td>
</tr>
@@ -563,22 +567,36 @@ onMounted(() => {
class="cursor-pointer border-b border-gray-100 transition-colors hover:bg-gray-50 dark:border-dk-muted dark:hover:bg-dk-base"
@click="goToItemDetail(item)"
>
<td class="px-6 py-3 font-medium max-w-[200px] truncate">{{ item.Name }}</td>
<td class="px-6 py-3 max-w-[160px] truncate text-xs text-gray-500 dark:text-gray-400">{{ item.SerialNumber || '—' }}</td>
<td class="px-6 py-3 max-w-[200px] truncate text-xs text-gray-500 dark:text-gray-400">{{ item.Remark || '—' }}</td>
<td class="px-6 py-3 text-center text-sm">{{ item.Quantity }}</td>
<td class="px-6 py-3">
<span v-if="item.ContainerBreadcrumb" class="inline-flex items-center gap-1 text-sm text-blue-600">
<IconArrowRight :size="13" />
<span class="max-w-[200px] truncate">{{ item.ContainerBreadcrumb }}</span>
</span>
<span v-else class="inline-flex items-center gap-1 text-xs text-orange-500">
{{ t('warehouse.unstored_items') }}
<td class="px-5 py-3 font-medium max-w-xs truncate">{{ item.Name }}</td>
<td class="px-5 py-3 text-xs text-gray-500 dark:text-gray-400 max-w-[140px] truncate">{{ item.SerialNumber || '—' }}</td>
<td class="px-5 py-3 text-xs text-gray-500 dark:text-gray-400 max-w-[200px] truncate">{{ item.Remark || '—' }}</td>
<td class="px-5 py-3 text-center text-sm">{{ item.Quantity }}</td>
<td class="px-5 py-3 text-center">
<span v-if="item.WorkOrderCount > 0" class="inline-flex items-center gap-1 rounded-full bg-orange-100 px-2 py-0.5 text-xs font-medium text-orange-700 dark:bg-orange-900/40 dark:text-orange-400">
<IconTool :size="12" />
{{ item.WorkOrderCount }}
</span>
<span v-else class="text-gray-400"></span>
</td>
<td class="px-6 py-3 whitespace-nowrap text-xs text-gray-400 dark:text-gray-500">{{ formatDate(item.CreatedAt) }}</td>
<td class="px-6 py-3 whitespace-nowrap text-xs text-gray-400 dark:text-gray-500">{{ formatDate(item.UpdatedAt) }}</td>
<td class="px-6 py-3">
<td class="px-5 py-3">
<div v-if="item.Customers && item.Customers.length > 0" class="flex flex-wrap gap-1">
<RouterLink
v-for="customer in item.Customers.slice(0, 3)"
:key="customer.id"
:to="`/customer/detail/${customer.id}`"
class="inline-flex items-center gap-1 rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 hover:bg-blue-200 dark:bg-blue-900/40 dark:text-blue-400 dark:hover:bg-blue-900/60"
@click.stop
>
<IconUser :size="10" />
{{ customer.first_name }} {{ customer.last_name }}
</RouterLink>
<span v-if="item.Customers.length > 3" class="text-xs text-gray-400">+{{ item.Customers.length - 3 }}</span>
</div>
<span v-else class="text-gray-400"></span>
</td>
<td class="px-5 py-3 text-xs text-gray-400 dark:text-gray-500 whitespace-nowrap">{{ formatDate(item.CreatedAt) }}</td>
<td class="px-5 py-3 text-xs text-gray-400 dark:text-gray-500 whitespace-nowrap">{{ formatDate(item.UpdatedAt) }}</td>
<td class="px-5 py-3">
<div class="flex items-center gap-1.5">
<img
:src="usersStore.getAvatarUrlFromUserID(item.CreatorID)"
@@ -587,6 +605,14 @@ onMounted(() => {
<span class="truncate text-gray-600 dark:text-gray-400">{{ usersStore.getUsernameFromUserID(item.CreatorID) }}</span>
</div>
</td>
<td class="px-5 py-3 text-right">
<button
class="text-xs text-blue-500 hover:underline"
@click.stop="goToItemDetail(item)"
>
{{ t('warehouse.view_items') }}
</button>
</td>
</tr>
</tbody>
</table>