form.component.ts 3.24 KB
Newer Older
范雪寒's avatar
范雪寒 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

范雪寒's avatar
范雪寒 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
    // 获取存储的数据
范雪寒's avatar
范雪寒 committed
37
    (<any>window).courseware.getData((data) => {
limingzhe's avatar
limingzhe committed
38 39 40

      if (data) {
        this.item = data;
范雪寒's avatar
范雪寒 committed
41 42 43
        if (data.contentObj && data.contentObj.data) {
          this.item = data.contentObj.data;
        }
limingzhe's avatar
limingzhe committed
44 45
      }

范雪寒's avatar
范雪寒 committed
46
      if (!this.item.skinB) {
47 48 49
        this.item.skinB = {};
      }

范雪寒's avatar
范雪寒 committed
50
      if (!this.item.skinA) {
51 52 53
        this.item.skinA = {};
      }

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

limingzhe's avatar
limingzhe committed
60
    }, this.saveKey);
limingzhe's avatar
limingzhe committed
61 62 63 64

  }


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

limingzhe's avatar
limingzhe committed
68
  ngOnDestroy() {
limingzhe's avatar
limingzhe committed
69 70
  }

Chen Jiping's avatar
Chen Jiping committed
71
  init() {
limingzhe's avatar
limingzhe committed
72

范雪寒's avatar
范雪寒 committed
73
    if (!this.item.title) {
Chen Jiping's avatar
Chen Jiping committed
74 75
      this.item.title = this.getDefaultTile();
    }
limingzhe's avatar
limingzhe committed
76

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

范雪寒's avatar
范雪寒 committed
82
    if (!this.item.exercisesArr || this.item.exercisesArr.length == 0) {
Chen Jiping's avatar
Chen Jiping committed
83 84 85

      this.item.exercisesArr = [];

范雪寒's avatar
范雪寒 committed
86
      for (let i = 0; i < 6; ++i) {
limingzhe's avatar
limingzhe committed
87

Chen Jiping's avatar
Chen Jiping committed
88 89 90 91 92 93
        let exercises = this.getDefaultExercisesItem();

        this.item.exercisesArr.push(exercises);

      }
    }
liujiangnan's avatar
liujiangnan committed
94 95
  }

limingzhe's avatar
limingzhe committed
96

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

Chen Jiping's avatar
Chen Jiping committed
103 104
    item[key] = e.url;
    this.save();
liujiangnan's avatar
liujiangnan committed
105 106
  }

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

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



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

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

Chen Jiping's avatar
Chen Jiping committed
137 138 139 140

  /**
   * 获取缺省的练习题内容
   */
范雪寒's avatar
范雪寒 committed
141
  getDefaultExercisesItem() {
Chen Jiping's avatar
Chen Jiping committed
142
    const exercises = {
范雪寒's avatar
范雪寒 committed
143 144 145 146
      text: '',
      pic_url: '',
      audio_url: '',
      letters: []
Chen Jiping's avatar
Chen Jiping committed
147 148 149 150 151
    };

    return exercises;
  }

范雪寒's avatar
范雪寒 committed
152
  getDefaultTile() {
Chen Jiping's avatar
Chen Jiping committed
153
    const title = {
范雪寒's avatar
范雪寒 committed
154 155 156
      part1: '',
      part2: '',
      audio_url: ''
Chen Jiping's avatar
Chen Jiping committed
157 158 159 160 161 162 163 164
    };

    return title;
  }

  /**
   * 获取默认的字母
   */
范雪寒's avatar
范雪寒 committed
165
  getDefaultLetter() {
Chen Jiping's avatar
Chen Jiping committed
166
    let letter = {
范雪寒's avatar
范雪寒 committed
167 168
      val: '',
      isColor: '0'
Chen Jiping's avatar
Chen Jiping committed
169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189
    };

    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();
    }
  }
190

范雪寒's avatar
范雪寒 committed
191 192
  clearBg() {
    if (this.item.skin === 'A') {
193 194
      this.item.skinA = {};
    }
范雪寒's avatar
范雪寒 committed
195
    else {
196 197 198 199 200
      this.item.skinB = {};
    }

    this.save();
  }
liujiangnan's avatar
liujiangnan committed
201
}
limingzhe's avatar
limingzhe committed
202