parent
ef4fcaa691
commit
3e93145e0b
@ -0,0 +1,389 @@
|
|||||||
|
<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
|
||||||
|
placeholder="关联板块"
|
||||||
|
multiple
|
||||||
|
collapse-tags
|
||||||
|
v-model="select.product_type_id"
|
||||||
|
size="small"
|
||||||
|
style="min-width: 200px; 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="(total = 0),(select.page = 1), getCustomers()"
|
||||||
|
>查询</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>
|
||||||
|
</template>
|
||||||
|
</xy-table>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getList, destroy, save } from "@/api/customer";
|
||||||
|
import { getparameter } from "@/api/system/dictionary";
|
||||||
|
import { getList as getUnit } from "@/api/payUnit";
|
||||||
|
import { getList as getTypes } from "@/api/productType";
|
||||||
|
import { deepCopy, getBirth, getAgeByIdcard } from "@/utils";
|
||||||
|
import { getAuthAreas, getAuthTypes } from "@/utils/auth";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
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>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "姓名",
|
||||||
|
width: "180",
|
||||||
|
customFn: (row) => {
|
||||||
|
let getColor = () => {
|
||||||
|
if (row.near_age == 2) {
|
||||||
|
return "rgb(232,102,33)";
|
||||||
|
}
|
||||||
|
if (row.near_age == 1) {
|
||||||
|
return "yellow";
|
||||||
|
}
|
||||||
|
};
|
||||||
|
return <span style={{ color: getColor() }}>{row.name}</span>;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "性别",
|
||||||
|
prop: "sex",
|
||||||
|
width: 100,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
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: {
|
||||||
|
save,
|
||||||
|
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() {
|
||||||
|
let copySelect = deepCopy(this.select);
|
||||||
|
copySelect.product_type_id = copySelect?.product_type_id.toString();
|
||||||
|
const res = await getList(copySelect);
|
||||||
|
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() {
|
||||||
|
this.types = getAuthTypes(this);
|
||||||
|
this.select.product_type_id = this.types.map((item) => item.id);
|
||||||
|
},
|
||||||
|
|
||||||
|
async getCity() {
|
||||||
|
let authAreaIds = getAuthAreas(this).map((item) => item.id);
|
||||||
|
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
|
||||||
|
);
|
||||||
|
let resArea = [];
|
||||||
|
area?.detail.forEach((item) => {
|
||||||
|
if (authAreaIds.indexOf(item.id) !== -1) {
|
||||||
|
resArea.push(item);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
city.detail[i].children = resArea;
|
||||||
|
|
||||||
|
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();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getDisabilityLevel();
|
||||||
|
this.getLevelTypes();
|
||||||
|
this.getCity();
|
||||||
|
this.getAccounts();
|
||||||
|
},
|
||||||
|
async mounted() {
|
||||||
|
await this.getTypes();
|
||||||
|
await this.getCustomers();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
::v-deep .ivu-table-header thead tr th {
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue