feat:合并

src/components/student/CommonStudent.vue

@@ -11,7 +11,7 @@
       <div class="drawerMain" id="ProjCheckship">
         <div class="header">
           <div class="headerTitle">
-            {{ {1: '添加学员', 2: '添加学员', 3: '添加学员'}[type] || '' }}
+            {{ { 1: "添加学员", 2: "添加学员", 3: "添加学员" }[type] || "" }}
           </div>
           <img
             style="width: 29px; height: 29px; cursor: pointer"
@@ -19,8 +19,10 @@
             @click="closeDrawer"
           />
         </div>
-        <div style="width:100%;display: grid;grid-template-columns: 750px auto;">
-          <div class="tabs" style="min-height:800px;">
+        <div
+          style="width: 100%; display: grid; grid-template-columns: 750px auto"
+        >
+          <div class="tabs" style="min-height: 800px">
             <a-tabs v-model:activeKey="activeKey">
               <a-tab-pane :key="1" tab="快速选人">
                 <div :style="{ height: screenHeight - 235 + 'px' }">
@@ -31,19 +33,35 @@
                         style="width: 270px; height: 40px; border-radius: 8px"
                         placeholder="请输入姓名"
                       />
-                      <a-button type="primary" @click="onSearchStu" style="margin-left: 20px;border-radius: 4px">
+                      <a-button
+                        type="primary"
+                        @click="onSearchStu"
+                        style="margin-left: 20px; border-radius: 4px"
+                      >
                         <template #icon>
                           <SearchOutlined />
                         </template>
                         搜索
                       </a-button>
-                      <a-button @click="resetStu" style="margin-left: 20px;border-radius: 4px">重置</a-button>
+                      <a-button
+                        @click="resetStu"
+                        style="margin-left: 20px; border-radius: 4px"
+                        >重置</a-button
+                      >
                     </a-form-item>
                   </div>
-                  <div class="chooseLeft" style="display: grid;grid-template-columns: 250px auto">
-                    <div :style="{ height: screenHeight - 180 + 'px' ,overflowY:'auto'}"
-                         style="border: 1px solid #f0f0f0; ;">
-                      <div class="tree" style="margin: 10px 4px 220px 10px;">
+                  <div
+                    class="chooseLeft"
+                    style="display: grid; grid-template-columns: 250px auto"
+                  >
+                    <div
+                      :style="{
+                        height: screenHeight - 180 + 'px',
+                        overflowY: 'auto',
+                      }"
+                      style="border: 1px solid #f0f0f0"
+                    >
+                      <div class="tree" style="margin: 10px 4px 220px 10px">
                         <a-tree
                           allow-clear
                           tree-default-expand-all
@@ -59,7 +77,13 @@
                         </a-tree>
                       </div>
                     </div>
-                    <div class="tableBox tabb" style="margin: 0px 4px 120px 10px; border: 1px solid #f0f0f0;">
+                    <div
+                      class="tableBox tabb"
+                      style="
+                        margin: 0px 4px 120px 10px;
+                        border: 1px solid #f0f0f0;
+                      "
+                    >
                       <a-table
                         :columns="stuColumns"
                         :data-source="stuData"
@@ -111,9 +135,7 @@
               <!--                </div>-->
               <!--              </a-tab-pane>-->
               <a-tab-pane :key="3" tab="受众关联">
-                <div
-                    :style="{ height: screenHeight - 235 + 'px' }"
-                >
+                <div :style="{ height: screenHeight - 235 + 'px' }">
                   <div>
                     <a-form-item label="受众名称：">
                       <a-input
@@ -121,13 +143,21 @@
                         style="width: 260px; height: 40px; border-radius: 8px"
                         placeholder="请输入受众名称"
                       />
-                      <a-button type="primary" @click="searchAudi" style="margin-left: 20px;border-radius: 4px">
+                      <a-button
+                        type="primary"
+                        @click="searchAudi"
+                        style="margin-left: 20px; border-radius: 4px"
+                      >
                         <template #icon>
                           <SearchOutlined />
                         </template>
                         搜索
                       </a-button>
-                      <a-button @click="resetAudienceInfo" style="margin-left: 20px;border-radius: 4px">重置</a-button>
+                      <a-button
+                        @click="resetAudienceInfo"
+                        style="margin-left: 20px; border-radius: 4px"
+                        >重置</a-button
+                      >
                     </a-form-item>
                   </div>
                   <div class="tableBox tabb">
@@ -149,9 +179,7 @@
             <div class="onerow">
               <div class="onleft">
                 <div class="already">已选</div>
-
               </div>
-
             </div>
             <div
               class="selecteds"
@@ -173,17 +201,20 @@
                       <div class="ch" @click="stuDel(i)"></div>
                     </div>
                   </div>
-
                 </div>
-
               </div>
-              <div v-if="!person && selectsData.studentList.length >10" class="ifsw">
-                <div @click="person = !person" class=“sw”>查看更多></div>
+              <div
+                v-if="!person && selectsData.studentList.length > 10"
+                class="ifsw"
+              >
+                <div @click="person = !person" class="“sw”">查看更多></div>
               </div>
-              <div v-if="person && selectsData.studentList.length >10" class="ifsw">
+              <div
+                v-if="person && selectsData.studentList.length > 10"
+                class="ifsw"
+              >
                 <div @click="person = !person" class="sw">收起&lt;</div>
               </div>
-
               <!--组织-->
               <!--          <div  class="dept">添加组织</div>-->
               <!--          <div v-for="(item,i) in selectsData.deptList"  >-->
@@ -206,8 +237,6 @@
               <!--          </div>-->
               <!--          <div v-if="!dept && selectsData.deptList.length >10" class="ifsw"><div @click="dept = !dept" class=“sw”>查看更多></div></div>-->
               <!--          <div v-if="dept && selectsData.deptList.length >10" class="ifsw" ><div @click="dept = !dept" class="sw"> 收起&lt;  </div></div>-->
-
-
               <!--受众-->
               <div class="group">受众关联</div>
               <div v-for="(item, i) in selectsData.groupList">
@@ -224,18 +253,17 @@
                       <div class="ch2" @click="AuditDel(i)"></div>
                     </div>
                   </div>
-
                 </div>
-
               </div>
-              <div v-if="!group && selectsData.groupList.length >10" class="ifsw">
-                <div @click="group = !group" class=“sw”>查看更多></div>
+              <div
+                v-if="!group && selectsData.groupList.length > 10"
+                class="ifsw"
+              >
+                <div @click="group = !group" class="“sw”">查看更多></div>
               </div>
               <div v-if="group && selectsData.groupList > 10" class="ifsw">
                 <div @click="group = !group" class="sw">收起&lt;</div>
               </div>
-
-
             </div>
           </div>
           <!-- <div style="padding:100px 0 0 20px;display: grid;grid-template-rows: auto auto auto;">
@@ -243,7 +271,6 @@
                <div style="margin-top: 20px">快速选人</div>
                // eslint-disable-next-line vue/require-v-for-key
                <div v-for="(item,i) in selectsData.studentList" >
-
                <a-tag v-if="i < 10" :closable="true" color="#4ea6ff" @close="stuDel(i)"
                       :key="i" style="margin-top:20px">
                  {{ item.realName }}
@@ -252,7 +279,6 @@
                        style="margin-top:20px">
                  {{ item.realName }}
                </a-tag>
-
                <div></div>
              </div>
              </div>
@@ -283,14 +309,22 @@
       <slot></slot>
     </div>
   </div>
-  <a-modal v-model:visible="stageVisible" width="1000px" title="选择阶段" @ok="handleStageOk">
+  <a-modal
+    v-model:visible="stageVisible"
+    width="1000px"
+    title="选择阶段"
+    @ok="handleStageOk"
+  >
     <div>
-      {{ type === 1 ? '选择阶段' : '选择关卡' }}
-      <a-select style="width: 150px" :placeholder="type===1?'选择阶段':'选择关卡'" v-model:value="selectsData.stageId"
-                className="cus-select">
-        <a-select-option v-for="(item,i) in stageIds" :key="i" :value="item.id">{{
-            item.name || '默认'
-          }}
+      {{ type === 1 ? "选择阶段" : "选择关卡" }}
+      <a-select
+        style="width: 150px"
+        :placeholder="type === 1 ? '选择阶段' : '选择关卡'"
+        v-model:value="selectsData.stageId"
+        className="cus-select"
+      >
+        <a-select-option v-for="(item, i) in stageIds" :key="i" :value="item.id"
+          >{{ item.name || "默认" }}
         </a-select-option>
       </a-select>
     </div>
@@ -302,81 +336,76 @@ import {useStore} from "vuex";
 import { useBoeApiPage } from "@/api/request";
 import { AUDIENCE_LIST, USER_LIST } from "@/api/ThirdApi";
 import { saveStu } from "@/api/index1";
-
 const store = useStore();
-const emit = defineEmits({})
+const emit = defineEmits({});
 const props = defineProps({
   type: Number,
   id: String,
   stage: {
     type: Array,
-    default: () => []
-  }
-})
-const person = ref(false)
+    default: () => [],
+  },
+});
+const person = ref(false);
 // const dept =ref(false)
-const group = ref(false)
-const visiable = ref(false)
-const activeKey = ref(1)
-const stageVisible = ref(false)
+const group = ref(false);
+const visiable = ref(false);
+const activeKey = ref(1);
+const stageVisible = ref(false);
 const selectsData = ref({
-  stageId: '',
+  stageId: "",
   studentList: [],
   deptList: [],
-  groupList: []
-})
+  groupList: [],
+});
 const nameSearch = ref({
-  keyword: '',
+  keyword: "",
   departId: null,
   page: 1,
-  pageSize: 10
-})
+  pageSize: 10,
+});
 const audienceName = ref({
-  keyword: '',
+  keyword: "",
   page: 1,
-  pageSize: 10
-})
+  pageSize: 10,
+});
 // const searchOrgName = ref({
 //   keyword: '',
 //   page: 1,
 //   pageSize: 10
 // })
-
-const stageIds = computed(() => props.stage)
-
+const stageIds = computed(() => props.stage);
 const {
   data: stuData,
   fetch: searchStu,
   page: stuPageNo,
   pageSize: stuPageSize,
   loading: stuLoading,
-  total: stuTotal
+  total: stuTotal,
 } = useBoeApiPage(USER_LIST, nameSearch.value, {
   init: false,
-  result: res => res.result.userInfoList,
-  totalPage: res => res.result.totalPage,
-  total: res => res.result.totalElement
-})
-
+  result: (res) => res.result.userInfoList,
+  totalPage: (res) => res.result.totalPage,
+  total: (res) => res.result.totalElement,
+});
 // const {
 //   data: orgData,
 //   fetch: searchOrg,
 // } = useBoeApi(ORG_LIST, searchOrgName.value)
-
 const {
   data: audiData,
   fetch: searchAudi,
   page: audiPageNo,
   pageSize: audiPageSize,
   loading: audiLoading,
-  total: audiTotal
+  total: audiTotal,
 } = useBoeApiPage(AUDIENCE_LIST, audienceName.value, {
   init: true,
-  result: res => res.result.audienceList.map(e => ({...e, id: e.id + ''})),
-  totalPage: res => res.result.totalPage,
-  total: res => res.result.totalElement
-})
-
+  result: (res) =>
+    res.result.audienceList.map((e) => ({ ...e, id: e.id + "" })),
+  totalPage: (res) => res.result.totalPage,
+  total: (res) => res.result.totalElement,
+});
 const stuColumns = ref([
   {
     title: "姓名",
@@ -414,7 +443,7 @@ const stuColumns = ref([
     className: "h",
     ellipsis: true,
   },
-])
+]);
 const audiColums = ref([
   {
     title: "受众名称",
@@ -441,142 +470,125 @@ const audiColums = ref([
     align: "center",
     className: "h",
   },
-])
-const stuSelectKeys = ref([])
-const orgSelectKeys = ref([])
-const auditSelectKeys = ref([])
-const screenHeight = ref(document.body.clientHeight)
+]);
+const stuSelectKeys = ref([]);
+const orgSelectKeys = ref([]);
+const auditSelectKeys = ref([]);
+const screenHeight = ref(document.body.clientHeight);
 const stuRowSelection = computed(() => ({
   columnWidth: 20,
   selectedRowKeys: stuSelectKeys.value,
   onChange: onStuSelectChange,
   preserveSelectedRowKeys: true,
-}))
+}));
 const orgRowSelection = computed(() => ({
   columnWidth: 20,
   selectedRowKeys: orgSelectKeys.value,
   onChange: onOrgSelectChange,
   preserveSelectedRowKeys: true,
-}))
-
+}));
 const stuPagination = computed(() => ({
   total: stuTotal.value,
   showSizeChanger: false,
   current: stuPageNo.value,
   pageSize: stuPageSize.value,
-  onChange: changePagination
-}))
-
+  onChange: changePagination,
+}));
 const auditPagination = computed(() => ({
   total: audiTotal.value,
   showSizeChanger: false,
   current: audiPageNo.value,
   pageSize: audiPageSize.value,
-  onChange: auditChangePagination
-}))
-
+  onChange: auditChangePagination,
+}));
 const auditRowSelection = computed(() => ({
   columnWidth: 20,
   selectedRowKeys: auditSelectKeys.value,
   onChange: onAuditSelectChange,
   preserveSelectedRowKeys: true,
-}))
-
+}));
 const closeDrawer = () => {
-  visiable.value = false
+  visiable.value = false;
 };
 const openDrawer = () => {
-  visiable.value = true
+  visiable.value = true;
 };
 //获取组织树
 const treeData = computed(() => {
   return store.state.orgtreeList ? store.state.orgtreeList : [];
 });
-
 function onSearchStu() {
-  nameSearch.value.page = 1
-  searchStu()
+  nameSearch.value.page = 1;
+  searchStu();
 }
-
 function stuStuOrgSelect(e) {
-  nameSearch.value.departId = e.join('')
-  searchStu()
+  nameSearch.value.departId = e.join("");
+  searchStu();
 }
-
 function stuDel(i) {
-  stuSelectKeys.value = stuSelectKeys.value.filter(e => e !== selectsData.value.studentList[i].id)
-  selectsData.value.studentList.splice(i, 1)
+  stuSelectKeys.value = stuSelectKeys.value.filter(
+    (e) => e !== selectsData.value.studentList[i].id
+  );
+  selectsData.value.studentList.splice(i, 1);
 }
-
 // function orgDel(i) {
 //   orgSelectKeys.value = orgSelectKeys.value.filter(e => e !== selectsData.value.deptList[i].id)
 //   selectsData.value.deptList.splice(i, 1)
 // }
-
 function AuditDel(i) {
-  auditSelectKeys.value = auditSelectKeys.value.filter(e => e !== selectsData.value.groupList[i].id)
-  selectsData.value.groupList.splice(i, 1)
+  auditSelectKeys.value = auditSelectKeys.value.filter(
+    (e) => e !== selectsData.value.groupList[i].id
+  );
+  selectsData.value.groupList.splice(i, 1);
 }
-
-
 // function orgSelect(key, obj) {
 // console.log(obj)
 //request(ORG_CHILD_LIST, {orgId: null}).then(res => {
 //console.log(res.result)
 //})
 //}
-
 function onStuSelectChange(e, l) {
-  stuSelectKeys.value = e
-  selectsData.value.studentList = l
+  stuSelectKeys.value = e;
+  selectsData.value.studentList = l;
 }
-
 function onOrgSelectChange(e, l) {
-  orgRowSelection.value = e
-  selectsData.value.deptList = l.selectedNodes
+  orgRowSelection.value = e;
+  selectsData.value.deptList = l.selectedNodes;
 }
-
 function onAuditSelectChange(e, l) {
-  auditSelectKeys.value = e
-  selectsData.value.groupList = l
+  auditSelectKeys.value = e;
+  selectsData.value.groupList = l;
 }
-
 // const stuDepartmentSelect = (e) => {
 //   nameSearch.value.orgId = e.join('')
 //   searchStu()
 // };
-
 //分页获取学员
 const changePagination = (page) => {
   nameSearch.value.page = page;
-  searchStu()
+  searchStu();
 };
-
 const auditChangePagination = (page) => {
   audienceName.value.page = page;
-  searchAudi()
+  searchAudi();
 };
-
 //重置
 const resetStu = () => {
   deleteDepSelect();
-  nameSearch.value = {keyword: '', page: 1, pageSize: 10}
+  nameSearch.value = { keyword: "", page: 1, pageSize: 10 };
 };
 //清空选择部门信息
 const deleteDepSelect = () => {
-  stuSelectKeys.value = []
+  stuSelectKeys.value = [];
 };
-
 //重置组织
 // const resetOrg = () => {
 //   searchOrgName.value = {keyword: '', page: 1, pageSize: 10}
 // };
-
 //重置受众
 const resetAudienceInfo = () => {
-  audienceName.value = {keyword: '', page: 1, pageSize: 10}
+  audienceName.value = { keyword: "", page: 1, pageSize: 10 };
 };
-
 //全部清除
 // const deleteAll = () => {
 //   selectsData.value = {
@@ -588,57 +600,52 @@ const resetAudienceInfo = () => {
 //确定添加授权
 const submitAuth = () => {
   if (props.type === 2) {
-    stageVisible.value = true
+    stageVisible.value = true;
   } else {
-    handleStageOk()
+    handleStageOk();
   }
 };
-
 function handleStageOk() {
-  stageVisible.value = false
-  visiable.value = false
-  emit('finash', false)
+  stageVisible.value = false;
+  visiable.value = false;
+  emit("finash", false);
   saveStu({
     targetId: props.id,
     type: props.type,
-    deptIds: selectsData.value.deptList?.map(e => e.id),
+    deptIds: selectsData.value.deptList?.map((e) => e.id),
     stageId: selectsData.value.stageId,
-    groupIds: selectsData.value.groupList?.map(e => e.id),
-    studentList: selectsData.value.studentList
+    groupIds: selectsData.value.groupList?.map((e) => e.id),
+    studentList: selectsData.value.studentList,
   }).then(() => {
-    emit('finash', true)
-  })
+    emit("finash", true);
+  });
 }
-
 watch(visiable, () => {
-  stuSelectKeys.value = []
-  orgSelectKeys.value = []
-  auditSelectKeys.value = []
-  stuData.value = []
-  audienceName.value.keyword = ''
-  audienceName.value.page = 1
-  audienceName.value.pageSize = 10
+  stuSelectKeys.value = [];
+  orgSelectKeys.value = [];
+  auditSelectKeys.value = [];
+  stuData.value = [];
+  audienceName.value.keyword = "";
+  audienceName.value.page = 1;
+  audienceName.value.pageSize = 10;
   selectsData.value = {
-    stageId: '',
+    stageId: "",
     studentList: [],
     deptList: [],
-    groupList: []
-  }
-  searchAudi()
-})
-
+    groupList: [],
+  };
+  searchAudi();
+});
 </script>
 <style lang="scss">
 .CommonStudent {
   .ant-btn-primary {
     background-color: #4ea6ff !important;
   }
-
   .cus-select {
     height: 40px;
     border-radius: 8px;
   }
-
   .tableBox .ant-table-row .ant-table-cell {
     height: 48px;
     font-size: 14px;
@@ -647,37 +654,30 @@ watch(visiable, () => {
     line-height: 29px;
     padding: 0px;
   }
-
   .tableBox .ant-table-thead tr th {
     font-size: 14px;
   }
-
   .ant-tabs-tabpane {
     height: 100%;
   }
-
   .ant-tabs {
     overflow: visible;
   }
-
+}
 .right1 {
   border-left: 1px solid #f2f6fe;
   width: 100%;
   margin-left: 20px;
-
   .onerow {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-right: 40px;
     flex-wrap: wrap;
-
     width: 100%;
-
     .onleft {
       display: flex;
       text-align: center;
-
       .already {
         color: rgba(51, 51, 51, 1);
         font-size: 16px;
@@ -686,20 +686,17 @@ watch(visiable, () => {
         white-space: nowrap;
         // margin-bottom: 20px;
       }
-
       .count {
         color: #4ea6ff;
         font-size: 16px;
         margin: 0 6px;
       }
-
       .peo {
         color: rgba(51, 51, 51, 1);
         font-size: 16px;
         font-weight: 500;
       }
     }
-
     .clbox {
       margin-right: 50px;
       display: flex;
@@ -710,7 +707,6 @@ watch(visiable, () => {
       height: 32px;
       border-radius: 4px;
       background: #4ea6ff;
-
       .colose {
         width: 16px;
         height: 16px;
@@ -721,25 +717,21 @@ watch(visiable, () => {
         background-size: 100%;
         margin-right: 4px;
       }
-
       .allclear {
         color: rgba(255, 255, 255, 1);
         font-size: 14px;
       }
     }
   }
-
   .selecteds {
     display: flex;
     flex-wrap: wrap;
     margin-left: 32px;
-
     .person {
       width: 100%;
       margin-top: 20px;
       border-top: 1px solid #f2f6fe;
     }
-
     .chose {
       width: 64px;
       height: 24px;
@@ -753,7 +745,6 @@ watch(visiable, () => {
       color: rgba(56, 139, 225, 1);
       font-size: 12px;
       position: relative;
-
       .ch {
         position: absolute;
         width: 18px;
@@ -763,14 +754,12 @@ watch(visiable, () => {
         top: -8px;
       }
     }
-
     .ifsw {
       display: flex;
       align-items: end;
       justify-content: center;
       color: #4ea6ff;
     }
-
     .sw {
       display: flex;
       align-items: center;
@@ -780,13 +769,11 @@ watch(visiable, () => {
       margin-top: 23px;
       margin-left: 10px;
     }
-
     .dept {
       width: 100%;
       margin-top: 30px;
       border-top: 1px solid #f2f6fe;
     }
-
     .chose1 {
       //width: 90px;
       height: 24px;
@@ -800,13 +787,11 @@ watch(visiable, () => {
       color: rgba(56, 139, 225, 1);
       font-size: 12px;
       position: relative;
-
       .span {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
       }
-
       .ch1 {
         position: absolute;
         width: 18px;
@@ -816,13 +801,11 @@ watch(visiable, () => {
         top: -8px;
       }
     }
-
     .group {
       width: 100%;
       margin-top: 30px;
       border-top: 1px solid #f2f6fe;
     }
-
     .chose2 {
       //width: 120px;
       height: 24px;
@@ -836,13 +819,11 @@ watch(visiable, () => {
       color: rgba(56, 139, 225, 1);
       font-size: 12px;
       position: relative;
-
       .span {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
       }
-
       .ch2 {
         position: absolute;
         width: 18px;
@@ -854,5 +835,4 @@ watch(visiable, () => {
     }
   }
 }
-}
 </style>

src/components/student/TableStudent.vue

@@ -63,12 +63,12 @@
           批量删除
         </a-button>
       </a-col>
-      <a-col :span="1.5" v-if="type == 2">
+      <!-- <a-col :span="1.5" v-if="type == 2">
         <a-button class="cus-btn white" @click="showChangeModal">
           <template #icon></template>
           批量调整关卡
         </a-button>
-      </a-col>
+      </a-col> -->
     </a-row>
     <div style="margin-top: 20px">
       <a-table
@@ -259,10 +259,10 @@ function submitCall(flag) {
 }
 
 //调整关卡
-const visiblene = ref(false);
-const showChangeModal = () => {
-  visiblene.value = true;
-};
+// const visiblene = ref(false);
+// const showChangeModal = () => {
+//   visiblene.value = true;
+// };
 </script>
 <style>
 .studentopea1 {