拼团列表添加回显

1125/zhangyilun
zyl 2024-12-05 01:52:53 +08:00
parent 15a3d00801
commit addaaa51b5
6 changed files with 431 additions and 3 deletions

View File

@ -5,7 +5,7 @@
"author": "若依",
"license": "MIT",
"scripts": {
"dev": "vue-cli-service serve",
"dev": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
"build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview",

View File

@ -0,0 +1,30 @@
import request from '@/utils/request'
// 查询商品拼团信息列表
export function list(data) {
return request({
url: '/marketing/team/list',
method: 'post',
data
})
}
export function save(data) {
return request({
url: '/marketing/team/',
method: 'post',
data
})
}
export function updateByTeamId(data) {
return request({
url: '/marketing/team/updateByTeamId',
method: 'put',
data
})
}
export function findById(id) {
return request({
url: '/marketing/team/findById/'+id,
method: 'post'
})
}

View File

@ -42,3 +42,11 @@ export function delAttributeGroup(id) {
method: 'delete'
})
}
//修改状态按钮
export function update(data) {
return request({
url: '/product/update/',
method: 'put',
data
})
}

View File

@ -49,3 +49,9 @@ export function delInfo(id) {
method: 'delete'
})
}
export function findId(id) {
return request({
url: '/product/sku/list/' + id,
method: 'get'
})
}

View File

@ -0,0 +1,360 @@
<template>
<div>
<el-form :model="form" :inline="true" class="demo-form-inline">
<el-form-item label="拼团名称" prop="name">
<el-input
v-model="form.name"
placeholder="请输入拼团名称"
clearable
/>
</el-form-item>
<el-form-item label="活动状态" prop="status">
<el-select v-model="form.status" placeholder="请选择活动状态" clearable>
<el-option value="Y" label="热销中"></el-option>
<el-option value="N" label="已结束"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery"></el-button>
</el-form-item>
<br>
<el-button type="primary" @click="addTeam()"></el-button>
</el-form>
<el-table :data="pageList.list">
<el-table-column label="拼团id" align="center" prop="id" />
<el-table-column label="拼团名称" align="center" prop="name" />
<el-table-column label="商品图片" align="center" prop="productImage" width="100">
<template slot-scope="scope">
<image-preview :src="scope.row.productImage" :width="50" :height="50"/>
</template>
</el-table-column>
<el-table-column label="商品价格" align="center" prop="productPrice" />
<el-table-column label="拼团价格" align="center" prop="teamPrice" />
<el-table-column label="拼团人数" align="center" prop="attendNumber" />
<el-table-column label="开团人数" align="center" prop="openTeamNumber" />
<el-table-column label="参团人数" align="center" prop="addTeamNumber" />
<el-table-column label="团购库存" align="center" prop="teamStock" />
<el-table-column label="剩余库存" align="center" prop="remainStock" />
<el-table-column label="活动结束时间" align="center" prop="endTime" />
<el-table-column label="活动状态" align="center" prop="status" >
<template slot-scope="scope">
<span style="margin-left: 10px" v-if="scope.row.status == 'Y' "></span>
<span style="margin-left: 10px" v-if="scope.row.status == 'N' "></span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>修改</el-button>
<el-button
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="form.pageNum"
:page-sizes="[1, 2, 3, 4]"
:page-size="form.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="pageList.total">
</el-pagination>
<!--添加弹出框 -->
<el-dialog :title="title" :visible.sync="dialogFormVisible">
<!-- 步骤条 -->
<el-steps :active="active" finish-status="success">
<el-step title="步骤 1"></el-step>
<el-step title="步骤 2"></el-step>
<el-step title="步骤 3"></el-step>
</el-steps>
<div v-if="active == 0">
<el-form :model="addForm">
<el-form-item label="活动名称" :label-width="formLabelWidth">
<el-input v-model="addForm.name" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="商品" :label-width="formLabelWidth">
<el-button type="primary" @click="addProduct"></el-button>
</el-form-item>
<el-form-item label="商品" :label-width="formLabelWidth">
<image-preview :src="addForm.productImage" :width="50" :height="50"/>
</el-form-item>
<el-form-item label="活动简介" :label-width="formLabelWidth">
<el-input v-model="addForm.introduction" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="商品单位" :label-width="formLabelWidth">
<el-input v-model="addForm.unit" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="策略" :label-width="formLabelWidth">
<el-input v-model="addForm.strategyType" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="拼团类型" :label-width="formLabelWidth">
<el-select v-model="addForm.strategyId" placeholder="请选择拼团类型" clearable>
<el-option value="0" label="免单团"></el-option>
<el-option value="1" label="百人团"></el-option>
<el-option value="2" label="普通团"></el-option>
</el-select>
</el-form-item>
<el-form-item label="结束时间" :label-width="formLabelWidth">
<el-date-picker
v-model="addForm.endTime"
type="datetime"
placeholder="选择日期时间"
value-format="yyyy-MM-dd HH:mm:ss">
</el-date-picker>
</el-form-item>
</el-form>
</div>
<div v-if="active == 1">
<el-form :model="addForm">
<el-form-item label="活动排序" :label-width="formLabelWidth">
<el-input v-model="addForm.sort" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="活动详细" :label-width="formLabelWidth">
<el-input v-model="addForm.content" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="活动状态" :label-width="formLabelWidth">
<template>
<el-radio v-model="addForm.status" label="Y"></el-radio>
<el-radio v-model="addForm.status" label="N"></el-radio>
</template>
</el-form-item>
<el-form-item label="轮播图" :label-width="formLabelWidth">
<image-upload v-model="addForm.imageList"/>
</el-form-item>
</el-form>
</div>
<div v-if="active ==2">
<el-form :model="addForm">
<el-form-item label="商品规格" :label-width="formLabelWidth">
<el-table ref="table" :data="productSkuList" tooltip-effect="dark" style="width: 100%" @selection-change="getProductStuIdList">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column label="规格id" width="120"><template slot-scope="scope">{{ scope.row.id }}</template></el-table-column>
<el-table-column prop="sku" label="规格sku" width="120"></el-table-column>
<el-table-column prop="stock" label="库存" width="120"></el-table-column>
<el-table-column prop="price" label="价格" width="120"></el-table-column>
<el-table-column label="商品图片" width="120">
<template slot-scope="scope">
<image-preview :src="scope.row.image" :width="50" :height="50"/>
</template>
</el-table-column>
<el-table-column label="购买数量" width="120">
<template slot-scope="scope">
<el-input v-model="scope.row.teamStock" autocomplete="off"></el-input>
</template>
</el-table-column>
<el-table-column label="拼团价格" width="120">
<template slot-scope="scope">
<el-input v-model="scope.row.teamPrice" autocomplete="off"></el-input>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
</div>
<div slot="footer" class="dialog-footer">
<el-button style="margin-top: 12px;" v-if="active != 0" @click="nesx"></el-button>
<el-button style="margin-top: 12px;" v-if="active != 2" @click="next"></el-button>
<el-button @click="cancelForm"> </el-button>
<el-button type="primary" @click="addteamSKu"> </el-button>
</div>
</el-dialog>
<el-dialog title="选择商品" :visible.sync="dialogTableVisible">
<el-table ref="multipleTable" :data="productList" tooltip-effect="dark" style="width: 120%" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column label="商品id" width="120">
<template slot-scope="scope">{{ scope.row.id }}</template>
</el-table-column>
<el-table-column prop="name" label="商品名称" width="120"/>
<el-table-column prop="type" label="商品类型" width="120"></el-table-column>
<el-table-column label="商品图片" width="120">
<template slot-scope="scope">
<image-preview :src="scope.row.image" :width="50" :height="50"/>
</template>
</el-table-column>
<el-table-column label="商品描述" width="120">
<template slot-scope="scope">
<span style="margin-left: 10px" v-html="scope.row.introduction"></span>
</template>
</el-table-column>
</el-table>
<el-button type="primary" @click="selectOver"></el-button>
</el-dialog>
</div>
</template>
<script>
import {list,save,updateByTeamId,findById} from "@/api/marketing/marketing";
import {findId, listInfo} from "@/api/product/info";
export default {
data() {
return {
productSkuList: [],
active: 0,
addForm: {
projectSkuInfoList: [],
imageList: []
},
pageList: {
list: [],
total: 0,
},
productList: [],
form: {
pageNum: 1,
pageSize: 2
},
dialogTableVisible: false,
formLabelWidth: '160px',
multipleSelection: [],
checked: [],
dialogFormVisible: false,
productStuIdList: [],
title: ""
}
},
//
created() {
this.getList()
},
methods: {
save,
handleUpdate(row){
this.title = "修改拼团活动"
var id = row.id
findById(id).then(res => {
this.addForm = res.data
console.log(this.addForm)
listInfo(this.addForm.productId).then(res => {
this.productSkuList = res.data
console.log(this.productSkuList)
for (let i = 0; i < this.productSkuList.length; i++) {
for (let j = 0; j < this.addForm.projectSkuInfoAddList.length; j++) {
if (this.productSkuList[i].sku === this.addForm.projectSkuInfoAddList[j].sku){
console.log(this.productSkuList[i].id)
this.checked.push(this.productSkuList[i])
}
}
}
})
})
this.dialogFormVisible = true
},
cancelForm() {
this.dialogFormVisible = false
this.addForm = {}
this.productSkuList = []
this.active = 0
},
nesx(){
this.active--
},
next(){
this.active++
},
addTeam() {
this.title = "添加拼团活动"
this.dialogFormVisible = true
},
addProduct(){
this.dialogTableVisible = true
this.getProductList()
},
handleSizeChange(val) {
console.log(`每页 ${val}`);
this.form.pageSize = val
this.getList()
},
selectOver() {
this.dialogTableVisible = false
var productId = this.multipleSelection[0].id
console.log(productId)
findId(productId).then(res => {
this.productSkuList = res.data
})
this.addForm.productImage = this.multipleSelection[0].image
console.log(this.multipleSelection[0].image)
console.log(this.addForm.productImage)
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.form.pageNum = val
this.getList()
},
/** 查询商品拼团信息列表 */
getList() {
list(this.form).then(response => {
this.pageList.list = response.data.rows;
this.pageList.total = response.data.total;
});
},
handleQuery(){
this.getList()
},
getProductList(){
listInfo().then(res => {
this.productList = res.data.rows
})
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
getProductStuIdList(val) {
this.productStuIdList = val;
},
addteamSKu(){
console.log(this.addForm.imageList)
this.dialogTableVisible = false
for (let i = 0; i < this.productStuIdList.length; i++) {
this.productStuIdList[i].productSku = this.productStuIdList[i].sku
}
if (this.addForm.id!=null){
console.log(this.addForm.productId)
this.addForm.teamProjectSkuInfoAddReqList = this.productStuIdList
updateById(this.addForm).then(res => {
this.$message.success(res.data)
})
}else {
var productId = this.multipleSelection[0].id
this.addForm.productId = productId
this.addForm.teamProjectSkuInfoAddReqList = this.productStuIdList
save(this.addForm).then(res => {
this.$message.success(res.data)
})
}
this.dialogFormVisible = false
}
}
}
</script>

View File

@ -83,7 +83,16 @@
</el-table-column>
<el-table-column label="状态" align="center" prop="states">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.states"/>
<!-- <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.states"/>-->
<el-switch
v-model="scope.row.states"
active-text="开启"
inactive-text="关闭"
active-value="Y"
inactive-value="N"
@click="upd(scope.row)"
>
</el-switch>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
@ -152,7 +161,14 @@
</template>
<script>
import { listAttributeGroup, getAttributeGroup, delAttributeGroup, addAttributeGroup, updateAttributeGroup } from "@/api/product/attributeGroup";
import {
listAttributeGroup,
getAttributeGroup,
delAttributeGroup,
addAttributeGroup,
updateAttributeGroup,
update
} from "@/api/product/attributeGroup";
export default {
name: "AttributeGroup",
@ -228,6 +244,14 @@ export default {
this.checkedAttributeList = []
this.resetForm("form");
},
upd(row){
update(row).then(
res=>{
this.$message.success("修改成功")
})
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;