<template>
    <hc-new-dialog is-table :padding="false" widths="1200px" :show="isShow" title="添加合同工程清单" :loading="saveLoading" @save="modalSave" @close="modalClose">
        <hc-new-card>
            <template #search>
                <hc-search-input v-model="searchForm.queryValue" placeholder="请输入清单编号关键词" @search="searchClick" />
            </template>
            <hc-table
                :column="tableColumn" :datas="tableData" :loading="tableLoading"
                is-new is-check :check-style="{ width: 29 }" :index-style="{ width: 60 }"
                @selection-change="tableCheckChange"
            >
                <template #isSupplement="{ row }">
                    <span class="text-link">{{ row?.isSupplement === 1 ? '是' : '否' }}</span>
                </template>
            </hc-table>
        </hc-new-card>
    </hc-new-dialog>
</template>

<script setup>
import { ref, watch } from 'vue'
import { getContrInFormAllByConId, saveInvenFormMeter } from '~api/project/debit/contract/check-list.js'
import { useAppStore } from '~src/store'
import { arrToId, getArrValue } from 'js-fast-way'
const props = defineProps({
    ids: {
        type: [String, Number],
        default: '',
    },
})
//事件
const emit = defineEmits(['finish', 'close'])
const useAppState = useAppStore()
const contractId = ref(useAppState.getContractId || '')

const ids = ref(props.ids)
//双向绑定
// eslint-disable-next-line no-undef
const isShow = defineModel('modelValue', {
    default: false,
})

//监听
watch(() => [
    props.ids,
], ([Id]) => {
  
    ids.value = Id
}, { immediate: true })

//监听
watch(isShow, (val) => {
    if (val) {
        console.log('处理数据')
        getTableData()
    }
})

//搜索
const searchForm = ref({
  
})

const searchClick = () => {
    getTableData()
}

//表格数据
const tableLoading = ref(false)
const tableColumn = [
    { key: 'formNumber', name: '清单编号' },
    { key: 'formName', name: '清单名称' },
    { key: 'currentPrice', name: '现行单价' },
    { key: 'contractTotal', name: '合同数量' },
    { key: 'changeTotal', name: '合同变更后数量' },
    { key: 'poseNum', name: '已分解量' },
    { key: 'isSupplement', name: '是否增补' },
]
const tableData = ref([])
const getTableData = async () => {
    tableLoading.value = true
    const { error, code, data } = await getContrInFormAllByConId({
       ...searchForm.value,
       contractId:contractId.value,
       formNum:searchForm.value.queryValue,
       meterId:ids.value,
    })
    tableLoading.value = false
    if (!error && code === 200) {
        tableData.value = getArrValue(data)
    } else {
        tableData.value = []
    }
}

//表格选择
const selectList = ref([])
const tableCheckChange = (checks) => {
    selectList.value = checks
}
const saveLoading = ref(false)
const modalSave = async () => {
    saveLoading.value = true
    const { error, code, msg } = await saveInvenFormMeter({
        formIds:arrToId(selectList.value),
        meterId:ids.value,
      
        })
        //判断状态
        saveLoading.value = false
        if (!error && code === 200) {
            window?.$message?.success(msg)
            emit('finish', selectList.value)
        }
  
    modalClose()
}
const modalClose = () => {
    isShow.value = false
    emit('close')
}
</script>
