<!--  -->
<template>
    <div>
        <el-alert
            :closable="false"
            class="hc-alert"
            show-icon
            style=""
            title=" 填写之前请务必保证已选择设计配合比等级 (否则计算式不生效），
            通过含水率与设计配合比数据计算出含水量，通过设计配合比与含水量计算出施工配合比"
            type="warning"
        />
        <el-form ref="waterRormref" :model="waterModal" label-width="auto" size="large">
            <el-form-item label="黄砂：">
                <el-input v-model="waterModal.sand" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="碎（砾）石1：">
                <el-input v-model="waterModal.macadamOne" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="碎（砾）石2：">
                <el-input v-model="waterModal.macadamTwo" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="碎（砾）石3：">
                <el-input v-model="waterModal.macadamThree" placeholder="请输入" />
            </el-form-item>
        </el-form>
    </div>
</template>

<script setup>
import { ref, watch } from 'vue'
import wbsApi from '~api/data-fill/wbs'
const props = defineProps({
    contractId: [String, Number],
    keyName: [String, Number],
    designStrength:[String, Number],
    pKeyId: [String, Number],
})
const key_name = ref(props.keyName)
const contractId = ref(props.contractId)
const design_strength = ref(props.designStrength)
const pKeyId = ref(props.pKeyId)
const waterModal = ref({})
const waterRormref = ref(null)

//监听
watch(() => [
    props.contractId,
    props.keyName,
    props.designStrength,
    props.pKeyId,

], ([cid, keyName, strength, PKeyId]) => {
    contractId.value = cid
    key_name.value = keyName
    design_strength.value = strength
    pKeyId.value = PKeyId
},

)


const waterSave = async ()=>{
    const { error, code, data } = await wbsApi.calculateWater({
        ...waterModal.value,
        key: key_name.value,
        contractId: contractId.value,
        designStrength: design_strength.value,
        keyId:pKeyId.value,
    })
    if (!error && code === 200) {
        window?.$message?.success('操作成功')
        return data
    }
}

// 暴露出去
defineExpose({
    waterSave,
})
</script>

<style lang='scss' scoped>
</style>