hx
/
expo


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547
							<!DOCTYPE html>
<html>
<head>
    <title>用户</title>
    <#include "../../include/head-file.ftl">
</head>
<body>
<div id="index" v-cloak class="ms-index">
    <el-header class="ms-header" height="50px">
        <el-col :span=12>
            <@shiro.hasPermission name="people:user:save">
                <el-button type="primary" class="el-icon-plus" size="default" @click="save()">新增</el-button>
            </@shiro.hasPermission>
            <@shiro.hasPermission name="people:user:del">
                <el-button type="danger" class="el-icon-delete" size="default" @click="del(selectionList)"
                           :disabled="!selectionList.length">删除
                </el-button>
            </@shiro.hasPermission>
        </el-col>
    </el-header>
    <div class="ms-search" style="padding: 20px 10px 20px 10px;">
        <el-row>
            <el-form :model="form" ref="searchForm" :rules="rules" label-width="80px" size="default">
                <el-row>
                    <el-col :span=8>
                        <el-form-item label="账号" prop="peopleName">
                            <el-input v-model="form.peopleName"
                                      :disabled="false"
                                      :style="{width:  '100%'}"
                                      :clearable="true"
                                      placeholder="请输入账号">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8>
                        <el-form-item label="昵称" prop="puNickname">
                            <el-input v-model="form.puNickname"
                                      :disabled="false"
                                      :style="{width:  '100%'}"
                                      :clearable="true"
                                      placeholder="请输入昵称">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8>
                        <el-form-item label="真实姓名" prop="puRealName">
                            <el-input v-model="form.puRealName"
                                      :disabled="false"
                                      :style="{width:  '100%'}"
                                      :clearable="true"
                                      placeholder="请输入真实姓名">
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span=8>
                        <el-form-item label="手机号码" prop="peoplePhone">
                            <el-input v-model="form.peoplePhone"
                                      :disabled="false"
                                      :style="{width:  '100%'}"
                                      :clearable="true"
                                      placeholder="请输入手机号码">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8>
                        <el-form-item label="邮箱" prop="peopleMail">
                            <el-input v-model="form.peopleMail"
                                      :disabled="false"
                                      :style="{width:  '100%'}"
                                      :clearable="true"
                                      placeholder="请输入邮箱">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8>
                        <el-form-item label="注册时间" prop="peopleDateTimes">
                            <el-date-picker
                                    v-model="peopleDateTimes"
                                    value-format="YYYY-MM-DD HH:mm:ss"
                                    format="YYYY-MM-DD"
                                    type="daterange"
                                    :style="{width:  '100%'}"
                                    start-placeholder="开始日期"
                                    end-placeholder="结束日期">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span=8>
                        <!--公司名称-->

                        <el-form-item  label="公司名称" prop="companyName">
                            <el-input
                                    v-model="form.companyName"
                                    :disabled="false"
                                    :readonly="false"
                                    :style="{width:  '100%'}"
                                    :clearable="true"
                                    placeholder="请输入公司名称">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8>
                        <!--职位-->

                        <el-form-item  label="职位" prop="position">
                            <el-input
                                    v-model="form.position"
                                    :disabled="false"
                                    :readonly="false"
                                    :style="{width:  '100%'}"
                                    :clearable="true"
                                    placeholder="请输入职位">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8>
                        <!--了解渠道-->

                        <el-form-item  label="了解渠道" prop="channel">
                            <ms-dict  v-model="form.channel"
                                      :style="{width: '100%'}"
                                      dict-type="注册-了解渠道"
                                      :filterable="false"
                                      :disabled="false"
                                      :multiple="false" :clearable="true"
                                      placeholder="请选择了解渠道">
                            </ms-dict>
                        </el-form-item>

                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span=8>
                        <!--参观目的-->

                        <el-form-item  label="参观目的" prop="purpose">
                            <ms-dict  v-model="form.purpose"
                                      :style="{width: '100%'}"
                                      dict-type="注册-参观目的"
                                      :filterable="false"
                                      :disabled="false"
                                      :multiple="false" :clearable="true"
                                      placeholder="请选择参观目的">
                            </ms-dict>
                        </el-form-item>

                    </el-col>
                    <el-col :span=8>
                        <el-form-item label="用户ID" prop="peopleId">
                            <el-input v-model="form.peopleId"
                                      :disabled="false"
                                      :style="{width:  '100%'}"
                                      :clearable="true"
                                      placeholder="请输入用户ID">
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span=8  style="text-align:right;">
                        <el-button type="primary" class="el-icon-search" size="default" @click="loading=true;currentPage=1;list()">查询
                        </el-button>
                        <el-button @click="rest" class="el-icon-refresh" size="default">重置</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </el-row>
    </div>
    <el-main class="ms-container">
        <el-table v-loading="loading" ref="multipleTable" height="calc(100vh-68px)" class="ms-table-pagination" border :data="treeList"
                  tooltip-effect="dark" @selection-change="handleSelectionChange">
            <template #empty>
                {{emptyText}}
            </template>
            <el-table-column type="selection" width="40"></el-table-column>
            <el-table-column label="ID" align="center" prop="id">
            </el-table-column>
            <el-table-column width="80" label="头像" align="center">
                <template #default="scope">
                    <el-image v-if="scope.row.puIcon !=null" :src="scope.row.puIcon" style="width: 50px;height: 50px;line-height: 50px;font-size: 50px">
                        <template #error>
                            <div class="image-slot">
                                <i class="el-icon-picture-outline"></i>
                            </div>
                        </template>
                    </el-image>
                </template>
            </el-table-column>
            <el-table-column label="账号" align="left" prop="peopleName">
            </el-table-column>
            <el-table-column label="真实姓名" align="left" prop="puRealName">
            </el-table-column>
            <el-table-column label="昵称" align="left" prop="puNickname">
            </el-table-column>
            <el-table-column label="手机号码" width="130" align="center" prop="peoplePhone">
            </el-table-column>
            <el-table-column label="邮箱"  width="200" align="center" prop="peopleMail">
            </el-table-column>
            <el-table-column label="注册时间" width="180" align="center" prop="peopleDateTime">
            </el-table-column>
            <el-table-column label="用户状态" width="100" align="center" prop="peopleState">
                <template #default="scope">
                    {{scope.row.peopleState==0?'未审':'已审'}}
                </template>
            </el-table-column>
            <el-table-column label="邀请数"   align="left" prop="invNum">
            </el-table-column>
            <el-table-column label="用户等级"   align="left" prop="puLevelName">
            </el-table-column>
            <el-table-column label="公司名称"   align="left" prop="companyName">
            </el-table-column>
            <el-table-column label="职位"   align="left" prop="position">
            </el-table-column>
            <el-table-column label="了解渠道"   align="left" prop="channel" :formatter="channelFormat">
            </el-table-column>
            <el-table-column label="参观目的"   align="left" prop="purpose" :formatter="purposeFormat">
            </el-table-column>
            <@shiro.hasPermission name="people:user:update">
                <el-table-column label="操作" width="180px" align="center">
                    <template #default="scope">
                        <@shiro.hasPermission name="people:user:update">
                            <el-link :underline="false" type="primary" @click="save(scope.row.id)">编辑</el-link>
                        </@shiro.hasPermission>
                        <@shiro.hasPermission name="people:user:del">
                        <el-link :underline="false" type="primary" @click="del([scope.row])">删除</el-link>
                        </@shiro.hasPermission>
                    </template>
                </el-table-column>
            </@shiro.hasPermission>
        </el-table>
        <el-pagination
                background
                :page-sizes="[10, 50, 100]"
                layout="total, sizes, prev, pager, next, jumper"
                :current-page="currentPage"
                :page-size="pageSize"
                :total="total"
                class="ms-pagination"
                @current-change='currentChange'
                @size-change="sizeChange">
        </el-pagination>
    </el-main>
</div>
</body>

</html>
<script>
    var indexVue = new _Vue({
        el: '#index',
        data: function (){
            return {
                treeList: [],
                //用户列表
                selectionList: [],
                //用户列表选中
                loading: true,
                emptyText: '',
                total: 0,
                //总记录数量
                pageSize: 50,
                //页面数量
                currentPage: 1,
                //初始页
                mananger: ms.manager,
                //搜索表单
                form: {
                    // id
                    id: '',
                    // 用户名
                    peopleName: '',
                    // 密码
                    peoplePassword: '',
                    // 昵称
                    puNickname: '',
                    // 性别
                    puSex: '',
                    // 真实姓名
                    puRealName: '',
                    // 身份证
                    puCard: '',
                    // 手机号码
                    peoplePhone: '',
                    // 邮箱
                    peopleMail: '',
                    // 头像
                    // 地址
                    puAddress: ''
                },
                // 了解渠道
                channelOptions:[],
                // 参观目的
                purposeOptions:[],
                peopleDateTimes: null,
                puSexOptions: [{
                    "value": 1,
                    "label": "男"
                }, {
                    "value": 2,
                    "label": "女"
                }],
                peopleStateOptions: [{
                    "value": 0,
                    "label": "未审"
                }, {
                    "value": 1,
                    "label": "已审"
                }],
                rules: {peopleId: [{max: 20, message: '长度不能超过20位', trigger: 'blur'}]},
                historyKey: "people_people_user_history"
            }
        },
        methods: {
            //查询列表
            list: function () {
                var that = this;
                var page = {
                    pageNo: that.currentPage,
                    pageSize: that.pageSize
                };
                var form = JSON.parse(JSON.stringify(that.form));

                if (that.peopleDateTimes) {
                    form.peopleDateTimes = that.peopleDateTimes[0] + '至' + that.peopleDateTimes[1];
                } else {
                    form.peopleDateTimes = null;
                }

                for (var key in form) {
                    if (!form[key]) {
                        delete form[key];
                    }
                }

                sessionStorage.setItem(this.historyKey,JSON.stringify({form: form, page: page}));

                that.$refs.searchForm.validate(function (valid) {
                    if (valid){
                        setTimeout(function () {
                            ms.http.get(ms.manager + "/people/peopleUser/auditList.do", Object.assign({}, form, page))
                                .then(function (data) {
                                    if(data.result){
                                        if (data.data.total <= 0) {
                                            that.loading = false;
                                            that.emptyText = '暂无数据';
                                            that.treeList = [];
                                        } else {
                                            that.emptyText = '';
                                            that.loading = false;
                                            that.total = data.data.total;
                                            that.treeList = data.data.rows;
                                            that.treeList.forEach(function (item) {
                                                // 如果puIcon为空，则设置为null并返回
                                                if (!item.puIcon) {
                                                    item.puIcon = null;
                                                    return;
                                                }
                                                if(!item.puIcon.startsWith("http://") && !item.puIcon.startsWith("https://")) {
                                                    item.puIcon = ms.contextpath + item.puIcon;
                                                }
                                            });
                                        }
                                    }
                                }).catch(function (err) {
                                that.$notify({
                                    type: 'warning',
                                    msg: err.msg,
                                    title: '失败'
                                })
                                that.loading = false;

                                // console.log(err);
                            });
                        }, 500);
                    }else {
                        that.loading = false;
                    }
                })

            },
            //用户列表选中
            handleSelectionChange: function (val) {
                this.selectionList = val;
            },
            //删除
            del: function (row) {
                var that = this;
                that.$confirm('此操作将永久删除所选内容, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(function () {
                    ms.http.post(ms.manager + "/people/peopleUser/delete.do", row.length ? row : [row], {
                        headers: {
                            'Content-Type': 'application/json'
                        }
                    }).then(function (data) {
                        if (data.result) {
                            that.$notify({
                                title:'成功',
                                type: 'success',
                                message: '删除成功!'
                            }); //删除成功，刷新列表

                            that.list();
                        } else {
                            that.$notify({
                                title: '失败',
                                message: data.msg,
                                type: 'warning'
                            });
                        }
                    });
                });
            },
            //更新用户审核状态
            updateUserState: function (row) {
                var that = this;
                that.$confirm('此操作将审核用户, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(function () {
                    ms.http.post(ms.manager + "/people/updateState.do", row.length ? row : [row], {
                        headers: {
                            'Content-Type': 'application/json'
                        }
                    }).then(function (data) {
                        if (data.result) {
                            that.$notify({
                                title:'成功',
                                type: 'success',
                                message: '审核成功!'
                            }); //审核成功，刷新列表

                            that.list();
                        }
                    });
                });
            },
            //新增
            save: function (id) {
                if (id) {
                    ms.util.openSystemUrl("/people/peopleUser/form.do?peopleId=" + id);
                } else {
                    ms.util.openSystemUrl("/people/peopleUser/form.do");
                }
            },
            //pageSize改变时会触发
            sizeChange: function (pagesize) {
                this.loading = true;
                this.pageSize = pagesize;
                this.list();
            },
            //currentPage改变时会触发
            currentChange: function (currentPage) {
                this.loading = true;
                this.currentPage = currentPage;
                this.list();
            },
            //重置表单
            rest: function () {
                this.currentPage = 1;
                this.loading = true;
                this.$refs.searchForm.resetFields();
                this.peopleDateTimes = null;
                this.list();
            },
            //了解渠道  列表格式化
            channelFormat:function(row, column, cellValue, index){
                var value="";

                if(cellValue){
                    var data = this.channelOptions.find(function(value){
                        return value.dictValue==cellValue;
                    })
                    if(data&&data.dictLabel){
                        value = data.dictLabel;
                    }
                }

                return value;
            },

//获取channel数据源
            channelOptionsGet:function() {
                var that = this;
                ms.http.get(ms.base+'/mdiy/dict/list.do', {dictType:'注册-了解渠道',pageSize:99999}).then(function (res) {
                    that.channelOptions = res.data.rows;
                }).catch(function (err) {
                    console.log(err);
                });
            },
            //参观目的  列表格式化
            purposeFormat:function(row, column, cellValue, index){
                var value="";

                if(cellValue){
                    var data = this.purposeOptions.find(function(value){
                        return value.dictValue==cellValue;
                    })
                    if(data&&data.dictLabel){
                        value = data.dictLabel;
                    }
                }

                return value;
            },

//获取purpose数据源
            purposeOptionsGet:function() {
                var that = this;
                ms.http.get(ms.base+'/mdiy/dict/list.do', {dictType:'注册-参观目的',pageSize:99999}).then(function (res) {
                    that.purposeOptions = res.data.rows;
                }).catch(function (err) {
                    console.log(err);
                });
            },
        },
        mounted: function () {
            //如果存在历史参数，恢复页面结果
            if(sessionStorage.getItem(this.historyKey) && ms.util.getParameter("isBack") == 'true') {
                var _history = JSON.parse(sessionStorage.getItem(this.historyKey))
                this.form = _history.form;
                this.total = parseInt(_history.total);
                this.currentPage = parseInt(_history.page.pageNo);
                this.pageSize = parseInt(_history.page.pageSize);
            }
            this.list();
        },
        created:function(){
            var that = this;

            //加载了解渠道 数据
            this.channelOptionsGet();

            //加载参观目的 数据
            this.purposeOptionsGet();
        }
    });
</script>
<style>
    #index .ms-search {
        padding: 20px 0;
    }
</style>