315 lines
12 KiB
Vue
315 lines
12 KiB
Vue
|
<template>
|
|||
|
|
<div v-loading="loading">
|
|||
|
|
<div class="heior_box">
|
|||
|
|
<el-button size="small" type="primary" icon="el-icon-plus" @click="add">添加会员</el-button>
|
|||
|
|
<el-button size="small" type="primary" icon="el-icon-sold-out" @click="dataExport" v-if="$local.isRoot()">导出</el-button>
|
|||
|
|
<div class="search-box">
|
|||
|
|
<el-input v-model="searchModel.keyWord" placeholder="请输入会员号/名称" clearable size="small">
|
|||
|
|
<el-button slot="append" icon="el-icon-search" @click="search"></el-button>
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<el-table :data="retData.Data" size="medium" :height="$getHeight(100)" row-key="Id" border>
|
|||
|
|
<!-- <el-table-column prop="LoginCode" label="会员号" width="120px"></el-table-column> -->
|
|||
|
|
<!-- <el-table-column prop="Name" label="名称"></el-table-column> -->
|
|||
|
|
<el-table-column prop="LoginCode" label="会员号" width="120px">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<phoneHide :text="scope.row.LoginCode"></phoneHide>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="CreateTime" label="注册时间" width="160px"></el-table-column>
|
|||
|
|
<el-table-column prop="CreateType" label="注册方式" :formatter="formatterCreateType"></el-table-column>
|
|||
|
|
<!-- <el-table-column prop="ProductAccountCount" label="账号总数"></el-table-column>
|
|||
|
|
<el-table-column prop="ExpiredProductAccountCount" label="过期数"></el-table-column>
|
|||
|
|
<el-table-column prop="ExpiredProductAccountCount" label="未过期数"></el-table-column>-->
|
|||
|
|
<!-- <el-table-column prop="ConsumeAmount" label="消费总额"></el-table-column> -->
|
|||
|
|
<el-table-column prop="RestAmount" label="余额"></el-table-column>
|
|||
|
|
<el-table-column prop="RestAmount" label="测试限额/领用数">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
{{scope.row.TestCountLimit==0?'3':scope.row.TestCountLimit}}/{{scope.row.UseTestCount==0?'--':scope.row.UseTestCount}}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="ManagerName" label="客户经理"></el-table-column>
|
|||
|
|
<el-table-column label="操作" width="400px">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<span class="handel cursor edit" @click="showUpdateTest(scope.row)">设置测试</span>
|
|||
|
|
<span class="handel cursor edit" @click="showAmount(scope.row,1)" v-if="IsRoot">充值</span>
|
|||
|
|
<span class="handel cursor edit" @click="showAmount(scope.row,2)">扣款</span>
|
|||
|
|
<router-link :to="{name:'account',query:{userId:scope.row.Id}}">
|
|||
|
|
<span class="handel cursor edit">账号</span>
|
|||
|
|
</router-link>
|
|||
|
|
<router-link :to="{name:'userprice',query:{id:scope.row.Id}}">
|
|||
|
|
<span class="handel cursor edit">会员价</span>
|
|||
|
|
</router-link>
|
|||
|
|
<span class="handel cursor edit" @click="edit(scope.row)">编辑</span>
|
|||
|
|
<span class="handel cursor edit" @click="showAmountDetail(scope.row)">明细</span>
|
|||
|
|
<el-popover placement="bottom" trigger="hover" width="180">
|
|||
|
|
<div class="popover_box">
|
|||
|
|
<span>QQ号：{{scope.row.QQ||'--'}}</span>
|
|||
|
|
<span>微信：{{scope.row.Wx||'--'}}</span>
|
|||
|
|
<span>淘宝：{{scope.row.TaoBao||'--'}}</span>
|
|||
|
|
<span>邮箱:{{scope.row.Email||'--'}}</span>
|
|||
|
|
</div>
|
|||
|
|
<span class="handel cursor more" slot="reference">更多</span>
|
|||
|
|
</el-popover>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
<div class="block">
|
|||
|
|
<el-pagination
|
|||
|
|
v-if="retData.Data.length>0"
|
|||
|
|
@current-change="get"
|
|||
|
|
:page-size="50"
|
|||
|
|
:current-page.sync="searchModel.PageIndex"
|
|||
|
|
layout="total,prev, pager, next"
|
|||
|
|
:total="retData.TotalCount"
|
|||
|
|
></el-pagination>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<el-dialog title="会员维护" :visible.sync="showDialog" width="400px">
|
|||
|
|
<el-form :model="userModel" :rules="rules" ref="inputUserForm" label-width="80px">
|
|||
|
|
<el-form-item prop="LoginCode" label="登录名称">
|
|||
|
|
<el-input v-model="userModel.LoginCode" :disabled="optype==2" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="Password" label="密码">
|
|||
|
|
<el-input v-model="userModel.Password" show-password size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="Phone" label="手机号">
|
|||
|
|
<el-input v-model="userModel.Phone" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="QQ" label="QQ号">
|
|||
|
|
<el-input v-model="userModel.QQ" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="Wx" label="微信">
|
|||
|
|
<el-input v-model="userModel.Wx" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="TaoBao" label="淘宝">
|
|||
|
|
<el-input v-model="userModel.TaoBao" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="Email" label="邮箱">
|
|||
|
|
<el-input v-model="userModel.Email" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="Remark" label="备注">
|
|||
|
|
<el-input v-model="userModel.Remark" size="small"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
<span slot="footer" class="dialog-footer">
|
|||
|
|
<el-button @click="resetForm('inputUserForm')">取 消</el-button>
|
|||
|
|
<el-button type="primary" @click="save('inputUserForm')">确定</el-button>
|
|||
|
|
</span>
|
|||
|
|
</el-dialog>
|
|||
|
|
|
|||
|
|
<el-dialog
|
|||
|
|
:title="amountModel.opAmountType==1?'充值':'扣费'"
|
|||
|
|
:visible.sync="amountModel.showAmountDialog"
|
|||
|
|
width="300px"
|
|||
|
|
>
|
|||
|
|
<el-form :model="amountModel" :rules="amountRules" ref="inputAmountForm" label-width="80px">
|
|||
|
|
<el-form-item prop="rest" label="当前余额">
|
|||
|
|
<el-input v-model="amountModel.rest" size="small" disabled></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="amount" :label="amountModel.opAmountType==1?'充值金额':'扣费金额'">
|
|||
|
|
<el-input v-model="amountModel.amount" size="small" type="number"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item prop="attchInfo" label="备注">
|
|||
|
|
<el-input v-model="amountModel.attchInfo" size="small" type="number"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
</el-form>
|
|||
|
|
<span slot="footer" class="dialog-footer">
|
|||
|
|
<el-button @click="resetForm('inputAmountForm')">取 消</el-button>
|
|||
|
|
<el-button type="primary" @click="updateAmount('inputAmountForm')">确定</el-button>
|
|||
|
|
</span>
|
|||
|
|
</el-dialog>
|
|||
|
|
|
|||
|
|
<el-dialog title="测试限额设置" :visible.sync="showTestDialog" width="300px">
|
|||
|
|
<el-form :model="testLimitModel" ref="inputTestForm" label-width="80px">
|
|||
|
|
<el-form-item prop="limit" label="限制次数">
|
|||
|
|
<el-input v-model="testLimitModel.limit" size="small" type="number"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
<span slot="footer" class="dialog-footer">
|
|||
|
|
<el-button @click="resetForm('inputTestForm')">取 消</el-button>
|
|||
|
|
<el-button type="primary" @click="updateTestLimit()">确定</el-button>
|
|||
|
|
</span>
|
|||
|
|
</el-dialog>
|
|||
|
|
|
|||
|
|
<el-dialog title="资金明细" :visible.sync="showDetailDialog" width="500px">
|
|||
|
|
<el-table
|
|||
|
|
:data="detailAmountData"
|
|||
|
|
size="medium"
|
|||
|
|
:height="$getHeight(300)"
|
|||
|
|
row-key="Id"
|
|||
|
|
border
|
|||
|
|
>
|
|||
|
|
<el-table-column prop="ScoreTypeName" label="资金项目"></el-table-column>
|
|||
|
|
<el-table-column prop="ScoreValue" label="金额"></el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</el-dialog>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
name: "userIndex",
|
|||
|
|
components: {
|
|||
|
|
cutTip: () => import("@/components/common/cutTip"),
|
|||
|
|
phoneHide: () => import("@/components/common/phonehide")
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
isRoot:false,
|
|||
|
|
loading: false,
|
|||
|
|
showDialog: false,
|
|||
|
|
showTestDialog: false,
|
|||
|
|
showDetailDialog: false,
|
|||
|
|
optype: 1, //1:添加 2：编辑
|
|||
|
|
userModel: {
|
|||
|
|
LoginCode: "",
|
|||
|
|
Phone: "",
|
|||
|
|
Password: "",
|
|||
|
|
Remark: ""
|
|||
|
|
},
|
|||
|
|
amountModel: {
|
|||
|
|
rest: 0,
|
|||
|
|
amount: 0,
|
|||
|
|
opAmountType: 1, ////1:充值 2：扣款
|
|||
|
|
showAmountDialog: false,
|
|||
|
|
attchInfo:''
|
|||
|
|
},
|
|||
|
|
testLimitModel: {
|
|||
|
|
userId: 0,
|
|||
|
|
limit: 3
|
|||
|
|
},
|
|||
|
|
retData: { TotalCount: 0, Data: [] },
|
|||
|
|
searchModel: {
|
|||
|
|
PageIndex: 1,
|
|||
|
|
keyWord: ""
|
|||
|
|
},
|
|||
|
|
rules: {
|
|||
|
|
LoginCode: [this.$vaild.required("登录名称")],
|
|||
|
|
Phone: [this.$vaild.required("手机号")],
|
|||
|
|
// Password: [this.$vaild.required("密码")]
|
|||
|
|
},
|
|||
|
|
amountRules: {
|
|||
|
|
// amount: [{ type: 'number', message: '金额必须为数字值'}],
|
|||
|
|
},
|
|||
|
|
detailAmountData: [],
|
|||
|
|
formatterCreateType(row, column, cellValue, index) {
|
|||
|
|
switch (cellValue) {
|
|||
|
|
case 1:
|
|||
|
|
return "管理员添加";
|
|||
|
|
case 2:
|
|||
|
|
return "用户注册";
|
|||
|
|
case 3:
|
|||
|
|
return "淘宝注册";
|
|||
|
|
}
|
|||
|
|
return "";
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
created() {
|
|||
|
|
this.$store.commit("setCurrentNav", "用户管理>>会员管理");
|
|||
|
|
var currentUser=this.$local.getUserByCache();
|
|||
|
|
this.IsRoot=currentUser.Manager.IsRootUser;
|
|||
|
|
this.get();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
search(){
|
|||
|
|
this.searchModel.PageIndex=1;
|
|||
|
|
this.get();
|
|||
|
|
},
|
|||
|
|
get() {
|
|||
|
|
this.$api.get("baseinfo/v1/user/page", this.searchModel).then(res => {
|
|||
|
|
this.retData = res;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
del(item) {
|
|||
|
|
var that = this;
|
|||
|
|
this.$confirm("确定删除？", "", {
|
|||
|
|
confirmButtonText: "确定",
|
|||
|
|
cancelButtonText: "取消",
|
|||
|
|
type: "warning"
|
|||
|
|
}).then(_ => {
|
|||
|
|
this.$api.post("baseinfo/v1/user/Delete?id=" + item.Id).then(res => {
|
|||
|
|
that.get();
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
add() {
|
|||
|
|
this.showDialog = true;
|
|||
|
|
this.optype = 1;
|
|||
|
|
},
|
|||
|
|
edit(item) {
|
|||
|
|
this.showDialog = true;
|
|||
|
|
this.optype = 2;
|
|||
|
|
this.userModel = clone(item);
|
|||
|
|
},
|
|||
|
|
resetForm(formName) {
|
|||
|
|
this.$refs[formName].resetFields();
|
|||
|
|
this.showDialog = false;
|
|||
|
|
this.amountModel.showAmountDialog = false;
|
|||
|
|
this.showTestDialog = false;
|
|||
|
|
},
|
|||
|
|
save(formName) {
|
|||
|
|
this.$refs[formName].validate(valid => {
|
|||
|
|
if (!valid) return;
|
|||
|
|
if (this.optype == 1) {
|
|||
|
|
this.$api.post("baseinfo/v1/user/post", this.userModel).then(res => {
|
|||
|
|
this.resetForm("inputUserForm");
|
|||
|
|
this.get();
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
this.$api.post("baseinfo/v1/user/put", this.userModel).then(res => {
|
|||
|
|
this.resetForm("inputUserForm");
|
|||
|
|
this.get();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
showAmount(item, type) {
|
|||
|
|
this.amountModel.rest = item.RestAmount;
|
|||
|
|
this.amountModel.opAmountType = type;
|
|||
|
|
this.amountModel.showAmountDialog = true;
|
|||
|
|
this.amountModel.UserId = item.Id;
|
|||
|
|
},
|
|||
|
|
updateAmount(formName) {
|
|||
|
|
this.$refs[formName].validate(valid => {
|
|||
|
|
if (!valid) return;
|
|||
|
|
this.$api
|
|||
|
|
.post("baseinfo/v1/user/UpdateAmount", this.amountModel)
|
|||
|
|
.then(res => {
|
|||
|
|
this.resetForm("inputAmountForm");
|
|||
|
|
this.get();
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
showUpdateTest(item) {
|
|||
|
|
this.showTestDialog = true;
|
|||
|
|
this.testLimitModel.UserId = item.Id;
|
|||
|
|
this.testLimitModel.limit = item.TestCountLimit;
|
|||
|
|
},
|
|||
|
|
updateTestLimit() {
|
|||
|
|
this.$api
|
|||
|
|
.post("baseinfo/v1/user/UpdateTestCount", this.testLimitModel)
|
|||
|
|
.then(res => {
|
|||
|
|
this.resetForm("inputTestForm");
|
|||
|
|
this.get();
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
showAmountDetail(item) {
|
|||
|
|
this.showDetailDialog = true;
|
|||
|
|
this.$api
|
|||
|
|
.get("baseinfo/v1/user/AmountDetail?userId=" + item.Id)
|
|||
|
|
.then(res => {
|
|||
|
|
this.detailAmountData = res.Data;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
dataExport(){
|
|||
|
|
this.$api.getDownloadFile("/baseinfo/v1/user/Export");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
<style scoped>
|
|||
|
|
</style>
|