Commit bf744562 authored by guoyou's avatar guoyou

会员等级修改

parent 021c6558
...@@ -20,3 +20,10 @@ export function addMembershipGrade(obj) { ...@@ -20,3 +20,10 @@ export function addMembershipGrade(obj) {
data:obj data:obj
}); });
} }
export function update(params) {
return fetch({
url: 'api/admin/member/update',
method: 'PUT',
data:params
});
}
\ No newline at end of file
<template> <template>
<div class="app-container calendar-list-container"> <div class="app-container calendar-list-container">
<div> <div>
<el-button class="filter-item" style="margin-bottom: 10px;" @click="newMembershipGrade" <el-button
type="primary" icon="edit" v-if="memberManagement_btn_add">添加会员等级 class="filter-item"
</el-button> style="margin-bottom: 10px;"
@click="newMembershipGrade"
type="primary"
icon="edit"
v-if="memberManagement_btn_add"
>添加会员等级</el-button>
</div> </div>
<el-table :key='tableKey' :data="list" v-loading.body="listLoading" border fit highlight-current-row <el-table
style="width: 100%"> :key="tableKey"
<el-table-column width="205" align="center" label="等级序号"> :data="list"
v-loading.body="listLoading"
border
fit
highlight-current-row
style="width: 100%"
>
<el-table-column align="center" label="等级序号">
<template scope="scope"> <template scope="scope">
<span>{{scope.row.level}}</span> <span>{{scope.row.level}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="205" align="center" label="名称"> <el-table-column align="center" label="名称">
<template scope="scope"> <template scope="scope">
<span>{{scope.row.name}}</span> <span>{{scope.row.name}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="205" align="center" label="图标"> <el-table-column align="center" label="图标">
<template scope="scope"> <template scope="scope">
<span> <img class="image" :src="scope.row.icon"/></span> <span>
<img class="image" :src="scope.row.icon" />
</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="205" align="center" label="折扣"> <el-table-column align="center" label="大图标">
<template scope="scope">
<span>
<img class="image" :src="scope.row.bigIcon" />
</span>
</template>
</el-table-column>
<el-table-column align="center" label="折扣">
<template scope="scope"> <template scope="scope">
<span>{{scope.row.discount}}</span> <span>{{scope.row.discount}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="205" align="center" label="免费天数"> <el-table-column align="center" label="免费天数">
<template scope="scope"> <template scope="scope">
<span>{{scope.row.number}}</span> <span>{{scope.row.number}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="205" align="center" label="价格"> <el-table-column align="center" label="价格">
<template scope="scope"> <template scope="scope">
<span>{{scope.row.price}}</span> <span>{{scope.row.price}}</span>
</template> </template>
...@@ -42,39 +63,64 @@ ...@@ -42,39 +63,64 @@
<span>{{scope.row.endDate}}</span> <span>{{scope.row.endDate}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="操作" width="65" fixed="right"> <el-table-column align="center" label="操作" fixed="right">
<template scope="scope"> <template scope="scope">
<el-button size="small" class="el-button el-button--text el-button--small" style="color:red" @click="delMembership(scope.row)" v-if="memberManagement_btn_del">删除 <el-button
</el-button> size="small"
class="el-button el-button--text el-button--small"
style="color:red"
@click="delMembership(scope.row)"
v-if="memberManagement_btn_del"
>删除</el-button>
<el-button
size="small"
class="el-button el-button--text el-button--small"
style="color:red"
@click="compileShip(scope.row)"
>编辑</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div> <div>
<el-dialog title="增加会员等级" :visible.sync="addMembershipGrade" class="mGrade"> <el-dialog :title="vipTitle" :visible.sync="addMembershipGrade" class="mGrade" @close='cllsePop'>
<el-form :model="add" :rules="rules" ref="membershipGrade" label-width="100px"> <el-form :model="add" :rules="rules" ref="membershipGrade" label-width="110px">
<el-row> <el-row>
<el-col :span="16"> <el-col :span="16">
<el-form-item label="会员等级名称" prop="name"> <el-form-item label="会员等级名称" prop="name">
<el-input type="text" v-model="add.name" <el-input type="text" v-model="add.name" placeholder="请填写会员等级名称"></el-input>
placeholder="请填写会员等级名称"></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="16"> <el-col :span="16">
<el-form-item label="等级" prop="level"> <el-form-item label="等级" prop="level">
<el-input type="number" min="0" v-model="add.level" placeholder="请填会员等级" v-enterNumber></el-input> <el-input
type="number"
min="0"
v-model="add.level"
placeholder="请填会员等级"
v-enterNumber
:disabled="forbid"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="有效期" prop="endDate"> <el-form-item label="有效期" prop="endDate">
<el-select class="filter-item" v-model="add.endDate" placeholder="请选择有效期"> <el-select
<el-option v-for="(val, key, index) in endDatelist " :key="val.id" :label="val.name" class="filter-item"
:value="val.id"></el-option> v-model="add.endDate"
placeholder="请选择有效期"
:disabled="forbid"
>
<el-option
v-for="(val, key, index) in endDatelist "
:key="val.id"
:label="val.name"
:value="val.id"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -82,22 +128,40 @@ ...@@ -82,22 +128,40 @@
<el-row> <el-row>
<el-col :span="16"> <el-col :span="16">
<el-form-item label="折扣" prop="discount"> <el-form-item label="折扣" prop="discount">
<el-input type="number" min="0" v-model="add.discount" <el-input
placeholder="请填写折扣"></el-input> type="number"
min="0"
v-model="add.discount"
placeholder="请填写折扣"
:disabled="forbid"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="16"> <el-col :span="16">
<el-form-item label="免费天数" prop="number"> <el-form-item label="免费天数" prop="number">
<el-input type="number" min="0" v-model="add.number" placeholder="请填免费天数" v-enterNumber></el-input> <el-input
type="number"
min="0"
v-model="add.number"
placeholder="请填免费天数"
v-enterNumber
:disabled="forbid"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="16"> <el-col :span="16">
<el-form-item label="价格" prop="price"> <el-form-item label="价格" prop="price">
<el-input type="number" min="0" v-model="add.price" placeholder="请填价格"></el-input> <el-input
type="number"
min="0"
v-model="add.price"
placeholder="请填价格"
:disabled="forbid"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -109,11 +173,41 @@ ...@@ -109,11 +173,41 @@
:action="BASE_API+'/api/universal/file/app/unauth/admin/upload'" :action="BASE_API+'/api/universal/file/app/unauth/admin/upload'"
:show-file-list="false" :show-file-list="false"
:on-success="handleAvatarSuccess" :on-success="handleAvatarSuccess"
list-type="picture"> list-type="picture"
<img v-if="$utils.isString(add.icon) && !$utils.isEmpty(add.icon)" :src="add.icon" >
style="width:300px;max-height:300px;"> <img
<i v-else class="el-icon-plus avatar-uploader-icon" v-if="$utils.isString(add.icon) && !$utils.isEmpty(add.icon)"
style="lineHeight:100px;width:300px;height: 100px;border: 1px dashed #ccc;"></i> :src="add.icon"
style="width:300px;max-height:300px;"
/>
<i
v-else
class="el-icon-plus avatar-uploader-icon"
style="lineHeight:100px;width:300px;height: 100px;border: 1px dashed #ccc;"
></i>
</el-upload>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="大图标" :style="{display:'block'}">
<el-upload
class="upload-demo"
:headers="getHeaderWithToken"
:action="BASE_API+'/api/universal/file/app/unauth/admin/upload'"
:show-file-list="false"
:on-success="handleAvatarSuccessBig"
list-type="picture"
>
<img
v-if="$utils.isString(add.bigIcon) && !$utils.isEmpty(add.bigIcon)"
:src="add.bigIcon"
style="width:300px;max-height:300px;"
/>
<i
v-else
class="el-icon-plus avatar-uploader-icon"
style="lineHeight:100px;width:300px;height: 100px;border: 1px dashed #ccc;"
></i>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
</el-row> </el-row>
...@@ -125,23 +219,30 @@ ...@@ -125,23 +219,30 @@
</el-dialog> </el-dialog>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import {getMembers, delMembershipGrade, addMembershipGrade} from 'src/api/admin/member/index' import {
import {mapGetters} from 'vuex'; getMembers,
import {getToken} from 'src/utils/auth'; delMembershipGrade,
addMembershipGrade,
update
} from "src/api/admin/member/index";
import { mapGetters } from "vuex";
import { getToken } from "src/utils/auth";
export default { export default {
name: 'membershipGrade', name: "membershipGrade",
data() { data() {
return { return {
forbid: false,
vipTitle: "增加会员等级",
BASE_API: process.env.BASE_API, BASE_API: process.env.BASE_API,
list: [], list: [],
listLoading: true, listLoading: true,
tableKey: 0, tableKey: 0,
addMembershipGrade: false, addMembershipGrade: false,
activeId:'',
add: { add: {
level: undefined, level: undefined,
name: undefined, name: undefined,
...@@ -149,182 +250,219 @@ ...@@ -149,182 +250,219 @@
number: undefined, number: undefined,
price: undefined, price: undefined,
endDate: undefined, endDate: undefined,
icon: undefined icon: undefined,
bigIcon: null
}, },
endDatelist: [ endDatelist: [
{id: 0, name: '永久'}, { id: 0, name: "永久" },
{id: 1, name: '半年'}, { id: 1, name: "半年" },
{id: 2, name: '一年'}, { id: 2, name: "一年" },
{id: 3, name: '二年'}, { id: 3, name: "二年" },
{id: 4, name: '三年'}, { id: 4, name: "三年" },
{id: 5, name: '四年'}, { id: 5, name: "四年" },
{id: 6, name: '五年'}, { id: 6, name: "五年" }
], ],
year: { year: {
'-1': '永久', "-1": "永久",
'0': '半年', "0": "半年",
'1': '一年', "1": "一年",
'2': '二年', "2": "二年",
'3': '三年', "3": "三年",
'4': '四年', "4": "四年",
'5': '五年', "5": "五年"
}, },
rules: { rules: {
name: [ name: [
{ {
type: 'string', type: "string",
required: true, required: true,
message: '请输入消息内容', message: "请输入消息内容",
trigger: 'blur' trigger: "blur"
}, },
{ {
min: 0, min: 0,
max: 50, max: 50,
message: '长度小于 50个字符', message: "长度小于 50个字符",
trigger: 'blur' trigger: "blur"
} }
], ],
level: [ level: [
{ {
required: true, required: true,
message: '请输入消息内容', message: "请输入消息内容",
trigger: 'blur' trigger: "blur"
}, },
{ {
min: 0, min: 0,
max: 20, max: 20,
message: '长度小于 20个字符', message: "长度小于 20个字符",
trigger: 'blur' trigger: "blur"
} }
] ]
}, },
memberManagement_btn_add: false,//添加 memberManagement_btn_add: false, //添加
memberManagement_btn_del: false,//删除 memberManagement_btn_del: false //删除
} };
}, },
created() { created() {
this.memberManagement_btn_add=this.elements['memberManagement:btn_add'];//添加 this.memberManagement_btn_add = this.elements["memberManagement:btn_add"]; //添加
this.memberManagement_btn_del=this.elements['memberManagement:btn_del'];//删除 this.memberManagement_btn_del = this.elements["memberManagement:btn_del"]; //删除
this.getList(); this.getList();
} },
,
computed: { computed: {
... ...mapGetters(["elements"]),
mapGetters([
'elements'
]),
/** /**
* 获取token * 获取token
*/ */
getHeaderWithToken() { getHeaderWithToken() {
return {Authorization: getToken()}; return { Authorization: getToken() };
}, }
}, },
methods: { methods: {
cllsePop(){
// console.log('0000');
this.cancelSetMemberArea('membershipGrade')
},
//编辑
compileShip(row) {
console.log(row);
this.vipTitle = "编辑会员等级";
this.forbid = true;
this.addMembershipGrade = true;
this.add = {
level: row.level,
name: row.name,
discount: row.discount,
number: row.number,
price: row.price,
endDate: row.endDate,
icon: row.icon,
bigIcon: row.bigIcon
};
this.activeId = row.id
},
getList() { getList() {
this.listLoading= true this.listLoading = true;
getMembers().then( getMembers().then(res => {
res => {
for (let dataKey of res.data) { for (let dataKey of res.data) {
if (dataKey.endDate == 0) { if (dataKey.endDate == 0) {
dataKey.endDate = '半年' dataKey.endDate = "半年";
} else { } else {
dataKey.endDate = dataKey.endDate ? this.year[dataKey.endDate] : '' dataKey.endDate = dataKey.endDate ? this.year[dataKey.endDate] : "";
} }
} }
this.list = res.data this.list = res.data;
this.listLoading = false; this.listLoading = false;
} });
)
}, },
/** /**
* 删除会员等级 * 删除会员等级
* */ * */
delMembership(row) { delMembership(row) {
delMembershipGrade(row.id).then(res => { delMembershipGrade(row.id).then(res => {
if (res.rel) { if (res.rel) {
this.$notify.success({ this.$notify.success({
title: '成功', title: "成功",
message: `success` message: `success`
}) });
} else { } else {
this.$notify.warning({ this.$notify.warning({
title: '失败', title: "失败",
message: `failed` message: `failed`
}) });
} }
this.getList() this.getList();
});
})
}, },
/** /**
* 关闭清除 * 关闭清除
* */ * */
cancelSetMemberArea(refName) { cancelSetMemberArea(refName) {
this.addMembershipGrade = false this.addMembershipGrade = false;
this.$refs[refName].resetFields() this.$refs[refName].resetFields();
this.add={} this.add = {};
console.log(JSON.stringify(this.add))
}, },
/** /**
* 显示添加窗 * 显示添加窗
* */ * */
newMembershipGrade() { newMembershipGrade() {
this.addMembershipGrade = true this.forbid = false;
this.addMembershipGrade = true;
}, },
/** /**
* 新建会员等级 * 新建会员等级
* **/ * **/
save(refName) { save(refName) {
let membership = JSON.parse(JSON.stringify(this.add)) let membership = JSON.parse(JSON.stringify(this.add));
membership.endDate = membership.endDate - 1 membership.endDate = membership.endDate - 1;
addMembershipGrade(membership).then( membership.id = this.activeId
res => { if (this.vipTitle == "增加会员等级") {
addMembershipGrade(membership).then(res => {
if (!res.rel) { if (!res.rel) {
this.$notify.success({ this.$notify.success({
title: '成功', title: "成功",
message: `success`
});
} else {
this.$notify.warning({
title: "失败",
message: `failed`
});
}
this.getList();
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
this.addMembershipGrade = false;
});
} else {
update(membership).then(data => {
if (data.status == 200) {
this.$notify.success({
title: "成功",
message: `success` message: `success`
}) });
} else { } else {
this.$notify.warning({ this.$notify.warning({
title: '失败', title: "失败",
message: `failed` message: `failed`
}) });
} }
this.getList() this.getList();
if (this.$refs[refName]) { if (this.$refs[refName]) {
this.$refs[refName].resetFields() this.$refs[refName].resetFields();
}
this.addMembershipGrade = false;
});
} }
this.addMembershipGrade = false
})
}, },
/** /**
* 封面图上传 * 封面图上传
* **/ * **/
handleAvatarSuccess(res, file) { handleAvatarSuccess(res, file) {
this.add.icon = res.data; this.add.icon = res.data;
}, },
//大图标
handleAvatarSuccessBig(res) {
this.add.bigIcon = res.data;
} }
} }
};
</script> </script>
<style> <style>
textarea { textarea {
display: none; display: none;
} }
.image { .image {
width: 50px; width: 50px;
height: 50px; height: 50px;
} }
.mGrade .el-dialog--small { .mGrade .el-dialog--small {
width: 500px; width: 500px;
} }
</style> </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