1. init 申请加入记录页面

src/api/sdk-service.ts

@@ -85,19 +85,56 @@ export interface OrgDepartmentItem extends BaseOrgMemberItem {
     children?: OrgDepartmentItem[] | OrgMemberItem[];
 }
 
+export const enum ApplyStatus {
+    All = '',
+    Reject = -1,
+    Wait = 0,
+    Pass = 1,
+}
+
+export interface ApplyRecord {
+    createdDate: string;
+    email: string;
+    id: string;
+    idCard: string;
+    memo: string;
+    mobile: string;
+    name: string;
+    puid: string;
+    refId: string;
+    status: ApplyStatus;
+}
+
+export const enum ApplyOperateType {
+    Pass = 'pass',
+    Reject = 'reject',
+}
+
 class SdkService extends SdkCoreService {
-    getJoinedList() {
+    public getJoinedList() {
         return this.get(`/system/org/joined/list`);
     }
 
-    getWaitJoinList() {
+    public getWaitJoinList() {
         return this.get(`/system/org/waitjoin/list`);
     }
 
-    getOrgTree() {
+    public getOrgTree() {
         const oid = EnterpriseHost.getOid();
         return this.get<OrgDepartmentItem[]>(`/system/org/${oid}/emptree`);
     }
+
+    public getApplyList(status: any, begin: number, size: number) {
+        const oid = EnterpriseHost.getOid();
+        return this.get<{ list: ApplyRecord[]; count: number }>(`/system/org/${oid}/apply/list?status=${status}&limitBegin=${begin}&limitSize=${size}`);
+    }
+
+    public operateApplyRecord(id: number, suffix: ApplyOperateType) {
+        const oid = EnterpriseHost.getOid();
+        return this.post(`/system/org/${oid}/apply/audit/${id}/${suffix}`, {
+            memo: "执行操作"
+        });
+    }
 }
 
 const sdkService = new SdkService();

src/router/index.ts

@@ -14,13 +14,13 @@ Vue.use(VueRouter);
 const routes: Array<RouteConfig> = [
   {
     path: "",
-    redirect: "/workadmin/home"
+    redirect: "/workadmin/addressbook"
   },
   ...loginRouters,
   {
     path: '/workadmin',
     component: () => import('@/views/pages/main.vue'),
-    redirect: 'home',
+    redirect: 'addressbook',
     children: [
       {
         path: 'home',

src/views/pages/employ-management/address-book/employ-list.vue

@@ -17,7 +17,9 @@
                     邀请员工加入企业
                 </div>
                 <span></span>
-                <div class="text-gray btn">申请加入记录</div>
+                <div class="text-gray btn" @click="goApplyJoinRecord">
+                    申请加入记录
+                </div>
             </div>
         </div>
         <div class="list-content d-flex flex-column">
@@ -115,6 +117,7 @@
 </template>
 
 <script lang="ts">
+    import { Direction } from "@/router";
     import { departmentController } from "@/views/service/department-controller";
     import { OrgMemberItem2Map } from "@/views/service/emp-tree";
     import { Component, Vue, Prop, Watch } from "vue-property-decorator";
@@ -194,6 +197,10 @@
             return "";
         }
 
+        private goApplyJoinRecord() {
+            this.go(Direction.ApplicationRecord);
+        }
+
         private exportMembers() {
             return "";
         }

src/views/pages/employ-management/application-record/application-record.vue

 <template>
-    <div>ApplicationRecord</div>
+    <div class="application-record-container d-flex flex-column">
+        <div class="header d-flex justify-content-between align-items-end">
+            <div class="title">
+                申请加入记录 <span class="gray">({{ total }}人)</span>
+            </div>
+            <div class="apply-setting" @click="goApplySetting">
+                申请加入设置
+            </div>
+        </div>
+        <div class="table-content d-flex flex-column flex-fill">
+            <div
+                class="
+                    table-content-seletor
+                    d-flex
+                    align-items-center
+                    flex-none
+                "
+            >
+                <div class="label">状态</div>
+                <el-select
+                    v-model="value"
+                    placeholder="请选择"
+                    @change="onChangeSelect"
+                    class="change-select"
+                >
+                    <el-option
+                        v-for="item in options"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                        size="mini"
+                        id="status"
+                    ></el-option>
+                </el-select>
+            </div>
+            <div class="content flex-fill">
+                <el-table
+                    :data="tableData"
+                    tooltip-effect="dark"
+                    style="width: 100%"
+                    height="88%"
+                    stripe
+                >
+                    <el-table-column
+                        prop="name"
+                        label="姓名"
+                        width="100px"
+                        align="center"
+                    ></el-table-column>
+                    <el-table-column label="手机号" align="center">
+                        <template slot-scope="scope">
+                            <div v-if="scope.row.mobile !== ''">
+                                {{ scope.row.mobile }}
+                            </div>
+                            <div v-if="scope.row.email !== ''">
+                                {{ scope.row.email }}
+                            </div>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column label="身份证号" align="center">
+                        <template slot-scope="scope">
+                            {{ scope.row.idCard }}
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column
+                        prop="memo"
+                        label="备注"
+                        align="center"
+                    ></el-table-column>
+
+                    <el-table-column label="申请时间" align="center">
+                        <template slot-scope="scope">
+                            <span>{{ scope.row.createdDate }}</span>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column
+                        width="200px"
+                        label="申请状态"
+                        align="center"
+                    >
+                        <template slot-scope="scope">
+                            <mg-button
+                                type="primary"
+                                @click="handleClick(1, scope.row.id)"
+                                v-if="scope.row.status === 0"
+                                >通过</mg-button
+                            >
+                            <mg-button
+                                class="table-operation"
+                                @click="handleClick(-1, scope.row.id)"
+                                v-if="scope.row.status === 0"
+                                >拒绝</mg-button
+                            >
+                            <span v-if="scope.row.status === 1">
+                                已通过
+                                <!-- <i class="el-icon-info"></i> -->
+                            </span>
+                            <span v-if="scope.row.status === -1">
+                                已拒绝
+                                <!-- <i class="el-icon-info"></i> -->
+                            </span>
+                        </template>
+                    </el-table-column>
+                </el-table>
+                <el-pagination
+                    background
+                    layout="prev, pager, next"
+                    :total="this.total"
+                    :hide-on-single-page="true"
+                    :page-size="pageSize"
+                    class="hrs-pager"
+                    @current-change="changePages"
+                ></el-pagination>
+            </div>
+        </div>
+    </div>
 </template>
 
 <script lang="ts">
+    import {
+        ApplyOperateType,
+        ApplyRecord,
+        ApplyStatus,
+        sdkService,
+    } from "@/api/sdk-service";
+    import { popupService } from "@/apppackage/element-upgrades/popup";
+    import { Direction } from "@/router";
     import { Component, Vue } from "vue-property-decorator";
 
     @Component({ components: {} })
-    export default class ApplicationRecord extends Vue {}
+    export default class ApplicationRecord extends Vue {
+        private value = ApplyStatus.All;
+        private options = [
+            {
+                value: ApplyStatus.All,
+                label: "全部",
+            },
+            {
+                value: ApplyStatus.Reject,
+                label: "拒绝",
+            },
+            {
+                value: ApplyStatus.Wait,
+                label: "待审核",
+            },
+            {
+                value: ApplyStatus.Pass,
+                label: "审核通过",
+            },
+        ];
+
+        private tableData: ApplyRecord[] = [];
+        private pageSize = 10;
+        private pageIndex = 1;
+        private total = 0;
+
+        private onChangeSelect() {
+            this.pageIndex = 1;
+            this.getListData();
+        }
+
+        private changePages(pageIndex: number) {
+            this.pageIndex = pageIndex;
+        }
+
+        private getListData() {
+            sdkService
+                .getApplyList(this.value, this.pageIndex - 1, this.pageSize)
+                .then((r) => {
+                    this.tableData = r.list;
+                    this.total = r.count;
+                })
+                .catch(popupService.toast.error);
+        }
+
+        private onPass(id: number) {
+            this.$confirm("是否通过?", "提示", {
+                confirmButtonText: "确定",
+                cancelButtonText: "取消",
+                type: "warning",
+            }).then(() => this.operateApplyRecord(id, ApplyOperateType.Pass));
+        }
+
+        private onReject(id: number) {
+            this.$confirm("是否拒绝?", "提示", {
+                confirmButtonText: "确定",
+                cancelButtonText: "取消",
+                type: "warning",
+            }).then(() => this.operateApplyRecord(id, ApplyOperateType.Reject));
+        }
+
+        private operateApplyRecord(id: number, type: ApplyOperateType) {
+            sdkService
+                .operateApplyRecord(id, type)
+                .then(() => {
+                    this.onChangeSelect();
+                })
+                .catch(popupService.toast.error);
+        }
+
+        private goApplySetting() {
+            this.go(Direction.ApplicationSetting);
+        }
+
+        created() {
+            this.getListData();
+        }
+    }
 </script>
 
 <style lang="less" scoped>
     @import "~@/css/variables.less";
+    .gray {
+        color: #888;
+    }
+
+    .application-record-container {
+        padding: 0px 24px;
+
+        .header {
+            overflow: hidden;
+            height: 65px;
+            border-bottom: 1px solid #eee;
+
+            .title {
+                font-size: 18px;
+                line-height: 25px;
+                color: #292b33;
+                margin-bottom: 9px;
+            }
+
+            .apply-setting {
+                overflow: hidden;
+                position: relative;
+                line-height: 20px;
+                font-size: 14px;
+                margin-bottom: 11px;
+                user-select: none;
+                cursor: pointer;
+                color: #077aec;
+            }
+        }
+
+        .table-content {
+            .table-content-seletor {
+                padding-top: 20px;
+                padding-bottom: 20px;
+
+                .label {
+                    font-size: 14px;
+                    color: #c8c8cc;
+                    margin-right: 20px;
+                }
+
+                .change-select {
+                    /deep/ input {
+                        width: 178px;
+                        height: 30px;
+                        border-radius: 0px;
+                    }
+
+                    /deep/ .el-input__icon {
+                        line-height: 30px;
+                    }
+                }
+            }
+        }
+    }
 </style>

vue.config.js

@@ -19,6 +19,10 @@ module.exports = {
                 target: "http://106.120.107.150:7771",
                 changeOrigin: true,
             },
+            "/v1/invite": {
+                target: "http://106.120.107.150:7771",
+                changeOrigin: true,
+            },
         },
         headers: {
             "Access-Control-Allow-Origin": "*"