Skip to content

S
soss
Commit 32208f1e by lixiaomin
Options

优惠券页面

parent e04187db
Showing with 177 additions and 30 deletions
src/views/coupon/coupon/index.vue
......@@ -15,14 +15,14 @@
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery" v-hasPermi="['system:category:query']">搜索</el-button>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery" v-hasPermi="['coupon:coupon:query']">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:category:add']">新增</el-button>
v-hasPermi="['coupon:coupon:add']">新增</el-button>
</el-col>
</el-row>
......@@ -45,28 +45,28 @@
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button v-show="scope.row.state == 2" size="mini" type="text" icon="el-icon-edit" @click="handleStatus(scope.row,'1')"
v-hasPermi="['system:category:restart']">下线</el-button>
v-hasPermi="['coupon:coupon:restart']">下线</el-button>
<el-button v-show="scope.row.state == 1" size="mini" type="text" icon="el-icon-edit" @click="handleStatus(scope.row,'2')"
v-hasPermi="['system:category:stop']">上线</el-button>
v-hasPermi="['coupon:coupon:stop']">上线</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['system:category:remove']">删除</el-button>
v-hasPermi="['coupon:coupon:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<!-- 添加或修改对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body class="dialogClass">
<el-form ref="form" :model="form" :rules="rules" label-width="140px">
<el-row>
<el-col :span="8">
<el-form-item label="优惠券名称" prop="name">
<el-input v-model="form.name" placeholder="请输入优惠券名称" minlength="1" maxlength="100"/>
</el-form-item>
</el-col>
<el-col :span="8">
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="券类别" prop="" >
<el-select v-model="form.name" placeholder="请选择" @change="selectChange()">
<el-select v-model="form.name" placeholder="请选择" @change="selectChange()" style="width: 326px;">
<el-option
v-for="item in options"
:key="item.value"
......@@ -76,40 +76,97 @@
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="11">
<div style="margin-left: 105px;">
<el-form-item label="券价值">
<el-radio-group v-model="form.cost">
<el-radio :label="1">抵扣</el-radio>
<el-radio :label="2">折扣</el-radio>
<el-radio :label="3">免单</el-radio>
<el-radio :label="3" style="margin-left: 13px;">免单</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<div>
<span>立减</span><el-input v-model="form.name"/><span>元</span>
<el-radio-group v-model="form.cost">
<el-radio :label="1">无门槛</el-radio>
<el-radio :label="6">满<el-input/>元</el-radio>
<div style="margin-left: 73px;">
<div class="marginLeft10">
<span>立减</span><el-input class="inputCalss"/><span class="spanClass">元</span>
<el-radio-group v-model="form.cost" class="marginLeft10">
<el-radio :label="1" class="marginLeft10">无门槛</el-radio>
<el-radio :label="6" >满<el-input class="inputCalss"/><span class="spanClass">元</span></el-radio>
</el-radio-group>
</div>
<div style="margin-left: 36px;margin-top: 10px;">
<el-input class="inputCalss"/><span class="spanClass">折</span>
<el-radio-group v-model="form.cost1" class="marginLeft10">
<el-radio :label="1" class="marginLeft10">单杯</el-radio>
<el-radio :label="6" style="margin-left: 14px;">整单</el-radio>
</el-radio-group>
</div>
</div>
</div>
</el-col>
<el-col :span="7">
<el-form-item label="User可领次数" label-width="110px">
<el-radio-group v-model="form.cost" >
<el-radio :label="1">
<span>每</span><el-input class="inputCalss"/><span class="spanClass">天</span>
<el-input class="inputCalss"/><span class="spanClass">次</span>
</el-radio>
<el-radio :label="6" style="margin-top: 10px;">无限制</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 8px;">
<el-col :span="10">
<el-form-item label="优惠券绝对有效时间" >
<el-date-picker
v-model="times"
type="datetimerange"
range-separator="至"
start-placeholder="请选择开始日期"
end-placeholder="请选择结束日期" value-format="yyyy-MM-dd HH:mm" format="yyyy-MM-dd HH:mm" class="width"/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="领取后相对有效时间">
<el-input class="inputCalss"/><span class="spanClass">天</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="User可领次数">
<el-radio-group v-model="form.cost">
<el-radio :label="1">无门槛</el-radio>
<el-radio :label="6">满<el-input/>元</el-radio>
</el-radio-group>
<el-form-item label="优惠券可领取时间" style=" margin-left: 41px;">
<el-date-picker v-model="form.date" type="date" placeholder="请选择领取日期" style="width: 205px;"/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="通用简述" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入内容" maxlength="17"/>
<el-row>
<el-col>
<el-form-item label="适用范围">
<el-cascader :options="rangeList" clearable placeholder="请选择使用商品范围" class="width"/>
<el-cascader :options="rangeList" :props="{ multiple: true }" clearable collapse-tags placeholder="请选择地区门店" class="marginLeft20 width"/>
<el-select v-model="form.week" placeholder="请选择可用日期" multiple collapse-tags style="margin-left:36px; width:330px">
<el-option
v-for="item in weekList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="短信通知" >
<div style="display: flex;">
<div>
<el-radio v-model="form.mess" label="1">是</el-radio>
<el-radio v-model="form.mess" label="2">否</el-radio>
</div>
<div style="margin-left: 20px;">
<el-input placeholder="请输入短信内容" style="width: 907px;"></el-input>
</div>
</div>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" v-hasPermi="['system:category:edit']">确 定</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['coupon:coupon:edit']">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
......@@ -163,12 +220,77 @@ export default {
value: '2',
label: '折扣券'
}],
rangeList:[{
value: '1',
label: '全国通用',
},{
value: '北京',
label: '北京市',
children: [{
value: '北京',
label: '北京市',
children: [{
value: 'haidian',
label: '海淀区',
children:[{
value:'1',
label:'海淀黄庄店'
},{
value:'2',
label:'凯德茂店'
}]
}, {
value: 'chaoyang',
label: '朝阳区',
children:[{
value:'1',
label:'朝阳大悦城店'
}]
}]
},{
value: 'henan',
label: '河南省',
children: [{
value: 'zhengzhou',
label: '郑州市'
}, {
value: 'zhoukou',
label: '周口市'
}]
}]
}],
times:[],
weekList:[{
value: '1',
label: '星期一'
}, {
value: '2',
label: '星期二'
}, {
value: '3',
label: '星期三'
}, {
value: '4',
label: '星期四'
}, {
value: '5',
label: '星期五'
}, {
value: '6',
label: '星期六'
}, {
value: '7',
label: '星期日'
}]
};
},
created() {
this.getList();
},
methods: {
selectChange(val){
},
/** 查询列表 */
getList() {
this.loading = true;
......@@ -210,7 +332,7 @@ export default {
handleAdd() {
this.reset();
this.open = true;
this.title = "新增类别";
this.title = "新增优惠券";
},
/** 启用、禁用按钮操作 */
handleStatus(row,tag) {
......@@ -244,7 +366,7 @@ export default {
getClass(id).then((response) => {
this.form = response.data;
this.open = true;
this.title = "修改商品分类";
this.title = "修改优惠券";
});
},
/** 提交按钮 */
......@@ -293,3 +415,28 @@ export default {
},
};
</script>
<style lang="scss" >
.dialogClass .spanClass{
margin-left: 10px;
}
.dialogClass .inputCalss{
width:50px;
margin-left: 10px;
}
.dialogClass .el-radio__label {
padding-left: 3px !important;
}
.dialogClass .marginLeft10 {
padding-left: 10px;
}
.dialogClass .marginLeft20 {
padding-left: 20px;
}
.dialogClass .width {
width: 326px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment