|
@@ -1,9 +1,15 @@
|
|
|
|
+<!-- eslint-disable space-before-function-paren -->
|
|
|
|
+<!-- eslint-disable space-before-function-paren -->
|
|
<template>
|
|
<template>
|
|
<div ref="scrollDiv" class="app-container">
|
|
<div ref="scrollDiv" class="app-container">
|
|
<div v-if="editType === 'add'" class="filter-container">
|
|
<div v-if="editType === 'add'" class="filter-container">
|
|
<div class="filter-control">
|
|
<div class="filter-control">
|
|
- <span style="color: red;">在本页面,对每三个月给超级会员自动发放的优惠券进行配置,配置完成后下一阶段才生效(最少配置1个,最多5个)。</span>
|
|
|
|
- <el-button type="primary" icon="el-icon-plus" size="mini" :disabled="disabled" @click="handleAddList">新增优惠券</el-button>
|
|
|
|
|
|
+ <span style="color: red">
|
|
|
|
+ 在本页面,对每三个月给超级会员自动发放的优惠券进行配置,配置完成后下一阶段才生效(最少配置1个,最多5个)。
|
|
|
|
+ </span>
|
|
|
|
+ <el-button type="primary" icon="el-icon-plus" size="mini" :disabled="disabled" @click="handleAddList">
|
|
|
|
+ 新增优惠券
|
|
|
|
+ </el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-else class="filter-container">
|
|
<div v-else class="filter-container">
|
|
@@ -15,7 +21,7 @@
|
|
clearable
|
|
clearable
|
|
suffix-icon="el-icon-date"
|
|
suffix-icon="el-icon-date"
|
|
:disabled="true"
|
|
:disabled="true"
|
|
- style="width:100px;"
|
|
|
|
|
|
+ style="width: 100px"
|
|
/>
|
|
/>
|
|
-
|
|
-
|
|
<el-input
|
|
<el-input
|
|
@@ -24,14 +30,23 @@
|
|
clearable
|
|
clearable
|
|
suffix-icon="el-icon-date"
|
|
suffix-icon="el-icon-date"
|
|
:disabled="true"
|
|
:disabled="true"
|
|
- style="width:100px;"
|
|
|
|
|
|
+ style="width: 100px"
|
|
/>
|
|
/>
|
|
- <el-button type="primary" icon="el-icon-plus" size="mini" :disabled="disabled" style="margin-left: 30px;" @click="handleAddList">新增优惠券</el-button>
|
|
|
|
|
|
+ <el-button
|
|
|
|
+ type="primary"
|
|
|
|
+ icon="el-icon-plus"
|
|
|
|
+ size="mini"
|
|
|
|
+ :disabled="disabled"
|
|
|
|
+ style="margin-left: 30px"
|
|
|
|
+ @click="handleAddList"
|
|
|
|
+ >
|
|
|
|
+ 新增优惠券
|
|
|
|
+ </el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<el-form ref="couponFrom" :model="form" label-width="100px">
|
|
<el-form ref="couponFrom" :model="form" label-width="100px">
|
|
- <div v-for="(formItem,index) in form.formList" :key="formItem.key" class="form-cell" :data-key="formItem.key">
|
|
|
|
- <el-form-item :label="`优惠券${index+1}:`" style="margin-bottom: 10px;" :rules="rules.couponType">
|
|
|
|
|
|
+ <div v-for="(formItem, index) in form.formList" :key="formItem.key" class="form-cell" :data-key="formItem.key">
|
|
|
|
+ <el-form-item :label="`优惠券${index + 1}:`" style="margin-bottom: 10px" :rules="rules.couponType">
|
|
<el-radio-group v-model="formItem.couponType">
|
|
<el-radio-group v-model="formItem.couponType">
|
|
<el-radio :label="0">活动券</el-radio>
|
|
<el-radio :label="0">活动券</el-radio>
|
|
<el-radio :label="1">品类券</el-radio>
|
|
<el-radio :label="1">品类券</el-radio>
|
|
@@ -41,7 +56,15 @@
|
|
<template v-if="formItem.couponType === 3">
|
|
<template v-if="formItem.couponType === 3">
|
|
<el-form-item label="供应商" :prop="`formList.${index}.shopData`" :rules="rules.shopData">
|
|
<el-form-item label="供应商" :prop="`formList.${index}.shopData`" :rules="rules.shopData">
|
|
<template v-if="formItem.shopData && formItem.shopData.length === 0">
|
|
<template v-if="formItem.shopData && formItem.shopData.length === 0">
|
|
- <el-button type="primary" autofocussize="mini" size="mini" icon="el-icon-plus" @click="handleShopDialogVisible(index)">选择供应商</el-button>
|
|
|
|
|
|
+ <el-button
|
|
|
|
+ type="primary"
|
|
|
|
+ autofocussize="mini"
|
|
|
|
+ size="mini"
|
|
|
|
+ icon="el-icon-plus"
|
|
|
|
+ @click="handleShopDialogVisible(index)"
|
|
|
|
+ >
|
|
|
|
+ 选择供应商
|
|
|
|
+ </el-button>
|
|
<el-checkbox-group v-show="false" v-model="formItem.shopData" />
|
|
<el-checkbox-group v-show="false" v-model="formItem.shopData" />
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<template v-else>
|
|
@@ -55,7 +78,7 @@
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center">
|
|
<el-table-column label="操作" align="center">
|
|
- <el-button type="text" @click="deleteShop(formItem,index)">删除</el-button>
|
|
|
|
|
|
+ <el-button type="text" @click="deleteShop(formItem, index)">删除</el-button>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
</template>
|
|
</template>
|
|
@@ -66,31 +89,45 @@
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="优惠条件:" :prop="`formList.${index}.touchPrice`" :rules="rules.touchPrice">
|
|
<el-form-item label="优惠条件:" :prop="`formList.${index}.touchPrice`" :rules="rules.touchPrice">
|
|
<el-input v-model="formItem.touchPrice" style="width: 220px" size="mini">
|
|
<el-input v-model="formItem.touchPrice" style="width: 220px" size="mini">
|
|
- <template slot="prepend" style="padding: 0 10px;">订单商品总额满:</template>
|
|
|
|
|
|
+ <template slot="prepend" style="padding: 0 10px">订单商品总额满:</template>
|
|
</el-input>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="优惠商品:" :hidden="formItem.couponType === 0 ? false : true" style="margin-bottom: 10px;" :rules="rules.productType">
|
|
|
|
|
|
+ <el-form-item
|
|
|
|
+ label="优惠商品:"
|
|
|
|
+ :hidden="formItem.couponType === 0 ? false : true"
|
|
|
|
+ style="margin-bottom: 10px"
|
|
|
|
+ :rules="rules.productType"
|
|
|
|
+ >
|
|
<el-radio-group v-model="formItem.productType">
|
|
<el-radio-group v-model="formItem.productType">
|
|
<el-radio :label="'1'">全商城商品</el-radio>
|
|
<el-radio :label="'1'">全商城商品</el-radio>
|
|
<el-radio :label="'2'">指定商品</el-radio>
|
|
<el-radio :label="'2'">指定商品</el-radio>
|
|
</el-radio-group>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <template v-if="formItem.productType === '2'&& formItem.couponType === 0">
|
|
|
|
|
|
+ <template v-if="formItem.productType === '2' && formItem.couponType === 0">
|
|
<el-form-item label="商品信息" :prop="`formList.${index}.associateList`" :rules="rules.associateList">
|
|
<el-form-item label="商品信息" :prop="`formList.${index}.associateList`" :rules="rules.associateList">
|
|
- <el-button type="primary" icon="el-icon-sort" size="mini" :disabled="disabled3(formItem.associateList)" @click="handleOnInputBlur(formItem,index)">一键排序</el-button>
|
|
|
|
- <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleGoodDialogVisible(index)">添加商品</el-button>
|
|
|
|
|
|
+ <el-button
|
|
|
|
+ type="primary"
|
|
|
|
+ icon="el-icon-sort"
|
|
|
|
+ size="mini"
|
|
|
|
+ :disabled="disabled3(formItem.associateList)"
|
|
|
|
+ @click="handleOnInputBlur(formItem, index)"
|
|
|
|
+ >
|
|
|
|
+ 一键排序
|
|
|
|
+ </el-button>
|
|
|
|
+ <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleGoodDialogVisible(index)">
|
|
|
|
+ 添加商品
|
|
|
|
+ </el-button>
|
|
<el-checkbox-group v-show="false" v-model="formItem.associateList" />
|
|
<el-checkbox-group v-show="false" v-model="formItem.associateList" />
|
|
- <el-table v-show="formItem.associateList && formItem.associateList.length>0" :data="formItem.associateList" border>
|
|
|
|
|
|
+ <el-table
|
|
|
|
+ v-show="formItem.associateList && formItem.associateList.length > 0"
|
|
|
|
+ :data="formItem.associateList"
|
|
|
|
+ border
|
|
|
|
+ >
|
|
<el-table-column property="mainImage" label="商品图片" align="center" width="80">
|
|
<el-table-column property="mainImage" label="商品图片" align="center" width="80">
|
|
<template slot-scope="{ row }">
|
|
<template slot-scope="{ row }">
|
|
- <el-popover
|
|
|
|
- placement="top-start"
|
|
|
|
- title=""
|
|
|
|
- width="180"
|
|
|
|
- trigger="hover"
|
|
|
|
- >
|
|
|
|
- <img :src="row.mainImage" alt="" style="width:150px;height:150px;">
|
|
|
|
- <img slot="reference" :src="row.mainImage" alt="" style="width:30px;height:30px;">
|
|
|
|
|
|
+ <el-popover placement="top-start" title="" width="180" trigger="hover">
|
|
|
|
+ <img :src="row.mainImage" alt="" style="width: 150px; height: 150px" />
|
|
|
|
+ <img slot="reference" :src="row.mainImage" alt="" style="width: 30px; height: 30px" />
|
|
</el-popover>
|
|
</el-popover>
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
@@ -119,25 +156,34 @@
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="排序" align="center" width="100">
|
|
<el-table-column label="排序" align="center" width="100">
|
|
- <template slot-scope="{row}">
|
|
|
|
|
|
+ <template slot-scope="{ row }">
|
|
<el-input v-model="row.sort" maxlength="4" minlength="1" />
|
|
<el-input v-model="row.sort" maxlength="4" minlength="1" />
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center">
|
|
<el-table-column label="操作" align="center">
|
|
<template slot-scope="scope">
|
|
<template slot-scope="scope">
|
|
- <el-button type="text" @click="handleDeletePros(formItem,scope.$index)">删除</el-button>
|
|
|
|
|
|
+ <el-button type="text" @click="handleDeletePros(formItem, scope.$index)">删除</el-button>
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</template>
|
|
</template>
|
|
- <el-form-item label="优惠品类:" :hidden="formItem.couponType ===1 ? false : true" :rules="rules.categoryType">
|
|
|
|
|
|
+ <el-form-item label="优惠品类:" :hidden="formItem.couponType === 1 ? false : true" :rules="rules.categoryType">
|
|
<el-radio-group v-model="formItem.categoryType">
|
|
<el-radio-group v-model="formItem.categoryType">
|
|
<el-radio :label="'1'">产品</el-radio>
|
|
<el-radio :label="'1'">产品</el-radio>
|
|
<el-radio :label="'2'">仪器</el-radio>
|
|
<el-radio :label="'2'">仪器</el-radio>
|
|
</el-radio-group>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-button class="delete_label" :disabled="disabled1" icon="el-icon-delete" size="mini" type="danger" @click="handleDelete(formItem,index)">删除</el-button>
|
|
|
|
|
|
+ <el-button
|
|
|
|
+ class="delete_label"
|
|
|
|
+ :disabled="disabled1"
|
|
|
|
+ icon="el-icon-delete"
|
|
|
|
+ size="mini"
|
|
|
|
+ type="danger"
|
|
|
|
+ @click="handleDelete(formItem, index)"
|
|
|
|
+ >
|
|
|
|
+ 删除
|
|
|
|
+ </el-button>
|
|
</div>
|
|
</div>
|
|
</el-form>
|
|
</el-form>
|
|
<div class="el-dialog__footer">
|
|
<div class="el-dialog__footer">
|
|
@@ -163,7 +209,7 @@ const defaultForm = () => {
|
|
touchPrice: '',
|
|
touchPrice: '',
|
|
productType: '1',
|
|
productType: '1',
|
|
categoryType: '1',
|
|
categoryType: '1',
|
|
- associateList: []// 指定商品信息
|
|
|
|
|
|
+ associateList: [] // 指定商品信息
|
|
}
|
|
}
|
|
}
|
|
}
|
|
export default {
|
|
export default {
|
|
@@ -171,10 +217,6 @@ export default {
|
|
components: { goodDialog, shopDialog },
|
|
components: { goodDialog, shopDialog },
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- defaultShop: {
|
|
|
|
- shopId: 0,
|
|
|
|
- shopData: []
|
|
|
|
- },
|
|
|
|
form: {
|
|
form: {
|
|
formList: []
|
|
formList: []
|
|
},
|
|
},
|
|
@@ -244,13 +286,12 @@ export default {
|
|
if (data.coupons.length > 0) {
|
|
if (data.coupons.length > 0) {
|
|
this.delFlag = true
|
|
this.delFlag = true
|
|
this.form.formList = data.coupons.map((el) => {
|
|
this.form.formList = data.coupons.map((el) => {
|
|
- el = { ...el, ...this.defaultShop }
|
|
|
|
|
|
+ el.shopData = []
|
|
if (el.shop) {
|
|
if (el.shop) {
|
|
el.shopData.push(el.shop)
|
|
el.shopData.push(el.shop)
|
|
}
|
|
}
|
|
return el
|
|
return el
|
|
})
|
|
})
|
|
- console.log('formList', this.form.formList)
|
|
|
|
} else {
|
|
} else {
|
|
for (let i = 0; i <= 2; i++) {
|
|
for (let i = 0; i <= 2; i++) {
|
|
this.form.formList.push(defaultForm())
|
|
this.form.formList.push(defaultForm())
|
|
@@ -305,7 +346,7 @@ export default {
|
|
})
|
|
})
|
|
},
|
|
},
|
|
onSubmit(formName) {
|
|
onSubmit(formName) {
|
|
- this.$refs[formName].validate(valid => {
|
|
|
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
if (valid) {
|
|
if (valid) {
|
|
this.handleFormParams()
|
|
this.handleFormParams()
|
|
this.$confirm('是否提交数据', '提示', {
|
|
this.$confirm('是否提交数据', '提示', {
|
|
@@ -431,7 +472,7 @@ export default {
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style>
|
|
<style>
|
|
-.form-cell{
|
|
|
|
|
|
+.form-cell {
|
|
border: 1px solid #e1e1e1;
|
|
border: 1px solid #e1e1e1;
|
|
border-radius: 8px;
|
|
border-radius: 8px;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
@@ -440,7 +481,7 @@ export default {
|
|
position: relative;
|
|
position: relative;
|
|
margin-bottom: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
}
|
|
-.delete_label{
|
|
|
|
|
|
+.delete_label {
|
|
position: absolute;
|
|
position: absolute;
|
|
right: 2%;
|
|
right: 2%;
|
|
top: 20px;
|
|
top: 20px;
|