<template>
	<fs-page>
		<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
		<!-- <template #form-header-right>
        <el-tag color="danger">form-header-right插槽</el-tag>
      </template> -->
	  <RepairStatusDialog
		v-show="dialogId !== null"
		:id="dialogId"
		v-model:visible="dialogVisible"
		@success="handleSuccess"
		/>
	</fs-page>


</template>

<script lang="ts" setup name="devicemaintenance">
import { useFs } from '@fast-crud/fast-crud';
import { onMounted ,ref} from 'vue';
import { GetPermission } from './api';
import { createCrudOptions } from './crud';
import { handleColumnPermission } from '/@/utils/columnPermission';
import RepairStatusDialog from './RepairStatusDialog/index.vue'

// const { crudBinding, crudRef, crudExpose, crudOptions, resetCrudOptions } = useFs({ createCrudOptions });


const dialogVisible = ref(false)
const dialogId = ref<number | null>(null)

const handleSuccess = () => {
  crudExpose.doRefresh()
}

const { crudBinding, crudRef, crudExpose, crudOptions, resetCrudOptions } = useFs({
  createCrudOptions: (ctx) => createCrudOptions({ ...ctx, dialogId, dialogVisible })
})

console.log("dialogId:::",dialogId)



// 页面打开后获取列表数据
onMounted(async () => {
	// 设置列权限
	const newOptions = await handleColumnPermission(GetPermission, crudOptions);
	//重置crudBinding
	resetCrudOptions(newOptions);
	// 刷新
	crudExpose.doRefresh();
});
</script>
