From 3e93145e0b5093fec61d98826aec6698204d6c39 Mon Sep 17 00:00:00 2001
From: xy <271556543@qq.com>
Date: Wed, 12 Apr 2023 16:19:50 +0800
Subject: [PATCH] 2023-4-12

---
 src/views/customer/customer.vue    |   5 +
 src/views/customer/seeCustomer.vue | 389 +++++++++++++++++++++++++++++
 2 files changed, 394 insertions(+)
 create mode 100644 src/views/customer/seeCustomer.vue

diff --git a/src/views/customer/customer.vue b/src/views/customer/customer.vue
index 4fbece6..3b318c2 100644
--- a/src/views/customer/customer.vue
+++ b/src/views/customer/customer.vue
@@ -293,6 +293,11 @@ export default {
             return <span style={{ color: getColor() }}>{row.name}</span>;
           },
         },
+        {
+          label: "性别",
+          prop: "sex",
+          width: 100,
+        },
         {
           label: "订单产品",
           width: 220,
diff --git a/src/views/customer/seeCustomer.vue b/src/views/customer/seeCustomer.vue
new file mode 100644
index 0000000..4f2b8ba
--- /dev/null
+++ b/src/views/customer/seeCustomer.vue
@@ -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>