
import { AccountPeriodDto } from '@/api/accountPeriod/accountPeriodModel';
import { ListIitem } from '@/api/base/BaseDataModel';
import { AccountPeriodType } from '@/type/BaseEnum';
import { isNumber } from '@/utils/is';
import { ref, reactive, computed, nextTick } from 'vue';

type AccountPeriodParams = Partial<AccountPeriodDto>
/**
 * 新增或编辑 账期 
 */
function useAccountPeriodEdit(onClose: Function, onShow: Function, resetForm: (FormInstance) => void, dialog) {
    // 校验
    const addEditAccountPeriodFormRules = reactive({
        customerId: [
            { required: true, message: '请选择客户', trigger: 'change' }
        ],
        accountPeriod: [
            { required: true, message: '请选择账期类型', trigger: 'change' }
        ],
        checkoutTypes: [
            { required: true, message: '请选择结账类型', trigger: 'change' }
        ],
        accountingPeriodLimit: [
            { required: true, message: '请输入账期额度', trigger: 'blur' }
        ],
        checkoutDays: [
            { required: true, message: '请输入结账天数', trigger: 'blur' }
        ],
    })
    // 表单数据
    const addEditAccountPeriodForm = reactive<AccountPeriodParams>({
        customerId: undefined,
        accountPeriod: undefined,
        accountPeriodName: undefined,
        accountingPeriodLimit: undefined,
        checkoutDays: undefined,
        checkoutTypes: 0,
        checkoutTypesName: undefined,
    })
    // 列表数据
    const addEditAccountPeriodState = reactive({
        type: AccountPeriodType.ADD,//状态
        cycleTypeList: [] as ListIitem[],
        checkoutTypesList: [
            { value: 0, label: '根据账期生成' },
            { value: 1, label: '手工填写' },
        ] as ListIitem[],
        isShowCheckoutDays: false
    })
    // ref dom
    const addEditAccountPeriodRef = ref()
    // col宽度百分比
    const setFormItemWidth = computed(() => {
        return { width: `calc(100% - 32px)` }
    })
    // 隐藏
    const onclose = () => {
        // 清空数据
        resetForm(addEditAccountPeriodRef.value)
        Object.keys(addEditAccountPeriodForm).forEach((key) => {
            addEditAccountPeriodForm[key] = undefined;
        })
        // 默认
        addEditAccountPeriodForm.checkoutTypes = 0
        onClose()
    }
    // 显示
    const show = (type: number, data: Recordable) => {
        // 标题
        type === AccountPeriodType.ADD ? 
            dialog.title = "新增账期" : dialog.title = "编辑账期";
        onShow()
        nextTick(() => {
            if (type === AccountPeriodType.EDIT) {
                // 编辑
                Object.assign(addEditAccountPeriodForm, { ...data, customerId: String(data.customerId) })
                addEditAccountPeriodState.type = AccountPeriodType.EDIT
            }
            addEditAccountPeriodState.type = AccountPeriodType.ADD
            const checkoutTypes = isNumber(addEditAccountPeriodForm.checkoutTypes) ? addEditAccountPeriodForm.checkoutTypes : 0
            changeCheckoutTypes(checkoutTypes)
        })
    }
    // 结账类型change
    const changeCheckoutTypes = (val: number) => {
        // 根据账期生成
        if(val === 0) {
            addEditAccountPeriodState.isShowCheckoutDays = false
            addEditAccountPeriodForm.checkoutDays = undefined
        } else {
            addEditAccountPeriodState.isShowCheckoutDays = true
        }
    }
    const geShowCheckoutDays = computed(() => {
        return addEditAccountPeriodState.isShowCheckoutDays
    })

    return {
        addEditAccountPeriodRef,
        addEditAccountPeriodForm,
        addEditAccountPeriodFormRules,
        addEditAccountPeriodState,
        setFormItemWidth,
        geShowCheckoutDays,
        changeCheckoutTypes,
        onclose,
        show
    }
}

export {
    useAccountPeriodEdit
}