✏️ 修复列表组件图片裁切不能等比裁切问题

src/components/BasicShop/BasicComponents/List/schema.ts

@@ -33,6 +33,7 @@ const List: IListSchema = {
       key: 'sourceData',
       name: '数据源',
       type: 'DataList',
+      cropRate: 1,
     },
     {
       key: 'round',

src/components/PanelComponents/DataList/editorModal.tsx

@@ -23,10 +23,11 @@ export type EditorModalProps = {
   onCancel: ((e: React.MouseEvent<HTMLElement, MouseEvent>) => void) | undefined;
   item?: TDataListDefaultTypeItem;
   onSave: Function;
+  cropRate: number;
 };
 
 const EditorModal: FC<EditorModalProps> = props => {
-  const { item, onSave, visible, onCancel } = props;
+  const { item, onSave, visible, onCancel, cropRate } = props;
   const onFinish = (values: Store) => {
     console.log(values);
     onSave && onSave(values);
@@ -112,7 +113,7 @@ const EditorModal: FC<EditorModalProps> = props => {
               valuePropName="fileList"
               getValueFromEvent={normFile}
             >
-              <Upload />
+              <Upload cropRate={cropRate} isCrop />
             </Form.Item>
           </Form>
         </Modal>

src/components/PanelComponents/DataList/index.tsx

@@ -129,6 +129,7 @@ const DndItem = DropTarget(
 export type DataListMemo = {
   onChange?: (v: TDataListDefaultType) => void;
   value?: TDataListDefaultType;
+  cropRate: number;
 };
 
 export type DataListType = DataListMemo & {
@@ -136,7 +137,7 @@ export type DataListType = DataListMemo & {
 };
 
 const List = function(props: DataListType) {
-  const { onChange, value, connectDropTarget } = props;
+  const { onChange, value, connectDropTarget, cropRate } = props;
   const [list, setList] = useState(value);
   const [visible, setVisible] = useState(false);
   const [curItem, setCurItem] = useState<TDataListDefaultTypeItem>();
@@ -230,7 +231,13 @@ const List = function(props: DataListType) {
           添加
         </Button>
       </div>
-      <EditorModal visible={visible} onCancel={handleCancel} item={curItem} onSave={handleSave} />
+      <EditorModal
+        visible={visible}
+        onCancel={handleCancel}
+        item={curItem}
+        onSave={handleSave}
+        cropRate={cropRate}
+      />
     </div>,
   );
 };

src/components/PanelComponents/FormEditor/index.tsx

@@ -88,7 +88,7 @@ const FormEditor = (props: FormEditorProps) => {
             )}
             {item.type === 'DataList' && (
               <Form.Item label={item.name} name={item.key}>
-                <DataList />
+                <DataList cropRate={item.cropRate} />
               </Form.Item>
             )}
             {item.type === 'Color' && (

src/components/PanelComponents/FormEditor/types.ts

@@ -43,6 +43,7 @@ export interface IDataListConfigType {
   key: string;
   name: string;
   type: 'DataList';
+  cropRate: number;
 }
 
 export type TDataListDefaultTypeItem = {