import TheImage from "@/components/TheImage";
import { Col, Image, Row } from "vant";
import { defineComponent, PropType } from "vue";
import styles from "./index.module.less";
import IconPlay from '../../image/player.png'
import single from '../../image/single.jpg'

export default defineComponent({
  name: "videoList",
  props: {
    list: {
      type: Array as PropType<any[]>,
      default: () => [],
    },
  },
  emits:['play'],
  setup(props, {emit}) {
    return () => (
      <div class={styles.videoList}>
        <Row gutter={10}>
          {props.list.map((n) => (
            <Col span={12}>
              <div class={styles.item} onClick={() => emit('play', n)}>
                <TheImage src={single} />
                <Image class={styles.playIcon} src={IconPlay} />
              </div>
            </Col>
          ))}
        </Row>
      </div>
    );
  },
});
