Commit a582cccb authored by 华国豪's avatar 华国豪 🙄

1

parent 539ed0d2
......@@ -10,7 +10,7 @@
<title>CRM</title>
</head>
<body>
<body style="width: 100%;overflow: hidden;">
<noscript>
<strong>We're sorry but athena doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
......
......@@ -28,7 +28,7 @@ export default {
<style>
@import './assets/global/font.css';
@import '//at.alicdn.com/t/font_1627123_6rkscxbqh43.css';
@import '//at.alicdn.com/t/font_1627123_1vlackz9u42.css';
/* @import './assets/css/common.css'; */
@import './assets/css/init.css';
body,html{
......
......@@ -22,35 +22,52 @@ table { border-collapse:collapse; border-spacing:0; }
.perfectFont{
font-family: 'perfectFont';
}
.crm-btn.el-button{
border-radius: 0;
padding: 8px 0;
width: 90px;
text-align: center;
margin-right: 20px;
}
.crm-btn-mini.el-button{
border-radius: 0;
padding: 6px 12px;
margin-right: 20px;
}
.crm-btn.query-btn{
background:rgba(13,36,129,1);
border-color: rgba(13,36,129,1);
color: white;
background:rgba(13,36,129,1) !important;
border-color: rgba(13,36,129,1) !important;
color: white !important;
}
.crm-btn.query-btn:hover{
background:rgba(13,36,129,.8);
border-color: rgba(13,36,129,.8);
color: white;
background:rgba(13,36,129,.8) !important;
border-color: rgba(13,36,129,.8) !important;
border-color: rgba(13,36,129,.8) !important;
color: white !important;
}
.crm-btn.easy-btn{
background: white;
border-color: rgba(13,36,129,1);
color: rgba(13,36,129,1);
background: white !important;
border-color: rgba(13,36,129,1) !important;
color: rgba(13,36,129,1) !important;
}
.crm-btn.easy-btn:hover{
background: white;
border-color: rgba(13,36,129,.8);
color: rgba(13,36,129,.8);
background: white !important;
border-color: rgba(13,36,129,.8) !important;
color: rgba(13,36,129,.8) !important;
}
.crm-btn.org-btn{
background: white;
border-color: rgba(255, 164, 117, 1);
color: rgba(255, 164, 117, 1);
background: white !important;
border-color: rgba(255, 164, 117, 1) !important;
color: rgba(255, 164, 117, 1) !important;
}
.crm-btn.org-btn:hover{
background: white;
border-color: rgba(255, 164, 117, .8);
color: rgba(255, 164, 117, .8);;
background: white !important;
border-color: rgba(255, 164, 117, .8) !important;
color: rgba(255, 164, 117, .8) !important;
}
.crm-btn.crm-btn-more{
padding: 7px 12px;
width: auto;
}
.el-input__inner{
border-radius: 0 !important;
......@@ -65,7 +82,6 @@ table { border-collapse:collapse; border-spacing:0; }
padding: 9px 19px;
background-color: white;
margin-bottom: 20px;
}
.MyEditForm .MyEditForm-item .el-form-item{
margin-bottom: 0;
......@@ -73,16 +89,21 @@ table { border-collapse:collapse; border-spacing:0; }
.MyEditForm .el-form-item .el-form-item__content {
line-height: initial;
}
.MyEditForm .el-form-item .el-form-item__content .el-select {
width: 100%;
}
.MyEditForm .el-form-item .el-input__inner {
.MyEditForm .el-form-item .el-input__inner ,.MyEditForm .el-form-item .el-textarea__inner{
border: none;
outline: none;
width: 200px;
height: 14px;
line-height: 14px;
padding-left: 10px;
font-size: 12px;
}
.MyEditForm .el-form-item .el-textarea__inner{
width: 100%;
}
.MyEditForm .el-form-item .el-form-item__label{
line-height: initial;
color: rgba(136, 136, 136, 1);
......@@ -95,3 +116,41 @@ table { border-collapse:collapse; border-spacing:0; }
font-size: 12px;
padding-top: 2px;
}
.MyEditForm .label-pad-left .el-form-item__label{
padding-left: 9px;
}
.Mypagination.el-pagination{
text-align: right;
margin-top: 20px;
}
.Mypagination.el-pagination .el-pagination__sizes{
background:rgba(255,255,255,1);
}
.Mypagination.el-pagination .el-pagination__sizes .el-input__inner{
border: none;
}
.Mypagination.el-pagination.is-background .el-pager li:not(.disabled).active{
background:rgba(13, 36, 129, 1);
border-radius: 0;
}
.cp{
cursor: pointer;
}
/* 字体颜色 */
.font-color-link{
color: #2362fb!important;
}
.font-color-success{
color: #67C23A!important;
}
.font-color-warning{
color: #E6A23C!important;
}
.font-color-danger{
color: #F56C6C!important;
}
/* 字体大小 */
.font-size-12{
font-size: 12px;
}
\ No newline at end of file
......@@ -110,10 +110,10 @@
<el-card class="tic-card" shadow="never">
<div class="tic-content">
<el-row :gutter="10">
<el-col span="8">
<el-col :span="8">
<img src="../assets/img/home/money.png" style="margin:20px 0 0 20px;" />
</el-col>
<el-col span="16">
<el-col :span="16">
<div class="money-box">
<small></small>
16000.00
......@@ -128,8 +128,8 @@
</el-card>
<el-card class="zhou-card" shadow="never">
<el-row :gutter="10">
<el-col span="10" class="title">本周销冠</el-col>
<el-col span="14" class="money-box">
<el-col :span="10" class="title">本周销冠</el-col>
<el-col :span="14" class="money-box">
<small></small>
560000.00
</el-col>
......@@ -216,7 +216,7 @@
</div>
</el-card>
</el-col>
<el-col span="6">
<el-col :span="6">
<el-card class="notinmoney-card" shadow="never">
<div class="title">待收款汇总</div>
<div class="money">
......@@ -227,7 +227,7 @@
</div>
</el-card>
</el-col>
<el-col span="8">
<el-col :span="8">
<el-card class="sum-card ding" shadow="never">
<div slot="header" class="clearfix">
<span>遗忘提醒</span>
......@@ -280,7 +280,7 @@
</el-col>
</el-row>
<el-row :gutter="25" style="margin-top:25px;">
<el-col span="16">
<el-col :span="16">
<el-card class="rank-card" shadow="never">
<div slot="header" class="clearfix">
<el-row>
......
......@@ -4,6 +4,7 @@
justify-content: space-between;
padding-bottom: 25px;
border-bottom: 1px solid rgba(226,228,235,1);
align-items: center;
}
.customerManage .tools h1{
font-weight: bold;
......@@ -13,11 +14,6 @@
display: flex;
align-items: center;
}
.customerManage .tools .rightmenu .el-button{
border-radius: 0;
padding: 9px 30px;
margin-right: 20px;
}
.customerManage .tools .gaoji{
font-size:12px;
font-weight:400;
......@@ -101,6 +97,7 @@
.customerManage .add-box .el-dialog__body{
background-color: rgba(248,250,251,1);
padding-top: 20px;
max-height: 600px;
}
.customerManage .add-box-btn.el-button{
border-radius: 0;
......@@ -122,6 +119,11 @@
color: rgba(13, 36, 129, 1);
background-color: white;
}
.customerManage .el-input .el-input-group__append {
background-color: rgba(13, 36, 129, 1);
border-color: rgba(13, 36, 129, 1);
color: #fff;
}
.customerManage .form-box .form-box-tit{
display: flex;
align-items: center;
......@@ -135,135 +137,230 @@
border-radius:50%;
margin-right: 10px;
}
.customerManage .drawer-header{
height: 83px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 30px;
}
.customerManage .drawer-header .left{
display: flex;
align-items: center;
}
.customerManage .drawer-header .left img{
display: inline-block;
margin-right: 10px;
}
</style>
<template>
<div class="customerManage">
<div class="tools">
<h1>客户管理</h1>
<div>
<el-input placeholder="请输入客户名称/手机/电话" v-model="msg.str" class="input-with-select">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
<div class="rightmenu">
<div class="gaoji">高级查询 <i class="iconfont iconjiantou_xia"></i></div>
<el-button class="crm-btn query-btn" @click="getList">查询</el-button>
<el-button icon="el-icon-plus" class="crm-btn easy-btn" @click="dialogTableVisible=true">新增</el-button>
<el-button class="crm-btn easy-btn">导入</el-button>
<el-button class="crm-btn org-btn">导出</el-button>
<el-button icon="el-icon-plus" class="crm-btn org-btn" @click="dialogTableVisible=true">新增</el-button>
<el-dropdown>
<el-button class="crm-btn crm-btn-more easy-btn">
<i class="iconfont icongengduo"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item><i class="iconfont icondaoru"></i> 导入</el-dropdown-item>
<el-dropdown-item><i class="iconfont icondaochu"></i> 导出</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
<div class="query-box">
<el-row :gutter="20">
<el-col :span="4">
<el-select v-model="value" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="value" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="value" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="value" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="value" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="value" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-col>
</el-row>
</div>
<el-table
v-loading="loading"
v-if="loading"
v-loading="true"
:data="[]">
<el-table-column
v-for="(item, index) in queryType2" :key="index"
:label="item.label">
</el-table-column>
</el-table>
<el-table
v-if="!loading"
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
height="730"
border
row-class-name="font-size-12"
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column fixed type="selection" width="55"></el-table-column>
<el-table-column
prop="NowSellName"
label="负责人"
fixed
prop="CustomerName"
label="客户名称"
width="120"
show-overflow-tooltip>
<template slot-scope="scope">
<p @click="openDetails(scope)" class="font-color-link cp">{{scope.row.CustomerName}}</p>
</template>
</el-table-column>
<el-table-column
prop="CustomerName"
label="客户名称"
width="120"
prop="MainSourceStr"
label="客户来源"
v-if="queryType[1].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="Contact"
label="联系人"
v-if="queryType[2].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="ContactNumber"
label="联系电话"
v-if="queryType[3].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="UpdateTime"
label="更新时间"
prop="Address"
label="地址"
v-if="queryType[4].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="BusinessCount"
label="商机数"
v-if="queryType[5].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="OrderCount"
label="交易订单数"
width="100"
v-if="queryType[6].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="OrderMoney"
label="交易金额"
v-if="queryType[7].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="CouponCount"
label="优惠券"
v-if="queryType[8].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="Client_Balance"
label="幸福存折"
v-if="queryType[9].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="CustomerLevelStr"
label="客户级别"
v-if="queryType[10].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="MainSourceStr"
label="客户来源"
prop="CustomerStatus"
label="审核状态"
v-if="queryType[11].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="RealNameAuthentication"
label="实名认证状态"
v-if="queryType[12].show"
width="120"
show-overflow-tooltip>
<template slot-scope="scope">
<p v-if="scope.row.RealNameAuthentication === 1" class="font-color-success">已认证</p>
<p v-else class="font-color-warning">未认证</p>
</template>
</el-table-column>
<el-table-column
prop="IsAppLogin"
label="APP激活状态"
v-if="queryType[13].show"
width="120"
show-overflow-tooltip>
<template slot-scope="scope">
<p v-if="scope.row.IsAppLogin === 0" class="font-color-warning">未激活</p>
<p v-else class="font-color-success">已激活</p>
</template>
</el-table-column>
<el-table-column
prop="CustomerPublic"
label="距进入公海天数"
v-if="queryType[14].show"
width="120"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="NowSellName"
label="负责人"
width="120"
v-if="queryType[15].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column label="操作">
<el-table-column
prop="Visit"
label="近期约访"
v-if="queryType[16].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="UpdateTime"
label="更新时间"
v-if="queryType[17].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="CreateTimestr"
label="创建时间"
v-if="queryType[18].show"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="IsCarefor"
fixed="right"
width="50"
label="关注">
<template slot-scope="scope">
<p>
<el-tooltip class="item" effect="dark" content="关注" placement="top">
<i v-if="scope.row.IsCarefor === 0" class="el-icon-star-off cp"></i>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="取消关注" placement="top">
<i v-if="scope.row.IsCarefor === 1" class="el-icon-star-on cp"></i>
</el-tooltip>
</p>
</template>
</el-table-column>
<el-table-column
width="40"
fixed="right">
<template slot="header" slot-scope="scope">
<el-popover
placement="bottom"
width="240"
:value="mySelectCtrl">
<mySelect :queryType="queryType" @listenTochildEvent="showMessageFromChild"/>
<i class="el-icon-s-operation cp" @click="showMessageFromChild()" slot="reference"></i>
</el-popover>
</template>
</el-table-column>
<!-- <el-table-column label="操作" fixed="right" width="150">
<template slot-scope="scope">
<el-tooltip class="item" effect="dark" content="提醒" placement="top">
<i class="table-btn blue iconfont icontishi"></i>
......@@ -272,11 +369,45 @@
<i class="table-btn org iconfont icondianhua"></i>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="客户详情" placement="top">
<i class="table-btn green iconfont iconsuosou"></i>
<i class="table-btn green iconfont iconsuosou" @click="drawer = true"></i>
</el-tooltip>
</template>
</el-table-column>
</el-table-column> -->
</el-table>
<div>
<el-pagination
class="Mypagination"
background
@current-change="handleCurrentChange"
:page-sizes="[15, 30, 60, 100]"
:page-size="msg.pageSize"
layout="sizes, prev, pager, next"
@size-change="handleSizeChange"
:total="total">
</el-pagination>
</div>
<el-drawer
title="我是标题"
:with-header="false"
size='70%'
:visible.sync="drawer"
direction="rtl"
:before-close="handleClose">
<div class="drawer-header">
<div class="left">
<img src="../../assets/img/cust/kehu2.png" alt="">
<p>上海云上互联网信息技术有限公司</p>
</div>
<div class="right">
<el-button class="crm-btn query-btn">转移</el-button>
<el-button class="crm-btn easy-btn">编辑</el-button>
<el-button class="crm-btn org-btn">更多</el-button>
</div>
</div>
<div class="drawer-body">
</div>
</el-drawer>
<el-dialog :visible.sync="dialogTableVisible" custom-class="add-box">
<div class="add-tit" slot="title">
<p><span></span>新建客户</p>
......@@ -296,7 +427,6 @@
<el-col :span="8">
<div class="MyEditForm-item">
<el-form-item label="客户级别" prop="CustomerLevel">
<!-- placeholder="请选择客户级别" -->
<el-select v-model="form.CustomerLevel" placeholder="请选择客户级别">
<el-option
v-for="item in SourceEnum"
......@@ -353,6 +483,113 @@
</div>
</el-col>
</el-row>
<el-row :gutter="30">
<el-col :span="8">
<div class="MyEditForm-item">
<el-form-item label="经营场所" prop="Premises">
<el-select v-model="form.Premises" placeholder="请选择客户来源">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-form-item>
</div>
</el-col>
<el-col :span="8">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="所属品牌">
<el-select v-model="form.BrandIds" placeholder="请选择所属品牌">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="备注">
<el-input type="textarea" placeholder="客户的特殊喜好" v-model="form.Remark"></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
<p class="form-box-tit"><span class="radius"></span> 位置信息</p>
<el-row :gutter="30">
<el-col :span="6">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="国/省/市/区">
<el-select v-model="form.Country" placeholder="国家">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-form-item>
</div>
</el-col>
<el-col :span="6">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="国/省/市/区">
<el-select v-model="form.Province" placeholder="省份">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-form-item>
</div>
</el-col>
<el-col :span="6">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="国/省/市/区">
<el-select v-model="form.City" placeholder="城市">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-form-item>
</div>
</el-col>
<el-col :span="6">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="国/省/市/区">
<el-select v-model="form.District" placeholder="地区">
<el-option
v-for="item in SourceEnum"
:key="item.ID"
:label="item.Name"
:value="item.ID">
</el-option>
</el-select>
</el-form-item>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="定位">
<el-input type="textarea" placeholder="请输入详情地址" v-model="form.Remark"></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
</el-form>
</div>
<div slot="footer" class="dialog-footer">
......@@ -363,9 +600,133 @@
</div>
</template>
<script>
import mySelect from "../select/select";
export default {
components: {
mySelect
},
data() {
return {
queryType2: [
{
label: '客户名称',
show: true,
},{
label: '客户来源',
show: true,
},{
label: '联系人',
show: true,
},{
label: '联系电话',
show: true,
},{
label: '地址',
show: true,
},{
label: '商机数',
show: true,
},{
label: '交易订单数',
show: true,
},{
label: '交易金额',
show: true,
},{
label: '优惠券',
show: true,
},{
label: '幸福存折',
show: true,
},{
label: '客户级别',
show: true,
},{
label: '审核状态',
show: true,
},{
label: '实名认证状态',
show: true,
},{
label: 'APP激活状态',
show: true,
},{
label: '距进入公海天数',
show: true,
},{
label: '负责人',
show: true,
},{
label: '近期约访',
show: true,
},{
label: '更新时间',
show: true,
},{
label: '创建时间',
show: true,
},
],
queryType: [
{
label: '客户名称',
show: true,
},{
label: '客户来源',
show: true,
},{
label: '联系人',
show: true,
},{
label: '联系电话',
show: true,
},{
label: '地址',
show: true,
},{
label: '商机数',
show: true,
},{
label: '交易订单数',
show: true,
},{
label: '交易金额',
show: true,
},{
label: '优惠券',
show: true,
},{
label: '幸福存折',
show: true,
},{
label: '客户级别',
show: true,
},{
label: '审核状态',
show: true,
},{
label: '实名认证状态',
show: true,
},{
label: 'APP激活状态',
show: true,
},{
label: '距进入公海天数',
show: true,
},{
label: '负责人',
show: true,
},{
label: '近期约访',
show: true,
},{
label: '更新时间',
show: true,
},{
label: '创建时间',
show: true,
},
],
rules:{
CustomerName: [
{ required: true, message: '请输入客户名称', trigger: 'blur' }
......@@ -382,22 +743,29 @@ export default {
ContactNumber: [
{ required: true, message: '请输入联系电话', trigger: 'blur' }
],
Premises: [
{ required: true, message: '请选择经营场所', trigger: 'change'}
]
},
mySelectCtrl: false,
drawer: false,
loading: true,
dialogTableVisible: true,
dialogTableVisible: false,
tableData: [],
multipleSelection: [],
value: '',
SourceEnum: [],
msg: {
str: '',
CustomerName: '',
Contact: '',
pageIndex: 1,
pageSize: 10,
pageSize: 15,
ContactNumber: '',
WhereType: -1,
OrderBy: ''
},
total: 0,
form: {
CustomerId: 0,
CustomerName: '',
......@@ -444,12 +812,36 @@ export default {
this.GetCustomerSourceEnum()
},
methods: {
showMessageFromChild(list){
this.mySelectCtrl=!this.mySelectCtrl
if (list) {
this.queryType = list
this.getList()
}
},
openDetails(scope){
console.log(scope.row)
this.drawer = true
},
handleSizeChange(val) {
this.msg.pageSize = val
this.getList();
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
handleClose(done) {
done();
},
getList: function (){
this.tableData = []
this.loading = true
this.apipost('/api/Customer/GetCustomerPage', this.msg, res=>{
if (res.data.resultCode == 1) {
this.tableData = res.data.data.pageData
this.loading = false
this.tableData = res.data.data.pageData;
this.total = res.data.data.count;
this.loading = false;
}
})
},
......@@ -476,7 +868,9 @@ export default {
}
},
handleSelectionChange(val) {
this.multipleSelection = val;
this.multipleSelection = val.map(x=>
x.CustomerId
)
}
}
};
......
......@@ -47,13 +47,11 @@
height: 8px;
}
*::-webkit-scrollbar-thumb {
/* border-radius: 4px; */
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
background: #555;
}
*::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
/* border-radius: 4px; */
background: #555;
}
</style>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment