<template>
|
<GlobalWindow title="选择客户" width="80%" :withFooter="false" @close="close" :visible.sync="isShowMemberList">
|
<div>
|
<div class="df_ac mb20">
|
<el-input v-model="modalSearchValue" placeholder="请输入客户名称" class="w400" @keyup.enter.native="queryList">
|
</el-input>
|
<el-button class="ml10" type="primary" @click="queryList()">查询</el-button>
|
<el-button class="ml10" @click="clear()">重置</el-button>
|
</div>
|
<el-table ref="table" v-loading="listLoading" :data="list" element-loading-text="Loading" border fit
|
:header-row-class-name="'table-header'" class="doumee-element-table doumee-element-tableb"
|
@row-click="rowClick">
|
<el-table-column align="center" label="客户类型" show-overflow-tooltip min-width="80">
|
<template slot-scope="{row}">
|
<span v-if="row.type === 0">个人</span>
|
<span v-if="row.type === 1">企业</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="客户名称" show-overflow-tooltip prop="name" min-width="80" />
|
<el-table-column align="center" label="联系人" show-overflow-tooltip prop="memberName" min-width="80" />
|
<el-table-column label="联系电话" prop="memberPhone" min-width="100" align="center" />
|
<el-table-column label="统一信用代码" prop="creditCard" min-width="120" align="center">
|
<template slot-scope="{row}">
|
<div v-if="row.type === 1">
|
<span v-if="row.fpType === 0">增值税普通发票</span>
|
<span v-else-if="row.fpType === 1">增值税专用发票</span>
|
<span v-else>-</span>
|
</div>
|
<div v-else>-</div>
|
</template>
|
</el-table-column>
|
<el-table-column label="营业期限" prop="validity" min-width="100" align="center">
|
<template slot-scope="{row}">
|
<div v-if="row.type === 1">
|
<span>{{row.validity || '-'}}</span>
|
</div>
|
<div v-else>-</div>
|
</template>
|
</el-table-column>
|
<el-table-column label="默认发票类型" min-width="100" align="center">
|
<template slot-scope="{row}">
|
<div v-if="row.type === 1">
|
<span v-if="row.fpType === 0">增值税普通发票</span>
|
<span v-else-if="row.fpType === 1">增值税专用发票</span>
|
<span v-else>-</span>
|
</div>
|
<div v-else>-</div>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" min-width="100" align="center">
|
<template slot-scope="{row}">
|
<span class="primaryColor cu" @click="selectItem(row)">选择</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
<Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" />
|
</div>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import { fetchList } from '@/api/customer'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import Pagination from '@/components/common/Pagination'
|
export default {
|
components: {
|
Pagination,
|
GlobalWindow
|
},
|
props: {
|
isShowChooseBtn: {
|
type: Boolean,
|
default: () => true
|
}
|
},
|
data () {
|
return {
|
isShowMemberList: false,
|
modalSearchValue: '',
|
list: [],
|
pagination: {
|
pageSize: 10,
|
page: 1,
|
total: 0
|
},
|
listLoading: false
|
}
|
},
|
methods: {
|
open () {
|
this.modalSearchValue = ''
|
this.filters = {}
|
this.pagination.page = 1
|
this.pagination.pageSize = 10
|
this.isShowMemberList = true
|
this.getList()
|
},
|
getList () {
|
const { pagination, modalSearchValue } = this
|
this.listLoading = true
|
fetchList({
|
capacity: pagination.pageSize,
|
page: pagination.page,
|
model: {
|
name: modalSearchValue
|
}
|
}).then((res) => {
|
this.listLoading = false
|
this.list = res.records
|
this.pagination.total = res.total || 0
|
}, () => {
|
this.listLoading = false
|
})
|
},
|
selectItem (row) {
|
this.$emit('select', row)
|
this.isShowMemberList = false
|
},
|
queryList () {
|
this.pagination.page = 1
|
this.getList()
|
},
|
currentChange (val) {
|
this.pagination.page = val
|
this.getList()
|
},
|
clear () {
|
this.filters = {}
|
this.pagination.pageSize = 10
|
this.pagination.page = 1
|
this.getList()
|
},
|
handleSizeChange (capacity) {
|
this.pagination.pageSize = capacity
|
this.getList()
|
},
|
close () {
|
this.isShowMemberList = false
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.member_search_wrap {
|
display: flex;
|
|
::v-deep .el-input__validateIcon {
|
display: none !important;
|
}
|
}
|
</style>
|
