客户管理
This commit is contained in:
parent
d87f1184c0
commit
d4df6a7486
27
src/api/system/customer.js
Normal file
27
src/api/system/customer.js
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
export function add(data) {
|
||||||
|
return request({
|
||||||
|
url: 'api/customer',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function del(ids) {
|
||||||
|
return request({
|
||||||
|
url: 'api/customer',
|
||||||
|
method: 'delete',
|
||||||
|
data: ids
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function enable(data) {
|
||||||
|
return request({
|
||||||
|
url: 'api/customer',
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export default { add, enable, del }
|
||||||
@ -60,7 +60,7 @@
|
|||||||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;">
|
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;">
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="name" :label="`${crud.title}名称`" />
|
<el-table-column :show-overflow-tooltip="true" prop="name" :label="`${crud.title}名称`" />
|
||||||
<el-table-column :show-overflow-tooltip="true" prop="num" :label="`${crud.title === '区域' ? '景区' : '人员'}数量`" />
|
<el-table-column :show-overflow-tooltip="true" prop="num" :label="`${crud.title === '区域' ? '景区' : '人员'}数量`" />
|
||||||
<el-table-column v-if="checkPer(['admin', 'user:edit', 'user:del'])" label="操作" width="115" align="center"
|
<el-table-column v-if="checkPer(['admin', 'area:edit', 'area:del'])" label="操作" width="115" align="center"
|
||||||
fixed="right">
|
fixed="right">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<udOperation :data="scope.row" :permission="permission" />
|
<udOperation :data="scope.row" :permission="permission" />
|
||||||
@ -88,9 +88,9 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
permission: {
|
permission: {
|
||||||
add: ['admin', 'user:add'],
|
add: ['admin', 'area:add'],
|
||||||
edit: ['admin', 'user:edit'],
|
edit: ['admin', 'area:edit'],
|
||||||
del: ['admin', 'user:del']
|
del: ['admin', 'area:del']
|
||||||
},
|
},
|
||||||
active: '',
|
active: '',
|
||||||
rules: {
|
rules: {
|
||||||
|
|||||||
147
src/views/system/customer/index.vue
Normal file
147
src/views/system/customer/index.vue
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<!--工具栏-->
|
||||||
|
<div class="head-container">
|
||||||
|
<div>
|
||||||
|
<!-- 搜索 -->
|
||||||
|
<el-input
|
||||||
|
v-model="query.nickName"
|
||||||
|
clearable
|
||||||
|
size="small"
|
||||||
|
placeholder="输入手机号"
|
||||||
|
style="width: 200px;"
|
||||||
|
class="filter-item"
|
||||||
|
@keyup.enter.native="crud.toQuery"
|
||||||
|
/>
|
||||||
|
<rrOperation />
|
||||||
|
<el-button v-permission="permission.add" class="filter-item" size="mini" type="primary"
|
||||||
|
icon="el-icon-plus" @click="crud.toAdd">
|
||||||
|
添加{{ crud.title }}
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--表单渲染-->
|
||||||
|
<el-dialog append-to-body :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0"
|
||||||
|
:title="crud.status.title" width="400px">
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
|
||||||
|
<el-row :gutter="10">
|
||||||
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
||||||
|
<el-form-item label="姓名" prop="nickName">
|
||||||
|
<el-input v-model="form.nickName" placeholder="请输入姓名"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
||||||
|
<el-form-item label="性别">
|
||||||
|
<el-select v-model="form.gender" placeholder="请选择性别" clearable>
|
||||||
|
<el-option v-for="item in dict.common_gender" :key="item.id" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
||||||
|
<el-form-item label="手机号" prop="phone">
|
||||||
|
<el-input type="tel" v-model.number="form.phone" placeholder="请输入手机号"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
||||||
|
<el-form-item label="用户类型" prop="userType">
|
||||||
|
<el-select v-model="form.userType" placeholder="请选择用户类型" clearable>
|
||||||
|
<el-option v-for="(item,index) in userTypes" :key="index" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer" style="margin-top: -30px;">
|
||||||
|
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
||||||
|
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">保存</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
<!--表格渲染-->
|
||||||
|
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;">
|
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="nickName" label="姓名" />
|
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="gender" label="性别" />
|
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="phone" label="手机号" />
|
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="userType" label="用户类型" />
|
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建时间" />
|
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="enable" label="用户状态" />
|
||||||
|
<el-table-column v-if="checkPer(['admin', 'customer:enable', 'customer:del'])" label="操作" width="115" align="center"
|
||||||
|
fixed="right">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button v-permission="permission.enable" size="mini" type="primary" icon="el-icon-folder" @click.stop="toEnable(scope.row)">{{ scope.row.enable ? '停用' : '启用' }}</el-button>
|
||||||
|
<el-popover v-model="pop" v-permission="permission.del" placement="top" width="180" trigger="manual" @show="pop = false" @hide="pop = false">
|
||||||
|
<p>确定删除本条数据吗？</p>
|
||||||
|
<div style="text-align: right; margin: 0">
|
||||||
|
<el-button size="mini" type="text" @click="pop = false;crud.cancelDelete(scope.row)">取消</el-button>
|
||||||
|
<el-button :loading="crud.dataStatus[crud.getDataId(scope.row)].delete === 2" type="primary" size="mini" @click="crud.doDelete(scope.row)">确定</el-button>
|
||||||
|
</div>
|
||||||
|
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" @click.stop="pop = true">删除</el-button>
|
||||||
|
</el-popover>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<!--分页组件-->
|
||||||
|
<pagination />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import crudCustomer from '@/api/system/customer'
|
||||||
|
import { isvalidPhone } from '@/utils/validate'
|
||||||
|
import CRUD, { presenter, header, form, crud } from '@crud/crud'
|
||||||
|
import rrOperation from '@crud/RR.operation'
|
||||||
|
import pagination from '@crud/Pagination'
|
||||||
|
const defaultForm = { phone: null, nickName: null, gender: null, userType: null }
|
||||||
|
export default {
|
||||||
|
name: 'Customer',
|
||||||
|
components: { rrOperation, pagination },
|
||||||
|
// 数据字典
|
||||||
|
dicts: ['common_gender'],
|
||||||
|
cruds() {
|
||||||
|
return CRUD({ title: '客户', url: 'api/customer', crudMethod: { ...crudCustomer }, optShow: { add: true, reset: true }})
|
||||||
|
},
|
||||||
|
mixins: [presenter(), header(), form(defaultForm), crud()],
|
||||||
|
data(){
|
||||||
|
// 自定义验证
|
||||||
|
const validPhone = (rule, value, callback) => {
|
||||||
|
if (!value) {
|
||||||
|
callback(new Error('请输入电话号码'))
|
||||||
|
} else if (!isvalidPhone(value)) {
|
||||||
|
callback(new Error('请输入正确的11位手机号码'))
|
||||||
|
} else {
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
permission: {
|
||||||
|
add: ['admin', 'customer:add'],
|
||||||
|
enable: ['admin', 'customer:enable'],
|
||||||
|
del: ['admin', 'customer:del']
|
||||||
|
},
|
||||||
|
pop: false,
|
||||||
|
userTypes: [
|
||||||
|
{ label: '普通用户', value: '普通用户' },
|
||||||
|
{ label: '公司对接人', value: '公司对接人' }
|
||||||
|
],
|
||||||
|
rules: {
|
||||||
|
gender: [
|
||||||
|
{ required: true, message: '请选择性别', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
userType: [
|
||||||
|
{ required: true, message: '请选择用户类型', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
nickName: [
|
||||||
|
{ required: true, message: '请输入姓名', trigger: 'blur' },
|
||||||
|
{ min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
phone: [
|
||||||
|
{ required: true, trigger: 'blur', validator: validPhone }
|
||||||
|
],
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
::v-deep .el-select{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue
Block a user