效果
![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/4e0251109fcf41c8a9146c52585f6cf7.png)
<template>
<el-dialog v-model="produceDialogFormVisible" draggable custom-class="dialog-title" :title="title" :close-on-click-modal="false">
<el-form label-width="120px">
<el-row :gutter="40">
<el-col :span="12">
<el-form-item label="需求单编号" >
<el-input v-model="orderNo"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="预计交付时间">
<el-date-picker
v-model="estimatedCompletionTime"
type="date"
placeholder="Pick a day"
style="width: 200px"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-table
ref="table"
v-loading="listLoading"
:data="list"
fit
highlight-current-row
header-cell-class-name="header-cell"
>
<el-table-column type="selection" width="55" />
<el-table-column type="index" width="50" />
<el-table-column label="仓库" min-width="80px">
<template #default="{row}">
<span>{{ row.warehouseName }}</span>
</template>
</el-table-column>
<el-table-column label="产品名称" min-width="150px">
<template #default="{row}">
{{ getName(row.property) }}
</template>
</el-table-column>
<el-table-column label="数量" min-width="200px">
<template #default="{row}">
<el-input-number v-model="row.number" :step="row.unitMinimum === '0' ? 0.01 : row.unitMinimum" step-strictly :min="0" :max="row.inventoryLimit" @change="handleChange"/>
<span style="line-height: 32px;margin-left: 5px">{{ row.unitName? row.unitName:'' }}</span>
</template>
</el-table-column>
<el-table-column label="单价" min-width="80px">
<template #default="{row}">
<span>{{ row.univalent }}</span>
</template>
</el-table-column>
<el-table-column label="小计" min-width="80px">
<template #default="{row}">
<span>{{ row.total }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" min-width="230" class-name="small-padding fixed-width">
<template #default="{row}">
<el-button size="small" plain icon="Delete" @click="handleDelete(row)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<template #footer>
<el-button @click="produceDialogFormVisible = false">
取消
</el-button>
<el-button v-permission="['biz:warningconfiguration:WarningConfiguration:update']" type="primary" :loading="loading" @click="createData()">
确定
</el-button>
</template>
<product-range-select ref="productRangeSelect" v-model="temp.productText" :range-option="rangeOption" />
</el-dialog>
</template>