<script>
import util from 'eoss-ui/src/utils/util';
import { findSysCode, getDictList } from 'eoss-ui/src/config/api.js';
import store from 'eoss-ui/src/utils/store';
//import rules from 'eoss-ui/src/utils/rules.js';
import eoTable from './table.vue';
export default {
  name: 'EsDataTableForm',
  inheritAttrs: false,
  components: {
    [eoTable.name]: eoTable
  },
  provide() {},
  inject: {
    elForm: {
      default: ''
    }
  },
  props: {
    service: String,
    params: Object,
    full: Boolean,
    readonly: Boolean,
    numbers: Boolean,
    data: Array,
    url: String,
    thead: Array,
    optionData: Object,
    page: [Boolean, Object]
  },
  data() {
    return {
      result: null,
      option: {}
    };
  },
  computed: {
    models: {
      get() {
        return this.data ? this.data : this.result;
      },
      set(val) {
        return val;
      }
    },
    cols() {
      let col = [];
      this.theads.forEach((items) => {
        if (Array.isArray(items)) {
          items.forEach((item) => {
            if (!item.rowspan || item.rowspan < 2) {
              col.push(item);
            }
          });
        } else {
          col.push(items);
        }
      });
      return col;
    },
    theads() {
      return this.thead && util.isObject(this.thead[0])
        ? [this.thead]
        : this.thead;
    },
    types() {
      let types = [];
      this.theads.forEach((items) => {
        if (Array.isArray(items)) {
          items.forEach((item) => {
            if (item.type && item.type !== 'text' && item.type !== 'textarea') {
              types.push(item);
            }
          });
        } else if (
          items.type &&
          items.type !== 'text' &&
          items.type !== 'textarea'
        ) {
          types.push(items);
        }
      });
      return types;
    },
    options() {
      return this.optionData ? this.optionData : this.option;
    },
    findCode() {
      if (this.service) {
        return `/${this.service}${getDictList}`;
      }
      return findSysCode;
    }
  },
  watch: {
    theads: {
      immediate: true,
      deep: true,
      handler(val) {
        if (val) {
          val.forEach((items) => {
            if (Array.isArray(items)) {
              items.forEach((item) => {
                this.getOptions(item);
              });
            } else {
              this.getOptions(items);
            }
          });
        }
      }
    }
  },
  created() {},
  mounted() {},
  methods: {
    getOptions(item) {
      if (item.sysCode || item.url) {
        let params = util.extend(
          {},
          item.sysCode ? { sysAppCode: item.sysCode, code: sysCode } : {},
          item.param ? item.param : {}
        );
        util
          .ajax({
            url: item.sysCode ? this.findCode : item.url,
            method: this.method,
            params: params,
            data: params
          })
          .then((res) => {
            if (res.rCode === 0) {
              this.option[item.field || item.prop] = JSON.parse(
                JSON.stringify(res.results)
              );
              if (item.sysCode) {
                store.set(
                  item.sysCode,
                  JSON.parse(JSON.stringify(res.results))
                );
              }
            } else {
              let msg = res.msg || '系统错误，请联系管理员！';
              this.$message.error(msg);
            }
          })
          .catch((err) => {
            if (err.message && err.message !== 'canceled') {
              this.$message.error(err.message);
            }
          });
      }
    }
  },
  render(h) {
    let tag = this.elForm ? 'div' : 'form';
    return h(
      tag,
      {
        class: { 'es-data-form-full': this.full, 'es-data-table-form': 1 }
      },
      [
        h('eo-table', {
          props: {
            cols: this.cols,
            thead: this.theads,
            numbers: this.numbers,
            cols: this.cols,
            data: this.models,
            types: this.types,
            options: this.options,
            page: this.page,
            ...this.$attrs
          },
          on: this.$listeners
        })
      ]
    );
  }
};
</script>
