This commit is contained in:
余同学 2024-12-01 17:26:19 +08:00
parent e70e0e9c0b
commit 7225340c62
3 changed files with 143 additions and 115 deletions

View File

@ -99,6 +99,8 @@
</obj-table-plus>
<!-- 添加或编辑 -->
<add-or-update
:marketId="formInline.marketId"
:shopId="formInline.shopId"
@queryList="$refs.oTable.reload()"
ref="addOrUpdate"
></add-or-update>

View File

@ -68,87 +68,109 @@
已选择商品
</div>
<div style="padding: 20px">
<div style="border-top: 1px solid #ccc; padding: 10px 0 0 0">
<div style="font-size: 16px; margin-bottom: 20px">
<span>商品ID:</span>
<span style="margin-left: 20px">商品名称:</span>
</div>
<el-table
border
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange"
<div
v-for="item in ruleForm.productList"
:key="item.id"
style="border-top: 1px solid #ccc; padding: 10px 0 0 0"
>
<el-table-column align="center" label="是否预售" width="80">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isShow"></el-checkbox>
</template>
</el-table-column>
<el-table-column align="center" label="SKU-ID" prop="date" />
<el-table-column align="center" label="规格" prop="name" />
<el-table-column align="center" label="属性" prop="address" />
<el-table-column
align="center"
label="销售价"
prop="address"
width="120"
/>
<el-table-column align="center" label="*是否预售" width="200">
<template slot="header">
<span style="color: red">*是否预售</span>
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.isShow"
v-model="scope.row.presalePrice"
placeholder="请输入销售价"
></el-input>
</template>
</el-table-column>
<el-table-column align="center" label="*定金" width="200">
<template slot="header">
<span style="color: red">*定金</span>
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.isShow"
v-model="scope.row.presalePrice"
placeholder="请输入订金"
></el-input>
</template>
</el-table-column>
<el-table-column align="center" label="尾款" width="200">
<template slot-scope="scope">
<span v-if="scope.row.isShow">{{
scope.row.presalePrice
}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="*预售库存" width="200">
<template slot="header">
<span style="color: red">*预售库存</span>
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.isShow"
v-model="scope.row.presalePrice"
placeholder="请输入预售库存"
></el-input>
</template>
</el-table-column>
</el-table>
</div>
<div style="font-size: 16px; margin-bottom: 20px">
<span>商品ID:{{item.id}}</span>
<span style="margin-left: 20px">商品名称:{{item.name}}</span>
</div>
<el-table
border
ref="multipleTable"
:data="item.productSpecificationList"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column align="center" label="是否预售" width="80">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isShow"></el-checkbox>
</template>
</el-table-column>
<el-table-column align="center" label="SKU-ID" prop="id" />
<el-table-column align="center" label="规格" prop="attributeList">
<template slot-scope="scope">
<span>{{scope.row.attributeList}}:{{scope.row.attributeValue}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="属性" prop="address" />
<el-table-column
align="center"
label="销售价"
prop="address"
width="120"
/>
<el-table-column align="center" label="*是否预售" width="200">
<template slot="header">
<span style="color: red">*是否预售</span>
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.isShow"
v-model="scope.row.presalePrice"
placeholder="请输入销售价"
></el-input>
</template>
</el-table-column>
<el-table-column align="center" label="*定金" width="200">
<template slot="header">
<span style="color: red">*定金</span>
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.isShow"
v-model="scope.row.presalePrice"
placeholder="请输入订金"
></el-input>
</template>
</el-table-column>
<el-table-column align="center" label="尾款" width="200">
<template slot-scope="scope">
<span v-if="scope.row.isShow">{{
scope.row.presalePrice
}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="*预售库存" width="200">
<template slot="header">
<span style="color: red">*预售库存</span>
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.isShow"
v-model="scope.row.presalePrice"
placeholder="请输入预售库存"
></el-input>
</template>
</el-table-column>
</el-table>
</div>
<el-empty v-show="ruleForm.productList.length == 0" description="请选择商品"></el-empty>
</div>
</div>
<!-- 选择商品 -->
</obj-modal>
<commodity @getProduct="getProduct" ref="commodity"></commodity>
</div>
</template>
<script>
import commodity from "./commodity.vue";
import { debounce, cloneDeep } from "lodash";
export default {
components: {},
components: { commodity },
props: {
marketId: {
type: String,
default: "",
},
shopId: {
type: String,
default: "",
},
},
data() {
return {
isAdd: true,
@ -164,6 +186,7 @@ export default {
name: "",
value: "1",
radio: "1",
productList: [],
},
orderTime: [], //
arrears: [], //
@ -239,11 +262,23 @@ export default {
}
},
selectProduct() {
console.log("选择商品");
console.log("选择商品", this.marketId, this.shopId);
this.$nextTick(() => {
this.$refs.commodity.toggle().add({
marketId: this.marketId,
shopId: this.shopId,
});
});
},
handleSelectionChange(e) {
console.log(e);
},
getProduct(row) {
this.ruleForm.productList = row;
console.log(this.ruleForm.productList, this.ruleForm.productList.length);
console.log("获取商品");
},
},
computed: {
modalHandles() {

View File

@ -17,39 +17,21 @@
:tableEvent="tableEvent"
:enableAutoQuery="false"
>
<!-- <template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item v-if="marketList.length > 0" label="菜市场">
<el-select
@change="getData"
v-model="formInline.marketId"
placeholder="请选择菜市场"
>
<el-option
v-for="item in marketList"
:key="item.marketId"
:label="item.marketName"
:value="item.marketId"
></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="marketList.length > 0" label="店铺">
<el-select v-model="formInline.shopId" placeholder="请选择店铺">
<el-option
v-for="item in storeList"
:key="item.shopId"
:label="item.shopName"
:value="item.shopId"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
</el-form-item>
</el-form>
</template> -->
<template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="商品搜索">
<el-input
v-model="formList.name"
placeholder="商品搜索"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
</el-form-item>
</el-form>
</template>
</obj-table-plus>
</template>
</obj-modal>
@ -63,7 +45,7 @@ export default {
isAdd: true,
//
modalConfig: {
title: "请点击选择商品",
title: "请点击选择商品 (提示最多选择5个商品)",
show: false,
width: "1000px",
},
@ -76,14 +58,11 @@ export default {
"row-id": "id",
"show-overflow": false,
},
selectList: {},
tableEvent: {
"current-change": async (e) => {
console.log(e.row);
this.selectList = e.row;
},
},
selectList: [],
formInline: {},
formList: {
name: "",
},
};
},
methods: {
@ -121,6 +100,7 @@ export default {
}
return {
add: (row) => {
console.log(row);
this.formInline = row;
this.isAdd = true;
this.$nextTick(() => {
@ -137,7 +117,7 @@ export default {
computed: {
tableCols() {
return [
{ type: "seq", width: "60px", align: "center", title: "序号" },
{ type: "checkbox", width: "60px", fixed: "left" },
{
title: "商品图",
field: "productPhotoList",
@ -222,6 +202,17 @@ export default {
},
];
},
tableEvent() {
return {
"checkbox-all": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
},
"checkbox-change": ({ records, reserves }) => {
console.log(this.selectList, "2");
this.selectList = [...records, ...reserves];
},
};
},
},
};
</script>