import { defineComponent } from 'vue';
import styles from './index.module.less';
import MHeader from '@/components/m-header';
import MFooter from '@/components/m-footer';

import img2 from './images/img2.png';

export default defineComponent({
  name: 'about-us',
  setup() {
    return () => (
      <div class={styles.aboutUs}>
        <MHeader />

        <div class={styles.banner}>
          <img
            class={styles.bannerImg}
            src="https://oss.dayaedu.com/klx/1699436923197banner.png"
          />
        </div>

        <div class={styles.section1}>
          <div class={[styles.title]}>
            <span>关于酷乐秀</span>
          </div>

          <img
            src="https://oss.dayaedu.com/klx/1699519075644%E7%BC%96%E7%BB%84_14_2.png"
            class="w100"
          />
          <div class={styles.content}>
            <p>
              我们是一家专注于音乐教育创新的企业，深度融合新技术，为广大音乐爱好者和机构、学校提供高质量的音乐教育服务。
            </p>
            <p>
              未来数字化音乐教学将更加注重与人工智能、虚拟现实等新技术的深度融合，为音乐教学提供更加智能化、个性化的解决方案。我们深知数字化音乐课堂的重要性，因此积极布局数字化教育领域，现已拥有一系列成熟的音乐教学软件、教学团队及硬件供应链，助力音乐教育迈向新高峰。
            </p>
          </div>
        </div>

        <div class={styles.section2}>
          <div class={[styles.title]}>
            <span>选择我们你将得到</span>
          </div>

          <img src={img2} class="w100" />
        </div>

        <MFooter />
      </div>
    );
  }
});
