feat: Add 添加SignupModal组件，并在CourseManage中集成注册功能；

src/api/signup/commonStudent.js

@@ -0,0 +1,33 @@
+import ajax2 from "../unionAjax.js";
+
+export const STUDENT_LIST = "/manageApi/admin/student/getStudent";
+export const USER_LIST_PAGE = "/manageApi/admin/thirdApi/user/list";
+export const ORG_LIST = "/manageApi/admin/thirdApi/org/list";
+export const ORG_CHILD_LIST = "/manageApi/admin/thirdApi/org/info";
+export const AUDIENCE_LIST = "/manageApi/admin/thirdApi/audience/userAudiences";
+
+// 保存学员信息（走 manageApi，POST）
+export const saveStu = (data) =>
+  ajax2.postJson("/manageApi", "/admin/student/addStudent", data);
+
+// 获取项目学员列表（走 manageApi，GET）
+export const fetchProjectStudents = (params = {}) => {
+  return ajax2.get1(STUDENT_LIST, params);
+};
+
+// 快速学员搜索（走 manageApi，POST）
+export const fetchQuickStudents = (params) =>
+  ajax2.get1(USER_LIST_PAGE, params);
+
+// 组织列表（走 manageApi，POST）
+export const fetchOrgList = (params) =>
+  ajax2.get1(ORG_LIST, params);
+
+// 子组织列表（走 manageApi，POST）
+export const fetchOrgChildren = (params) =>
+  ajax2.get1(ORG_CHILD_LIST, params);
+
+// 受众列表（走 manageApi，POST）
+export const fetchAudienceList = (params) =>
+  ajax2.get1(AUDIENCE_LIST, params);
+

src/api/unionAjax.js

@@ -106,6 +106,15 @@ const get = function (baseURL, url) {
   })
 }
 
+const get1= function (baseURL, params) {
+  return request({
+    baseURL,
+    method: 'get',
+    params: params,
+    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
+  })
+}
+
 /**
  * post请求
  * @param {Object} url
@@ -199,6 +208,7 @@ export default {
   tokenName: TokenName,
   request,
   get,
+  get1,
   post,
   postJson,
   postJsonToFile,

src/components/signup/SignupModal.vue

@@ -0,0 +1,735 @@
+<template>
+  <div v-if="visible">
+    <el-dialog :visible="visible" :title="dialogTitle" width="1200px" top="8vh" append-to-body destroy-on-close
+      class="signup-dialog" @close="handleClose">
+      <div class="signup-wrap">
+        <el-tabs v-model="activeTab">
+          <el-tab-pane v-if="infoType" label="项目内学员" name="project">
+            <div class="tab-search">
+              <span class="label">姓名：</span>
+              <el-input v-model="projectParams.studentName" placeholder="请输入姓名" size="small" clearable class="input" />
+              <el-button type="primary" size="small" @click="getProjectStu">
+                搜索
+              </el-button>
+              <el-button size="small" @click="resetProjectStu">重置</el-button>
+            </div>
+            <el-table height="360" border :data="projectStu.list" style="width: 100%"
+              @selection-change="onProjectSelectionChange">
+              <el-table-column type="selection" width="50" />
+              <el-table-column prop="studentName" label="姓名" width="120" />
+              <el-table-column prop="studentUserNo" label="工号" width="140" />
+              <el-table-column prop="studentOrgName" label="归属组织" show-overflow-tooltip />
+              <el-table-column prop="studentDepartName" label="部门" />
+            </el-table>
+            <div class="pager">
+              <el-pagination background layout="total, prev, pager, next, jumper" :page-size="projectStu.pageSize"
+                :current-page="projectStu.pageNo" :total="projectStu.total" @current-change="onProjectPageChange" />
+            </div>
+          </el-tab-pane>
+
+          <el-tab-pane label="快速选人" name="quick">
+            <div class="tab2">
+              <div class="tab-search">
+                <span class="label">姓名：</span>
+                <el-input v-model="nameSearch.keyword" placeholder="请输入姓名" size="small" clearable class="input" />
+                <el-button type="primary" size="small" @click="onSearchStu">
+                  搜索
+                </el-button>
+                <el-button size="small" @click="resetStu">重置</el-button>
+              </div>
+              <div class="split">
+                <div class="left-tree">
+                  <el-tree :data="treeData" :props="treeProps" node-key="id" highlight-current lazy :load="loadOrgNode"
+                    @node-click="onOrgSelect" />
+                </div>
+                <div class="table-area">
+                  <el-table border :data="stuTable.list" 
+                    @selection-change="onStuSelectionChange" :row-key="row => row.id || row.userId">
+                    <el-table-column type="selection" width="50" />
+                    <el-table-column prop="realName" label="姓名" width="120" />
+                    <el-table-column prop="userNo" label="工号" width="120" />
+                    <el-table-column prop="orgName" label="归属组织" min-width="160" show-overflow-tooltip />
+                    <el-table-column prop="departName" label="部门" min-width="140" />
+                  </el-table>
+                  <div class="pager">
+                    <el-pagination background layout="total, prev, pager, next, jumper" :page-size="stuTable.pageSize"
+                      :current-page="stuTable.pageNo" :total="stuTable.total" @current-change="onStuPageChange" />
+                  </div>
+                </div>
+              </div>
+            </div>
+          </el-tab-pane>
+
+          <el-tab-pane v-if="!selectStu" label="添加组织" name="org">
+            <div class="tab-search">
+              <span class="label">组织：</span>
+              <el-input v-model="searchOrgName.keyword" placeholder="请输入组织" size="small" clearable class="input"
+                @change="onOrgKeywordChange" />
+              <el-button type="primary" size="small" @click="searchOrg">
+                搜索
+              </el-button>
+              <el-button size="small" @click="resetOrg">重置</el-button>
+            </div>
+            <el-tree class="org-tree" show-checkbox node-key="id" :data="orgList" :props="orgTreeProps" lazy
+              :load="loadOrgNodeFull" @check-change="onOrgCheckChange" :default-checked-keys="selectedOrgKeys" />
+          </el-tab-pane>
+
+          <el-tab-pane v-if="!selectStu" label="受众关联" name="audience">
+            <div class="tab-search">
+              <span class="label">受众名称：</span>
+              <el-input v-model="audienceName.keyword" placeholder="请输入受众名称" size="small" clearable class="input" />
+              <el-button type="primary" size="small" @click="searchAudience">
+                搜索
+              </el-button>
+              <el-button size="small" @click="resetAudienceInfo">重置</el-button>
+            </div>
+            <el-table height="360" border :data="audienceTable.list" @selection-change="onAudienceSelectionChange"
+              :row-key="row => row.id">
+              <el-table-column type="selection" width="50" />
+              <el-table-column prop="audienceName" label="受众名称" min-width="220" />
+              <el-table-column prop="totalMember" label="总人数" width="100" />
+              <el-table-column prop="workMember" label="在职人数" width="120" />
+            </el-table>
+            <div class="pager">
+              <el-pagination background layout="total, prev, pager, next, jumper" :page-size="audienceTable.pageSize"
+                :current-page="audienceTable.pageNo" :total="audienceTable.total"
+                @current-change="onAudiencePageChange" />
+            </div>
+          </el-tab-pane>
+        </el-tabs>
+
+        <div class="right1">
+          <div class="onerow">
+            <div class="onleft">
+              <div class="already">已选</div>
+            </div>
+          </div>
+          <div :style="{ 'max-height': screenHeight - 235 + 'px' }" style="overflow-y: auto">
+            <div class="selecteds" v-if="infoType">
+              <div class="person">项目内学员</div>
+              <div v-for="(item, i) in projectSelectRows" :key="item.id || item.studentId">
+                <div v-if="i < 11">
+                  <div class="chose">
+                    {{ item.studentName }}
+                    <div class="ch" @click="removeProject(item)"></div>
+                  </div>
+                </div>
+                <div v-else>
+                  <div v-if="member">
+                    <div class="chose">
+                      {{ item.studentName }}
+                      <div class="ch" @click="removeProject(item)"></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div v-if="!member && projectSelectRows.length > 10" class="ifsw">
+                <div @click="member = !member" class="sw">查看更多></div>
+              </div>
+              <div v-if="member && projectSelectRows.length > 10" class="ifsw">
+                <div @click="member = !member" class="sw">收起&lt;</div>
+              </div>
+            </div>
+            <div class="selecteds">
+              <div class="person">快速选人</div>
+              <div v-for="(item, i) in stuSelectRows" :key="item.id || item.userId">
+                <div v-if="i < 11">
+                  <div class="chose">
+                    {{ item.realName }}
+                    <div class="ch" @click="removeStu(item)"></div>
+                  </div>
+                </div>
+                <div v-else>
+                  <div v-if="person">
+                    <div class="chose">
+                      {{ item.realName }}
+                      <div class="ch" @click="removeStu(item)"></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div v-if="!person && stuSelectRows.length > 10" class="ifsw">
+                <div @click="person = !person" class="sw">查看更多></div>
+              </div>
+              <div v-if="person && stuSelectRows.length > 10" class="ifsw">
+                <div @click="person = !person" class="sw">收起&lt;</div>
+              </div>
+            </div>
+            <div v-if="!selectStu" class="selecteds">
+              <div class="dept">添加组织</div>
+              <div v-for="(item, i) in deptList" :key="item.id">
+                <div v-if="i < 11">
+                  <div class="chose1">
+                    <div class="span">{{ item.name }}</div>
+                    <div class="ch1" @click="removeOrg(item)" style="cursor: pointer;"></div>
+                  </div>
+                </div>
+                <div v-else>
+                  <div v-if="dept">
+                    <div class="chose1">
+                      <div class="span">{{ item.name }}</div>
+                      <div class="ch1" @click="removeOrg(item)"></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div v-if="!dept && deptList.length > 10" class="ifsw">
+                <div @click="dept = !dept" class="sw">查看更多></div>
+              </div>
+              <div v-if="dept && deptList.length > 10" class="ifsw">
+                <div @click="dept = !dept" class="sw">收起&lt;</div>
+              </div>
+            </div>
+            <div v-if="!selectStu" class="selecteds">
+              <div class="group">受众关联</div>
+              <div v-for="(item, i) in auditSelectRows" :key="item.id">
+                <div v-if="i < 11">
+                  <div class="chose2">
+                    <div class="span">{{ item.audienceName }}</div>
+                    <div class="ch2" @click="removeAudience(item)"></div>
+                  </div>
+                </div>
+                <div v-else>
+                  <div v-if="group">
+                    <div class="chose2">
+                      <div class="span">{{ item.audienceName }}</div>
+                      <div class="ch2" @click="removeAudience(item)"></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div v-if="!group && auditSelectRows.length > 10" class="ifsw">
+                <div @click="group = !group" class="sw">查看更多></div>
+              </div>
+              <div v-if="group && auditSelectRows.length > 10" class="ifsw">
+                <div @click="group = !group" class="sw">收起&lt;</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="submitAuth">确 定</el-button>
+      </span>
+
+      <el-dialog :visible.sync="stageVisible" title="选择阶段" width="420px" append-to-body center>
+        <div class="stage-body">
+          <el-select v-model="stageId" placeholder="选择阶段" filterable style="width:100%">
+            <el-option v-for="item in stageIds" :key="item.id" :label="item.name || '默认'" :value="item.id" />
+          </el-select>
+          <div class="tip">已在其他关卡的学员，不会被添加到该关卡</div>
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="stageVisible = false">取 消</el-button>
+          <el-button type="primary" @click="handleDialogOk">确 定</el-button>
+        </span>
+      </el-dialog>
+    </el-dialog>
+  </div>
+
+</template>
+
+<script>
+import {
+  AUDIENCE_LIST,
+  ORG_LIST,
+  fetchAudienceList,
+  fetchOrgChildren,
+  fetchOrgList,
+  fetchProjectStudents,
+  fetchQuickStudents,
+  saveStu,
+} from "@/api/signup/commonStudent";
+
+export default {
+  name: "SignupModal",
+  props: {
+    visible: { type: Boolean, default: false },
+    mode: { type: String, default: "plain" },
+    type: Number,
+    infoType: Number,
+    infoId: Number,
+    id: String,
+    title: { type: String, default: "" },
+    clear: { type: Boolean, default: false },
+    selectStu: { type: Boolean, default: false },
+    selectOne: { type: Boolean, default: false },
+    stage: { type: Array, default: () => [] },
+    isGroup: { type: Boolean, default: false },
+    projectId: { type: Number, default: null },
+    groupId: { type: Number, default: null },
+    groupName: { type: String, default: null },
+    groupMemberCount: { type: Number, default: null },
+    groupMemberNumber: { type: Number, default: null },
+    activeKey1: { type: String, default: null },
+  },
+  data() {
+    return {
+      activeTab: this.infoType ? "project" : "quick",
+      stageVisible: false,
+      stageId: undefined,
+      projectParams: {
+        pid: this.infoId,
+        type: this.infoType,
+        studentName: "",
+      },
+      projectStu: { list: [], pageNo: 1, pageSize: 10, total: 0 },
+      stuTable: { list: [], pageNo: 1, pageSize: 10, total: 0 },
+      audienceTable: { list: [], pageNo: 1, pageSize: 10, total: 0 },
+      treeData: [],
+      orgList: [],
+      treeProps: { children: "treeChildList", label: "name" },
+      orgTreeProps: { children: "directChildList", label: "name" },
+      nameSearch: { keyword: "", departId: "" },
+      audienceName: { keyword: "" },
+      searchOrgName: { keyword: "", pageNo: 1, pageSize: 200 },
+      projectSelectRows: [],
+      stuSelectRows: [],
+      auditSelectRows: [],
+      deptList: [],
+      selectedOrgKeys: [],
+      // 右侧“已选”区域展开/收起控制，与 CommonStudent.vue 保持一致
+      member: false,
+      dept: false,
+      person: false,
+      group: false,
+      screenHeight: document.body.clientHeight,
+    };
+  },
+  computed: {
+    dialogTitle() {
+      return { 1: "添加学员", 2: "添加学员", 3: "添加学员" }[this.type] || this.title || "添加报名";
+    },
+    stageIds() {
+      return this.stage || [];
+    },
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.initData();
+      }
+    },
+  },
+  mounted() {
+    if (this.visible) {
+      this.initData();
+    }
+  },
+  methods: {
+    initData() {
+      this.projectParams = {
+        pid: this.infoId,
+        type: this.infoType,
+        studentName: "",
+      };
+      this.nameSearch = { keyword: "", departId: "" };
+      this.audienceName = { keyword: "" };
+      this.searchOrgName = { keyword: "", pageNo: 1, pageSize: 200 };
+      this.projectSelectRows = [];
+      this.stuSelectRows = [];
+      this.auditSelectRows = [];
+      this.deptList = [];
+      this.selectedOrgKeys = [];
+      this.activeTab = this.infoType ? "project" : "quick";
+      this.getProjectStu();
+      this.fetchOrgTree();
+      this.onSearchStu();
+      this.searchAudience();
+      this.searchOrg();
+    },
+    handleClose() {
+      // 通过父组件的 :visible.sync 控制关闭
+      this.$emit("update:visible", false);
+    },
+    getProjectStu() {
+      fetchProjectStudents({
+        ...this.projectParams,
+        pageNo: this.projectStu.pageNo,
+        pageSize: this.projectStu.pageSize,
+      }).then((res) => {
+        this.projectStu.list = res.data?.list || [];
+        this.projectStu.total = res.data?.total || 0;
+      });
+    },
+    onProjectPageChange(page) {
+      this.projectStu.pageNo = page;
+      this.getProjectStu();
+    },
+    onProjectSelectionChange(list) {
+      this.projectSelectRows = list;
+    },
+    resetProjectStu() {
+      this.projectParams.studentName = "";
+      this.getProjectStu();
+    },
+    onSearchStu() {
+      fetchQuickStudents({
+        ...this.nameSearch,
+        pageNo: this.stuTable.pageNo,
+        pageSize: this.stuTable.pageSize,
+      }).then((res) => {
+        console.log("res", res);
+        this.stuTable.list = res.data?.list || [];
+        this.stuTable.total = res.data?.total || 0;
+      });
+    },
+    onStuPageChange(page) {
+      this.stuTable.pageNo = page;
+      this.onSearchStu();
+    },
+    onStuSelectionChange(list) {
+      this.stuSelectRows = list;
+    },
+    resetStu() {
+      this.nameSearch = { keyword: "", departId: "" };
+      this.onSearchStu();
+    },
+    fetchOrgTree() {
+      fetchOrgList({ keyword: "" }).then((res) => {
+        this.treeData = res.data || res.result || res || [];
+      });
+    },
+    loadOrgNode(node, resolve) {
+      if (node.level === 0) {
+        return resolve(this.treeData);
+      }
+      fetchOrgChildren({ orgId: node.data.id, keyword: "" }).then((res) => {
+        resolve(res.data || res.result || res || []);
+      });
+    },
+    onOrgSelect(node) {
+      this.nameSearch.departId = node.id;
+      this.onSearchStu();
+    },
+    searchOrg() {
+      fetchOrgList(this.searchOrgName).then((res) => {
+        this.orgList = res.data || res.result || res || [];
+      });
+    },
+    resetOrg() {
+      // 重置组织搜索条件并刷新组织树
+      this.searchOrgName = { keyword: "", pageNo: 1, pageSize: 200 };
+      this.searchOrg();
+    },
+    onOrgKeywordChange() {
+      this.searchOrg();
+    },
+    loadOrgNodeFull(node, resolve) {
+      if (node.level === 0) {
+        return resolve(this.orgList);
+      }
+      fetchOrgChildren({ orgId: node.data.id, keyword: "" }).then((res) => {
+        resolve(res.data || res.result || res || []);
+      });
+    },
+    onOrgCheckChange(data, checked) {
+      if (checked) {
+        if (!this.deptList.find((d) => d.id === data.id)) {
+          this.deptList.push(data);
+        }
+      } else {
+        this.deptList = this.deptList.filter((d) => d.id !== data.id);
+      }
+      this.selectedOrgKeys = this.deptList.map((d) => d.id);
+    },
+    searchAudience() {
+      fetchAudienceList({
+        ...this.audienceName,
+        pageNo: this.audienceTable.pageNo,
+        pageSize: this.audienceTable.pageSize,
+      }).then((res) => {
+        this.audienceTable.list = res.data?.list || [];
+        this.audienceTable.total = res.data?.total || 0;
+      });
+    },
+    onAudiencePageChange(page) {
+      this.audienceTable.pageNo = page;
+      this.searchAudience();
+    },
+    onAudienceSelectionChange(list) {
+      this.auditSelectRows = list;
+    },
+    resetAudienceInfo() {
+      this.audienceName.keyword = "";
+      this.searchAudience();
+    },
+    onOrgSelectChange() { },
+    removeProject(item) {
+      this.projectSelectRows = this.projectSelectRows.filter(
+        (i) => (i.id || i.studentId) !== (item.id || item.studentId)
+      );
+    },
+    removeStu(item) {
+      this.stuSelectRows = this.stuSelectRows.filter(
+        (i) => (i.id || i.userId) !== (item.id || item.userId)
+      );
+    },
+    removeOrg(item) {
+      this.deptList = this.deptList.filter((i) => i.id !== item.id);
+      this.selectedOrgKeys = this.deptList.map((d) => d.id);
+    },
+    removeAudience(item) {
+      this.auditSelectRows = this.auditSelectRows.filter((i) => i.id !== item.id);
+    },
+    submitAuth() {
+      if (this.type === 2) {
+        this.stageVisible = true;
+      } else {
+        this.handleDialogOk();
+      }
+    },
+    handleDialogOk() {
+      if (
+        this.type === 1 &&
+        this.groupId &&
+        this.groupMemberCount &&
+        this.groupMemberNumber &&
+        this.groupMemberCount < this.groupMemberNumber + this.projectSelectRows.length + this.stuSelectRows.length
+      ) {
+        return this.$message.warning("添加小组学员超过最大值");
+      }
+      saveStu({
+        targetId: this.id,
+        type: this.type,
+        clear: this.clear,
+        deptIds: this.deptList.map((e) => e.id),
+        stageId: this.stageId,
+        groupIds: this.auditSelectRows.map((e) => e.id),
+        studentList: this.stuSelectRows,
+        projectList: this.projectSelectRows,
+        groupName: this.groupName,
+        groupId: this.groupId,
+      }).then(() => {
+        this.$message.success("添加成功");
+        this.$emit("confirm");
+        this.handleClose();
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.signup-dialog ::v-deep .el-dialog__body {
+  padding-top: 10px;
+  padding: 30px;
+}
+
+.signup-wrap {
+  display: flex;
+  gap: 16px;
+}
+
+.el-tabs {
+  flex: 1;
+}
+
+.tab-search {
+  display: flex;
+  align-items: center;
+  margin-bottom: 12px;
+
+  .label {
+    margin-right: 8px;
+    color: #666;
+  }
+
+  .input {
+    width: 240px;
+    margin-right: 12px;
+  }
+}
+
+.split {
+  display: grid;
+  grid-template-columns: 250px auto;
+  gap: 12px;
+}
+
+.left-tree {
+  height: 100%;
+  border: 1px solid #f0f0f0;
+  padding: 8px;
+  overflow: auto;
+}
+
+.table-area {
+}
+
+.pager {
+  margin-top: 10px;
+  text-align: right;
+}
+
+.right1 {
+  border-left: 1px solid #f2f6fe;
+  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;
+        font-weight: 500;
+        margin-left: 32px;
+        white-space: nowrap;
+      }
+    }
+  }
+
+  .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;
+      margin-top: 25px;
+      margin-right: 25px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 2px;
+      border: 1px solid rgba(56, 139, 225, 1);
+      color: rgba(56, 139, 225, 1);
+      font-size: 12px;
+      position: relative;
+
+      .ch {
+        position: absolute;
+        width: 18px;
+        height: 18px;
+        background-image: url(../../assets/images/basicinfo/ch.png);
+        background-size: 100%;
+        right: -8px;
+        top: -8px;
+      }
+    }
+
+    .ifsw {
+      display: flex;
+      align-items: end;
+      justify-content: center;
+      color: #4ea6ff;
+    }
+
+    .sw {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      text-align: justify;
+      color: #4ea6ff;
+      margin-top: 23px;
+      margin-left: 10px;
+      cursor: pointer;
+    }
+
+    .dept {
+      width: 100%;
+      margin-top: 30px;
+      border-top: 1px solid #f2f6fe;
+    }
+
+    .chose1 {
+      height: 24px;
+      margin-top: 25px;
+      margin-right: 25px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 2px;
+      border: 1px solid rgba(56, 139, 225, 1);
+      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;
+        height: 18px;
+        background-image: url(../../assets/images/basicinfo/ch.png);
+        background-size: 100%;
+        right: -8px;
+        top: -8px;
+      }
+    }
+
+    .group {
+      width: 100%;
+      margin-top: 30px;
+      border-top: 1px solid #f2f6fe;
+    }
+
+    .chose2 {
+      height: 24px;
+      margin-top: 25px;
+      margin-right: 25px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 2px;
+      border: 1px solid rgba(56, 139, 225, 1);
+      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;
+        height: 18px;
+        background-image: url(../../assets/images/basicinfo/ch.png);
+        background-size: 100%;
+        right: -8px;
+        top: -8px;
+      }
+    }
+  }
+}
+
+.org-tree {
+  max-height: 520px;
+  overflow: auto;
+  padding: 8px 12px;
+  border: 1px solid #f0f0f0;
+}
+
+.stage-body {
+  .tip {
+    margin-top: 12px;
+    color: #999;
+    font-size: 12px;
+  }
+}
+</style>

src/views/course/CourseManage.vue

@@ -46,6 +46,20 @@
 
             <el-col :span="6" :offset="4">
               <div class="grid-content bg-purple" style="text-align: right;">
+                <el-dropdown
+                  v-if="showSignupActions"
+                  trigger="click"
+                  @command="openAddSignup"
+                  style="margin-right: 10px;"
+                >
+                  <el-button type="primary">
+                    添加报名<i class="el-icon-arrow-down el-icon--right"></i>
+                  </el-button>
+                  <el-dropdown-menu slot="dropdown">
+                    <el-dropdown-item command="plain">未设置受众</el-dropdown-item>
+                    <el-dropdown-item command="audience">设置受众</el-dropdown-item>
+                  </el-dropdown-menu>
+                </el-dropdown>
                 <el-button type="primary" icon="el-icon-upload2" @click="handleExportSignup">导出报名记录</el-button>
               </div>
             </el-col>
@@ -71,6 +85,21 @@
                 </template>
               </el-table-column>
               <el-table-column prop="signTime" label="报名时间"></el-table-column>
+              <el-table-column
+                v-if="showSignupActions"
+                label="操作"
+                width="140"
+              >
+                <template slot-scope="scope">
+                  <el-button
+                    type="text"
+                    size="mini"
+                    @click="handleDeleteSignup(scope.row)"
+                  >
+                    删除
+                  </el-button>
+                </template>
+              </el-table-column>
             </el-table>
             <div style="padding: 10px;">
               <div style="text-align:center; padding: 10px;">
@@ -226,6 +255,12 @@
         </el-tab-pane>
       </el-tabs>
     </div>
+    <SignupModal
+      v-if="showSignupActions"
+      :visible.sync="addSignupVisible"
+      :mode="addSignupMode"
+      @confirm="handleSignupCreate"
+    />
     <!-- 学习详情 -->
     <el-dialog title="学习详情" :visible.sync="study.detailShow" width="900px" :append-to-body="true">
       <div>
@@ -448,10 +483,17 @@ import apiStudy from "@/api/modules/courseStudy.js";
 import { getToken } from "@/utils/token";
 import axios from "axios";
 import NameFilterSelect from "@/components/NameFilterSelect/index.vue";
+import SignupModal from "@/components/signup/SignupModal.vue";
 
 NameFilterSelect;
 export default {
-  components: { NameFilterSelect },
+  components: { NameFilterSelect, SignupModal },
+  props: {
+    showSignupActions: {
+      type: Boolean,
+      default: false,
+    },
+  },
   computed: {
     ...mapGetters(["resOwnerMap", "sysTypeMap"]),
   },
@@ -527,6 +569,8 @@ export default {
         signType: "",
         aid: [],
       },
+      addSignupVisible: false,
+      addSignupMode: "plain",
       courseType: courseType,
       value: "",
       input: "",
@@ -632,6 +676,33 @@ export default {
       loadSysTypes: "sysType/loadSysTypes",
     }),
 
+    openAddSignup(command) {
+      this.addSignupMode = command === "audience" ? "audience" : "plain";
+      this.addSignupVisible = true;
+    },
+    handleSignupCreate(payload) {
+      console.log("signup payload", payload);
+      this.$message.success("已记录添加报名操作（待接入后端接口）");
+    },
+    handleDeleteSignup(row) {
+      this.$confirm("确定删除该报名记录吗？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          return apicourseStudy.deleteSignUp(row.id, this.courseDetail.id);
+        })
+        .then((res) => {
+          if (res && res.status === 200) {
+            this.$message.success("删除成功");
+            this.getSignupList();
+          } else if (res) {
+            this.$message.error(res.message || "删除失败");
+          }
+        })
+        .catch(() => {});
+    },
 
     resetCommonResourceQuery() {
       this.commonResourceStudyPeopleQuery = {

src/views/course/CourseManageRemote.vue

@@ -1,7 +1,7 @@
 <template>
   <section class="app-main xuc-content">
     <div class="main-body">
-      <CourseManage />
+      <CourseManage :show-signup-actions="true" />
     </div>
   </section>
 </template>

src/views/course/ManageListRemote.vue

@@ -50,7 +50,7 @@
             </div>
           </div>
           <div class="filter-field filter-field--status">
-            <el-select v-model="params.status" placeholder="全部审核状态" clearable>
+            <el-select v-model="params.status" placeholder="审核状态" clearable>
               <el-option label="-" value="1"></el-option>
               <el-option label="审核中" value="2"></el-option>
               <el-option label="审核通过" value="5"></el-option>
@@ -58,7 +58,7 @@
             </el-select>
           </div>
           <div class="filter-field filter-field--publish">
-            <el-select v-model="params.publish" placeholder="全部发布状态" clearable>
+            <el-select v-model="params.publish" placeholder="发布状态" clearable>
               <el-option label="已发布" :value="true"></el-option>
               <el-option label="未发布" :value="false"></el-option>
             </el-select>
@@ -81,7 +81,7 @@
       <div v-if="showAdvancedFilter" class="filter-row filter-row--advanced advanced-filter">
         <div class="filter-fields">
           <div class="filter-field filter-field--enabled">
-            <el-select v-model="params.enabled" placeholder="全部启停用状态" clearable>
+            <el-select v-model="params.enabled" placeholder="启停用状态" clearable>
               <el-option label="启用" :value="true"></el-option>
               <el-option label="停用" :value="false"></el-option>
             </el-select>
@@ -96,7 +96,7 @@
             <el-cascader
               ref="resOwnerCascader"
               v-model="resOwnerSelected"
-              placeholder="全部资源归属"
+              placeholder="资源归属"
               clearable
               :props="resOwnerCascaderProps"
               :show-all-levels="false"
@@ -132,7 +132,7 @@
             </div>
           </div>
           <div class="filter-field filter-field--create-from">
-            <el-select v-model="params.createFrom" placeholder="全部创建来源" clearable>
+            <el-select v-model="params.createFrom" placeholder="创建来源" clearable>
               <el-option label="教师端" value="teacher"></el-option>
               <el-option label="管理端" value="admin"></el-option>
             </el-select>