<template>
  <div class="device-manager-box">
    <CustomNormalTable
      :columns="[]"
      :searchFormSchema="searchFormSchema"
      :list="list"
      :formSchema="formSchema"
      :deleteById="deleteById"
      :batchDelete="batchDeleteById"
      :saveOrUpdate="saveOrUpdate"
      @edit-handler="changeFormItems"
      designScope="workingFace-tabel"
      title="智能管控"
      :showTab="true"
      deviceType="managesys"
      columnsType="managesys_list"
    />
  </div>
</template>

<script lang="ts" name="system-user" setup>
  //ts语法
  import { ref, onMounted } from 'vue';
  import CustomNormalTable from './CustomNormalTable.vue';
  import { searchFormSchema, commentFormSchema } from './workingFace.data';
  import { list, deleteById, batchDeleteById, saveOrUpdate } from './workingFace.api';

  import { FormSchema } from '/@/components/Table';
  import { getFormSchemaColumns } from '/@/hooks/web/useWebColumns';

  const formSchema = ref<FormSchema[]>([]);
  const isRefresh = ref(false);

  const arrToFormColumns = (tableHeaderColumns = [], strtype) => {
    const columnList: any[] = [];
    if (tableHeaderColumns.length > 0) {
      tableHeaderColumns.forEach((item: any) => {
        let columnsItem;
        if (item.type == 1 || item.type == 10) {
          columnsItem = {
            label: item.des, //_dictText
            field: item.monitorcode,
            component: item.type == 1 ? 'Input' : item.type == 10 ? 'InputTextArea' : '',
          };
        } else {
          if (item.type == 3) {
            columnsItem = {
              label: item.des, //_dictText
              field: item.monitorcode,
              component: 'RadioGroup',
              defaultValue: 1,
              componentProps: () => {
                return {
                  options: [
                    { label: '是', value: 1, key: '1' },
                    { label: '否', value: 0, key: '2' },
                  ],
                  stringToNumber: true,
                };
              },
            };
          }
          if (item.type == 4) {
            columnsItem = {
              label: item.des, //_dictText
              field: item.monitorcode,
              component: 'JDictSelectTag',
              componentProps: {
                dictCode: item.dict,
                placeholder: '请选择',
                stringToNumber: true,
              },
            };
          }
        }
        columnList.push(columnsItem);
        formSchema.value = [...commentFormSchema(strtype), ...columnList];
      });
    } else {
      formSchema.value = commentFormSchema(strtype) as any[];
    }
  };

  const changeFormItems = (data) => {
    if (data && data['strtype']) {
      const formSchemaColumns = getFormSchemaColumns(`${data['strtype']}_edit`) || [];
      arrToFormColumns(formSchemaColumns, data['strtype']);
      isRefresh.value = true;
    } else {
      formSchema.value = commentFormSchema(data['strtype']) as any[];
      isRefresh.value = true;
    }
  };

  onMounted(() => {});
</script>

<style scoped></style>
