|
|
@@ -1,91 +1,147 @@
|
|
|
<template>
|
|
|
- <common-home
|
|
|
- :pageSize="pageParams.size"
|
|
|
- :total="total"
|
|
|
- :searchKeys="searchKeys"
|
|
|
- :searchKey="pageParams.key"
|
|
|
- :searchKeyword="pageParams.keyword"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- @refresh-data="handleRefreshData"
|
|
|
- @search="handleSearchAction">
|
|
|
- <div slot="screen-type">
|
|
|
- <!-- 注册来源 -->
|
|
|
- <label>注册来源</label>
|
|
|
- <el-select v-model="pageParams.fromApp" clearable placeholder="不限" @change="handleRefreshData">
|
|
|
- <el-option
|
|
|
- v-for="item in fromAppOptions"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
-
|
|
|
- <!-- 手机认证状态 -->
|
|
|
- <label>手机认证状态</label>
|
|
|
- <el-select v-model="pageParams.mobileValidCode" clearable placeholder="不限" @change="handleRefreshData">
|
|
|
- <el-option
|
|
|
- v-for="item in mobileValidCodeOptions"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
-
|
|
|
- <el-table
|
|
|
- :data="tableData"
|
|
|
- stripe
|
|
|
- style="width: 100%">
|
|
|
- <el-table-column
|
|
|
- label="操作">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="vipName"
|
|
|
- label="用户名称">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="userUU"
|
|
|
- label="个人UU">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="mobile"
|
|
|
- label="手机号"
|
|
|
- width="170">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.row.mobile }}
|
|
|
- <span class="valid-code1" v-if="scope.row.mobileValidCode === 2">(已认证)</span>
|
|
|
- <span class="valid-code0" v-if="scope.row.mobileValidCode !== 2">(未认证)</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="email"
|
|
|
- label="邮箱"
|
|
|
- width="250">
|
|
|
- <template slot-scope="scope" v-if="scope.row.email">
|
|
|
- {{ scope.row.email }}
|
|
|
- <span class="valid-code1" v-if="scope.row.emailValidCode === 2">(已认证)</span>
|
|
|
- <span class="valid-code0" v-if="scope.row.emailValidCode !== 2">(未认证)</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="registerDate"
|
|
|
- label="注册时间"
|
|
|
- :formatter="formatDate"
|
|
|
- width="160">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="lastLogin"
|
|
|
- label="上次登录">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="fromApp"
|
|
|
- label="注册来源">
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </common-home>
|
|
|
+ <div>
|
|
|
+ <common-home
|
|
|
+ :pageSize="pageParams.size"
|
|
|
+ :total="total"
|
|
|
+ :searchKeys="searchKeys"
|
|
|
+ :searchKey="pageParams.key"
|
|
|
+ :searchKeyword="pageParams.keyword"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ @refresh-data="handleRefreshData"
|
|
|
+ @search="handleSearchAction">
|
|
|
+ <div slot="screen-type">
|
|
|
+ <!-- 注册来源 -->
|
|
|
+ <label>注册来源</label>
|
|
|
+ <el-select v-model="pageParams.fromApp" clearable placeholder="不限" @change="handleRefreshData">
|
|
|
+ <el-option
|
|
|
+ v-for="item in fromAppOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+
|
|
|
+ <!-- 手机认证状态 -->
|
|
|
+ <label>手机认证状态</label>
|
|
|
+ <el-select v-model="pageParams.mobileValidCode" clearable placeholder="不限" @change="handleRefreshData">
|
|
|
+ <el-option
|
|
|
+ v-for="item in mobileValidCodeOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ stripe
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="vipName"
|
|
|
+ label="用户名称">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="userUU"
|
|
|
+ label="个人UU">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="mobile"
|
|
|
+ label="手机号"
|
|
|
+ width="170">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.mobile }}
|
|
|
+ <span class="valid-code1" v-if="scope.row.mobileValidCode === 2">(已认证)</span>
|
|
|
+ <span class="valid-code0" v-if="scope.row.mobileValidCode !== 2">(未认证)</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="email"
|
|
|
+ label="邮箱"
|
|
|
+ width="250">
|
|
|
+ <template slot-scope="scope" v-if="scope.row.email">
|
|
|
+ {{ scope.row.email }}
|
|
|
+ <span class="valid-code1" v-if="scope.row.emailValidCode === 2">(已认证)</span>
|
|
|
+ <span class="valid-code0" v-if="scope.row.emailValidCode !== 2">(未认证)</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="registerDate"
|
|
|
+ label="注册时间"
|
|
|
+ :formatter="formatDate"
|
|
|
+ width="160">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="lastLogin"
|
|
|
+ label="上次登录">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="fromApp"
|
|
|
+ label="注册来源">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="user-actions" slot="actions">
|
|
|
+ <button
|
|
|
+ type="button"
|
|
|
+ class="btn btn-default btn-refresh"
|
|
|
+ @click="isAddNewUser = true; newUserInfo = {}">
|
|
|
+ 新增
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </common-home>
|
|
|
+
|
|
|
+ <!-- 新增用户对话框 -->
|
|
|
+ <el-dialog
|
|
|
+ title="新增用户"
|
|
|
+ :visible.sync="isAddNewUser"
|
|
|
+ width="450px"
|
|
|
+ :show-close="true"
|
|
|
+ :append-to-body="true">
|
|
|
+ <!-- 用户信息展示 -->
|
|
|
+ <div class="new-user-info">
|
|
|
+ <form class="form-horizontal">
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">姓名</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <input type="text" class="form-control" title="vipName" v-model="newUserInfo.vipName" required/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">手机号</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <input type="tel" class="form-control" title="mobile" v-model="newUserInfo.mobile" required/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">邮箱</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <input type="email" class="form-control" title="email" v-model="newUserInfo.email"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">密码</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <!-- 暂时使用文本 -->
|
|
|
+ <input type="text" class="form-control" title="password" v-model="newUserInfo.password" required/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <!-- 对话框尾部 -->
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="addNewUser">保 存</el-button>
|
|
|
+ <el-button @click="isAddNewUser = false">取 消</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -109,6 +165,11 @@
|
|
|
}
|
|
|
]
|
|
|
|
|
|
+ function addNewUserInfo (user) {
|
|
|
+ return axios.post('/api/user//addNewUser', user)
|
|
|
+ .then(user => { return user })
|
|
|
+ }
|
|
|
+
|
|
|
export default {
|
|
|
name: 'user-home',
|
|
|
components: {
|
|
|
@@ -127,7 +188,9 @@
|
|
|
pageContent: [],
|
|
|
total: 0,
|
|
|
mobileValidCodeOptions: ValidCode,
|
|
|
- searchKeys: searchKeys
|
|
|
+ searchKeys: searchKeys,
|
|
|
+ isAddNewUser: false,
|
|
|
+ newUserInfo: {}
|
|
|
}
|
|
|
},
|
|
|
created () {
|
|
|
@@ -179,6 +242,23 @@
|
|
|
const routeLocation = {name: 'UserBasicInfo', params: row}
|
|
|
this.$router.push(routeLocation)
|
|
|
},
|
|
|
+ addNewUser () {
|
|
|
+ const body = _.defaultsDeep({}, this.newUserInfo)
|
|
|
+
|
|
|
+ const error = response => {
|
|
|
+ this.$message.error(response)
|
|
|
+ }
|
|
|
+
|
|
|
+ addNewUserInfo(body)
|
|
|
+ .then(user => {
|
|
|
+ console.log(user)
|
|
|
+ this.$message.success('新增成功')
|
|
|
+ this.isAddNewUser = false
|
|
|
+
|
|
|
+ // 刷新页面数据
|
|
|
+ this.fetchData()
|
|
|
+ }).catch(error)
|
|
|
+ },
|
|
|
formatDate (row, column, value) {
|
|
|
if (!value) {
|
|
|
return ''
|
|
|
@@ -227,4 +307,77 @@
|
|
|
.el-table td span.valid-code3{
|
|
|
color: #606266;
|
|
|
}
|
|
|
+ .user-actions {
|
|
|
+ padding: 17px;
|
|
|
+ }
|
|
|
+ .user-actions button {
|
|
|
+ height: 28px;
|
|
|
+ line-height: 14px;
|
|
|
+ border-radius: 0;
|
|
|
+ }
|
|
|
+ .new-user-info {
|
|
|
+ width: 420px;
|
|
|
+ }
|
|
|
+ .new-user-info .form-horizontal .row {
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ .new-user-info .form-horizontal .control-label {
|
|
|
+ text-align: left;
|
|
|
+
|
|
|
+ color: #000000;
|
|
|
+ }
|
|
|
+ .new-user-info .form-horizontal .form-control {
|
|
|
+ width: 300px;
|
|
|
+ border-radius: 0;
|
|
|
+ height: 34px;
|
|
|
+ line-height: 14px;
|
|
|
+
|
|
|
+ color: #646464;
|
|
|
+ }
|
|
|
+ .new-user-info .form-horizontal .control-label,
|
|
|
+ .new-user-info .form-horizontal .form-control {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: normal;
|
|
|
+ font-family: "Microsoft YaHei", sans-serif;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .el-dialog {
|
|
|
+ border-radius: 5px;
|
|
|
+ }
|
|
|
+ .el-dialog__header {
|
|
|
+ padding: 14px 20px;
|
|
|
+ height: 44px;
|
|
|
+ line-height: 16px;
|
|
|
+ border: 1px none #D2D2D2;
|
|
|
+ border-bottom-style: solid;
|
|
|
+ }
|
|
|
+ .el-dialog__header .el-dialog__title {
|
|
|
+ color: #000000;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: normal;
|
|
|
+ font-family: "SimHei", sans-serif;
|
|
|
+ }
|
|
|
+ .el-dialog__body {
|
|
|
+ padding: 22px 0 22px 40px;
|
|
|
+ }
|
|
|
+ .el-dialog__footer {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .el-dialog__footer .el-button {
|
|
|
+ width: 180px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 15px;
|
|
|
+ line-height: 14px;
|
|
|
+ padding: 8px 0;
|
|
|
+
|
|
|
+ background: none;
|
|
|
+
|
|
|
+ color: #656565;
|
|
|
+ }
|
|
|
+ .el-dialog__footer .el-button--primary {
|
|
|
+ background-color: #4E8EFC;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
</style>
|