lanan-system-vue/src/views/repair/Components/PartChoose.vue
2024-09-14 11:33:58 +08:00

101 lines
2.6 KiB
Vue

<template>
<el-select v-model="partSelected" ref="selectTable" clearable style="width: 45rem">
<el-option style="display: none" v-for="part in partList" :key="part.id" :label="part.name" :value="part.id"/>
<el-table :data="partList" style="width: 100%" @row-click="handleSelectionChange">
<el-table-column label="序号" align="center" width="80">
<template scope="scope">
<span>{{ scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="商品名称" prop="name" width="120"/>
<el-table-column label="规格" prop="model" width="120"/>
<el-table-column label="商品编码" prop="code" width="120"/>
<el-table-column label="可用库存" prop="stock" width="80"/>
<el-table-column label="成本" prop="price" width="80"/>
<el-table-column label="仓库" prop="warehouse" width="80"/>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
/>
</el-select>
</template>
<script>
export default {
name: "PartChoose",
data(){
return{
partSelected: null,
partList: [
{
id: 1,
tenantId: 1,
barCode: "12344564632463",
code: "12312312",
name: "测试1",
model: "12321",
price: "100",
type: "不知道",
unit: "个",
warehouse: "d1",
miniStock: 100,
maxStock: 100,
stock: 20,
img: '',
attribute: "123213123",
corpId: 1,
coverImage: '',
carModel: "大车",
remark: "没有",
},
{
id: 2,
tenantId: 1,
barCode: "12344564632463",
code: "12312312",
name: "测试2",
model: "12321",
price: "10",
type: "不知道",
unit: "个",
warehouse: "d2",
miniStock: 10,
maxStock: 10,
stock: 5,
img: '',
attribute: "123213123",
corpId: 1,
coverImage: '',
carModel: "大车",
remark: "没有",
}
],
queryParams:{
pageNo: 1,
pageSize: 10
},
total: 2
}
},
mounted() {
this.listPart()
},
methods:{
// TODO 获取商品信息
async listPart(){
},
handleSelectionChange(data){
this.$emit("selected", data)
this.$refs.selectTable.blur()
}
}
}
</script>
<style scoped lang="scss">
.pagination-container{
margin: 0 auto !important;
padding: 0 !important;
}
</style>