ETA试用客户，管理员账号可操作所有用户账号启用，可申请试用

src/api/modules/crmApi.js

@@ -1277,6 +1277,15 @@ const etaTrialInterence={
   questionOptionDelete:(params)=>{
     return http.post('/eta_trial/questionnaire/del',params)
   },
+  /**账号移动
+  * EtaTrialIdList - 账号Id
+  * CurrentSellerId：选中者Id
+  * CurrentSellerName：选中者名称
+  * IsCheckAll：是否全选
+  */
+  accountTransfer:(params)=>{
+    return http.post('/eta_trial/account/transfer',params)
+  },
 }
 
 /* 全量客户相关 */

src/routes/modules/customRoutes.js

@@ -325,7 +325,7 @@ export default [
       {
         path: "etaApprovalList",
         component: () => import("@/views/custom_manage/etaTrialList/etaTrialList.vue"),
-        name: "审批列表",
+        name: "客户列表",
         hidden: false,
         meta: {
           pathFrom: "etaTrialList",

src/views/custom_manage/etaTrialList/compontents/addApplyHintDialog.vue

@@ -124,10 +124,10 @@ export default {
     },
     async handleApprove(getNext=true){
       if(getNext){
-        if(!this.applyReason.length){
-          this.$message.warning('请输入申请理由')
-          return
-        }
+        // if(!this.applyReason.length){
+        //   this.$message.warning('请输入申请理由')
+        //   return
+        // }
         const {UserName,CompanyName,Position,Mobile} = this.applyData[this.dataIndex]
         //调用申请接口
         const res = await etaTrialInterence.applyEnable({

src/views/custom_manage/etaTrialList/compontents/move.vue

@@ -0,0 +1,127 @@
+<template>
+<!-- 新增申请 提示弹窗 弹窗 -->
+  <div class="move-dialog">
+    <el-dialog
+      :visible.sync="isMoveShow"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      :title="title"
+      @close="handleMove(false)"
+      width="530px"
+      v-dialogDrag
+      center
+    >
+      <div class="dialog-container">
+        <el-form ref="form" :model="form" label-width="150px">
+          <el-form-item label="移动到">
+            <el-cascader
+              v-model="value"
+              placeholder="请选择用户"
+              style="width:200px;margin-right:10px;margin-bottom:8px;"
+              :options="salesArr"
+              :props="defaultSalesProps"
+              :show-all-levels="false"
+              :key="modifySales"
+              collapse-tags
+              clearable
+              filterable
+              @change="changeSales">
+            </el-cascader>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="foot-container">
+        <el-button @click="handleMove(false)">取 消</el-button>
+        <el-button type="primary" @click="handleMove">确定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {titleMap} from "../config"
+export default {
+  props:{
+    isMoveShow:{//弹窗显示
+      type:Boolean,
+      default:false
+    },
+    moveInfo:{//申请信息 
+      type:Object,
+      default:()=>{
+        return {
+          type:1,//1 移动 2 批量移动
+          salesArr:[],//销售列表
+          selectArr:[]//申请列表
+        }
+      }
+    }
+  },
+  computed:{
+  },
+  watch:{
+    isMoveShow(val){
+      if(val){
+
+        this.modifySales++
+        this.title = titleMap[this.moveInfo.type]
+        this.salesArr = this.moveInfo.salesArr
+        this.value = ''
+        this.$nextTick(() => {
+          this.$refs.form.clearValidate();
+          this.$refs.form.resetFields();
+        })
+      }
+    }
+  },
+  data() {
+    return {
+      title:'',
+      value:'',
+      defaultSalesProps:{
+				label:'RealName',
+				children:'ChildrenList',
+				value:'AdminId'
+			},//级联配置
+      modifySales:0,//用于重新渲染选择销售级联选择窗
+    };
+  },
+  methods: {
+    handleMove(isConfirm) {
+      const data = {
+        value:this.value,
+        type: this.moveInfo.type,
+        selectArr:this.moveInfo.selectArr
+      }
+      if(isConfirm){
+        this.$emit('moveConfirm', data)
+      }else{
+        this.$emit('closeMove')
+      }
+    }
+  },
+};
+</script>
+
+<style lang="scss">
+.move-dialog{
+  .dialog-container{
+    .el-input--suffix {
+      width: 100%;
+    }
+  }
+}
+
+</style>
+<style scoped lang="scss">
+.move-dialog{
+  .dialog-container{
+    margin-top: 40px;
+  }
+  .foot-container{
+    text-align: center;
+    padding-bottom: 40px;
+    margin-top: 60px;
+  }
+}
+</style>

src/views/custom_manage/etaTrialList/config.js

@@ -164,4 +164,9 @@ export const ApprovalStatus={
 export const textMap = {
   0:'该用户账号已禁用，是否申请启用',
   1:'该用户信息已提交申请 ，请勿重复提交'
+}
+//移动、批量移动弹窗
+export const titleMap = {
+  1:'移动',
+  2:'批量移动'
 }

src/views/custom_manage/etaTrialList/etaTrialList.vue

@@ -3,7 +3,8 @@
   <div class="eta-trial-list">
     <div class="table-select">
       <div class="btn-list">
-        <template v-if="Role.includes('admin')">
+        <template v-if="false">
+          <!-- !Role.includes('admin') -->
           <!-- 管理员-ETA试用列表 -->
           <template v-if="$route.path==='/etaTrialList'">
             <el-button type="primary" @click="changePath('/etaApprovalList')">审批列表</el-button>
@@ -29,13 +30,13 @@
           <!-- 非管理员-ETA试用列表 -->
           <template v-if="$route.path==='/etaTrialList'">
             <el-button type="primary" @click="changePath('/etaAddApproval')">新增申请</el-button>
-            <el-button type="primary" plain @click="changePath('/etaApprovalList')" style="margin-left: 30px;">申请列表</el-button>
+            <el-button type="primary" plain @click="changePath('/etaApprovalList')" style="margin-left: 30px;">客户管理</el-button>
             <el-button type="primary" @click="toQuestionnaireSurvey" style="margin-left: 30px;">问卷调研</el-button>
             <el-checkbox v-model="onlyMine" @change="onlyMineChange" style="margin-left: 30px;">我申请的</el-checkbox>
           </template>
           <!-- 非管理员-我的审批+账号列表 -->
           <template v-if="$route.path==='/etaApprovalList'">
-            <el-radio-group v-model="listType">
+            <!-- <el-radio-group v-model="listType">
               <el-radio-button label="all">我的审批</el-radio-button>
               <el-radio-button label="approved">账号列表</el-radio-button>
             </el-radio-group>
@@ -43,21 +44,34 @@
               content="该列表为初始账号密码，用于登陆ETA试用平台：https://exptest.hzinsights.com/" 
               placement="right">
               <span class="el-icon-question" style="margin-left:5px;color:#C0C4CC"></span>
-            </el-tooltip>
+            </el-tooltip> -->
+            <div class="tips">*账号用于登录ETA试用平台：https://exptest.hzinsights.com/</div>
+            <div class="right-header">
+              <span>已选{{selectedTotal}}</span>
+              <el-checkbox :indeterminate="isIndeterminate" v-model="isCheckAll" @change="listCheckAllChange" style="margin-left: 40px;">列表全选</el-checkbox>
+            </div>
           </template>
         </template>
       </div>
       <div class="search-wrap">
+        <template v-if="$route.path==='/etaApprovalList'">
+          <el-button type="primary" @click="batchMove">批量移动</el-button>
+          <el-button type="primary" @click="batchOperate">一键启用</el-button>
+        </template>
         <el-input
           v-model="searchText"
           prefix-icon="el-icon-search"
           placeholder="姓名/公司名称"
           @input="searchHandle"
+          style="width: 400px; margin-left: 20px;"
         ></el-input>
       </div>
     </div>
     <div class="table-wrap">
-      <el-table :data="tableData" @sort-change="sortChangeHandle" border v-loading="tableLoading">
+      <el-table :data="tableData" @sort-change="sortChangeHandle" ref="dataRef" border v-loading="tableLoading" @select="selectHandles" @select-all="selectAllHandle" @selection-change="selectionChange">
+        <!-- 多选 -->
+        <el-table-column align="center" type="selection" width="55" v-if="$route.path==='/etaApprovalList'">
+        </el-table-column>
         <el-table-column v-for="column in columnList" :key="column.label"
           align="center"
           :prop="column.key"
@@ -73,7 +87,7 @@
             <!-- <span v-else-if="column.key==='status'&&(Role.includes('admin')||listType==='all')">
               {{ApprovalStatus[row['status']]}}
             </span> -->
-            <span v-else-if="column.key==='Enabled'&&(!Role.includes('admin')&&listType==='approved')"
+            <span v-else-if="column.key==='Enabled'"
               :class="{'color-hint':row['Enabled']===0}"
             >
               {{row['Enabled']===0?'禁用':'启用'}}
@@ -86,7 +100,8 @@
         <el-table-column v-if="canEdit" label="操作" align="center">
           <template slot-scope="{row}">
             <!-- 非管理员-账号列表的操作: 申请启用 -->
-            <template v-if="!Role.includes('admin')&&listType==='approved'">
+            <template>
+              <el-button type="text" size="small" @click="Move(row)">移动</el-button>
               <el-button type="text" size="small" v-if="row.Enabled===0" @click="handleOperate('active',row)">申请启用</el-button>
             </template>
             <!-- 非管理员-我的审批操作: 撤回,重新申请,删除,驳回理由-->
@@ -99,21 +114,21 @@
               <el-button type="text" size="small" v-if="ApprovalStatus[row.ApprovalStatus]===1" @click="handleOperate('showDetail',row)">账号密码</el-button>
             </template>
             <!-- 管理员-审批列表操作: 审批-->
-            <template v-if="Role.includes('admin')">
+            <!-- <template v-if="Role.includes('admin')">
               <el-button type="text" size="small" v-if="ApprovalStatus[row.ApprovalStatus]===0" @click="handleOperate('approve',row)">审批</el-button>
-            </template>
+            </template> -->
           </template>
         </el-table-column>
       </el-table>
       <el-pagination
-					layout="total,prev,pager,next,jumper" 
-					background
-					:current-page="currentPage"
-					@current-change="handleCurrentChange"
-					:page-size="pageSize" 
-					:total="total"
-					style="text-align:right;margin-top:30px;">
-			</el-pagination>
+        layout="total,prev,pager,next,jumper" 
+        background
+        :current-page="currentPage"
+        @current-change="handleCurrentChange"
+        :page-size="pageSize" 
+        :total="total"
+        style="text-align:right;margin-top:30px;">
+      </el-pagination>
     </div>
     <!-- 申请账号审批/申请启用审批 弹窗 -->
     <apply-approval-dialog 
@@ -128,40 +143,45 @@
       @applyActiveSuccess="getTableData"
       @closeDialog="closeDialog"
       />
-      <!-- 查看账号密码弹窗 -->
-      <el-dialog 
-        v-if="showDetailDialogShow"
-        :visible.sync="showDetailDialogShow"
-        :close-on-click-modal="false"
-        :modal-append-to-body="false"
-        :title="`${applyInfo.applyData[0].UserName}——账号密码`"
-        width="889px"
-        v-dialogDrag
-        center
-      >
-        <div class="apply-detail">
-            <p>公司名称：{{applyInfo.applyData[0].CompanyName}}</p>
-            <p>账号：{{applyInfo.applyData[0].Account}}</p>
-            <p>密码：{{applyInfo.applyData[0].Password}}</p>
-            <div class="button">
-                <el-button type="primary" @click="showDetailDialogShow=false">知道了</el-button>
-            </div>
-        </div>
+    <!-- 移动弹窗 -->
+    <move :isMoveShow.sync="isMoveShow" :moveInfo="moveInfo" @moveConfirm="moveConfirm" @closeMove="closeMove" />
+
+    <!-- 查看账号密码弹窗 -->
+    <el-dialog 
+      v-if="showDetailDialogShow"
+      :visible.sync="showDetailDialogShow"
+      :close-on-click-modal="false"
+      :modal-append-to-body="false"
+      :title="`${applyInfo.applyData[0].UserName}——账号密码`"
+      width="889px"
+      v-dialogDrag
+      center
+    >
+      <div class="apply-detail">
+          <p>公司名称：{{applyInfo.applyData[0].CompanyName}}</p>
+          <p>账号：{{applyInfo.applyData[0].Account}}</p>
+          <p>密码：{{applyInfo.applyData[0].Password}}</p>
+          <div class="button">
+              <el-button type="primary" @click="showDetailDialogShow=false">知道了</el-button>
+          </div>
+      </div>
 
-      </el-dialog>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import AddApplyHintDialog from './compontents/addApplyHintDialog.vue';
+import move from './compontents/move.vue';
 import applyApprovalDialog from './compontents/applyApprovalDialog.vue';
 import{etaTrialColumn,
        adminApprovalList,
        approvedList,
        ApprovalStatus}from './config';
 import{etaTrialInterence}from '@/api/modules/crmApi.js';
+import { customInterence } from '@/api/api.js'
 export default {
-  components: { applyApprovalDialog, AddApplyHintDialog },
+  components: { applyApprovalDialog, AddApplyHintDialog, move },
   data() {
     return {
       /* 页面配置 */
@@ -169,7 +189,7 @@ export default {
       approvalNum: 0,//还剩多少条待审批
       searchText: "",//搜索框文字
       onlyMine:false,// 是否只是我申请的
-      listType: "all",//非管理员-列表类型,当角色为非管理员时,与当前路由一起确定table
+      listType: "approved",//非管理员-列表类型,当角色为非管理员时,与当前路由一起确定table
       approvalState: 2,//管理员-审批列表的默认选项
       approvalStateArr: [
         { key: 2, label: "待审批" },
@@ -196,13 +216,36 @@ export default {
       /* 弹窗 */
       isApplyApprovalDialogShow:false,
       isAddApplyHintShow:false,
-      showDetailDialogShow:false
+      showDetailDialogShow:false,
+
+      //全部全选
+      isIndeterminate:false,
+      isCheckAll:false,
+      isSelectAll:false,//为true时，selectList是剔除的指标，为false时selectList是已选择的指标
+      //已选择/已剔除的指标id
+      selectList:[],//监听table的select-all select
+      choiceIdList:[], //后端返回的选中的列表
+      tableDataIds:[],//后端返回的选中的列表id
+
+      isMoveShow:false,//移动弹窗
+      moveInfo:{
+        type: 1, //1 移动 2 批量移动
+        salesArr:[],//销售列表
+        selectArr:[],//已选择的id
+      },//移动信息
     };
   },
   computed: {
     Role() {
       return localStorage.getItem("Role");
     },
+    selectedTotal(){
+      if(this.isSelectAll){
+        return this.total - (this.selectList ? this.selectList.length : 0)
+      }else{
+        return this.selectList ? this.selectList.length : 0
+      }
+    },
   },
   watch: {
     '$route.path'(newval){
@@ -224,7 +267,14 @@ export default {
     }
   },
   methods: {
-    getTableData(){
+    getSalesArr() {
+      customInterence.getSale().then(res => {
+				if(res.Ret === 200) {
+          this.moveInfo.salesArr = res.Data.List || [];
+				}
+			})
+    },
+    getTableData(type){
       this.tableLoading=true
       //获取columnList和tableData
       let interenceName = ''
@@ -236,17 +286,17 @@ export default {
       }else if(this.currentPath=='/etaApprovalList'){
         this.canEdit = true
         //管理员-审批列表
-        if(this.Role.includes('admin')){
-          this.columnList = adminApprovalList
-          interenceName='getAdminApprovalList'
-        }
+        // if(this.Role.includes('admin')){
+        //   this.columnList = adminApprovalList
+        //   interenceName='getAdminApprovalList'
+        // }
         //非管理员-我的审批
-        if(!this.Role.includes('admin')&&this.listType=='all'){
-          this.columnList = adminApprovalList
-          interenceName='getApprovalAllList'
-        }
+        // if(!this.Role.includes('admin')&&this.listType=='all'){
+        //   this.columnList = adminApprovalList
+        //   interenceName='getApprovalAllList'
+        // }
         //非管理员-账号列表
-        if(!this.Role.includes('admin')&&this.listType!='all'){
+        if(this.listType!='all'){
           this.columnList = approvedList
           interenceName='getApprovalList'
         }
@@ -266,6 +316,21 @@ export default {
           this.total = Paging.Totals
           this.approvalNum = ApprovalNum||0
           this.tableLoading=false
+          if(this.tableData.length>0){
+            this.tableDataIds = this.tableData.map(it => it.EtaTrialId)
+          }else{
+            this.tableDataIds = []
+          }
+          if(type==='search'){
+              //如果是表格筛选项改变导致重新请求数据
+              //清除所选
+              this.selectList = []
+              this.listCheckAllChange(false)
+          }else{
+              //若不是，数据获取完成后，查询列表全选的值
+              //若当页有数据在selectList内，则勾选/剔除
+              this.adjustSelection()
+          }
         })
      /*  this.$nextTick(()=>{
         this.tableLoading=false
@@ -302,6 +367,106 @@ export default {
       this.currentPage=pageNo
       this.getTableData()
     },
+
+    //勾选/取消勾选表格项
+    adjustSelection(){
+      if(!this.isSelectAll){
+        this.tableData.map(it =>{
+              let row = this.selectList.includes(it.EtaTrialId)?it:''
+              if(row){
+                  this.$nextTick(()=>{
+                    this.$refs.dataRef.toggleRowSelection(row,true)
+                  })
+              }
+          })
+      }else{
+        this.tableData.map(it =>{
+          let row = this.selectList.includes(it.EtaTrialId)?'':it
+          if(row){
+            this.$nextTick(()=>{
+              this.$refs.dataRef.toggleRowSelection(row,true)
+            })
+          }
+        })
+      }
+    },
+    //列表全选改变
+    listCheckAllChange(value){
+        this.selectList = []
+        this.isSelectAll = value
+        this.$refs.dataRef && this.$refs.dataRef.clearSelection()
+        if(value){
+            this.$refs.dataRef && this.$refs.dataRef.toggleAllSelection()
+        }
+    },
+    selectionChange(selection){
+      // selectAllHandle的触发在selectionChange后面，将selectionChange的逻辑延迟一下
+      setTimeout(()=>{
+          // 去重
+          let duplicateArr = Array.from(new Set(this.selectList))
+          //isSelectAll为true时，selectList表示需要剔除的项
+          //isSelectAll为false时，selectList表示需要勾选的项
+          //全选
+          if((duplicateArr.length == this.total && (!this.isSelectAll))|| (duplicateArr.length == 0 && this.isSelectAll)){
+              this.isCheckAll = true
+              this.isIndeterminate=false
+          //全不选
+          }else if((duplicateArr.length == 0 && (!this.isSelectAll))|| (duplicateArr.length == this.total && this.isSelectAll)){
+              this.isCheckAll = false
+              this.isIndeterminate=false
+          //半选
+          }else{
+              this.isCheckAll = false
+              this.isIndeterminate=true
+          }
+      },1)
+    },
+    selectHandles(selection,row){
+        let check = false; 
+        if(selection.some(it => it.EtaTrialId == row.EtaTrialId)){
+            // 勾选
+            if(this.isSelectAll){
+                check=false
+            }else{
+                check=true
+            }
+        }else{
+            // 取消勾选
+            if(this.isSelectAll){
+                check=true
+            }else{
+                check=false
+            }
+        }
+        if(check){
+          this.selectList.push(row.EtaTrialId)
+        }else{
+          this.selectList=this.selectList.filter(it => it!=row.EtaTrialId)
+        }
+    },
+    selectAllHandle(selection){
+      let check = false; 
+      if(selection && selection.length>0){
+          // 全选
+          if(this.isSelectAll){
+              check=false
+          }else{
+              check=true
+          }
+      }else{
+          // 全不选
+          if(this.isSelectAll){
+              check=true
+          }else{
+              check=false
+          }
+      }
+      if(check){
+          this.selectList =  [...this.selectList,...this.tableDataIds]
+      }else{
+          this.selectList = this.selectList.filter(it => !this.tableDataIds.includes(it))
+      }
+    },
     //将表格数据转换成applyInfo的形式
     getApplyInfo(type,data){
       //data.ApplyMethod 这条数据是申请账号1,还是申请启用2
@@ -400,14 +565,76 @@ export default {
     closeDialog(){
       this.isAddApplyHintShow = false
       this.getTableData()
-    }
+    },
+    moveConfirm(data) {
+      console.log(data);
+      const {type, value, selectArr} = data
+      const currentSellerId = parseInt(value[value.length-1])
+      const params = {
+        currentSellerId,
+        EtaTrialIdList: selectArr,
+        IsCheckAll: type === 1 ? false : this.isSelectAll,
+        CurrentSellerName: this.findElementByAdminId(this.moveInfo.salesArr, currentSellerId).RealName
+      }
+      etaTrialInterence.accountTransfer(params).then(res=>{
+        if(res.Ret!==200) return
+        this.$message.success('移动成功')
+        this.getTableData()
+        this.isMoveShow = false
+      })
+    },
+    findElementByAdminId(arr, adminId) {
+      console.log(arr);
+      console.log(adminId);
+      adminId = adminId + ''
+      for (const element of arr) {
+        if (element.AdminId === adminId) {
+          return element; // 如果找到匹配的AdminId，直接返回该元素
+        }
+        if (element.ChildrenList && element.ChildrenList.length > 0) {
+          const found = this.findElementByAdminId(element.ChildrenList, adminId); // 递归查找子列表
+          if (found) {
+            return found; // 如果在子列表中找到了匹配的元素，返回它
+          }
+        }
+      }
+      return null; // 如果没有找到匹配的元素，返回null
+    },
+    closeMove() {
+      this.isMoveShow = false
+    },
+    Move(row) {
+      this.moveInfo.type = 1
+      this.moveInfo.selectArr = [row.EtaTrialId]
+      this.isMoveShow = true
+    },
+    batchMove() {
+      if (this.selectList.length === 0) return this.$message.warning('请至少选择一个客户')
+      this.moveInfo.type = 2
+      this.moveInfo.selectArr = this.selectList
+      this.isMoveShow = true               
+    },
+    async batchOperate() {
+      if(this.getMobileList(this.tableData, this.selectList).length === 0) return this.$message.warning('请至少选择一个客户')
+      const res = await etaTrialInterence.applyEnable({
+        MobileList:this.getMobileList(this.tableData, this.selectList),
+        IsCheckAll:this.isSelectAll,
+      })
+      if(res.Ret!==200) return 
+      this.getTableData()
+      this.$message.success('启用成功')
+    },
+    getMobileList(array1, array2) {
+      return array1.filter(element => array2.includes(element.EtaTrialId)).map(element => element.Mobile);
+    },
   },
   //如果需要刷新时存listType 用beforeRouteLeave
   mounted(){
     this.currentPath = this.$route.path
-    this.listType = sessionStorage.getItem('etaApprovalListType')||'all'
-    sessionStorage.removeItem('etaApprovalListType')
+    // this.listType = sessionStorage.getItem('etaApprovalListType')||'all'
+    // sessionStorage.removeItem('etaApprovalListType')
     this.getTableData()
+    this.getSalesArr()
   }
 };
 </script>
@@ -427,8 +654,6 @@ export default {
     display: flex;
     justify-content: space-between;
     .btn-list{
-      display: flex;
-      align-items: center;
       .approval-hint{
         margin-left: 15px;
         border-radius: 4px;
@@ -447,9 +672,23 @@ export default {
           border-right: 6px solid #FEF0F0;
         }
       }
+      .tips {
+        margin: 10px 25px;
+        font-family: Arial;
+        font-size: 15px;
+        font-weight: 400;
+        line-height: 17.25px;
+        text-align: center;
+        color: rgba(153, 153, 153, 1);
+      }
+      .right-header {
+        margin-top: 40px;
+      }
     }
     .search-wrap{
-      width:400px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
     }
   }
   .table-wrap{