From 5d31cb5f1fb32a478d5b751ebfe97d47db890778 Mon Sep 17 00:00:00 2001
From: zhou zhou <3272660260@qq.com>
Date: 星期三, 01 四月 2026 14:17:42 +0800
Subject: [PATCH] #前端
---
rsf-design/src/components/core/layouts/art-page-content/index.vue | 58 ++++++++++++++
rsf-design/src/views/basic-info/wh-mat/index.vue | 157 ++++++++++++++++++++------------------
2 files changed, 139 insertions(+), 76 deletions(-)
diff --git a/rsf-design/src/components/core/layouts/art-page-content/index.vue b/rsf-design/src/components/core/layouts/art-page-content/index.vue
index 5b7da73..b98d865 100644
--- a/rsf-design/src/components/core/layouts/art-page-content/index.vue
+++ b/rsf-design/src/components/core/layouts/art-page-content/index.vue
@@ -14,7 +14,15 @@
</div>
</div>
- <RouterView v-if="isRefresh" v-slot="{ Component, route }" :style="contentStyle">
+ <div v-if="routeRenderError" class="art-page-view art-route-state">
+ <div class="art-route-state__panel">
+ <div class="art-route-state__title">椤甸潰鍔犺浇澶辫触</div>
+ <div class="art-route-state__desc">{{ routeRenderError }}</div>
+ <ElButton type="primary" @click="reloadCurrentRoute">閲嶆柊鍔犺浇</ElButton>
+ </div>
+ </div>
+
+ <RouterView v-else-if="isRefresh" v-slot="{ Component, route }" :style="contentStyle">
<!-- 缂撳瓨璺敱鍔ㄧ敾 -->
<Transition :name="showTransitionMask ? '' : actualTransition" mode="out-in" appear>
<KeepAlive :max="10" :exclude="keepAliveExclude">
@@ -61,6 +69,7 @@
const isOpenRouteInfo = import.meta.env.VITE_OPEN_ROUTE_INFO
const showTransitionMask = ref(false)
const isFirstLoad = ref(true)
+ const routeRenderError = ref('')
const isFullPage = computed(() => route.matched.some((r) => r.meta?.isFullPage))
const prevIsFullPage = ref(isFullPage.value)
const actualTransition = computed(() => {
@@ -103,10 +112,57 @@
isRefresh.value = true
})
}
+ const reloadCurrentRoute = () => {
+ routeRenderError.value = ''
+ reload()
+ }
watch(refresh, reload, { flush: 'post' })
+ watch(
+ () => route.fullPath,
+ () => {
+ routeRenderError.value = ''
+ }
+ )
+ onErrorCaptured((error) => {
+ routeRenderError.value = error instanceof Error ? error.message : String(error || '椤甸潰娓叉煋寮傚父')
+ return false
+ })
onMounted(() => {
nextTick(() => {
isFirstLoad.value = false
})
})
</script>
+
+<style scoped>
+ .art-route-state {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ min-height: 320px;
+ }
+
+ .art-route-state__panel {
+ width: min(560px, 100%);
+ padding: 28px 32px;
+ background: var(--default-box-color);
+ border: 1px solid var(--art-card-border);
+ border-radius: calc(var(--custom-radius) + 6px);
+ box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
+ }
+
+ .art-route-state__title {
+ font-size: 18px;
+ font-weight: 600;
+ color: var(--art-text-primary);
+ }
+
+ .art-route-state__desc {
+ margin-top: 8px;
+ margin-bottom: 16px;
+ color: var(--art-text-secondary);
+ line-height: 1.7;
+ word-break: break-word;
+ }
+
+</style>
diff --git a/rsf-design/src/views/basic-info/wh-mat/index.vue b/rsf-design/src/views/basic-info/wh-mat/index.vue
index 6533a23..240aff5 100644
--- a/rsf-design/src/views/basic-info/wh-mat/index.vue
+++ b/rsf-design/src/views/basic-info/wh-mat/index.vue
@@ -1,83 +1,89 @@
<template>
- <div class="wh-mat-page art-full-height">
- <div class="wh-mat-page__sidebar">
- <ElCard class="wh-mat-page__sidebar-card">
- <div class="mb-3 flex items-center justify-between gap-3">
- <div>
- <div class="text-base font-medium text-[var(--art-text-primary)]">鐗╂枡鍒嗙粍</div>
- <div class="text-xs text-[var(--art-text-secondary)]">
- {{ selectedGroupLabel }}
- </div>
- </div>
- <ElButton text @click="handleResetGroup">鍏ㄩ儴</ElButton>
- </div>
-
- <div class="mb-3 flex items-center gap-2">
- <ElInput
- v-model.trim="groupSearch"
- clearable
- placeholder="鎼滅储鐗╂枡鍒嗙粍"
- @clear="handleGroupSearch"
- @keyup.enter="handleGroupSearch"
- />
- <ElButton @click="handleGroupSearch">鎼滅储</ElButton>
- </div>
-
- <ElScrollbar class="wh-mat-page__tree-scroll pr-1">
- <div v-if="groupTreeLoading" class="py-6">
- <ElSkeleton :rows="10" animated />
- </div>
- <ElEmpty v-else-if="!groupTreeData.length" description="鏆傛棤鐗╂枡鍒嗙粍" />
- <ElTree
- v-else
- :data="groupTreeData"
- :props="treeProps"
- node-key="id"
- highlight-current
- default-expand-all
- :current-node-key="selectedGroupId"
- @node-click="handleGroupNodeClick"
- >
- <template #default="{ data }">
- <div class="flex items-center gap-2">
- <span class="font-medium">{{ data.name || '--' }}</span>
- <span class="text-xs text-[var(--art-text-secondary)]">{{ data.code || '--' }}</span>
+ <div class="wh-mat-page-root">
+ <div class="wh-mat-page art-full-height">
+ <div class="wh-mat-page__sidebar">
+ <ElCard class="wh-mat-page__sidebar-card">
+ <div class="mb-3 flex items-center justify-between gap-3">
+ <div>
+ <div class="text-base font-medium text-[var(--art-text-primary)]">鐗╂枡鍒嗙粍</div>
+ <div class="text-xs text-[var(--art-text-secondary)]">
+ {{ selectedGroupLabel }}
+ </div>
</div>
- </template>
- </ElTree>
- </ElScrollbar>
- </ElCard>
+ <ElButton text @click="handleResetGroup">鍏ㄩ儴</ElButton>
+ </div>
+
+ <div class="mb-3 flex items-center gap-2">
+ <ElInput
+ v-model.trim="groupSearch"
+ clearable
+ placeholder="鎼滅储鐗╂枡鍒嗙粍"
+ @clear="handleGroupSearch"
+ @keyup.enter="handleGroupSearch"
+ />
+ <ElButton @click="handleGroupSearch">鎼滅储</ElButton>
+ </div>
+
+ <ElScrollbar class="wh-mat-page__tree-scroll pr-1">
+ <div v-if="groupTreeLoading" class="py-6">
+ <ElSkeleton :rows="10" animated />
+ </div>
+ <ElEmpty v-else-if="!groupTreeData.length" description="鏆傛棤鐗╂枡鍒嗙粍" />
+ <ElTree
+ v-else
+ :data="groupTreeData"
+ :props="treeProps"
+ node-key="id"
+ highlight-current
+ default-expand-all
+ :current-node-key="selectedGroupId"
+ @node-click="handleGroupNodeClick"
+ >
+ <template #default="{ data }">
+ <div class="flex items-center gap-2">
+ <span class="font-medium">{{ data.name || '--' }}</span>
+ <span class="text-xs text-[var(--art-text-secondary)]">{{ data.code || '--' }}</span>
+ </div>
+ </template>
+ </ElTree>
+ </ElScrollbar>
+ </ElCard>
+ </div>
+
+ <div class="wh-mat-page__content">
+ <ArtSearchBar
+ v-model="searchForm"
+ :items="searchItems"
+ :showExpand="true"
+ @search="handleSearch"
+ @reset="handleReset"
+ />
+
+ <ElCard class="art-table-card">
+ <ArtTableHeader :loading="loading" v-model:columns="columnChecks" @refresh="loadMatnrList" />
+
+ <ArtTable
+ :loading="loading"
+ :data="tableData"
+ :columns="columns"
+ :pagination="pagination"
+ @pagination:size-change="handleSizeChange"
+ @pagination:current-change="handleCurrentChange"
+ >
+ <template #action="{ row }">
+ <ArtButtonTable icon="ri:eye-line" @click="openDetailDrawer(row)" />
+ </template>
+ </ArtTable>
+ </ElCard>
+ </div>
</div>
- <div class="wh-mat-page__content">
- <ArtSearchBar
- v-model="searchForm"
- :items="searchItems"
- :showExpand="true"
- @search="handleSearch"
- @reset="handleReset"
- />
-
- <ElCard class="art-table-card">
- <ArtTableHeader :loading="loading" v-model:columns="columnChecks" @refresh="loadMatnrList" />
-
- <ArtTable
- :loading="loading"
- :data="tableData"
- :columns="columns"
- :pagination="pagination"
- @pagination:size-change="handleSizeChange"
- @pagination:current-change="handleCurrentChange"
- >
- <template #action="{ row }">
- <ArtButtonTable icon="ri:eye-line" @click="openDetailDrawer(row)" />
- </template>
- </ArtTable>
- </ElCard>
- </div>
+ <WhMatDetailDrawer
+ v-model:visible="detailDrawerVisible"
+ :loading="detailLoading"
+ :detail="detailData"
+ />
</div>
-
- <WhMatDetailDrawer v-model:visible="detailDrawerVisible" :loading="detailLoading" :detail="detailData" />
</template>
<script setup>
@@ -333,6 +339,7 @@
<style scoped>
.wh-mat-page {
display: flex;
+ flex-direction: row;
align-items: flex-start;
gap: 16px;
}
--
Gitblit v1.9.1