🐛 修复日期组件无法选择日期bug

src/components/BasicShop/BasicComponents/Form/BaseForm.tsx

@@ -12,6 +12,7 @@ import {
   baseFormTextTipTpl,
   baseFormUnionType,
 } from '@/components/PanelComponents/FormEditor/types';
+import { formatTime } from '@/utils/tool';
 // 维护表单控件， 提高form渲染性能
 
 type TBaseForm = {
@@ -92,6 +93,11 @@ const BaseForm: TBaseForm = {
   },
   Date: (props: baseFormDateTpl & { onChange: (v: Date) => void }) => {
     const { label, placeholder, onChange } = props;
+    const [value, setValue] = useState<any>('');
+    const handleChange = (v: any) => {
+      setValue(v);
+      onChange && onChange(formatTime('yyyy-MM-dd', v));
+    };
     return (
       <Cell title={label}>
         <DateSelect
@@ -99,7 +105,8 @@ const BaseForm: TBaseForm = {
           mode="date"
           min="1949-05-15"
           max="2100-05-15"
-          onOk={onChange}
+          value={value}
+          onOk={handleChange}
         />
       </Cell>
     );

src/components/BasicShop/MediaComponents/Audio/index.tsx

@@ -0,0 +1,30 @@
+import React, { memo } from 'react';
+import ReactAudioPlayer from 'react-audio-player';
+import './index.css';
+import { IVideoConfig } from './schema';
+import logo from '@/assets/14-视频.png';
+// import Audio from '@/assets/audio'
+const VideoPlayer = memo((props: IVideoConfig & { isTpl: boolean }) => {
+  const { poster, url, isTpl } = props;
+  return (
+    <>
+      {isTpl ? (
+        <div>
+          <img src={logo} alt=""></img>
+        </div>
+      ) : (
+        <div>
+          <Player
+            playsInline
+            poster={poster[0].url}
+            src={url || 'https://gossv.vcg.com/cmsUploadVideo/creative/1移轴/7月移轴.mp4'}
+          >
+            <BigPlayButton position="center" />
+          </Player>
+        </div>
+      )}
+    </>
+  );
+});
+
+export default VideoPlayer;

src/components/BasicShop/MediaComponents/Audio/schema.ts

@@ -0,0 +1,45 @@
+import {
+  ITextConfigType,
+  IUploadConfigType,
+  TTextDefaultType,
+  TUploadDefaultType,
+} from '@/components/PanelComponents/FormEditor/types';
+
+export type TVideoEditData = Array<IUploadConfigType | ITextConfigType>;
+export interface IVideoConfig {
+  poster: TUploadDefaultType;
+  url: TTextDefaultType;
+}
+
+export interface IVideoSchema {
+  editData: TVideoEditData;
+  config: IVideoConfig;
+}
+
+const Video: IVideoSchema = {
+  editData: [
+    {
+      key: 'poster',
+      name: '视频封面',
+      type: 'Upload',
+    },
+    {
+      key: 'url',
+      name: '视频链接',
+      type: 'Text',
+    },
+  ],
+  config: {
+    poster: [
+      {
+        uid: '001',
+        name: 'image.png',
+        status: 'done',
+        url: 'http://io.nainor.com/uploads/1_1740c6fbcd9.png',
+      },
+    ],
+    url: '',
+  },
+};
+
+export default Video;

src/components/BasicShop/MediaComponents/Audio/template.ts

@@ -0,0 +1,6 @@
+const template = {
+  type: 'Audio',
+  h: 107,
+  displayName: '音频组件',
+};
+export default template;

src/utils/tool.ts

@@ -104,3 +104,28 @@ export function throttle(fn: Function, delay: number) {
     }
   };
 }
+
+export function formatTime(fmt: string, dateObj: any) {
+  const date = dateObj || new Date();
+  const o: any = {
+    'M+': date.getMonth() + 1, //月份
+    'd+': date.getDate(), //日
+    'h+': date.getHours(), //小时
+    'm+': date.getMinutes(), //分
+    's+': date.getSeconds(), //秒
+    'q+': Math.floor((date.getMonth() + 3) / 3), //季度
+    S: date.getMilliseconds(), //毫秒
+  };
+  if (/(y+)/.test(fmt)) {
+    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
+  }
+  for (var k in o) {
+    if (new RegExp('(' + k + ')').test(fmt)) {
+      fmt = fmt.replace(
+        RegExp.$1,
+        RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length),
+      );
+    }
+  }
+  return fmt;
+}