| | |
| | | <h4>基本信息</h4> |
| | | <div class="form-item-view"> |
| | | <FormItem label="活动名称" prop="promotionName"> |
| | | <Input |
| | | :disabled="disabled" |
| | | type="text" |
| | | v-model="form.promotionName" |
| | | placeholder="活动名称" |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <Input :disabled="disabled" type="text" v-model="form.promotionName" placeholder="活动名称" clearable |
| | | style="width: 260px" /> |
| | | </FormItem> |
| | | <FormItem label="优惠券名称" prop="couponName"> |
| | | <Input |
| | | :disabled="disabled" |
| | | type="text" |
| | | v-model="form.couponName" |
| | | placeholder="优惠券名称" |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <Input :disabled="disabled" type="text" v-model="form.couponName" placeholder="优惠券名称" clearable |
| | | style="width: 260px" /> |
| | | </FormItem> |
| | | <FormItem label="优惠券类型" prop="couponType"> |
| | | <Select :disabled="disabled" v-model="form.couponType" style="width: 260px"> |
| | |
| | | <Option value="PRICE">减免现金</Option> |
| | | </Select> |
| | | </FormItem> |
| | | <FormItem |
| | | label="折扣" |
| | | prop="couponDiscount" |
| | | v-if="form.couponType == 'DISCOUNT'" |
| | | > |
| | | <Input |
| | | :disabled="disabled" |
| | | type="number" |
| | | v-model="form.couponDiscount" |
| | | placeholder="折扣" |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <FormItem label="折扣" prop="couponDiscount" v-if="form.couponType == 'DISCOUNT'"> |
| | | <Input :disabled="disabled" type="number" v-model="form.couponDiscount" placeholder="折扣" clearable |
| | | style="width: 260px" /> |
| | | <span class="describe">请输入0-10之间数字,可以输入一位小数</span> |
| | | </FormItem> |
| | | <FormItem label="面额" prop="price" v-if="form.couponType == 'PRICE'"> |
| | | <Input |
| | | :disabled="disabled" |
| | | type="text" |
| | | v-model="form.price" |
| | | placeholder="面额" |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <Input :disabled="disabled" type="text" v-model="form.price" placeholder="面额" clearable |
| | | style="width: 260px" /> |
| | | </FormItem> |
| | | <FormItem label="活动类型" prop="getType"> |
| | | <Select :disabled="disabled" v-model="form.getType" style="width: 260px"> |
| | |
| | | </FormItem> |
| | | |
| | | <FormItem label="店铺承担比例" prop="storeCommission"> |
| | | <Input |
| | | :disabled="disabled" |
| | | v-model="form.storeCommission" |
| | | placeholder="店铺承担比例" |
| | | style="width: 260px" |
| | | > |
| | | <span slot="append">%</span> |
| | | <Input :disabled="disabled" v-model="form.storeCommission" placeholder="店铺承担比例" style="width: 260px"> |
| | | <span slot="append">%</span> |
| | | </Input> |
| | | <span class="describe">店铺承担比例,输入0-100之间数值</span> |
| | | </FormItem> |
| | | <FormItem label="发放数量" prop="publishNum" v-if="form.getType === 'FREE'"> |
| | | <Input |
| | | :disabled="disabled" |
| | | v-model="form.publishNum" |
| | | placeholder="发放数量" |
| | | style="width: 260px" |
| | | /> |
| | | <Input :disabled="disabled" v-model="form.publishNum" placeholder="发放数量" style="width: 260px" /> |
| | | <div class="tips">如果发放数量为0时,则代表不限制发放数量</div> |
| | | </FormItem> |
| | | <FormItem |
| | | label="领取数量限制" |
| | | prop="couponLimitNum" |
| | | v-if="form.getType === 'FREE'" |
| | | > |
| | | <Input |
| | | :disabled="disabled" |
| | | v-model="form.couponLimitNum" |
| | | placeholder="领取限制" |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <FormItem label="领取数量限制" prop="couponLimitNum" v-if="form.getType === 'FREE'"> |
| | | <Input :disabled="disabled" v-model="form.couponLimitNum" placeholder="领取限制" clearable |
| | | style="width: 260px" /> |
| | | <div class="tips">如果领取数量为0时,则代表不限制领取数量</div> |
| | | </FormItem> |
| | | <FormItem label="范围描述" prop="description"> |
| | | <Input |
| | | :disabled="disabled" |
| | | v-model="form.description" |
| | | type="textarea" |
| | | :rows="4" |
| | | maxlength="50" |
| | | show-word-limit |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <Input :disabled="disabled" v-model="form.description" type="textarea" :rows="4" maxlength="50" |
| | | show-word-limit clearable style="width: 260px" /> |
| | | </FormItem> |
| | | </div> |
| | | <h4>使用限制</h4> |
| | | <div class="form-item-view"> |
| | | |
| | | <FormItem label="限制单个商品使用" prop="goodsUseLimitNum"> |
| | | <Select :disabled="disabled" v-model="form.goodsUseLimitNum" style="width: 260px"> |
| | | <Option value="0">不限制</Option> |
| | | <Option value="1">限制</Option> |
| | | </Select> |
| | | </FormItem> |
| | | <FormItem label="消费门槛" prop="consumeThreshold"> |
| | | <Input |
| | | :disabled="disabled" |
| | | type="text" |
| | | v-model="form.consumeThreshold" |
| | | placeholder="消费门槛" |
| | | clearable |
| | | style="width: 260px" |
| | | /> |
| | | <Input :disabled="disabled" type="text" v-model="form.consumeThreshold" placeholder="消费门槛" clearable |
| | | style="width: 260px" /> |
| | | </FormItem> |
| | | <FormItem label="有效期" prop="rangeTime"> |
| | | <div v-if="form.getType == 'ACTIVITY'"> |
| | |
| | | </RadioGroup> |
| | | </div> |
| | | <div v-if="rangeTimeType == 1"> |
| | | <DatePicker |
| | | :disabled="disabled" |
| | | type="datetimerange" |
| | | v-model="form.rangeTime" |
| | | format="yyyy-MM-dd HH:mm:ss" |
| | | placeholder="请选择" |
| | | :options="options" |
| | | style="width: 260px" |
| | | > |
| | | <DatePicker :disabled="disabled" type="datetimerange" v-model="form.rangeTime" |
| | | format="yyyy-MM-dd HH:mm:ss" placeholder="请选择" :options="options" style="width: 260px"> |
| | | </DatePicker> |
| | | </div> |
| | | <div class="effectiveDays" v-if="rangeTimeType == 0"> |
| | | 领取当天开始 |
| | | <InputNumber |
| | | :disabled="disabled" |
| | | v-model="form.effectiveDays" |
| | | :min="1" |
| | | style="width: 100px" |
| | | :max="365" |
| | | /> |
| | | <InputNumber :disabled="disabled" v-model="form.effectiveDays" :min="1" style="width: 100px" |
| | | :max="365" /> |
| | | 天内有效(1-365间的整数) |
| | | </div> |
| | | </FormItem> |
| | |
| | | <RadioGroup type="button" button-style="solid" v-model="form.scopeType"> |
| | | <Radio :disabled="disabled" label="ALL">全品类</Radio> |
| | | <Radio :disabled="disabled" label="PORTION_GOODS">指定商品</Radio> |
| | | <Radio :disabled="disabled" label="PORTION_GOODS_CATEGORY" |
| | | >部分商品分类</Radio |
| | | > |
| | | <Radio :disabled="disabled" label="PORTION_GOODS_CATEGORY">部分商品分类</Radio> |
| | | </RadioGroup> |
| | | </FormItem> |
| | | |
| | | <FormItem style="width: 100%" v-if="form.scopeType == 'PORTION_GOODS'"> |
| | | <div style="display: flex; margin-bottom: 10px"> |
| | | <Button :disabled="disabled" type="primary" @click="openSkuList" |
| | | >选择商品</Button |
| | | > |
| | | <Button |
| | | :disabled="disabled" |
| | | type="error" |
| | | ghost |
| | | style="margin-left: 10px" |
| | | @click="delSelectGoods" |
| | | >批量删除</Button |
| | | > |
| | | <Button :disabled="disabled" type="primary" @click="openSkuList">选择商品</Button> |
| | | <Button :disabled="disabled" type="error" ghost style="margin-left: 10px" |
| | | @click="delSelectGoods">批量删除</Button> |
| | | </div> |
| | | <Table |
| | | border |
| | | :columns="columns" |
| | | :data="form.promotionGoodsList" |
| | | @on-selection-change="changeSelect" |
| | | > |
| | | <Table border :columns="columns" :data="form.promotionGoodsList" @on-selection-change="changeSelect"> |
| | | <template slot-scope="{ row }" slot="QRCode"> |
| | | <img |
| | | :src="row.QRCode || '../../../assets/lili.png'" |
| | | width="50px" |
| | | height="50px" |
| | | alt="" |
| | | /> |
| | | <img :src="row.QRCode || '../../../assets/lili.png'" width="50px" height="50px" alt="" /> |
| | | </template> |
| | | </Table> |
| | | </FormItem> |
| | | |
| | | <FormItem v-if="form.scopeType == 'PORTION_GOODS_CATEGORY'"> |
| | | <Cascader |
| | | :disabled="disabled" |
| | | :data="goodsCategoryList" |
| | | style="width: 260px" |
| | | v-model="form.scopeIdGoods" |
| | | ></Cascader> |
| | | <Cascader :disabled="disabled" :data="goodsCategoryList" style="width: 260px" v-model="form.scopeIdGoods"> |
| | | </Cascader> |
| | | </FormItem> |
| | | <div> |
| | | <Button :disabled="disabled" type="text" @click="closeCurrentPage" |
| | | >返回</Button |
| | | > |
| | | <Button |
| | | :disabled="disabled" |
| | | type="primary" |
| | | :loading="submitLoading" |
| | | @click="handleSubmit" |
| | | >提交</Button |
| | | > |
| | | <Button :disabled="disabled" type="text" @click="closeCurrentPage">返回</Button> |
| | | <Button :disabled="disabled" type="primary" :loading="submitLoading" @click="handleSubmit">提交</Button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | handler(val) { |
| | | if (val == "FREE") { |
| | | this.rangeTimeType = 1; |
| | | }else{ |
| | | } else { |
| | | this.rangeTimeType = 0; |
| | | } |
| | | if(this.rangeTimeType == 0){ |
| | | if (this.rangeTimeType == 0) { |
| | | delete this.formRule.rangeTime |
| | | } |
| | | }, |
| | |
| | | promotionGoodsList: [], |
| | | scopeIdGoods: [], |
| | | rangeDayType: "", |
| | | effectiveDays:1, |
| | | effectiveDays: 1, |
| | | goodsUseLimitNum: "0" |
| | | }, |
| | | id: this.$route.query.id, // 优惠券id |
| | | submitLoading: false, // 添加或编辑提交状态 |
| | |
| | | key: "price", |
| | | minWidth: 40, |
| | | render: (h, params) => { |
| | | return h("priceColorScheme", {props:{value:params.row.price,color:this.$mainColor}} ); |
| | | return h("priceColorScheme", { props: { value: params.row.price, color: this.$mainColor } }); |
| | | }, |
| | | }, |
| | | { |
| | |
| | | font-size: 12px; |
| | | color: #999; |
| | | |
| | | > * { |
| | | >* { |
| | | margin: 0 4px; |
| | | } |
| | | } |
| | | |
| | | .tips { |
| | | font-size: 12px; |
| | | color: #999; |