<template>
  <div class="page-body router-edit-page">

    <vxe-form :data="formOptions.data" ref="xForm" :title-width="formOptions.titleWidth"
      :title-align="formOptions.titleAlign" :rules="formOptions.rules" :items="formOptions.items" titleColon>
    </vxe-form>


    <div class="footerbar-bottom">
      <a-button type="primary" @click="ok">确定</a-button>
      <a-button @click="cancel">取消</a-button>
    </div>

  </div>
</template>
 
<script> 

export default {

  props: {
    pageMode: {
      type: String,
      default: "edit"
    },
    pageOptions: {
      type: Object
    },
    dataId: {
    }

  },

  data() {

    // 页面数据变量
    var pageData = {

      actions: { 
      },

      beid: 0,
      parentName: '',

      formOptions: {
        data: {
        },

        titleWidth: 200,
        titleAlign: 'right',

        rules: {
        },

        items: [
        ]
      },


    };

    pageData.actions = this.pageOptions.actions;

    pageData.formOptions = Object.assign({}, this.$mk.config.defaults.formOptions, pageData.formOptions);

    return pageData;
  },
  created() {
 
    this.$mk.post({
      url: this.actions.get,
      loading: "加载中...",
      data: { 
      }
    }).then(a => {

      let items = [];
      let data = {};
      let getName = (info) => {
        for (let name in info) {
          return name;
        }
        return null;
      }
      a.data.settings.forEach(o => {
        let name = getName(o.setting);
        if (!name) return;
        let item = { field: name, title: o.title, span: 24, itemRender: { name: '$input', props: { placeholder: o.desc } } };

        if (o.type == "bool") {
          item.itemRender.name = "$switch";
          item.dataRule = { type: "string" };
          data[name] = o.setting[name] === "true";
        }
        else if (o.type == "integer") {
          item.itemRender.props.type = "integer";
          item.dataRule = { type: "integer" };

          data[name] =  parseInt(o.setting[name]);
        }
        else {
          data[name] = o.setting[name];
        }
        items.push(item);
      });
 
      this.formOptions.items = items;
      this.formOptions.data = data;

    }).catch((a) => {
      this.$mk.error(a.data.msg);
    });



  },
  // 函数
  methods: {

  
    ok() {

      let save = () => {
        let action = this.actions.save;
        let postdata = Object.assign({}, this.formOptions.data);
  
        this.$mk.formatFormData({ data: postdata, rules: this.formOptions.items });

        let saveData = { 
          "settings": [
          ]
        };
        for (let name in postdata) {
          saveData.settings.push({
            key: name,
            value: postdata[name]
          })
        }
 
        this.$mk.post({
          url: action,
          loading: "保存中...",
          data: saveData,
        }).then(() => {
          this.$mk.success("保存成功");
          
        }).catch((a) => {
          this.$mk.error(a.data.msg);
        });
      };

      this.$refs.xForm.validate((a) => {

        if (a) {
          let count = 0;
          for (let name in a) {
            a[name];
            count++;
          }
          this.$mk.error(`存在${count}项错误，请检查`);
        } else {
          save();
        }
      });


    },

    cancel() {
      this.$emit("callback", {});
    },

  },
  // 监听属性
  watch: {

  }
};

</script>
<style scoped lang="less">
.router-edit-page .vxe-pulldown {
  width: 100%;
}
</style>
