feat: 客户编辑&查看

apps/web-ele/src/api/customer-manage/index.ts

@@ -45,5 +45,5 @@ export async function addCustomerApi(data: CustomerEntity) {
  * 客户信息_编辑
  */
 export async function editCustomerApi(data: CustomerEntity) {
-  return requestClient.post<any>('/api/edit?pagevalue=21', { ...data });
+  return requestClient.post<any>('/api/up?pagevalue=21', { ...data });
 }

apps/web-ele/src/views/customer-manage/form.vue

@@ -5,6 +5,8 @@ import { computed, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 
+import { ElMessage } from 'element-plus';
+
 import { useVbenForm, z } from '#/adapter/form';
 import {
   addCustomerApi,
@@ -13,8 +15,15 @@ import {
 } from '#/api/customer-manage';
 
 const data = ref();
+const formType = ref<'create' | 'detail' | 'edit'>('create');
+
+const titleMap = {
+  create: '新增客户',
+  detail: '客户详情',
+  edit: '编辑客户',
+} as const;
 
-const getTitle = computed(() => (data.value?.create ? '新增客户' : '编辑客户'));
+const getTitle = computed(() => titleMap[formType.value]);
 
 const [BaseForm, baseFormApi] = useVbenForm({
   showDefaultActions: false,
@@ -26,6 +35,7 @@ const [BaseForm, baseFormApi] = useVbenForm({
       class: 'w-full',
     },
   },
+  wrapperClass: 'grid-cols-1 lg:grid-cols-2',
   schema: [
     // { title: '用户名称', field: 'usersname' },
     // { title: '用户性质', field: 'usersnature' },
@@ -206,6 +216,7 @@ const [BaseForm, baseFormApi] = useVbenForm({
 });
 
 const [Modal, modalApi] = useVbenModal({
+  class: 'w-7/12',
   onCancel() {
     modalApi.close();
   },
@@ -216,28 +227,38 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
 
-    // 调用新增或编辑接口
-    const res = await (data.value.create
-      ? addCustomerApi(validate.values as CustomerEntity)
-      : editCustomerApi(validate.values as CustomerEntity));
-
-    // eslint-disable-next-line no-console
-    console.log(res);
-
-    // if (res.code === 200) {
-    //   modalApi.close();
-    // }
+    try {
+      // 调用新增或编辑接口
+      const apiMap = {
+        create: () => addCustomerApi(validate.values as CustomerEntity),
+        edit: () =>
+          editCustomerApi({
+            ...validate.values,
+            'usersid.value': data.value.row.usersid,
+          } as any),
+      };
 
-    // modalApi.close();
-    // const values = await baseFormApi.getValues();
+      if (formType.value === 'detail') {
+        modalApi.close();
+        return;
+      }
 
-    // console.log(Object.keys(values));
+      await apiMap[formType.value]();
+      ElMessage.success('操作成功');
+      modalApi.close();
+    } catch {}
   },
   async onOpenChange(isOpen) {
     if (isOpen) {
       data.value = modalApi.getData();
 
-      if (data.value.create) {
+      formType.value = data.value.formType;
+
+      baseFormApi.setState({
+        commonConfig: { disabled: formType.value === 'detail' },
+      });
+
+      if (data.value.formType === 'create') {
         return;
       }
 

apps/web-ele/src/views/customer-manage/index.vue

@@ -39,6 +39,7 @@ const formOptions: VbenFormProps = {
       },
     },
   ],
+  wrapperClass: 'grid-cols-1 md:grid-cols-3 lg:grid-cols-5',
 };
 
 const gridOptions: VxeGridProps<any> = {
@@ -107,18 +108,17 @@ const [Modal, modalApi] = useVbenModal({
 
 /* 创建 */
 function handleCreate() {
-  modalApi.setData({ create: true }).open();
+  modalApi.setData({ formType: 'create' }).open();
 }
 
 /* 编辑 */
 function handleEdit(row: any) {
-  modalApi.setData({ row }).open();
+  modalApi.setData({ formType: 'edit', row }).open();
 }
 
 /* 详情 */
 function handleDetail(row: any) {
-  modalApi.setData({ row }).open();
-  // router.push(`/system/users/detail/${row.userName}`);
+  modalApi.setData({ formType: 'detail', row }).open();
 }
 </script>
 

packages/effects/request/src/request-client/preset-interceptors.ts

@@ -6,6 +6,7 @@ import { formatBackendJson, isFunction } from '@vben/utils';
 
 import axios from 'axios';
 
+// 默认拦截器
 export const defaultResponseInterceptor = ({
   codeField = 'code',
   dataField = 'data',
@@ -20,6 +21,8 @@ export const defaultResponseInterceptor = ({
 }): ResponseInterceptorConfig => {
   return {
     fulfilled: (response) => {
+      // eslint-disable-next-line no-console
+      console.log('1-defaultResponseInterceptor response:', response);
       const { config, data: responseData, status, headers } = response;
 
       // 格式化请求数据
@@ -61,6 +64,7 @@ export const defaultResponseInterceptor = ({
   };
 };
 
+// 认证拦截器
 export const authenticateResponseInterceptor = ({
   client,
   doReAuthenticate,
@@ -76,9 +80,11 @@ export const authenticateResponseInterceptor = ({
 }): ResponseInterceptorConfig => {
   return {
     rejected: async (error) => {
+      // eslint-disable-next-line no-console
+      console.log('2-authenticateResponseInterceptor error:', error);
       const { config, response } = error;
       // 如果不是 401 错误，直接抛出异常
-      if (response?.status !== 401) {
+      if (response?.data?.Status !== -2) {
         throw error;
       }
       // 判断是否启用了 refreshToken 功能
@@ -126,11 +132,14 @@ export const authenticateResponseInterceptor = ({
   };
 };
 
+// 错误信息拦截器
 export const errorMessageResponseInterceptor = (
   makeErrorMessage?: MakeErrorMessageFn,
 ): ResponseInterceptorConfig => {
   return {
     rejected: (error: any) => {
+      // eslint-disable-next-line no-console
+      console.log('3-errorMessageResponseInterceptor error:', error);
       if (axios.isCancel(error)) {
         return Promise.reject(error);
       }
@@ -148,27 +157,37 @@ export const errorMessageResponseInterceptor = (
       }
 
       let errorMessage = '';
-      const status = error?.response?.status;
+      const status = error?.response?.data?.Status;
+
+      // switch (status) {
+      //   case 400: {
+      //     errorMessage = $t('ui.fallback.http.badRequest');
+      //     break;
+      //   }
+      //   case 401: {
+      //     errorMessage = $t('ui.fallback.http.unauthorized');
+      //     break;
+      //   }
+      //   case 403: {
+      //     errorMessage = $t('ui.fallback.http.forbidden');
+      //     break;
+      //   }
+      //   case 404: {
+      //     errorMessage = $t('ui.fallback.http.notFound');
+      //     break;
+      //   }
+      //   case 408: {
+      //     errorMessage = $t('ui.fallback.http.requestTimeout');
+      //     break;
+      //   }
+      //   default: {
+      //     errorMessage = $t('ui.fallback.http.internalServerError');
+      //   }
+      // }
 
       switch (status) {
-        case 400: {
-          errorMessage = $t('ui.fallback.http.badRequest');
-          break;
-        }
-        case 401: {
-          errorMessage = $t('ui.fallback.http.unauthorized');
-          break;
-        }
-        case 403: {
-          errorMessage = $t('ui.fallback.http.forbidden');
-          break;
-        }
-        case 404: {
-          errorMessage = $t('ui.fallback.http.notFound');
-          break;
-        }
-        case 408: {
-          errorMessage = $t('ui.fallback.http.requestTimeout');
+        case -1: {
+          errorMessage = error?.response?.data?.Message;
           break;
         }
         default: {