diff --git a/.env.dev b/.env.dev index 35e039f0..99a26f2b 100644 --- a/.env.dev +++ b/.env.dev @@ -10,11 +10,11 @@ VUE_APP_TITLE = 洛玻集团驾驶舱 # VUE_APP_BASE_API = 'http://172.16.33.83:7070' # 杨姗姗 -VUE_APP_BASE_API = 'http://172.16.20.218:8080' +# VUE_APP_BASE_API = 'http://172.16.20.218:8080' # 小田 # VUE_APP_BASE_API = 'http://172.16.19.232:7070' # 测试 -# VUE_APP_BASE_API = 'http://192.168.0.35:8080' +VUE_APP_BASE_API = 'http://192.168.0.35:8080' # 闫阳 # VUE_APP_BASE_API = 'http://172.16.19.131:7070' diff --git a/docs/驾驶舱-路由返回状态保持.md b/docs/驾驶舱-路由返回状态保持.md new file mode 100644 index 00000000..c5b97c88 --- /dev/null +++ b/docs/驾驶舱-路由返回状态保持.md @@ -0,0 +1,245 @@ +# 驾驶舱：导航状态管理方案 + +## 需求概述 + +1. **页面通过菜单进入**：不清空 sessionStorage，使用新日期 +2. **页面带参数跳转**：记录 sessionStorage +3. **sessionStorage 作为容器**： + - 点击跳转（非菜单点击）→ sessionStorage 多一条 + - 点击返回 → sessionStorage 少一条 + - 返回到最开始的页面 → sessionStorage 为空 + - sessionStorage 为空 → 返回按钮消失 +4. **多页面跳转支持**：A 可跳到 E，B 也可跳到 E，返回时能回到来源页面 + +## 方案设计：导航栈 + 页面状态分离 + +### sessionStorage 结构 + +```javascript +// 导航栈：记录访问路径 +key: 'cockpit_nav_stack' +value: [ + { path: '/operatingRevenue', timestamp: 123456 }, + { path: '/operatingRevenueBase', timestamp: 123457 } +] + +// 各页面状态：记录业务数据 +key: 'cockpit_nav_state_/operatingRevenue' +value: { dateData: {...}, factory: 'xxx', toPage: '/operatingRevenueBase' } +``` + +### 核心 API + +```javascript +import { + pushNavigation, // 跳转前调用，将当前页面入栈 + popNavigation, // 返回时调用，出栈并返回前一个页面 + getNavStackLength, // 获取栈长度（用于返回按钮显示） + clearNavigation, // 菜单进入时清空所有（会触发 navigation-cleared 事件） + saveNavigationState, // 保存页面状态 + consumeNavigationState // 消费页面状态 +} from '@/utils/navigationReturnState'; +``` + +### 核心流程 + +| 场景 | 操作 | 结果 | +|------|------|------| +| **菜单进入** | `clearNavigation()` | 清空栈和所有状态，触发 `navigation-cleared` 事件 | +| **A 跳转 B** | `pushNavigation('/A')` + `saveNavigationState('/A', {...})` | 栈长度 +1 | +| **B 返回 A** | `popNavigation()` → 跳转 | 栈长度 -1，状态自动恢复 | +| **栈为空** | 返回按钮隐藏 | 无历史记录 | + +### 跳转时的调用示例 + +```javascript +// A 页面跳转 B +const currentPath = this.$route.path; +const state = { + dateData: { startTime: this.dateData.startTime, endTime: this.dateData.endTime }, + factory: this.$route.query.factory, + toPage: '/B' // 要跳转的目标页面 +}; +pushNavigation(currentPath, state); // 入栈 +saveNavigationState(currentPath, state); // 保存状态 +this.$router.push({ path: '/B', query: {...} }); +``` + +### 返回按钮逻辑（noRouterHeader.vue） + +```javascript +// data +data() { + return { + navStackLength: 0, // 存储栈长度 + } +}, + +// computed：基于 navStackLength 显示按钮 +computed: { + showReturnBtn() { + return this.navStackLength > 0; + } +}, + +// watch：监听菜单进入和路由变化 +watch: { + '$route.query.menu': { + immediate: true, + handler(menuFlag) { + if (menuFlag === '1') { + this.$nextTick(() => { + this.updateNavStackLength(); + }); + } + } + }, + $route() { + this.updateNavStackLength(); + } +}, + +// 生命周期：监听 navigation-cleared 事件 +mounted() { + this.updateNavStackLength(); + window.addEventListener('navigation-cleared', this.handleNavigationCleared); +}, +beforeDestroy() { + window.removeEventListener('navigation-cleared', this.handleNavigationCleared); +}, + +methods: { + updateNavStackLength() { + this.navStackLength = getNavStackLength(); + }, + handleNavigationCleared() { + this.updateNavStackLength(); // 收到清空事件后立即更新 + }, + handleReturn() { + this.$emit('before-return'); + const prev = popNavigation(); // 出栈 + if (prev && prev.path) { + this.$router.push(prev.path); + } else { + this.$router.go(-1); + } + } +} +``` + +### 列表页 mounted 时恢复状态 + +```javascript +mounted() { + // 菜单进入时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } + + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData) { + this.dateData = saved.dateData; + this.getData(); + } +} +``` + +## 涉及文件 + +### 工具类 + +- `src/utils/navigationReturnState.js`： + - 提供导航栈管理 API + - `clearNavigation()` 执行后触发 `navigation-cleared` 事件 + +### 公共组件 + +- `src/views/home/components/noRouterHeader.vue`： + - `showReturnBtn` 根据 `navStackLength` 显示/隐藏返回按钮 + - `handleNavigationCleared` 监听 `navigation-cleared` 事件 + - `updateNavStackLength` 更新栈长度 + - `handleReturn` 出栈并跳转到前一个页面 + +- `src/layout/components/AppMain.vue`： + - `key` 使用 `$route.fullPath`（包含 query 参数），确保组件能正确刷新 + +- `src/layout/components/Sidebar/Link.vue`： + - 点击菜单时自动添加 `menu=1` 和 `_t` 时间戳参数 + +### 跳转组件（点击跳转） + +| 文件 | 改动 | +|------|------| +| `operatingLineBarSale.vue` | 跳转前调用 `pushNavigation` + `saveNavigationState` | +| `yearRelatedMetrics.vue` | 跳转前调用 `pushNavigation` + `saveNavigationState` | +| `monthlyRelatedMetrics.vue` | 跳转前调用 `pushNavigation` + `saveNavigationState` | + +### 详情页 + +| 文件 | 改动 | +|------|------| +| `operatingRevenueBase.vue` | `@before-return` 时无需额外保存（已由跳转组件保存） | +| `salesVolumeAnalysisBase.vue` | 同上 | +| `unitPriceAnalysisBase.vue` | 同上 | + +### 列表页（菜单入口） + +| 文件 | 改动 | +|------|------| +| `operatingRevenue.vue` | `mounted` 时检测 `menu=1` 调用 `clearNavigation()`，并调用 `consumeNavigationState` 恢复状态 | +| `totalProfit.vue` | 同上 | +| `salesVolumeAnalysis.vue` | 同上 | +| `unitPriceAnalysis.vue` | 同上 | +| `expenseAnalysis.vue` | 同上 | +| `grossMargin.vue` | 同上 | +| `fullCostAnalysis.vue` | 同上 | +| `electricityCostAnalysis.vue` | 同上 | +| `inputOutputRatio.vue` | 同上 | +| `netPriceAnalysis.vue` | 同上 | +| `operatingProfit.vue` | 同上 | +| `procurementGainAnalysis.vue` | 同上 | +| `rawSheetYield.vue` | 同上 | +| `productionCostAnalysis.vue` | 同上 | +| `depreciationAnalysis.vue` | 同上 | +| `inventoryAnalysis.vue` | 同上 | +| `accountsReceivable.vue` | 同上 | + +## 注意事项 + +1. **菜单进入清空**：需要在页面入口处调用 `clearNavigation()` +2. **状态键名**：使用页面路径作为键名，如 `/operatingRevenue` +3. **consume 即删除**：`consumeNavigationState` 读取后立即删除 +4. **返回按钮同步**：通过 `navigation-cleared` 事件确保 sessionStorage 清空后返回按钮立即隐藏 +5. **多页面跳转**：导航栈记录完整路径链，支持任意页面间的跳转和返回 +6. **组件刷新**：AppMain 的 key 使用 fullPath，确保带参数的路由能正确刷新组件 +7. **菜单参数**：Link.vue 自动添加 `menu=1` 和 `_t` 时间戳，确保每次 URL 不同 +8. **额外字段配置**：`navigationExtraFields` 必须配置（重要！） + - 如果页面需要额外参数（如 `meterialName`）恢复，必须在组件 `data` 中配置 `navigationExtraFields` + - 格式：`navigationExtraFields: { 字段名: 默认值 }` + - 示例：`navigationExtraFields: { meterialName: '氢氧化铝' }` + - 缺少此配置会导致从详情页返回时额外参数无法恢复 +9. **getData 调用条件**：mixin 回调中 `getData()` 的调用条件 + - 原条件：`if (factory != null && dateData && dateData.startTime != null)` + - 问题：从浏览器直接打开页面时，`dateData.startTime` 为 null，导致 `getData()` 不执行 + - 建议条件：`if (factory != null)` 只要 factory 有值就获取数据 +10. **B→C→B 返回场景分析**： + | 进入 B 方式 | URL 参数 | sessionStorage | 状态恢复来源 | 备注 | + |-------------|----------|-----------------|--------------|------| + | 菜单直接进入 | 无 | 清空 | store 默认值 | 无返回按钮 | + | 从 A 页面跳转 | 有 | 有 | URL 参数 | 需配置 `navigationExtraFields` | + | 从 C 返回 B | 无 | 有 | sessionStorage | 需配置 `navigationExtraFields` | + - 从浏览器直接打开 B → 跳转 C → C 返回 B 时：`dateData.startTime` 可能为 null，需放宽 `getData()` 调用条件 +11. **mixin 使用方式**：`mixins: [navigationStateMixin]` 后，需在组件 `created` 钩子中手动调用 `_initNavigationStateMixin(callback)` + - mixin **不自动执行** `created` 钩子，避免 `_navigationStateInitialized` 标记冲突 + - callback 回调参数：`{ factory, dateData, ...extraFields }` + - 示例： + ```javascript + created() { + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); + } + ``` diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue index f4e74dbd..32193ad3 100644 --- a/src/layout/components/AppMain.vue +++ b/src/layout/components/AppMain.vue @@ -20,7 +20,8 @@ export default { return this.$store.state.tagsView.cachedViews }, key() { - return this.$route.path + // 包含 query 参数，确保带参数的路由能正确刷新组件 + return this.$route.fullPath } } } diff --git a/src/layout/components/Sidebar/Link.vue b/src/layout/components/Sidebar/Link.vue index 530b3d5b..29ae4396 100644 --- a/src/layout/components/Sidebar/Link.vue +++ b/src/layout/components/Sidebar/Link.vue @@ -35,7 +35,10 @@ export default { } } return { - to: to + to: { + path: to, + query: { menu: '1', _t: Date.now() } // 菜单入口标记，_t确保每次URL不同，触发组件更新 + } } } } diff --git a/src/router/index.js b/src/router/index.js index 9172891f..3bab6dd8 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -304,9 +304,11 @@ Router.prototype.push = function push(location) { return routerPush.call(this, location).catch(err => err) } -export default new Router({ +const router = new Router({ base: process.env.VUE_APP_APP_NAME ? process.env.VUE_APP_APP_NAME : "/", mode: 'hash', // 去掉url中的# scrollBehavior: () => ({ y: 0 }), routes: constantRoutes -}) +}); + +export default router; diff --git a/src/utils/mixins/navigationStateMixin.js b/src/utils/mixins/navigationStateMixin.js new file mode 100644 index 00000000..cc0a3dfa --- /dev/null +++ b/src/utils/mixins/navigationStateMixin.js @@ -0,0 +1,219 @@ +/** + * 驾驶舱页面导航状态恢复 Mixin + * 用于：从 C 页面返回时恢复状态（dateData、factory） + * 使用方式：在组件中 import 并添加到 mixins 数组 + * + * 3 种进入方式及优先级： + * 1. 菜单直接进入 → URL 无参数，sessionStorage 无状态 → 使用默认值 + * 2. A 页面跳转进入 → URL 有参数 ?factory=9&startTime=... → 使用 URL 参数 + * 3. C 页面返回进入 → URL 无参数，sessionStorage 有状态 → 使用 sessionStorage 恢复 + * + * 额外字段配置（可选）： + * 有些页面需要额外字段（如 meterialName），需要在组件 data 中配置： + * navigationExtraFields: { + * meterialName: '氢氧化铝' // 字段名: 默认值 + * } + * 组件中也需要定义对应的 data 字段：meterialName: '氢氧化铝' + */ + +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState' + +export default { + data() { + return { + // 公共状态字段（可被子组件覆盖） + dateData: {}, + factory: null, + // 有效基地 ID 列表 + validFactoryIds: [5, 2, 7, 3, 8, 9, 10, 6], + // 额外字段配置（可被子组件覆盖） + // 格式：{ 字段名: 默认值 } + // 例如：{ meterialName: '氢氧化铝' } + navigationExtraFields: {} + } + }, + methods: { + /** + * 初始化导航状态恢复 + * @param {Function} onStateRestored - 状态恢复后的回调（用于调用 getData） + */ + _initNavigationStateMixin(onStateRestored) { + const currentPath = this.$route.path + const query = this.$route.query + + // 防止重复初始化 - 使用实例属性作为标记 + if (this._navigationStateInitialized) { + return + } + this._navigationStateInitialized = true + + // 菜单入口时，先清空 sessionStorage，避免旧数据影响 + if (query.menu === '1') { + clearNavigation() + } + + const saved = consumeNavigationState(currentPath) + + // ========== 处理 factory ========== + const urlFactoryNum = query.factory != null && query.factory !== '' ? Number(query.factory) : null + const hasUrlFactory = urlFactoryNum != null && this.validFactoryIds.includes(urlFactoryNum) + let restoredFactory = false + + // 方式 2：URL 有有效参数 + if (hasUrlFactory) { + this.factory = urlFactoryNum + restoredFactory = true + } + + // 方式 3：从 sessionStorage 恢复 + if (saved && !restoredFactory) { + const savedFactoryNum = Number(saved.factory) + if (saved.factory != null && this.validFactoryIds.includes(savedFactoryNum)) { + this.factory = savedFactoryNum + restoredFactory = true + } + } + + // 方式 1：使用 store 默认值 + if (!restoredFactory) { + if (this.$store.getters.levelList && this.$store.getters.levelList.length > 0) { + const validBases = this.$store.getters.levelList.filter(item => item.id !== 1) + if (validBases.length > 0) { + this.factory = validBases[0].id + } else { + this.factory = this.$store.getters.levelList[0].id + } + } + } + + // ========== 处理 dateData ========== + const hasUrlDateData = (query.startTime && query.endTime) || + (typeof query.dateData === 'string' && query.dateData && query.dateData !== '[object Object]') + let restoredDateData = false + + // 方式 2：URL 有参数 + if (hasUrlDateData) { + if (query.startTime && query.endTime) { + this.dateData = { + startTime: Number(query.startTime), + endTime: Number(query.endTime) + } + } else if (typeof query.dateData === 'string') { + try { + const parsed = JSON.parse(query.dateData) + if (parsed && parsed.startTime != null && parsed.endTime != null) { + this.dateData = parsed + } + } catch (e) { /* ignore */ } + } + restoredDateData = true + } + + // 方式 3：从 sessionStorage 恢复 + if (saved && !restoredDateData) { + if (saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + } + restoredDateData = true + } + } + + // ========== 处理额外字段（如 meterialName）========== + const extraFields = this.navigationExtraFields || {} + const extraFieldKeys = Object.keys(extraFields) + const extraFieldResults = {} + + extraFieldKeys.forEach(fieldName => { + const defaultValue = extraFields[fieldName] + let restored = false + + // 方式 2：URL 有参数 + if (query[fieldName] != null && query[fieldName] !== '') { + this[fieldName] = query[fieldName] + restored = true + extraFieldResults[fieldName] = { source: 'url', value: query[fieldName] } + } + + // 方式 3：从 sessionStorage 恢复 + if (saved && !restored && saved[fieldName] != null) { + this[fieldName] = saved[fieldName] + restored = true + extraFieldResults[fieldName] = { source: 'sessionStorage', value: saved[fieldName] } + } + + // 方式 1：使用默认值 + if (!restored) { + this[fieldName] = defaultValue + extraFieldResults[fieldName] = { source: 'default', value: defaultValue } + } + }) + + // 状态恢复完成后，调用回调 + this.$nextTick(() => { + if (onStateRestored) { + onStateRestored({ + factory: this.factory, + dateData: this.dateData, + ...extraFieldResults + }) + } else if (this._onNavigationStateRestored) { + this._onNavigationStateRestored({ + factory: this.factory, + dateData: this.dateData, + ...extraFieldResults + }) + } + }) + }, + + /** + * 保存当前页面状态到 sessionStorage + * @param {string} targetPath - 目标页面路径 + * @param {object} extraState - 额外要保存的状态（可选，用于动态添加字段） + */ + _saveNavigationState(targetPath, extraState = {}) { + const { pushNavigation, saveNavigationState } = require('@/utils/navigationReturnState') + const currentPath = this.$route.path + + // 收集额外字段 + const extraFields = this.navigationExtraFields || {} + const extraFieldData = {} + Object.keys(extraFields).forEach(fieldName => { + if (this[fieldName] != null) { + extraFieldData[fieldName] = this[fieldName] + } + }) + + const state = { + dateData: this.dateData && this.dateData.startTime != null ? { + startTime: this.dateData.startTime, + endTime: this.dateData.endTime + } : undefined, + factory: this.factory, + ...extraFieldData, + ...extraState + } + pushNavigation(currentPath, state) + saveNavigationState(currentPath, state) + + // 构建 URL query + const query = { + factory: this.factory != null ? String(this.factory) : '', + startTime: this.dateData && this.dateData.startTime != null ? String(this.dateData.startTime) : '', + endTime: this.dateData && this.dateData.endTime != null ? String(this.dateData.endTime) : '' + } + + // 添加额外字段到 query + Object.keys(extraFieldData).forEach(fieldName => { + query[fieldName] = extraFieldData[fieldName] + }) + + return { + path: targetPath, + query + } + } + } +} diff --git a/src/utils/navigationReturnState.js b/src/utils/navigationReturnState.js new file mode 100644 index 00000000..c9095dfd --- /dev/null +++ b/src/utils/navigationReturnState.js @@ -0,0 +1,169 @@ +/** + * 驾驶舱导航状态管理 + * 核心逻辑： + * - 菜单进入：清空导航栈 + * - 页面跳转 push：当前页面状态入栈 + * - 返回 go(-1)：出栈，恢复前一个页面状态 + * - 返回按钮：栈长度 > 0 时显示 + */ + +const STACK_KEY = 'cockpit_nav_stack'; +const STATE_PREFIX = 'cockpit_nav_state_'; + +/** + * 获取导航栈 + * @returns {Array<{ path: string, state: object }>} + */ +export function getNavStack() { + try { + const raw = sessionStorage.getItem(STACK_KEY); + if (!raw) return []; + return JSON.parse(raw); + } catch (e) { + return []; + } +} + +/** + * 获取导航栈长度 + * @returns {number} + */ +export function getNavStackLength() { + return getNavStack().length; +} + +/** + * 页面跳转时调用：将当前页面状态入栈 + * @param {string} fromPath - 来源页面路径 + * @param {object} state - 来源页面的业务状态（如 dateData） + */ +export function pushNavigation(fromPath, state = {}) { + if (!fromPath) return; + try { + const stack = getNavStack(); + stack.push({ + path: fromPath, + state, + timestamp: Date.now() + }); + sessionStorage.setItem(STACK_KEY, JSON.stringify(stack)); + console.log('[navigation] push', fromPath, 'stack length:', stack.length); + } catch (e) { + console.warn('[navigation] push failed', e); + } +} + +/** + * 返回时调用：出栈，返回前一个页面信息 + * @returns {{ path: string, state: object } | null} + */ +export function popNavigation() { + try { + const stack = getNavStack(); + if (stack.length === 0) return null; + const prev = stack.pop(); + sessionStorage.setItem(STACK_KEY, JSON.stringify(stack)); + console.log('[navigation] pop', prev.path, 'stack length:', stack.length); + return prev; + } catch (e) { + console.warn('[navigation] pop failed', e); + return null; + } +} + +/** + * 清空导航栈和所有页面状态 + */ +export function clearNavigation() { + try { + // 清空栈 + sessionStorage.removeItem(STACK_KEY); + // 清空所有页面状态 + Object.keys(sessionStorage) + .filter(k => k.startsWith(STATE_PREFIX)) + .forEach(k => sessionStorage.removeItem(k)); + console.log('[navigation] cleared'); + // 通知所有监听器 + window.dispatchEvent(new Event('navigation-cleared')); + } catch (e) { + console.warn('[navigation] clear failed', e); + } +} + +/** + * 获取指定页面的状态 + * @param {string} path - 页面路径 + * @returns {object | null} + */ +export function getNavigationState(path) { + if (!path) return null; + try { + const key = STATE_PREFIX + path; + const raw = sessionStorage.getItem(key); + if (!raw) return null; + return JSON.parse(raw); + } catch (e) { + return null; + } +} + +/** + * 消费（读取并删除）指定页面的状态 + * @param {string} path - 页面路径 + * @returns {object | null} + */ +export function consumeNavigationState(path) { + if (!path) return null; + try { + const key = STATE_PREFIX + path; + const raw = sessionStorage.getItem(key); + if (!raw) return null; + sessionStorage.removeItem(key); + return JSON.parse(raw); + } catch (e) { + try { + sessionStorage.removeItem(STATE_PREFIX + path); + } catch (e2) { /* ignore */ } + return null; + } +} + +/** + * 保存指定页面的状态 + * @param {string} path - 页面路径 + * @param {object} state - 业务状态 + */ +export function saveNavigationState(path, state) { + if (!path) return; + try { + const key = STATE_PREFIX + path; + sessionStorage.setItem(key, JSON.stringify(state)); + } catch (e) { + console.warn('[navigation] save state failed', e); + } +} + +// ============ 兼容旧 API（后续可逐步移除）=========== + +/** + * @deprecated 使用 pushNavigation 代替 + */ +export function saveNavigationReturnState(scope, state) { + console.warn('[navigation] saveNavigationReturnState 已废弃，请使用 pushNavigation + saveNavigationState'); +} + +/** + * @deprecated 使用 consumeNavigationState 代替 + */ +export function consumeNavigationReturnState(scope) { + console.warn('[navigation] consumeNavigationReturnState 已废弃，请使用 popNavigation + consumeNavigationState'); + return null; +} + +/** + * @deprecated + */ +export function getNavScope(moduleName) { + console.warn('[navigation] getNavScope 已废弃，请直接使用路径作为 key'); + return `nav:${moduleName}`; +} diff --git a/src/views/home/accountsReceivable/accountsReceivable.vue b/src/views/home/accountsReceivable/accountsReceivable.vue index f31bb11c..d8ad94f5 100644 --- a/src/views/home/accountsReceivable/accountsReceivable.vue +++ b/src/views/home/accountsReceivable/accountsReceivable.vue @@ -40,6 +40,7 @@ import operatingLineChart from "../accountsReceivableComponents/operatingLineCha import operatingLineChartCumulative from "../accountsReceivableComponents/operatingLineChartCumulative.vue"; import { getAccountsReceivableData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "AccountsReceivable", components: { @@ -117,6 +118,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -125,7 +130,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { diff --git a/src/views/home/accountsReceivableComponents/operatingLineBarSale.vue b/src/views/home/accountsReceivableComponents/operatingLineBarSale.vue index a13781d4..98fd5f20 100644 --- a/src/views/home/accountsReceivableComponents/operatingLineBarSale.vue +++ b/src/views/home/accountsReceivableComponents/operatingLineBarSale.vue @@ -68,36 +68,6 @@ export default { // 只创建一次图表实例 this.myChart = echarts.init(chartDom); - // 绑定点击事件（只绑定一次，永久生效） - this.myChart.getZr().on('click', (params) => { - console.log('params', params); - - // 提取点击的基地名称 - // const itemName = params.name; - let itemName = undefined - // 根据映射表获取对应的序号（未匹配到则返回0或其他默认值） - let pointInPixel = [params.offsetX, params.offsetY]; - if (this.myChart.containPixel('grid', pointInPixel)) { - let pointInGrid = this.myChart.convertFromPixel({ - seriesIndex: 0 - }, pointInPixel); - let xIndex = pointInGrid[0]; //索引 - let handleIndex = Number(xIndex); - let seriesObj = this.myChart.getOption(); //图表object对象 - var op = this.myChart.getOption(); - //获得图表中点击的列 - itemName = op.xAxis[0].data[handleIndex]; //获取点击的列名 - console.log(itemName, 'monthmonthmonth'); - console.log(handleIndex, seriesObj); - }; - const baseIndex = this.baseNameToIndexMap[itemName] || 0; - - console.log(`你点击了【${itemName}】(序号：${baseIndex})`); - if (itemName === undefined) { - return; - } - }); - // 定义resize处理函数（命名函数，方便移除） this.resizeHandler = () => { this.myChart && this.myChart.resize(); diff --git a/src/views/home/components/budgetHeader.vue b/src/views/home/components/budgetHeader.vue index 3f8e690b..467cdd5d 100644 --- a/src/views/home/components/budgetHeader.vue +++ b/src/views/home/components/budgetHeader.vue @@ -20,9 +20,9 @@ 切换账号 - + diff --git a/src/views/home/components/changeBase.vue b/src/views/home/components/changeBase.vue index 2030f9f4..2631995d 100644 --- a/src/views/home/components/changeBase.vue +++ b/src/views/home/components/changeBase.vue @@ -26,7 +26,7 @@ import bgBaseTongcheng from '@/assets/images/bgBase/桐城.png'; import bgBaseLuoyang from '@/assets/images/bgBase/洛阳.png'; import bgBaseHefei from '@/assets/images/bgBase/合肥.png'; import bgBaseSuqian from '@/assets/images/bgBase/宿迁.png'; -import bgBaseQinhuangdao from '@/assets/images/bgBase/秦皇岛.png';// 补充：江苏 +import bgBaseQinhuangdao from '@/assets/images/bgBase/秦皇岛.png'; export default { name: "BaseSelector", @@ -34,13 +34,11 @@ export default { factory: { type: [String, Number], default: undefined, - validator: (val) => [5, 2, 7, 3, 8, 9, 10, 6].includes(val) // 校验序号范围（匹配新的baseNameToIndexMap） + validator: (val) => [5, 2, 7, 3, 8, 9, 10, 6].includes(val) } }, - // 计算属性（响应式，levelList变化时会自动更新） computed: { buttonLevelList() { - // 核心：通过$store.getters获取定义的getter let arr = [] this.$store.getters.levelList.forEach(item => { this.buttonList.forEach(item2 => { @@ -49,7 +47,12 @@ export default { } }) }) - this.activeButton = arr[0].id + const validIds = [5, 2, 7, 3, 8, 9, 10, 6] + if (this.factory != null && validIds.includes(Number(this.factory))) { + this.activeButton = Number(this.factory) + } else if (arr.length > 0) { + this.activeButton = arr[0].id + } return arr } }, @@ -69,22 +72,13 @@ export default { }; }, watch: { - // 监听父组件传递的factory变化，同步本地选中索引 factory: { handler(newVal) { - console.log('watch factory=======================:', newVal); - if (newVal) { - this.activeButton = newVal; + if (newVal != null) { + this.activeButton = Number(newVal); } - // // 根据新的baseNameToIndexMap，找到对应的基地名称 - // const targetName = Object.keys(this.baseNameToIndexMap).find(name => this.baseNameToIndexMap[name] === newVal); - // // 根据名称找到buttonList中的索引 - // const targetIndex = this.buttonList.indexOf(targetName); - // // 合法索引则更新，否则默认选中宜兴 - // this.activeButton = targetIndex > -1 ? targetIndex : 2; - // console.log('当前选中基地：', this.buttonList[this.activeButton], '序号：', newVal); }, - // immediate: true // 初始化立即执行 + immediate: true } }, methods: { @@ -92,10 +86,6 @@ export default { this.activeButton = id; this.$emit('baseChange', id); } - }, - mounted() { - // 初始化时触发事件，传递默认选中的宜兴序号（7） - // this.$emit('baseChange', 5); } }; @@ -115,7 +105,7 @@ export default { text-align: center; cursor: pointer; white-space: nowrap; - margin-right: -35px; // 重叠效果，可根据需求调整 + margin-right: -35px; transition: all 0.2s ease; &:hover, diff --git a/src/views/home/components/core-bottom-leftItem.vue b/src/views/home/components/core-bottom-leftItem.vue index 911820ee..18ac45a3 100644 --- a/src/views/home/components/core-bottom-leftItem.vue +++ b/src/views/home/components/core-bottom-leftItem.vue @@ -1,6 +1,6 @@ diff --git a/src/views/home/components/top-item.vue b/src/views/home/components/top-item.vue index f7180e58..97ab9cfd 100644 --- a/src/views/home/components/top-item.vue +++ b/src/views/home/components/top-item.vue @@ -1,6 +1,6 @@ diff --git a/src/views/home/components/top-product-item.vue b/src/views/home/components/top-product-item.vue index 3d8c54d3..afb9a94a 100644 --- a/src/views/home/components/top-product-item.vue +++ b/src/views/home/components/top-product-item.vue @@ -1,6 +1,6 @@ - - - - diff --git a/src/views/home/electricityCostAnalysisComponents/operatingLineBarSaleBase.vue b/src/views/home/electricityCostAnalysisComponents/operatingLineBarSaleBase.vue new file mode 100644 index 00000000..72bbcab3 --- /dev/null +++ b/src/views/home/electricityCostAnalysisComponents/operatingLineBarSaleBase.vue @@ -0,0 +1,186 @@ + + + diff --git a/src/views/home/electricityCostAnalysisComponents/relatedIndicatorsAnalysis.vue b/src/views/home/electricityCostAnalysisComponents/relatedIndicatorsAnalysis.vue index 0d0e43ca..b9ac60de 100644 --- a/src/views/home/electricityCostAnalysisComponents/relatedIndicatorsAnalysis.vue +++ b/src/views/home/electricityCostAnalysisComponents/relatedIndicatorsAnalysis.vue @@ -124,11 +124,27 @@ export default { }, methods: { handleDashboardClick(path) { + // 从路径提取详情页名称，如 '/salesVolumeAnalysis/salesVolumeAnalysisBase' -> 'salesVolumeAnalysisBase' + const toPage = path.split('/').pop(); + // 保存当前页面状态并入栈 + const currentPath = this.$route.path; + const state = { + dateData: { + startTime: this.dateData.startTime, + endTime: this.dateData.endTime + }, + factory: this.$route.query.factory ? this.$route.query.factory : this.factory, + toPage + }; + pushNavigation(currentPath, state); + saveNavigationState(currentPath, state); + // query 仅支持字符串，时间范围用 startTime/endTime 传递 this.$router.push({ path: path, query: { factory: this.$route.query.factory ? this.$route.query.factory : this.factory, - dateData: this.dateData + startTime: this.dateData && this.dateData.startTime != null ? String(this.dateData.startTime) : '', + endTime: this.dateData && this.dateData.endTime != null ? String(this.dateData.endTime) : '' } }) }, diff --git a/src/views/home/electricityCostAnalysisComponents/yearRelatedMetrics.vue b/src/views/home/electricityCostAnalysisComponents/yearRelatedMetrics.vue deleted file mode 100644 index 68792250..00000000 --- a/src/views/home/electricityCostAnalysisComponents/yearRelatedMetrics.vue +++ /dev/null @@ -1,203 +0,0 @@ - - - - - - diff --git a/src/views/home/expenseAnalysis/expenseAnalysis.vue b/src/views/home/expenseAnalysis/expenseAnalysis.vue index ec65bafa..ce06a390 100644 --- a/src/views/home/expenseAnalysis/expenseAnalysis.vue +++ b/src/views/home/expenseAnalysis/expenseAnalysis.vue @@ -40,6 +40,7 @@ import operatingLineChart from "../expenseAnalysisComponents/operatingLineChart" import operatingLineChartCumulative from "../expenseAnalysisComponents/operatingLineChartCumulative.vue"; import { getExpenseAnalysisGroupData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -116,6 +117,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -124,7 +129,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { @@ -134,7 +157,6 @@ export default { sort: this.sort, index: undefined, factory: undefined - // timeDim: obj.mode }).then((res) => { console.log(res); this.monthData = res.data.month diff --git a/src/views/home/expenseAnalysis/expenseAnalysisBase.vue b/src/views/home/expenseAnalysis/expenseAnalysisBase.vue index 69c2b51f..3ad93b10 100644 --- a/src/views/home/expenseAnalysis/expenseAnalysisBase.vue +++ b/src/views/home/expenseAnalysis/expenseAnalysisBase.vue @@ -69,8 +69,10 @@ import profitLineChart from "../costComponents/profitLineChart.vue"; import { mapState } from "vuex"; import { getExpenseAnalysisFactoryData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -90,20 +92,25 @@ export default { beilv: 1, month:'', value: 100, - dateData: {}, index: '总费用', monthData: undefined, ytdData: undefined, monthAnalysis: [], ytdAnalysis: [], trend: [], - factory:null + // factory 和 dateData 由 mixin 提供 }; }, created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -169,14 +176,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -198,8 +197,6 @@ export default { this.monthAnalysis = res.data.monthAnalysis this.ytdAnalysis = res.data.ytdAnalysis this.trend = res.data.trend - - // this.monthData = res.data.month }); }, @@ -208,7 +205,6 @@ export default { this.dateData = { startTime: obj.startTime, endTime: obj.endTime, - // mode: obj.mode, } this.getData() @@ -265,8 +261,6 @@ export default { }, changeDate(val) { this.date = val; - // this.weekDay = this.weekArr[moment(this.date).format('e')] - // this.getData() if (this.date === moment().format("yyyy-MM-DD")) { this.loopTime(); } else { diff --git a/src/views/home/expenseAnalysisComponents/dataTrendBar.vue b/src/views/home/expenseAnalysisComponents/dataTrendBar.vue index 8a39814f..15c3f8b3 100644 --- a/src/views/home/expenseAnalysisComponents/dataTrendBar.vue +++ b/src/views/home/expenseAnalysisComponents/dataTrendBar.vue @@ -50,7 +50,7 @@ diff --git a/src/views/home/fullCostAnalysis/fullCostAnalysis.vue b/src/views/home/fullCostAnalysis/fullCostAnalysis.vue index caaf6da2..ecc8a8a8 100644 --- a/src/views/home/fullCostAnalysis/fullCostAnalysis.vue +++ b/src/views/home/fullCostAnalysis/fullCostAnalysis.vue @@ -40,6 +40,7 @@ import operatingLineChartCumulative from "../fullCostAnalysisComponents/operatin import { getUnitPriceAnalysisGroupData } from '@/api/cockpit' import moment from "moment"; +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -113,6 +114,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -121,7 +126,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData(obj) { diff --git a/src/views/home/fullCostAnalysis/fullCostAnalysisBase.vue b/src/views/home/fullCostAnalysis/fullCostAnalysisBase.vue index 4ef049bb..6258ea69 100644 --- a/src/views/home/fullCostAnalysis/fullCostAnalysisBase.vue +++ b/src/views/home/fullCostAnalysis/fullCostAnalysisBase.vue @@ -66,8 +66,10 @@ import dataTrend from "../fullCostAnalysisComponents/dataTrend.vue"; import { mapState } from "vuex"; import { getUnitPriceAnalysisBaseData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -84,8 +86,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: {}, @@ -96,6 +97,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -155,14 +162,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { diff --git a/src/views/home/fullCostAnalysisComponents/dataTrendBar.vue b/src/views/home/fullCostAnalysisComponents/dataTrendBar.vue index 123a91db..9e68a7e2 100644 --- a/src/views/home/fullCostAnalysisComponents/dataTrendBar.vue +++ b/src/views/home/fullCostAnalysisComponents/dataTrendBar.vue @@ -50,7 +50,7 @@ - - - - diff --git a/src/views/home/fullCostAnalysisComponents/operatingLineBarSale.vue b/src/views/home/fullCostAnalysisComponents/operatingLineBarSale.vue index e38d9341..d371cbdd 100644 --- a/src/views/home/fullCostAnalysisComponents/operatingLineBarSale.vue +++ b/src/views/home/fullCostAnalysisComponents/operatingLineBarSale.vue @@ -4,6 +4,7 @@ diff --git a/src/views/home/fullCostAnalysisComponents/relatedIndicatorsAnalysis.vue b/src/views/home/fullCostAnalysisComponents/relatedIndicatorsAnalysis.vue index 87ad39a4..6c28a15f 100644 --- a/src/views/home/fullCostAnalysisComponents/relatedIndicatorsAnalysis.vue +++ b/src/views/home/fullCostAnalysisComponents/relatedIndicatorsAnalysis.vue @@ -27,6 +27,7 @@ - - - - diff --git a/src/views/home/grossMargin/grossMargin.vue b/src/views/home/grossMargin/grossMargin.vue index f7fa00ee..9621f4e6 100644 --- a/src/views/home/grossMargin/grossMargin.vue +++ b/src/views/home/grossMargin/grossMargin.vue @@ -40,6 +40,7 @@ import operatingLineChart from "../grossMarginComponents/operatingLineChart"; import operatingLineChartCumulative from "../grossMarginComponents/operatingLineChartCumulative.vue"; import { getGrossMarginGroupData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -97,7 +98,6 @@ export default { return { transform: `scale(${v})`, transformOrigin: "left top", - // overflow: hidden; }; }, }, @@ -121,6 +121,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -129,7 +133,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { diff --git a/src/views/home/grossMargin/grossMarginBase.vue b/src/views/home/grossMargin/grossMarginBase.vue index cf2e5a2a..19c5c030 100644 --- a/src/views/home/grossMargin/grossMarginBase.vue +++ b/src/views/home/grossMargin/grossMarginBase.vue @@ -70,8 +70,10 @@ import profitLineChart from "../costComponents/profitLineChart.vue"; import { mapState } from "vuex"; import { getGrossMarginFactoryData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -82,7 +84,6 @@ export default { monthlyRelatedMetrics, yearRelatedMetrics, dataTrend - // psiLineChart }, data() { return { @@ -91,10 +92,9 @@ export default { beilv: 1, month:'', value: 100, - dateData:{}, levelId:undefined, index: '毛利率', - factory: null, + // factory 和 dateData 由 mixin 提供 monthData: {}, ytdData: {}, monthAnalysis: [], @@ -106,6 +106,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -171,14 +177,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -200,8 +198,6 @@ export default { this.monthAnalysis = res.data.monthAnalysis this.ytdAnalysis = res.data.ytdAnalysis this.trend = res.data.trend - - // this.monthData = res.data.month }); }, @@ -210,7 +206,6 @@ export default { this.dateData = { startTime: obj.startTime, endTime: obj.endTime, - // mode: obj.mode, } this.getData() diff --git a/src/views/home/grossMarginComponents/dataTrendBar.vue b/src/views/home/grossMarginComponents/dataTrendBar.vue index b6d61c34..4a382b8c 100644 --- a/src/views/home/grossMarginComponents/dataTrendBar.vue +++ b/src/views/home/grossMarginComponents/dataTrendBar.vue @@ -50,7 +50,7 @@ diff --git a/src/views/home/grossMarginComponents/yearRelatedMetrics.vue b/src/views/home/grossMarginComponents/yearRelatedMetrics.vue index 953b1d50..34d0b33d 100644 --- a/src/views/home/grossMarginComponents/yearRelatedMetrics.vue +++ b/src/views/home/grossMarginComponents/yearRelatedMetrics.vue @@ -42,6 +42,7 @@ diff --git a/src/views/home/inventoryAnalysis/inventoryAnalysis.vue b/src/views/home/inventoryAnalysis/inventoryAnalysis.vue index c2e4159b..7663086a 100644 --- a/src/views/home/inventoryAnalysis/inventoryAnalysis.vue +++ b/src/views/home/inventoryAnalysis/inventoryAnalysis.vue @@ -40,6 +40,7 @@ import operatingLineChart from "../inventoryAnalysisComponents/operatingLineChar import operatingLineChartCumulative from "../inventoryAnalysisComponents/operatingLineChartCumulative.vue"; import { getInventoryData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "InventoryAnalysis", components: { @@ -117,6 +118,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -125,7 +130,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { diff --git a/src/views/home/netPriceAnalysis/netPriceAnalysis.vue b/src/views/home/netPriceAnalysis/netPriceAnalysis.vue index b81ad7fe..2e43dd6a 100644 --- a/src/views/home/netPriceAnalysis/netPriceAnalysis.vue +++ b/src/views/home/netPriceAnalysis/netPriceAnalysis.vue @@ -40,6 +40,7 @@ import operatingLineChart from "../netPriceAnalysisComponents/operatingLineChart import operatingLineChartCumulative from "../netPriceAnalysisComponents/operatingLineChartCumulative.vue"; import { getUnitPriceAnalysisGroupData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -115,6 +116,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -123,7 +128,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData(obj) { diff --git a/src/views/home/netPriceAnalysis/netPriceAnalysisBase.vue b/src/views/home/netPriceAnalysis/netPriceAnalysisBase.vue index 70f886d7..ea6095c7 100644 --- a/src/views/home/netPriceAnalysis/netPriceAnalysisBase.vue +++ b/src/views/home/netPriceAnalysis/netPriceAnalysisBase.vue @@ -67,8 +67,10 @@ import dataTrend from "../netPriceAnalysisComponents/dataTrend.vue"; import { mapState } from "vuex"; import { getUnitPriceAnalysisBaseData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -86,8 +88,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, relatedMon: {}, relatedTotal: {}, @@ -100,6 +101,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -159,14 +166,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -177,12 +176,9 @@ export default { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - // index: this.index, - // sort: 1, paramName: '净价', paramList: this.paramList, baseId: this.factory, - // baseId: Number(this.factory), }; // 调用接口 getUnitPriceAnalysisBaseData(requestParams).then((res) => { @@ -200,7 +196,6 @@ export default { this.dateData = { startTime: obj.startTime, endTime: obj.endTime, - // mode: obj.mode, } this.getData() diff --git a/src/views/home/netPriceAnalysisComponents/dataTrendBar.vue b/src/views/home/netPriceAnalysisComponents/dataTrendBar.vue index 77c94f3d..341f530d 100644 --- a/src/views/home/netPriceAnalysisComponents/dataTrendBar.vue +++ b/src/views/home/netPriceAnalysisComponents/dataTrendBar.vue @@ -48,7 +48,7 @@ diff --git a/src/views/home/netPriceAnalysisComponents/yearRelatedMetrics.vue b/src/views/home/netPriceAnalysisComponents/yearRelatedMetrics.vue index bd950269..6058450b 100644 --- a/src/views/home/netPriceAnalysisComponents/yearRelatedMetrics.vue +++ b/src/views/home/netPriceAnalysisComponents/yearRelatedMetrics.vue @@ -28,6 +28,7 @@ diff --git a/src/views/home/operatingComponents/yearRelatedMetrics.vue b/src/views/home/operatingComponents/yearRelatedMetrics.vue index 2d02cf01..856d98ed 100644 --- a/src/views/home/operatingComponents/yearRelatedMetrics.vue +++ b/src/views/home/operatingComponents/yearRelatedMetrics.vue @@ -42,6 +42,7 @@ diff --git a/src/views/home/operatingProfitComponents/relatedIndicatorsAnalysis.vue b/src/views/home/operatingProfitComponents/relatedIndicatorsAnalysis.vue index 702dd492..d90cb297 100644 --- a/src/views/home/operatingProfitComponents/relatedIndicatorsAnalysis.vue +++ b/src/views/home/operatingProfitComponents/relatedIndicatorsAnalysis.vue @@ -24,6 +24,7 @@ - - - - diff --git a/src/views/home/procurementGainAnalysisComponents/operatingLineBarSale.vue b/src/views/home/procurementGainAnalysisComponents/operatingLineBarSale.vue index a4d30df0..e5020070 100644 --- a/src/views/home/procurementGainAnalysisComponents/operatingLineBarSale.vue +++ b/src/views/home/procurementGainAnalysisComponents/operatingLineBarSale.vue @@ -4,7 +4,7 @@ diff --git a/src/views/home/procurementGainAnalysisComponents/relatedIndicatorsAnalysis.vue b/src/views/home/procurementGainAnalysisComponents/relatedIndicatorsAnalysis.vue index e5af6f9d..99777f98 100644 --- a/src/views/home/procurementGainAnalysisComponents/relatedIndicatorsAnalysis.vue +++ b/src/views/home/procurementGainAnalysisComponents/relatedIndicatorsAnalysis.vue @@ -27,6 +27,7 @@ - - - - diff --git a/src/views/home/productionCostAnalysis/SIMFRMCostAnalysis.vue b/src/views/home/productionCostAnalysis/SIMFRMCostAnalysis.vue index 32bb3b6a..763aac38 100644 --- a/src/views/home/productionCostAnalysis/SIMFRMCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/SIMFRMCostAnalysis.vue @@ -66,8 +66,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendSingleFuelYL import { mapState } from "vuex"; import { getSingleMaterialAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -76,7 +78,6 @@ export default { totalOverview, relateSingleFuelCostAnalysis, dataTrend - // psiLineChart }, data() { return { @@ -85,14 +86,16 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 + navigationExtraFields: { + meterialName: '氢氧化铝' // 字段名: 默认值 + }, monData: {}, totalData: {}, trend: [], relatedData: {}, trendName: '成本', - meterialName:'', + meterialName:'氢氧化铝', materialOptions: [ {value:'氢氧化铝',label:'氢氧化铝'}, {value:'碎玻璃(外购)',label:'碎玻璃'}, @@ -111,6 +114,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -174,15 +183,7 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.meterialName = this.$route.query.name ? this.$route.query.name : '氢氧化铝' - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // this.meterialName = this.$route.query.name ? this.$route.query.name : '氢氧化铝' }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/combustible.vue b/src/views/home/productionCostAnalysis/combustible.vue index 4ecd984f..9582b419 100644 --- a/src/views/home/productionCostAnalysis/combustible.vue +++ b/src/views/home/productionCostAnalysis/combustible.vue @@ -65,8 +65,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendCombustible. import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -83,8 +85,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -96,6 +97,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -161,14 +168,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -186,9 +185,7 @@ export default { analysisObject: [ "原片燃料成本", ], - // paramList: ['制造成本', '财务费用', '销售费用', '管理费用', '运费'], levelId: this.factory, - // baseId: Number(this.factory), }; // 调用接口 getCostAnalysisData(requestParams).then((res) => { diff --git a/src/views/home/productionCostAnalysis/compositeClarifyingAgentCostAnalysis.vue b/src/views/home/productionCostAnalysis/compositeClarifyingAgentCostAnalysis.vue index 692ac13f..cdafacd0 100644 --- a/src/views/home/productionCostAnalysis/compositeClarifyingAgentCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/compositeClarifyingAgentCostAnalysis.vue @@ -66,8 +66,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendSingleCCA.vu import { mapState } from "vuex"; import { getSingleMaterialAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -85,8 +87,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -100,6 +101,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -163,14 +170,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/fuelCostAnalysis.vue b/src/views/home/productionCostAnalysis/fuelCostAnalysis.vue index 33e26f8a..4e5a2673 100644 --- a/src/views/home/productionCostAnalysis/fuelCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/fuelCostAnalysis.vue @@ -64,8 +64,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendFuel.vue"; import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -83,8 +85,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -96,6 +97,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -161,14 +168,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -186,7 +185,6 @@ export default { analysisObject: [ "原片原料成本", ], - // paramList: ['制造成本', '财务费用', '销售费用', '管理费用', '运费'], levelId: this.factory, }; // 调用接口 diff --git a/src/views/home/productionCostAnalysis/mfgOverheadCostAnalysis.vue b/src/views/home/productionCostAnalysis/mfgOverheadCostAnalysis.vue index c2817bc7..14cc684a 100644 --- a/src/views/home/productionCostAnalysis/mfgOverheadCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/mfgOverheadCostAnalysis.vue @@ -65,8 +65,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendFactoryBurde import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -84,8 +86,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -97,6 +98,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -162,14 +169,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/mfgOverheadSingleCostAnalysis.vue b/src/views/home/productionCostAnalysis/mfgOverheadSingleCostAnalysis.vue index 61425461..52f8869b 100644 --- a/src/views/home/productionCostAnalysis/mfgOverheadSingleCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/mfgOverheadSingleCostAnalysis.vue @@ -3,7 +3,7 @@
{ + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -158,15 +168,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.overheadName = this.$route.query.name ? this.$route.query.name : '包材' - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -179,27 +180,27 @@ export default { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - trendName: '原片'+this.overheadName+'成本', - analysisObject: ['原片'+this.overheadName], + trendName: '原片'+this.meterialName+'成本', + analysisObject: ['原片'+this.meterialName], levelId: this.factory, isOriginal:0,//0:原片 1:加工 }; // 调用接口 getSingleMaterialCostAnalysis(requestParams).then((res) => { this.monData = res.data.currentMonthData.find(item => { - return item.name === '原片'+this.overheadName+'成本'; + return item.name === '原片'+this.meterialName+'成本'; }); this.totalData = res.data.totalMonthData.find(item => { - return item.name === '原片'+this.overheadName+'成本'; + return item.name === '原片'+this.meterialName+'成本'; }); // this.relatedMon = res.data.relatedMon this.relatedData = { relatedMon: res.data.currentMonthData.filter(item => { - return item.name !== '原片'+this.overheadName+'成本'; + return item.name !== '原片'+this.meterialName+'成本'; }), // 兜底月度数据 relatedTotal: res.data.totalMonthData.filter(item => { - return item.name !== '原片'+this.overheadName+'成本'; + return item.name !== '原片'+this.meterialName+'成本'; }) // 兜底累计数据 } this.trend = res.data.dataTrend @@ -217,7 +218,7 @@ export default { this.getData() }, handleOverheadChange(val) { - this.overheadName = val + this.meterialName = val this.getData() }, selectChange(data) { diff --git a/src/views/home/productionCostAnalysis/originalSheetCost.vue b/src/views/home/productionCostAnalysis/originalSheetCost.vue index 0450f3ba..7a1c5bd9 100644 --- a/src/views/home/productionCostAnalysis/originalSheetCost.vue +++ b/src/views/home/productionCostAnalysis/originalSheetCost.vue @@ -41,6 +41,7 @@ import operatingLineChart from "../productionCostAnalysisComponents/operatingLin import operatingLineChartCumulative from "../productionCostAnalysisComponents/operatingLineChartCumulative.vue"; import { getCostAnalysisData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -117,6 +118,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -125,7 +130,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { diff --git a/src/views/home/productionCostAnalysis/originalSheetCostBase.vue b/src/views/home/productionCostAnalysis/originalSheetCostBase.vue index df15a9cd..2fb92280 100644 --- a/src/views/home/productionCostAnalysis/originalSheetCostBase.vue +++ b/src/views/home/productionCostAnalysis/originalSheetCostBase.vue @@ -65,8 +65,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrend.vue"; import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -84,8 +86,7 @@ export default { beilv: 1, month:'', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -97,6 +98,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -162,15 +169,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - console.log('this.$route.query.factory', this.$route.query.factory); - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -188,9 +186,7 @@ export default { analysisObject: [ "原片成本", ], - // paramList: ['制造成本', '财务费用', '销售费用', '管理费用', '运费'], levelId: this.factory, - // baseId: Number(this.factory), }; // 调用接口 getCostAnalysisData(requestParams).then((res) => { diff --git a/src/views/home/productionCostAnalysis/originalSheetLabor.vue b/src/views/home/productionCostAnalysis/originalSheetLabor.vue index a2bf92cc..f53f4f6d 100644 --- a/src/views/home/productionCostAnalysis/originalSheetLabor.vue +++ b/src/views/home/productionCostAnalysis/originalSheetLabor.vue @@ -54,8 +54,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProcessingLa import { mapState } from "vuex"; import { getSingleMaterialCostAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -71,8 +73,8 @@ export default { beilv: 1, month:'', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 + monData: {}, totalData: {}, trend: [], @@ -84,6 +86,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -149,14 +157,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/osElectricityCostAnalysis.vue b/src/views/home/productionCostAnalysis/osElectricityCostAnalysis.vue index 01682641..766ef5ee 100644 --- a/src/views/home/productionCostAnalysis/osElectricityCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/osElectricityCostAnalysis.vue @@ -64,8 +64,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendSingleFuelDi import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -82,8 +84,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -95,6 +96,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -160,14 +167,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/procAuxMatCost.vue b/src/views/home/productionCostAnalysis/procAuxMatCost.vue index d2abe07e..571c3698 100644 --- a/src/views/home/productionCostAnalysis/procAuxMatCost.vue +++ b/src/views/home/productionCostAnalysis/procAuxMatCost.vue @@ -63,8 +63,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProcAuxMat.v import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -80,9 +82,8 @@ export default { timer: null, beilv: 1, month: '', - factory: null, value: 100, - dateData: {}, + // factory 和 dateData 由 mixin 提供 trendName: '加工辅料', monData: {}, totalData: {}, @@ -94,6 +95,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -158,14 +165,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { diff --git a/src/views/home/productionCostAnalysis/procMfgOverheadCost.vue b/src/views/home/productionCostAnalysis/procMfgOverheadCost.vue index e5dc7523..bb372052 100644 --- a/src/views/home/productionCostAnalysis/procMfgOverheadCost.vue +++ b/src/views/home/productionCostAnalysis/procMfgOverheadCost.vue @@ -66,8 +66,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendPro.vue"; import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -85,8 +87,7 @@ export default { beilv: 1, month:'', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 trendName: '加工制造费用成本', monData: {}, totalData: {}, @@ -99,6 +100,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -157,14 +164,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { diff --git a/src/views/home/productionCostAnalysis/procPackMatCost.vue b/src/views/home/productionCostAnalysis/procPackMatCost.vue index 523f65e0..8afbe4f2 100644 --- a/src/views/home/productionCostAnalysis/procPackMatCost.vue +++ b/src/views/home/productionCostAnalysis/procPackMatCost.vue @@ -54,8 +54,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProcessingLa import { mapState } from "vuex"; import { getSingleMaterialCostAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -71,8 +73,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -87,6 +88,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -150,14 +157,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/processingCostAnalysis.vue b/src/views/home/productionCostAnalysis/processingCostAnalysis.vue index e2565352..c714aa30 100644 --- a/src/views/home/productionCostAnalysis/processingCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/processingCostAnalysis.vue @@ -41,6 +41,7 @@ import operatingLineChart from "../productionCostAnalysisComponents/operatingLin import operatingLineChartCumulative from "../productionCostAnalysisComponents/operatingLineChartCumulative.vue"; import { getCostAnalysisData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -117,6 +118,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -125,7 +130,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { diff --git a/src/views/home/productionCostAnalysis/processingCostAnalysisBase.vue b/src/views/home/productionCostAnalysis/processingCostAnalysisBase.vue index 4c3b0019..2c226d77 100644 --- a/src/views/home/productionCostAnalysis/processingCostAnalysisBase.vue +++ b/src/views/home/productionCostAnalysis/processingCostAnalysisBase.vue @@ -65,8 +65,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProcess.vue" import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -83,8 +85,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -96,6 +97,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -161,16 +168,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - console.log('this.$route.query.factory', this.$route.query.factory); - - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/processingFuel.vue b/src/views/home/productionCostAnalysis/processingFuel.vue index 04d7d9e2..1361055b 100644 --- a/src/views/home/productionCostAnalysis/processingFuel.vue +++ b/src/views/home/productionCostAnalysis/processingFuel.vue @@ -66,8 +66,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProcessingFu import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -86,8 +88,7 @@ export default { beilv: 1, month:'', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 trendName: '加工燃料成本', monData: {}, totalData: {}, @@ -100,6 +101,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -157,14 +164,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { diff --git a/src/views/home/productionCostAnalysis/processingLabor.vue b/src/views/home/productionCostAnalysis/processingLabor.vue index 22edeebe..a5c83b0b 100644 --- a/src/views/home/productionCostAnalysis/processingLabor.vue +++ b/src/views/home/productionCostAnalysis/processingLabor.vue @@ -54,8 +54,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProcessingLa import { mapState } from "vuex"; import { getSingleMaterialCostAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -71,8 +73,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -84,6 +85,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -149,14 +156,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { diff --git a/src/views/home/productionCostAnalysis/productionCostAnalysis.vue b/src/views/home/productionCostAnalysis/productionCostAnalysis.vue index 5daabaf2..aed8b75c 100644 --- a/src/views/home/productionCostAnalysis/productionCostAnalysis.vue +++ b/src/views/home/productionCostAnalysis/productionCostAnalysis.vue @@ -39,6 +39,7 @@ import { mapState } from "vuex"; import operatingLineChart from "../productionCostAnalysisComponents/operatingLineChart"; import operatingLineChartCumulative from "../productionCostAnalysisComponents/operatingLineChartCumulative.vue"; import { getCostAnalysisData } from '@/api/cockpit' +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -116,6 +117,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -124,7 +129,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData() { diff --git a/src/views/home/productionCostAnalysis/productionCostAnalysisBase.vue b/src/views/home/productionCostAnalysis/productionCostAnalysisBase.vue index 47914b52..2d2dee78 100644 --- a/src/views/home/productionCostAnalysis/productionCostAnalysisBase.vue +++ b/src/views/home/productionCostAnalysis/productionCostAnalysisBase.vue @@ -68,8 +68,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendProduct.vue" import { mapState } from "vuex"; import { getCostAnalysisData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -88,8 +90,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: [], @@ -103,6 +104,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -162,14 +169,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -186,15 +185,11 @@ export default { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - // index: this.index, - // sort: 1, trendName: this.trendName, analysisObject: [ "制造成本", ], - // paramList: ['制造成本', '财务费用', '销售费用', '管理费用', '运费'], - levelId: this.factory, - // baseId: Number(this.factory), + levelId: this.factory }; // 调用接口 getCostAnalysisData(requestParams).then((res) => { @@ -224,8 +219,7 @@ export default { this.month = obj.targetMonth this.dateData = { startTime: obj.startTime, - endTime: obj.endTime, - // mode: obj.mode, + endTime: obj.endTime } this.getData() @@ -282,8 +276,6 @@ export default { }, changeDate(val) { this.date = val; - // this.weekDay = this.weekArr[moment(this.date).format('e')] - // this.getData() if (this.date === moment().format("yyyy-MM-DD")) { this.loopTime(); } else { diff --git a/src/views/home/productionCostAnalysis/singleCombustible.vue b/src/views/home/productionCostAnalysis/singleCombustible.vue index f5660c3d..9d65d16f 100644 --- a/src/views/home/productionCostAnalysis/singleCombustible.vue +++ b/src/views/home/productionCostAnalysis/singleCombustible.vue @@ -3,7 +3,7 @@
- +
@@ -48,7 +48,7 @@ gap: 12px; grid-template-columns: 1624px; "> - +
@@ -66,8 +66,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendSingleCombus import { mapState } from "vuex"; import { getSingleMaterialAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -84,15 +86,17 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 + navigationExtraFields: { + meterialName: '天然气' // 字段名: 默认值 + }, monData: {}, totalData: {}, trend: [], relatedData: {}, trendName: '成本', - fuelName:'', - fuelOptions: [ + meterialName:'', + materialOptions: [ {value:'天然气',label:'天然气'}, {value:'LNG液化天然气',label:'LNG液化天然气'}, {value:'重油',label:'重油'}, @@ -104,6 +108,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -132,13 +142,13 @@ export default { return variables; }, unit(){ - if(this.fuelName === '重油'){ + if(this.meterialName === '重油'){ return '元/㎡' - }else if(this.fuelName === 'LNG液化天然气'){ + }else if(this.meterialName === 'LNG液化天然气'){ return '元/㎡' - }else if(this.fuelName === '天然气'){ + }else if(this.meterialName === '天然气'){ return '元/㎡' - }else if(this.fuelName === '水'){ + }else if(this.meterialName === '水'){ return '元/m³' } }, @@ -180,15 +190,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.fuelName = this.$route.query.name ? this.$route.query.name : '天然气' - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -203,7 +204,7 @@ export default { endTime: this.dateData.endTime, isOriginal:0,//0:原片 1:加工 trendName: this.trendName, - analysisObject: [this.fuelName], + analysisObject: [this.meterialName], // paramList: ['制造成本', '财务费用', '销售费用', '管理费用', '运费'], levelId: this.factory, // baseId: Number(this.factory), @@ -211,32 +212,32 @@ export default { // 调用接口 getSingleMaterialAnalysis(requestParams).then((res) => { this.monData = res.data.currentMonthData.find(item => { - if(this.fuelName === '水') { - return item.name === '原片'+this.fuelName + '成本'; + if(this.meterialName === '水') { + return item.name === '原片'+this.meterialName + '成本'; }else{ - return item.name === this.fuelName + '成本'; + return item.name === this.meterialName + '成本'; } }); this.totalData = res.data.totalMonthData.find(item => { - if(this.fuelName === '水') { - return item.name === '原片'+this.fuelName + '成本'; + if(this.meterialName === '水') { + return item.name === '原片'+this.meterialName + '成本'; }else{ - return item.name === this.fuelName + '成本'; + return item.name === this.meterialName + '成本'; } }); this.relatedData = { relatedMon: res.data.currentMonthData.filter(item => { - if(this.fuelName === '水') { - return item.name !== '原片'+this.fuelName + '成本'; + if(this.meterialName === '水') { + return item.name !== '原片'+this.meterialName + '成本'; }else{ - return item.name !== this.fuelName + '成本'; + return item.name !== this.meterialName + '成本'; } }), // 兜底月度数据 relatedTotal: res.data.totalMonthData.filter(item => { - if(this.fuelName === '水') { - return item.name !== '原片'+this.fuelName + '成本'; + if(this.meterialName === '水') { + return item.name !== '原片'+this.meterialName + '成本'; }else{ - return item.name !== this.fuelName + '成本'; + return item.name !== this.meterialName + '成本'; } }) // 兜底累计数据 } @@ -254,8 +255,8 @@ export default { this.getData() }, handlefuelChange(val) { - this.fuelName = val - if(this.fuelName === '水' && this.trendName === '热耗') return + this.meterialName = val + if(this.meterialName === '水' && this.trendName === '热耗') return this.getData() }, selectChange(data) { diff --git a/src/views/home/productionCostAnalysis/singleProcAuxMatCost.vue b/src/views/home/productionCostAnalysis/singleProcAuxMatCost.vue index faefe7e7..a7116e6a 100644 --- a/src/views/home/productionCostAnalysis/singleProcAuxMatCost.vue +++ b/src/views/home/productionCostAnalysis/singleProcAuxMatCost.vue @@ -3,7 +3,7 @@
{ + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -169,15 +179,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.auxMatName = this.$route.query.name ? this.$route.query.name : '镀膜液' - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -191,26 +192,26 @@ export default { startTime: this.dateData.startTime, endTime: this.dateData.endTime, trendName: this.trendName, - analysisObject: [this.auxMatName], + analysisObject: [this.meterialName], levelId: this.factory, isOriginal:1,//0:原片 1:加工 }; // 调用接口 getSingleMaterialAnalysis(requestParams).then((res) => { this.monData = res.data.currentMonthData.find(item => { - return item.name === this.auxMatName + '成本' + return item.name === this.meterialName + '成本' }); this.totalData = res.data.totalMonthData.find(item => { - return item.name === this.auxMatName + '成本' + return item.name === this.meterialName + '成本' }); // this.relatedMon = res.data.relatedMon this.relatedData = { relatedMon: res.data.currentMonthData.filter(item => { - return item.name !== this.auxMatName + '成本' + return item.name !== this.meterialName + '成本' }), // 兜底月度数据 relatedTotal: res.data.totalMonthData.filter(item => { - return item.name !== this.auxMatName + '成本' + return item.name !== this.meterialName + '成本' }) // 兜底累计数据 } this.trend = res.data.dataTrend @@ -229,7 +230,7 @@ export default { this.getData() }, handleAuxMatChange(val) { - this.auxMatName = val + this.meterialName = val this.getData() }, selectChange(data) { diff --git a/src/views/home/productionCostAnalysis/singleProcMfgOverheadCost.vue b/src/views/home/productionCostAnalysis/singleProcMfgOverheadCost.vue index 90859067..9b342e9f 100644 --- a/src/views/home/productionCostAnalysis/singleProcMfgOverheadCost.vue +++ b/src/views/home/productionCostAnalysis/singleProcMfgOverheadCost.vue @@ -3,7 +3,7 @@
{ + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -151,34 +161,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.overheadName = this.$route.query.name ? this.$route.query.name : '备件、机物料' - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { getData() { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - trendName: '加工'+this.overheadName+'成本', - analysisObject: ['加工'+this.overheadName+'成本'], + trendName: '加工'+this.meterialName+'成本', + analysisObject: ['加工'+this.meterialName+'成本'], levelId: this.factory, isOriginal:1,//0:原片 1:加工 }; // 调用接口 getSingleMaterialCostAnalysis(requestParams).then((res) => { this.monData = res.data.currentMonthData.find(item => { - return item.name === '加工'+this.overheadName+'成本'; + return item.name === '加工'+this.meterialName+'成本'; }); this.totalData = res.data.totalMonthData.find(item => { - return item.name === '加工'+this.overheadName+'成本'; + return item.name === '加工'+this.meterialName+'成本'; }); this.trend = res.data.dataTrend }); @@ -195,7 +196,7 @@ export default { this.getData() }, handleOverheadChange(val) { - this.overheadName = val + this.meterialName = val this.getData() }, selectChange(data) { diff --git a/src/views/home/productionCostAnalysis/singleProcessingFuel.vue b/src/views/home/productionCostAnalysis/singleProcessingFuel.vue index fa47ff0e..fff535ba 100644 --- a/src/views/home/productionCostAnalysis/singleProcessingFuel.vue +++ b/src/views/home/productionCostAnalysis/singleProcessingFuel.vue @@ -3,7 +3,7 @@
- +
@@ -48,7 +48,7 @@ gap: 12px; grid-template-columns: 1624px; "> - +
@@ -66,8 +66,10 @@ import dataTrend from "../productionCostAnalysisComponents/dataTrendSingleFuelDi import { mapState } from "vuex"; import { getSingleMaterialAnalysis } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "DayReport", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -84,15 +86,17 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 + navigationExtraFields: { + meterialName: '电' // 字段名: 默认值 + }, monData: {}, totalData: {}, trend: [], relatedData: {}, trendName: '成本', - fuelName:'', - fuelOptions: [ + meterialName: '电', + materialOptions: [ {value:'电',label:'电'}, {value:'水',label:'水'} ] @@ -102,6 +106,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -167,15 +177,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.fuelName = this.$route.query.name ? this.$route.query.name : '电' - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { changeItem(item) { @@ -189,26 +190,26 @@ export default { startTime: this.dateData.startTime, endTime: this.dateData.endTime, trendName: this.trendName, - analysisObject: [this.fuelName], + analysisObject: [this.meterialName], levelId: this.factory, isOriginal:1,//0:原片 1:加工 }; // 调用接口 getSingleMaterialAnalysis(requestParams).then((res) => { this.monData = res.data.currentMonthData.find(item => { - return item.name === '加工' + this.fuelName + '成本'; + return item.name === '加工' + this.meterialName + '成本'; }); this.totalData = res.data.totalMonthData.find(item => { - return item.name === '加工' + this.fuelName + '成本'; + return item.name === '加工' + this.meterialName + '成本'; }); // this.relatedMon = res.data.relatedMon this.relatedData = { relatedMon: res.data.currentMonthData.filter(item => { - return item.name !== '加工' + this.fuelName + '成本'; + return item.name !== '加工' + this.meterialName + '成本'; }), // 兜底月度数据 relatedTotal: res.data.totalMonthData.filter(item => { - return item.name !== '加工' + this.fuelName + '成本'; + return item.name !== '加工' + this.meterialName + '成本'; }) // 兜底累计数据 }; this.trend = res.data.dataTrend @@ -226,7 +227,7 @@ export default { this.getData() }, handleFuelChange(val) { - this.fuelName = val + this.meterialName = val this.getData() }, selectChange(data) { diff --git a/src/views/home/productionCostAnalysisComponents/dataTrendBar.vue b/src/views/home/productionCostAnalysisComponents/dataTrendBar.vue index 34795675..6af3dd9a 100644 --- a/src/views/home/productionCostAnalysisComponents/dataTrendBar.vue +++ b/src/views/home/productionCostAnalysisComponents/dataTrendBar.vue @@ -50,7 +50,7 @@ diff --git a/src/views/home/productionCostAnalysisComponents/productionOperatingLineBarSale.vue b/src/views/home/productionCostAnalysisComponents/productionOperatingLineBarSale.vue index 5967bbdd..de74b334 100644 --- a/src/views/home/productionCostAnalysisComponents/productionOperatingLineBarSale.vue +++ b/src/views/home/productionCostAnalysisComponents/productionOperatingLineBarSale.vue @@ -4,6 +4,7 @@ diff --git a/src/views/home/salesVolumeAnalysis/doublePlatedBase.vue b/src/views/home/salesVolumeAnalysis/doublePlatedBase.vue index fd5cb088..69a61f12 100644 --- a/src/views/home/salesVolumeAnalysis/doublePlatedBase.vue +++ b/src/views/home/salesVolumeAnalysis/doublePlatedBase.vue @@ -67,8 +67,10 @@ import dataTrend from "../salesVolumeAnalysisComponents/dataTrendDouble.vue"; import { mapState } from "vuex"; import { getUnitPriceAnalysisBaseData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "doublePlatedBase", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -86,8 +88,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: {}, @@ -101,6 +102,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -160,14 +167,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -178,12 +177,9 @@ export default { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - // index: this.index, - // sort: 1, paramName: '双镀销量', paramList: ['双镀成本', '双镀均价','双镀毛利率'], baseId: this.factory, - // baseId: Number(this.factory), }; // 调用接口 getUnitPriceAnalysisBaseData(requestParams).then((res) => { diff --git a/src/views/home/salesVolumeAnalysis/productionSalesBase.vue b/src/views/home/salesVolumeAnalysis/productionSalesBase.vue index 04910dce..5de0581a 100644 --- a/src/views/home/salesVolumeAnalysis/productionSalesBase.vue +++ b/src/views/home/salesVolumeAnalysis/productionSalesBase.vue @@ -67,8 +67,10 @@ import dataTrend from "../salesVolumeAnalysisComponents/dataTrendProduct.vue"; import { mapState } from "vuex"; import { getUnitPriceAnalysisBaseData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "productionSalesBase", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -86,8 +88,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: {}, @@ -101,6 +102,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -160,14 +167,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -178,12 +177,9 @@ export default { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - // index: this.index, - // sort: 1, paramName: '产销率', paramList: ['加工产量', '销量'], baseId: this.factory, - // baseId: Number(this.factory), }; // 调用接口 getUnitPriceAnalysisBaseData(requestParams).then((res) => { @@ -202,7 +198,6 @@ export default { this.dateData = { startTime: obj.startTime, endTime: obj.endTime, - // mode: obj.mode, } this.getData() diff --git a/src/views/home/salesVolumeAnalysis/salesVolumeAnalysis.vue b/src/views/home/salesVolumeAnalysis/salesVolumeAnalysis.vue index b2580476..6e1ef97b 100644 --- a/src/views/home/salesVolumeAnalysis/salesVolumeAnalysis.vue +++ b/src/views/home/salesVolumeAnalysis/salesVolumeAnalysis.vue @@ -41,6 +41,7 @@ import operatingLineChartCumulative from "../salesVolumeAnalysisComponents/opera import { getUnitPriceAnalysisGroupData } from '@/api/cockpit' import moment from "moment"; +import { consumeNavigationState, clearNavigation } from '@/utils/navigationReturnState'; export default { name: "DayReport", components: { @@ -116,6 +117,10 @@ export default { this.destroy(); }, mounted() { + // 菜单入口时清空导航栈 + if (this.$route.query.menu === '1') { + clearNavigation(); + } const _this = this; _this.beilv = document.documentElement.clientWidth / 1920; window.onresize = () => { @@ -124,8 +129,25 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5 - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined + // 从 sessionStorage 获取本页面保存的状态 + const currentPath = this.$route.path; + const saved = consumeNavigationState(currentPath); + if (saved && saved.dateData && saved.dateData.startTime != null && saved.dateData.endTime != null) { + this.dateData = { + startTime: saved.dateData.startTime, + endTime: saved.dateData.endTime + }; + } else if (this.$route.query.startTime && this.$route.query.endTime) { + this.dateData = { + startTime: Number(this.$route.query.startTime), + endTime: Number(this.$route.query.endTime) + }; + } + this.$nextTick(() => { + if (this.dateData && this.dateData.startTime != null && this.dateData.endTime != null) { + this.getData(); + } + }); }, methods: { getData(obj) { diff --git a/src/views/home/salesVolumeAnalysis/salesVolumeAnalysisBase.vue b/src/views/home/salesVolumeAnalysis/salesVolumeAnalysisBase.vue index cb164fd4..e3d65291 100644 --- a/src/views/home/salesVolumeAnalysis/salesVolumeAnalysisBase.vue +++ b/src/views/home/salesVolumeAnalysis/salesVolumeAnalysisBase.vue @@ -2,7 +2,8 @@
-
- +
@@ -65,8 +66,10 @@ import dataTrend from "../salesVolumeAnalysisComponents/dataTrend.vue"; import { mapState } from "vuex"; import { getUnitPriceAnalysisBaseData } from '@/api/cockpit' import moment from "moment"; +import navigationStateMixin from "@/utils/mixins/navigationStateMixin"; export default { name: "salesVolumeAnalysisBase", + mixins: [navigationStateMixin], components: { ReportHeader, changeBase, @@ -83,8 +86,7 @@ export default { beilv: 1, month: '', value: 100, - factory: null, - dateData: {}, + // factory 和 dateData 由 mixin 提供 monData: {}, totalData: {}, trend: {}, @@ -95,6 +97,12 @@ export default { created() { this.init(); this.windowWidth(document.documentElement.clientWidth); + // 使用 mixin 初始化导航状态恢复 + this._initNavigationStateMixin(({ factory, dateData }) => { + if (factory != null && dateData && dateData.startTime != null) { + this.getData(); + } + }); }, computed: { ...mapState({ @@ -154,14 +162,6 @@ export default { this.beilv = _this.clientWidth / 1920; })(); }; - if(this.$route.query.factory){ - this.factory =Number(this.$route.query.factory) - }else if(this.$store.getters.levelList.length > 0 && this.$store.getters.levelList[0].id !== 1) { - this.factory = this.$store.getters.levelList[0].id - }else{ - this.factory = this.$store.getters.levelList[1].id - } - this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined }, methods: { handleChange(value) { @@ -172,12 +172,9 @@ export default { const requestParams = { startTime: this.dateData.startTime, endTime: this.dateData.endTime, - // index: this.index, - // sort: 1, paramName: '销量', paramList: ['净价', '单价', '产销率', '双镀销量', '双镀占比', '溢价产品销量', '溢价产品毛利'], baseId: this.factory, - // baseId: Number(this.factory), }; // 调用接口 getUnitPriceAnalysisBaseData(requestParams).then((res) => { @@ -197,7 +194,6 @@ export default { this.dateData = { startTime: obj.startTime, endTime: obj.endTime, - // mode: obj.mode, } this.getData() diff --git a/src/views/home/salesVolumeAnalysisComponents/dataTrendBar.vue b/src/views/home/salesVolumeAnalysisComponents/dataTrendBar.vue index 022e4bbc..8b5115af 100644 --- a/src/views/home/salesVolumeAnalysisComponents/dataTrendBar.vue +++ b/src/views/home/salesVolumeAnalysisComponents/dataTrendBar.vue @@ -50,7 +50,7 @@ diff --git a/src/views/home/salesVolumeAnalysisComponents/relatedIndicatorsAnalysis.vue b/src/views/home/salesVolumeAnalysisComponents/relatedIndicatorsAnalysis.vue index 892b0ae8..4cc77901 100644 --- a/src/views/home/salesVolumeAnalysisComponents/relatedIndicatorsAnalysis.vue +++ b/src/views/home/salesVolumeAnalysisComponents/relatedIndicatorsAnalysis.vue @@ -27,6 +27,7 @@ diff --git a/src/views/home/totalProfitComponents/dataTrendBar.vue b/src/views/home/totalProfitComponents/dataTrendBar.vue index b171505c..a79a0dad 100644 --- a/src/views/home/totalProfitComponents/dataTrendBar.vue +++ b/src/views/home/totalProfitComponents/dataTrendBar.vue @@ -50,7 +50,7 @@ diff --git a/src/views/home/totalProfitComponents/relatedIndicatorsAnalysis.vue b/src/views/home/totalProfitComponents/relatedIndicatorsAnalysis.vue index 3f2ae790..61c9d712 100644 --- a/src/views/home/totalProfitComponents/relatedIndicatorsAnalysis.vue +++ b/src/views/home/totalProfitComponents/relatedIndicatorsAnalysis.vue @@ -27,6 +27,7 @@ diff --git a/src/views/home/unitPriceAnalysisComponents/proDataTrendBar.vue b/src/views/home/unitPriceAnalysisComponents/proDataTrendBar.vue index de01138f..e30ae46b 100644 --- a/src/views/home/unitPriceAnalysisComponents/proDataTrendBar.vue +++ b/src/views/home/unitPriceAnalysisComponents/proDataTrendBar.vue @@ -36,7 +36,7 @@