<template>
    <div>
        <template v-if="Object.keys($store.state.data.sparePartApplyDetails).length > 0 || list != null">
            <el-table :data="list || Object.values($store.state.data.sparePartApplyDetails)" border>
                <!-- <el-table-column label="${comment}" align="center" prop="sparePartApplyDetailsId" /> -->
                <el-table-column label="备件编号" align="center" prop="sparePartNumber" />
                <el-table-column label="备件名称" align="center" prop="sparePartName" />
                <!-- <el-table-column label="备件id" align="center" prop="sparePartId" />
                <el-table-column label="出入库编号" align="center" prop="sparePartApplyId" /> -->
                <el-table-column label="备件规格" align="center" prop="sparePartSpecifications" />
                <el-table-column label="备件品牌" align="center" prop="sparePartBrand" />
                <!-- <el-table-column label="备件申领前数量" align="center" prop="sparePartQuantity" /> -->
                <el-table-column label="备件申购数量" align="center" prop="sparePartApplyQuantity" width="180px"
                    v-if="editable">
                    <template #default="scope">
                        <!-- @change="updateSparePartApply(scope.row)"  -->
                        <el-input-number v-model="scope.row.sparePartApplyQuantity" :min="1" :step="1" />
                    </template>
                </el-table-column>
                <el-table-column label="备件申购数量" align="center" prop="sparePartApplyQuantity" v-else />
                <!-- <el-table-column label="备注" align="center" prop="remark" /> -->
                <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100"
                    fixed="right" v-if="editable">
                    <template #default="scope">
                        <el-button link type="danger" icon="Delete" @click="removeSparePartApplyDetails(scope.row)">删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </template>
        <Empty v-else />
    </div>
</template>

<script setup>
import { removeSparePartApplyDetails, updateSparePartApplyDetails } from "@/utils/sparePartApplyDetails";
const props = defineProps({
    editable: {
        type: Boolean,
        default: true,
    },
    list: {
        type: Array,
        default: null,
    },
});
const { editable, list } = toRefs(props)
</script>