import { defineComponent } from 'vue';
import styles from './index.module.less';
import coAi from '../images/co-ai/co-ai.png';
import evaluation from '../images/co-ai/evaluation.png';
import change from '../images/co-ai/change.png';
import music from '../images/co-ai/music.png';

export default defineComponent({
  name: 'co-ai',
  setup() {
    return () => (
      <div class={styles.coAi}>
        <div class={styles.sectionAi}>
          <div class={[styles.title, styles.title1]}>
            <span>小酷AI</span>
          </div>
          <div class={styles.aiContent}>
            三大练习模式，20多项练习辅助功能，让老师讲课更生动，让学生练习更高效
          </div>

          <img src={coAi} class={'w100'} />
        </div>

        <div class={styles.sectionEval}>
          <div class={[styles.title, styles.title2]}>
            <span>智能评测</span>
          </div>
          <div class={styles.content}>
            <p>
              拥有完全自主知识产权，通过演奏音频采集与标准曲谱比对，实时提供智能点评报告，自动提示练习对错，并生成评测报告。
            </p>
            <p>
              让学生和家长能够及时发现乐器练习过程中存在的问题，提高练习效率，可谓是学生学习乐器的“随身教练”
            </p>
          </div>

          <img src={evaluation} class={'w100'} />
        </div>

        <div class={styles.sectionChange}>
          <div class={[styles.title, styles.title1]}>
            <span>五线谱/简谱一键转换</span>
          </div>
          <div class={styles.content}>
            五线谱可一键转换简谱，再也不用为找谱而“奔波”，支持达人端自行上传五线谱
          </div>

          <img src={change} class={'w100'} />
        </div>

        <div class={styles.sectionMusic}>
          <div class={[styles.title, styles.title2]}>
            <span>海量曲目</span>
          </div>
          <div class={styles.content}>
            完善的曲目级别，丰富的曲目风格，海量曲目满足声部训练、独奏练习、乐团合奏等多场景训练需求
          </div>

          <img src={music} class={'w100'} />
        </div>
      </div>
    );
  }
});
