hookehuyr

refactor(router): 将异步路由守卫改为Promise链式调用

避免使用async/await语法,改用Promise.then/catch处理异步逻辑
添加错误处理流程,在周期选择检查失败时继续正常路由流程
...@@ -79,7 +79,7 @@ const checkCycleSelection = async (to) => { ...@@ -79,7 +79,7 @@ const checkCycleSelection = async (to) => {
79 } 79 }
80 }; 80 };
81 81
82 -router.beforeEach(async (to, from, next) => { 82 +router.beforeEach((to, from, next) => {
83 // 使用404为中转页面,避免动态路由没有渲染出来,控制台报警告问题 83 // 使用404为中转页面,避免动态路由没有渲染出来,控制台报警告问题
84 if (to.path == '/404' && to.redirectedFrom != undefined) { 84 if (to.path == '/404' && to.redirectedFrom != undefined) {
85 // 模拟异步操作 85 // 模拟异步操作
...@@ -93,47 +93,76 @@ router.beforeEach(async (to, from, next) => { ...@@ -93,47 +93,76 @@ router.beforeEach(async (to, from, next) => {
93 next({ ...to.redirectedFrom, replace: true }); 93 next({ ...to.redirectedFrom, replace: true });
94 }, 1000); 94 }, 1000);
95 } else { 95 } else {
96 - // 检查是否需要周期选择 96 + // 检查是否需要周期选择 - 使用Promise.then避免async/await
97 - const needsCycleSelection = await checkCycleSelection(to); 97 + checkCycleSelection(to).then(needsCycleSelection => {
98 - if (needsCycleSelection) { 98 + if (needsCycleSelection) {
99 - // 保存目标路由到sessionStorage 99 + // 保存目标路由到sessionStorage
100 - sessionStorage.setItem('cycle_target_route', JSON.stringify({ 100 + sessionStorage.setItem('cycle_target_route', JSON.stringify({
101 - path: to.path, 101 + path: to.path,
102 - query: to.query, 102 + query: to.query,
103 - params: to.params 103 + params: to.params
104 - })); 104 + }));
105 - // 跳转到周期选择页面 105 + // 跳转到周期选择页面
106 - next({ 106 + next({
107 - path: '/cycle-selection', 107 + path: '/cycle-selection',
108 - query: { code: to.query.code } 108 + query: { code: to.query.code }
109 - }); 109 + });
110 - return; 110 + return;
111 - } 111 + }
112 - 112 +
113 - if (to.query.page_type === 'add' || to.query.page_type === undefined) { // 表单为新增状态, 检查是否有未完成的表单信息 113 + // 继续原有的表单检查逻辑
114 - const existingCookie = Cookies.get(to.query.code); 114 + if (to.query.page_type === 'add' || to.query.page_type === undefined) { // 表单为新增状态, 检查是否有未完成的表单信息
115 - if (existingCookie && to.query.force_back !== '1') { 115 + const existingCookie = Cookies.get(to.query.code);
116 - // TAG: 只能在进入路由之前判断,不然很多组件数据不渲染 116 + if (existingCookie && to.query.force_back !== '1') {
117 - showConfirmDialog({ 117 + // TAG: 只能在进入路由之前判断,不然很多组件数据不渲染
118 - title: '温馨提示', 118 + showConfirmDialog({
119 - message: '您还未完成的表单,是否继续?', 119 + title: '温馨提示',
120 - confirmButtonColor: styleColor.baseColor, 120 + message: '您还未完成的表单,是否继续?',
121 - cancelButtonText: '删除', 121 + confirmButtonColor: styleColor.baseColor,
122 - closeOnPopstate: false, 122 + cancelButtonText: '删除',
123 - }) 123 + closeOnPopstate: false,
124 - .then(() => { // 通过后把数据绑定上去 124 + })
125 - next(); 125 + .then(() => { // 通过后把数据绑定上去
126 + next();
127 + })
128 + .catch(() => { // 删除cookie
129 + Cookies.remove(to.query.code);
130 + next();
131 + });
132 + } else {
133 + next();
134 + }
135 + } else {
136 + next()
137 + }
138 + }).catch(error => {
139 + console.error('周期选择检查失败:', error);
140 + // 出错时继续正常流程
141 + if (to.query.page_type === 'add' || to.query.page_type === undefined) { // 表单为新增状态, 检查是否有未完成的表单信息
142 + const existingCookie = Cookies.get(to.query.code);
143 + if (existingCookie && to.query.force_back !== '1') {
144 + // TAG: 只能在进入路由之前判断,不然很多组件数据不渲染
145 + showConfirmDialog({
146 + title: '温馨提示',
147 + message: '您还未完成的表单,是否继续?',
148 + confirmButtonColor: styleColor.baseColor,
149 + cancelButtonText: '删除',
150 + closeOnPopstate: false,
126 }) 151 })
127 - .catch(() => { // 删除cookie 152 + .then(() => { // 通过后把数据绑定上去
128 - Cookies.remove(to.query.code); 153 + next();
129 - next(); 154 + })
130 - }); 155 + .catch(() => { // 删除cookie
156 + Cookies.remove(to.query.code);
157 + next();
158 + });
159 + } else {
160 + next();
161 + }
131 } else { 162 } else {
132 - next(); 163 + next()
133 } 164 }
134 - } else { 165 + });
135 - next()
136 - }
137 } 166 }
138 }) 167 })
139 168
......