form.component.ts 3.1 KB
Newer Older
liujiangnan's avatar
liujiangnan committed
1
import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef, ChangeDetectorRef} from '@angular/core';
limingzhe's avatar
limingzhe committed
2 3


liujiangnan's avatar
liujiangnan committed
4 5 6 7

@Component({
  selector: 'app-form',
  templateUrl: './form.component.html',
liujiaxin's avatar
liujiaxin committed
8
  styleUrls: ['./form.component.css']
liujiangnan's avatar
liujiangnan committed
9 10 11
})
export class FormComponent implements OnInit, OnChanges, OnDestroy {

limingzhe's avatar
limingzhe committed
12
  // 储存数据用
Chen Jiping's avatar
Chen Jiping committed
13
  saveKey = "YM-42";
limingzhe's avatar
limingzhe committed
14 15
  // 储存对象
  item;
limingzhe's avatar
limingzhe committed
16

liujiangnan's avatar
liujiangnan committed
17
  constructor(private appRef: ApplicationRef,private changeDetectorRef: ChangeDetectorRef) {
limingzhe's avatar
limingzhe committed
18 19 20 21

  }


liujiangnan's avatar
liujiangnan committed
22 23
  ngOnInit() {

limingzhe's avatar
limingzhe committed
24 25
    this.item = {};

26 27 28 29
    this.item.skinA = {};

    this.item.skinB = {};

Chen Jiping's avatar
Chen Jiping committed
30 31 32 33 34 35
    this.item.title = this.getDefaultTile();

    this.item.exercisesArr = [];

    console.log('item:', this.item);

limingzhe's avatar
limingzhe committed
36 37
    // 获取存储的数据
    (<any> window).courseware.getData((data) => {
limingzhe's avatar
limingzhe committed
38 39 40 41 42

      if (data) {
        this.item = data;
      }

43 44 45 46 47 48 49 50
      if(!this.item.skinB){
        this.item.skinB = {};
      }

      if(!this.item.skinA){
        this.item.skinA = {};
      }

Chen Jiping's avatar
Chen Jiping committed
51
      console.log('item:', this.item);
limingzhe's avatar
limingzhe committed
52
      this.init();
liujiangnan's avatar
liujiangnan committed
53 54
      this.changeDetectorRef.markForCheck();
      this.changeDetectorRef.detectChanges();
limingzhe's avatar
limingzhe committed
55 56
      this.refresh();

limingzhe's avatar
limingzhe committed
57
    }, this.saveKey);
limingzhe's avatar
limingzhe committed
58 59 60 61

  }


limingzhe's avatar
limingzhe committed
62
  ngOnChanges() {
limingzhe's avatar
limingzhe committed
63 64
  }

limingzhe's avatar
limingzhe committed
65
  ngOnDestroy() {
limingzhe's avatar
limingzhe committed
66 67
  }

Chen Jiping's avatar
Chen Jiping committed
68
  init() {
limingzhe's avatar
limingzhe committed
69

Chen Jiping's avatar
Chen Jiping committed
70 71 72
    if(!this.item.title){
      this.item.title = this.getDefaultTile();
    }
limingzhe's avatar
limingzhe committed
73

Chen Jiping's avatar
Chen Jiping committed
74 75 76 77 78 79 80 81 82 83
    //设置默认皮肤
    if(!this.item.skin){
      this.item.skin = "A";
    }

    if(!this.item.exercisesArr || this.item.exercisesArr.length == 0){

      this.item.exercisesArr = [];

      for(let i = 0; i < 6; ++ i){
limingzhe's avatar
limingzhe committed
84

Chen Jiping's avatar
Chen Jiping committed
85 86 87 88 89 90
        let exercises = this.getDefaultExercisesItem();

        this.item.exercisesArr.push(exercises);

      }
    }
liujiangnan's avatar
liujiangnan committed
91 92
  }

limingzhe's avatar
limingzhe committed
93

limingzhe's avatar
limingzhe committed
94 95 96 97
  /**
   * 储存图片数据
   * @param e
   */
Chen Jiping's avatar
Chen Jiping committed
98
  onImageUploadSuccess(e, item, key) {
limingzhe's avatar
limingzhe committed
99

Chen Jiping's avatar
Chen Jiping committed
100 101
    item[key] = e.url;
    this.save();
liujiangnan's avatar
liujiangnan committed
102 103
  }

limingzhe's avatar
limingzhe committed
104 105 106 107
  /**
   * 储存音频数据
   * @param e
   */
Chen Jiping's avatar
Chen Jiping committed
108
  onAudioUploadSuccess(e, item, key) {
limingzhe's avatar
limingzhe committed
109

Chen Jiping's avatar
Chen Jiping committed
110
    item[key] = e.url;
limingzhe's avatar
limingzhe committed
111 112 113 114 115
    this.save();
  }



limingzhe's avatar
limingzhe committed
116 117 118
  /**
   * 储存数据
   */
limingzhe's avatar
limingzhe committed
119
  save() {
limingzhe's avatar
limingzhe committed
120
    (<any> window).courseware.setData(this.item, null, this.saveKey);
Chen Jiping's avatar
Chen Jiping committed
121
    this.changeDetectorRef.detectChanges();
limingzhe's avatar
limingzhe committed
122 123 124
    this.refresh();
  }

limingzhe's avatar
limingzhe committed
125 126 127
  /**
   * 刷新 渲染页面
   */
limingzhe's avatar
limingzhe committed
128 129 130 131
  refresh() {
    setTimeout(() => {
      this.appRef.tick();
    }, 1);
liujiangnan's avatar
liujiangnan committed
132 133
  }

Chen Jiping's avatar
Chen Jiping committed
134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186

  /**
   * 获取缺省的练习题内容
   */
  getDefaultExercisesItem(){
    const exercises = {
      text:'',
      pic_url:'',
      audio_url:'',
      letters:[]
    };

    return exercises;
  }

  getDefaultTile(){
    const title = {
      part1:'',
      part2:'',
      audio_url:''
    };

    return title;
  }

  /**
   * 获取默认的字母
   */
  getDefaultLetter(){
    let letter = {
      val:'',
      isColor:'0'
    };

    return letter;
  }

  addLetter(exercises) {

    let letter = this.getDefaultLetter();

    exercises.letters = [...exercises.letters, letter];

    this.save();
  }

  delLetter(exercises, index) {
    if (index !== -1) {
      exercises.letters.splice(index, 1);
      exercises.letters = [...exercises.letters];
      this.save();
    }
  }
187 188 189 190 191 192 193 194 195 196 197

  clearBg(){
    if(this.item.skin ==='A'){
      this.item.skinA = {};
    }
    else{
      this.item.skinB = {};
    }

    this.save();
  }
liujiangnan's avatar
liujiangnan committed
198
}
limingzhe's avatar
limingzhe committed
199