Bladeren bron

feat(http): 修改接上传图片 form表单 页面

tangning 4 jaren geleden
bovenliggende
commit
33e1d706fb

+ 38 - 1
src/api/advertisement/list.ts

@@ -1,9 +1,13 @@
 import { defHttp } from '/@/utils/http/axios';
-import { PageParams, ListGetResultModel } from './model';
+import { PageParams, ListGetResultModel, UpdateItem } from './model';
+import { Result, UploadFileParams } from '/#/axios';
 
 enum Api {
   selectAll = '/zfb-api/zfb/rotation/selectAll',
   recommend = '/zfb-api/zfb/recommend/selectByType',
+  update = '/zfb-api/zfb/rotation/update',
+  save = '/zfb-api/zfb/rotation/save',
+  uploadFile = '/zfb-api/zfb/house/upload',
 }
 
 /**
@@ -29,3 +33,36 @@ export const RecommendListApi = (params: PageParams) =>
       ignoreCancelToken: true,
     },
   });
+
+export const itemUpdateApi = (params: UpdateItem) =>
+  defHttp.post<ListGetResultModel>({
+    url: Api.update,
+    params,
+    headers: {
+      // @ts-ignore
+      ignoreCancelToken: true,
+    },
+  });
+
+export const itemSaveApi = (params: UpdateItem) =>
+  defHttp.post<ListGetResultModel>({
+    url: Api.save,
+    params,
+    headers: {
+      // @ts-ignore
+      ignoreCancelToken: true,
+    },
+  });
+
+export function uploadApi(
+  params: UploadFileParams,
+  onUploadProgress: (progressEvent: ProgressEvent) => void,
+) {
+  return defHttp.uploadFile<Result>(
+    {
+      url: Api.uploadFile,
+      onUploadProgress,
+    },
+    params,
+  );
+}

+ 9 - 0
src/api/advertisement/model.ts

@@ -14,6 +14,15 @@ export interface ListItem {
   url: string;
 }
 
+export interface UpdateItem {
+  content: string;
+  id: number;
+  image: string;
+  orderNum: number;
+  title: string;
+  url?: string;
+}
+
 /**
  * @description: Request list return value
  */

+ 3 - 2
src/views/dashboard/advertisement/list.vue

@@ -30,7 +30,7 @@
         />
       </template>
     </BasicTable>
-    <listDrawer @register="registerDrawer" />
+    <listDrawer @register="registerDrawer" @reload="reload" />
   </div>
 </template>
 <script lang="ts">
@@ -80,7 +80,7 @@
       ];
 
       // { getForm }
-      const [registerTable] = useTable({
+      const [registerTable, { reload }] = useTable({
         title: '轮播图',
         api: ListApi,
         columns: columns,
@@ -104,6 +104,7 @@
         });
       }
       return {
+        reload,
         registerTable,
         createMessage,
         registerDrawer,

+ 16 - 5
src/views/dashboard/advertisement/listDrawer.vue

@@ -9,10 +9,12 @@
   import { BasicForm, useForm } from '/@/components/Form';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { schemas } from './schemas';
+  import { itemUpdateApi, itemSaveApi } from '/@/api/advertisement/list';
   export default defineComponent({
     components: { BasicDrawer, BasicForm },
-    setup() {
+    setup(_, { emit }) {
       const { createMessage } = useMessage();
+      const modelRef = ref({});
       const isUpdate = ref(true);
       const [registerForm, { validate, setProps, resetFields, setFieldsValue }] = useForm({
         labelCol: {
@@ -36,7 +38,7 @@
         resetFields();
         setDrawerProps({ confirmLoading: false });
         isUpdate.value = !!data?.isUpdate;
-
+        modelRef.value = data.record;
         if (unref(isUpdate)) {
           console.log('data.record', data.record);
           setFieldsValue({
@@ -48,20 +50,29 @@
 
       async function summitAddDrawer() {
         try {
-          await validate();
+          let data = await validate();
+          let httpApi = unref(isUpdate) ? itemUpdateApi : itemSaveApi;
           setProps({
             submitButtonOptions: {
               loading: true,
             },
           });
-          setTimeout(() => {
+          console.log('data', data, modelRef.value);
+          httpApi({ ...modelRef.value, ...data, image: data.image.toString() }).then((res) => {
+            console.log('itemUpdateApi', res);
             setProps({
               submitButtonOptions: {
                 loading: false,
               },
             });
             createMessage.success('提交成功!');
-          }, 2000);
+            emit('reload');
+            closeDrawer();
+          });
+
+          // setTimeout(() => {
+
+          // }, 2000);
         } catch (error) {}
       }
 

+ 7 - 2
src/views/dashboard/advertisement/schemas.ts

@@ -1,7 +1,8 @@
 import { FormSchema } from '/@/components/Form';
-import { uploadApi } from '/@/api/sys/upload';
+// import { uploadApi } from '/@/api/sys/upload';
 import { Tinymce } from '/@/components/Tinymce/index';
 import { h } from 'vue';
+import { uploadApi } from '/@/api/advertisement/list';
 
 export const schemas: FormSchema[] = [
   {
@@ -33,7 +34,7 @@ export const schemas: FormSchema[] = [
     componentProps: {
       placeholder: '链接',
     },
-    required: true,
+    // required: true,
   },
   {
     field: 'image',
@@ -43,6 +44,10 @@ export const schemas: FormSchema[] = [
     componentProps: {
       api: uploadApi,
       maxNumber: 1,
+      change(data) {
+        console.log('data', data);
+        return data;
+      },
     },
     required: true,
   },

+ 7 - 7
src/views/dashboard/order/data.tsx

@@ -1,6 +1,7 @@
 import { DescItem } from '/@/components/Description/index';
 import { BasicColumn } from '/@/components/Table/src/types/table';
 import { Button } from '/@/components/Button';
+// import { h } from 'vue';
 // import { Time } from '/@/components/Time';
 import { Badge } from 'ant-design-vue';
 
@@ -89,10 +90,10 @@ export const personData = {
   b5: '无',
 };
 export const goodsSchema: DescItem[] = [
-  {
-    field: 'goodsList',
-    label: '商品信息',
-  },
+  // {
+  //   field: 'goodsList',
+  //   label: '商品信息',
+  // },
   {
     field: 'payStatus',
     label: '付款状态',
@@ -104,9 +105,8 @@ export const goodsSchema: DescItem[] = [
   {
     field: 'payTime',
     label: '付款时间',
-    render: (val) => {
-      return val;
-      // return (<Time :value="val" mode="datetime" />)
+    render: (curVal, _) => {
+      return `${curVal}`;
     },
   },
   {

+ 4 - 5
src/views/dashboard/order/detail.vue

@@ -17,14 +17,14 @@
               v-for="item in refundData.goodsList"
               :key="item.id"
               :hoverable="true"
-              :class="`${prefixCls}__card`"
+              class="`list-card__card`"
             >
-              <div :class="`${prefixCls}__card-title`">
+              <div class="`list-card__card-title`">
                 <TableImg :size="50" :simpleShow="true" :imgList="[item.listPicUrl]" />
               </div>
-              <div :class="`${prefixCls}__card-detail`">
+              <div class="`list-card__card-detail`">
                 <div>{{ item.goodsName }}</div>
-                ¥{{ item.retailPrice }}X {{ item.number }}
+                ¥{{ item.retailPrice }} X {{ item.number }}
               </div>
             </a-card>
           </a-col>
@@ -116,7 +116,6 @@
       setTitle(`No.${id} - 订单详情`);
 
       return {
-        prefixCls: 'list-card',
         refundSchema,
         refundData,
         personData,