Selaa lähdekoodia

新建公司、部门调整

chuwuya 2 vuotta sitten
vanhempi
commit
cf13265169

+ 1 - 1
src/views/permissionManagement/decisiongroup/permissionDetail.vue

@@ -302,7 +302,7 @@ export default {
 .bottom {
     position: absolute;
     bottom: 15px;
-    margin-left: 520px;
+    left:35%;
 }
 
 .el-button {

+ 2 - 1
src/views/permissionManagement/decisiongroup/rolemembersList.vue

@@ -2,7 +2,7 @@
     <div>
         <el-button class="delete" type="text">批量删除</el-button>
         <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" :header-cell-style="{ textAlign: 'center' }"
-            :cell-style="{ textAlign: 'center' }" style="width: 100%" @selection-change="handleSelectionChange">
+            :cell-style="{ textAlign: 'center' }" style="width: 98%" @selection-change="handleSelectionChange">
             <el-table-column type="selection" width="50">
             </el-table-column>
             <el-table-column prop="rolename" label="角色名">
@@ -125,6 +125,7 @@ export default {
     position: relative;
     left: 0;
     top:20px;
+    margin-left: 1%;
     border: 1px solid #f0f2f2;
     font-size: 0.95rem;
     font-family: PingFang SC;

+ 1 - 21
src/views/permissionManagement/roleOverview.vue

@@ -2,7 +2,6 @@
     <div>
         <div class="header">
             <p class="info">角色总览</p>
-            <el-input class="searchBox" placeholder="请输入关键字" suffix-icon="el-icon-search" v-model="filterText"></el-input>
         </div>
         <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" :header-cell-style="{ textAlign: 'center' }"
             :cell-style="{ textAlign: 'center' }" height="400" style="width: 98%" @selection-change="handleSelectionChange">
@@ -123,36 +122,17 @@ export default {
 </script>
 <style lang="less" scoped>
 .header {
-    padding-top: 20px;
     display: flex;
 
     .info {
         padding: 20px 20px 20px 40px;
         font-size: 25px;
     }
-
-    .searchBox {
-        position: relative;
-        top: 15px;
-        width: 350px;
-        height: 35px;
-        left: 800px;
-        line-height: 20px;
-        border-radius: 3px;
-        background-color: #F7F9FA;
-        color: #D7D8D8;
-        font-size: 14px;
-        text-align: center;
-
-        /deep/.el-input__inner {
-            height: 35px;
-        }
-    }
 }
 .el-table {
     position: relative;
     top: 10px;
-    margin-left: 1%;
+    margin-left: 1%;    
     border: 1px solid #f0f2f2;
     font-size: 0.95rem;
     font-family: PingFang SC;

+ 46 - 20
src/views/userManagement/groupManagement/forms/corporationdetailEdit.vue

@@ -1,5 +1,8 @@
 <template>
     <div style="height: 100%;">
+        <el-button class="addDepartment" @click="addDepartment" style="color: #fff; background: #3da0d6"><i
+                class="el-icon-s-order"></i>新建部门</el-button>
+                <departmentNew ref="departmentNew"></departmentNew>
         <p class="info">企业详情</p>
         <el-image :src="url"></el-image>
         <el-button class="alter" v-if="show">更换</el-button>
@@ -43,50 +46,64 @@
             </el-form-item>
         </el-form>
         <div class="bottom">
-            <el-button style="background:#B3B3B3;">删除</el-button>
-            <el-button @click="edit">编辑</el-button>
+            <el-button class="delete" style="background:#B3B3B3;">删除</el-button>
+            <el-button class="edit" @click="edit">编辑</el-button>
         </div>
     </div>
 </template>
 
 <script>
+import departmentNew from '../messageDialog/departmentNew';
+
 export default {
+    components: { departmentNew },
     data() {
         return {
             show: false,
             disabled: true,
             form: {
-                fullName: '',
-                abbreviateName: '',
-                parentCorporation: '',
-                sccide: '',
-                registeredAddress: '',
-                businessAddress: '',
-                legalName: '',
-                corporationCode: '',
-                complementCount: '',
-                staffCount: ''
+                fullName: "",
+                abbreviateName: "",
+                parentCorporation: "",
+                sccide: "",
+                registeredAddress: "",
+                businessAddress: "",
+                legalName: "",
+                corporationCode: "",
+                complementCount: "",
+                staffCount: ""
             },
-            url: '',
+            url: "",
             superiorOptions: [
                 {
-                    value: '0',
-                    label: '中讯邮电咨询设计院'
+                    value: "0",
+                    label: "中讯邮电咨询设计院"
                 }
             ],
             addressOptions: [],
-        }
+        };
     },
     methods: {
         edit() {
             this.show = true;
             this.disabled = false;
+        },
+        addDepartment(){
+            this.$refs.departmentNew.dialogVisible = true;
         }
-    }
-
+    },
 }
 </script>
 <style lang="less" scoped>
+.addDepartment {
+    position: absolute;
+    left: 40px;
+    bottom: 15px;
+    width: 250px;
+    text-align: center;
+    font-size: 16px;
+}
+
 .info {
     text-align: left;
     padding: 20px;
@@ -102,6 +119,13 @@ export default {
     position: absolute;
     right: 40px;
     top: 165px;
+    width: 100px;
+    height: 30px;
+    color: #fff;
+    padding: 3px;
+    font-size: 14px;
+    background: #3da0d6;
+
 }
 
 .el-select {
@@ -141,7 +165,8 @@ export default {
     left: 50%;
 }
 
-.el-button {
+.delete,
+.edit {
     width: 100px;
     height: 30px;
     color: #fff;
@@ -149,4 +174,5 @@ export default {
     margin-left: 50px;
     font-size: 14px;
     background: #3da0d6;
-}</style>
+}
+</style>

+ 0 - 113
src/views/userManagement/groupManagement/forms/corporationdetailStore.vue

@@ -1,113 +0,0 @@
-<template>
-    <div>
-        <p class="info">企业详情</p>
-        <img class="img" src="" alt="">
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="公司全称:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="公司简称:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="上级公司:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="统一社会信用代码:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="注册地址:">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="经营地址:">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.legalName" label="法人姓名:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.copporationCode" label="公司编码:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.complementCount" label="编制人数:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="在岗人数:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div>
-            <el-button>重置</el-button>
-            <el-button style="background-color: rgb(131, 208, 243);">保存</el-button>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            }
-        }
-    },
-    methods: {
-
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.info {
-    text-align: left;
-    padding: 20px;
-    font-size: 25px;
-}
-
-.img {
-    width: 1300px;
-    height: 150px;
-}
-
-.form {
-    margin-left: 350px;
-
-    .el-form {
-        //margin: 40px 0 0 0;
-
-        .el-form-item {
-            padding-top: 10px;
-            margin-inline: 20px;
-            margin-bottom: 0;
-        }
-
-        /deep/.el-form-item__label {
-            padding: 0;
-            text-align: left;
-        }
-
-        /deep/.el-form-item__content {
-            display: flex;
-            width: 400px;
-        }
-    }
-}
-
-.el-button {
-    width: 100px;
-    height: 30px;
-    padding: 5px;
-    margin: 10px;
-}
-</style>

+ 118 - 79
src/views/userManagement/groupManagement/forms/departmentdetailEdit.vue

@@ -3,49 +3,52 @@
         <p class="info">部门详情</p>
         <el-image :src="url"></el-image>
         <el-button class="alter" v-if="show">更换</el-button>
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px" :disabled="disabled">
-                <el-form-item  label="部门级别:">
-                    <el-select v-model="form.fullName" style="width:400px">
-                        <el-option value="test"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item label="上级部门:">
-                    <el-select v-model="form.abbreviateName" style="width:400px">
-                        <el-option value="test"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item label="部门负责人:">
-                    <el-select v-model="form.parentCorporation" style="width:400px">
-                        <el-option value="test"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item  label="部门接口人:">
-                    <el-select v-model="form.sccide"  style="width:400px">
-                        <el-option value="test"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item label="排重名:">
-                    <el-input v-model="form.registeredAddress" placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item  label="在岗人数:">
-                    <el-input-number :model="form.businessAddress" v-model="num" @change="handleChange" :min="1" :max="100"></el-input-number>
-                </el-form-item>
-                <el-form-item  label="自由员工:">
-                    <el-input v-model="form.legalName" placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item  label="协作员工:">
-                    <el-input v-model="form.copporationCode" placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item  label="第三方员工:">
-                    <el-input v-model="form.complementCount" placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item  label="部门职责:">
-                    <el-input  type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
-                        show-word-limit></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
+
+        <el-form :model="form" label-position="left" :disabled="disabled">
+            <el-form-item label="部门级别:">
+                <el-select v-model="form.department_level">
+                    <el-option v-for="item in levelOptions" :value="item.value" :key="item.value"
+                        :label="item.label"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="上级部门:">
+                <el-select v-model="form.superior_department">
+                    <el-option v-for="item in superiorOptions" :value="item.value" :key="item.value"
+                        :label="item.label"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="部门负责人:">
+                <el-select v-model="form.departmentManager">
+                    <el-option v-for="item in managerOptions" :value="item.value" :key="item.value"
+                        :label="item.label"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="部门接口人:">
+                <el-select v-model="form.departmentOfficer">
+                    <el-option v-for="item in officerOptions" :value="item.value" :key="item.value"
+                        :label="item.label"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="排重名:">
+                <el-input v-model="form.duplication" type="text"></el-input>
+            </el-form-item>
+            <el-form-item label="在岗人数:">
+                <el-input-number :model="form.staff_num" v-model="num" @change="handleChange" :min="1"
+                    :max="100"></el-input-number>
+            </el-form-item>
+            <el-form-item label="自由员工:">
+                <el-input v-model="form.self_employee" type="text"></el-input>
+            </el-form-item>
+            <el-form-item label="协作员工:">
+                <el-input v-model="form.collaborator" type="text"></el-input>
+            </el-form-item>
+            <el-form-item label="第三方员工:">
+                <el-input v-model="form.thirdParty_employee" type="text"></el-input>
+            </el-form-item>
+            <el-form-item label="部门职责:">
+                <el-input type="textarea" placeholder="请输入" v-model="textarea" maxlength="200" show-word-limit></el-input>
+            </el-form-item>
+        </el-form>
         <div class="bottom">
             <el-button style="background:#B3B3B3;">删除</el-button>
             <el-button @click="edit">编辑</el-button>
@@ -57,14 +60,31 @@
 export default {
     data() {
         return {
-            show:false,
-            disabled:true,
+            show: false,
+            disabled: true,
             form: {
-
+                department_level: '',
+                superior_department: '',
+                departmentManager: '',
+                departmentOfficer: '',
+                duplication: '',
+                staff_num: '',
+                self_employee: '',
+                collaborator: '',
+                thirdParty_employee: '',
             },
             num: 100,
-            textarea:'',
-            url:''
+            textarea: '',
+            url: '',
+            levelOptions: [],
+            superiorOptions: [
+                {
+                    value: '0',
+                    label: '北京电信规划设计院'
+                }
+            ],
+            managerOptions: [],
+            officerOptions: [],
         }
     },
     methods: {
@@ -85,51 +105,70 @@ export default {
     padding: 20px;
     font-size: 25px;
 }
-.el-image{
-    width: 1300px;
-    height: 150px; 
+
+.el-image {
+    width: 95%;
+    height: 150px;
 }
-.alter{
+
+.alter {
     position: absolute;
-    right:40px;
+    right: 40px;
     top: 165px;
 }
-.form {
-    margin-left: 350px;
 
-    .el-form {
-        //margin: 40px 0 0 0;
+.el-form {
+    padding: 20px 20% 0 20%;
 
-        .el-form-item {
-            padding-top: 10px;
-            margin-inline: 20px;
-            margin-bottom: 0;
-        }
+    .el-form-item {
+        padding-top: 10px;
+        margin-inline: 20px;
+        margin-bottom: 0;
+    }
 
-        /deep/.el-form-item__label {
-            padding: 0;
-            text-align: left;
-        }
+    .el-select {
+        width: 100%;
+    }
 
-        /deep/.el-form-item__content {
-            display: flex;
-            width: 400px;
+    .el-input-number {
+        /deep/.el-input-number__decrease {
+            border: 1px solid #DCDFE6;
+            border-radius: 4px;
+    
         }
+        /deep/.el-input-number__increase {
+            border: 1px solid #DCDFE6;
+            border-radius: 4px;
+        }
+        /deep/.el-input__inner {
+            border: 0;
+            background: #fff;
+        }
+    }
+
+    /deep/.el-form-item__label {
+        padding: 0;
+        text-align: left;
+        font-weight: 550;
+    }
+
+    /deep/.el-form-item__content {
+        display: flex;
     }
 }
 
 .bottom {
     position: absolute;
     bottom: 15px;
-    margin-left: 520px;
+    left: 50%;
 }
+
 .el-button {
-        width: 100px;
-        height: 30px;
-        color: #fff;
-        padding: 3px;
-        margin-left: 50px;
-        font-size: 14px;
-        background: #3da0d6;
-    }
-</style>
+    width: 100px;
+    height: 30px;
+    color: #fff;
+    padding: 3px;
+    margin-left: 50px;
+    font-size: 14px;
+    background: #3da0d6;
+}</style>

+ 0 - 10
src/views/userManagement/groupManagement/index.vue

@@ -13,8 +13,6 @@
                     </span>
                 </span>
             </el-tree>
-            <el-button @click="addCompany" style="color: #fff; background: #3da0d6"><i
-                    class="el-icon-s-order"></i>添加公司</el-button>
         </div>
         <div class="right-pane">
             <overView v-if="viewShow"></overView>
@@ -163,14 +161,6 @@ export default {
 
     .right-pane {
     width: calc(100% - 330px);
-}
-    .el-button {
-        position: absolute;
-        left: 40px;
-        bottom: 15px;
-        width: 250px;
-        text-align: center;
-        font-size: 16px;
     }
 }
 

+ 149 - 102
src/views/userManagement/groupManagement/messageDialog/corporationAdd.vue

@@ -1,138 +1,185 @@
 <template>
-    <div class="info">
-        <el-tabs>
-            <el-tab-pane style="height: 40px; padding: 10px; text-align: left; margin-left:10px; font-size: 16px;">添加公司
-                <span><i class="el-icon-close" @click="close"></i></span>
-            </el-tab-pane>
-        </el-tabs>
-        <div style="display: flex;">
-            <img class="img" src="" alt=""><span><el-button style="width: 60px; margin-left: -160px;
-            margin-top: 60px; background-color:rgb(131, 208, 243);">更换</el-button></span>
-        </div>
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="公司全称:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="公司简称:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="上级公司:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="统一社会信用代码:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="注册地址:">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="经营地址:">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.legalName" label="法人姓名:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.copporationCode" label="公司编码:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.complementCount" label="编制人数:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="在岗人数:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div style="margin-top: 30px;">
-            <el-button style="background-color:rgb(131, 208, 243);">下一个</el-button>
-            <el-button>重置</el-button>
-            <el-button style="background-color:rgb(131, 208, 243);">更新</el-button>
-        </div>
+    <div>
+        <el-dialog v-dialog-drag style="overflow: hidden;" :title="popTitle" :visible.sync="dialogVisible" width="32%"
+            append-to-body>
+            <el-divider></el-divider>
+            <div>
+                <el-image :src="url"></el-image>
+                <el-button class="alter">更换</el-button>
+            </div>
+            <div style="height: 400px;">
+                <el-scrollbar style="height: 90%; width: 100%; top: -20px;">
+                    <el-form :model="form" ref="form" label-position="left">
+                        <el-form-item label="公司全称:" prop="fullName">
+                            <el-input v-model="form.fullName" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="公司简称:" prop="abbreviateName">
+                            <el-input v-model="form.abbreviateName" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="上级公司:" prop="parentCorporation">
+                            <el-select v-model="form.parentCorporation">
+                                <el-option v-for="item in superiorOptions" :value="item.value" :key="item.value"
+                                    :label="item.label"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="统一社会信用代码:" prop="sccide">
+                            <el-input v-model="form.sccide"></el-input>
+                        </el-form-item>
+                        <el-form-item v-model="form.registeredAddress" label="注册地址:" prop="registeredAddress">
+                            <el-cascader :options="addressOptions" placeholder="选择城市/区级" filterable>
+                            </el-cascader>
+                            <el-input style="margin-left: 10px;"></el-input>
+                        </el-form-item>
+                        <el-form-item v-model="form.businessAddress" label="经营地址:" prop="businessAddress">
+                            <el-cascader :options="addressOptions" placeholder="选择城市/区级" filterable>
+                            </el-cascader>
+                            <el-input style="margin-left: 10px;"></el-input>
+                        </el-form-item>
+                        <el-form-item label="法人姓名:" prop="legalName">
+                            <el-input v-model="form.legalName" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="公司编码:" prop="orporationCode">
+                            <el-input v-model="form.corporationCode" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="编制人数:" prop="complementCount">
+                            <el-input v-model="form.complementCount" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="在岗人数:" prop="staffCount">
+                            <el-input v-model="form.staffCount" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+
+                        </el-form-item>
+                    </el-form>
+                </el-scrollbar>
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button style="background-color: #2EA8E6;color: #FFFFFF; margin-right: 30px;">下一个</el-button>
+                <el-button style="background-color: #B3B3B3;color: #FFFFFF;margin-right: 30px;"
+                    @click="resetForm('form')">重置</el-button>
+                <el-button style="background-color: #2EA8E6;color: #FFFFFF;">更新</el-button>
+            </div>
+        </el-dialog>
     </div>
 </template>
 
 <script>
 export default {
+
     data() {
         return {
+            popTitle: '添加公司',
+            dialogVisible: false,
+            url: '',
             form: {
-
+                fullName: "",
+                abbreviateName: "",
+                parentCorporation: "",
+                sccide: "",
+                registeredAddress: "",
+                businessAddress: "",
+                legalName: "",
+                corporationCode: "",
+                complementCount: "",
+                staffCount: ""
             },
+            superiorOptions: [
+                {
+                    value: "0",
+                    label: "中讯邮电咨询设计院"
+                }
+            ],
+            addressOptions: [],
         }
     },
     methods: {
         close() {
 
+        },
+        resetForm() {
+            this.$refs.form.resetFields();
         }
     }
 
 }
 </script>
 <style lang="less" scoped>
-.info {
-    margin-top: 10px;
-    margin-left: 300px;
-    left: 350px;
-    width: 600px;
-    height: 750px;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-
-    .img {
-        margin: 15px 50px 0 50px;
-        width: 500px;
-        height: 80px;
-    }
+/deep/.el-dialog__footer {
+    text-align: center;
+}
+/deep/.el-dialog__body {
+    padding: 0 20px;
+}
 
 
-    .el-icon-close {
-        margin-left: 480px;
-    }
+/deep/.el-divider--horizontal {
+    display: block;
+    height: 1px;
+    width: 100%;
+    margin: 0 !important;
+}
 
-    /deep/.el-tabs__header {
-        height: 0;
-        margin-bottom: 0;
-    }
+.el-image {
+    width: 100%;
+    height: 100px;
+    margin-top: 10px;
+}
 
+.alter {
+    background-color: #2EA8E6;
+    color: #FFFFFF;
+    float: right;
+    position: relative;
+    top: -40px;
+    right: 10px;
+    width: 80px !important;
+}
 
-    .form {
-        //margin-left: 350px;
+.el-icon-close {
+    margin-left: 480px;
+}
 
-        .el-form {
-            //margin: 40px 0 0 0;
+/deep/.el-tabs__header {
+    height: 0;
+    margin-bottom: 0;
+}
 
-            .el-form-item {
-                padding-top: 10px;
-                margin-inline: 20px;
-                margin-bottom: 0;
-            }
 
-            /deep/.el-form-item__label {
-                padding: 0;
-                text-align: left;
-            }
+.el-select {
+    width: 100%;
+}
 
-            /deep/.el-form-item__content {
-                display: flex;
-                width: 400px;
-            }
+.el-form {
+    padding: 0 5% 0 5%;
+
+    .el-form-item {
+        padding-top: 10px;
+        margin-inline: 20px;
+        margin-bottom: 0;
+    }
+
+    .el-cascader {
+        /deep/.el-input__inner {
+            width: 100px;
         }
     }
 
-    .el-button {
-        width: 100px;
-        height: 30px;
-        padding: 5px;
-        margin: 10px;
+    /deep/.el-form-item__label {
+        padding: 0;
+        text-align: left;
+        font-weight: 550;
+    }
+
+    /deep/.el-form-item__content {
+        display: flex;
     }
 }
+
+
+.el-button {
+    width: 100px;
+    height: 30px;
+    text-align: center;
+    padding: 5px;
+}
 </style>

+ 166 - 92
src/views/userManagement/groupManagement/messageDialog/departmentNew.vue

@@ -1,56 +1,73 @@
 <template>
-    <div class="info">
-        <el-tabs>
-            <el-tab-pane style="height: 40px; padding: 10px; text-align: left; margin-left:10px; font-size: 16px;">新建部门
-                <span><i class="el-icon-close" @click="close"></i></span>
-            </el-tab-pane>
-        </el-tabs>
-        <div style="display: flex;">
-            <img class="img" src="" alt=""><span><el-button style="width: 60px; margin-left: -160px;
-            margin-top: 60px; background-color:rgb(131, 208, 243);">更换</el-button></span>
-        </div>
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="部门级别:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="上级部门:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="部门名称:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="排重名:">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="部门负责人:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="部门接口人:">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="在岗人数:">
-                    <el-input-number v-model="num" @change="handleChange" :min="1" :max="100"></el-input-number>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="部门职责:">
-                    <el-input type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
-                        show-word-limit></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div style="margin-top: 30px;">
-            <el-button style="background-color:rgb(131, 208, 243);">下一个</el-button>
-            <el-button>重置</el-button>
-            <el-button style="background-color:rgb(131, 208, 243);">更新</el-button>
-        </div>
+    <div>
+        <el-dialog v-dialog-drag style="overflow: hidden;" :title="popTitle" :visible.sync="dialogVisible" width="32%" append-to-body
+        >
+            <el-divider></el-divider>
+            <div>
+                <el-image :src="url"></el-image>
+                <span>
+                    <el-button class="alter">更换</el-button>
+                </span>
+            </div>
+            <div style="height: 400px;">
+                <el-scrollbar style="height: 90%;width: 100%; top: -20px;">
+                    <el-form :model="form" ref="form" label-position="left">
+                        <el-form-item label="部门级别:" prop="department_level">
+                            <el-select v-model="form.department_level">
+                                <el-option v-for="item in levelOptions" :value="item.value" :key="item.value"
+                                    :label="item.label"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="上级部门:" prop="superior_department">
+                            <el-select v-model="form.superior_department">
+                                <el-option v-for="item in superiorOptions" :value="item.value" :key="item.value"
+                                    :label="item.label"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="部门负责人:" prop="departmentManager">
+                            <el-select v-model="form.departmentManager">
+                                <el-option v-for="item in managerOptions" :value="item.value" :key="item.value"
+                                    :label="item.label"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="部门接口人:" prop="departmentOfficer">
+                            <el-select v-model="form.departmentOfficer">
+                                <el-option v-for="item in officerOptions" :value="item.value" :key="item.value"
+                                    :label="item.label"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="排重名:" prop="duplication">
+                            <el-input v-model="form.duplication" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="在岗人数:" prop="staff_num">
+                            <el-input-number :model="form.staff_num" v-model="num" @change="handleChange" :min="1"
+                                :max="100"></el-input-number>
+                        </el-form-item>
+                        <el-form-item label="自由员工:" prop="self_employee">
+                            <el-input v-model="form.self_employee" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="协作员工:" prop="collaborator">
+                            <el-input v-model="form.collaborator" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="第三方员工:" prop="thirdParty_employee">
+                            <el-input v-model="form.thirdParty_employee" type="text"></el-input>
+                        </el-form-item>
+                        <el-form-item label="部门职责:" prop="post">
+                            <el-input type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
+                                show-word-limit></el-input>
+                        </el-form-item>
+                    </el-form>
+                </el-scrollbar>
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button style="background-color: #2EA8E6;
+                                        color: #FFFFFF; margin-right: 30px;">下一个</el-button>
+                <el-button style="  background-color: #B3B3B3;
+                                    color: #FFFFFF; margin-right: 30px;" @click="resetForm('form')">重置</el-button>
+                <el-button style="background-color: #2EA8E6;
+                                        color: #FFFFFF;">更新</el-button>
+            </div>
+        </el-dialog>
     </div>
 </template>
 
@@ -58,73 +75,130 @@
 export default {
     data() {
         return {
+            popTitle: '新建部门',
+            dialogVisible: false,
+            url: '',
             form: {
-
+                department_level: '',
+                superior_department: '',
+                departmentManager: '',
+                departmentOfficer: '',
+                duplication: '',
+                staff_num: '',
+                self_employee: '',
+                collaborator: '',
+                thirdParty_employee: '',
+                post: ''
             },
             num: 100,
-            textarea:''
+            textarea: '',
+            levelOptions: [],
+            superiorOptions: [
+                {
+                    value: '0',
+                    label: '北京电信规划设计院'
+                }
+            ],
+            managerOptions: [],
+            officerOptions: [],
         }
     },
     methods: {
-        close() {
+        handleChange() {
 
+        },
+        resetForm() {
+            this.$refs.form.resetFields();
         }
     }
 
 }
 </script>
 <style lang="less" scoped>
-.info {
+/deep/.el-dialog__footer {
+    text-align: center;
+}
+/deep/.el-dialog__body {
+    padding-top: 0;
+}
+/deep/.el-divider--horizontal {
+    display: block;
+    height: 1px;
+    width: 100%;
+    margin: 0 !important;
+}
+.alter {
+    background-color: #2EA8E6;
+    color: #FFFFFF;
+    float: right;
+    position: relative;
+    top: -50px;
+    width: 80px !important;
+}
+
+.el-image {
+    width: 100%;
+    height: 100px;
     margin-top: 10px;
-    margin-left: 300px;
-    left: 350px;
-    width: 600px;
-    height: 750px;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-
-    .img {
-        margin: 15px 50px 0 50px;
-        width: 500px;
-        height: 80px;
-    }
+}
 
 
-    .el-icon-close {
-        margin-left: 480px;
-    }
+.el-icon-close {
+    margin-left: 480px;
+}
 
-    /deep/.el-tabs__header {
-        height: 0;
+/deep/.el-tabs__header {
+    height: 0;
+    margin-bottom: 0;
+}
+
+
+.el-form {
+    padding: 0 5% 0 5%;
+
+    .el-form-item {
+        padding-top: 10px;
+        margin-inline: 20px;
         margin-bottom: 0;
     }
 
+    .el-select {
+        width: 100%;
+    }
 
-    .form {
-        .el-form {
+    .el-input-number {
+        /deep/.el-input-number__decrease {
+            border: 1px solid #DCDFE6;
+            border-radius: 4px;
 
-            .el-form-item {
-                padding-top: 10px;
-                margin-inline: 20px;
-                margin-bottom: 0;
-            }
+        }
 
-            /deep/.el-form-item__label {
-                padding: 0;
-                text-align: left;
-            }
+        /deep/.el-input-number__increase {
+            border: 1px solid #DCDFE6;
+            border-radius: 4px;
+        }
 
-            /deep/.el-form-item__content {
-                display: flex;
-                width: 400px;
-            }
+        /deep/.el-input__inner {
+            border: 0;
+            background: #fff;
         }
     }
 
-    .el-button {
-        width: 100px;
-        height: 30px;
-        padding: 5px;
-        margin: 10px;
+    /deep/.el-form-item__label {
+        padding: 0;
+        text-align: left;
+        font-weight: 550;
+    }
+
+    /deep/.el-form-item__content {
+        display: flex;
     }
 }
+
+.el-button {
+    width: 100px;
+    height: 30px;
+    padding: 5px;
+    margin: 10px;
+}
 </style>

+ 30 - 11
src/views/userManagement/groupManagement/tables/corporationOverview.vue

@@ -1,5 +1,8 @@
 <template>
     <div style="height:100%">
+        <el-button class="addCompany" @click="addCompany" style="color: #fff; background: #3da0d6"><i
+                class="el-icon-s-order"></i>添加公司</el-button>
+                <corporationAdd ref="corporationAdd"></corporationAdd>
         <p class="info">公司总览</p>
         <el-button class="delete" @click="batchDelete">批量删除</el-button>
         <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" :header-cell-style="{ textAlign: 'center' }"
@@ -31,10 +34,11 @@
 </template>
 
 <script>
-import checkbox from '@/components/Checkbox/index'
-import page from '@/components/pagination/index'
+import checkbox from '@/components/Checkbox/index';
+import page from '@/components/pagination/index';
+import corporationAdd from '../messageDialog/corporationAdd';
 export default {
-    components: { checkbox, page },
+    components: { checkbox, page,corporationAdd },
     data() {
         return {
             filterText: '',
@@ -80,7 +84,7 @@ export default {
             //
         }
     },
-    mounted(){
+    mounted() {
         this.initData();
     },
     methods: {
@@ -90,23 +94,29 @@ export default {
         handleSelectionChange(val) {
             this.multipleSelection = val;
         },
-        initData(){
+        initData() {
             this.getTableData(1);
         },
-        getTableData(page){
-            
+        getTableData(page) {
+
         },
-        infoDetail(){
+        infoDetail() {
 
         },
-        infoEdit(){
+        infoEdit() {
 
         },
-        deleteInfo(){
+        deleteInfo() {
 
         },
-        batchDelete(){
+        batchDelete() {
 
+        },
+        addCompany(){
+            this.$refs.corporationAdd.dialogVisible = true;
+            setTimeout(() => {
+                this.$refs.corporationAdd.resetForm();
+            }, 100)
         }
     }
 }
@@ -187,6 +197,15 @@ export default {
     }
 }
 
+.addCompany {
+    position: absolute;
+    left: 40px;
+    bottom: 15px;
+    width: 250px;
+    text-align: center;
+    font-size: 16px;
+}
+
 .bottom {
     position: absolute;
     right: 16px;

+ 11 - 21
src/views/userManagement/personManagement/messageDialog/addUser.vue

@@ -84,8 +84,10 @@
                 </el-form>
             </div>
             <div slot="footer" class="dialog-footer">
-                <el-button class="reset" @click="resetForm('form')">重置</el-button>
-                <el-button class="update" @click="submitForm('form')">确认</el-button>
+                <el-button style="  background-color: #B3B3B3;
+        color: #FFFFFF;" @click="resetForm('form')">重置</el-button>
+                <el-button style="  background-color: #2EA8E6;
+        color: #FFFFFF;" @click="submitForm('form')">确认</el-button>
             </div>
         </el-dialog>
     </div>
@@ -93,12 +95,10 @@
 
 <script>
 export default {
-    props: {
-        popTitle: String,
-        default: ''
-    },
+
     data() {
         return {
+            popTitle:'用户详情',
             dialogVisible: false,
             select: '',
             form: {
@@ -117,14 +117,14 @@ export default {
                 nationality: '',
                 photograph: require('@/assets/upload/头像上传@3x.png')
             },
-            statusOptions:[
+            statusOptions: [
                 {
-                    value:0,
-                    label:'正常'
+                    value: 0,
+                    label: '正常'
                 },
                 {
-                    value:1,
-                    label:'停用'
+                    value: 1,
+                    label: '停用'
                 }
             ],
             rules: {
@@ -168,16 +168,6 @@ export default {
     color: #FFFFFF;
 }
 
-.reset {
-    background-color: #B3B3B3;
-    color: #FFFFFF;
-}
-
-.update {
-    background-color: #2EA8E6;
-    color: #FFFFFF;
-}
-
 .avatar-upload {
     position: absolute;
     right: 40px;

+ 0 - 203
src/views/userManagement/personManagement/tables/table3.vue

@@ -1,203 +0,0 @@
-<template>
-    <div>
-        <el-table :data="tableData" tooltip-effect="dark" :header-cell-style="{ textAlign: 'center' }"
-            :cell-style="{ textAlign: 'center' }" style="width: 100%" border>
-            <el-table-column type="index" width="50" label="序列">
-            </el-table-column>
-            <el-table-column prop="username" label="用户名">
-            </el-table-column>
-            <el-table-column prop="phone" label="手机号">
-            </el-table-column>
-            <el-table-column prop="e_mail" label="邮箱">
-            </el-table-column>
-            <el-table-column prop="role" label="角色">
-            </el-table-column>
-            <el-table-column prop="process" label="进程">
-                <el-progress :percentage="100" :format="format"></el-progress>
-            </el-table-column>
-            <el-table-column prop="status">
-
-            </el-table-column>
-        </el-table>
-        <el-table  border :data="tableData2" tooltip-effect="dark"
-            :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" style="width: 100%"
-            @selection-change="handleSelectionChange">
-            <el-table-column type="selection" width="50">
-            </el-table-column>
-            <el-table-column prop="username" label="用户名">
-            </el-table-column>
-            <el-table-column prop="phone" label="手机号">
-            </el-table-column>
-            <el-table-column prop="e_mail" label="邮箱">
-            </el-table-column>
-            <el-table-column prop="role" label="角色">
-            </el-table-column>
-            <el-table-column prop="permission" label="权限">
-            </el-table-column>
-            <el-table-column prop="working_address" label="单位">
-            </el-table-column>
-            <el-table-column prop="registed_time" label="注册时间">
-            </el-table-column>
-            <el-table-column prop="status" label="状态">
-                <template slot-scope="scope">
-                    <el-tag :color="scope.row.status == true ? '#06f77e' : '#757776'"></el-tag>
-                </template>
-            </el-table-column>
-            <el-table-column prop="operation" label="操作">
-                <el-button size="mini" type="text">查看</el-button>
-                <el-button size="mini" type="text">编辑</el-button>
-                <el-button size="mini" type="text">删除</el-button>
-            </el-table-column>
-        </el-table>
-        <div class="bottom">
-            <div>
-                <checkbox class="checkbox"></checkbox>
-                <el-button class="check-cancel" size="mini" type="text">取消</el-button>
-            </div>
-            <div class="bottom_button">
-                <el-button class="delete">批量删除</el-button>
-                <el-button class="disabled">批量禁用</el-button>
-                <el-dropdown type="primary" @click="handleClick">导出数据
-                    <i class="el-icon-arrow-down el-icon--right"></i>
-                    <el-dropdown-menu slot="dropdown">
-                    </el-dropdown-menu>
-                </el-dropdown>
-            </div>
-            <page class="page"> </page>
-        </div>
-    </div>
-</template>
-
-<script>
-import checkbox from '@/components/Checkbox/index'
-import page from '@/components/pagination/index'
-export default {
-    components: { checkbox, page },
-    data() {
-        return {
-            tableData: [{
-
-            }],
-            tableData2: [{
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: true
-            }, {
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: false
-            }, {
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: true
-            }, {
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: false
-            },],
-            multipleSelection: []
-        }
-    },
-    methods: {
-        format(percentage) {
-            return percentage === 100 ? '满' : `${percentage}%`;
-        }
-    }
-}
-</script>
-<style lang="less" scoped>
-.el-table {
-    margin-bottom: 25px;
-}
-
-.el-tag {
-    width: 12px;
-    height: 12px;
-    border-radius: 100px;
-    padding: 0;
-}
-
-.bottom {
-    position: absolute;
-    left: 20px;
-    right: 16px;
-    bottom: 20px;
-    height: 50px;
-    line-height: 20px;
-    background-color: rgba(255, 255, 255, 1);
-    text-align: center;
-
-    .checkbox {
-        position: absolute;
-        left: 29px;
-        top: 15px;
-        font-size: 14px;
-    }
-
-    .check-cancel {
-        position: absolute;
-        // line-height: 20px;
-        font-size: 14px;
-        text-align: center;
-        left: 140px;
-        top: 10px;
-    }
-
-    .bottom_button {
-        position: absolute;
-        left: 200px;
-        top: 7px;
-
-        .delete {
-            width: 95px;
-            height: 30px;
-            font-size: 14px;
-            text-align: center;
-            padding: 1px;
-        }
-
-        .disabled {
-            width: 95px;
-            height: 30px;
-            font-size: 14px;
-            text-align: center;
-            padding: 1px;
-        }
-
-        .el-dropdown {
-            margin-left: 15px;
-
-            /deep/.el-button--primary {
-                height: 30px;
-                //background-color: rgba(255, 255, 255, 1);
-            }
-        }
-    }
-
-    .page {
-        position: absolute;
-        top: -10px;
-        right: 30px;
-    }
-}
-</style>

+ 0 - 203
src/views/userManagement/personManagement/tables/table4.vue

@@ -1,203 +0,0 @@
-<template>
-    <div>
-        <el-table :data="tableData" tooltip-effect="dark" :header-cell-style="{ textAlign: 'center' }"
-            :cell-style="{ textAlign: 'center' }" style="width: 100%" border>
-            <el-table-column type="index" width="50" label="序列">
-            </el-table-column>
-            <el-table-column prop="username" label="用户名">
-            </el-table-column>
-            <el-table-column prop="phone" label="手机号">
-            </el-table-column>
-            <el-table-column prop="e_mail" label="邮箱">
-            </el-table-column>
-            <el-table-column prop="role" label="角色">
-            </el-table-column>
-            <el-table-column prop="process" label="进程">
-                <el-progress :percentage="100" :format="format"></el-progress>
-            </el-table-column>
-            <el-table-column prop="status">
-
-            </el-table-column>
-        </el-table>
-        <el-table border :data="tableData2" tooltip-effect="dark"
-            :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" style="width: 100%"
-            @selection-change="handleSelectionChange">
-            <el-table-column type="selection" width="50">
-            </el-table-column>
-            <el-table-column prop="username" label="用户名">
-            </el-table-column>
-            <el-table-column prop="phone" label="手机号">
-            </el-table-column>
-            <el-table-column prop="e_mail" label="邮箱">
-            </el-table-column>
-            <el-table-column prop="role" label="角色">
-            </el-table-column>
-            <el-table-column prop="permission" label="权限">
-            </el-table-column>
-            <el-table-column prop="working_address" label="单位">
-            </el-table-column>
-            <el-table-column prop="registed_time" label="注册时间">
-            </el-table-column>
-            <el-table-column prop="status" label="状态">
-                <template slot-scope="scope">
-                    <el-tag :color="scope.row.status == true ? '#06f77e' : '#757776'"></el-tag>
-                </template>
-            </el-table-column>
-            <el-table-column prop="operation" label="操作">
-                <el-button size="mini" type="text">查看</el-button>
-                <el-button size="mini" type="text">编辑</el-button>
-                <el-button size="mini" type="text">删除</el-button>
-            </el-table-column>
-        </el-table>
-        <div class="bottom">
-            <div>
-                <checkbox class="checkbox"></checkbox>
-                <el-button class="check-cancel" size="mini" type="text">取消</el-button>
-            </div>
-            <div class="bottom_button">
-                <el-button class="delete">批量删除</el-button>
-                <el-button class="disabled">批量激活</el-button>
-                <el-dropdown type="primary" @click="handleClick">导出数据
-                    <i class="el-icon-arrow-down el-icon--right"></i>
-                    <el-dropdown-menu slot="dropdown">
-                    </el-dropdown-menu>
-                </el-dropdown>
-            </div>
-            <page class="page"> </page>
-        </div>
-    </div>
-</template>
-
-<script >
-import checkbox from '@/components/Checkbox/index'
-import page from '@/components/pagination/index'
-export default {
-    components: { checkbox, page },
-    data() {
-        return {
-            tableData: [{
-
-            }],
-            tableData2: [{
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: true
-            }, {
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: false
-            }, {
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: true
-            }, {
-                username: 'admin',
-                phone: '12345678901',
-                e_mail: 'admin@xxxx.com',
-                role: '管理员',
-                permission: '1级',
-                working_address: '北京电信规划设计院',
-                registed_time: '2022-08-09  19:00',
-                status: false
-            },],
-            multipleSelection: []
-        }
-    },
-    methods: {
-        format(percentage) {
-            return percentage === 100 ? '满' : `${percentage}%`;
-        }
-    }
-}
-</script>
-<style lang="less" scoped>
-.el-table {
-    margin-bottom: 25px;
-}
-
-.el-tag {
-    width: 12px;
-    height: 12px;
-    border-radius: 100px;
-    padding: 0;
-}
-
-.bottom {
-    position: absolute;
-    left: 20px;
-    right: 16px;
-    bottom: 20px;
-    height: 50px;
-    line-height: 20px;
-    background-color: rgba(255, 255, 255, 1);
-    text-align: center;
-
-    .checkbox {
-        position: absolute;
-        left: 29px;
-        top: 15px;
-        font-size: 14px;
-    }
-
-    .check-cancel {
-        position: absolute;
-        // line-height: 20px;
-        font-size: 14px;
-        text-align: center;
-        left: 140px;
-        top: 10px;
-    }
-
-    .bottom_button {
-        position: absolute;
-        left: 200px;
-        top: 7px;
-
-        .delete {
-            width: 95px;
-            height: 30px;
-            font-size: 14px;
-            text-align: center;
-            padding: 1px;
-        }
-
-        .disabled {
-            width: 95px;
-            height: 30px;
-            font-size: 14px;
-            text-align: center;
-            padding: 1px;
-        }
-
-        .el-dropdown {
-            margin-left: 15px;
-
-            /deep/.el-button--primary {
-                height: 30px;
-                //background-color: rgba(255, 255, 255, 1);
-            }
-        }
-    }
-
-    .page {
-        position: absolute;
-        top: -10px;
-        right: 30px;
-    }
-}
-</style>