|
|
@@ -4,8 +4,8 @@
|
|
|
<el-row>
|
|
|
<el-col :span="23">
|
|
|
<el-form ref="addItem" :model="addData" :rules="rules" label-width="160px">
|
|
|
- <el-form-item label="代金券名称:" prop="title">
|
|
|
- <el-input v-model="addData.title" placeholder="请输入代金券名称" :maxlength="32" show-word-limit />
|
|
|
+ <el-form-item label="券名称:" prop="title">
|
|
|
+ <el-input v-model="addData.title" placeholder="请输入券名称" :maxlength="32" show-word-limit />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="使用场景:" prop="type">
|
|
|
<el-radio-group v-model="addData.type">
|
|
|
@@ -14,27 +14,29 @@
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="面值:" prop="discount">
|
|
|
- <el-input v-model.number="addData.discount" type="number" placeholder="请输入代金券面值">
|
|
|
+ <el-input v-model.number="addData.discount" type="number" :min="0" placeholder="请输入券面值">
|
|
|
<template slot="append">元</template>
|
|
|
</el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="数量:" prop="quantity">
|
|
|
- <el-input v-model.number="addData.quantity" type="number" placeholder="请输入代金券数量">
|
|
|
+ <!-- <el-form-item label="数量:" prop="quantity">
|
|
|
+ <el-input v-model.number="addData.quantity" type="number" :min="0" placeholder="请输入券数量">
|
|
|
<template slot="append">元</template>
|
|
|
</el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="图片:" prop="picUrl">
|
|
|
+ </el-form-item> -->
|
|
|
+ <!-- <el-form-item label="图片:" prop="picUrl">
|
|
|
<Upload :value="addData.picUrl ? [{ fileName: addData.picUrl }] : []" @input="addData.picUrl = $event[0] ? $event[0].fileName : ''" :limit="1" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="门店默认承担比例:" prop="channelSharedRate">
|
|
|
- <el-input v-model.number="addData.channelSharedRate" type="number" placeholder="请输入面值">
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item v-if="addData.type === 1" label="门店默认承担比例:" prop="channelSharedRate">
|
|
|
+ <el-input v-model.number="addData.channelSharedRate" type="number" placeholder="请输入门店默认承担比例">
|
|
|
<template slot="append">%</template>
|
|
|
</el-input>
|
|
|
+ <div class="tip">若门店承担100%，则核销后公司不需要打款给门店，依此类推。</div>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="最低消费金额:" prop="minOrderAmt">
|
|
|
<el-input v-model.number="addData.minOrderAmt" type="number" placeholder="请输入可使用的最低消费金额">
|
|
|
<template slot="append">元</template>
|
|
|
</el-input>
|
|
|
+ <div class="tip">最低消费金额小于等于面值则为无门槛券</div>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="有效期:" prop="dueDays">
|
|
|
<el-input v-model.number="addData.dueDays" placeholder="请输入有效期">
|
|
|
@@ -45,14 +47,43 @@
|
|
|
<el-form-item label="使用说明:" prop="description">
|
|
|
<el-input type="textarea" rows="4" v-model="addData.description" placeholder="请输入使用说明 对用户可见"/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="使用范围:" prop="boxIds">
|
|
|
- <el-radio-group v-model="addData.boxIds">
|
|
|
- <el-radio :label="1">进票门店</el-radio>
|
|
|
- <el-radio :label="2">所有盲票</el-radio>
|
|
|
- <el-radio :label="3">制定盲票</el-radio>
|
|
|
+ <el-form-item v-if="addData.type === 1" label="使用范围:" prop="useArea">进票门店</el-form-item>
|
|
|
+ <el-form-item v-else label="使用范围:" prop="useArea">
|
|
|
+ <el-radio-group v-model="useArea" @change="$event === 'all' ? this.addData.boxIdList = [] : ''">
|
|
|
+ <el-radio label="all">所有盲票</el-radio>
|
|
|
+ <el-radio label="spec">指定盲票</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
+ <div v-if="useArea === 'spec'" style="padding: 0 20px">
|
|
|
+ <el-table :data="addData.boxIdList" height="300px">
|
|
|
+ <el-table-column label="盲票图片" prop="picUrl" align="center" width="80">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <a target="_black" v-if="row.picUrl && row.picUrl.split(',').length > 0" :href="`${IMG_URL + row.picUrl}`"><img :src="`${IMG_URL + row.picUrl.split(',')[0]}`" style="max-height: 37px;max-width: 54px"></a>
|
|
|
+ <span v-else>-</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="盲票名称" prop="title" />
|
|
|
+ <el-table-column label="盲票面值" prop="facePrice" />
|
|
|
+ <el-table-column label="盲票类型" prop="type">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ {{ JSON.parse(row.type).desc }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="盲票状态" prop="status">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag :type="JSON.parse(row.status).value === 'on' ? 'success' : 'info'">{{ JSON.parse(row.status).desc }}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="date" label="操作">
|
|
|
+ <template slot-scope="{ $index }">
|
|
|
+ <el-button type="text" class="del" @click="addData.boxIdList.splice($index, 1)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <br>
|
|
|
+ <el-button type="primary" size="small" plain @click="$refs.select.show()">选择盲票</el-button> <span style="margin-left: 10px">已选盲票（{{ addData.boxIdList.length }}）</span>
|
|
|
+ </div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
@@ -61,39 +92,51 @@
|
|
|
<el-button :loading="addIng" type="primary" @click="update()">保存</el-button>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
+
|
|
|
+ <!-- 弹出层 -->
|
|
|
+ <SelectTicket ref="select" v-model="addData.boxIdList" />
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import Upload from '@/components/ImageUpload'
|
|
|
+import SelectTicket from './components/selectTicket'
|
|
|
+import { publicFileGetUrl } from "@/api/common"
|
|
|
import { getCouponDetail, addCoupon } from '@/api/business/coupon'
|
|
|
export default {
|
|
|
name: 'CouponAdd',
|
|
|
components: {
|
|
|
- Upload
|
|
|
+ Upload,
|
|
|
+ SelectTicket
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ IMG_URL: publicFileGetUrl,
|
|
|
id: this.$route.query.id,
|
|
|
+ readonly: this.$route.name === 'View',
|
|
|
addData: {},
|
|
|
addIng: false,
|
|
|
rules: {
|
|
|
- title: [{ required: true, message: '请输入代金券名称', trigger: 'blur' }],
|
|
|
- type: [{ required: true, message: '请输入代金券类型', trigger: 'blur' }],
|
|
|
- quantity: [{ required: true, message: '请输入代金券类型', trigger: 'blur' }],
|
|
|
- picUrl: [{ required: true, message: '请输入代金券类型', trigger: 'blur' }],
|
|
|
- discount: [{ required: true, message: '请输入代金券面值', trigger: 'blur' }],
|
|
|
+ title: [{ required: true, message: '请输入券名称', trigger: 'blur' }],
|
|
|
+ type: [{ required: true, message: '请输入券类型', trigger: 'blur' }],
|
|
|
+ quantity: [{ required: true, message: '请输入券类型', trigger: 'blur' }],
|
|
|
+ picUrl: [{ required: true, message: '请输入券类型', trigger: 'blur' }],
|
|
|
+ discount: [{ required: true, message: '请输入券面值', trigger: 'blur' }],
|
|
|
channelSharedRate: [{ required: true, message: '请输入门店默认承担比例', trigger: 'blur' }],
|
|
|
minOrderAmt: [{ required: true, message: '请输入最低消费金额', trigger: 'blur' }],
|
|
|
dueDays: [{ required: true, message: '请输入有效期', trigger: 'blur' }],
|
|
|
- description: [{ required: true, message: '请输入使用说明', trigger: 'blur' }],
|
|
|
- boxIds: [{ required: true, message: '请选择使用范围', trigger: 'blur' }]
|
|
|
- }
|
|
|
+ description: [{ required: true, message: '请输入使用说明', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ useArea: 'all'
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
if (this.id) {
|
|
|
getCouponDetail(this.id).then(res => {
|
|
|
this.addData = res.data
|
|
|
+ this.addData.type = JSON.parse(res.data.type).value
|
|
|
+ if (res.data.boxIdList instanceof Array && res.data.boxIdList.length > 0) {
|
|
|
+ this.useArea = 'spec'
|
|
|
+ }
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
@@ -102,6 +145,7 @@ export default {
|
|
|
this.$refs.addItem.validate((valid, items) => {
|
|
|
if (valid) {
|
|
|
this.addIng = true
|
|
|
+ this.addData.boxIds = this.addData.boxIdList.map(item => { return item.boxId }).toString()
|
|
|
addCoupon(this.addData).then(res => {
|
|
|
this.addIng = false
|
|
|
if (res.code === 0) {
|
|
|
@@ -127,3 +171,10 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.tip {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #888;
|
|
|
+}
|
|
|
+</style>
|
Sun