🔱: [client] sync upgrade with 6 commits [trident-sync]

refactor: deploy
refactor: deploy
refactor: 1.10.0
refactor: 1
perf: 增加s3示例

packages/ui/certd-client/CHANGELOG.md

@@ -3,6 +3,29 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.10.0](https://github.com/fast-crud/fast-crud/compare/v1.9.2...v1.10.0) (2023-03-11)
+
+
+### Bug Fixes
+
+* 行编辑支持多级表头 ([a547c99](https://github.com/fast-crud/fast-crud/commit/a547c99250f2d00b9d91c326364ccb81415c2772))
+
+
+### Features
+
+* fs-form-wrapper支持多实例 ([023cc1d](https://github.com/fast-crud/fast-crud/commit/023cc1d425d5b1fa618a3d13fe5c88c81671524d))
+
+
+### Performance Improvements
+
+* 完善文档，完善部分types ([8fff02d](https://github.com/fast-crud/fast-crud/commit/8fff02d758530bbb1212d7475dc94bc8b562ef97))
+* 优化d.ts类型 ([7a51aac](https://github.com/fast-crud/fast-crud/commit/7a51aace532ed6692f28a53332a2103a74f5827a))
+* 增加s3示例 ([9060b03](https://github.com/fast-crud/fast-crud/commit/9060b036ce9e36ef8f2ddc50b1362682c7d3aa7f))
+
+
+
+
+
 ## [1.9.2](https://github.com/fast-crud/fast-crud/compare/v1.9.1...v1.9.2) (2023-03-01)
 
 **Note:** Version bump only for package @fast-crud/fs-admin-antdv

packages/ui/certd-client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fast-crud/fs-admin-antdv",
-  "version": "1.9.2",
+  "version": "1.10.0",
   "private": true,
   "scripts": {
     "dev": "vite",
@@ -23,9 +23,9 @@
     "@ant-design/colors": "^7.0.0",
     "@ant-design/icons-vue": "^6.1.0",
     "@aws-sdk/s3-request-presigner": "^3.288.0",
-    "@fast-crud/fast-crud": "workspace:^1.9.2",
+    "@fast-crud/fast-crud": "^1.10.0",
-    "@fast-crud/fast-extends": "workspace:^1.9.2",
+    "@fast-crud/fast-extends": "^1.10.0",
-    "@fast-crud/ui-antdv": "workspace:^1.9.2",
+    "@fast-crud/ui-antdv": "^1.10.0",
     "@iconify/iconify": "^3.1.0",
     "@iconify/json": "^2.2.32",
     "@purge-icons/generated": "^0.9.0",

packages/ui/certd-client/src/App.vue

@@ -1,8 +1,6 @@
 <template>
   <a-config-provider :locale="locale">
-    <fs-form-provider>
+    <router-view v-if="routerEnabled" />
-      <router-view v-if="routerEnabled" />
-    </fs-form-provider>
   </a-config-provider>
 </template>
 

packages/ui/certd-client/src/plugin/fast-crud/index.tsx

@@ -7,7 +7,8 @@ import "@fast-crud/fast-extends/dist/style.css";
 import UiAntdv from "@fast-crud/ui-antdv";
 import _ from "lodash-es";
 import { useCrudPermission } from "../permission";
-import { TransformResProps } from "@fast-crud/fast-crud/src";
+import { TransformResProps } from "@fast-crud/fast-crud";
+import { GetSignedUrl } from "/@/views/crud/component/uploader/s3/api";
 
 function install(app: any, options: any = {}) {
   app.use(UiAntdv);
@@ -170,20 +171,24 @@ function install(app: any, options: any = {}) {
       domain: "http://d2p.file.handsfree.work/"
     },
     s3: {
+      //同时也支持minio
       bucket: "fast-crud",
       sdkOpts: {
         s3ForcePathStyle: true,
         signatureVersion: "v4",
         region: "us-east-1",
         forcePathStyle: true,
+        //minio与s3完全适配
         endpoint: "https://play.min.io",
         credentials: {
+          //不建议在客户端使用secretAccessKey来上传
           accessKeyId: "Q3AM3UQ867SPQQA43P2F", //访问登录名
           secretAccessKey: "zuf+tfteSlswRu7BJ86wekitnifILbZam1KYY3TG" //访问密码
         }
       },
-      custom: {
+      //预签名配置，向后端获取上传的预签名连接
-        // buildKey，获取授权等接口中将会传入
+      async getSignedUrl(bucket: string, key: string, options: any) {
+        return await GetSignedUrl(bucket, key, "put");
       },
       successHandle(ret: any) {
         // 上传完成后可以在此处处理结果，修改url什么的

packages/ui/certd-client/src/views/crud/component/uploader/form/crud.jsx

@@ -95,6 +95,14 @@ export default function ({ expose }) {
         pictureCard2: {
           title: "通过urls显示",
           type: "image-uploader",
+          form: {
+            show: false,
+            component: {
+              uploader: {
+                type: "form"
+              }
+            }
+          },
           column: {
             component: {
               urls: [

packages/ui/certd-client/src/views/crud/component/uploader/s3/api.ts

@@ -1,5 +1,6 @@
 import { requestForMock } from "/src/api/service";
-import { generateUrls } from "/@/views/crud/component/uploader/s3/s3-server";
+import { generateSignedUrl } from "/@/views/crud/component/uploader/s3/s3-server";
+import { SignedUrlType } from "@fast-crud/fast-extends";
 const request = requestForMock;
 const apiPrefix = "/mock/S3Uploader";
 export function GetList(query: any) {
@@ -46,8 +47,10 @@ export function GetObj(id: any) {
  * 向后端请求获取预签名url
  * @param bucket
  * @param key
+ * @param type
  * @constructor
  */
-export async function GetSignedUrl(bucket: string, key: string) {
+export async function GetSignedUrl(bucket: string, key: string, type: SignedUrlType) {
-  return await generateUrls(bucket, key);
+  //此处模拟获取预签名url
+  return await generateSignedUrl(bucket, key, type);
 }

packages/ui/certd-client/src/views/crud/component/uploader/s3/crud.tsx

@@ -1,6 +1,7 @@
 import * as api from "./api";
-import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
 import { GetSignedUrl } from "./api";
+import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
+
 export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
   const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
     return await api.GetList(query);
@@ -39,17 +40,27 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
         file: {
           title: "S3上传",
           type: "file-uploader",
+          // 将被分发到 form.component 和 column.component之下
+          async buildUrl(key: string) {
+            //向后端获取下载的预签名链接
+            return await GetSignedUrl("fast-crud", key, "get");
+          },
           form: {
             component: {
               uploader: {
                 type: "s3"
-              }
+              },
+              valueType: "key" //返回值为key
             }
           }
         },
         pictureCard: {
           title: "照片墙",
           type: "image-uploader",
+          async buildUrl(key: string) {
+            //向后端获取下载的预签名链接
+            return await GetSignedUrl("fast-crud", key, "get");
+          },
           form: {
             component: {
               uploader: {
@@ -57,26 +68,21 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
               },
               valueType: "key"
             }
-          },
-          column: {
-            component: {
-              async buildUrl(key: string) {
-                const url = await GetSignedUrl("fast-crud", key);
-                debugger;
-                console.log("url", url);
-                return url;
-              }
-            }
           }
         },
         cropper: {
           title: "裁剪",
           type: "cropper-uploader",
+          async buildUrl(key: string) {
+            //向后端获取下载的预签名链接
+            return await GetSignedUrl("fast-crud", key, "get");
+          },
           form: {
             component: {
               uploader: {
                 type: "s3"
-              }
+              },
+              valueType: "key"
             }
           }
         }

packages/ui/certd-client/src/views/crud/component/uploader/s3/index.vue

@@ -6,7 +6,7 @@
         <span class="sub">支持minio</span>
       </div>
       <div class="more">
-        <a target="_blank" href="http://fast-crud.docmirror.cn/api/crud-options/toolbar.html#columnsfilter-mode">文档</a>
+        <a target="_blank" href="http://fast-crud.docmirror.cn/guide/extends/uploader.html">文档</a>
       </div>
     </template>
     <fs-crud ref="crudRef" v-bind="crudBinding" />

packages/ui/certd-client/src/views/crud/component/uploader/s3/s3-server.ts

@@ -1,7 +1,8 @@
-import { S3Client, GetObjectCommand } from "@aws-sdk/client-s3";
+// @ts-ignore
+import { S3Client, GetObjectCommand, PutObjectCommand } from "@aws-sdk/client-s3";
 import { getSignedUrl } from "@aws-sdk/s3-request-presigner";
 
-export async function generateUrls(bucket: string, key: string) {
+export async function generateSignedUrl(bucket: string, key: string, type: "put" | "get" = "get") {
   const client = new S3Client({
     s3ForcePathStyle: true,
     signatureVersion: "v4",
@@ -13,14 +14,19 @@ export async function generateUrls(bucket: string, key: string) {
       secretAccessKey: "zuf+tfteSlswRu7BJ86wekitnifILbZam1KYY3TG" //访问密码
     }
   });
-  const getParams = {
+  const params = {
     Bucket: bucket,
     Key: key
   };
   let url;
-  const getCmd = new GetObjectCommand(getParams);
+  let cmd;
+  if (type === "get") {
+    cmd = new GetObjectCommand(params);
+  } else {
+    cmd = new PutObjectCommand(params);
+  }
   try {
-    url = await getSignedUrl(client, getCmd);
+    url = await getSignedUrl(client, cmd);
   } catch (err) {
     console.log("Error getting signed URL ", err);
   }

packages/ui/certd-client/src/views/crud/feature/index/crud.jsx

@@ -38,7 +38,7 @@ export default function ({ expose }) {
               //计算序号,你可以自定义计算规则，此处为翻页累加
               let index = context.index ?? 1;
               let pagination = expose.crudBinding.value.pagination;
-              return ((pagination.currentPage ?? 1) - 1) * pagination.pageSize + index + 1;
+              return ((pagination.current ?? 1) - 1) * pagination.pageSize + index + 1;
             }
           }
         },

packages/ui/certd-client/src/views/crud/form/custom-form/crud.tsx

@@ -1,7 +1,7 @@
 import * as api from "./api.js";
 import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, CrudExpose, CrudOptions, DelReq, dict, EditReq, useColumns, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
 import { message } from "ant-design-vue";
-import { useFormWrapper } from "@fast-crud/fast-crud/src";
+import { useFormWrapper } from "@fast-crud/fast-crud";
 
 function useCustomFormWrapperDemo(crudExpose: CrudExpose) {
   let index = 0;
@@ -33,6 +33,9 @@ function useCustomFormWrapperDemo(crudExpose: CrudExpose) {
               openCustomForm();
             }
           }
+        },
+        onOpened() {
+          console.log("fsFormWrapper", crudExpose.getFormWrapperRef());
         }
       },
       group: {

packages/ui/certd-client/src/views/crud/form/independent/index.vue

@@ -49,7 +49,7 @@ import { defineComponent, ref } from "vue";
 import { message } from "ant-design-vue";
 import { useCrud, useExpose, useColumns, useFs } from "@fast-crud/fast-crud";
 import createCrudOptions from "./crud";
-import { useFormWrapper } from "@fast-crud/fast-crud/src";
+import { useFormWrapper } from "@fast-crud/fast-crud";
 
 function createFormOptionsFromCrudOptions() {
   const { buildFormOptions } = useColumns();