优惠卷
This commit is contained in:
魏啾
parent
c79049443a
commit
2a27c5394b
|
|
@ -0,0 +1,175 @@
|
|||
<template>
|
||||
<el-dialog title="选择优惠劵" top="5vh" :visible.sync="dialogVisible">
|
||||
<div class="head-container">
|
||||
<el-table ref="table" :data="tableData.list" height="500" v-loading="tableData.loading">
|
||||
<!-- <el-table-column type="selection" width="55" align="center" v-if="!radio"></el-table-column> -->
|
||||
<el-table-column label="名称" prop="title" />
|
||||
<el-table-column label="使用门槛">
|
||||
<template v-slot="scope">
|
||||
{{ `满${scope.row.fullAmount}${scope.row.discountAmount ? '减' + scope.row.discountAmount + '元' :
|
||||
''}` }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="总发放数量" prop="number" />
|
||||
<el-table-column label="已使用" prop="useNumber" />
|
||||
<el-table-column label="剩余" prop="leftNumber" />
|
||||
<el-table-column label="操作">
|
||||
<template v-slot="scope">
|
||||
<el-button type="primary" @click="selectHandle(scope.row)">选择</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
|
||||
@current-change="paginationChange" @size-change="sizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
<span slot="footer" class="dialog-footer" v-if="!radio">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="confirmHandle">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getTbShopCoupon, delTbShopCoupon } from '@/api/coupon'
|
||||
export default {
|
||||
props: {
|
||||
// 是否为单选
|
||||
radio: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
searhForm: {
|
||||
name: '',
|
||||
category: ''
|
||||
},
|
||||
categoryList: [],
|
||||
tableData: {
|
||||
page: 0,
|
||||
size: 10,
|
||||
total: 0,
|
||||
loading: false,
|
||||
list: []
|
||||
},
|
||||
goods: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 单选商品
|
||||
selectHandle(row) {
|
||||
this.$emit('success', [{ ...row }])
|
||||
this.close()
|
||||
},
|
||||
// 确定选商品
|
||||
confirmHandle() {
|
||||
let res = this.$refs.table.selection
|
||||
this.$emit('success', res)
|
||||
this.close()
|
||||
},
|
||||
// 重置查询
|
||||
resetHandle() {
|
||||
this.searhForm.name = ''
|
||||
this.searhForm.category = ''
|
||||
this.tableData.page = 0
|
||||
this.tableData.size = 10
|
||||
this.tableData.list = []
|
||||
this.getTableData()
|
||||
},
|
||||
// 分页大小改变
|
||||
sizeChange(e) {
|
||||
this.tableData.size = e
|
||||
this.getTableData()
|
||||
},
|
||||
// 分页回调
|
||||
paginationChange(e) {
|
||||
this.tableData.page = e - 1
|
||||
this.getTableData()
|
||||
},
|
||||
// 商品列表
|
||||
async getTableData() {
|
||||
this.tableData.loading = true
|
||||
try {
|
||||
const res = await getTbShopCoupon({
|
||||
page: this.tableData.page,
|
||||
size: this.tableData.size,
|
||||
name: this.searhForm.name,
|
||||
categoryId: this.searhForm.category,
|
||||
shopId: localStorage.getItem('shopId'),
|
||||
sort: 'id',
|
||||
})
|
||||
this.tableData.list = res.content
|
||||
this.tableData.total = res.totalElements
|
||||
|
||||
if (this.goods.length) {
|
||||
this.$nextTick(() => {
|
||||
this.selection()
|
||||
})
|
||||
}
|
||||
setTimeout(() => {
|
||||
this.tableData.loading = false
|
||||
}, 500);
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 商品分类
|
||||
async tbShopCategoryGet() {
|
||||
try {
|
||||
const res = await getTbShopCoupon({
|
||||
page: 0,
|
||||
size: 100,
|
||||
sort: 'id',
|
||||
shopId: localStorage.getItem('shopId')
|
||||
})
|
||||
this.categoryList = res.content
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
async show(goods, categoryId) {
|
||||
this.dialogVisible = true
|
||||
if (goods && goods.length) {
|
||||
this.goods = goods
|
||||
} else {
|
||||
this.goods = []
|
||||
}
|
||||
this.resetHandle()
|
||||
|
||||
console.log(categoryId);
|
||||
|
||||
if (categoryId) {
|
||||
this.searhForm.category = categoryId
|
||||
}
|
||||
|
||||
console.log(this.searhForm);
|
||||
},
|
||||
close() {
|
||||
this.dialogVisible = false
|
||||
},
|
||||
selection() {
|
||||
this.goods.forEach(row => {
|
||||
this.tableData.list.forEach((item, index) => {
|
||||
if (row.id == item.id) {
|
||||
this.$refs.table.toggleRowSelection(this.tableData.list[index]);
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.shop_info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -52,18 +52,18 @@
|
|||
</div>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item label="选择优惠劵">
|
||||
<el-form-item label="选择优惠劵" v-if="form.isUseCoupon == 1">
|
||||
<div>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="$refs.shopListRef.show([...productIds])">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="$refs.coupon.show([...productIds])">
|
||||
添加优惠劵
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="shop_list">
|
||||
<div class="item_wrap" style="display: flex;align-items: center;margin-top: 6px;"
|
||||
v-for="(item, index) in productIds" :key="item.id">
|
||||
<div class="name">{{ item.name }}</div>
|
||||
<el-input style="width: 120px;" v-model="item.num" placeholder='请填写数量'
|
||||
@input="checkIfNum(item)"></el-input>
|
||||
<div class="name">{{ item.title }}</div>
|
||||
<!-- <el-input style="width: 120px;" v-model="item.num" placeholder='请填写数量'
|
||||
@input="checkIfNum(item)"></el-input> -->
|
||||
<el-button type="text" @click="productIds.splice(index, 1)"
|
||||
style="margin-left: 20px;">删除</el-button>
|
||||
</div>
|
||||
|
|
@ -75,7 +75,7 @@
|
|||
<el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<shopList ref="shopListRef" @success="slectShop" />
|
||||
<coupon ref="coupon" @success="slectShop" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -83,12 +83,10 @@
|
|||
<script>
|
||||
import handselTypes from '../handselTypes'
|
||||
import { activate, storageupActivate } from '@/api/shop'
|
||||
import { queryReceive } from '@/api/coupon'
|
||||
|
||||
import shopList from '@/components/shopList'
|
||||
import coupon from '@/components/coupon'
|
||||
|
||||
export default {
|
||||
components: { shopList },
|
||||
components: { coupon },
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
|
|
@ -131,15 +129,16 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
slectShop(res) {
|
||||
if (this.productIds.length) {
|
||||
res.map(async item => {
|
||||
if (!await this.checkShop(item.id)) {
|
||||
this.productIds.push({ ...item })
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.productIds = res
|
||||
}
|
||||
console.log(res, 11)
|
||||
// if (this.productIds.length) {
|
||||
// res.map(async item => {
|
||||
// if (!await this.checkShop(item.id)) {
|
||||
// this.productIds.push({ ...item })
|
||||
// }
|
||||
// })
|
||||
// } else {
|
||||
this.productIds = res
|
||||
// }
|
||||
},
|
||||
// 判断是否存在重复商品
|
||||
checkShop(id) {
|
||||
|
|
@ -167,6 +166,16 @@ export default {
|
|||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.isUseCoupon == 1) {
|
||||
if (this.productIds.length == 0) {
|
||||
this.$message({
|
||||
message: '请选择优惠劵',
|
||||
type: 'warning'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
this.form.couponId = this.productIds[0].id
|
||||
}
|
||||
// let arr = []
|
||||
// this.productIds.forEach(ele => {
|
||||
// arr.push({
|
||||
|
|
@ -174,7 +183,6 @@ export default {
|
|||
// num: ele.num
|
||||
// })
|
||||
// })
|
||||
// this.form.products = arr
|
||||
this.$refs.form.validate(async valid => {
|
||||
if (valid) {
|
||||
try {
|
||||
|
|
|
|||
Loading…
Reference in New Issue