feat:接口请求增加foemdata字段判断 用与文件上传

src/apis/bomInfo.ts

@@ -142,3 +142,16 @@ export function BomInfoDetailExport(
     data,
   });
 }
+
+/** BOM明细信息导入 */
+export function ImportBomInfoDetail(
+  data: any,
+): BaseResult {
+  console.log(data);
+  return request({
+    method: 'POST',
+    url: BASE_URL + '/importBomInfoDetail',
+    data: {file: data, bomid: 'BOM000044'},
+    formdata: true,
+  });
+}

src/apis/myVendor.ts

@@ -28,6 +28,17 @@ export function VendorListExport(
     data,
   });
 }
+// 供应商列表导入
+export function VendorImport(
+  data: MyVendorListParams,
+): BaseResult {
+  return request({
+    method: 'POST',
+    url: `${BASE_URL}/import`,
+    data,
+    formdata: true,
+  });
+}
 // 查询我的供应商列表
 export function GetVendorMaterialInfo(
   cVenCode: string,

src/apis/network.ts

@@ -40,12 +40,12 @@ export async function request<T, R extends BaseResultContent<any>>(options: {
   skipError?: boolean;
   useBody?: boolean;
   signal?: AbortSignal;
+  formdata?: boolean
 }) {
-  const {data, skipError, method, url, useBody, signal} = options;
+  const {data, skipError, method, url, useBody, signal, formdata} = options;
 
   let res: BaseResultContent<any>;
   const useData = useBody ? useBody : method !== 'GET' && method !== 'DELETE';
-
   try {
     const result = await http.request<R>({
       method,
@@ -53,6 +53,9 @@ export async function request<T, R extends BaseResultContent<any>>(options: {
       data: useData ? data : void 0,
       params: !useData ? data : void 0,
       signal,
+      headers: {
+        'Content-Type': formdata ? 'multipart/form-data' : 'application/json',
+      },
     });
 
     res = result.data;

src/components/filter/dateMonth/index.tsx

@@ -1,6 +1,7 @@
 import '../index.css';
 import {PropType, computed, defineComponent} from 'vue';
 import {NDatePicker} from 'naive-ui';
+import dayjs from 'dayjs';
 import {useField} from '../hooks';
 
 export default defineComponent({
@@ -21,12 +22,11 @@ export default defineComponent({
   },
   setup(props) {
     const [time, setTime]
-    = useField<number | null>(props.providerKey, props.name);
+    = useField<string | null>(props.providerKey, props.name);
     const value = computed<number | null>(function() {
       if (time.value === null)
         return null;
-
-      return time.value;
+      return Number(dayjs(time.value.replace('.', '-')));
     });
 
     function onClear() {
@@ -34,7 +34,7 @@ export default defineComponent({
     }
 
     function onConfirm(value: number) {
-      setTime(value);
+      setTime(dayjs(value).format('YYYY.M'));
     }
 
     return {

src/components/table-tool/index.tsx

@@ -1,7 +1,14 @@
-import {NButton, NSpace} from 'naive-ui';
+import {
+  NButton,
+  NSpace,
+  NUpload,
+  NUploadFileList,
+  NUploadTrigger,
+} from 'naive-ui';
 import './index.css';
 import {PropType, defineComponent, h, SlotsType} from 'vue';
 import {useI18n} from 'vue-i18n';
+import LDUploadTool from '../upload';
 import {
   Download,
   FileAdditionOne,
@@ -37,6 +44,9 @@ export default defineComponent({
   setup(props, {slots}) {
     const {t} = useI18n();
     const tableTitle = useTableTitle();
+    const fn = file => {
+      console.log(file, 'file');
+    };
     return () => (
       <div class="ld-table-tool">
         <h2>{props.title ?? tableTitle.value}</h2>
@@ -92,7 +102,7 @@ export default defineComponent({
               {t('common.tableTool.modalExport')}
             </NButton>
           }
-          {
+          {/* {
             props.onModalImport && <NButton
               type="default"
               renderIcon={() => h(Upload)}
@@ -100,6 +110,12 @@ export default defineComponent({
             >
               {t('common.tableTool.modalImport')}
             </NButton>
+          } */}
+          {
+            props.onModalImport && <LDUploadTool
+              // eslint-disable-next-line @typescript-eslint/no-empty-function
+              onModalImport={() => {}}
+            />
           }
         </NSpace>
       </div>

src/components/upload/index.css

@@ -0,0 +1,10 @@
+.ld-table-tool {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  & h2 {
+    font-size: 20px;
+    font-weight: normal;
+  }
+}

src/components/upload/index.tsx

@@ -0,0 +1,84 @@
+import {
+  NButton,
+  NSpace,
+  NUpload,
+  NUploadFileList,
+  NUploadTrigger,
+  type UploadCustomRequestOptions,
+} from 'naive-ui';
+import {PropType, defineComponent, h, SlotsType} from 'vue';
+import {useI18n} from 'vue-i18n';
+import {
+  Download,
+  FileAdditionOne,
+  FileExcel,
+  Refresh,
+  Upload,
+} from '@icon-park/vue-next';
+import {useMutation} from '@tanstack/vue-query';
+import {ImportBomInfoDetail} from '@apis';
+import {useTableTitle} from '@hooks';
+import './index.css';
+
+export default defineComponent({
+  name: 'LDUploadTool',
+  props: {
+    title: String,
+    onAdd: Function as PropType<() => void>,
+    onAddMplan: Function as PropType<() => void>,
+    onExport: Function as PropType<() => void>,
+    isExporting: Boolean,
+    isAddMplan: Boolean,
+    onModalExport: Function as PropType<() => void>,
+    onModalImport: Function as PropType<() => void>,
+  },
+  setup(props, {slots}) {
+    const {t} = useI18n();
+    const tableTitle = useTableTitle();
+    const {isLoading, mutate} = useMutation({
+      mutationFn: ImportBomInfoDetail,
+      onSuccess: (data, variables) => {
+        console.log(data);
+      },
+    });
+    const fn = ({file, data}: UploadCustomRequestOptions) => {
+      // const formData = new FormData();
+      // formData.append(file.name, file.file as File);
+      mutate(file.file);
+    };
+    return () => (
+      <div style={{height: '100%'}}>{
+        props.onModalImport && <NUpload
+          abstract
+          defaultFileList={[]}
+          style={{
+            background: 'red',
+            height: '100%',
+            borderRadius: '6px',
+          }}
+          trigger-style={{
+            height: '100%',
+            color: '#fff',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            padding: '0px 10px',
+            gap: '6px',
+            cursor: 'pointer',
+            background: '#1E3588 ',
+            borderRadius: '6px',
+          }}
+          customRequest={fn}
+          data={{
+            'naive-data': 'cool! naive!',
+          }}
+        >
+          <NUploadTrigger>
+            { h(Upload)} {t('common.tableTool.modalImport')}
+          </NUploadTrigger>
+        </NUpload>
+      }</div>
+
+    );
+  },
+});

src/models/request/mplan.ts

@@ -9,7 +9,7 @@ export type GetMplanListParams = {
    /**
     * 计划时间（年月）
     */
-   plandate?: number;
+   plandate?: string;
    /**
     * 数量
     */

src/pages/bomInfo/table/child-modal/childBomInfo/table/index.vue

@@ -29,6 +29,7 @@ const [{columns, visible, editId}, {onAdd}] = useColumns(refetch);
       @refresh="refetch"
       @add="onAdd"
       @export="onExport"
+      @modalImport="()=>{}"
     />
 
     <LDTable

src/pages/mplan/state.ts

@@ -1,13 +1,16 @@
 import {OriginalListParams, GetMplanListParams} from '@models';
+import dayjs from 'dayjs';
+
 /** 搜索框key */
 export const filterSymbol = Symbol('filter');
 export const filterDataSymbol = Symbol('filterData');
 export const filterState: OriginalListParams<GetMplanListParams> = {
   cCusModelName: '',
   PlanNum: '',
-  plandate: Number(new Date()),
+  plandate: dayjs(new Date()).format('YYYY.M'),
   cCusName: '',
 };
+console.log(Number(new Date()));
 /** 页码信息key */
 export const pageSymbol = Symbol('page');
 

src/pages/myVendor/table/index.vue

@@ -7,6 +7,7 @@ import {NCard} from 'naive-ui';
 import {LDTableTool, LDTable} from '@components';
 import Modal from './modal/index.vue';
 import BindingModal from './bindingModal/index.vue';
+import {useMutation} from '@tanstack/vue-query';
 
 defineOptions({name: 'MyVendorPageTable'});
 
@@ -25,6 +26,9 @@ const [isExporting, onExport] = useTableExportEvent(
   pageSymbol,
   {fn: VendorListExport},
 );
+const {isLoading,mutate}=useMutation({
+  mutationFn:
+})
 </script>
 
 <template>
@@ -33,6 +37,7 @@ const [isExporting, onExport] = useTableExportEvent(
       :isRefreshing="isFetching"
       @refresh="refetch"
       @export="onExport"
+      @modalImport=""
       :isExporting="isExporting"
     />
 
@@ -42,7 +47,7 @@ const [isExporting, onExport] = useTableExportEvent(
       :columns="columns"
       :pageSymbol="pageSymbol"
       :searchSymbol="searchSymbol"
-       pkey="cVenCode"
+      pkey="cVenCode"
     />
   </NCard>