<template>
  <template-view
      ref="TemplateView"
      v-loading="loading"
      :bizParams="viewBizParams"
      :config="config"
      :extraParams="extraParams"
      :formData="formData"
      :readOnly="readOnly"
      v-on="bindEvents()"/>
</template>

<script>
import Props        from './Props'
import TemplateView from "./components/TemplateViews";
import {getVarType} from "../../utils/utils";

/**
 * 基础模板组件
 * - 示例
 *
 * ```vue
 * <easy-data-template ::biz-params="bizParams" :templateId="templateId" @loadOk="bizParamsOk">
 * </easy-data-template>
 * ```
 * 详细用法参考下方链接
 *
 * [EasyDataTemplate组件使用示例](./web-comp/ExampleEasyDataTemplateCode.md)
 *
 * [](./EasyDataTemplateProps.md ':include')
 */
export default {
  name: "EasyDataTemplate",
  components: {TemplateView},
  props: Props,
  data() {
    return {
      loading: true,
      getTemplateUrl: '/easydata/template/getModule',
      config: {},
      viewBizParams: {}
    }
  },
  watch: {
    templateId: {
      immediate: true,
      handler: function (newVal, oldVal) {
        if (newVal && newVal !== oldVal) {
          this.getTemplate()
        }
      }
    },
    templateConfig: {
      deep: true,
      immediate: true,
      handler: function (newVal, oldVal) {
        if (newVal && newVal !== oldVal && getVarType(newVal.prop) !== "string") {
          this.config = newVal
          this.$nextTick(() => {
            this.initBizParam()
          })
        }
      }
    },
    bizParams: {
      deep: true,
      immediate: true,
      handler: function (newVal, oldVal) {
        if (newVal && Object.keys(this.config).length > 0) {
          this.initBizParam()
        }
      }
    },
  },

  methods: {
    /**
     * @private
     * @returns {{} & Record<string, Function | Function[]>}
     */
    bindEvents() {
      let events = Object.assign({}, this.$listeners);
      events.loadOk = this.loadOk
      return events
    },

    /**
     * @private
     * @name getTemplate
     * @return {Promise<void>}
     */
    async getTemplate() {
      try {
        const res = await this.$EdFrame.postAction(this.getTemplateUrl, {id: this.templateId})
        if (res.success) {
          let modules = res.data.oneModules.filter(oneModule => {
            return oneModule.prop ? getVarType(oneModule.prop.isHidden) === 'boolean' ? oneModule.prop.isHidden : true : true
          })
          this.config = {
            prop: res.data.prop,
            modules: modules,
            template: res.data.template,
            moduleInfo: res.data.moduleInfo.keyInfoObject
          }
          this.initBizParam()
        } else {
          this.$message.error(res.message)
        }
      } catch (e) {
        this.$message.error(e)
        this.loading = false
      }
    },

    /**
     * @name initBizParam
     * @return {Object|*[]}
     * @description 初始化BizParams
     */
    initBizParam() {
      if (this.bizParams && Object.keys(this.bizParams).length > 0) {
        this.viewBizParams = this.bizParams
      } else {
        const {biz_params} = this.config.moduleInfo
        if (biz_params && biz_params.length > 0) {
          biz_params.split(',').map((bizParam) => {
            this.$set(this.viewBizParams, bizParam, "")
          })
        }
      }
    },
    queryData() {
      this.$refs.TemplateView.queryModuleData()
    },
    /**
     * 获取业务参数
     * @returns {{}}
     */
    getBizParams() {
      return this.viewBizParams
    },

    /**
     * 重置数据
     */
    resetData() {
      if (this.$refs.TemplateView) {
        this.$refs.TemplateView.resetData()
      }
    },


    /**
     * @name loadOk
     * @description 数据加载完成
     */
    loadOk() {
      this.loading = false
      this.$emit('loadOk')
    },
    /**
     * 获取表单数据
     * @return {*}
     * @param id
     */
    getFormData(id) {
      return this.$refs.TemplateView.getFormData(id)
    },
    /**
     * 验证表单
     * @name validate
     * @return {Promise<void>}
     */
    async validate(id) {
      return this.$refs.TemplateView.validate(id)
    },
    /**
     * 获取超级提交时的请求url、提交参数
     */
    async getSubmitData(isValidate) {
      return this.$refs.TemplateView._getSubmitData(isValidate)
    }
  }
}
</script>

<style lang="scss" scoped>
@import "../../style/index.scss";
</style>
