<template>
|
<div class="check-container">
|
<div class="condition-content">
|
<el-input placeholder="请输入客户名称" v-model="checkName" @keyup.enter.native="getList" v-focus >
|
<template slot="prepend">按客户名称</template>
|
</el-input>
|
<el-button
|
type="primary"
|
class="condition-button"
|
@click="getList">查询</el-button>
|
</div>
|
<div class="table-content" v-show='list.length>0'>
|
<el-table
|
v-loading="loading"
|
id="crm-table"
|
:data="list"
|
:cell-style="cellStyle"
|
:row-class-name="tableRowClassName"
|
:cell-class-name="tableCellClassName"
|
height="400"
|
border
|
highlight-current-row
|
style="width: 100%"
|
@row-click="handleRowClick">
|
<el-table-column
|
v-for="(item, index) in fieldList"
|
:key="index"
|
:prop="item.field"
|
:label="item.name"
|
show-overflow-tooltip>
|
<template
|
slot="header"
|
slot-scope="scope">
|
<div class="table-head-name">{{ scope.column.label }}</div>
|
</template>
|
<!--<template slot-scope="scope">
|
<span v-if="scope.row.index === rowIndex && scope.column.label==='销售负责人'"
|
class='inputnum'>
|
<el-input v-model="scope.row[item.field]"
|
ref='editInput'
|
type="number"
|
size="mini"
|
@blur="inputBlur(scope)" />
|
</span>
|
<span class="inputnum" v-else>{{ scope.row[item.field] }}</span>
|
</template>-->
|
</el-table-column>
|
<!--<el-table-column
|
prop="operation"
|
label="操作"
|
width='150'>
|
<template slot-scope="scope">
|
<el-button type="text" size="small" @click='editCustomer(scope.row)'>编辑</el-button>
|
<el-button type="text" size="small" @click='deleteCustomer(scope.row.Id)'>删除</el-button>
|
</template>
|
</el-table-column>-->
|
</el-table>
|
<!--<div class="p-contianer" v-show='total>0'>
|
<el-pagination
|
:current-page="currentPage"
|
:page-sizes="pageSizes"
|
:page-size.sync="pageSize"
|
:total="total"
|
class="p-bar"
|
layout="total, sizes, prev, pager, next, jumper"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"/>
|
</div>-->
|
</div>
|
<!-- 编辑页面 -->
|
<c-r-m-create-view
|
v-if="isCreate"
|
:action="{type: 'update', id: editData.Id, data: editData}"
|
crm-type="customer"
|
@save-success="listHeadHandle"
|
@hiden-view="isCreate=false"/>
|
<!-- 相关详情页面 -->
|
<!--<c-r-m-all-detail
|
:visible.sync="showDview"
|
:crm-type="rowType"
|
:id="rowID"
|
:listener-ids="['duplicate-check-container']"/>-->
|
</div>
|
</template>
|
<script type="text/javascript">
|
import CRMCreateView from '../CRMCreateView'
|
import { CustomerRepeatCheck } from '@/api/common'
|
import { DeleteCustomer } from '@/api/customermanagement/customerManage'
|
// import { GetCustomerPageList } from '@/api/customermanagement/customerManage'
|
// import { GetSalesChanceList } from '@/api/customermanagement/business'
|
// import { GetContacterList } from '@/api/customermanagement/contacts'
|
|
import { XhInput } from '@/components/CreateCom'
|
import CRMAllDetail from '@/views/clients/components/CRMAllDetail'
|
|
export default {
|
name: 'CheckContent', // 验重内容
|
|
components: {
|
XhInput,
|
CRMAllDetail,
|
CRMCreateView
|
},
|
|
props: {
|
type: {
|
required: true,
|
type: String
|
}
|
},
|
|
data () {
|
return {
|
checkName: '',
|
total: 0,
|
currentPage: 1,
|
pageSize: 10,
|
pageSizes: [10, 30, 60, 100],
|
loading: false,
|
list: [],
|
|
/** 控制详情展示 */
|
rowID: '', // 行信息
|
rowType: '', // 详情类型
|
showDview: false,
|
rowIndex: -1, // 行索引
|
columnIndex: -1, // 列索引
|
editData: {},
|
isCreate: false
|
}
|
},
|
|
computed: {
|
// 表头信息
|
fieldList () {
|
return [
|
{ field: 'CustomerNumber', name: '客户编号' },
|
{ field: 'CustomerName', name: '客户名称' },
|
// { field: 'ContacterName', name: '联系人' },
|
// { field: 'ContacterMobile', name: '联系方式' },
|
{ field: 'ProvinceCode', name: '所属地区' },
|
{ field: 'OwerUserName', name: '销售负责人' }
|
]
|
}
|
},
|
|
watch: {},
|
|
mounted () {},
|
destroyed () {},
|
|
methods: {
|
handleSizeChange (newSize) {
|
this.pageSize = newSize
|
this.getList()
|
},
|
handleCurrentChange (newPage) {
|
this.currentPage = newPage
|
this.getList()
|
},
|
/** 获取列表数据 */
|
getList () {
|
const params = {
|
'Name': this.checkName
|
}
|
let pass = false
|
if (this.checkName === '') {
|
pass = false
|
} else {
|
pass = true
|
}
|
|
if (pass) {
|
this.loading = true
|
CustomerRepeatCheck(params)
|
.then(res => {
|
this.list = res.data.Result
|
this.total = res.data.Result.length
|
|
this.loading = false
|
})
|
.catch(() => {
|
this.loading = false
|
})
|
} else {
|
this.$message.error('查询条件不能为空')
|
}
|
},
|
// 把每一行的索引加到行数据中
|
tableRowClassName ({ row, rowIndex }) {
|
row.index = rowIndex
|
},
|
// 把每一列的索引加到列数据中
|
tableCellClassName ({ column, columnIndex }) {
|
column.index = columnIndex
|
},
|
tabClick (row, column, cell, event) {
|
// console.log(row, '单条数据', column, '列信息', cell, 'td实例', event)
|
// this.rowIndex = row.index
|
// this.columnIndex = column.index
|
},
|
// 输入框失去焦点事件（初始化中间变量）
|
inputBlur (scope) {
|
this.rowIndex = -1
|
this.columnIndex = -1
|
},
|
editCustomer (row) {
|
console.log(row)
|
this.rowIndex = row.index
|
this.editData = row
|
this.isCreate = true
|
},
|
listHeadHandle (data) {
|
console.log('cvvvvvvvvvvvvv', data)
|
this.currentPage = 1
|
this.getList()
|
},
|
deleteCustomer (id) {
|
this.$confirm('确定删除?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
.then(() => {
|
DeleteCustomer([{'Id': id}]).then(res => {
|
if (res.data.ErrorCode === 200) {
|
this.$message.success(res.data.Message)
|
this.getList()
|
} else {
|
this.$message.error(res.data.Message)
|
}
|
})
|
})
|
.catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消删除'
|
})
|
})
|
},
|
// 获取左边padding
|
getPaddingLeft (item, index) {
|
return index % 2 === 0 ? '0' : '30px'
|
},
|
|
// 获取左边padding
|
getPaddingRight (item, index) {
|
return index % 2 === 0 ? '30px' : '0'
|
},
|
|
/**
|
* 查看详情
|
*/
|
handleRowClick (row, column, event) {
|
let type = this.type
|
if (column.property === 'CustomerName' && this.type === 'contacts') {
|
type = 'customer'
|
}
|
this.rowID = row[this.type + 'Id']
|
this.rowType = type
|
this.showDview = true
|
},
|
|
/**
|
* 通过回调控制style
|
*/
|
cellStyle ({ row, column, rowIndex, columnIndex }) {
|
if (
|
column.property === 'name' ||
|
// column.property === 'CustomerName' ||
|
column.property === 'leadsName'
|
) {
|
return { color: '#4D88FF', cursor: 'pointer' }
|
} else {
|
return ''
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import '../../styles/table.scss';
|
.check-container {
|
height: 100%;
|
overflow-y: auto;
|
padding: 0 30px;
|
}
|
|
// 提示标志
|
.wukong-help_tips {
|
color: #999;
|
font-size: 12px;
|
}
|
|
.wukong-help_tips:hover {
|
color: #ff6a00;
|
}
|
|
// 条件
|
.condition-content {
|
display:flex;
|
align-items: center;
|
justify-content: center;
|
/deep/ .el-input-group{
|
height: 36px;
|
}
|
/deep/ .el-input-group--prepend .el-input__inner{
|
height: 36px;
|
}
|
.condition-item {
|
flex: 0 0 50%;
|
flex-shrink: 0;
|
/deep/ .el-form-item__label {
|
padding: 10px 0 0 0 !important;
|
line-height: 30px;
|
font-size: 13px;
|
}
|
}
|
.condition-button {
|
margin-left: 15px;
|
border-radius: 4px;
|
width: 82px;
|
height: 36px;
|
}
|
}
|
|
.el-form-item {
|
margin-bottom: 0px;
|
}
|
|
// 表内容
|
.table-content {
|
margin-top: 20px;
|
}
|
</style>
|
