From 3e4f8254678175804f0920e4a4bddf9091f4c014 Mon Sep 17 00:00:00 2001
From: zhenghuang <236220500@qq.com>
Date: Mon, 15 Jun 2020 11:07:07 +0800
Subject: [PATCH] 1

---
 src/pages/recruit/CheckList.vue    | 384 +++++++------
 src/pages/recruit/PromoterList.vue | 887 ++++++++++++++++-------------
 src/pages/recruit/recruitTable.vue |  97 ++--
 3 files changed, 740 insertions(+), 628 deletions(-)

diff --git a/src/pages/recruit/CheckList.vue b/src/pages/recruit/CheckList.vue
index cde0549..1510c8b 100644
--- a/src/pages/recruit/CheckList.vue
+++ b/src/pages/recruit/CheckList.vue
@@ -1,193 +1,194 @@
 <template>
   <div>
-    <Tabs active-key="key1" @on-click="onTabClick">
-      <Tab-pane label="待审核" key="key1">
+    <Tabs active-key="key1"
+          @on-click="onTabClick">
+      <Tab-pane label="待审核"
+                key="key1">
         <Row class="search-row">
-          <i-col span="24" class="search-col">
+          <i-col span="24"
+                 class="search-col">
             <Row class="row-style">
-              <i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop" />
+              <i-input placeholder="请输入推广员姓名或手机号"
+                       class="search-select"
+                       v-model="searchShop" />
               <span class="search-span">选择日期</span>
-              <DatePicker
-                :value="selectDate"
-                type="daterange"
-                split-panels
-                placeholder="请选择日期"
-                @on-change="onChangeDateLister"
-                class="date-picker"
-              ></DatePicker>
+              <DatePicker :value="selectDate"
+                          type="daterange"
+                          split-panels
+                          placeholder="请选择日期"
+                          @on-change="onChangeDateLister"
+                          class="date-picker"></DatePicker>
               <span class="search-span">零售公司</span>
-              <Select
-                v-model="companyId"
-                filterable
-                class="search-select"
-                @on-change="companySelect"
-              >
-                <Option
-                  v-for="(item,index) in companyList"
-                  :value="item.id"
-                  :key="index + item.id"
-                >{{ item.name }}</Option>
+              <Select v-model="companyId"
+                      filterable
+                      class="search-select"
+                      @on-change="companySelect">
+                <Option v-for="(item,index) in companyList"
+                        :value="item.id"
+                        :key="index + item.id">{{ item.name }}</Option>
               </Select>
               <span class="search-span">店铺</span>
-              <Select v-model="selectedStore" filterable class="search-select">
-                <Option
-                  v-for="(item,index) in shopList"
-                  :value="item.id"
-                  :key="index + item.id"
-                >{{ item.name }}</Option>
+              <Select v-model="selectedStore"
+                      filterable
+                      class="search-select">
+                <Option v-for="(item,index) in shopList"
+                        :value="item.id"
+                        :key="index + item.id">{{ item.name }}</Option>
               </Select>
-              <Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
+              <Button type="primary"
+                      @click="searchCustomerDataBtnClick"
+                      class="search-btn">查询</Button>
             </Row>
           </i-col>
         </Row>
-        <Table
-          ref="table"
-          :loading="loading"
-          :columns="columns1"
-          :data="data1"
-          class="table-store"
-          size="small"
-          @on-row-dblclick="onDblClickRowLister"
-        >
-          <template slot="action" slot-scope="{row}">
+        <Table ref="table"
+               :loading="loading"
+               :columns="columns1"
+               :data="data1"
+               class="table-store"
+               size="small"
+               @on-row-dblclick="onDblClickRowLister">
+          <template slot="action"
+                    slot-scope="{row}">
             <i-col span="12">
-              <Button type="success" class="router-btn" @click="() => {passShow(row)}">审核通过</Button>
+              <Button type="success"
+                      class="router-btn"
+                      @click="() => {passShow(row)}">审核通过</Button>
             </i-col>
             <i-col span="12">
-              <Button type="error" class="router-btn" @click="() => {refuseShow(row)}">审核不通过</Button>
+              <Button type="error"
+                      class="router-btn"
+                      @click="() => {refuseShow(row)}">审核不通过</Button>
             </i-col>
           </template>
         </Table>
       </Tab-pane>
-      <Tab-pane label="通过审核" key="key2">
+      <Tab-pane label="通过审核"
+                key="key2">
         <Row class="search-row">
-          <i-col span="24" class="search-col">
+          <i-col span="24"
+                 class="search-col">
             <Row class="row-style">
-              <i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop" />
+              <i-input placeholder="请输入推广员姓名或手机号"
+                       class="search-select"
+                       v-model="searchShop" />
               <span class="search-span">选择日期</span>
-              <DatePicker
-                v-model="date"
-                class="left-15 date-picker"
-                type="date"
-                placement="bottom-start"
-                split-panels
-                placeholder="请选择日期"
-              ></DatePicker>
+              <DatePicker v-model="date"
+                          class="left-15 date-picker"
+                          type="date"
+                          placement="bottom-start"
+                          split-panels
+                          placeholder="请选择日期"></DatePicker>
               <span class="search-span">零售公司</span>
-              <Select
-                v-model="companyId"
-                filterable
-                class="search-select"
-                @on-change="companySelect"
-              >
-                <Option
-                  v-for="(item,index) in companyList"
-                  :value="item.id"
-                  :key="index + item.id"
-                >{{ item.name }}</Option>
+              <Select v-model="companyId"
+                      filterable
+                      class="search-select"
+                      @on-change="companySelect">
+                <Option v-for="(item,index) in companyList"
+                        :value="item.id"
+                        :key="index + item.id">{{ item.name }}</Option>
               </Select>
               <span class="search-span">店铺</span>
-              <Select v-model="selectedStore" filterable class="search-select">
-                <Option
-                  v-for="(item,index) in shopList"
-                  :value="item.id"
-                  :key="index + item.id"
-                >{{ item.name }}</Option>
+              <Select v-model="selectedStore"
+                      filterable
+                      class="search-select">
+                <Option v-for="(item,index) in shopList"
+                        :value="item.id"
+                        :key="index + item.id">{{ item.name }}</Option>
               </Select>
-              <Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
+              <Button type="primary"
+                      @click="searchCustomerDataBtnClick"
+                      class="search-btn">查询</Button>
             </Row>
           </i-col>
         </Row>
-        <Table
-          ref="table"
-          :loading="loading"
-          :columns="columns2"
-          :data="data2"
-          class="table-store"
-          size="small"
-          @on-row-dblclick="onDblClickRowLister"
-        ></Table>
+        <Table ref="table1"
+               :loading="loading"
+               :columns="columns2"
+               :data="data2"
+               class="table-store"
+               size="small"
+               @on-row-dblclick="onDblClickRowLister"></Table>
       </Tab-pane>
-      <Tab-pane label="审核未通过" key="key3">
+      <Tab-pane label="审核未通过"
+                key="key3">
         <Row class="search-row">
-          <i-col span="24" class="search-col">
+          <i-col span="24"
+                 class="search-col">
             <Row class="row-style">
-              <i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop" />
+              <i-input placeholder="请输入推广员姓名或手机号"
+                       class="search-select"
+                       v-model="searchShop" />
               <span class="search-span">选择日期</span>
-              <DatePicker
-                v-model="date"
-                class="left-15 date-picker"
-                type="date"
-                placement="bottom-start"
-                split-panels
-                placeholder="请选择日期"
-              ></DatePicker>
+              <DatePicker v-model="date"
+                          class="left-15 date-picker"
+                          type="date"
+                          placement="bottom-start"
+                          split-panels
+                          placeholder="请选择日期"></DatePicker>
               <span class="search-span">零售公司</span>
-              <Select
-                v-model="companyId"
-                filterable
-                class="search-select"
-                @on-change="companySelect"
-              >
-                <Option
-                  v-for="(item,index) in companyList"
-                  :value="item.id"
-                  :key="index + item.id"
-                >{{ item.name }}</Option>
+              <Select v-model="companyId"
+                      filterable
+                      class="search-select"
+                      @on-change="companySelect">
+                <Option v-for="(item,index) in companyList"
+                        :value="item.id"
+                        :key="index + item.id">{{ item.name }}</Option>
               </Select>
               <span class="search-span">店铺</span>
-              <Select v-model="selectedStore" filterable class="search-select">
-                <Option
-                  v-for="(item,index) in shopList"
-                  :value="item.id"
-                  :key="index + item.id"
-                >{{ item.name }}</Option>
+              <Select v-model="selectedStore"
+                      filterable
+                      class="search-select">
+                <Option v-for="(item,index) in shopList"
+                        :value="item.id"
+                        :key="index + item.id">{{ item.name }}</Option>
               </Select>
-              <Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
+              <Button type="primary"
+                      @click="searchCustomerDataBtnClick"
+                      class="search-btn">查询</Button>
             </Row>
           </i-col>
         </Row>
-        <Table
-          ref="table"
-          :loading="loading"
-          :columns="columns3"
-          :data="data3"
-          class="table-store"
-          size="small"
-          @on-row-dblclick="onDblClickRowLister"
-        ></Table>
+        <Table ref="table2"
+               :loading="loading"
+               :columns="columns3"
+               :data="data3"
+               class="table-store"
+               size="small"
+               @on-row-dblclick="onDblClickRowLister"></Table>
       </Tab-pane>
     </Tabs>
 
     <!-- 拒绝 -->
-    <Modal
-      v-model="refuseIsShow"
-      :title="showStoreName"
-      :footer-hide="true"
-      width="600"
-      class-name="vertical-center-modal"
-      @on-ok="ok"
-    >
+    <Modal v-model="refuseIsShow"
+           :title="showStoreName"
+           :footer-hide="true"
+           width="600"
+           class-name="vertical-center-modal"
+           @on-ok="ok">
       <div slot="header">
         <p>审核不通过原因</p>
       </div>
       <div>
-        <i-input v-model="remark" type="textarea" :rows="4" placeholder="请填写审核不通过原因"></i-input>
+        <i-input v-model="remark"
+                 type="textarea"
+                 :rows="4"
+                 placeholder="请填写审核不通过原因"></i-input>
       </div>
       <div style="margin-top:20px;text-align: center;">
-        <Button ghost type="primary" @click="refuse(rowData)">确定</Button>
+        <Button ghost
+                type="primary"
+                @click="refuse(rowData)">确定</Button>
       </div>
     </Modal>
 
     <!-- 升级 -->
-    <Modal
-      v-model="passIsShow"
-      :title="showStoreName"
-      :footer-hide="true"
-      width="600"
-      class-name="vertical-center-modal"
-      @on-ok="ok"
-    >
+    <Modal v-model="passIsShow"
+           :title="showStoreName"
+           :footer-hide="true"
+           width="600"
+           class-name="vertical-center-modal"
+           @on-ok="ok">
       <div slot="header">
         <p style="text-align: center;">确认审核</p>
       </div>
@@ -196,20 +197,20 @@
       </div>
       <div style="margin-top:20px;text-align: center;">
         <Button @click="cancel(rowData)">取消</Button>
-        <Button style="margin-left:20px" type="primary" @click="confirm(rowData)">确定</Button>
+        <Button style="margin-left:20px"
+                type="primary"
+                @click="confirm(rowData)">确定</Button>
       </div>
     </Modal>
 
-    <Page
-      :total="total"
-      :current="pageNum"
-      :page-size="pageSize"
-      show-elevator
-      show-total
-      placement="top"
-      @on-change="handlePage"
-      class-name="ks-page"
-    ></Page>
+    <Page :total="total"
+          :current="pageNum"
+          :page-size="pageSize"
+          show-elevator
+          show-total
+          placement="top"
+          @on-change="handlePage"
+          class-name="ks-page"></Page>
   </div>
 </template>
 
@@ -221,7 +222,7 @@ import bulletinService from "../../services/recruit/Bulletin";
 
 export default {
   name: "",
-  data() {
+  data () {
     return {
       tabIndex: 0,
       userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId,
@@ -268,6 +269,13 @@ export default {
             return h("span", params.row.promoterInfo.phone);
           }
         },
+        {
+          title: "推广员身份证号",
+          width: 120,
+          render: (h, params) => {
+            return h("span", params.row.promoterInfo.idNo);
+          }
+        },
         {
           title: "零售公司",
           width: 150,
@@ -343,6 +351,13 @@ export default {
             return h("span", params.row.promoterInfo.phone);
           }
         },
+        {
+          title: "推广员身份证号",
+          width: 120,
+          render: (h, params) => {
+            return h("span", params.row.promoterInfo.idNo);
+          }
+        },
         {
           title: "零售公司",
           width: 150,
@@ -378,7 +393,7 @@ export default {
             return h("span", params.row.fissionUser.name);
           }
         },
-         {
+        {
           title: "加入时间",
           width: 120,
           render: (h, params) => {
@@ -421,6 +436,13 @@ export default {
             return h("span", params.row.promoterInfo.phone);
           }
         },
+        {
+          title: "推广员身份证号",
+          width: 120,
+          render: (h, params) => {
+            return h("span", params.row.promoterInfo.idNo);
+          }
+        },
         {
           title: "零售公司",
           width: 150,
@@ -456,7 +478,7 @@ export default {
             return h("span", params.row.fissionUser.name);
           }
         },
-         {
+        {
           title: "加入时间",
           width: 120,
           render: (h, params) => {
@@ -474,7 +496,7 @@ export default {
           title: "审核不通过原因",
           width: 120,
           render: (h, params) => {
-            return h("span",params.row.fissionUser.remark);
+            return h("span", params.row.remark);
           }
         }
       ],
@@ -485,7 +507,7 @@ export default {
       remark: null
     };
   },
-  mounted: function() {
+  mounted: function () {
     // let startDate = this.$moment().format("YYYY-MM-DD");
     // let endDate = this.$moment().format("YYYY-MM-DD");
     // this.selectDate.push(startDate);
@@ -495,17 +517,17 @@ export default {
     this.getRecruitList();
   },
   methods: {
-    onChangeDateLister(date) {
+    onChangeDateLister (date) {
       console.log(date);
       this.selectDate = date;
     },
     /**基础数据：区域list、零售公司list、客户list*/
-    getSelectList: function() {
+    getSelectList: function () {
       let that = this;
       let request = {
         userId: this.userId
       };
-      zeroExtend.getSelectListRequest(request, function(data) {
+      zeroExtend.getSelectListRequest(request, function (data) {
         if (data.data.code !== "0000") {
           that.$Message.error("系统异常");
         }
@@ -521,7 +543,7 @@ export default {
       });
     },
     //插入全部选项
-    insertAllOption: function() {
+    insertAllOption: function () {
       if (this.companyList.length === 0 || this.companyList[0].id !== 0) {
         this.companyList.splice(0, 0, { id: 0, name: "全部" });
       }
@@ -530,7 +552,7 @@ export default {
       }
     },
     //店铺
-    downShopData: function(selected) {
+    downShopData: function (selected) {
       let that = this;
       let companyId = selected;
       if (!selected) {
@@ -552,7 +574,7 @@ export default {
         userId: that.userId,
         customerIds: JSON.stringify(customerIds)
       };
-      staff.downShopData(request, function(data) {
+      staff.downShopData(request, function (data) {
         data = data.data.results;
         if (data) {
           that.shopList = [{ id: 0, name: "全部" }];
@@ -566,38 +588,38 @@ export default {
       });
     },
     //零售公司选择
-    companySelect: function() {
+    companySelect: function () {
       //加载店铺
       this.downShopData(this.companyId);
       this.selectedStore = 0;
     },
-    downCompanyChange: function(formValidate) {
+    downCompanyChange: function (formValidate) {
       this.downShopData(formValidate.departIds);
     },
-    searchCustomerDataBtnClick: function() {
+    searchCustomerDataBtnClick: function () {
       this.pageNum = 1;
       this.getRecruitList();
     },
     // 双击row跳转详情页面
-    onDblClickRowLister: function(row) {
+    onDblClickRowLister: function (row) {
       this.$router.push({
         path: "/shop/increase/manager/staff",
         query: { storeId: row.id }
       });
     },
     //切页处理
-    handlePage: function(value) {
+    handlePage: function (value) {
       this.pageNum = value;
       this.getRecruitList();
     },
-    getRecruitList() {
+    getRecruitList () {
       let that = this;
       this.loading = true;
       let request = {
         status: that.tabIndex + 2,
         pageNum: that.pageNum,
-        storeId: that.selectedStore ==0 ? null:that.selectedStore,
-        companyId: that.companyId ==0 ? null:that.companyId,
+        storeId: that.selectedStore == 0 ? null : that.selectedStore,
+        companyId: that.companyId == 0 ? null : that.companyId,
         store: that.searchShop,
         start:
           that.selectDate[0] === "" || that.selectDate.length == 0
@@ -610,7 +632,7 @@ export default {
       };
       bulletinService.getRecruitList(
         request,
-        function(data) {
+        function (data) {
           that.loading = false;
           if (data.data.code == "0000") {
             that.data1 = [];
@@ -624,21 +646,21 @@ export default {
             if (datas.list == null) {
               datas.list = [];
             }
-            if(that.tabIndex == 0){
+            if (that.tabIndex == 0) {
               that.data1 = datas.records;
-            }else if(that.tabIndex == 1){
+            } else if (that.tabIndex == 1) {
               that.data2 = datas.records;
-            }else{
+            } else {
               that.data3 = datas.records;
             }
           }
         },
-        function(error) {
+        function (error) {
           that.loading = false;
         }
       );
     },
-    onTabClick(e) {
+    onTabClick (e) {
       this.tabIndex = e;
       this.pageNum = 1;
       this.storeId = null;
@@ -647,11 +669,11 @@ export default {
       this.selectDate = [];
       this.getRecruitList();
     },
-    ok() {
+    ok () {
       this.refuseIsShow = false;
     },
     // 拒绝审核
-    refuse(rData) {
+    refuse (rData) {
       let param = {
         fissionPromoterId: rData.id,
         status: 4,
@@ -660,19 +682,19 @@ export default {
       this.doRecruitSave(param);
       this.refuseIsShow = false;
     },
-    refuseShow(index) {
+    refuseShow (index) {
       this.refuseIsShow = true;
       this.rowData = index;
     },
-    passShow(index) {
+    passShow (index) {
       this.passIsShow = true;
       this.rowData = index;
     },
-    cancel() {
+    cancel () {
       this.passIsShow = false;
     },
     //确认通过审核
-    confirm(rData) {
+    confirm (rData) {
       let param = {
         fissionPromoterId: rData.id,
         status: 3
@@ -681,11 +703,11 @@ export default {
       this.passIsShow = false;
     },
     // 审核
-    doRecruitSave(request) {
+    doRecruitSave (request) {
       let that = this;
       bulletinService.recruitSave(
         request,
-        function(data) {
+        function (data) {
           that.loading = false;
           if (data.data.code == "0000") {
             that.$Message.info(data.data.results);
@@ -694,7 +716,7 @@ export default {
             that.$Message.error("系统异常");
           }
         },
-        function(error) {
+        function (error) {
           that.loading = false;
         }
       );
diff --git a/src/pages/recruit/PromoterList.vue b/src/pages/recruit/PromoterList.vue
index 1e38d3f..637d882 100644
--- a/src/pages/recruit/PromoterList.vue
+++ b/src/pages/recruit/PromoterList.vue
@@ -1,427 +1,498 @@
 <template>
-    <div>
-        <Row class="search-row">
-            <i-col span="24" class="search-col">
-                <Row class="row-style">
-                    <i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop"/>
-                    <span class="search-span">选择日期</span>
-                   <DatePicker :value="selectDate" type="daterange" split-panels placeholder="请选择日期"
-                                @on-change="onChangeDateLister"
-                                class="date-picker"></DatePicker>
-                    <span class="search-span">零售公司</span>
-                    <Select v-model="companyId" filterable class="search-select" @on-change="companySelect">
-                        <Option v-for="(item,index) in companyList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
-                    </Select>
-                    <span class="search-span">店铺</span>
-                    <Select v-model="selectedStore" filterable class="search-select">
-                        <Option v-for="(item,index) in shopList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
-                    </Select>
-                    <Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
+  <div>
+    <Row class="search-row">
+      <i-col span="24"
+             class="search-col">
+        <Row class="row-style">
+          <i-input placeholder="请输入推广员姓名或手机号"
+                   class="search-select"
+                   v-model="searchShop" />
+          <span class="search-span">选择日期</span>
+          <DatePicker :value="selectDate"
+                      type="daterange"
+                      split-panels
+                      placeholder="请选择日期"
+                      @on-change="onChangeDateLister"
+                      class="date-picker"></DatePicker>
+          <span class="search-span">零售公司</span>
+          <Select v-model="companyId"
+                  filterable
+                  class="search-select"
+                  @on-change="companySelect">
+            <Option v-for="(item,index) in companyList"
+                    :value="item.id"
+                    :key="index + item.id">{{ item.name }}</Option>
+          </Select>
+          <span class="search-span">店铺</span>
+          <Select v-model="selectedStore"
+                  filterable
+                  class="search-select">
+            <Option v-for="(item,index) in shopList"
+                    :value="item.id"
+                    :key="index + item.id">{{ item.name }}</Option>
+          </Select>
+          <Button type="primary"
+                  @click="searchCustomerDataBtnClick"
+                  class="search-btn">查询</Button>
 
-                </Row>
-            </i-col>
         </Row>
-        <Table ref="table" :loading="loading" :columns="columns1" :data="data1" class="table-store" size="small"                       @on-row-dblclick="onDblClickRowLister">
-            <template slot="action" slot-scope="{row}">
-                <i-col span="12">
-                    <Button type="success" class="router-btn" 
-                            @click="() => {show(row)}">升级</Button>
-                </i-col>
-                <i-col span="12">
-                    <Button type="text" class="router-btn" style="color:2DBCF0!important"
-                            @click="() => {doShow(row,true)}">查看上下级</Button>
-                </i-col>
-            </template>
-        </Table>
-            
-        <!-- 升级 -->
-        <Modal
-          v-model="isShow"
-          :title="showStoreName"
-          :footer-hide="true"
-          width="600"
-          class-name="vertical-center-modal"
-          @on-ok="ok">
-          <div slot="header">
-              <p style="text-align: center;">确认升级</p>
-          </div>
-          <div  style="text-align:center;min-height:100px">
-              <span style="line-height:100px">确认将张继军从客户经理升级成服务经理吗?</span>
-          </div>
-          <div style="margin-top:20px;text-align: center;">
-            <Button @click="cancel(rowData)">取消升级</Button>
-            <Button style="margin-left:20px" type="primary" @click="confirm(rowData)">确定升级</Button>
-          </div>
-        </Modal>
-       <recruitTable ref="recruitTable"
-          @doShow="doShow"
-          :show="showrecruit"
-          :schedule="recruitSchedule">
-        </recruitTable>
-        <Page :total="total" :current="pageNum" :page-size="pageSize" show-elevator show-total
-            placement="top" @on-change="handlePage" class-name="ks-page"></Page>
-    </div>
+      </i-col>
+    </Row>
+    <Table ref="table"
+           :loading="loading"
+           :columns="columns1"
+           :data="data1"
+           class="table-store"
+           size="small"
+           @on-row-dblclick="onDblClickRowLister">
+      <template slot="action"
+                slot-scope="{row}">
+        <i-col span="12">
+          <Button type="success"
+                  class="router-btn"
+                  @click="() => {show(row)}">升级</Button>
+        </i-col>
+        <i-col span="12">
+          <Button type="text"
+                  class="router-btn"
+                  style="color:2DBCF0!important"
+                  @click="() => {doShow(row,true)}">查看上下级</Button>
+        </i-col>
+      </template>
+    </Table>
+
+    <!-- 升级 -->
+    <Modal v-model="isShow"
+           :title="showStoreName"
+           :footer-hide="true"
+           width="600"
+           class-name="vertical-center-modal"
+           @on-ok="ok">
+      <div slot="header">
+        <p style="text-align: center;">确认升级</p>
+      </div>
+      <div style="text-align:center;min-height:100px">
+        <span style="line-height:100px">{{upgradeStr}}</span>
+      </div>
+      <div style="margin-top:20px;text-align: center;">
+        <Button @click="cancel(rowData)">取消升级</Button>
+        <Button style="margin-left:20px"
+                type="primary"
+                @click="confirm(rowData)">确定升级</Button>
+      </div>
+    </Modal>
+    <recruitTable ref="recruitTable"
+                  @doShow="doShow"
+                  :show="showrecruit"
+                  :schedule="recruitSchedule">
+    </recruitTable>
+    <Page :total="total"
+          :current="pageNum"
+          :page-size="pageSize"
+          show-elevator
+          show-total
+          placement="top"
+          @on-change="handlePage"
+          class-name="ks-page"></Page>
+  </div>
 </template>
 
 <script>
-    import recruitTable from "./recruitTable";
-    import zeroExtend from "../../services/customer/zeroExtend";
-    import staff from "../../services/staff/staff";
-    import { formatDate } from "../../utils/Common";
-    import bulletinService from '../../services/recruit/Bulletin'
-    export default {
-        name: "",
-        components: {
-          recruitTable,
+import recruitTable from "./recruitTable";
+import zeroExtend from "../../services/customer/zeroExtend";
+import staff from "../../services/staff/staff";
+import { formatDate } from "../../utils/Common";
+import bulletinService from '../../services/recruit/Bulletin'
+export default {
+  name: "",
+  components: {
+    recruitTable,
+  },
+  data () {
+    return {
+      tabIndex: 0,
+      userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId,
+      searchShop: null,
+      date: "",
+      companyId: null,
+      isShow: false,
+      showStoreName: '',
+      showrecruit: false,
+      recruitSchedule: {},
+      rowData: {},
+      upgradeStr: "",
+      //零售公司list
+      companyList: [],
+      selectedStore: null,
+      shopList: [],
+      loading: false,
+      //所有组织list
+      organizationalList: [],
+      total: 0,
+      pageSize: 10,
+      pageNum: 1,
+      columns1: [
+        {
+          title: '序号',
+          key: 'number',
+          width: 60,
+          render: (h, params) => {
+            return h('span', params.index + (this.pageNum - 1) * this.pageSize + 1);
+          }
         },
-        data() {
-            return {
-                tabIndex:0,
-                userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId,
-                searchShop:null,
-                date:"",
-                companyId:null,                    
-                isShow: false,
-                showStoreName: '',
-                showrecruit:false,
-                recruitSchedule:{},
-                rowData:{},
-                //零售公司list
-                companyList: [],                
-                selectedStore: null,
-                shopList: [],
-                loading:false,
-                //所有组织list
-                organizationalList: [],
-                total: 0,
-                pageSize: 10,
-                pageNum: 1,
-                columns1: [
-                    {
-                        title: '序号',
-                        key: 'number',
-                        width:60,
-                        render: (h, params) => {
-                            return h('span', params.index + (this.pageNum - 1) * this.pageSize + 1);
-                        }
-                    },
-                    {
-                        title: '推广员姓名',
-                        key: 'shopName',
-                        width:120,
-                        render: (h, params) => {
-                            return h('span', params.row.promoterInfo.name);
-                        }
-                    },
-                    {
-                        title: '推广员手机号',
-                        key: 'shopPhone',
-                        width:120,
-                        render: (h, params) => {
-                            return h('span', params.row.promoterInfo.phone);
-                        }
-                    },
-                    {
-                        title: '等级',
-                        width:80,
-                        render: (h, params) => {
-                            return h('span', params.row.organizational.level);
-                        }
-                    },
-                    {
-                        title: '客户经理数',
-                        key: 'customerManagerCount',
-                        width:120
-                    },
-                    {
-                        title: '推广员数',
-                        key: 'extensionCount',
-                        width:120
-                    },
-                    {
-                        title: '客户数',
-                        key: 'customerCount',
-                        width:80
-                    },
-                    {
-                        title: '业绩',
-                        key: 'achievement',
-                        width:80
-                    },
-                    {
-                        title: '零售公司',
-                        key: 'companyName',
-                        width:150,
-                        render: (h, params) => {
-                            return h('span', params.row.organizational.name);
-                        }
-                    },
-                    
-                    {
-                        title: '店铺',
-                        key: 'storeName',
-                        width:160,
-                        render: (h, params) => {
-                            return h('span', params.row.store.name);
-                        }
-                    },
-                    {
-                        title: '店铺编号',
-                        key: 'storeNO',
-                        width:80,
-                        render: (h, params) => {
-                            return h('span', params.row.store.code);
-                        }
-                    },
-                    {
-                        title: '发展人',
-                        key: 'fissionNum',
-                        width:80,
-                        render: (h, params) => {
-                            return h('span', params.row.fissionUser.name);
-                        }
-                    },
-                    {
-                        title: '加入时间',
-                        key: 'submitDate',
-                        width:120,
-                        render: (h, params) => {
-                            return h('span', formatDate(params.row.joinTime));
-                        }
-                    },
-                    {
-                        title: '操作',
-                        slot: 'operation',
-                        width:250,
-                        render: (h, params) => {
-                            let that = this;
-                            return h('div', [
-                                 h('span', {
-                                    style: {
-                                        background: 'white',
-                                        border: '0',
-                                        color: '#3496EB',
-                                        marginRight: '15px',
-                                        cursor: 'pointer'
-                                    },
-                                    on: {
-                                        click: () => {
-                                            that.show(params.row)
-                                        }
-                                    }
-                                }, '升级'),
-                                h('span', {
-                                    style: {
-                                        background: 'white',
-                                        border: '0',
-                                        color: '#3496EB',
-                                        marginRight: '15px',
-                                        cursor: 'pointer'
-                                    },
-                                    on: {
-                                        click: () => {
-                                            that.doShow(params.row,true)
-                                        }
-                                    }
-                                }, '查看上下级'),
-                                
-                            ])
-
-                        }
-                    }
-                ],
-                data1:[
-                   
-                ],                
-                selectDate: [],
+        {
+          title: '推广员姓名',
+          key: 'shopName',
+          width: 120,
+          render: (h, params) => {
+            return h('span', params.row.promoterInfo.name);
+          }
+        },
+        {
+          title: '推广员手机号',
+          key: 'shopPhone',
+          width: 120,
+          render: (h, params) => {
+            return h('span', params.row.promoterInfo.phone);
+          }
+        },
+        {
+          title: '等级',
+          width: 80,
+          render: (h, params) => {
+            let str = "";
+            switch (params.row.level) {
+              case 1:
+                str = "一般推广员";
+                break;
+              case 2:
+                str = "客户经理";
+                break;
+              case 3:
+                str = "服务经理";
+                break;
+              default:
+                str = "一般推广员";
             }
+            return h('span', str);
+          }
         },
-        mounted: function () {
-            this.getSelectList();            
-            this.downShopData();
-            this.getPromoterList();
+        {
+          title: '客户经理数',
+          key: 'customerManagerCount',
+          width: 120
+        },
+        {
+          title: '推广员数',
+          key: 'extensionCount',
+          width: 120
+        },
+        {
+          title: '客户数',
+          key: 'customerCount',
+          width: 80
+        },
+        {
+          title: '业绩',
+          key: 'achievement',
+          width: 80
+        },
+        {
+          title: '零售公司',
+          key: 'companyName',
+          width: 150,
+          render: (h, params) => {
+            return h('span', params.row.organizational.name);
+          }
         },
-        methods: {            
-            onChangeDateLister(date) {
-                console.log(date)
-                this.selectDate = date;
-            },
-            /**基础数据：区域list、零售公司list、客户list*/
-            getSelectList: function () {
-                let that = this;
-                let request = {
-                    userId: this.userId,
-                };
-                zeroExtend.getSelectListRequest(request, function (data) {
-                    if (data.data.code !== "0000") {
-                        that.$Message.error("系统异常");
-                    }
-                    data = data.data.results;
-                    if (data) {
-                        that.organizationalList = data;
-                        that.companyList = that.organizationalList.filter(item => item.level === 2);
-                    }
-                    //插入全部选项
-                    that.insertAllOption();
-                });
-            },
-            //插入全部选项
-            insertAllOption: function () {
-                if (this.companyList.length === 0 || this.companyList[0].id !== 0) {
-                    this.companyList.splice(0, 0, {"id": 0, "name": "全部"});
-                }
-                if (this.shopList.length === 0 || this.shopList[0].id !== 0) {
-                    this.shopList.splice(0, 0, {"id": 0, "name": "全部"});
-                }
-            },
-            //店铺
-            downShopData: function (selected) {
-                let that = this;
-                let companyId = selected;
-                if (!selected) {
-                    companyId = that.companyId;
-                }
-                let customerIds = [];
-                this.customerList = [];
-                if (companyId === 0) {
-                    //
-                } else {
-                    this.customerList = this.organizationalList.filter(item => item.parentId === companyId && item.level === 3);
-                    this.insertAllOption();
-                }
-                customerIds = this.customerList.map(item => item.id);
 
-                let request =
-                    {userId: that.userId, customerIds: JSON.stringify(customerIds)};
-                staff.downShopData(request, function (data) {
-                    data = data.data.results;
-                    if (data) {
-                        that.shopList = [{"id": 0, "name": "全部"}];
-                        for (let i = 0; i < data.length; i++) {
-                            let entity = data[i];
-                            if (entity) {
-                                that.shopList.push(entity);
-                            }
-                        }
-                    }
-                })
-            },
-            //零售公司选择
-            companySelect: function () {
-                //加载店铺
-                this.downShopData(this.companyId);
-                this.selectedStore = 0;
-            },
-            downCompanyChange: function (formValidate) {
-                this.downShopData(formValidate.departIds);
-            },            
-            searchCustomerDataBtnClick: function () {
-                this.pageNum = 1;
-                this.getCheckList();
-            },
-            // 双击row跳转详情页面
-            onDblClickRowLister: function (row) {
-                this.$router.push({path:'/shop/increase/manager/staff',query:{storeId:row.id}});
-            },
-            //切页处理
-            handlePage: function (value) {
-                this.pageNum = value;
-                this.getCheckList();
-            },
-            getPromoterList() {
-                let that = this;
-                this.loading = true;
-                let request = {
-                    pageNum: that.pageNum,
-                    storeId:that.selectedStore,
-                    companyId: that.companyId,
-                    store:that.searchShop,
-                    start:that.selectDate[0] === ""||that.selectDate.length==0?null:that.selectDate[0],
-                    end:that.selectDate[1] === ""||that.selectDate.length==0?null:that.selectDate[1],
-                };
-                bulletinService.promoterList(request, function (data) {
-                    that.loading = false;
-                    if (data.data.code == "0000") {
-                        that.data1 = [];
-                        let datas = data.data.results;
-                        //总页数
-                        if (datas.total == null) {
-                            that.total = 0;
-                        } else {
-                            that.total = datas.total;
-                        }
-                        if (datas.list == null) {
-                            datas.list = [];
-                        }
-                        that.data1 = datas.records;
-                    }
-                }, function (error) {
-                    that.loading = false;
-                });
-            },
-            onTabClick(e){
-                this.tabIndex = e;
-                console.log('tabIndex',this.tabIndex);
-            },
-            ok() {
-                this.isShow = false;
-            },
-            cancel(){
-              this.isShow = false;
-            },
-            // 升级
-            confirm(rData) {
-                let request={
-                    promoterId:rData.id
+        {
+          title: '店铺',
+          key: 'storeName',
+          width: 160,
+          render: (h, params) => {
+            return h('span', params.row.store.name);
+          }
+        },
+        {
+          title: '店铺编号',
+          key: 'storeNO',
+          width: 80,
+          render: (h, params) => {
+            return h('span', params.row.store.code);
+          }
+        },
+        {
+          title: '发展人',
+          key: 'fissionNum',
+          width: 80,
+          render: (h, params) => {
+            return h('span', params.row.fissionUser.name);
+          }
+        },
+        {
+          title: '加入时间',
+          key: 'submitDate',
+          width: 120,
+          render: (h, params) => {
+            return h('span', formatDate(params.row.joinTime));
+          }
+        },
+        {
+          title: '操作',
+          slot: 'operation',
+          width: 250,
+          render: (h, params) => {
+            let that = this;
+            return h('div', [
+              h('span', {
+                style: {
+                  background: 'white',
+                  border: '0',
+                  color: '#3496EB',
+                  marginRight: '15px',
+                  cursor: 'pointer'
+                },
+                on: {
+                  click: () => {
+                    that.show(params.row)
+                  }
                 }
-                let that = this;
-                bulletinService.promoterUpgrade(request, function (data) {
-                    that.loading = false;
-                    if (data.data.code == "0000") {
-                        that.$Message.info("升级成功");
-                        that.getPromoterList();
-                    }else{
-                        that.$Message.error("系统异常");
-                    }
-                }, function (error) {
-                    that.loading = false;
-                });
-                this.isShow = false;
-            },
-            show(index) {
-                this.isShow = true;
-                this.rowData = index;
-            },
-            doShow (currData,ishow) {
-                this.showrecruit = false;
-                let that = this;
-                let param = {
-                    promoterId:currData.id
+              }, '升级'),
+              h('span', {
+                style: {
+                  background: 'white',
+                  border: '0',
+                  color: '#3496EB',
+                  marginRight: '15px',
+                  cursor: 'pointer'
+                },
+                on: {
+                  click: () => {
+                    that.doShow(params.row, true)
+                  }
                 }
-                bulletinService.promoterDetail(param, function (data) {
-                    that.loading = false;
-                    if (data.data.code == "0000") {
-                        // TODO 接口暂无数据,先传当前点击行数据,待后续完善.
-                        that.showrecruit = ishow;
-                        that.recruitSchedule = currData;
-                        console.log(data.data);
-                    }else{
-                        that.$Message.error("系统异常");
-                    }
-                }, function (error) {
-                    that.loading = false;
-                });
-            },
+              }, '查看上下级'),
+
+            ])
+
+          }
         }
+      ],
+      data1: [
+
+      ],
+      selectDate: [],
     }
+  },
+  mounted: function () {
+    this.getSelectList();
+    this.downShopData();
+    this.getPromoterList();
+  },
+  methods: {
+    onChangeDateLister (date) {
+      console.log(date)
+      this.selectDate = date;
+    },
+    /**基础数据：区域list、零售公司list、客户list*/
+    getSelectList: function () {
+      let that = this;
+      let request = {
+        userId: this.userId,
+      };
+      zeroExtend.getSelectListRequest(request, function (data) {
+        if (data.data.code !== "0000") {
+          that.$Message.error("系统异常");
+        }
+        data = data.data.results;
+        if (data) {
+          that.organizationalList = data;
+          that.companyList = that.organizationalList.filter(item => item.level === 2);
+        }
+        //插入全部选项
+        that.insertAllOption();
+      });
+    },
+    //插入全部选项
+    insertAllOption: function () {
+      if (this.companyList.length === 0 || this.companyList[0].id !== 0) {
+        this.companyList.splice(0, 0, { "id": 0, "name": "全部" });
+      }
+      if (this.shopList.length === 0 || this.shopList[0].id !== 0) {
+        this.shopList.splice(0, 0, { "id": 0, "name": "全部" });
+      }
+    },
+    //店铺
+    downShopData: function (selected) {
+      let that = this;
+      let companyId = selected;
+      if (!selected) {
+        companyId = that.companyId;
+      }
+      let customerIds = [];
+      this.customerList = [];
+      if (companyId === 0) {
+        //
+      } else {
+        this.customerList = this.organizationalList.filter(item => item.parentId === companyId && item.level === 3);
+        this.insertAllOption();
+      }
+      customerIds = this.customerList.map(item => item.id);
+
+      let request =
+        { userId: that.userId, customerIds: JSON.stringify(customerIds) };
+      staff.downShopData(request, function (data) {
+        data = data.data.results;
+        if (data) {
+          that.shopList = [{ "id": 0, "name": "全部" }];
+          for (let i = 0; i < data.length; i++) {
+            let entity = data[i];
+            if (entity) {
+              that.shopList.push(entity);
+            }
+          }
+        }
+      })
+    },
+    //零售公司选择
+    companySelect: function () {
+      //加载店铺
+      this.downShopData(this.companyId);
+      this.selectedStore = 0;
+    },
+    downCompanyChange: function (formValidate) {
+      this.downShopData(formValidate.departIds);
+    },
+    searchCustomerDataBtnClick: function () {
+      this.pageNum = 1;
+      this.getCheckList();
+    },
+    // 双击row跳转详情页面
+    onDblClickRowLister: function (row) {
+      this.$router.push({ path: '/shop/increase/manager/staff', query: { storeId: row.id } });
+    },
+    //切页处理
+    handlePage: function (value) {
+      this.pageNum = value;
+      this.getCheckList();
+    },
+    getPromoterList () {
+      let that = this;
+      this.loading = true;
+      let request = {
+        pageNum: that.pageNum,
+        storeId: that.selectedStore,
+        companyId: that.companyId,
+        store: that.searchShop,
+        start: that.selectDate[0] === "" || that.selectDate.length == 0 ? null : that.selectDate[0],
+        end: that.selectDate[1] === "" || that.selectDate.length == 0 ? null : that.selectDate[1],
+      };
+      bulletinService.promoterList(request, function (data) {
+        that.loading = false;
+        if (data.data.code == "0000") {
+          that.data1 = [];
+          let datas = data.data.results;
+          //总页数
+          if (datas.total == null) {
+            that.total = 0;
+          } else {
+            that.total = datas.total;
+          }
+          if (datas.list == null) {
+            datas.list = [];
+          }
+          that.data1 = datas.records;
+        }
+      }, function (error) {
+        that.loading = false;
+      });
+    },
+    onTabClick (e) {
+      this.tabIndex = e;
+      console.log('tabIndex', this.tabIndex);
+    },
+    ok () {
+      this.isShow = false;
+    },
+    cancel () {
+      this.isShow = false;
+    },
+    // 升级
+    confirm (rData) {
+      let request = {
+        promoterId: rData.id
+      }
+      let that = this;
+      bulletinService.promoterUpgrade(request, function (data) {
+        that.loading = false;
+        if (data.data.code == "0000") {
+          that.$Message.info("升级成功");
+          that.getPromoterList();
+        } else {
+          that.$Message.error("系统异常");
+        }
+      }, function (error) {
+        that.loading = false;
+      });
+      this.isShow = false;
+    },
+    show (index) {
+      if (index.level >= 3) {
+        that.$Message.error(`${index.name}的等级已是最高`);
+        return false;
+      }
+      this.isShow = true;
+      this.rowData = index;
+      let str = "";
+      let next = "";
+      switch (index.level) {
+        case 1:
+          str = "一般推广员";
+          next = "客户经理";
+          break;
+        case 2:
+          str = "客户经理";
+          next = "服务经理";
+          break;
+        case 3:
+          str = "服务经理";
+          next = "服务经理";
+          break;
+        default:
+          str = "一般推广员";
+      }
+      this.upgradeStr = `确认将${index.name}从${str}升级成${next}吗?`;
+    },
+    doShow (currData, ishow) {
+      this.showrecruit = false;
+      let that = this;
+      let param = {
+        promoterId: currData.id
+      }
+      bulletinService.promoterDetail(param, function (data) {
+        that.loading = false;
+        if (data.data.code == "0000") {
+          // TODO 接口暂无数据,先传当前点击行数据,待后续完善.
+          that.showrecruit = ishow;
+          that.recruitSchedule = currData;
+          console.log(data.data);
+        } else {
+          that.$Message.error("系统异常");
+        }
+      }, function (error) {
+        that.loading = false;
+      });
+    },
+  }
+}
 </script>
 
 <style scoped>
-
-    .table-store {
-        margin-top: 20px;
-    }
-    .search-btn{
-        margin-left: 40px;
-    }
+.table-store {
+  margin-top: 20px;
+}
+.search-btn {
+  margin-left: 40px;
+}
 </style>
diff --git a/src/pages/recruit/recruitTable.vue b/src/pages/recruit/recruitTable.vue
index 68f4548..7d0b8cf 100644
--- a/src/pages/recruit/recruitTable.vue
+++ b/src/pages/recruit/recruitTable.vue
@@ -1,12 +1,13 @@
 <template>
   <div class="use_box">
     <Modal :scrollable="false"
-      v-model="showUse"
-      title="上下级详情"
-      @on-cancel="cancel"
-      :loading="true"
-      width="70%">
-      <div v-if="isShow" class="m-info">
+           v-model="showUse"
+           title="上下级详情"
+           @on-cancel="cancel"
+           :loading="true"
+           width="70%">
+      <div v-if="isShow"
+           class="m-info">
         <div class="m-info-top">
           <p>所属零售公司：{{schedule.organizational.name}}</p>
           <p>所属店铺：{{schedule.store.name}}</p>
@@ -16,20 +17,20 @@
           <div class="t-rows">
             <div>{{schedule.fissionUser.name}}</div>
             <div>{{schedule.fissionUser.mobil}}</div>
-            <div>服务经理</div>
+            <div>{{level}}</div>
           </div>
         </div>
-        <div  class="m-subordinate">下级(35人)</div>
+        <div class="m-subordinate">下级(0人)</div>
         <div>
-        <div class="t-rows">
+          <!-- <div class="t-rows">
           <div>张胜男</div>
           <div>13123209313</div>
           <div>推广员</div>
+        </div> -->
         </div>
       </div>
-      </div>
       <div slot="footer">
-      
+
       </div>
     </Modal>
   </div>
@@ -39,15 +40,15 @@
 export default {
   name: "recruitTable",
   components: {
-    
+
   },
   data () {
     return {
-      isShow:false,
+      isShow: false,
       currentStep: 0,
       modal_loading: false,
-      loading:false,
-      showUse: false,
+      loading: false,
+      showUse: false
     };
   },
   props: {
@@ -67,41 +68,59 @@ export default {
     show () {
       this.showUse = this.show;
     },
-    schedule(){
-      console.log('schedule监听',this.schedule);
+    schedule () {
+      console.log('schedule监听', this.schedule);
       this.isShow = true;
     }
   },
+  computed: {
+    level () {
+      let str = "";
+      switch (this.schedule.level) {
+        case 1:
+          str = "一般推广员";
+          break;
+        case 2:
+          str = "客户经理";
+          break;
+        case 3:
+          str = "服务经理";
+          break;
+        default:
+          str = "一般推广员";
+      }
+      return str;
+    }
+  },
   mounted () { },
   methods: {
     cancel () {
       this.modal_loading = false;
     },
-   
+
   },
 };
 </script>
 
 <style scoped>
-  .m-info-top{
-    display: flex;
-
-  }
-  .m-info-top p:last-child{
-    margin-left: 160px;    
-  }
-  .m-superior,.m-subordinate{
-    margin: 10px 0;
-    padding: 10px 0 10px 10px;
-    background-color: #f5f7f9;
-  }
-  .t-rows{
-    display: flex;
-
-  }
-  .t-rows div{
-    margin-right: 40px;
-    line-height: 45px;
-    padding-left: 20px;
-  }
+.m-info-top {
+  display: flex;
+}
+.m-info-top p:last-child {
+  margin-left: 160px;
+}
+.m-superior,
+.m-subordinate {
+  margin: 10px 0;
+  padding: 10px 0 10px 10px;
+  background-color: #f5f7f9;
+}
+.t-rows {
+  display: flex;
+}
+.t-rows div {
+  margin-right: 40px;
+  line-height: 45px;
+  padding-left: 20px;
+}
 </style>