/**
 * Created by Elors on 2017/1/3.
 * Exercise-Group component
 */

define(['Exercise'], function () {

  Vue.component('exercise-group', {
    template: '\
      <div class="row store-row content-pane">\
        <el-form ref="form" :model="form" label-width="0px" class="page-pane">\
          <el-form-item label-width="0px"  class="text item-input"  v-show="shouldShow">\
            <el-input v-model="form.title" class="input" id="ex-title"></el-input>\
          </el-form-item>\
         <el-form-item label-width="0px"  class="text item-input"  v-show="shouldShow">\
            <el-input v-model="form.desc" class="input" id="ex-desc"></el-input>\
         </el-form-item>\
          <transition-group name="list" tag="div">\
            <store-exercise\
              v-for="(exercise, index) in form.exercises"\
              v-bind:list="form.exercises"\
              v-bind:exercise="exercise"\
              v-bind:index="index"\
              :key="index+\'ex\'">\
            </store-exercise>\
          </transition-group>\
          <el-form-item class="item-submit" v-show="shouldShow">\
            <el-button type="success" icon="plus" @click="onInsert">新增习题</el-button>\
            <el-button type="primary" icon="edit" @click="onSave">保存题组</el-button>\
          </el-form-item>\
        </el-form>\
      </div>\
    ',
    data: function () {
      return {
        form: {},
        shouldShow: false
      }
    },
    methods: {
      // Events Handle Method
      onInsert () {
        this.form.exercises.push(this.defaultExercise());
      },
      onSave () {
        console.log(this.form.exercises)
      },
      // Public Method
      loadGroup (data) {
        let group = this;
        $.ajax({
          async: false,
          dataType: "json",
          url: '/lecturer/api/exercise/store?action=group&gid=' + data.id,
          success: function (json) {
            if (json && json.ok) {
              group.form = group.handleData(json.data);
              group.shouldShow = true;
            }
          }
        });
      },
      createGroup () {
        this.form = this.defaultGroup();
        this.shouldShow = true;
      },
      // Private Method
      handleData (json) {
        // format
        json.exercises = json.questions;
        delete json.questions;
        // set solution string
        for (exercise of json.exercises) {
          for (option of exercise.options) {
            if (exercise.solution === option.id) {
              exercise.solution = option.text;
            }
          }
        }
        return json
      },
      defaultGroup () {
        return {
          id: '',
          title: '题组名称',
          desc: '题组描述',
          exercises: [
            this.defaultExercise()
          ]
        }
      },
      defaultExercise () {
        return {
          id: '',
          title: '',
          solution: '',
          analyse: '',
          options: ['', '', '', '']
        }
      }
    }
  });

});
@@ -2872,24 +2872,26 @@
     title: '
+%E9%A2%98%E7%9B%AE
 ',%0A         
@@ -2902,16 +2902,19 @@
 ution: '
+%E9%80%89%E9%A1%B91
 ',%0A     
@@ -2928,16 +2928,20 @@
 alyse: '
+%E9%A2%98%E7%9B%AE%E8%A7%A3%E6%9E%90
 ',%0A     
@@ -2959,22 +2959,326 @@
 s: %5B
-'', '', '', ''
+%0A            %7B%0A              id: '',%0A              text: '%E9%80%89%E9%A1%B91'%0A            %7D,%0A            %7B%0A              id: '',%0A              text: '%E9%80%89%E9%A1%B92'%0A            %7D,%0A            %7B%0A              id: '',%0A              text: '%E9%80%89%E9%A1%B93'%0A            %7D,%0A            %7B%0A              id: '',%0A              text: '%E9%80%89%E9%A1%B94'%0A            %7D%0A          
 %5D%0A  

Modify exercise default model.