fix:人员统计添加电销

src/pages/personnelManage/sales.vue

@@ -0,0 +1,508 @@
+<template>
+  <div class="back-line-main">
+    <div class="back-line-header">
+      <div class="back-line-header-title">
+        <h2>电销人员详情</h2>
+        <div>
+          <span>时间筛选</span>
+          <a-range-picker
+            v-model="formState.time"
+            @change="timeChange"
+            valueFormat="YYYY-MM-DD"
+          >
+            <a-icon slot="suffixIcon" type="calendar" />
+          </a-range-picker>
+          <a-radio-group
+            default-value="1"
+            button-style="solid"
+            v-model="formState.days"
+          >
+            <a-radio-button
+              :value="1"
+              @click="
+                (formState.time = []),
+                  (formState.createtimeStart = ''),
+                  (formState.createtimeEnd = '')
+              "
+            >
+              当天
+            </a-radio-button>
+            <a-radio-button
+              :value="2"
+              @click="
+                (formState.time = []),
+                  (formState.createtimeStart = ''),
+                  (formState.createtimeEnd = '')
+              "
+            >
+              近7天
+            </a-radio-button>
+            <a-radio-button
+              :value="3"
+              @click="
+                (formState.time = []),
+                  (formState.createtimeStart = ''),
+                  (formState.createtimeEnd = '')
+              "
+            >
+              近30天
+            </a-radio-button>
+          </a-radio-group>
+        </div>
+      </div>
+      <fromRow
+        :formState="formState"
+        :className="''"
+        :search="false"
+        @getList="getList"
+      ></fromRow>
+      <a-form layout="inline" :model="formState">
+        <a-form-item label="姓名" :labelCol="{ span: 5 }" :colon="false">
+          <a-input
+            placeholder="请输入姓名"
+            v-model="formState.name"
+            allowClear
+          ></a-input>
+        </a-form-item>
+        <a-form-item label="工号" :labelCol="{ span: 5 }" :colon="false">
+          <a-input
+            placeholder="请输入工号"
+            v-model="formState.userCode"
+            allowClear
+          ></a-input>
+        </a-form-item>
+        <a-form-item label="手机号" :labelCol="{ span: 5 }" :colon="false">
+          <a-input
+            placeholder="请输入手机号"
+            v-model="formState.phoneNumber"
+            allowClear
+          ></a-input>
+        </a-form-item>
+        <a-form-item label="管理人" :labelCol="{ span: 5 }" :colon="false">
+          <a-select
+            style="width: 300px"
+            placeholder="请选择"
+            v-model="formState.leaderId"
+            allowClear
+            show-search
+            :filter-option="filterOption"
+          >
+            <a-select-option
+              v-for="item in manageList"
+              :key="item.id"
+              :value="item.id"
+            >
+              {{ item.name }}
+            </a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item label="是否出单" :labelCol="{ span: 7 }" :colon="false">
+          <a-select
+            placeholder="请选择"
+            v-model="formState.outThere"
+            allowClear
+            show-search
+            :filter-option="filterOption"
+          >
+            <a-select-option :value="1"> 出单 </a-select-option>
+            <a-select-option :value="0"> 不出单 </a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item
+          label="             "
+          :labelCol="{ span: 5 }"
+          :colon="false"
+          class="form-item-search"
+        >
+          <a-button type="primary" @click="getList">查询</a-button>
+          <a-button type="primary" style="margin-left: 10px" @click="exportList"
+            >导出</a-button
+          >
+        </a-form-item>
+      </a-form>
+    </div>
+    <div class="list">
+      <a-spin :spinning="loading">
+        <a-row class="personnel-message">
+          <a-col v-for="(item, index) in list" :key="item.userId" :span="6">
+            <div :class="Math.floor((index / 4) % 2) ? 'list-2' : 'list-1'">
+              <p>姓名：{{ item.name }}</p>
+
+              <p>员工工号：{{ item.userId }}</p>
+              <p>联系方式：{{ item.mobile }}</p>
+              <p class="mechanism">
+                <a-tooltip>
+                  <template slot="title">
+                    <span>
+                      {{ item.deptName }}
+                    </span>
+                  </template>
+                  <p>
+                    机构归属：
+                    {{ item.deptName }}
+                  </p>
+                </a-tooltip>
+              </p>
+              <p>管理人名称：{{ item.leaderName }}</p>
+
+              <p>
+                <span>总保费：{{ item.totalPremium || 0 }}</span>
+                <span>单均保费：{{ item.averagePremium || 0 }}</span>
+              </p>
+
+              <div class="user-icon">
+                <img
+                  v-show="item.filePath"
+                  :src="process + item.filePath"
+                  alt=""
+                />
+                <img
+                  v-if="!item.filePath && item.sex == 'M'"
+                  src="../../assets/img/man.png"
+                  alt=""
+                />
+                <img
+                  v-if="!item.filePath && item.sex == 'F'"
+                  src="../../assets/img/woman.png"
+                  alt=""
+                />
+                <img
+                  v-if="!item.filePath && !item.sex"
+                  src="../../assets/img/man.png"
+                  alt=""
+                />
+              </div>
+
+              <p>
+                <a-button type="primary" @click="teamMessage(item)"
+                  >详情</a-button
+                >
+              </p>
+            </div>
+          </a-col>
+        </a-row>
+
+        <div class="page">
+          <a-pagination
+            v-model="pageInfo.pageNum"
+            :total="pageInfo.total"
+            show-less-items
+            show-size-changer
+            show-quick-jumper
+            :show-total="(total) => `共 ${total} 条数据`"
+            @change="pageChange"
+            @showSizeChange="pageChange"
+            :page-size.sync="pageInfo.pageSize"
+            :pageSizeOptions="['12', '24', '36', '48']"
+          />
+        </div>
+      </a-spin>
+    </div>
+  </div>
+</template>
+          
+    <script>
+import fromRow from "@/components/form/FormRow";
+import moment from "moment";
+export default {
+  components: {
+    fromRow,
+  },
+  //   mixins: [mixin],
+  data() {
+    return {
+      formState: {
+        whole: undefined,
+        cityId: undefined,
+        countyId: undefined,
+        houseId: undefined,
+        provinceId: undefined,
+        days: undefined,
+        time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+        name: undefined,
+        userCode: undefined,
+        phoneNumber: undefined,
+        createtimeStart: moment().format("YYYY-MM-DD"),
+        createtimeEnd: moment().format("YYYY-MM-DD"),
+        leaderId: undefined,
+        outThere: undefined,
+      },
+      process: process.env.VUE_APP_API_BASE_URL,
+
+      pageInfo: {
+        pageNum: 1,
+        pageSize: 12,
+        total: 0,
+      },
+      loading: false,
+
+      list: [],
+      manageList: [],
+    };
+  },
+  watch: {
+    "formState.days"() {
+      this.getList();
+      // this.formState.time = [];
+    },
+  },
+  mounted() {
+    this.getList();
+    this.getManageList();
+    // setTimeout(() => {
+    // }, 1000);
+  },
+  methods: {
+    exportList() {
+      this.$API.personnel
+        .exportList({
+          ...this.formState,
+          managementSource: 3,
+        })
+        .then((res) => {
+          if (res.data.code == 200) {
+            let url = this.process + res.data.data; // 3.创建一个临时的url指向blob对象
+            let a = document.createElement("a");
+            a.href = url;
+            a.download = "导出文件.xlsx";
+            a.click();
+            window.URL.revokeObjectURL(url);
+          } else {
+            this.$message.error(res.msg);
+          }
+        });
+    },
+    filterOption(input, option) {
+      return (
+        option.componentOptions.children[0].text
+          .toLowerCase()
+          .indexOf(input.toLowerCase()) >= 0
+      );
+    },
+    getManageList() {
+      //
+      this.$API.personnel.getManageUser({}).then((res) => {
+        // console.log(res);
+        if (res.data.code === 200) {
+          this.manageList = [...res.data.data];
+        }
+      });
+    },
+    timeChange(val) {
+      this.formState.createtimeStart = val[0];
+      this.formState.createtimeEnd = val[1];
+      this.formState.days = undefined;
+
+      this.getList();
+    },
+    getList() {
+      this.loading = true;
+      this.$API.personnel
+        .getyQxFrontlineAgentList({
+          pageNum: this.pageInfo.pageNum,
+          pageSize: this.pageInfo.pageSize,
+          ...this.formState,
+          managementSource: 3,
+        })
+        .then((res) => {
+          //   console.log(res);
+          if (res.data.code === 200) {
+            this.loading = false;
+
+            this.list = [...res.data.data.content];
+            this.pageInfo.total = res.data.data.totalSize;
+          } else {
+            this.loading = false;
+            this.list = [];
+            this.pageInfo.total = 0;
+          }
+        });
+    },
+    onClear() {
+      this.$message.info("您清空了勾选的所有行");
+    },
+
+    //分页事件
+    pageChange(page, pageSize) {
+      //   console.log(page, pageSize);
+      this.pageInfo.pageNum = page;
+      this.pageInfo.pageSize = pageSize;
+      this.getList();
+    },
+    teamMessage(item) {
+      // item
+      console.log(this.$router);
+      this.$router.push({
+        path: "/personnelManage/sales/message",
+        query: {
+          userId: item.userId,
+          totalManpower: item.totalManpower,
+          totalPremium: item.totalPremium,
+          orderManpower: item.orderManpower,
+          time: this.formState.time,
+        },
+      });
+    },
+  },
+};
+</script>
+          <style lang='less' scoped>
+.back-line-main {
+  display: flex;
+  flex-direction: column;
+  .back-line-header {
+    padding: 15px;
+    box-sizing: border-box;
+    .back-line-header-title {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding-bottom: 15px;
+      border-bottom: 1px solid #f0f0f0;
+      box-sizing: border-box;
+      h2 {
+        margin: 0;
+      }
+      > div {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+      }
+      span {
+        display: block;
+        margin-right: 15px;
+      }
+      /deep/.ant-calendar-picker {
+        width: 300px;
+      }
+    }
+  }
+  > div {
+    // height: 152px;
+    background: #fff;
+    .ant-form {
+      display: flex;
+      > .ant-form-item {
+        flex: 1;
+        // width: 20%;
+        /deep/.ant-form-item-control-wrapper {
+          width: 100%;
+        }
+      }
+    }
+    .form-item-search {
+      // display: flex;
+      // justify-content: flex-end;
+      /deep/ .ant-form-item-control {
+        display: flex;
+        justify-content: flex-end;
+      }
+    }
+  }
+}
+.list {
+  flex: 1;
+  padding: 15px;
+  box-sizing: border-box;
+}
+.personnel-message {
+  display: flex;
+  flex-wrap: wrap;
+  //   justify-content: space-between;
+  .ant-col {
+    width: 25%;
+    padding: 0 15px;
+    box-sizing: border-box;
+    > div {
+      width: 100%;
+      height: auto;
+      // background: #f9faff;
+      border-radius: 8px;
+      border: 1px solid rgba(42, 85, 229, 0.5);
+      background: #f9faff;
+      box-shadow: 0px 2px 8px 0px rgba(42, 85, 229, 0.15);
+      padding: 15px;
+      box-sizing: border-box;
+      margin-bottom: 15px;
+      position: relative;
+      margin-right: 2%;
+      p {
+        display: flex;
+        justify-content: space-between;
+      }
+      p:last-child {
+        margin: 0;
+        justify-content: flex-end;
+        // text-align: right;
+      }
+      div.user-icon {
+        width: 56px;
+        height: 56px;
+        position: absolute;
+        top: 12px;
+        right: 15px;
+        border-radius: 50%;
+        overflow: hidden;
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+      .progress {
+        width: 100%;
+        height: 5px;
+        background: #eee;
+        border-radius: 8px;
+        margin-bottom: 8px;
+        > p {
+          width: 67%;
+          height: 100%;
+          background: #2a55e5;
+          border-radius: 8px;
+        }
+      }
+      // margin-right: 2%;
+    }
+    > div.list-1 {
+      background: #fff8f6;
+      box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
+      border-radius: 8px 8px 8px 8px;
+      border: 1px solid rgba(248, 127, 44, 0.5);
+      button {
+        background: #f87f2c;
+        color: #fff;
+        border: none;
+      }
+    }
+    > div.list-2 {
+      background: #f7fef4;
+      box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
+      border-radius: 8px 8px 8px 8px;
+      border: 1px solid rgba(128, 190, 56, 0.5);
+      button {
+        background: #80be38;
+        color: #fff;
+        border: none;
+      }
+    }
+    > div.list-3 {
+      background: #f9faff;
+      box-shadow: 0px 2px 8px 0px rgba(42, 85, 229, 0.15);
+      border-radius: 8px 8px 8px 8px;
+      border: 1px solid rgba(42, 85, 229, 0.5);
+    }
+  }
+}
+.page {
+  display: flex;
+  justify-content: flex-end;
+}
+.back-line-main .personnel-message .mechanism > p {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+</style>

src/pages/personnelManage/sales/message.vue

@@ -0,0 +1,545 @@
+<template>
+  <div class="back-line-main">
+    <!-- <div class="team-manage">
+      <h2>团队管理</h2>
+      <a-row>
+        <a-col :span="4" v-for="(item, index) in teamList" :key="index">
+          <div :class="teamTab == index ? 'on' : ''" @click="teamTab = index">
+            <p>团队级别：{{ item.teamlevel }}</p>
+            <p>团队人数：{{ item.teamnum || 0 }}</p>
+            <p>签单保费：{{ item.sumpremium || 0 }}</p>
+            <p>出单人力：{{ item.usernum || 0 }}</p>
+          </div>
+        </a-col>
+      </a-row>
+    </div> -->
+    <div class="back-line-hearder">
+      <div class="title">
+        <h2>成员详情</h2>
+        <div>
+          <span>时间筛选</span>
+          <a-range-picker
+            style="margin-left: 10px"
+            v-model="formState.time"
+            @change="timeChange"
+            valueFormat="YYYY-MM-DD"
+          >
+            <a-icon slot="suffixIcon" type="calendar" />
+          </a-range-picker>
+          <a-radio-group
+            style="margin-left: 10px"
+            default-value="1"
+            button-style="solid"
+            v-model="formState.days"
+          >
+            <a-radio-button :value="1" @click="formState.time = []">
+              当天
+            </a-radio-button>
+            <a-radio-button :value="2" @click="formState.time = []">
+              近7天
+            </a-radio-button>
+            <a-radio-button :value="3" @click="formState.time = []">
+              近30天
+            </a-radio-button>
+          </a-radio-group>
+        </div>
+      </div>
+      <!-- <a-form layout="inline" :model="formState" @finish="handleFinish">
+        <a-form-item label="姓名" :labelCol="{ span: 5 }" :colon="false">
+          <a-input
+            v-model="formState.name"
+            placeholder="请输入姓名"
+            allowClear
+          ></a-input>
+        </a-form-item>
+        <a-form-item label="工号" :labelCol="{ span: 5 }" :colon="false">
+          <a-input
+            v-model="formState.userCode"
+            placeholder="请输入工号"
+            allowClear
+          ></a-input>
+        </a-form-item>
+        <a-form-item label="手机号" :labelCol="{ span: 5 }" :colon="false">
+          <a-input
+            v-model="formState.phoneNumber"
+            placeholder="请输入手机号"
+            allowClear
+          ></a-input>
+        </a-form-item>
+       
+        <a-form-item
+          label="             "
+          :labelCol="{ span: 5 }"
+          :colon="false"
+          class="form-item-search"
+        >
+          <a-button type="primary" @click="getList()">查询</a-button>
+        </a-form-item>
+      </a-form> -->
+      <div class="personnel-message">
+        <div
+          v-for="(item, index) in userList"
+          :key="item.deptId"
+          :class="Math.floor((index / 4) % 2) ? 'list-2' : 'list-1'"
+        >
+          <p>渠道成员：{{ item.name }}</p>
+          <p>报价笔数：{{ item.orderNumber || 0 }}</p>
+          <p>
+            <span>核保笔数：{{ item.underwritingCount || 0 }}</span>
+          </p>
+          <p>
+            <span>出单笔数：{{ item.qutationInsureCount || 0 }}</span>
+            <span>签单保费：{{ item.totalPremium || 0 }}</span>
+          </p>
+          <!-- <p>
+            <span>已认证：{{ item.isFactorVerify || 0 }}</span>
+            <span>未认证：{{ item.isNotFactorVerify || 0 }}</span>
+          </p> -->
+          <div class="user-icon">
+            <img v-show="item.filePath" :src="process + item.filePath" alt="" />
+            <img
+              v-if="!item.filePath && item.sex == 'M'"
+              src="../../../assets/img/man.png"
+              alt=""
+            />
+            <img
+              v-if="!item.filePath && item.sex == 'F'"
+              src="../../../assets/img/woman.png"
+              alt=""
+            />
+            <img
+              v-if="!item.filePath && !item.sex"
+              src="../../../assets/img/man.png"
+              alt=""
+            />
+            {{ item.userName }}
+          </div>
+          <p>
+            <a-button type="primary" @click="taskMessage(item)"
+              >任务数据</a-button
+            >
+            <a-button type="primary" @click="orderMessage(item)"
+              >订单数据</a-button
+            >
+            <a-button type="primary" @click="openDrawer(item)"
+              >考核数据</a-button
+            >
+          </p>
+        </div>
+      </div>
+      <!-- <div class="page">
+        <a-pagination
+          v-model="current"
+          :total="pageInfo.total"--------------------------------------------------
+          show-less-items
+          show-size-changer
+         show-quick-jumper
+          :show-total="(total) => `共 ${total} 条数据`"
+          @change="pageChange"
+            @showSizeChange="pageChange"
+          
+          :page-size.sync="pageInfo.pageSize"
+          :pageSizeOptions="['12', '24', '36', '48']"
+        />
+      </div> -->
+    </div>
+    <a-drawer
+      :width="500"
+      :placement="placement"
+      :visible="visible"
+      :headerStyle="headerStyle"
+      :closable="false"
+    >
+      <template slot="title">
+        <div class="custom-title" :style="headerStyle">
+          <div>
+            <a-icon type="close" @click="onClose" />
+            成员信息
+          </div>
+          <div>
+            <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
+            <a-button type="primary" @click="onClose">确认</a-button>
+          </div>
+        </div>
+      </template>
+      <h3>个人信息</h3>
+      <ul class="list">
+        <li>
+          <span>姓名</span>
+          <span>{{ userData.name }}</span>
+        </li>
+        <li>
+          <span>工号</span> <span>{{ userData.userId }}</span>
+        </li>
+        <li>
+          <span>手机号</span> <span>{{ userData.userPhone }}</span>
+        </li>
+        <li>
+          <span>注册时间</span> <span>{{ userData.userDate }}</span>
+        </li>
+
+        <li>
+          <span>签单保费</span> <span>{{ userData.totalPremium }}</span>
+        </li>
+        <li>
+          <span>出单人力</span> <span>{{ userData.orderManpower }}</span>
+        </li>
+      </ul>
+    </a-drawer>
+  </div>
+</template>
+    
+    <script>
+export default {
+  data() {
+    return {
+      formState: {
+        // phoneNumber: "",
+        // name: "",
+        // userCode: "",
+        time: [],
+        days: undefined,
+        createtimeEnd: undefined,
+        createtimeStart: undefined,
+      },
+      current: 1,
+      teamTab: 0,
+      visible: false,
+      placement: "right",
+      userData: {},
+      headerStyle: {
+        display: "flex",
+        "align-items": "center",
+        "justify-content": "space-between",
+      },
+      process: process.env.VUE_APP_API_BASE_URL,
+      userList: [],
+      pageInfo: {
+        pageNum: 1,
+        pageSize: 12,
+        total: 0,
+      },
+      teamList: [],
+    };
+  },
+  watch: {
+    "formState.days"() {
+      this.getList();
+    },
+  },
+  created() {
+    this.$nextTick(() => {
+      this.formState.time = this.$route.query.time;
+      this.formState.createtimeStart = this.$route.query.time[0];
+      this.formState.createtimeEnd = this.$route.query.time[1];
+      this.getList();
+    });
+  },
+  methods: {
+    handleFinish() {
+      //
+    },
+    taskMessage(item) {
+      this.$router.push({
+        path: "/personnelManage/sales/task",
+        query: {
+          userId: item.userId,
+          time: this.formState.time,
+        },
+      });
+    },
+    orderMessage(item) {
+      this.$router.push({
+        path: "/personnelManage/sales/order",
+        query: {
+          userId: item.userId,
+          time: this.formState.time,
+        },
+      });
+    },
+
+    openDrawer(item) {
+      // item
+      this.visible = true;
+
+      this.$API.personnel
+        .getTeamUserDetails({
+          userId: item.userId,
+          ...this.formState,
+        })
+        .then((res) => {
+          if (res.data.code === 200) {
+            this.userData = { ...res.data.data };
+          }
+        });
+      // console.log(this.visible)
+    },
+    monthChange() {},
+    onClose() {
+      //
+      this.visible = false;
+    },
+    pageChange(page, pageSize) {
+      //   console.log(page, pageSize);
+      this.pageInfo.pageNum = page;
+      this.pageInfo.pageSize = pageSize;
+      this.getList();
+    },
+    timeChange(val) {
+      this.formState.createtimeStart = val[0];
+      this.formState.createtimeEnd = val[1];
+      this.formState.days = undefined;
+      this.getList();
+    },
+    getList() {
+      this.$API.personnel
+        .getChannelDetails({
+          userId: this.$route.query.userId,
+          ...this.formState,
+        })
+        .then((res) => {
+          if (res.data.code === 200) {
+            this.userList = [...res.data.data];
+            // this.teamList.unshift({
+            //   totalManpower: this.$route.query.totalManpower,
+            //   totalPremium: this.$route.query.totalPremium,
+            //   orderManpower: this.$route.query.orderManpower,
+            //   teamLevel: "汇总",
+            // });
+          }
+        });
+      //   this.$API.personnel
+      //     .getTeamUserList({
+      //       userId: this.$route.query.userId,
+      //       pageNum: this.pageInfo.pageNum,
+      //       pageSize: this.pageInfo.pageSize,
+      //       ...this.formState,
+      //     })
+      //     .then((res) => {
+      //       if (res.data.code === 200) {
+      //         // this.userList = [...res.data.data.records];
+      //         this.pageInfo.total = res.data.data.total;
+      //       }
+      //     });
+    },
+  },
+};
+</script>
+    <style lang='less' scoped>
+.back-line-main {
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  .team-manage {
+    width: 100%;
+    height: 232px;
+    margin-bottom: 24px;
+    background: #fff;
+    padding: 15px;
+    box-sizing: border-box;
+    > .ant-row {
+      height: 162px;
+      > div {
+        height: 100%;
+        padding: 0 15px;
+        > div {
+          height: 100%;
+          border: 1px solid #d7dbe7;
+          border-radius: 4px;
+          padding: 10px;
+
+          box-sizing: border-box;
+          position: relative;
+        }
+        > div:hover {
+          background: rgba(238, 121, 47, 0.05);
+          // opacity: 0.1;
+        }
+        > div.on {
+          background: rgba(238, 121, 47, 0.05);
+        }
+        > div.on::before {
+          position: absolute;
+          content: "";
+          display: block;
+          width: 100%;
+          height: 6px;
+          left: 0;
+          top: -3px;
+          // margin-top: -15px; /* 调整这个值来改变边框的粗细 */
+          border-top: 6px solid #ee792f; /* 设置边框的粗细和颜色 */
+          border-radius: 4px 4px 0 0;
+        }
+      }
+    }
+  }
+
+  .back-line-hearder {
+    flex: 1;
+    padding: 15px;
+    box-sizing: border-box;
+    h1 {
+      margin: 0;
+    }
+    .title {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      border-bottom: 1px solid #f0f0f0;
+      padding-bottom: 10px;
+      box-sizing: border-box;
+      h2 {
+        margin: 0;
+      }
+    }
+    height: auto;
+    background: #fff;
+    .ant-form {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: flex-start;
+      > .ant-form-item {
+        flex: 1;
+        //   width: 20%;
+        /deep/.ant-form-item-control-wrapper {
+          width: 100%;
+        }
+      }
+    }
+    .form-item-search {
+      // display: flex;
+      // justify-content: flex-end;
+      /deep/ .ant-form-item-control {
+        display: flex;
+        justify-content: flex-end;
+      }
+    }
+    .personnel-message {
+      display: flex;
+      flex-wrap: wrap;
+      // justify-content: space-evenly;
+      margin-top: 10px;
+      > div {
+        width: 23%;
+        height: auto;
+        background: #f9faff;
+        border-radius: 8px;
+        border: 1px solid #2a55e5;
+        padding: 15px;
+        box-sizing: border-box;
+        margin-bottom: 15px;
+        position: relative;
+        margin-right: 2%;
+        p {
+          display: flex;
+          justify-content: space-between;
+        }
+        // p:last-child {
+        //   margin: 0;
+        //   justify-content: ;
+        //   // text-align: right;
+        // }
+        div {
+          width: 56px;
+          height: 56px;
+          position: absolute;
+          top: 12px;
+          right: 15px;
+          border-radius: 50%;
+          overflow: hidden;
+          img {
+            width: 100%;
+            height: 100%;
+          }
+        }
+        // margin-right: 2%;
+      }
+      > div.list-1 {
+        background: #fff8f6;
+        box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
+        border-radius: 8px 8px 8px 8px;
+        border: 1px solid rgba(248, 127, 44, 0.5);
+        button {
+          background: #f87f2c;
+          color: #fff;
+          border: none;
+        }
+      }
+      > div.list-2 {
+        background: #f7fef4;
+        box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
+        border-radius: 8px 8px 8px 8px;
+        border: 1px solid rgba(128, 190, 56, 0.5);
+        button {
+          background: #80be38;
+          color: #fff;
+          border: none;
+        }
+      }
+      > div.list-3 {
+        background: #f9faff;
+        box-shadow: 0px 2px 8px 0px rgba(42, 85, 229, 0.15);
+        border-radius: 8px 8px 8px 8px;
+        border: 1px solid rgba(42, 85, 229, 0.5);
+      }
+    }
+    .page {
+      display: flex;
+      justify-content: flex-end;
+    }
+  }
+}
+/deep/.ant-drawer-title {
+  width: 100%;
+}
+/deep/.custom-title {
+  display: flex;
+  > i {
+    cursor: pointer;
+  }
+}
+/deep/.ant-drawer-body {
+  h3 {
+    width: 100%;
+    height: 56px;
+    background: #fafafa;
+    font-weight: 500;
+    font-size: 16px;
+    color: rgba(0, 0, 0, 0.85);
+    text-align: center;
+    line-height: 56px;
+  }
+  /deep/ .ant-list-item {
+    display: flex;
+  }
+  .ant-list-split .ant-list-items .ant-list-item:last-child {
+    border-bottom: 1px solid #f0f0f0 !important;
+  }
+  .list-label {
+    width: 160px;
+  }
+}
+.list {
+  width: 100%;
+  > li {
+    height: 56px;
+    display: flex;
+    align-items: center;
+    border-bottom: 1px solid #f0f0f0;
+    padding: 0 10px;
+    box-sizing: border-box;
+    > span:first-child {
+      display: flex;
+      width: 200px;
+      font-weight: 500;
+      font-size: 16px;
+      color: rgba(0, 0, 0, 0.85);
+    }
+    span {
+      font-weight: 500;
+      font-size: 16px;
+      color: rgba(0, 0, 0, 0.85);
+    }
+  }
+}
+</style>

src/pages/personnelManage/sales/order.vue

@@ -0,0 +1,631 @@
+<template>
+  <div class="quote">
+    <!-- <div class="quote-tree" style="border-radius: 8px">
+      <div><h2>部门所属</h2></div>
+      <div>
+        
+        <tree @getList="getVerification"></tree>
+      </div>
+    </div> -->
+    <div class="back-line-main">
+      <div class="back-line-header" v-show="mode == 'big'">
+        <div class="back-line-header-title">
+          <h2>
+            <a-icon type="arrow-left" @click="$router.back()" />
+            合计
+          </h2>
+          <div>
+            <dl>
+              <dt><img src="../../../assets/img/car.png" alt="" /></dt>
+              <dd>
+                <span>车辆数</span>
+                <span>{{ BigOrder.frameno }}</span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><img src="../../../assets/img/order.png" alt="" /></dt>
+              <dd>
+                <span>订单数</span>
+                <span>{{ BigOrder.orderNumber || 0 }}</span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><img src="../../../assets/img/orderMoney.png" alt="" /></dt>
+              <dd>
+                <span>成交率</span>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+          </div>
+        </div>
+      </div>
+      <div style="background-color: #fff; margin-top: 15px">
+        <div class="table-title">
+          <h2>总报价</h2>
+          <div>
+            <a-radio-group v-model="mode" :style="{ marginBottom: '8px' }">
+              <a-radio-button value="big"> 大订单 </a-radio-button>
+              <a-radio-button value="small"> 小订单 </a-radio-button>
+            </a-radio-group>
+            <span>时间筛选</span>
+            <a-range-picker
+              @change="onChangeTime"
+              v-model="formState.time"
+              value-format="YYYY-MM-DD"
+              style="margin-left: 10px"
+            >
+              <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-radio-group
+              default-value="0"
+              button-style="solid"
+              v-model="formState.dateType"
+              @change="getVerification()"
+              style="margin-left: 10px"
+            >
+              <a-radio-button
+                value="1"
+                @click="
+                  (formState.time = []),
+                    (formState.beginDate = ''),
+                    (formState.endDate = '')
+                "
+              >
+                近1月
+              </a-radio-button>
+              <a-radio-button
+                value="2"
+                @click="
+                  (formState.time = []),
+                    (formState.beginDate = ''),
+                    (formState.endDate = '')
+                "
+              >
+                近3月
+              </a-radio-button>
+              <a-radio-button
+                value="3"
+                @click="
+                  (formState.time = []),
+                    (formState.beginDate = ''),
+                    (formState.endDate = '')
+                "
+              >
+                近半年
+              </a-radio-button>
+            </a-radio-group>
+          </div>
+        </div>
+        <a-form
+          v-show="mode == 'big'"
+          layout="inline"
+          :class="className"
+          :model="formState"
+          style="padding: 0 0 0 15px; box-sizing: border-box"
+        >
+          <a-form-item
+            label="业务员工号"
+            :labelCol="{ span: 8 }"
+            :colon="false"
+          >
+            <a-input
+              placeholder="请输入业务员工号"
+              v-model="formState.userId"
+              allowClear
+            ></a-input>
+          </a-form-item>
+          <a-form-item
+            label="业务员姓名"
+            :labelCol="{ span: 8 }"
+            :colon="false"
+          >
+            <a-input
+              placeholder="请输入业务员姓名"
+              v-model="formState.userName"
+              allowClear
+            ></a-input>
+          </a-form-item>
+          <a-form-item label="手机号" :labelCol="{ span: 5 }" :colon="false">
+            <a-input
+              placeholder="请输入手机号"
+              v-model="formState.mobile"
+              allowClear
+            ></a-input>
+          </a-form-item>
+          <a-form-item label="车牌号" :labelCol="{ span: 5 }" :colon="false">
+            <a-input
+              placeholder="请输入车牌号"
+              v-model="formState.licenseno"
+              allowClear
+            ></a-input>
+          </a-form-item>
+          <a-form-item label="车架号" :labelCol="{ span: 5 }" :colon="false">
+            <a-input
+              placeholder="请输入车架号"
+              v-model="formState.frameno"
+              allowClear
+            ></a-input>
+          </a-form-item>
+        </a-form>
+        <div
+          v-show="mode == 'big'"
+          style="
+            display: flex;
+            justify-content: flex-end;
+            padding-right: 15px;
+            box-sizing: border-box;
+          "
+        >
+          <a-button
+            type="primary"
+            @click="exportExcel"
+            style="margin-right: 15px"
+            >导出</a-button
+          >
+          <a-button type="primary" @click="getList">查询</a-button>
+        </div>
+        <standard-table
+          v-show="mode == 'big'"
+          bordered
+          :columns="columns"
+          :dataSource="tableList"
+          :pagination="pagination"
+          @clear="onClear"
+          @change="onChange"
+          :loading="loading"
+        >
+          <div slot="count" slot-scope="{ text }">
+            {{ text != "-" ? text + "次" : text }}
+          </div>
+          <div slot="rate" slot-scope="{ text }">
+            {{ text != "-" ? (text * 100).toFixed(2) + "%" : text }}
+          </div>
+        </standard-table>
+        <standard-table
+          v-show="mode != 'big'"
+          bordered
+          :columns="columns1"
+          :dataSource="tableList"
+          :pagination="pagination"
+          @clear="onClear"
+          @change="onChange"
+          :loading="loading"
+        >
+          <div slot="count" slot-scope="{ text }">
+            {{ text != "-" ? text + "次" : text }}
+          </div>
+          <div slot="rate" slot-scope="{ text }">
+            {{ text != "-" ? (text * 100).toFixed(2) + "%" : text }}
+          </div>
+        </standard-table>
+      </div>
+    </div>
+  </div>
+</template>
+          
+  <script>
+import StandardTable from "@/components/table/StandardTable";
+// import mixin from "../../minins/mixin";
+// import tree from "@/components/tree/tree";
+import moment from "moment";
+
+const columns = [
+  // { title: "被保人姓名", dataIndex: "insureinfoName" },
+  // { title: "被保人电话", dataIndex: "insureinfoMobile" },
+  {
+    title: "车牌号",
+    dataIndex: "licenseno",
+  },
+  { title: "车型", dataIndex: "modelcname" },
+
+  { title: "发动机号", dataIndex: "modelCode" },
+
+  {
+    title: "车架号",
+    dataIndex: "frameno",
+    // scopedSlots: { customRender: "parterCompanyName" },
+  },
+
+  {
+    title: "订单数量",
+    dataIndex: "orderNumber",
+  },
+  {
+    title: "成交率",
+    dataIndex: "closeRate",
+    scopedSlots: { customRender: "rate" },
+  },
+  {
+    title: "承保公司",
+    dataIndex: "namesimple",
+  },
+];
+const columns1 = [
+  {
+    title: "保险公司",
+    dataIndex: "companyName",
+  },
+
+  {
+    title: "合作公司",
+    dataIndex: "parterCompanyName",
+    // scopedSlots: { customRender: "parterCompanyName" },
+  },
+  {
+    title: "报价数",
+
+    // scopedSlots: { customRender: "qutationCount" },
+    children: [
+      {
+        title: "总报价",
+        dataIndex: "allNumber",
+        scopedSlots: { customRender: "count" },
+      },
+      {
+        title: "报价成功",
+        dataIndex: "orderSuccessNumber",
+        scopedSlots: { customRender: "count" },
+      },
+      {
+        title: "报价失败",
+        dataIndex: "areaCompanyErrNumber",
+        scopedSlots: { customRender: "count" },
+      },
+    ],
+  },
+
+  {
+    title: "人工审核数",
+    dataIndex: "numberManual",
+    scopedSlots: { customRender: "count" },
+  },
+  {
+    title: "核保数",
+    dataIndex: "underwritingCount",
+    scopedSlots: { customRender: "count" },
+  },
+  {
+    title: "承保数",
+    dataIndex: "qutationInsureCount",
+    scopedSlots: { customRender: "count" },
+  },
+  {
+    title: "报价成功率",
+    dataIndex: "orderSuccessNumberRate",
+    scopedSlots: { customRender: "rate" },
+  },
+  {
+    title: "核保通过率",
+    dataIndex: "passRate",
+    scopedSlots: { customRender: "rate" },
+  },
+  {
+    title: "成交率",
+    dataIndex: "closeRate",
+    scopedSlots: { customRender: "rate" },
+
+    // scopedSlots: { customRender: "qutationCount" },
+  },
+  {
+    title: "承保率",
+    dataIndex: "contributionRate",
+    scopedSlots: { customRender: "rate" },
+
+    // scopedSlots: { customRender: "qutationCount" },
+  },
+];
+
+export default {
+  components: {
+    StandardTable,
+    // tree,
+  },
+  //   mixins: [mixin],
+  data() {
+    return {
+      formState: {
+        dateType: undefined,
+        time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+        beginDate: moment().format("YYYY-MM-DD"),
+        endDate: moment().format("YYYY-MM-DD"),
+        licenseno: "",
+        userName: "",
+        mobile: "",
+        frameno: "",
+        userId: "",
+      },
+      mode: "big",
+      backLinePersonnel: {},
+      columns: columns,
+      columns1: columns1,
+      companyList: [],
+      tableList: [],
+      pagination: {
+        current: 1,
+        defaultPageSize: 10,
+        total: 0,
+        pagesize0ptions: ["10", "20", "30", "50", "100"],
+        hideOnSinglePage: false,
+        showQuickJumper: true, //
+        showSizeChanger: true, //是否可以改变pagesize
+        showTotal: (total) => `共 ${total} 条数据`,
+      },
+      loading: false,
+      wholeList: [],
+      provinceList: [],
+      cityList: [],
+      areaList: [],
+      storeList: [],
+      treeData: [
+        { title: "Expand to load", key: "0" },
+        { title: "Expand to load", key: "1" },
+        { title: "Tree Node", key: "2", isLeaf: true },
+      ],
+      BigOrder: {},
+    };
+  },
+  watch: {
+    mode() {
+      this.getVerification();
+    },
+  },
+  mounted() {
+    this.formState.time = this.$route.query.time;
+    this.formState.beginDate = this.$route.query.time[0];
+    this.formState.endDate = this.$route.query.time[1];
+    this.getVerification();
+
+    // setTimeout(() => {
+    // }, 1000);
+  },
+  methods: {
+    exportExcel() {
+      this.$API.quote
+        .exportList({
+          // pageNum: this.pagination.current,
+          // pageSize: this.pagination.defaultPageSize,
+          ...this.formState,
+          deptId: this.deptId,
+        })
+        .then((res) => {
+          if (res.data.code == 200) {
+            let url = this.process + res.data.data; // 3.创建一个临时的url指向blob对象
+            let a = document.createElement("a");
+            a.href = url;
+            a.download = "导出文件.xlsx";
+            a.click();
+            window.URL.revokeObjectURL(url);
+          } else {
+            this.$message.error(res.msg);
+          }
+        });
+    },
+    getList() {
+      this.pagination.current = 1;
+      this.pagination.defaultPageSize = 10;
+      this.getVerification();
+    },
+    onChangeTime(val) {
+      // console.log(val);
+      this.formState.beginDate = val[0];
+      this.formState.endDate = val[1];
+      this.formState.dateType = undefined;
+      this.getVerification();
+    },
+    handleFinish() {
+      //
+    },
+    wholeHandleChange() {
+      this.getProvinceList(this.formState.whole);
+    },
+    provinceHandleChange() {
+      this.getCityList(this.formState.provinceId);
+    },
+    cityHandleChange() {
+      this.getAreaList(this.formState.cityId);
+    },
+    countyHandleChange() {
+      this.getStoreList(this.formState.countyId);
+    },
+
+    async getVerification() {
+      this.loading = true;
+
+      if (this.mode != "big") {
+        this.$API.quote
+          .getQuoteList({
+            pageNum: this.pagination.current,
+            pageSize: this.pagination.defaultPageSize,
+            dateType: this.formState.dateType,
+            beginDate: this.formState.beginDate,
+            endDate: this.formState.endDate,
+            userId: this.$route.query.userId,
+          })
+          .then((res) => {
+            if (res.data.code === 200) {
+              this.loading = false;
+              this.tableList = res.data.data.content;
+              this.pagination = {
+                current: res.data.data.pageNum,
+                defaultPageSize: res.data.data.pageSize,
+                total: res.data.data.totalSize,
+              };
+            }
+          });
+      } else {
+        this.$API.quote
+          .getBigOrderList({
+            pageNum: this.pagination.current,
+            pageSize: this.pagination.defaultPageSize,
+            ...this.formState,
+            userId: this.$route.query.userId,
+          })
+          .then((res) => {
+            if (res.data.code === 200) {
+              this.loading = false;
+              this.tableList = res.data.data.content;
+              this.pagination = {
+                current: res.data.data.pageNum,
+                defaultPageSize: res.data.data.pageSize,
+                total: res.data.data.totalSize,
+              };
+            }
+          });
+        this.$API.quote
+          .getBigOrderMount({
+            ...this.formState,
+            userId: this.$route.query.userId,
+          })
+          .then((res) => {
+            if (res.data.code === 200) {
+              console.log(res);
+              this.BigOrder = { ...res.data.data };
+            }
+          });
+      }
+    },
+    onClear() {
+      this.$message.info("您清空了勾选的所有行");
+    },
+
+    onChange(pagination) {
+      // this.$message.info('表格状态改变了')
+
+      this.pagination = {
+        current: pagination.current,
+        defaultPageSize: pagination.pageSize,
+        total: pagination.total,
+      };
+      this.getVerification();
+    },
+  },
+};
+</script>
+  <style lang='less' scoped>
+.quote {
+  display: flex;
+  > div:first-child {
+    width: 20%;
+    background: #fff;
+    margin-right: 15px;
+  }
+  .quote-tree {
+    padding: 15px;
+    box-sizing: border-box;
+    //
+    > div:first-child {
+      border-bottom: 1px solid #f0f0f0;
+    }
+  }
+}
+.back-line-main {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  .back-line-header {
+    // padding: 15px;
+    box-sizing: border-box;
+    .back-line-header-title {
+      padding: 15px;
+      box-sizing: border-box;
+      background: #ffffff;
+      box-shadow: 0px 2px 8px 0px rgba(141, 149, 176, 0.15);
+      border-radius: 8px 8px 8px 8px;
+      border: 2px solid rgba(255, 255, 255, 0.2);
+      h2 {
+        margin: 0;
+      }
+      > div {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        > dl {
+          flex: none;
+          width: 271px;
+          height: 61px;
+          display: flex;
+          align-items: center;
+          background: linear-gradient(
+            267deg,
+            rgba(42, 85, 229, 0.1) 0%,
+            rgba(42, 85, 229, 0) 100%
+          );
+          box-shadow: 0px 2px 8px 0px rgba(42, 85, 229, 0.1);
+          border-radius: 4px 4px 4px 4px;
+          border: 1px solid #ffffff;
+
+          img {
+            width: 44px;
+            height: auto;
+          }
+          > dd {
+            display: flex;
+            align-items: center;
+            margin: 0;
+            font-family: PingFang SC, PingFang SC;
+            font-weight: 500;
+            font-size: 18px;
+            color: rgba(0, 0, 0, 0.85);
+            padding-left: 15px;
+            box-sizing: border-box;
+          }
+        }
+      }
+      span {
+        display: block;
+        margin-right: 15px;
+      }
+      /deep/.ant-calendar-picker {
+        width: 300px;
+      }
+    }
+  }
+  > div {
+    // height: 152px;
+    // background: #fff;
+    .ant-form {
+      display: flex;
+      > .ant-form-item {
+        flex: 1;
+        /deep/.ant-form-item-control-wrapper {
+          width: 100%;
+        }
+      }
+    }
+    .form-item-search {
+      // display: flex;
+      // justify-content: flex-end;
+      /deep/ .ant-form-item-control {
+        display: flex;
+        justify-content: flex-end;
+      }
+    }
+  }
+  .table-title {
+    padding: 15px 15px 0;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    h2 {
+      margin: 0;
+    }
+    > div {
+      flex: 1;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      /deep/.ant-radio-group {
+        margin-bottom: 0 !important;
+        margin-right: 10px;
+      }
+    }
+  }
+}
+</style>

src/pages/personnelManage/sales/task.vue

@@ -0,0 +1,367 @@
+<template>
+  <div class="back-line-main">
+    <div class="back-line-header">
+      <div class="back-line-header-title">
+        <h2>
+          <a-icon type="arrow-left" @click="$router.back()" />
+          电销数据
+        </h2>
+        <div>
+          <span>时间筛选</span>
+          <a-range-picker
+            @change="onChangeTime"
+            v-model="formState.time"
+            valueFormat="YYYY-MM-DD"
+          >
+            <a-icon slot="suffixIcon" type="calendar" />
+          </a-range-picker>
+          <a-radio-group
+            default-value="0"
+            button-style="solid"
+            v-model="formState.days"
+          >
+            <a-radio-button
+              value="1"
+              @click="
+                (formState.time = []),
+                  (formState.beginDate = ''),
+                  (formState.endDate = '')
+              "
+            >
+              当天
+            </a-radio-button>
+            <a-radio-button
+              value="7"
+              @click="
+                (formState.time = []),
+                  (formState.beginDate = ''),
+                  (formState.endDate = '')
+              "
+            >
+              近7天
+            </a-radio-button>
+            <a-radio-button
+              value="30"
+              @click="
+                (formState.time = []),
+                  (formState.beginDate = ''),
+                  (formState.endDate = '')
+              "
+            >
+              近30天
+            </a-radio-button>
+          </a-radio-group>
+        </div>
+      </div>
+      <fromRow
+        :formState="formState"
+        @getList="getList"
+        :exportExcel="true"
+        @exportList="exportList"
+      ></fromRow>
+    </div>
+    <standard-table
+      bordered
+      :columns="columns"
+      :dataSource="tableList"
+      :pagination="pagination"
+      @clear="onClear"
+      @change="onChange"
+      :loading="loading"
+    >
+      <div slot="qutationCount" slot-scope="{ text }">
+        {{ text + "条" }}
+      </div>
+      <div slot="quotationRate" slot-scope="{ text }">
+        {{ (text * 100).toFixed(2) + "%" }}
+      </div>
+      <span slot="title_slot">
+        报价率
+        <a-tooltip
+          placement="topLeft"
+          title="报价中 / 报价数"
+          arrow-point-at-center
+        >
+          <a-icon type="question-circle" />
+        </a-tooltip>
+      </span>
+      <span slot="title_slot2">
+        承保率
+        <a-tooltip
+          placement="topLeft"
+          title="承保数 / 报价数"
+          arrow-point-at-center
+        >
+          <a-icon type="question-circle" />
+        </a-tooltip>
+      </span>
+      <span slot="title_slot3">
+        核保通过率
+        <a-tooltip
+          placement="topLeft"
+          title="(承保数+ 核保数) / 报价数"
+          arrow-point-at-center
+        >
+          <a-icon type="question-circle" />
+        </a-tooltip>
+      </span>
+    </standard-table>
+  </div>
+</template>
+    
+    <script>
+import StandardTable from "@/components/table/StandardTable";
+import fromRow from "@/components/form/FormRow";
+import mixin from "../../../minins/mixin";
+const columns = [
+  {
+    title: "二级机构",
+    dataIndex: "provinceName",
+  },
+  {
+    title: "三级机构",
+    dataIndex: "cityName",
+  },
+  {
+    title: "四级机构",
+    dataIndex: "districtName",
+  },
+  {
+    title: "归属机构",
+    dataIndex: "deptName",
+  },
+  {
+    title: "业务员姓名",
+    dataIndex: "userName",
+  },
+  {
+    title: "业务员工号",
+    dataIndex: "userId",
+  },
+  {
+    title: "报价中",
+    dataIndex: "qutationCount",
+    scopedSlots: { customRender: "qutationCount" },
+  },
+  {
+    title: "待审核",
+    dataIndex: "auditOrder",
+    scopedSlots: { customRender: "qutationCount" },
+  },
+  {
+    title: "已核保待缴费",
+    dataIndex: "underwritingCount",
+    scopedSlots: { customRender: "qutationCount" },
+
+    // sorter: true,
+    needTotal: true,
+  },
+  {
+    title: "已承保",
+    dataIndex: "qutationInsureCount",
+    needTotal: true,
+    scopedSlots: { customRender: "qutationCount" },
+  },
+  {
+    title: "核保退回",
+    dataIndex: "underwritingReturn",
+    scopedSlots: { customRender: "qutationCount" },
+  },
+  {
+    // title: "报价率",
+    dataIndex: "quotationRate",
+    scopedSlots: { title: "title_slot", customRender: "quotationRate" },
+  },
+  {
+    // title: "承保率",
+    dataIndex: "closeRate",
+    scopedSlots: { title: "title_slot2", customRender: "quotationRate" },
+  },
+  {
+    // title: "核保通过率",
+    dataIndex: "contributionRate",
+    scopedSlots: { title: "title_slot3", customRender: "quotationRate" },
+  },
+];
+import moment from "moment";
+export default {
+  components: {
+    StandardTable,
+    fromRow,
+  },
+  mixins: [mixin],
+  data() {
+    return {
+      formState: {
+        whole: undefined,
+        cityId: undefined,
+        countyId: undefined,
+        houseId: undefined,
+        provinceId: undefined,
+        days: undefined,
+        time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+        endDate: moment().format("YYYY-MM-DD"),
+        beginDate: moment().format("YYYY-MM-DD"),
+      },
+      backLinePersonnel: {},
+      columns: columns,
+      companyList: [],
+      tableList: [],
+      pagination: {
+        current: 1,
+        defaultPageSize: 10,
+        total: 0,
+        pagesize0ptions: ["10", "20", "30", "50", "100"],
+        hideOnSinglePage: false,
+        showQuickJumper: true, //
+        showSizeChanger: true, //是否可以改变pagesize
+        showTotal: (total) => `共 ${total} 条数据`,
+      },
+      loading: false,
+      wholeList: [],
+      provinceList: [],
+      cityList: [],
+      areaList: [],
+      storeList: [],
+      process: process.env.VUE_APP_API_BASE_URL,
+    };
+  },
+  watch: {
+    "formState.days"() {
+      this.getList();
+    },
+  },
+  mounted() {
+    this.formState.time = this.$route.query.time;
+    this.formState.beginDate = this.$route.query.time[0];
+    this.formState.endDate = this.$route.query.time[1];
+
+    this.getList();
+    // setTimeout(() => {
+
+    // }, 1000);
+  },
+  methods: {
+    handleFinish() {
+      //
+    },
+    exportList() {
+      delete this.formState.time;
+      this.$API.task
+        .exportChannelList({
+          ...this.formState,
+        })
+        .then((res) => {
+          if (res.data.code == 200) {
+            let url = this.process + res.data.data; // 3.创建一个临时的url指向blob对象
+            let a = document.createElement("a");
+            a.href = url;
+            a.download = "导出文件.xlsx";
+            a.click();
+            window.URL.revokeObjectURL(url);
+          } else {
+            this.$message.error(res.msg);
+          }
+        });
+    },
+    getList(val) {
+      this.loading = true;
+      this.$API.task
+        .getTaskStatistics({
+          pageNum: this.pagination.current,
+          pageSize: this.pagination.defaultPageSize,
+          ...this.formState,
+          ...val,
+          userId: this.$route.query.userId,
+        })
+        .then((res) => {
+          if (res.data.code === 200) {
+            this.loading = false;
+            this.tableList = res.data.data.records;
+            this.pagination = {
+              current: res.data.data.current,
+              defaultPageSize: res.data.data.size,
+              total: res.data.data.total,
+            };
+          }
+        });
+    },
+    onClear() {
+      this.$message.info("您清空了勾选的所有行");
+    },
+    onChangeTime(val) {
+      // console.log(val);
+      this.formState.beginDate = val[0];
+      this.formState.endDate = val[1];
+      this.formState.days = undefined;
+      this.getList();
+    },
+
+    onChange(pagination, filters, sorter, { currentDataSource }) {
+      // this.$message.info('表格状态改变了')
+      console.log(pagination, filters, sorter, { currentDataSource });
+      this.pagination = {
+        current: pagination.current,
+        defaultPageSize: pagination.pageSize,
+        total: pagination.total,
+      };
+      this.getList();
+    },
+  },
+};
+</script>
+    <style lang='less' scoped>
+.back-line-main {
+  display: flex;
+  flex-direction: column;
+  .back-line-header {
+    padding: 15px;
+    box-sizing: border-box;
+    .back-line-header-title {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding-bottom: 15px;
+      border-bottom: 1px solid #f0f0f0;
+      box-sizing: border-box;
+      h2 {
+        margin: 0;
+      }
+      > div {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+      }
+      span {
+        display: block;
+        margin-right: 15px;
+      }
+      /deep/.ant-calendar-picker {
+        width: 300px;
+      }
+    }
+  }
+  > div {
+    // height: 152px;
+    background: #fff;
+    .ant-form {
+      display: flex;
+      > .ant-form-item {
+        flex: 1;
+        /deep/.ant-form-item-control-wrapper {
+          width: 100%;
+        }
+      }
+    }
+    .form-item-search {
+      // display: flex;
+      // justify-content: flex-end;
+      /deep/ .ant-form-item-control {
+        display: flex;
+        justify-content: flex-end;
+      }
+    }
+  }
+}
+</style>

src/router/config.js

@@ -146,6 +146,40 @@ const router = new Router({
             }
           ]
         },
+        {
+          path: '/sales',
+          name: '电销统计',
+          component: PageView,
+          children: [
+            {
+              path: '/personnelManage/sales/message',
+              name: '成员详情',
+              hidden: true,
+              meta: { requiresAuth: true },
+
+              component: () => import('@/pages/personnelManage/sales/message'),
+
+            },
+            {
+              path: '/personnelManage/sales/task',
+              name: '任务数据',
+              hidden: true,
+              meta: { requiresAuth: true },
+
+              component: () => import('@/pages/personnelManage/sales/task'),
+
+            },
+            {
+              path: '/personnelManage/sales/order',
+              name: '订单数据',
+              hidden: true,
+              meta: { requiresAuth: true },
+
+              component: () => import('@/pages/personnelManage/sales/order'),
+
+            }
+          ]
+        },
 
         {
           path: '/business/sales/message',