<script lang="ts">
import hwInputView from './hw-input-view.vue';
import hwInputNumberView from './hw-input-number-view.vue';
import hwTableView from './hw-table-view.vue';
import hwChartView from './hw-chart-view.vue';
import hwSliderView from './hw-slider-view.vue';
import hwRadioGroupView from './hw-radio-group-view.vue';

export default {
  name: 'hw-form-view',
  components: {
    hwInputView,
    hwTableView,
    hwInputNumberView,
    hwChartView,
    hwSliderView,
    hwRadioGroupView
  }
};
</script>

<template>
  <div>
    <el-form :model="formData[options.key || ('form-'+options.uuid)]"
             :inline="options.isInLine" :label-width="options.labelWidth">
      <component v-for="i in tasks" :is="i.type+'-view'" :options="i.options" :tasks="i.tasks"
                 :formData="formData[options.key || ('form-'+options.uuid)]" />
      <el-form-item>
        <el-button type="primary" @click="onSubmit" v-if="options.isSubmitBottom">{{ options.submitBottomName }}
        </el-button>
        <el-button v-if="options.isResetBottom" @click="onReset">{{ options.resetBottomName }}</el-button>
      </el-form-item>
    </el-form>
    {{ formData[options.key || ('form-' + options.uuid)] }}
    <pagination v-show="localData.total > 0"
                v-model:page="formData[options.key || ('form-'+options.uuid)][options.pageNum]"
                v-model:limit="formData[options.key || ('form-'+options.uuid)][options.pageSize]"
                :total="localData.total" @pagination="onSubmit" />
  </div>
</template>

<script lang="ts" setup>
import request from '@/utils/request';


const props = defineProps({
  options: Object,
  tasks: Array,
  formData: Object
});

const { options, tasks, formData } = toRefs(props);
const formDataOperation = inject('formDataOperation');
const localData = ref({});

onBeforeMount(() => {
  formData.value[options.value.key || ('form-' + options.value.uuid)] = {};
});

const onSubmit = async () => {
  try {
    const fun = () => {
      return `return async ()=>{
        ${options.value.submitFunction}
      }`;
    };
    const submitFunction = new Function('formData', 'request', 'formDataOperation', 'localData', fun());
    await submitFunction(formData.value[options.value.key || ('form-' + options.value.uuid)], request, formDataOperation, localData.value)();
    console.log();
  } catch (e) {
    console.log(e);
  }
};
const onReset = () => {
  formData.value[options.value.key || ('form-' + options.value.uuid)] = {};
};
</script>
<style scoped lang="less">

</style>



