|
|
@@ -0,0 +1,334 @@
|
|
|
+<template>
|
|
|
+ <div class="ele-body">
|
|
|
+ <el-card shadow="never">
|
|
|
+ <!-- 搜索表单 -->
|
|
|
+ <el-form :model="table.where" label-width="77px" class="ele-form-search"
|
|
|
+ @keyup.enter.native="$refs.table.reload()" @submit.native.prevent>
|
|
|
+ <el-row :gutter="15">
|
|
|
+ <el-col :md="6" :sm="12">
|
|
|
+ <el-form-item label="名字:">
|
|
|
+ <el-input v-model="table.where.keyword" placeholder="请输入会员名字" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :md="6" :sm="12">
|
|
|
+ <el-form-item label="手机号:">
|
|
|
+ <el-input v-model="table.where.mobile" placeholder="请输入会员手机号" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :md="6" :sm="12">
|
|
|
+ <el-form-item label="推广员:">
|
|
|
+ <el-input v-model="table.where.market_name" placeholder="请输入推广员账号" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :md="6" :sm="12">
|
|
|
+ <el-form-item label="来源渠道:" prop="source">
|
|
|
+ <el-select v-model="editForm.source" placeholder="请选择来源渠道" class="ele-block">
|
|
|
+ <el-option v-for="(v,k) in sources" :label="k==0?'全部': v" :value="k" :key="k"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :md="9" :sm="12">
|
|
|
+ <div class="ele-form-actions">
|
|
|
+ <el-button type="primary" @click="$refs.table.reload()" icon="el-icon-search" class="ele-btn-icon">查询
|
|
|
+ </el-button>
|
|
|
+ <el-button @click="(table.where={})&&$refs.table.reload()">重置</el-button>
|
|
|
+ <el-button @click="showEdit=true" type="primary" icon="el-icon-plus" class="ele-btn-icon" v-if="permission.includes('sys:member:add')">添加</el-button>
|
|
|
+ <el-button @click="remove()" type="danger" icon="el-icon-delete" class="ele-btn-icon" v-if="permission.includes('sys:member:dall')">批量删除</el-button>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <!-- 数据表格 -->
|
|
|
+ <ele-data-table ref="table" :config="table" :choose.sync="choose" height="calc(100vh - 265px)" highlight-current-row>
|
|
|
+ <template slot-scope="{index}">
|
|
|
+ <el-table-column type="selection" width="45" align="center" fixed="left"/>
|
|
|
+ <el-table-column type="index" :index="index" label="编号" width="60" align="center" fixed="left" show-overflow-tooltip/>
|
|
|
+ <el-table-column prop="realname" label="名字" sortable="custom" show-overflow-tooltip min-width="120"/>
|
|
|
+ <el-table-column prop="mobile" label="手机号码" sortable="custom" show-overflow-tooltip min-width="130"/>
|
|
|
+ <el-table-column label="性别" min-width="60" align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag :type="['primary','success','warning'][row.gender-1]" size="mini">{{ ['男', '女', '保密'][row.gender-1] }}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="market_name" label="推广员" sortable="custom" show-overflow-tooltip min-width="130"/>
|
|
|
+ <el-table-column label="来源渠道" min-width="120" align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-tag type="success" size="mini">{{sources[row.source]}}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="录入时间" sortable="custom" show-overflow-tooltip align="center" min-width="160">
|
|
|
+ <template slot-scope="{row}">{{ row.create_time_text }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" sortable="custom" :resizable="false" min-width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-switch v-model="row.status" @change="editStatus(row)" :active-value="1" :inactive-value="2"/>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="130px" align="center" :resizable="false" fixed="right">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-link @click="edit(row)" icon="el-icon-edit" type="primary" :underline="false" v-if="permission.includes('sys:member:edit')">修改</el-link>
|
|
|
+ <el-popconfirm title="确定要删除此会员资源吗?" @confirm="remove(row)" class="ele-action">
|
|
|
+ <el-link slot="reference" icon="el-icon-delete" type="danger" :underline="false" v-if="permission.includes('sys:member:delete')">删除</el-link>
|
|
|
+ </el-popconfirm>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </template>
|
|
|
+ </ele-data-table>
|
|
|
+ </el-card>
|
|
|
+ <!-- 编辑弹窗 -->
|
|
|
+ <el-dialog :title="editForm.id?'修改会员资源':'添加会员资源'" :visible.sync="showEdit" width="700px"
|
|
|
+ @closed="editForm={status: 1}" :destroy-on-close="true" custom-class="ele-dialog-form" :lock-scroll="false">
|
|
|
+ <el-form :model="editForm" ref="editForm" :rules="editRules" label-width="100px">
|
|
|
+ <el-row :gutter="15">
|
|
|
+ <el-col :sm="16">
|
|
|
+ <el-form-item label="来源渠道:" prop="source">
|
|
|
+ <el-select v-model="editForm.source" placeholder="请选择来源渠道" class="ele-block">
|
|
|
+ <el-option v-if="k>0" v-for="(v,k) in sources" :label="v" :value="k" :key="k"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="会员姓名:" prop="realname">
|
|
|
+ <el-input v-model="editForm.realname" placeholder="请输入会员姓名" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="手机号码:" prop="mobile">
|
|
|
+ <el-input v-model="editForm.mobile" placeholder="请输入手机号码" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="出生日期:" prop="birthday">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="editForm.birthday"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择出生日期"
|
|
|
+ size="small"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ format="yyyy-MM-dd">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="月薪:" prop="salary">
|
|
|
+ <el-input v-model="editForm.salary" placeholder="请输入月薪">
|
|
|
+ <template slot="append">元</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="性别:" prop="gender">
|
|
|
+ <el-select v-model="editForm.gender" placeholder="请选择性别" class="ele-block" clearable>
|
|
|
+ <el-option label="男" :value="1"/>
|
|
|
+ <el-option label="女" :value="2"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="身高/CM:" prop="height">
|
|
|
+ <el-input-number v-model="editForm.height" placeholder="请输入身高" :min="140" :step="1" :max="210">
|
|
|
+ </el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="体重/KG:" prop="weight">
|
|
|
+ <el-input-number v-model="editForm.weight" placeholder="请输入体重" :precision="2" :min="30" :step="0.1" :max="150">
|
|
|
+ </el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学历:" prop="education">
|
|
|
+ <el-select v-model="editForm.education" placeholder="请选择学历" class="ele-block" clearable>
|
|
|
+ <el-option label="请选择" :value="0"/>
|
|
|
+ <el-option label="大专" :value="1"/>
|
|
|
+ <el-option label="本科" :value="2"/>
|
|
|
+ <el-option label="硕士" :value="3"/>
|
|
|
+ <el-option label="博士" :value="4"/>
|
|
|
+ <el-option label="其他" :value="5"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="婚姻状况:" prop="married">
|
|
|
+ <el-select v-model="editForm.married" placeholder="请选择婚姻状况" class="ele-block" clearable>
|
|
|
+ <el-option label="请选择" :value="0"/>
|
|
|
+ <el-option label="未婚" :value="1"/>
|
|
|
+ <el-option label="离异" :value="2"/>
|
|
|
+ <el-option label="离异有孩子" :value="3"/>
|
|
|
+ <el-option label="其他" :value="4"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="从事行业:" prop="industry">
|
|
|
+ <el-input v-model="editForm.industry" placeholder="请输入从事行业">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工作地:" prop="address">
|
|
|
+ <el-input v-model="editForm.address" placeholder="请输入工作地">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="户籍地:" prop="home_address">
|
|
|
+ <el-input v-model="editForm.home_address" placeholder="请输入户籍地">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注:" prop="remark">
|
|
|
+ <el-input v-model="editForm.remark" placeholder="请输入备注信息" type="textarea" rows="5">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="状态:" prop="status">
|
|
|
+ <el-select v-model="editForm.status" placeholder="请选择状态" class="ele-block" clearable>
|
|
|
+ <el-option label="正常" :value="1"/>
|
|
|
+ <el-option label="禁用" :value="2"/>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="showEdit=false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="save">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import cityData from '@/utils/cityData'
|
|
|
+// import uploadImage from '@/components/uploadImage'
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+export default {
|
|
|
+ name: "SysMember",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ /* citySelect */
|
|
|
+ cityData: cityData, // 省市区数据
|
|
|
+ city: [], // 选中的省市区
|
|
|
+ provinceCity: [], // 选中的省市
|
|
|
+ province: [], // 选中的省
|
|
|
+
|
|
|
+ table: {url: '/member/index', where: {},page: {limit: 30}}, // 表格配置
|
|
|
+ choose: [], // 表格选中数据
|
|
|
+ showEdit: false, // 是否显示表单弹窗
|
|
|
+ editForm: {status: 1}, // 表单数据
|
|
|
+ sources: ['无','新媒体','活动资源','地推资源','合作资源','广告资源','其他资源'],
|
|
|
+ editRules: { // 表单验证规则
|
|
|
+ realname: [
|
|
|
+ {required: true, message: '请输入会员名称', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ mobile: [
|
|
|
+ {required: true, message: '请输入会员手机号', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ birthday: [
|
|
|
+ {required: true, message: '请选择会员出生年月日', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ gender: [
|
|
|
+ {required: true, message: '请选择会员性别', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ height: [
|
|
|
+ {required: true, message: '请输入会员身高', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ weight: [
|
|
|
+ {required: true, message: '请输入会员体重', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ salary: [
|
|
|
+ {required: true, message: '请输入会员月薪', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ education: [
|
|
|
+ {required: true, message: '请选择会员学历', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ married: [
|
|
|
+ {required: true, message: '请选择会员婚姻状况', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ industry: [
|
|
|
+ {required: true, message: '请输入会员从事行业', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ address: [
|
|
|
+ {required: true, message: '请输入会员工作地', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ memberLevelList: [], // 会员等级
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["permission"]),
|
|
|
+ },
|
|
|
+ components: {},
|
|
|
+ mounted() {
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /* 显示编辑 */
|
|
|
+ edit(row) {
|
|
|
+ this.editForm = Object.assign({}, row);
|
|
|
+ this.editForm.source = parseInt(this.editForm.source)
|
|
|
+ this.showEdit = true;
|
|
|
+ },
|
|
|
+ /* 保存编辑 */
|
|
|
+ save() {
|
|
|
+ this.$refs['editForm'].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ const loading = this.$loading({lock: true});
|
|
|
+ this.$http.post('/member/edit', this.editForm).then(res => {
|
|
|
+ loading.close();
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ this.showEdit = false;
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ this.$refs.table.reload();
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ loading.close();
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /* 删除 */
|
|
|
+ remove(row) {
|
|
|
+ if (!row) { // 批量删除
|
|
|
+ if (this.choose.length === 0) return this.$message.error('请至少选择一条数据');
|
|
|
+ let ids = this.choose.map(d => d.id);
|
|
|
+ this.$confirm('确定要删除选中的会员吗?', '提示', {type: 'warning'}).then(() => {
|
|
|
+ const loading = this.$loading({lock: true});
|
|
|
+ this.$http.post('/member/delete', {id: ids}).then(res => {
|
|
|
+ loading.close();
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ this.$refs.table.reload();
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ loading.close();
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ }).catch(() => 0);
|
|
|
+ } else { // 单个删除
|
|
|
+ const loading = this.$loading({lock: true});
|
|
|
+ this.$http.post('/member/delete', {id:row.id}).then(res => {
|
|
|
+ loading.close();
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ this.$refs.table.reload();
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ loading.close();
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /* 更改状态 */
|
|
|
+ editStatus(row) {
|
|
|
+ const loading = this.$loading({lock: true});
|
|
|
+ let params = Object.assign({}, row);
|
|
|
+ this.$http.post('/member/status', params).then(res => {
|
|
|
+ loading.close();
|
|
|
+ if (res.data.code === 0) {
|
|
|
+ this.$message({type: 'success', message: res.data.msg});
|
|
|
+ } else {
|
|
|
+ row.status = !row.status ? 2 : 1;
|
|
|
+ this.$message.error(res.data.msg);
|
|
|
+ }
|
|
|
+ }).catch(e => {
|
|
|
+ loading.close();
|
|
|
+ this.$message.error(e.message);
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.ele-block >>> .el-upload, .ele-block >>> .el-upload-dragger {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+</style>
|