fix:业务数据新增页面

src/layouts/header/AdminHeader.vue

@@ -150,12 +150,36 @@ export default {
         .forEach((route) => {
           const path = route.path;
 
+          if (route.name == "保费详情") {
+            switch (path.split("/message")[0]) {
+              case "/business/sales":
+                breadcrumb.push({
+                  path: path.split("/message")[0],
+                  name: "电销",
+                });
+                break;
+              case "/business/agent":
+                breadcrumb.push({
+                  path: path.split("/message")[0],
+                  name: "代理人",
+                });
+                break;
+              case "/business/channel":
+                breadcrumb.push({
+                  path: path.split("/message")[0],
+                  name: "渠道",
+                });
+                break;
+            }
+          }
+
           breadcrumb.push({ path: path, name: route.name });
         });
       let pageTitle = this.page && this.page.title;
       if (this.customTitle || pageTitle) {
         breadcrumb[breadcrumb.length - 1] = this.customTitle || pageTitle;
       }
+      breadcrumb.shift();
       // console.log(breadcrumb)
       return breadcrumb;
     },

src/pages/business/agent.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="quote">
     <div class="quote-tree" style="border-radius: 8px">
-      <div><h2>部门所属</h2></div>
+      <div><h2>组织树</h2></div>
       <div>
         <!-- <a-tree  :tree-data="treeData" /> -->
         <tree @getList="getVerification"></tree>
@@ -77,7 +77,7 @@
       </div>
       <div style="background-color: #fff; margin-top: 15px">
         <div class="table-title">
-          <h2>总报价</h2>
+          <h2>代理人</h2>
           <div>
             <span>时间筛选</span>
             <a-range-picker
@@ -103,7 +103,7 @@
                     (formState.endDate = '')
                 "
               >
-                近1月
+                当天
               </a-radio-button>
               <a-radio-button
                 value="2"
@@ -113,7 +113,7 @@
                     (formState.endDate = '')
                 "
               >
-                近3月
+                近7天
               </a-radio-button>
               <a-radio-button
                 value="3"
@@ -123,7 +123,7 @@
                     (formState.endDate = '')
                 "
               >
-                近半年
+                近30天
               </a-radio-button>
             </a-radio-group>
           </div>
@@ -422,27 +422,46 @@ export default {
           flex-direction: column;
           padding: 10px;
           box-sizing: border-box;
-          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;
 
           > dd {
             display: flex;
             // align-items: center;
+            justify-content: flex-end;
             margin: 0;
             font-family: PingFang SC, PingFang SC;
             font-weight: 500;
-            font-size: 18px;
-            color: rgba(0, 0, 0, 0.85);
+            font-size: 24px;
+            // color: rgba(0, 0, 0, 0.85);
             // padding-left: 15px;
             box-sizing: border-box;
           }
         }
+        > dl:first-child {
+          background: url("../../assets/img/business1.png");
+          color: #11a6d3;
+        }
+        > dl:nth-child(2) {
+          background: url("../../assets/img/business2.png");
+          color: #f87f2c;
+        }
+        > dl:nth-child(3) {
+          background: url("../../assets/img/business3.png");
+          color: #fab600;
+        }
+        > dl:nth-child(4) {
+          background: url("../../assets/img/business4.png");
+          color: #80be38;
+        }
+        > dl:nth-child(5) {
+          background: url("../../assets/img/business5.png");
+          color: #906cef;
+        }
+        > dl:nth-child(6) {
+          background: url("../../assets/img/business6.png");
+          color: #47a2eb;
+        }
       }
       span {
         display: block;

src/pages/business/channel.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="quote">
     <div class="quote-tree" style="border-radius: 8px">
-      <div><h2>部门所属</h2></div>
+      <div><h2>组织树</h2></div>
       <div>
         <!-- <a-tree  :tree-data="treeData" /> -->
         <tree @getList="getVerification"></tree>
@@ -13,23 +13,56 @@
           <h2>合计</h2>
           <div>
             <dl>
-              <dt><img src="../../assets/img/car.png" alt="" /></dt>
+              <dt><span>签单保费</span></dt>
               <dd>
-                <span>车辆数</span>
                 <span>{{ BigOrder.frameno }}</span>
               </dd>
             </dl>
             <dl>
-              <dt><img src="../../assets/img/order.png" alt="" /></dt>
+              <dt><span>签单保费总占比</span></dt>
               <dd>
-                <span>订单数数</span>
                 <span>{{ BigOrder.orderNumber || 0 }}</span>
               </dd>
             </dl>
             <dl>
-              <dt><img src="../../assets/img/orderMoney.png" alt="" /></dt>
+              <dt><span>交强险保费</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>车船税</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>商业保险费</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>非车保险费</span></dt>
               <dd>
-                <span>成交率</span>
                 <span>
                   {{
                     BigOrder.closeRate
@@ -44,7 +77,7 @@
       </div>
       <div style="background-color: #fff; margin-top: 15px">
         <div class="table-title">
-          <h2>总报价</h2>
+          <h2>渠道</h2>
           <div>
             <span>时间筛选</span>
             <a-range-picker
@@ -70,7 +103,7 @@
                     (formState.endDate = '')
                 "
               >
-                近1月
+                当天
               </a-radio-button>
               <a-radio-button
                 value="2"
@@ -80,7 +113,7 @@
                     (formState.endDate = '')
                 "
               >
-                近3月
+                近7天
               </a-radio-button>
               <a-radio-button
                 value="3"
@@ -90,71 +123,54 @@
                     (formState.endDate = '')
                 "
               >
-                近半年
+                近30天
               </a-radio-button>
             </a-radio-group>
           </div>
         </div>
         <a-form
           layout="inline"
-          :class="className"
           :model="formState"
           style="padding: 0 0 0 15px; box-sizing: border-box"
         >
           <a-form-item
-            label="业务员工号"
+            label="业务员姓名"
             :labelCol="{ span: 8 }"
             :colon="false"
           >
             <a-input
-              placeholder="请输入业务员工号"
-              v-model="formState.userId"
+              placeholder="请输入业务员姓名"
+              v-model="formState.userName"
               allowClear
+              style="width: 200px"
             ></a-input>
           </a-form-item>
           <a-form-item
-            label="业务员姓名"
+            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"
+              placeholder="请输入业务员工号"
+              v-model="formState.userId"
+              style="width: 200px"
               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
+            style="
+              flex: 1;
+              display: flex;
+              justify-content: flex-end;
+              padding-right: 15px;
+              box-sizing: border-box;
+              align-items: flex-end;
+            "
+          >
+            <a-button type="primary" @click="getList">查询</a-button>
           </a-form-item>
         </a-form>
-        <div
-          style="
-            display: flex;
-            justify-content: flex-end;
-            padding-right: 15px;
-            box-sizing: border-box;
-          "
-        >
-          <a-button type="primary" @click="getList">查询</a-button>
-        </div>
+
         <standard-table
           bordered
           :columns="columns"
@@ -170,6 +186,11 @@
           <div slot="rate" slot-scope="{ text }">
             {{ text != "-" ? (text * 100).toFixed(2) + "%" : text }}
           </div>
+          <div slot="operation" slot-scope="{ text, record }">
+            <a-button type="link" @click="watchMessage({ text, record })"
+              >详情</a-button
+            >
+          </div>
         </standard-table>
       </div>
     </div>
@@ -184,29 +205,41 @@ import moment from "moment";
 
 const columns = [
   {
-    title: "车牌号",
+    title: "姓名",
     dataIndex: "licenseno",
   },
 
   {
-    title: "车架号",
+    title: "工号",
     dataIndex: "frameno",
     // scopedSlots: { customRender: "parterCompanyName" },
   },
 
   {
-    title: "订单数量",
+    title: "签单保费",
     dataIndex: "orderNumber",
   },
   {
-    title: "成交率",
+    title: "交强险保费",
     dataIndex: "closeRate",
-    scopedSlots: { customRender: "rate" },
   },
   {
-    title: "承保公司",
+    title: "车船税",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "商业险保费",
     dataIndex: "namesimple",
   },
+  {
+    title: "非车险保费",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "操作",
+    dataIndex: "operation",
+    scopedSlots: { customRender: "operation" },
+  },
 ];
 
 export default {
@@ -381,35 +414,54 @@ export default {
         justify-content: space-between;
         > dl {
           flex: none;
-          width: 271px;
-          height: 61px;
+          width: 180px;
+          height: 80px;
           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);
+          //   align-items: center;
+          justify-content: space-between;
+          flex-direction: column;
+          padding: 10px;
+          box-sizing: border-box;
+
           border-radius: 4px 4px 4px 4px;
-          border: 1px solid #ffffff;
 
-          img {
-            width: 44px;
-            height: auto;
-          }
           > dd {
             display: flex;
-            align-items: center;
+            // align-items: center;
+            justify-content: flex-end;
             margin: 0;
             font-family: PingFang SC, PingFang SC;
             font-weight: 500;
-            font-size: 18px;
-            color: rgba(0, 0, 0, 0.85);
-            padding-left: 15px;
+            font-size: 24px;
+            // color: rgba(0, 0, 0, 0.85);
+            // padding-left: 15px;
             box-sizing: border-box;
           }
         }
+        > dl:first-child {
+          background: url("../../assets/img/business1.png");
+          color: #11a6d3;
+        }
+        > dl:nth-child(2) {
+          background: url("../../assets/img/business2.png");
+          color: #f87f2c;
+        }
+        > dl:nth-child(3) {
+          background: url("../../assets/img/business3.png");
+          color: #fab600;
+        }
+        > dl:nth-child(4) {
+          background: url("../../assets/img/business4.png");
+          color: #80be38;
+        }
+        > dl:nth-child(5) {
+          background: url("../../assets/img/business5.png");
+          color: #906cef;
+        }
+        > dl:nth-child(6) {
+          background: url("../../assets/img/business6.png");
+          color: #47a2eb;
+        }
       }
       span {
         display: block;
@@ -426,7 +478,7 @@ export default {
     .ant-form {
       display: flex;
       > .ant-form-item {
-        flex: 1;
+        flex: none;
         /deep/.ant-form-item-control-wrapper {
           width: 100%;
         }

src/pages/business/message.vue

@@ -0,0 +1,511 @@
+<template>
+  <div class="quote">
+    <!-- <div class="quote-tree" style="border-radius: 8px">
+      <div><h2>组织树</h2></div>
+      <div>
+      
+        
+      </div>
+    </div> -->
+    <div class="back-line-main">
+      <div class="back-line-header">
+        <div class="back-line-header-title">
+          <h2>合计</h2>
+          <div>
+            <dl>
+              <dt><span>签单保费</span></dt>
+              <dd>
+                <span>{{ BigOrder.frameno }}</span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>签单保费总占比</span></dt>
+              <dd>
+                <span>{{ BigOrder.orderNumber || 0 }}</span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>交强险保费</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>车船税</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>商业保险费</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>非车保险费</span></dt>
+              <dd>
+                <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>
+            <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 = '')
+                "
+              >
+                当天
+              </a-radio-button>
+              <a-radio-button
+                value="2"
+                @click="
+                  (formState.time = []),
+                    (formState.beginDate = ''),
+                    (formState.endDate = '')
+                "
+              >
+                近7天
+              </a-radio-button>
+              <a-radio-button
+                value="3"
+                @click="
+                  (formState.time = []),
+                    (formState.beginDate = ''),
+                    (formState.endDate = '')
+                "
+              >
+                近30天
+              </a-radio-button>
+            </a-radio-group>
+          </div>
+        </div>
+        <a-form
+          layout="inline"
+          :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.userName"
+              allowClear
+              style="width: 200px"
+            ></a-input>
+          </a-form-item>
+          <a-form-item
+            label="业务员工号"
+            :labelCol="{ span: 8 }"
+            :colon="false"
+          >
+            <a-input
+              placeholder="请输入业务员工号"
+              v-model="formState.userId"
+              style="width: 200px"
+              allowClear
+            ></a-input>
+          </a-form-item>
+          <a-form-item
+            style="
+              flex: 1;
+              display: flex;
+              justify-content: flex-end;
+              padding-right: 15px;
+              box-sizing: border-box;
+              align-items: flex-end;
+            "
+          >
+            <a-button type="primary" @click="getList">查询</a-button>
+          </a-form-item>
+        </a-form>
+
+        <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>
+          <div slot="operation" slot-scope="{ text, record }">
+            <a-button type="link" @click="watchMessage({ text, record })"
+              >详情</a-button
+            >
+          </div>
+        </standard-table>
+      </div>
+    </div>
+  </div>
+</template>
+            
+    <script>
+import StandardTable from "@/components/table/StandardTable";
+// import mixin from "../../minins/mixin";
+
+import moment from "moment";
+
+const columns = [
+  {
+    title: "姓名",
+    dataIndex: "licenseno",
+  },
+
+  {
+    title: "工号",
+    dataIndex: "frameno",
+    // scopedSlots: { customRender: "parterCompanyName" },
+  },
+
+  {
+    title: "签单保费",
+    dataIndex: "orderNumber",
+  },
+  {
+    title: "交强险保费",
+    dataIndex: "closeRate",
+  },
+  {
+    title: "车船税",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "商业险保费",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "非车险保费",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "操作",
+    dataIndex: "operation",
+    scopedSlots: { customRender: "operation" },
+  },
+];
+
+export default {
+  components: {
+    StandardTable,
+  },
+  //   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: "",
+      },
+      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 },
+      ],
+      BigOrder: {},
+    };
+  },
+  mounted() {
+    this.getVerification();
+    // setTimeout(() => {
+    // }, 1000);
+  },
+  methods: {
+    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;
+
+      this.$API.quote
+        .getBigOrderList({
+          pageNum: this.pagination.current,
+          pageSize: this.pagination.defaultPageSize,
+          ...this.formState,
+        })
+        .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({
+          // pageNum: this.pagination.current,
+          // pageSize: this.pagination.defaultPageSize,
+          ...this.formState,
+        })
+        .then((res) => {
+          if (res.data.code === 200) {
+            console.log(res);
+            this.BigOrder = { ...res.data.data };
+          }
+        });
+    },
+    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 {
+      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: 180px;
+          height: 80px;
+          display: flex;
+          //   align-items: center;
+          justify-content: space-between;
+          flex-direction: column;
+          padding: 10px;
+          box-sizing: border-box;
+
+          border-radius: 4px 4px 4px 4px;
+
+          > dd {
+            display: flex;
+            // align-items: center;
+            justify-content: flex-end;
+            margin: 0;
+            font-family: PingFang SC, PingFang SC;
+            font-weight: 500;
+            font-size: 24px;
+            // color: rgba(0, 0, 0, 0.85);
+            // padding-left: 15px;
+            box-sizing: border-box;
+          }
+        }
+        > dl:first-child {
+          background: url("../../assets/img/business1.png");
+          color: #11a6d3;
+        }
+        > dl:nth-child(2) {
+          background: url("../../assets/img/business2.png");
+          color: #f87f2c;
+        }
+        > dl:nth-child(3) {
+          background: url("../../assets/img/business3.png");
+          color: #fab600;
+        }
+        > dl:nth-child(4) {
+          background: url("../../assets/img/business4.png");
+          color: #80be38;
+        }
+        > dl:nth-child(5) {
+          background: url("../../assets/img/business5.png");
+          color: #906cef;
+        }
+        > dl:nth-child(6) {
+          background: url("../../assets/img/business6.png");
+          color: #47a2eb;
+        }
+      }
+      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: none;
+        /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;
+    }
+  }
+}
+</style>

src/pages/business/sales.vue

@@ -1,9 +1,8 @@
 <template>
   <div class="quote">
     <div class="quote-tree" style="border-radius: 8px">
-      <div><h2>部门所属</h2></div>
+      <div><h2>组织树</h2></div>
       <div>
-        <!-- <a-tree  :tree-data="treeData" /> -->
         <tree @getList="getVerification"></tree>
       </div>
     </div>
@@ -13,23 +12,56 @@
           <h2>合计</h2>
           <div>
             <dl>
-              <dt><img src="../../assets/img/car.png" alt="" /></dt>
+              <dt><span>签单保费</span></dt>
               <dd>
-                <span>车辆数</span>
                 <span>{{ BigOrder.frameno }}</span>
               </dd>
             </dl>
             <dl>
-              <dt><img src="../../assets/img/order.png" alt="" /></dt>
+              <dt><span>签单保费总占比</span></dt>
               <dd>
-                <span>订单数数</span>
                 <span>{{ BigOrder.orderNumber || 0 }}</span>
               </dd>
             </dl>
             <dl>
-              <dt><img src="../../assets/img/orderMoney.png" alt="" /></dt>
+              <dt><span>交强险保费</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>车船税</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>商业保险费</span></dt>
+              <dd>
+                <span>
+                  {{
+                    BigOrder.closeRate
+                      ? (BigOrder.closeRate * 100).toFixed(2) + "%"
+                      : 0
+                  }}
+                </span>
+              </dd>
+            </dl>
+            <dl>
+              <dt><span>非车保险费</span></dt>
               <dd>
-                <span>成交率</span>
                 <span>
                   {{
                     BigOrder.closeRate
@@ -44,7 +76,7 @@
       </div>
       <div style="background-color: #fff; margin-top: 15px">
         <div class="table-title">
-          <h2>总报价</h2>
+          <h2>电销</h2>
           <div>
             <span>时间筛选</span>
             <a-range-picker
@@ -70,7 +102,7 @@
                     (formState.endDate = '')
                 "
               >
-                近1月
+                当天
               </a-radio-button>
               <a-radio-button
                 value="2"
@@ -80,7 +112,7 @@
                     (formState.endDate = '')
                 "
               >
-                近3月
+                近7天
               </a-radio-button>
               <a-radio-button
                 value="3"
@@ -90,71 +122,54 @@
                     (formState.endDate = '')
                 "
               >
-                近半年
+                近30天
               </a-radio-button>
             </a-radio-group>
           </div>
         </div>
         <a-form
           layout="inline"
-          :class="className"
           :model="formState"
           style="padding: 0 0 0 15px; box-sizing: border-box"
         >
           <a-form-item
-            label="业务员工号"
+            label="业务员姓名"
             :labelCol="{ span: 8 }"
             :colon="false"
           >
             <a-input
-              placeholder="请输入业务员工号"
-              v-model="formState.userId"
+              placeholder="请输入业务员姓名"
+              v-model="formState.userName"
               allowClear
+              style="width: 200px"
             ></a-input>
           </a-form-item>
           <a-form-item
-            label="业务员姓名"
+            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"
+              placeholder="请输入业务员工号"
+              v-model="formState.userId"
+              style="width: 200px"
               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
+            style="
+              flex: 1;
+              display: flex;
+              justify-content: flex-end;
+              padding-right: 15px;
+              box-sizing: border-box;
+              align-items: flex-end;
+            "
+          >
+            <a-button type="primary" @click="getList">查询</a-button>
           </a-form-item>
         </a-form>
-        <div
-          style="
-            display: flex;
-            justify-content: flex-end;
-            padding-right: 15px;
-            box-sizing: border-box;
-          "
-        >
-          <a-button type="primary" @click="getList">查询</a-button>
-        </div>
+
         <standard-table
           bordered
           :columns="columns"
@@ -170,6 +185,11 @@
           <div slot="rate" slot-scope="{ text }">
             {{ text != "-" ? (text * 100).toFixed(2) + "%" : text }}
           </div>
+          <div slot="operation" slot-scope="{ text, record }">
+            <a-button type="link" @click="watchMessage({ text, record })"
+              >详情</a-button
+            >
+          </div>
         </standard-table>
       </div>
     </div>
@@ -184,29 +204,41 @@ import moment from "moment";
 
 const columns = [
   {
-    title: "车牌号",
+    title: "姓名",
     dataIndex: "licenseno",
   },
 
   {
-    title: "车架号",
+    title: "工号",
     dataIndex: "frameno",
     // scopedSlots: { customRender: "parterCompanyName" },
   },
 
   {
-    title: "订单数量",
+    title: "签单保费",
     dataIndex: "orderNumber",
   },
   {
-    title: "成交率",
+    title: "交强险保费",
     dataIndex: "closeRate",
-    scopedSlots: { customRender: "rate" },
   },
   {
-    title: "承保公司",
+    title: "车船税",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "商业险保费",
     dataIndex: "namesimple",
   },
+  {
+    title: "非车险保费",
+    dataIndex: "namesimple",
+  },
+  {
+    title: "操作",
+    dataIndex: "operation",
+    scopedSlots: { customRender: "operation" },
+  },
 ];
 
 export default {
@@ -381,35 +413,54 @@ export default {
         justify-content: space-between;
         > dl {
           flex: none;
-          width: 271px;
-          height: 61px;
+          width: 180px;
+          height: 80px;
           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);
+          //   align-items: center;
+          justify-content: space-between;
+          flex-direction: column;
+          padding: 10px;
+          box-sizing: border-box;
+
           border-radius: 4px 4px 4px 4px;
-          border: 1px solid #ffffff;
 
-          img {
-            width: 44px;
-            height: auto;
-          }
           > dd {
             display: flex;
-            align-items: center;
+            // align-items: center;
+            justify-content: flex-end;
             margin: 0;
             font-family: PingFang SC, PingFang SC;
             font-weight: 500;
-            font-size: 18px;
-            color: rgba(0, 0, 0, 0.85);
-            padding-left: 15px;
+            font-size: 24px;
+            // color: rgba(0, 0, 0, 0.85);
+            // padding-left: 15px;
             box-sizing: border-box;
           }
         }
+        > dl:first-child {
+          background: url("../../assets/img/business1.png");
+          color: #11a6d3;
+        }
+        > dl:nth-child(2) {
+          background: url("../../assets/img/business2.png");
+          color: #f87f2c;
+        }
+        > dl:nth-child(3) {
+          background: url("../../assets/img/business3.png");
+          color: #fab600;
+        }
+        > dl:nth-child(4) {
+          background: url("../../assets/img/business4.png");
+          color: #80be38;
+        }
+        > dl:nth-child(5) {
+          background: url("../../assets/img/business5.png");
+          color: #906cef;
+        }
+        > dl:nth-child(6) {
+          background: url("../../assets/img/business6.png");
+          color: #47a2eb;
+        }
       }
       span {
         display: block;
@@ -426,7 +477,7 @@ export default {
     .ant-form {
       display: flex;
       > .ant-form-item {
-        flex: 1;
+        flex: none;
         /deep/.ant-form-item-control-wrapper {
           width: 100%;
         }

src/pages/personnelManage/front/personnel.vue

@@ -427,6 +427,9 @@ export default {
           display: flex;
           justify-content: space-between;
         }
+        p:nth-child(2) {
+          width: 80%;
+        }
         p:last-child {
           margin: 0;
           justify-content: flex-end;

src/pages/sys/auth.vue

@@ -40,7 +40,7 @@
         {{
           authList
             .map((v) => {
-              return v.id == text ? v.label : "";
+              return v.value == text ? v.label : "";
             })
             .join("")
         }}
@@ -77,8 +77,8 @@
           <a-select v-model="authPermissions.dataPermissionId">
             <a-select-option
               v-for="item in authList"
-              :key="item.id"
-              :value="item.id"
+              :key="item.value"
+              :value="item.value"
               >{{ item.label }}</a-select-option
             >
           </a-select>
@@ -306,7 +306,7 @@ export default {
             if (res.data.code === 200) {
               this.authPermissions = { ...res.data.data };
               this.authPermissions.dataPermissionId =
-                res.data.data.dataPermissionId * 1;
+                res.data.data.dataPermissionId;
             }
           });
       } else {

src/router/config.js

@@ -53,6 +53,22 @@ const router = new Router({
             },
           ]
         },
+        {
+          path: '/business/sales/message',
+          name: '保费详情',
+          component: () => import('@/pages/business/message'),
+        },
+        {
+          path: '/business/agent/message',
+          name: '保费详情',
+          component: () => import('@/pages/business/message'),
+        },
+        {
+          path: '/business/channel/message',
+          name: '保费详情',
+          component: () => import('@/pages/business/message'),
+        },
+
         // {
         //   path: 'task',
         //   name: '任务统计',