parent
12d9fcf76b
commit
d8b46147bd
@ -1,331 +1,336 @@
|
||||
<template>
|
||||
<div>
|
||||
<!--查询-->
|
||||
<div>
|
||||
<div ref="lxHeader">
|
||||
<lx-header icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="客户列表">
|
||||
<div slot="content"></div>
|
||||
|
||||
<slot>
|
||||
<div>
|
||||
<Input placeholder="关键字搜索" v-model="select.keyword" style="width: 200px; margin-right: 10px" />
|
||||
|
||||
<Button style="margin-left: 10px" type="primary" @click="select.page = 1,getCustomers()">查询</Button>
|
||||
<Button style="margin-left: 10px" type="primary"
|
||||
@click="$refs['addCustomer'].type = 'add',$refs['addCustomer'].isShow = true">录入客户
|
||||
</Button>
|
||||
</div>
|
||||
</slot>
|
||||
</lx-header>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<xy-table ref="table" :total="total" :list="list" :table-item="tableItem" :default-expand-all="false"
|
||||
@pageSizeChange="e => {select.page_size = e;select.page=1;getCustomers()}"
|
||||
@pageIndexChange="e => {select.page = e;getCustomers()}">
|
||||
<template v-slot:btns>
|
||||
<el-table-column fixed="right" width="166" header-align="center" align="center" label="操作">
|
||||
<template v-slot:default="scope">
|
||||
<Poptip transfer confirm title="确认要删除?" @on-ok="destroy(scope.row)">
|
||||
<Button size="small" type="error" ghost style="margin-right: 6px">删除</Button>
|
||||
</Poptip>
|
||||
<Button size="small" ghost type="primary" @click="editor(scope.row)" style="margin-right: 6px">编辑</Button>
|
||||
<Button size="small" type="primary"
|
||||
@click="$refs['addOrder'].customerIdcard = scope.row.idcard,$refs['addOrder'].isShow = true,$refs['addOrder'].form.customer_id = scope.row.id">录入</Button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</xy-table>
|
||||
|
||||
<addOrder ref="addOrder" :types="types" :accounts="accounts" @refresh="getCustomers"></addOrder>
|
||||
<add-customer ref="addCustomer" :level-types="levelTypes" :types="types" :accounts="accounts" :cities="cities"
|
||||
:disability-level="disabilityLevel" @refresh="getCustomers"></add-customer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getList,
|
||||
destroy
|
||||
} from '@/api/customer'
|
||||
import {
|
||||
getparameter
|
||||
} from '@/api/system/dictionary'
|
||||
import {
|
||||
getList as getUnit
|
||||
} from "@/api/payUnit";
|
||||
import {
|
||||
getList as getTypes
|
||||
} from '@/api/productType'
|
||||
|
||||
import addCustomer from "@/views/customer/component/addCustomer";
|
||||
import addOrder from './component/addOrder'
|
||||
export default {
|
||||
components: {
|
||||
addCustomer,
|
||||
addOrder
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
select: {
|
||||
page: 1,
|
||||
page_size: 10,
|
||||
keyword: ''
|
||||
},
|
||||
disabilityLevel: [],
|
||||
levelTypes: [],
|
||||
cities: [],
|
||||
accounts: [],
|
||||
types: [],
|
||||
|
||||
total: 0,
|
||||
list: [],
|
||||
tableItem: [{
|
||||
type: 'expand',
|
||||
expandFn: (props) => {
|
||||
return ( <
|
||||
Table style = {
|
||||
{
|
||||
'margin': '0 166px 0 40px'
|
||||
}
|
||||
}
|
||||
width = {
|
||||
1370
|
||||
}
|
||||
stripe = {
|
||||
true
|
||||
}
|
||||
border = {
|
||||
true
|
||||
}
|
||||
size = "small"
|
||||
columns = {
|
||||
[{
|
||||
title: '订单编号',
|
||||
key: 'no',
|
||||
width: 220,
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '订单产品',
|
||||
width: 200,
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
return h('div', params.row.product.name)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
width: 270,
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
return h('div', [
|
||||
h('span', params.row.start_date),
|
||||
h('span', ' ~ '),
|
||||
h('span', params.row.end_date)
|
||||
])
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '单次价格',
|
||||
width: 180,
|
||||
align: 'right',
|
||||
key: 'unit_price'
|
||||
},
|
||||
{
|
||||
title: '总计时长',
|
||||
width: 160,
|
||||
align: 'center',
|
||||
key: 'total_time'
|
||||
},
|
||||
{
|
||||
title: '总计金额',
|
||||
width: 190,
|
||||
align: 'right',
|
||||
key: 'total_money'
|
||||
},
|
||||
{
|
||||
title: '执行状态',
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
let statusName = new Map([
|
||||
[0, '未开始'],
|
||||
[1, '进行中'],
|
||||
[2, '已完成'],
|
||||
])
|
||||
let statusColor = new Map([
|
||||
[0, 'blue'],
|
||||
[1, 'red'],
|
||||
[2, 'green'],
|
||||
])
|
||||
return h('div', {
|
||||
style: {
|
||||
color: statusColor.get(params.row.status)
|
||||
}
|
||||
}, statusName.get(params.row.status))
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
data = {
|
||||
props?.row.orders
|
||||
} >
|
||||
<
|
||||
/Table>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
label: "姓名",
|
||||
width: "180",
|
||||
},
|
||||
{
|
||||
label: '订单产品',
|
||||
width: 220,
|
||||
align: 'left',
|
||||
customFn: (row) => {
|
||||
return ( <
|
||||
div > {
|
||||
row.orders.map(item => {
|
||||
return item.product.name
|
||||
}).toString()
|
||||
} <
|
||||
/div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "idcard",
|
||||
label: "身份证号",
|
||||
width: "220"
|
||||
},
|
||||
{
|
||||
prop: "phone",
|
||||
label: "手机号",
|
||||
width: "160"
|
||||
},
|
||||
{
|
||||
label: "委托人",
|
||||
width: "180",
|
||||
prop: 'contact_name'
|
||||
},
|
||||
{
|
||||
label: "委托人电话",
|
||||
width: "160",
|
||||
prop: 'contact_phone'
|
||||
},
|
||||
{
|
||||
prop: 'idcard_address',
|
||||
label: '户籍地址',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
label: '默认上门地址',
|
||||
minWidth: 300,
|
||||
align: 'left',
|
||||
customFn: (row) => {
|
||||
return ( <
|
||||
div > {
|
||||
row.customer_address.filter(item => {
|
||||
return item.default === 1
|
||||
})[0]?.address || row.customer_address[0]?.address || '无'
|
||||
} <
|
||||
/div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '上门地址数',
|
||||
prop: 'customer_address_count',
|
||||
width: 140
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getLevelTypes() {
|
||||
const types = await getparameter({
|
||||
number: 'disabilityType'
|
||||
}, false)
|
||||
this.levelTypes = types.detail
|
||||
},
|
||||
|
||||
async getDisabilityLevel() {
|
||||
const levels = await getparameter({
|
||||
number: 'disabilityLevel'
|
||||
}, false)
|
||||
this.disabilityLevel = levels.detail
|
||||
},
|
||||
|
||||
async getCustomers() {
|
||||
const res = await getList(this.select)
|
||||
this.list = res.data.data
|
||||
this.total = res.data.total
|
||||
},
|
||||
|
||||
async getAccounts() {
|
||||
const res = await getUnit({
|
||||
page: 1,
|
||||
page_size: 9999
|
||||
}, false)
|
||||
this.accounts = res.data
|
||||
},
|
||||
|
||||
async getTypes() {
|
||||
const res = await getTypes({
|
||||
page: 1,
|
||||
page_size: 9999
|
||||
}, false)
|
||||
this.types = res.data
|
||||
},
|
||||
|
||||
async getCity() {
|
||||
let city = await getparameter({
|
||||
number: 'city'
|
||||
}, false)
|
||||
for (let i = 0; i < city.detail.length; i++) {
|
||||
let area = await getparameter({
|
||||
pid: city.detail[i].id
|
||||
}, false)
|
||||
city.detail[i].children = area.detail
|
||||
|
||||
for (let j = 0; j < area.detail.length; j++) {
|
||||
let street = await getparameter({
|
||||
pid: area.detail[j].id
|
||||
}, false)
|
||||
area.detail[j].children = street.detail
|
||||
}
|
||||
}
|
||||
|
||||
this.cities = city.detail
|
||||
},
|
||||
|
||||
editor(row) {
|
||||
this.$refs['addCustomer'].id = row.id
|
||||
this.$refs['addCustomer'].type = 'editor'
|
||||
this.$refs['addCustomer'].isShow = true
|
||||
},
|
||||
destroy(row) {
|
||||
destroy(row.id).then(res => {
|
||||
this.$successMessage('destroy', '客户')
|
||||
this.getCustomers()
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getDisabilityLevel()
|
||||
this.getLevelTypes()
|
||||
this.getCustomers()
|
||||
this.getCity()
|
||||
this.getAccounts()
|
||||
this.getTypes()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .ivu-table-header thead tr th {
|
||||
text-align: center !important;
|
||||
}
|
||||
<template>
|
||||
<div>
|
||||
<!--查询-->
|
||||
<div>
|
||||
<div ref="lxHeader">
|
||||
<lx-header icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="客户列表">
|
||||
<div slot="content"></div>
|
||||
|
||||
<slot>
|
||||
<div>
|
||||
<el-select v-model="select.product_type_id" size="small" style="margin-right: 10px;">
|
||||
<el-option v-for="(item,index) in types" :key="item.id" :value="item.id" :label="item.name" ></el-option>
|
||||
</el-select>
|
||||
|
||||
<el-input size="small" placeholder="关键字搜索" v-model="select.keyword" style="width: 200px; margin-right: 10px" />
|
||||
|
||||
<Button style="margin-left: 10px" type="primary" @click="select.page = 1,getCustomers()">查询</Button>
|
||||
<Button style="margin-left: 10px" type="primary"
|
||||
@click="$refs['addCustomer'].type = 'add',$refs['addCustomer'].isShow = true">新增客户
|
||||
</Button>
|
||||
</div>
|
||||
</slot>
|
||||
</lx-header>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<xy-table ref="table" :total="total" :list="list" :table-item="tableItem" :default-expand-all="false"
|
||||
@pageSizeChange="e => {select.page_size = e;select.page=1;getCustomers()}"
|
||||
@pageIndexChange="e => {select.page = e;getCustomers()}">
|
||||
<template v-slot:btns>
|
||||
<el-table-column fixed="right" width="166" header-align="center" align="center" label="操作">
|
||||
<template v-slot:default="scope">
|
||||
<Poptip transfer confirm title="确认要删除?" @on-ok="destroy(scope.row)">
|
||||
<Button size="small" type="error" ghost style="margin-right: 6px">删除</Button>
|
||||
</Poptip>
|
||||
<Button size="small" ghost type="primary" @click="editor(scope.row)" style="margin-right: 6px">编辑</Button>
|
||||
<Button size="small" type="primary"
|
||||
@click="$refs['addOrder'].customerIdcard = scope.row.idcard,$refs['addOrder'].isShow = true,$refs['addOrder'].form.customer_id = scope.row.id">录入</Button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</xy-table>
|
||||
|
||||
<addOrder ref="addOrder" :types="types" :accounts="accounts" @refresh="getCustomers"></addOrder>
|
||||
<add-customer ref="addCustomer" :level-types="levelTypes" :types="types" :accounts="accounts" :cities="cities"
|
||||
:disability-level="disabilityLevel" @refresh="getCustomers"></add-customer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getList,
|
||||
destroy
|
||||
} from '@/api/customer'
|
||||
import {
|
||||
getparameter
|
||||
} from '@/api/system/dictionary'
|
||||
import {
|
||||
getList as getUnit
|
||||
} from "@/api/payUnit";
|
||||
import {
|
||||
getList as getTypes
|
||||
} from '@/api/productType'
|
||||
|
||||
import addCustomer from "@/views/customer/component/addCustomer";
|
||||
import addOrder from './component/addOrder'
|
||||
export default {
|
||||
components: {
|
||||
addCustomer,
|
||||
addOrder
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
select: {
|
||||
product_type_id:'',
|
||||
page: 1,
|
||||
page_size: 10,
|
||||
keyword: ''
|
||||
},
|
||||
disabilityLevel: [],
|
||||
levelTypes: [],
|
||||
cities: [],
|
||||
accounts: [],
|
||||
types: [],
|
||||
|
||||
total: 0,
|
||||
list: [],
|
||||
tableItem: [{
|
||||
type: 'expand',
|
||||
expandFn: (props) => {
|
||||
return ( <
|
||||
Table style = {
|
||||
{
|
||||
'margin': '0 166px 0 40px'
|
||||
}
|
||||
}
|
||||
width = {
|
||||
1370
|
||||
}
|
||||
stripe = {
|
||||
true
|
||||
}
|
||||
border = {
|
||||
true
|
||||
}
|
||||
size = "small"
|
||||
columns = {
|
||||
[{
|
||||
title: '订单编号',
|
||||
key: 'no',
|
||||
width: 220,
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '订单产品',
|
||||
width: 200,
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
return h('div', params.row.product.name)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
width: 270,
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
return h('div', [
|
||||
h('span', params.row.start_date),
|
||||
h('span', ' ~ '),
|
||||
h('span', params.row.end_date)
|
||||
])
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '单次价格',
|
||||
width: 180,
|
||||
align: 'right',
|
||||
key: 'unit_price'
|
||||
},
|
||||
{
|
||||
title: '总计时长',
|
||||
width: 160,
|
||||
align: 'center',
|
||||
key: 'total_time'
|
||||
},
|
||||
{
|
||||
title: '总计金额',
|
||||
width: 190,
|
||||
align: 'right',
|
||||
key: 'total_money'
|
||||
},
|
||||
{
|
||||
title: '执行状态',
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
let statusName = new Map([
|
||||
[0, '未开始'],
|
||||
[1, '进行中'],
|
||||
[2, '已完成'],
|
||||
])
|
||||
let statusColor = new Map([
|
||||
[0, 'blue'],
|
||||
[1, 'red'],
|
||||
[2, 'green'],
|
||||
])
|
||||
return h('div', {
|
||||
style: {
|
||||
color: statusColor.get(params.row.status)
|
||||
}
|
||||
}, statusName.get(params.row.status))
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
data = {
|
||||
props?.row.orders
|
||||
} >
|
||||
<
|
||||
/Table>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
label: "姓名",
|
||||
width: "180",
|
||||
},
|
||||
{
|
||||
label: '订单产品',
|
||||
width: 220,
|
||||
align: 'left',
|
||||
customFn: (row) => {
|
||||
return ( <
|
||||
div > {
|
||||
row.orders.map(item => {
|
||||
return item.product.name
|
||||
}).toString()
|
||||
} <
|
||||
/div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: "idcard",
|
||||
label: "身份证号",
|
||||
width: "220"
|
||||
},
|
||||
{
|
||||
prop: "phone",
|
||||
label: "手机号",
|
||||
width: "160"
|
||||
},
|
||||
{
|
||||
label: "委托人",
|
||||
width: "180",
|
||||
prop: 'contact_name'
|
||||
},
|
||||
{
|
||||
label: "委托人电话",
|
||||
width: "160",
|
||||
prop: 'contact_phone'
|
||||
},
|
||||
{
|
||||
prop: 'idcard_address',
|
||||
label: '户籍地址',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
label: '默认上门地址',
|
||||
minWidth: 300,
|
||||
align: 'left',
|
||||
customFn: (row) => {
|
||||
return ( <
|
||||
div > {
|
||||
row.customer_address.filter(item => {
|
||||
return item.default === 1
|
||||
})[0]?.address || row.customer_address[0]?.address || '无'
|
||||
} <
|
||||
/div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '上门地址数',
|
||||
prop: 'customer_address_count',
|
||||
width: 140
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getLevelTypes() {
|
||||
const types = await getparameter({
|
||||
number: 'disabilityType'
|
||||
}, false)
|
||||
this.levelTypes = types.detail
|
||||
},
|
||||
|
||||
async getDisabilityLevel() {
|
||||
const levels = await getparameter({
|
||||
number: 'disabilityLevel'
|
||||
}, false)
|
||||
this.disabilityLevel = levels.detail
|
||||
},
|
||||
|
||||
async getCustomers() {
|
||||
const res = await getList(this.select)
|
||||
this.list = res.data.data
|
||||
this.total = res.data.total
|
||||
},
|
||||
|
||||
async getAccounts() {
|
||||
const res = await getUnit({
|
||||
page: 1,
|
||||
page_size: 9999
|
||||
}, false)
|
||||
this.accounts = res.data
|
||||
},
|
||||
|
||||
async getTypes() {
|
||||
const res = await getTypes({
|
||||
page: 1,
|
||||
page_size: 9999
|
||||
}, false)
|
||||
this.types = res.data
|
||||
},
|
||||
|
||||
async getCity() {
|
||||
let city = await getparameter({
|
||||
number: 'city'
|
||||
}, false)
|
||||
for (let i = 0; i < city.detail.length; i++) {
|
||||
let area = await getparameter({
|
||||
pid: city.detail[i].id
|
||||
}, false)
|
||||
city.detail[i].children = area.detail
|
||||
|
||||
for (let j = 0; j < area.detail.length; j++) {
|
||||
let street = await getparameter({
|
||||
pid: area.detail[j].id
|
||||
}, false)
|
||||
area.detail[j].children = street.detail
|
||||
}
|
||||
}
|
||||
|
||||
this.cities = city.detail
|
||||
},
|
||||
|
||||
editor(row) {
|
||||
this.$refs['addCustomer'].id = row.id
|
||||
this.$refs['addCustomer'].type = 'editor'
|
||||
this.$refs['addCustomer'].isShow = true
|
||||
},
|
||||
destroy(row) {
|
||||
destroy(row.id).then(res => {
|
||||
this.$successMessage('destroy', '客户')
|
||||
this.getCustomers()
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getDisabilityLevel()
|
||||
this.getLevelTypes()
|
||||
this.getCustomers()
|
||||
this.getCity()
|
||||
this.getAccounts()
|
||||
this.getTypes()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .ivu-table-header thead tr th {
|
||||
text-align: center !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in new issue