You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
spms-vue/src/views/userManage/customerManage.vue

597 lines
23 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div>
<el-form :inline="true" :model="filterQuery" class="query-form" size="mini">
<el-row>
<el-form-item class="query-form-item">
<el-input
style="width: 400px"
v-model="filterQuery.companyName"
placeholder="企业名称"
></el-input>
</el-form-item>
<el-form-item>
<el-button-group>
<el-button
type="primary"
icon="el-icon-refresh"
@click="onReset"
></el-button>
<el-button type="primary" icon="search" @click="onSubmit"
>查询
</el-button
>
</el-button-group>
</el-form-item>
</el-row>
</el-form>
<el-table v-loading="loading" :data="list" style="width: 100%">
<el-table-column label="序号" type="index"></el-table-column>
<el-table-column
label="企业名称"
prop="companyName"
width="230"
></el-table-column>
<el-table-column
label="社会统一信用号"
prop="creditNum"
width="160"
></el-table-column>
<el-table-column label="所属地区" prop="area" width="180">
</el-table-column>
<el-table-column
label="详细地址"
prop="detailAddr"
width="230"
:show-overflow-tooltip="true"
>
</el-table-column>
<el-table-column label="企业类型" prop="bussinessStatus" width="120">
<template slot-scope="scope">
<span>{{ bussinessFlag[scope.row.bussinessStatus] }}</span>
</template>
</el-table-column>
<el-table-column label="客户状态" prop="userFlag" width="120">
<template slot-scope="scope">
<el-tag :type="scope.row.userFlag | statusFilterType">{{
scope.row.userFlag | statusFilterName
}}
</el-tag>
</template>
</el-table-column>
<!-- <el-table-column label="真实姓名" prop="userName" width="120"></el-table-column>-->
<!-- <el-table-column label="手机" prop="employeeName" width="120"></el-table-column>-->
<!-- <el-table-column label="联系电话" prop="tel" width="120"></el-table-column>-->
<!-- <el-table-column label="邮箱" prop="email" width="120"></el-table-column>-->
<!-- <el-table-column label="是否弹窗" prop="isInfoLink" width="120">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ isTip[scope.row.isInfoLink] }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="弹窗链接"-->
<!-- prop="infoLink"-->
<!-- width="180"-->
<!-- :show-overflow-tooltip="true"-->
<!-- >-->
<!-- </el-table-column>-->
<el-table-column label="角色" prop="role" width="120"></el-table-column>
<!-- <el-table-column label="打印模板" prop="pdfTemplateName" width="120"></el-table-column>-->
<el-table-column label="最大用户数" prop="userMax" width="120">
</el-table-column>
<!-- <el-table-column label="当前用户数" prop="count" width="120">-->
<!-- </el-table-column>-->
<el-table-column label="操作" width="120" fixed="right">
<template slot-scope="scope">
<el-button-group>
<el-button
type="text"
size="mini"
@click.native.stop="customerkDialog(scope.row)"
>查看用户
</el-button
>
<el-button
type="text"
size="mini"
@click.native.stop="contractDialog(scope.row)"
>查看联系人
</el-button
>
</el-button-group>
</template>
</el-table-column
>
<el-table-column label="操作" fixed="right" width="120">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click.native.stop="checkDialog(scope.row)"
>编辑
</el-button
>
</template>
</el-table-column>
</el-table>
<el-dialog title="客户信息编辑" :visible.sync="formVisible" width="60%">
<el-form :model="formData" ref="dataForm">
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col" type="flex">
<div class="text item">
<el-form-item label="客户名称" prop="userName">
<el-input
v-model="formData.customerName"
style="width: 60%"
size="small"
:disabled="true"
></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="10" class="el-col">
<div class="text item">
<div class="text item">
<el-form-item label="最大用户数" prop="employeeName">
<el-input
v-model="formData.userMax"
size="small"
style="width: 40%"
type="number"
@change="verifyUserCount"
></el-input>
</el-form-item>
</div>
</div>
</el-col>
</el-row>
<!-- <el-row :gutter="20" class="el-row" type="flex">-->
<!-- <el-col :span="10" class="el-col" type="flex">-->
<!-- <div class="text item">-->
<!-- <el-form-item label="是否弹窗提示" prop="isInfoLink">-->
<!-- <el-select-->
<!-- v-model="formData.isInfoLink"-->
<!-- placeholder="是否弹窗提示"-->
<!-- >-->
<!-- <el-option label="否" value="0"></el-option>-->
<!-- <el-option label="是" value="1"></el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- <el-col :span="10" class="el-col">-->
<!-- <div class="text item">-->
<!-- <div class="text item">-->
<!-- <el-form-item label="弹窗提示窗口链接" prop="infoLink">-->
<!-- <el-input-->
<!-- style="width: 60%"-->
<!-- size="small"-->
<!-- v-model="formData.infoLink"-->
<!-- ></el-input>-->
<!-- </el-form-item>-->
<!-- </div>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<!-- <el-row :gutter="20" class="el-row" type="flex">-->
<!-- <el-col :span="10" class="el-col" type="flex">-->
<!-- <div class="text item">-->
<!-- <el-form-item label="选择打印模板" prop="pdfTemplateId">-->
<!-- <el-select-->
<!-- v-model="formData.pdfTemplateId"-->
<!-- placeholder="选择打印模板"-->
<!-- >-->
<!-- <el-option-->
<!-- v-for="item in pdfTemplates"-->
<!-- :key="item.idStr"-->
<!-- :label="item.name"-->
<!-- :value="item.idStr">-->
<!-- </el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<el-form-item label="状态:" prop="userFlag">
<el-radio-group v-model="formData.userFlag">
<el-radio :label="0">禁用</el-radio>
<el-radio :label="1">正常</el-radio>
<el-radio :label="2">未验证</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="分配角色:">
<el-radio-group v-model="check" @change="handleCheckedChange">
<el-radio v-for="item in roles" :key="item.id" :label="item.id">{{
item.name
}}
</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="cancelDialog" size="small">取消</el-button>
<el-button type="primary" size="small" @click.native="formSubmit()"
>提交
</el-button
>
</div>
</el-dialog>
<el-dialog title="客户联系人" :visible.sync="contractVisible" width="60%">
<el-form :model="contractData" ref="dataForm">
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col" type="flex">
<div class="text item">
<el-form-item label="真实姓名" prop="userName">
<el-input
v-model="contractData.contacts"
style="width: 80%"
size="small"
:disabled="true"
></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="10" class="el-col">
<div class="text item">
<div class="text item">
<el-form-item label="手机" prop="employeeName">
<el-input
v-model="contractData.mobile"
size="small"
style="width: 80%"
type="number"
:disabled="true"
></el-input>
</el-form-item>
</div>
</div>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col" type="flex">
<div class="text item">
<el-form-item label="联系电话" prop="tel">
<el-input
v-model="contractData.tel"
style="width: 80%"
size="small"
:disabled="true"
></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="10" class="el-col">
<div class="text item">
<div class="text item">
<el-form-item label="邮箱" prop="email">
<el-input
v-model="contractData.email"
size="small"
style="width: 80%"
:disabled="true"
></el-input>
</el-form-item>
</div>
</div>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="cancelDialog" size="small">确定</el-button>
</div>
</el-dialog>
<div v-if="customerVisible">
<el-dialog
title="客户用户"
:visible.sync="customerVisible"
width="70%"
append-to-body
:modal-append-to-body="false"
:close-on-click-modal="false"
@close="closeCustomerDialog"
>
<customerUser :currentCustomer="currentCustomer"></customerUser>
</el-dialog>
</div>
<el-pagination
:page-size="filterQuery.limit"
@current-change="handleCurrentChange"
layout="prev, pager, next"
:total="total"
:current-page="filterQuery.page"
></el-pagination>
</div>
</template>
<script>
import {getRegisters, checkPass, deleteRe} from "../../api/auth/register";
import {authAdminRoleList, authCustomerRoles} from "../../api/auth/authAdmin";
import {getSystemPDFTemplates} from "../../api/param/systemPDFTemplate";
import {
getCustomers,
updateCustomers,
deleteCustomers,
} from "../../api/auth/customer";
import customerUser from "./customerUser";
export default {
data() {
return {
filterQuery: {
companyName: "",
checkType: "",
page: 1,
limit: 20,
},
value: "",
total: 0,
checkFlag: {
0: "未审核",
1: "已通过",
2: "已拒绝",
},
userflag: {
0: "禁用",
1: "正常",
2: "未验证",
},
bussinessFlag: {
1: "医院",
2: "经营企业"
},
list: [],
isTip: {
0: "否",
1: "是",
},
formVisible: false,
contractVisible: false,
customerVisible: false,
timer: "",
formData: {
customerName: "111",
userMax: "",
isInfoLink: "",
infoLink: "",
customerId: "",
userFlag: "",
roleId: "",
pdfTemplateId: "",
},
contractData: {
contacts: "",
mobile: "",
tel: "",
email: "",
},
currentCustomer: "",
check: "",
roles: [],
pdfTemplates: [],
};
},
filters: {
statusFilterType(status) {
const statusMap = {
0: "gray",
1: "success",
2: "danger",
};
return statusMap[status];
},
statusFilterName(status) {
const statusMap = {
0: "禁用",
1: "正常",
2: "未验证",
};
return statusMap[status];
},
},
methods: {
onReset() {
this.$router.push({
path: "",
});
this.filterQuery = {
companyName: "",
page: 1,
limit: 20,
};
this.getList();
this.filterQuery.page=null;
},
formSubmit() {
this.formData.roleId = 1;
updateCustomers(this.formData)
.then((response) => {
this.loading = false;
this.cancelDialog();
this.getList();
if (response.code === 20000) {
this.$message({
type: "success",
message: "更新成功!",
});
} else {
this.$message.warning("更新失败");
}
})
.catch(() => {
this.cancelDialog();
this.loading = false;
});
},
onSubmit() {
this.filterQuery.checkType=null;
this.getList();
},
getList() {
this.loading = true;
getCustomers(this.filterQuery)
.then((response) => {
this.loading = false;
this.list = response.data.list || [];
for (let i = 0; i < this.list.length; i++) {
if (this.$isNotBlank(this.list[i].pdfTemplateId)) {
for (let j = 0; j < this.pdfTemplates.length; j++) {
if (this.list[i].pdfTemplateId === this.pdfTemplates[j].idStr) {
this.list[i].pdfTemplateName = this.pdfTemplates[j].name;
break;
}
}
}
}
this.total = response.data.total || 0;
})
.catch(() => {
this.loading = false;
this.list = [];
this.total = 0;
});
},
hideForm() {
this.customerVisible = false;
},
cancelDialog() {
this.formVisible = false;
this.contractVisible = false;
},
handleSizeChange(val) {
this.filterQuery.limit = val;
this.getList();
},
handleCurrentChange(val) {
this.filterQuery.page = val;
this.getList();
this.filterQuery.page = 1;
},
handleCheckedChange(val) {
},
checkRegister(tquery) {
this.loading = true;
checkPass(tquery)
.then((response) => {
if (response.code === 20000) {
this.getList();
this.$message({
type: "success",
message: "更新成功!",
});
} else {
this.$message.warning("更新失败");
this.loading = false;
}
})
.catch(() => {
});
},
customerkDialog(row) {
this.currentCustomer = row.customerId;
this.timer = new Date().getTime();
this.customerVisible = true;
},
closeCustomerDialog() {
this.currentCustomer = null;
},
checkDialog(row) {
(this.formData = {
customerName: row.companyName,
userMax: row.userMax,
isInfoLink: row.isInfoLink + "",
infoLink: row.infoLink,
customerId: row.customerId,
userFlag: row.userFlag,
pdfTemplateId: row.pdfTemplateId,
}),
(this.check = parseInt(row.roleId));
this.formVisible = true;
},
contractDialog(row) {
(this.contractData = {
contacts: row.contacts,
mobile: row.mobile,
tel: row.tel,
email: row.email,
}),
(this.contractVisible = true);
},
deleteDialog(row) {
this.$confirm("删除后将清空该客户下所有用户?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
let tQuery = {
id: row.customerId,
};
deleteCustomers(tQuery).then(() => {
this.getList();
});
})
.catch(() => {
});
},
getRoleList() {
authCustomerRoles()
.then((response) => {
this.roles = response.data.list || [];
})
.catch(() => {
});
},
getPDFTemplateList() {
getSystemPDFTemplates()
.then((response) => {
this.pdfTemplates = response.data.list;
})
.catch(() => {
});
},
verifyUserCount(val) {
if (val < 0) {
this.$message.error("用户数不得小于0");
this.formData.userMax = 0;
}
},
},
components: {
customerUser,
},
mounted() {
},
created() {
// this.getPDFTemplateList();
this.getList();
this.getRoleList();
},
};
</script>