fix:任务统计增加导出功能及页面优化

src/components/form/FormRow.vue

@@ -142,7 +142,12 @@
       class="form-item-search"
       v-show="search"
     >
-      <a-button type="primary" @click="getList">查询</a-button>
+      <a-button type="primary" v-show="exportExcel" @click="exportList"
+        >导出</a-button
+      >
+      <a-button type="primary" @click="getList" style="margin-left: 10px"
+        >查询</a-button
+      >
     </a-form-item>
   </a-form>
 </template>
@@ -163,6 +168,9 @@ export default {
     showTab: {
       default: 5,
     },
+    exportExcel: {
+      default: false,
+    },
   },
   methods: {
     wholeHandleChange() {
@@ -180,6 +188,9 @@ export default {
     getList() {
       this.$emit("getList", this.formState);
     },
+    exportList() {
+      this.$emit("exportList", this.formState);
+    },
   },
 };
 </script>

src/pages/financial/receivablesMessage.vue

@@ -234,51 +234,58 @@ export default {
             : undefined,
         })
         .then((res) => {
+          console.log(res.data);
           if (res.data.code === 200) {
-            this.loading = false;
-            this.tableList = [...res.data.data.list];
-            this.titleMessage = { ...res.data.data };
-            let receivable = [];
-            let received = [];
-            let Notreceived = [];
-            let Notsettled = [];
-            let Notinvoiced = [];
-            res.data.data.list.forEach((item) => {
-              this.tableList.forEach((item1) => {
-                receivable = [];
-                received = [];
-                Notreceived = [];
-                Notsettled = [];
-                Notinvoiced = [];
-                item.list.forEach((item2) => {
-                  if (
-                    item1.companyName + item1.areaName ==
-                    item.companyName + item.areaName
-                  ) {
-                    receivable.push({
-                      isHand: item2.isHand,
-                      commissionFeevalue: item2.commissionFeevalue,
-                    });
-                    received.push(item2.readyCommissionFeevalue);
-                    Notreceived.push(item2.noInvoicCommissionFeevalue);
-                    Notsettled.push(item2.settlementAmount);
-                    Notinvoiced.push(item2.noSettlementAmount);
+            if (res.data.data) {
+              this.loading = false;
+              this.tableList = [...res.data.data.list] || [];
+              this.titleMessage = { ...res.data.data } || {};
+              let receivable = [];
+              let received = [];
+              let Notreceived = [];
+              let Notsettled = [];
+              let Notinvoiced = [];
+              res.data.data.list.forEach((item) => {
+                this.tableList.forEach((item1) => {
+                  receivable = [];
+                  received = [];
+                  Notreceived = [];
+                  Notsettled = [];
+                  Notinvoiced = [];
+                  item.list.forEach((item2) => {
+                    if (
+                      item1.companyName + item1.areaName ==
+                      item.companyName + item.areaName
+                    ) {
+                      receivable.push({
+                        isHand: item2.isHand,
+                        commissionFeevalue: item2.commissionFeevalue,
+                      });
+                      received.push(item2.readyCommissionFeevalue);
+                      Notreceived.push(item2.noInvoicCommissionFeevalue);
+                      Notsettled.push(item2.settlementAmount);
+                      Notinvoiced.push(item2.noSettlementAmount);
 
-                    item1.receivable = receivable;
-                    item1.received = received;
-                    item1.Notreceived = Notreceived;
-                    item1.Notsettled = Notsettled;
-                    item1.Notinvoiced = Notinvoiced;
-                  }
+                      item1.receivable = receivable;
+                      item1.received = received;
+                      item1.Notreceived = Notreceived;
+                      item1.Notsettled = Notsettled;
+                      item1.Notinvoiced = Notinvoiced;
+                    }
+                  });
                 });
               });
-            });
 
-            this.pagination = {
-              current: res.data.data.current,
-              defaultPageSize: res.data.data.size,
-              total: res.data.data.total,
-            };
+              this.pagination = {
+                current: res.data.data.current,
+                defaultPageSize: res.data.data.size,
+                total: res.data.data.total,
+              };
+            } else {
+              this.loading = false;
+              this.tableList = [];
+              this.titleMessage = {};
+            }
           }
         });
     },

src/pages/personnelManage/channel.vue

@@ -9,7 +9,6 @@
             v-model="formState.time"
             @change="timeChange"
             valueFormat="YYYY-MM-DD"
-            :defaultValue="defaultTime"
           >
             <a-icon slot="suffixIcon" type="calendar" />
           </a-range-picker>
@@ -92,65 +91,73 @@
       </a-form>
     </div>
     <div class="list">
-      <div class="personnel-message">
-        <div
-          v-for="(item, index) in list"
-          :key="item.userId"
-          :class="index % 2 != 0 ? 'list-2' : 'list-1'"
-        >
-          <p>姓名：{{ item.name }}</p>
+      <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>机构归属：{{ item.deptName }}</p>
-          <p>管理人名称：{{ item.leaderName }}</p>
+              <p>员工工号：{{ item.userId }}</p>
+              <p>联系方式：{{ item.mobile }}</p>
+              <p>机构归属：{{ item.deptName }}</p>
+              <p>管理人名称：{{ item.leaderName }}</p>
 
-          <!-- <p>
+              <!-- <p>
             <span>总人力：{{ item.totalManpower || 0 }}</span>
             <span> {{ item.orderManpower || 0 }}</span>
           </p> -->
-          <p>
-            <span>总保费：{{ item.totalPremium || 0 }}</span>
-            <span>单均保费：{{ item.averagePremium || 0 }}</span>
-          </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>
 
-          <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>
+              <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>
-      </div>
-      <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>
@@ -225,6 +232,8 @@ export default {
         .then((res) => {
           //   console.log(res);
           if (res.data.code === 200) {
+            this.loading = false;
+
             this.list = [...res.data.data.records];
             this.pageInfo.total = res.data.data.total;
           }
@@ -321,83 +330,88 @@ export default {
   display: flex;
   flex-wrap: wrap;
   //   justify-content: space-between;
-  > div {
-    width: 23%;
-    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;
+  .ant-col {
+    width: 25%;
+    padding: 0 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 {
+    > div {
       width: 100%;
-      height: 5px;
-      background: #eee;
+      height: auto;
+      // background: #f9faff;
       border-radius: 8px;
-      margin-bottom: 8px;
-      > p {
-        width: 67%;
-        height: 100%;
-        background: #2a55e5;
+      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%;
     }
-    // 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-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-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);
     }
-  }
-  > 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 {

src/pages/personnelManage/channel/message.vue

@@ -80,9 +80,7 @@
         <div
           v-for="(item, index) in userList"
           :key="item.deptId"
-          :class="
-            index < 4 ? 'list-1' : index > 3 && index < 8 ? 'list-2' : 'list-3'
-          "
+          :class="Math.floor((index / 4) % 2) ? 'list-2' : 'list-1'"
         >
           <p>渠道成员：{{ item.name }}</p>
           <p>报价笔数：{{ item.orderNumber || 0 }}</p>
@@ -424,16 +422,26 @@ export default {
         // margin-right: 2%;
       }
       > div.list-1 {
-        background: rgba(135, 229, 42, 0.1);
-        box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
+        background: #fff8f6;
+        box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
         border-radius: 8px 8px 8px 8px;
-        border: 1px solid rgba(135, 229, 42, 0.5);
+        border: 1px solid rgba(248, 127, 44, 0.5);
+        button {
+          background: #f87f2c;
+          color: #fff;
+          border: none;
+        }
       }
       > div.list-2 {
-        background: #fff7ee;
-        box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
+        background: #f7fef4;
+        box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
         border-radius: 8px 8px 8px 8px;
-        border: 1px solid rgba(255, 173, 76, 0.5);
+        border: 1px solid rgba(128, 190, 56, 0.5);
+        button {
+          background: #80be38;
+          color: #fff;
+          border: none;
+        }
       }
       > div.list-3 {
         background: #f9faff;

src/pages/personnelManage/front/personnel.vue

@@ -9,7 +9,6 @@
             v-model="formState.time"
             @change="timeChange"
             valueFormat="YYYY-MM-DD"
-            :defaultValue="defaultTime"
           >
             <a-icon slot="suffixIcon" type="calendar" />
           </a-range-picker>
@@ -32,73 +31,65 @@
       >
         <a-button type="primary" @click="query">查询</a-button>
       </div>
-      <!-- <a-form layout="inline" :model="formState" @finish="handleFinish">
-       
-       
-        <a-form-item
-          label="             "
-          :labelCol="{ span: 5 }"
-          :colon="false"
-          class="form-item-search"
-        >
-          <a-button type="primary">查询</a-button>
-        </a-form-item>
-      </a-form> -->
-      <div class="personnel-message">
-        <div
-          v-for="(item, index) in list"
-          :key="item.userId"
-          :class="
-            index < 3 ? 'list-1' : index > 2 && index < 6 ? 'list-2' : 'list-3'
-          "
-        >
-          <p>姓名：{{ item.name }}</p>
-          <p>机构归属：{{ item.deptName }}</p>
-          <p>
-            <span>总人力：{{ item.totalManpower || 0 }}</span>
-            <span>出单人力：{{ item.orderManpower || 0 }}</span>
-          </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>
+      <a-spin :spinning="loading">
+        <a-row class="personnel-message">
+          <a-col v-for="(item, index) in list" :key="item.userId" :span="5">
+            <div :class="Math.floor((index / 3) % 2) ? 'list-2' : 'list-1'">
+              <p>姓名：{{ item.name }}</p>
+              <p>机构归属：{{ item.deptName }}</p>
+              <p>
+                <span>总人力：{{ item.totalManpower || 0 }}</span>
+                <span>出单人力：{{ item.orderManpower || 0 }}</span>
+              </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="['9', '18', '27', '36']"
+          />
         </div>
-      </div>
-      <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="['9', '18', '27', '36']"
-        />
-      </div>
+      </a-spin>
     </div>
     <div class="back-line-message">
       <div>
@@ -222,7 +213,7 @@
   
 <script>
 import fromRow from "@/components/form/FormRow";
-
+import moment from "moment";
 export default {
   components: {
     fromRow,
@@ -238,6 +229,10 @@ export default {
         name: undefined,
         userCode: undefined,
         phoneNumber: undefined,
+        createtimeStart: moment().format("YYYY-MM-DD"),
+        createtimeEnd: moment().format("YYYY-MM-DD"),
+        time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+        days: undefined,
       },
       rankForm: {
         provinceId: "140000",
@@ -258,6 +253,7 @@ export default {
       cityList: [],
       countyList: [],
       teamList: [],
+      loading: true,
     };
   },
   watch: {
@@ -278,6 +274,13 @@ export default {
     this.getRankingList();
   },
   methods: {
+    timeChange(val) {
+      this.formState.createtimeStart = val[0];
+      this.formState.createtimeEnd = val[1];
+      this.formState.days = undefined;
+
+      this.getList();
+    },
     query() {
       this.pageInfo.pageNum = 1;
       this.pageInfo.pageSize = 9;
@@ -331,7 +334,6 @@ export default {
     },
     //分页事件
     pageChange(page, pageSize) {
-      console.log(page, pageSize);
       this.pageInfo.pageNum = page;
       this.pageInfo.pageSize = pageSize;
 
@@ -339,6 +341,7 @@ export default {
     },
     //获取成员列表
     getList() {
+      this.loading = true;
       this.$API.personnel
         .getyQxFrontlineAgentList({
           pageNum: this.pageInfo.pageNum,
@@ -348,6 +351,8 @@ export default {
         })
         .then((res) => {
           //   console.log(res);
+          this.loading = false;
+
           if (res.data.code === 200) {
             this.list = res.data.data.records;
             this.pageInfo.total = res.data.data.total;
@@ -438,61 +443,78 @@ export default {
       display: flex;
       flex-wrap: wrap;
       // justify-content: space-evenly;
-      > div {
-        width: 30%;
-        height: auto;
-        background: #f9faff;
-        border-radius: 8px;
-        border: 1px solid #2a55e5;
-        padding: 15px;
-        box-sizing: border-box;
+      > .ant-col {
+        flex: none;
+        width: 33%;
         margin-bottom: 15px;
-        position: relative;
-        margin-right: 3%;
-        p {
-          display: flex;
-          justify-content: space-between;
-        }
-        p:nth-child(2) {
-          width: 80%;
+        padding: 0 10px;
+        box-sizing: border-box;
+        > div {
+          width: 100%;
+          height: auto;
+          background: #f9faff;
+          border-radius: 8px;
+          border: 1px solid #2a55e5;
+          padding: 15px;
+          box-sizing: border-box;
+          margin-bottom: 15px;
+          position: relative;
+          margin-right: 3%;
+          p {
+            display: flex;
+            justify-content: space-between;
+          }
+          p:nth-child(2) {
+            width: 80%;
+          }
+          p:last-child {
+            margin: 0;
+            justify-content: flex-end;
+            // 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%;
         }
-        p:last-child {
-          margin: 0;
-          justify-content: flex-end;
-          // text-align: right;
+        > 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 {
-          width: 56px;
-          height: 56px;
-          position: absolute;
-          top: 12px;
-          right: 15px;
-          border-radius: 50%;
-          overflow: hidden;
-          img {
-            width: 100%;
-            height: 100%;
+        > 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;
           }
         }
-        // margin-right: 2%;
-      }
-      > div.list-1 {
-        background: rgba(135, 229, 42, 0.1);
-        box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
-        border-radius: 8px 8px 8px 8px;
-        border: 1px solid rgba(135, 229, 42, 0.5);
-      }
-      > div.list-2 {
-        background: #fff7ee;
-        box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
-        border-radius: 8px 8px 8px 8px;
-        border: 1px solid rgba(255, 173, 76, 0.5);
-      }
-      > 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);
+        > 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 {

src/pages/personnelManage/front/resources.vue

@@ -85,62 +85,64 @@
       </a-form>
     </div>
     <div class="list">
-      <div class="personnel-message">
-        <div
-          v-for="(item, index) in list"
-          :key="item.userId"
-          :class="
-            index < 5 ? 'list-1' : index > 4 && index < 10 ? 'list-2' : 'list-3'
-          "
-        >
-          <p>姓名：{{ item.name }}</p>
+      <a-spin :spinning="loading">
+        <a-row class="personnel-message">
+          <a-col v-for="(item, index) in list" :key="item.userId" :span="5">
+            <div :class="Math.floor((index / 5) % 2) ? 'list-2' : 'list-1'">
+              <p>姓名：{{ item.name }}</p>
+
+              <p>
+                <span>总人力：{{ item.totalManpower || 0 }}</span>
+              </p>
+              <p>
+                <span>总保费：{{ item.totalPremium || 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>
-            <span>总人力：{{ item.totalManpower || 0 }}</span>
-          </p>
-          <p>
-            <span>总保费：{{ item.totalPremium || 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>
-          <!-- <div class="progress">
-            <p></p>
-          </div> -->
-          <p>
-            <a-button type="primary" @click="teamMessage(item)">详情</a-button>
-          </p>
+              <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="['15', '30', '45', '60']"
+          />
         </div>
-      </div>
-      <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="['9', '18', '27', '36']"
-        />
-      </div>
+      </a-spin>
     </div>
   </div>
 </template>
@@ -179,7 +181,7 @@ export default {
         total: 0,
       },
       list: [],
-      loading: false,
+      loading: true,
     };
   },
   watch: {
@@ -206,6 +208,7 @@ export default {
 
     //获取成员列表
     getList() {
+      this.loading = true;
       this.$API.personnel
         .getyQxFrontlineAgentList({
           pageNum: this.pageInfo.pageNum,
@@ -215,6 +218,8 @@ export default {
         })
         .then((res) => {
           //   console.log(res);
+          this.loading = false;
+
           if (res.data.code === 200) {
             this.list = res.data.data.records;
             this.pageInfo.total = res.data.data.total;
@@ -308,19 +313,26 @@ export default {
   box-sizing: border-box;
 }
 .personnel-message {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-  > div {
-    width: 18%;
-    height: auto;
-    background: #f9faff;
-    border-radius: 8px;
-    border: 1px solid #2a55e5;
-    padding: 15px;
-    box-sizing: border-box;
+  // display: flex;
+  // flex-wrap: wrap;
+  // justify-content: space-between;
+  > .ant-col {
+    flex: none;
+    width: 20%;
     margin-bottom: 15px;
-    position: relative;
+    padding: 0 15px;
+    box-sizing: border-box;
+    > div {
+      flex: 100%;
+
+      background: #f9faff;
+      border-radius: 8px;
+      border: 1px solid #2a55e5;
+      padding: 15px;
+      box-sizing: border-box;
+      // margin: 0 15px 15px 0;
+      position: relative;
+    }
     p {
       display: flex;
       justify-content: flex-end;
@@ -358,19 +370,29 @@ export default {
     }
     // margin-right: 2%;
   }
-  > div.list-1 {
-    background: rgba(135, 229, 42, 0.1);
-    box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
+  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(135, 229, 42, 0.5);
+    border: 1px solid rgba(248, 127, 44, 0.5);
+    button {
+      background: #f87f2c;
+      color: #fff;
+      border: none;
+    }
   }
-  > div.list-2 {
-    background: #fff7ee;
-    box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
+  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(255, 173, 76, 0.5);
+    border: 1px solid rgba(128, 190, 56, 0.5);
+    button {
+      background: #80be38;
+      color: #fff;
+      border: none;
+    }
   }
-  > div.list-3 {
+  div.list-3 {
     background: #f9faff;
     box-shadow: 0px 2px 8px 0px rgba(42, 85, 229, 0.15);
     border-radius: 8px 8px 8px 8px;

src/pages/personnelManage/front/teammanage.vue

@@ -60,65 +60,69 @@
           <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="
-            index < 4 ? 'list-1' : index > 3 && index < 8 ? 'list-2' : 'list-3'
-          "
-        >
-          <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="openDrawer(item)">详情</a-button>
-          </p>
+      <a-spin :spinning="loading">
+        <a-row class="personnel-message">
+          <a-col v-for="(item, index) in userList" :key="item.deptId" :span="6">
+            <div :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="openDrawer(item)"
+                  >详情</a-button
+                >
+              </p>
+            </div>
+          </a-col>
+        </a-row>
+        <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>
-      <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>
+      </a-spin>
     </div>
     <a-drawer
       :width="500"
@@ -227,6 +231,7 @@ export default {
         total: 0,
       },
       teamList: [],
+      loading: true,
     };
   },
   watch: {
@@ -270,6 +275,7 @@ export default {
       this.getList();
     },
     getList() {
+      this.loading = true;
       this.$API.personnel
         .getTeamUserList({
           userId: this.$route.query.userId,
@@ -279,6 +285,8 @@ export default {
           type: this.teamTab,
         })
         .then((res) => {
+          this.loading = false;
+
           if (res.data.code === 200) {
             this.userList = [...res.data.data.records];
             this.pageInfo.total = res.data.data.total;
@@ -395,62 +403,79 @@ export default {
       }
     }
     .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;
+      // display: flex;
+      // flex-wrap: wrap;
+      // // justify-content: space-evenly;
+      // margin-top: 10px;
+      > .ant-col {
+        flex: none;
+        width: 25%;
         margin-bottom: 15px;
-        position: relative;
-        margin-right: 2%;
-        p {
-          display: flex;
-          justify-content: space-between;
+        padding: 0 10px;
+        box-sizing: border-box;
+        > div {
+          width: 100%;
+          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: flex-end;
+            // 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%;
         }
-        p:last-child {
-          margin: 0;
-          justify-content: flex-end;
-          // text-align: right;
+        > 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 {
-          width: 56px;
-          height: 56px;
-          position: absolute;
-          top: 12px;
-          right: 15px;
-          border-radius: 50%;
-          overflow: hidden;
-          img {
-            width: 100%;
-            height: 100%;
+        > 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;
           }
         }
-        // margin-right: 2%;
-      }
-      > div.list-1 {
-        background: rgba(135, 229, 42, 0.1);
-        box-shadow: 0px 2px 8px 0px rgba(135, 229, 42, 0.15);
-        border-radius: 8px 8px 8px 8px;
-        border: 1px solid rgba(135, 229, 42, 0.5);
-      }
-      > div.list-2 {
-        background: #fff7ee;
-        box-shadow: 0px 2px 8px 0px rgba(255, 173, 76, 0.15);
-        border-radius: 8px 8px 8px 8px;
-        border: 1px solid rgba(255, 173, 76, 0.5);
-      }
-      > 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);
+        > 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 {

src/pages/sales/index.vue

@@ -0,0 +1,370 @@
+<template>
+  <div class="quote">
+    <div class="quote-tree">
+      <div><h2>部门所属</h2></div>
+      <div>
+        <!-- <a-tree  :tree-data="treeData" /> -->
+        <tree @getList="getVerification"></tree>
+      </div>
+    </div>
+    <div class="back-line-main">
+      <div class="back-line-header">
+        <div class="back-line-header-title">
+          <h2>财务应收</h2>
+          <div>
+            <span>时间筛选</span>
+            <a-range-picker
+              @change="onChangeTime"
+              v-model="formState.time"
+              value-format="YYYY-MM-DD"
+            >
+              <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-radio-group
+              default-value="0"
+              button-style="solid"
+              v-model="formState.dateType"
+              @change="getVerification()"
+            >
+              <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>
+      </div>
+      <standard-table
+        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>
+    </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: "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: {
+        whole: "",
+        cityId: "",
+        countyId: "",
+        houseId: "",
+        provinceId: "",
+        dateType: "",
+        time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+        beginDate: moment().format("YYYY-MM-DD"),
+        endDate: 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: [],
+      treeData: [
+        { title: "Expand to load", key: "0" },
+        { title: "Expand to load", key: "1" },
+        { title: "Tree Node", key: "2", isLeaf: true },
+      ],
+    };
+  },
+  mounted() {
+    this.getVerification();
+    // setTimeout(() => {
+    // }, 1000);
+  },
+  methods: {
+    onLoadData(treeNode) {
+      return new Promise((resolve) => {
+        if (treeNode.dataRef.children) {
+          resolve();
+          return;
+        }
+        setTimeout(() => {
+          treeNode.dataRef.children = [
+            { title: "Child Node", key: `${treeNode.eventKey}-0` },
+            { title: "Child Node", key: `${treeNode.eventKey}-1` },
+          ];
+          this.treeData = [...this.treeData];
+          resolve();
+        }, 1000);
+      });
+    },
+    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);
+    },
+
+    getVerification() {
+      this.loading = true;
+
+      this.$API.quote
+        .getQuoteList({
+          pageNum: this.pagination.current,
+          pageSize: this.pagination.defaultPageSize,
+          dateType: this.formState.dateType,
+          beginDate: this.formState.beginDate,
+          endDate: this.formState.endDate,
+          // provinceId: this.formState.provinceId,
+          // cityId: this.formState.cityId,
+          // countyId: this.formState.countyId,
+          // houseId: this.formState.houseId,
+        })
+        .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,
+            };
+          }
+        });
+    },
+    onClear() {
+      this.$message.info("您清空了勾选的所有行");
+    },
+
+    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.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 {
+      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/pages/task/agent.vue

@@ -51,7 +51,12 @@
         </div>
       </div>
 
-      <fromRow :formState="formState" @getList="getBackLinePersonnel"></fromRow>
+      <fromRow
+        :formState="formState"
+        @getList="getBackLinePersonnel"
+        :exportExcel="true"
+        @exportList="exportList"
+      ></fromRow>
     </div>
     <standard-table
       bordered
@@ -219,6 +224,7 @@ export default {
       cityList: [],
       areaList: [],
       storeList: [],
+      process: process.env.VUE_APP_API_BASE_URL,
     };
   },
   watch: {
@@ -233,6 +239,27 @@ export default {
     // }, 1000);
   },
   methods: {
+    exportList() {
+      delete this.formState.time;
+      this.$API.task
+        .exportAgentlList({
+          ...this.formState,
+        })
+        .then((res) => {
+          console.log(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);
+          }
+        });
+    },
     onChangeTime(val) {
       // console.log(val);
       this.formState.beginDate = val[0];

src/pages/task/channel.vue

@@ -50,7 +50,12 @@
           </a-radio-group>
         </div>
       </div>
-      <fromRow :formState="formState" @getList="getList"></fromRow>
+      <fromRow
+        :formState="formState"
+        @getList="getList"
+        :exportExcel="true"
+        @exportList="exportList"
+      ></fromRow>
     </div>
     <standard-table
       bordered
@@ -215,6 +220,7 @@ export default {
       cityList: [],
       areaList: [],
       storeList: [],
+      process: process.env.VUE_APP_API_BASE_URL,
     };
   },
   watch: {
@@ -232,7 +238,25 @@ export default {
     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

src/pages/task/insurance.vue

@@ -54,7 +54,7 @@
         <a-button shape="circle" icon="left" class="left btn" @click="prev">
         </a-button>
         <a-col
-          :span="6"
+          :span="5"
           v-for="item in companyList.slice(
             (this.companyPage.page - 1) * this.companyPage.size,
             this.companyPage.size * this.companyPage.page
@@ -79,6 +79,9 @@
         </a-button>
       </a-row>
     </div>
+    <div class="btn-opreation">
+      <a-button type="primary" @click="exportList">导出</a-button>
+    </div>
     <standard-table
       bordered
       :columns="columns"
@@ -200,11 +203,12 @@ export default {
 
       companyPage: {
         page: 1,
-        size: 12,
+        size: 15,
         total: 0,
         perPage: 0,
       },
       companyId: "",
+      process: process.env.VUE_APP_API_BASE_URL,
     };
   },
   watch: {
@@ -220,6 +224,26 @@ export default {
     this.getCompanyList();
   },
   methods: {
+    exportList() {
+      delete this.formState.time;
+      this.$API.task
+        .exportInsurancelList({
+          ...this.formState,
+        })
+        .then((res) => {
+          console.log(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);
+          }
+        });
+    },
     prev() {
       if (this.companyPage.page != 1) this.companyPage.page -= 1;
     },
@@ -359,6 +383,7 @@ export default {
         padding: 5px 10px;
         margin-bottom: 15px;
         box-sizing: border-box;
+        width: 20%;
       }
       .insurer {
         width: 100%;
@@ -443,4 +468,11 @@ export default {
     }
   }
 }
+.btn-opreation {
+  display: flex;
+  justify-content: flex-end;
+
+  padding: 0 15px;
+  box-sizing: border-box;
+}
 </style>

src/services/task.js

@@ -14,10 +14,41 @@ export async function getCompanyList(data) {
 export async function getAgentList(data) {
     return request("/taskStatistics/agentStatisticsQueryPage", METHOD.POST, data)
 }
+//导出渠道数据
+export async function exportChannelList(data) {
+    return request("/taskStatistics/channelExcel", METHOD.POST, data,
+        {
+            responseType: 'blob'
+        }
+    )
+}
+//导出代理人数据
+export async function exportAgentlList(data) {
+    return request("/taskStatistics/agentExcel", METHOD.POST, data,
+        {
+            responseType: 'blob'
+        }
+    )
+}
+
+//导出保险公司数据
+export async function exportInsurancelList(data) {
+    return request("/taskStatistics/insuranceCompanyExcel", METHOD.POST, data,
+        {
+            responseType: 'blob'
+        }
+    )
+}
+
+
+
 
 
 export default {
     getTaskStatistics,
     getCompanyList,
-    getAgentList
+    getAgentList,
+    exportChannelList,
+    exportAgentlList,
+    exportInsurancelList
 }

src/utils/request.js

@@ -134,9 +134,9 @@ function loadInterceptors(interceptors, options) {
     )
   })
   // 加载响应拦截器
-  response.forEach(item => {
+  response.forEach(() => {
     // let { onFulfilled, onRejected } = item
-    console.log(item)
+
     // if (!onFulfilled || typeof onFulfilled !== 'function') {
     //   onFulfilled = response => response
     // }