|
@@ -125,18 +125,25 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="奖品名称" prop="title" />
|
|
|
- <el-table-column label="奖品类型" prop="storeName">
|
|
|
- <template slot-scope="scope"> </template>
|
|
|
+ <el-table-column label="奖品类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div v-if="scope.row.prizeType == 'goods'">商品</div>
|
|
|
+ <div v-if="scope.row.prizeType == 'coupon'">代金券</div>
|
|
|
+ <div v-if="scope.row.prizeType == 'coin'">盲豆</div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="奖品数量" prop="storeName">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-input-number
|
|
|
- v-model="num"
|
|
|
- controls-position="right"
|
|
|
- @change="handleChange"
|
|
|
- :min="1"
|
|
|
- size="small"
|
|
|
- ></el-input-number>
|
|
|
+ <div>
|
|
|
+ <el-input-number
|
|
|
+ v-model="scope.row.quantity"
|
|
|
+ controls-position="right"
|
|
|
+ @change="handleChange($event, index)"
|
|
|
+ :min="1"
|
|
|
+ :max="100"
|
|
|
+ size="small"
|
|
|
+ ></el-input-number>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="操作" align="center">
|
|
@@ -184,19 +191,19 @@
|
|
|
<div class="dialog-search">
|
|
|
<div>商品名称:</div>
|
|
|
<el-input
|
|
|
- v-model="name"
|
|
|
+ v-model="goodsTitle"
|
|
|
placeholder="请输入盲票组名称"
|
|
|
clearable
|
|
|
size="small"
|
|
|
style="width: 240px"
|
|
|
- @keyup.enter.native="handleQuery"
|
|
|
+ @keyup.enter.native="handleQueryGoods"
|
|
|
/>
|
|
|
<div class="ge"></div>
|
|
|
<el-button
|
|
|
type="primary"
|
|
|
icon="el-icon-search"
|
|
|
size="mini"
|
|
|
- @click="handleQuery"
|
|
|
+ @click="handleQueryGoods"
|
|
|
>查询</el-button
|
|
|
>
|
|
|
</div>
|
|
@@ -215,19 +222,21 @@
|
|
|
<el-table-column label="商品ID" prop="goodsId" />
|
|
|
<el-table-column label="商品图片">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-image
|
|
|
- style="width: 100px; height: 100px"
|
|
|
- :src="scope.row.picUrl"
|
|
|
- :preview-src-list="[scope.row.picUrl]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
+ <div>
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="scope.row.picUrl"
|
|
|
+ :preview-src-list="[scope.row.picUrl]"
|
|
|
+ >
|
|
|
+ </el-image>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="商品名称" prop="title" min-width="85" />
|
|
|
|
|
|
<el-table-column label="商品价格" min-width="85">
|
|
|
<template slot-scope="scope">
|
|
|
- ¥{{ $numberFormat(scope.row.exchangePrice) }}
|
|
|
+ <div>¥{{ $numberFormat(scope.row.exchangePrice) }}</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="商品库存" prop="quantity" width="80" />
|
|
@@ -247,17 +256,130 @@
|
|
|
</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+ <!-- 添加卡券 -->
|
|
|
+ <el-dialog
|
|
|
+ title="添加代金券奖品"
|
|
|
+ width="1000px"
|
|
|
+ :visible.sync="couponTableVisible"
|
|
|
+ :before-close="close"
|
|
|
+ >
|
|
|
+ <div class="dialog-search">
|
|
|
+ <div>代金券名称:</div>
|
|
|
+ <el-input
|
|
|
+ v-model="couponTitle"
|
|
|
+ placeholder="请输入代金券名称"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ style="width: 240px"
|
|
|
+ @keyup.enter.native="handleQueryCoupon"
|
|
|
+ />
|
|
|
+ <div class="ge"></div>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ size="mini"
|
|
|
+ @click="handleQueryCoupon"
|
|
|
+ >查询</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ v-loading="loading"
|
|
|
+ :data="couponList"
|
|
|
+ @selection-change="handleSelectionCoupon"
|
|
|
+ class="el-table"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="55"
|
|
|
+ align="center"
|
|
|
+ fixed="left"
|
|
|
+ />
|
|
|
+ <el-table-column label="代金券ID" prop="couponId" />
|
|
|
+ <el-table-column label="代金券图片">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="scope.row.picUrl"
|
|
|
+ :preview-src-list="[scope.row.picUrl]"
|
|
|
+ >
|
|
|
+ </el-image>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="代金券名称" prop="title" min-width="85" />
|
|
|
+ <el-table-column label="代金券类型" min-width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.type.desc }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="代金券价格" min-width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>¥{{ $numberFormat(scope.row.discount) }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="有效期限" min-width="85">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.useArea.desc }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination
|
|
|
+ v-show="couponTotal > 0"
|
|
|
+ :total="couponTotal"
|
|
|
+ :page.sync="pageParams.pageNum"
|
|
|
+ :limit.sync="pageParams.pageSize"
|
|
|
+ @pagination="getCouponList"
|
|
|
+ />
|
|
|
+ <div class="dialog-btn">
|
|
|
+ <el-button size="small" @click="close"> 取 消 </el-button>
|
|
|
+ <div class="ge"></div>
|
|
|
+ <el-button type="primary" size="small" @click="confirmCoupon">
|
|
|
+ 确 认
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 添加盲豆 -->
|
|
|
+ <el-dialog
|
|
|
+ title="添加盲豆奖品"
|
|
|
+ :visible.sync="coinTableVisible"
|
|
|
+ :before-close="close"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ :model="coinForm"
|
|
|
+ :rules="coinRules"
|
|
|
+ ref="coinForm"
|
|
|
+ label-width="100px"
|
|
|
+ >
|
|
|
+ <el-form-item label="盲豆数量" prop="quantity">
|
|
|
+ <el-input
|
|
|
+ v-model="coinForm.quantity"
|
|
|
+ size="small"
|
|
|
+ placeholder="请输入盲豆数量"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div class="dialog-btn">
|
|
|
+ <el-button size="small" @click="close"> 取 消 </el-button>
|
|
|
+ <div class="ge"></div>
|
|
|
+ <el-button type="primary" size="small" @click="confirmCoin">
|
|
|
+ 确 认
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { getGoodsList } from "@/api/business/goods";
|
|
|
+import { getCouponList } from "@/api/business/coupon";
|
|
|
+import { ticketBoxCreate } from "@/api/business/ticket";
|
|
|
import { publicFileGetUrl } from "@/api/common";
|
|
|
+import { accMul } from "@/utils/util";
|
|
|
export default {
|
|
|
name: "TicketCreate",
|
|
|
data() {
|
|
|
return {
|
|
|
loading: false,
|
|
|
- picture: [],
|
|
|
form: {
|
|
|
type: "online", //盲票类型
|
|
|
title: "", // 盲票名称
|
|
@@ -337,9 +459,6 @@ export default {
|
|
|
},
|
|
|
],
|
|
|
},
|
|
|
- input: 0,
|
|
|
- num: 1,
|
|
|
- list: [],
|
|
|
// 奖级列表
|
|
|
awardsList: [
|
|
|
{
|
|
@@ -376,12 +495,30 @@ export default {
|
|
|
|
|
|
prizeIndex: null, // 奖级下标
|
|
|
|
|
|
+ goodsTitle: "", // 商品名称
|
|
|
goodsTableVisible: false, // 添加商品弹框
|
|
|
goodsList: [], // 商品列表
|
|
|
- goodsTotal: 10, // 商品总数
|
|
|
- selectGoodsList: [],
|
|
|
+ goodsTotal: 0, // 商品总数
|
|
|
+ selectGoodsList: [], // 选中商品
|
|
|
|
|
|
- name: "",
|
|
|
+ couponTitle: "", // 代金券名称
|
|
|
+ couponTableVisible: false, // 添加卡券弹框
|
|
|
+ couponList: [], // 卡券列表
|
|
|
+ couponTotal: 0, // 卡券总数
|
|
|
+ selectCouponList: [], // 选中卡券
|
|
|
+
|
|
|
+ coinTableVisible: false, // 添加盲豆弹框
|
|
|
+ coinForm: { quantity: "" },
|
|
|
+ coinRules: {
|
|
|
+ quantity: [
|
|
|
+ { required: true, message: "请输入数量", trigger: "blur" },
|
|
|
+ {
|
|
|
+ pattern: /^([1-9]\d*)$/,
|
|
|
+ message: "请输入合法的数字",
|
|
|
+ trigger: ["blur", "change"],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
|
|
|
pageParams: {
|
|
|
pageNum: 1,
|
|
@@ -391,9 +528,11 @@ export default {
|
|
|
},
|
|
|
created() {
|
|
|
this.getGoodsList();
|
|
|
+ this.getCouponList();
|
|
|
},
|
|
|
methods: {
|
|
|
- getGoodsList() {
|
|
|
+ // 商品列表
|
|
|
+ getGoodsList(title) {
|
|
|
this.loading = true;
|
|
|
getGoodsList(
|
|
|
"pageNum=" +
|
|
@@ -401,9 +540,8 @@ export default {
|
|
|
"&pageSize=" +
|
|
|
this.pageParams.pageSize +
|
|
|
"&",
|
|
|
- {}
|
|
|
+ { title: title }
|
|
|
).then((res) => {
|
|
|
- console.log(res);
|
|
|
this.goodsList = res.rows.map((item) => {
|
|
|
return {
|
|
|
...item,
|
|
@@ -412,74 +550,149 @@ export default {
|
|
|
});
|
|
|
this.goodsTotal = res.total;
|
|
|
this.loading = false;
|
|
|
- console.log("this.goodsList", this.goodsList);
|
|
|
});
|
|
|
},
|
|
|
- confirm() {},
|
|
|
- submitForm() {
|
|
|
- this.awardsList.forEach(item => {
|
|
|
- item.prizeList = item.prizeList.map(ele=>{
|
|
|
+
|
|
|
+ // 卡券列表
|
|
|
+ getCouponList(title) {
|
|
|
+ this.loading = true;
|
|
|
+ getCouponList(
|
|
|
+ "pageNum=" +
|
|
|
+ this.pageParams.pageNum +
|
|
|
+ "&pageSize=" +
|
|
|
+ this.pageParams.pageSize +
|
|
|
+ "&",
|
|
|
+ { title: title }
|
|
|
+ ).then((res) => {
|
|
|
+ this.couponList = res.rows.map((item) => {
|
|
|
return {
|
|
|
- ...ele,
|
|
|
- refId: ele.goodsId,
|
|
|
- prizeType: ele.prizeType,
|
|
|
- }
|
|
|
- })
|
|
|
+ ...item,
|
|
|
+ type: JSON.parse(item.type),
|
|
|
+ useArea: JSON.parse(item.useArea),
|
|
|
+ picUrl: publicFileGetUrl + item.picUrl,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ this.couponTotal = res.total;
|
|
|
+ this.loading = false;
|
|
|
});
|
|
|
-
|
|
|
- console.log('this.awardsList', this.awardsList)
|
|
|
- // this.$refs["form"].validate((valid) => {
|
|
|
- // if (valid) {
|
|
|
- // console.log(this.form);
|
|
|
- // } else {
|
|
|
- // console.log("error submit!!");
|
|
|
- // return false;
|
|
|
- // }
|
|
|
- // });
|
|
|
},
|
|
|
- resetForm(formName) {
|
|
|
- this.$refs[formName].resetFields();
|
|
|
+
|
|
|
+ // 保存
|
|
|
+ submitForm() {
|
|
|
+ this.$refs["form"].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ let prizeIndex = this.awardsList.findIndex(item=>{
|
|
|
+ return !item.prizeList.length
|
|
|
+ })
|
|
|
+ // 判断没有设置奖品的奖级
|
|
|
+ if(prizeIndex != -1){
|
|
|
+ this.$message.error(`请设置${ this.awardsList[prizeIndex].name }的奖品!`);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.awardsList.forEach((item) => {
|
|
|
+ item.prizeList = item.prizeList.map((ele) => {
|
|
|
+ return {
|
|
|
+ // ...ele,
|
|
|
+ refId: ele.goodsId || ele.couponId,
|
|
|
+ prizeType: ele.prizeType,
|
|
|
+ quantity: ele.quantity,
|
|
|
+ value: Number(ele.coinValue),
|
|
|
+ };
|
|
|
+ });
|
|
|
+ });
|
|
|
+ let data = {
|
|
|
+ ...this.form,
|
|
|
+ picUrl: this.form.picUrl[0].fileName,
|
|
|
+ facePrice: accMul(this.form.facePrice, 100),
|
|
|
+ salePrice: accMul(this.form.salePrice, 100),
|
|
|
+ pkgSalePrice: accMul(this.form.pkgSalePrice, 100),
|
|
|
+ awardsList: this.awardsList,
|
|
|
+ };
|
|
|
+ const loading = this.$loading({
|
|
|
+ lock: true,
|
|
|
+ text: "保存中",
|
|
|
+ spinner: "el-icon-loading",
|
|
|
+ background: "rgba(0, 0, 0, 0.4)",
|
|
|
+ });
|
|
|
+ ticketBoxCreate(data).then((res) => {
|
|
|
+ if(res.code == 0){
|
|
|
+ this.msgSuccess('保存成功')
|
|
|
+ this.$store.dispatch('tagsView/delView', this.$route)
|
|
|
+ this.$router.go(-1)
|
|
|
+ loading.close();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
|
|
|
+ // 添加图片
|
|
|
pictureSelect(data) {
|
|
|
this.form.picUrl = data;
|
|
|
},
|
|
|
|
|
|
- handleChange() {},
|
|
|
+ // 改变奖品数量
|
|
|
+ handleChange(e, index) {
|
|
|
+ this.prizeIndex = index;
|
|
|
+ this.$forceUpdate();
|
|
|
+ this.getQuantity();
|
|
|
+ },
|
|
|
|
|
|
// 奖级商品删除
|
|
|
handleDel(e, item) {
|
|
|
- console.log(e);
|
|
|
- console.log("item", item);
|
|
|
- let list = item.prizeList
|
|
|
- list.splice(0, 1)
|
|
|
- console.log('list', list)
|
|
|
- this.$set(item, 'prizeList', list)
|
|
|
+ let list = item.prizeList;
|
|
|
+ list.splice(0, 1);
|
|
|
+ this.$set(item, "prizeList", list);
|
|
|
},
|
|
|
|
|
|
// 关闭弹框
|
|
|
close() {
|
|
|
this.goodsTableVisible = false;
|
|
|
+ this.couponTableVisible = false;
|
|
|
+ this.coinTableVisible = false;
|
|
|
+ this.coinForm.quantity = "";
|
|
|
},
|
|
|
|
|
|
// 添加奖品种类
|
|
|
handleCommand(e, index) {
|
|
|
- console.log("e", e);
|
|
|
- console.log("index", index);
|
|
|
this.prizeIndex = index;
|
|
|
- // this.$set(item, "prizeList", this.goodsList);
|
|
|
- this.goodsTableVisible = true;
|
|
|
+ if (e == "goods") {
|
|
|
+ this.goodsTableVisible = true;
|
|
|
+ } else if (e == "coupon") {
|
|
|
+ this.couponTableVisible = true;
|
|
|
+ } else if (e == "coin") {
|
|
|
+ this.coinTableVisible = true;
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
- handleQuery() {},
|
|
|
+ // 查询商品
|
|
|
+ handleQueryGoods() {
|
|
|
+ this.getGoodsList(this.goodsTitle);
|
|
|
+ },
|
|
|
+
|
|
|
+ // 查询代金券
|
|
|
+ handleQueryCoupon() {
|
|
|
+ this.getCouponList(this.couponTitle);
|
|
|
+ },
|
|
|
|
|
|
// 选中商品
|
|
|
handleSelectionGoods(e) {
|
|
|
- console.log("选中商品", e);
|
|
|
this.selectGoodsList = e;
|
|
|
- this.selectGoodsList.forEach(item=>{
|
|
|
- item.prizeType = 'goods'
|
|
|
- })
|
|
|
+ this.selectGoodsList.forEach((item) => {
|
|
|
+ item.prizeType = "goods";
|
|
|
+ item.quantity = 1;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 选中卡券
|
|
|
+ handleSelectionCoupon(e) {
|
|
|
+ this.selectCouponList = e;
|
|
|
+ this.selectCouponList.forEach((item) => {
|
|
|
+ item.prizeType = "coupon";
|
|
|
+ item.quantity = 1;
|
|
|
+ });
|
|
|
},
|
|
|
|
|
|
// 确认选中商品
|
|
@@ -487,13 +700,50 @@ export default {
|
|
|
this.awardsList[this.prizeIndex].prizeList = this.awardsList[
|
|
|
this.prizeIndex
|
|
|
].prizeList.concat(this.selectGoodsList);
|
|
|
+ this.getQuantity();
|
|
|
this.getGoodsList();
|
|
|
this.close();
|
|
|
},
|
|
|
+
|
|
|
+ // 确认选中卡券
|
|
|
+ confirmCoupon() {
|
|
|
+ this.awardsList[this.prizeIndex].prizeList = this.awardsList[
|
|
|
+ this.prizeIndex
|
|
|
+ ].prizeList.concat(this.selectCouponList);
|
|
|
+ this.getQuantity();
|
|
|
+ this.getCouponList();
|
|
|
+ this.close();
|
|
|
+ },
|
|
|
+
|
|
|
+ // 确认输入盲豆
|
|
|
+ confirmCoin() {
|
|
|
+ let coin = {
|
|
|
+ prizeType: "coin",
|
|
|
+ quantity: 1,
|
|
|
+ title: `盲豆 x${this.coinForm.quantity}`,
|
|
|
+ picUrl: publicFileGetUrl + "md.jpeg",
|
|
|
+ coinValue: this.coinForm.quantity,
|
|
|
+ };
|
|
|
+ this.$refs["coinForm"].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.awardsList[this.prizeIndex].prizeList.push(coin);
|
|
|
+ this.getQuantity();
|
|
|
+ this.close();
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 计算奖级数量
|
|
|
+ getQuantity() {
|
|
|
+ let num = 0;
|
|
|
+ this.awardsList[this.prizeIndex].prizeList.forEach((item) => {
|
|
|
+ num += item.quantity;
|
|
|
+ });
|
|
|
+ this.awardsList[this.prizeIndex].quantity = num;
|
|
|
+ },
|
|
|
},
|
|
|
- components: {},
|
|
|
- mounted() {},
|
|
|
- destroyed() {},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|